feat(components): add variant to Note

trezor · Jan 31, 2025 · 7445765 · 7445765
1 parent 678de31
commit 7445765
Showing 1 changed file with 11 additions and 4 deletions.
diff --git a/packages/components/src/components/Note/Note.tsx b/packages/components/src/components/Note/Note.tsx
@@ -4,21 +4,28 @@ import { spacings } from '@trezor/theme';
 
 import { FrameProps, FramePropsKeys } from '../../utils/frameProps';
 import { Row } from '../Flex/Flex';
-import { Icon, IconName } from '../Icon/Icon';
+import { Icon, IconName, IconVariant } from '../Icon/Icon';
 import { Paragraph } from '../typography/Paragraph/Paragraph';
 
 export const allowedNoteFrameProps = ['margin', 'gap'] as const satisfies FramePropsKeys[];
 type AllowedFrameProps = Pick<FrameProps, (typeof allowedNoteFrameProps)[number]>;
 
 export type NoteProps = AllowedFrameProps & {
     iconName?: IconName;
+    variant?: IconVariant;
     children: ReactNode;
 };
 
-export const Note = ({ children, iconName = 'info', margin, gap = spacings.xxs }: NoteProps) => (
+export const Note = ({
+    children,
+    iconName = 'info',
+    margin,
+    gap = spacings.xxs,
+    variant = 'tertiary',
+}: NoteProps) => (
     <Row gap={gap} margin={margin}>
-        <Icon name={iconName} size={16} variant="tertiary" />
-        <Paragraph typographyStyle="hint" variant="tertiary">
+        <Icon name={iconName} size={16} variant={variant} />
+        <Paragraph typographyStyle="hint" variant={variant}>
             {children}
         </Paragraph>
     </Row>