feat: type main-info for plateNote

src/components/PlateNote/PlateNote.stories.tsx

@@ -27,7 +27,14 @@ stories.add('simple', () => (
             <Box mt="8px" mb="16px">
                 <PlateNote
                     text="The minimum amount of deposit is 0.1 WEST, the maximum amount of deposit is 500,000 WEST."
-                    textProps={{ color: 'standard.$0' }}
+                    textProps={{ color: 'warning.$500' }}
+                />
+            </Box>
+            Type 'primary-info'
+            <Box mt="8px" mb="16px">
+                <PlateNote
+                    type="primary-info"
+                    text="The minimum amount of deposit is 0.1 WEST, the maximum amount of deposit is 500,000 WEST."
                 />
             </Box>
             Type 'warning'

src/components/PlateNote/PlateNote.tsx

@@ -3,7 +3,7 @@ import { getMainColor } from './helpers';
 import { Flex, TFlexProps } from '../Flex/Flex';
 import { Text, TTextProps } from '../Text/Text';
 
-export type TPlateNoteType = 'info' | 'warning' | 'error';
+export type TPlateNoteType = 'info' | 'warning' | 'error' | 'primary-info';
 
 export type TPlateNote = TFlexProps & {
     type?: TPlateNoteType;
@@ -18,7 +18,7 @@ export const PlateNote: React.FC<TPlateNote> = ({
     children,
     ...rest
 }) => {
-    const mainColor = getMainColor(type);
+    const { mainColor, textColor } = getMainColor(type);
 
     return (
         <Flex
@@ -33,7 +33,7 @@ export const PlateNote: React.FC<TPlateNote> = ({
                 <Text
                     fontSize={14}
                     lineHeight="$20"
-                    color={mainColor}
+                    color={textColor}
                     {...textProps}
                 >
                     {text}

src/components/PlateNote/helpers.ts

@@ -1,15 +1,32 @@
 import { TPlateNoteType } from './PlateNote';
 
-export const getMainColor = (type: TPlateNoteType): string => {
+export const getMainColor = (
+    type: TPlateNoteType
+): { mainColor: string; textColor: string } => {
     switch (type) {
         case 'error': {
-            return 'danger.$300';
+            return {
+                mainColor: 'danger.$300',
+                textColor: 'danger.$300',
+            };
         }
         case 'warning': {
-            return 'warning.$500';
+            return {
+                mainColor: 'warning.$500',
+                textColor: 'warning.$500',
+            };
+        }
+        case 'primary-info': {
+            return {
+                mainColor: 'primary.$300',
+                textColor: 'standard.$0',
+            };
         }
         default: {
-            return 'main.$500';
+            return {
+                mainColor: 'main.$500',
+                textColor: 'main.$500',
+            };
         }
     }
 };