feat(Persona): add style prop (#855)

gravity-ui · Aug 2, 2023 · 5d455e6 · 5d455e6
1 parent 1ee8f3c
commit 5d455e6
Show file tree

Hide file tree

Showing 2 changed files with 9 additions and 1 deletion.
diff --git a/src/components/Persona/Persona.tsx b/src/components/Persona/Persona.tsx
@@ -29,6 +29,7 @@ export interface PersonaProps {
     onClick?: (text: string) => void;
     /** Custom CSS class for root element */
     className?: string;
+    style?: React.CSSProperties;
 }
 
 export function Persona({
@@ -41,6 +42,7 @@ export function Persona({
     text,
     image,
     className,
+    style,
 }: PersonaProps) {
     let avatar: React.ReactNode | null;
 
@@ -65,6 +67,7 @@ export function Persona({
             onClose={onClose && onClose.bind(null, text)}
             avatar={avatar}
             className={className}
+            style={style}
         >
             {text}
         </PersonaWrap>

diff --git a/src/components/PersonaWrap/PersonaWrap.tsx b/src/components/PersonaWrap/PersonaWrap.tsx
@@ -18,6 +18,7 @@ export interface PersonaWrapProps {
     onClose?: (event: React.MouseEvent) => void;
     onClick?: (event: React.MouseEvent) => void;
     className?: string;
+    style?: React.CSSProperties;
 }
 
 export function PersonaWrap({
@@ -29,11 +30,15 @@ export function PersonaWrap({
     className,
     avatar,
     children,
+    style,
 }: PersonaWrapProps) {
     const clickable = Boolean(onClick);
     const closeable = Boolean(onClose);
     return (
-        <div className={b({size, theme, clickable, closeable, empty: isEmpty}, className)}>
+        <div
+            className={b({size, theme, clickable, closeable, empty: isEmpty}, className)}
+            style={style}
+        >
             {/* eslint-disable-next-line jsx-a11y/click-events-have-key-events, jsx-a11y/no-static-element-interactions */}
             <div className={b('main')} onClick={onClick}>
                 {avatar && <div className={b('avatar')}>{avatar}</div>}