npm - @granto-umbrella/umbrella-components - Versions diffs - 3.0.51 → 3.0.52 - Mend

@granto-umbrella/umbrella-components 3.0.51 → 3.0.52

This diff represents the content of publicly available package versions that have been released to one of the supported registries. The information contained in this diff is provided for informational purposes only and reflects changes between package versions as they appear in their respective public registries.

Files changed (2) hide show

package/package.json +1 -1
package/src/styles/tokens/colors.ts +601 -296

package/package.json CHANGED Viewed

@@ -1,6 +1,6 @@
 {
   "name": "@granto-umbrella/umbrella-components",
-  "version": "3.0.51",
+  "version": "3.0.52",
   "description": "Umbrella Components for React",
   "type": "module",
   "main": "src/index.js",

package/src/styles/tokens/colors.ts CHANGED Viewed

@@ -1,296 +1,601 @@
-export const primitiveColors = {
-  base: {
-    white: '#ffffff',
-    black: '#000000',
-  },
-  gray: {
-    100: '#f7f7f7',
-    200: '#f0f0f0',
-    300: '#e3e3e3',
-    400: '#cfcfcf',
-    500: '#b7b7b7',
-    600: '#9b9b9b',
-    700: '#7f7f7f',
-    800: '#606060',
-    900: '#464646',
-    1000: '#333333',
-    1100: '#1d1d1d',
-    1200: '#0f0f0f',
-    1300: '#070707',
-  },
-  purple: {
-    100: '#cdb7f4',
-    200: '#b899ee',
-    300: '#a37ce8',
-    400: '#8e5fe0',
-    500: '#7943d9',
-    600: '#662ccb',
-    700: '#5828ac',
-    800: '#492290',
-    900: '#3b1c73',
-    1000: '#2c1557',
-    1100: '#1e0f3b',
-    1200: '#100820',
-    1300: '#020104',
-  },
-  green: {
-    100: '#bef4b7',
-    200: '#a3ee99',
-    300: '#88e87c',
-    400: '#6de05f',
-    500: '#53d943',
-    600: '#3dcb2c',
-    700: '#35ac28',
-    800: '#2b9022',
-    900: '#21731c',
-    1000: '#185715',
-    1100: '#103b0f',
-    1200: '#082008',
-    1300: '#010401',
-  },
-  red: {
-    100: '#f4b7b8',
-    200: '#ee999a',
-    300: '#e87c7d',
-    400: '#e05f60',
-    500: '#d94344',
-    600: '#cb2c2d',
-    700: '#ac2828',
-    800: '#902222',
-    900: '#731c1c',
-    1000: '#571515',
-    1100: '#3b0f0f',
-    1200: '#200808',
-    1300: '#040101',
-  },
-  blue: {
-    100: '#b7c1f4',
-    200: '#99a7ee',
-    300: '#7c8de8',
-    400: '#5f73e0',
-    500: '#435ad9',
-    600: '#2c45cb',
-    700: '#283cac',
-    800: '#223690',
-    900: '#1c2e73',
-    1000: '#152557',
-    1100: '#0f1b3b',
-    1200: '#080f20',
-    1300: '#010204',
-  },
-  orange: {
-    100: '#f4d1b7',
-    200: '#eebd99',
-    300: '#e8aa7c',
-    400: '#e0975f',
-    500: '#d98343',
-    600: '#cb712c',
-    700: '#ac6128',
-    800: '#904f22',
-    900: '#733f1c',
-    1000: '#572e15',
-    1100: '#3b1f0f',
-    1200: '#201008',
-    1300: '#040201',
-  },
-  yellow: {
-    100: '#f4f3b7',
-    200: '#eeed99',
-    300: '#e8e67c',
-    400: '#e0df5f',
-    500: '#d9d843',
-    600: '#cbcb2c',
-    700: '#acac28',
-    800: '#909022',
-    900: '#73731c',
-    1000: '#575715',
-    1100: '#3b3b0f',
-    1200: '#202008',
-    1300: '#040401',
-  },
-};
-export const semanticColors = {
-  base: {
-    background: primitiveColors.base.white,
-    text: primitiveColors.base.black,
-  },
-  neutral: {
-    100: primitiveColors.gray[100],
-    200: primitiveColors.gray[200],
-    300: primitiveColors.gray[300],
-    400: primitiveColors.gray[400],
-    500: primitiveColors.gray[500],
-    600: primitiveColors.gray[600],
-    700: primitiveColors.gray[700],
-  },
-  branding: {
-    surface: {
-      disabled: primitiveColors.purple[100],
-      enabled: primitiveColors.purple[700],
-      hover: primitiveColors.purple[800],
-      pressed: primitiveColors.purple[1000],
-    },
-    border: {
-      disabled: primitiveColors.purple[100],
-      enabled: primitiveColors.purple[700],
-      hover: primitiveColors.purple[800],
-      pressed: primitiveColors.purple[1000],
-    },
-    text: {
-      accent: {
-        disabled: primitiveColors.purple[100],
-        enabled: primitiveColors.purple[700],
-        hover: primitiveColors.purple[800],
-        pressed: primitiveColors.purple[1000],
-      },
-      onSurfaceAccent: {
-        enabled: primitiveColors.base.white,
-      },
-    },
-  },
-  success: {
-    surface: {
-      feedback: primitiveColors.green[100],
-    },
-    text: {
-      feedback: {
-        strong: primitiveColors.green[1100],
-        accent: primitiveColors.green[700],
-      },
-    },
-  },
-  danger: {
-    surface: {
-      enabled: primitiveColors.red[600],
-      hover: primitiveColors.red[700],
-      pressed: primitiveColors.red[900],
-      disabled: primitiveColors.red[100],
-    },
-    text: {
-      enabled: primitiveColors.red[600],
-      hover: primitiveColors.red[700],
-      pressed: primitiveColors.red[900],
-      disabled: primitiveColors.red[100],
-      onSurface: primitiveColors.base.white,
-      feedback: {
-        strong: primitiveColors.red[1100],
-        accent: primitiveColors.red[700],
-      },
-    },
-    border: {
-      enabled: primitiveColors.red[600],
-      hover: primitiveColors.red[700],
-      pressed: primitiveColors.red[900],
-      disabled: primitiveColors.red[100],
-    },
-  },
-  warning: {
-    surface: {
-      feedback: primitiveColors.yellow[100],
-      pills: {
-        supply: primitiveColors.orange[200],
-      },
-    },
-    text: {
-      feedback: {
-        strong: primitiveColors.yellow[1100],
-      },
-      pills: {
-        supply: primitiveColors.orange[1000],
-      },
-    },
-  },
-  border: {
-    feedback: primitiveColors.yellow[900],
-  },
-  info: {
-    surface: {
-      feedback: primitiveColors.blue[100],
-      pills: {
-        tradicional: primitiveColors.blue[100],
-      },
-    },
-    text: {
-      feedback: {
-        strong: primitiveColors.blue[1100],
-      },
-      pills: {
-        tradicional: primitiveColors.blue[1000],
-      },
-    },
-    border: {
-      feedback: primitiveColors.blue[900],
-    },
-  },
-  global: {
-    foreground: {
-      default: primitiveColors.gray[100],
-    },
-    surface: {
-      default: primitiveColors.base.white,
-      overlay: 'rgba(0, 0, 0, 0.5)',
-      disabled: primitiveColors.gray[200],
-      danger: {
-        enabled: primitiveColors.red[600],
-        hover: primitiveColors.red[700],
-        pressed: primitiveColors.red[900],
-        disabled: primitiveColors.red[100],
-      },
-      status: {
-        online: primitiveColors.green[600],
-        notification: primitiveColors.red[600],
-        offline: primitiveColors.gray[600],
-      },
-    },
-    status: {
-      online: primitiveColors.green[600],
-      notification: primitiveColors.red[600],
-      offline: primitiveColors.gray[600],
-    },
-    text: {
-      default: {
-        enabled: primitiveColors.base.black,
-      },
-      onSurface: {
-        subtitle: primitiveColors.gray[500],
-        enabled: primitiveColors.gray[800],
-      },
-      subtitle: {
-        enabled: primitiveColors.gray[700],
-      },
-      feedback: {
-        error: primitiveColors.red[100],
-        info: primitiveColors.blue[100],
-        success: primitiveColors.green[100],
-        warning: primitiveColors.yellow[100],
-        strong: {
-          error: primitiveColors.red[1100],
-          info: primitiveColors.blue[1100],
-          success: primitiveColors.green[1100],
-          warning: primitiveColors.yellow[1100],
-        },
-      },
-    },
-    border: {
-      default: primitiveColors.gray[200],
-      medium: primitiveColors.gray[400],
-      strong: primitiveColors.gray[700],
-      disabled: primitiveColors.gray[300],
-      feedback: {
-        error: primitiveColors.red[900],
-        info: primitiveColors.blue[900],
-        success: primitiveColors.green[900],
-        warning: primitiveColors.yellow[900],
-      },
-      danger: {
-        enabled: primitiveColors.red[600],
-        hover: primitiveColors.red[700],
-        pressed: primitiveColors.red[900],
-        disabled: primitiveColors.red[100],
-      },
-    },
-  },
-};
+export const primitiveColors = {
+  base: {
+    white: '#ffffff',
+    black: '#000000',
+  },
+  gray: {
+    100: '#f7f7f7',
+    200: '#f0f0f0',
+    300: '#e3e3e3',
+    400: '#cfcfcf',
+    500: '#b7b7b7',
+    600: '#9b9b9b',
+    700: '#7f7f7f',
+    800: '#606060',
+    900: '#464646',
+    1000: '#333333',
+    1100: '#1d1d1d',
+    1200: '#0f0f0f',
+    1300: '#070707',
+  },
+  purple: {
+    100: '#cdb7f4',
+    200: '#b899ee',
+    300: '#a37ce8',
+    400: '#8e5fe0',
+    500: '#7943d9',
+    600: '#662ccb',
+    700: '#5828ac',
+    800: '#492290',
+    900: '#3b1c73',
+    1000: '#2c1557',
+    1100: '#1e0f3b',
+    1200: '#100820',
+    1300: '#020104',
+  },
+  green: {
+    100: '#bef4b7',
+    200: '#a3ee99',
+    300: '#88e87c',
+    400: '#6de05f',
+    500: '#53d943',
+    600: '#3dcb2c',
+    700: '#35ac28',
+    800: '#2b9022',
+    900: '#21731c',
+    1000: '#185715',
+    1100: '#103b0f',
+    1200: '#082008',
+    1300: '#010401',
+  },
+  red: {
+    100: '#f4b7b8',
+    200: '#ee999a',
+    300: '#e87c7d',
+    400: '#e05f60',
+    500: '#d94344',
+    600: '#cb2c2d',
+    700: '#ac2828',
+    800: '#902222',
+    900: '#731c1c',
+    1000: '#571515',
+    1100: '#3b0f0f',
+    1200: '#200808',
+    1300: '#040101',
+  },
+  blue: {
+    100: '#b7c1f4',
+    200: '#99a7ee',
+    300: '#7c8de8',
+    400: '#5f73e0',
+    500: '#435ad9',
+    600: '#2c45cb',
+    700: '#283cac',
+    800: '#223690',
+    900: '#1c2e73',
+    1000: '#152557',
+    1100: '#0f1b3b',
+    1200: '#080f20',
+    1300: '#010204',
+  },
+  orange: {
+    100: '#f4d1b7',
+    200: '#eebd99',
+    300: '#e8aa7c',
+    400: '#e0975f',
+    500: '#d98343',
+    600: '#cb712c',
+    700: '#ac6128',
+    800: '#904f22',
+    900: '#733f1c',
+    1000: '#572e15',
+    1100: '#3b1f0f',
+    1200: '#201008',
+    1300: '#040201',
+  },
+  yellow: {
+    100: '#f4f3b7',
+    200: '#eeed99',
+    300: '#e8e67c',
+    400: '#e0df5f',
+    500: '#d9d843',
+    600: '#cbcb2c',
+    700: '#acac28',
+    800: '#909022',
+    900: '#73731c',
+    1000: '#575715',
+    1100: '#3b3b0f',
+    1200: '#202008',
+    1300: '#040401',
+  },
+  coral: {
+    100: '#fec8ca',
+    200: '#fda8ab',
+    300: '#fc888c',
+    400: '#fc686d',
+    500: '#fb484e',
+    600: '#fb2c37',
+    700: '#d5252f',
+    800: '#b01f27',
+    900: '#8a181f',
+    1000: '#651217',
+    1100: '#400b0e',
+    1200: '#1f0507',
+    1300: '#050101',
+  },
+  tangerine: {
+    100: '#ffd4b3',
+    200: '#ffbf8c',
+    300: '#ffa966',
+    400: '#ff9440',
+    500: '#ff7f1a',
+    600: '#ff6900',
+    700: '#d95a00',
+    800: '#b34a00',
+    900: '#8c3a00',
+    1000: '#662b00',
+    1100: '#401b00',
+    1200: '#1f0d00',
+    1300: '#050200',
+  },
+  amber: {
+    100: '#ffe2b3',
+    200: '#ffd68c',
+    300: '#ffc966',
+    400: '#febc40',
+    500: '#feaf1a',
+    600: '#fe9900',
+    700: '#d88200',
+    800: '#b26b00',
+    900: '#8c5500',
+    1000: '#663e00',
+    1100: '#402700',
+    1200: '#1f1300',
+    1300: '#050300',
+  },
+  gold: {
+    100: '#fbe8b3',
+    200: '#f9de8c',
+    300: '#f6d366',
+    400: '#f4c940',
+    500: '#f2bf1a',
+    600: '#f1b100',
+    700: '#cd9700',
+    800: '#a87c00',
+    900: '#846200',
+    1000: '#604700',
+    1100: '#3d2d00',
+    1200: '#1e1600',
+    1300: '#050400',
+  },
+  lime: {
+    100: '#d8f2b3',
+    200: '#c6ec8c',
+    300: '#b4e566',
+    400: '#a2df40',
+    500: '#90d81a',
+    600: '#7dcf00',
+    700: '#6ab000',
+    800: '#589100',
+    900: '#457300',
+    1000: '#335400',
+    1100: '#213600',
+    1200: '#101b00',
+    1300: '#030400',
+  },
+  mint: {
+    100: '#b3f2d1',
+    200: '#8cebb9',
+    300: '#66e4a2',
+    400: '#40de8a',
+    500: '#1ad773',
+    600: '#00c951',
+    700: '#00ab45',
+    800: '#008d39',
+    900: '#006f2d',
+    1000: '#005121',
+    1100: '#003315',
+    1200: '#001a0a',
+    1300: '#000402',
+  },
+  emerald: {
+    100: '#b3f0dc',
+    200: '#8ce8cb',
+    300: '#66e0b9',
+    400: '#40d9a8',
+    500: '#1ad197',
+    600: '#00bd7d',
+    700: '#00a16a',
+    800: '#008558',
+    900: '#006945',
+    1000: '#004d32',
+    1100: '#003120',
+    1200: '#001810',
+    1300: '#000403',
+  },
+  teal: {
+    100: '#b3f0e9',
+    200: '#8ce8de',
+    300: '#66e0d3',
+    400: '#40d9c8',
+    500: '#1ad1bd',
+    600: '#00bba7',
+    700: '#009f8e',
+    800: '#008376',
+    900: '#00675d',
+    1000: '#004b44',
+    1100: '#00302b',
+    1200: '#001815',
+    1300: '#000403',
+  },
+  cyan: {
+    100: '#b3ecf7',
+    200: '#8ce3f3',
+    300: '#66d9ee',
+    400: '#40d0ea',
+    500: '#1ac6e5',
+    600: '#00b8db',
+    700: '#009cba',
+    800: '#008199',
+    900: '#006578',
+    1000: '#004a57',
+    1100: '#002f37',
+    1200: '#00171b',
+    1300: '#000405',
+  },
+  // Novas cores adicionadas
+  aqua: {
+    100: '#b7f4e8',
+    200: '#99eedf',
+    300: '#7ce8d5',
+    400: '#5fe0cc',
+    500: '#43d9c2',
+    600: '#0CD2AB',
+    700: '#0ab28f',
+    800: '#089274',
+    900: '#06735a',
+    1000: '#055441',
+    1100: '#033528',
+    1200: '#021a14',
+    1300: '#000403',
+  },
+  crimson: {
+    100: '#f4b7b7',
+    200: '#ee9999',
+    300: '#e87c7c',
+    400: '#e05f5f',
+    500: '#d94343',
+    600: '#A30000',
+    700: '#8a0000',
+    800: '#710000',
+    900: '#590000',
+    1000: '#400000',
+    1100: '#280000',
+    1200: '#140000',
+    1300: '#040000',
+  },
+  forest: {
+    100: '#b7f4c8',
+    200: '#99eeb0',
+    300: '#7ce898',
+    400: '#5fe080',
+    500: '#43d968',
+    600: '#277C32',
+    700: '#21692a',
+    800: '#1b5623',
+    900: '#15441b',
+    1000: '#103114',
+    1100: '#0a1f0c',
+    1200: '#050f06',
+    1300: '#010401',
+  },
+  navy: {
+    100: '#b7cef4',
+    200: '#99b8ee',
+    300: '#7ca2e8',
+    400: '#5f8ce0',
+    500: '#4376d9',
+    600: '#1F5284',
+    700: '#1a456f',
+    800: '#15395b',
+    900: '#102c47',
+    1000: '#0b2033',
+    1100: '#07141f',
+    1200: '#030a10',
+    1300: '#010204',
+  },
+  rust: {
+    100: '#f4c8b7',
+    200: '#eeb099',
+    300: '#e8987c',
+    400: '#e0805f',
+    500: '#d96843',
+    600: '#9D2C07',
+    700: '#852506',
+    800: '#6d1e05',
+    900: '#561704',
+    1000: '#3e1103',
+    1100: '#270a02',
+    1200: '#130501',
+    1300: '#040100',
+  },
+  olive: {
+    100: '#f4f0b7',
+    200: '#eee999',
+    300: '#e8e27c',
+    400: '#e0db5f',
+    500: '#d9d443',
+    600: '#95830F',
+    700: '#7d6f0d',
+    800: '#665b0a',
+    900: '#4e4608',
+    1000: '#373205',
+    1100: '#201e03',
+    1200: '#100f01',
+    1300: '#040400',
+  },
+  grape: {
+    100: '#d1b7f4',
+    200: '#be99ee',
+    300: '#ab7ce8',
+    400: '#985fe0',
+    500: '#8543d9',
+    600: '#5D0F95',
+    700: '#4e0d7d',
+    800: '#400a66',
+    900: '#31084e',
+    1000: '#230537',
+    1100: '#150320',
+    1200: '#0a0110',
+    1300: '#020004',
+  },
+  magenta: {
+    100: '#f4b7f4',
+    200: '#ee99ee',
+    300: '#e87ce8',
+    400: '#e05fe0',
+    500: '#d943d9',
+    600: '#950F95',
+    700: '#7d0d7d',
+    800: '#660a66',
+    900: '#4e084e',
+    1000: '#370537',
+    1100: '#200320',
+    1200: '#100110',
+    1300: '#040004',
+  },
+  ruby: {
+    100: '#f4b7c8',
+    200: '#ee99b0',
+    300: '#e87c98',
+    400: '#e05f80',
+    500: '#d94368',
+    600: '#950F44',
+    700: '#7d0d39',
+    800: '#660a2f',
+    900: '#4e0824',
+    1000: '#370519',
+    1100: '#20030f',
+    1200: '#100107',
+    1300: '#040002',
+  },
+  ocean: {
+    100: '#b7e0f4',
+    200: '#99d3ee',
+    300: '#7cc6e8',
+    400: '#5fb9e0',
+    500: '#43acd9',
+    600: '#0F7E95',
+    700: '#0d6a7d',
+    800: '#0a5766',
+    900: '#08434e',
+    1000: '#053037',
+    1100: '#031d20',
+    1200: '#010e10',
+    1300: '#000304',
+  },
+};
+export const semanticColors = {
+  base: {
+    background: primitiveColors.base.white,
+    text: primitiveColors.base.black,
+  },
+  neutral: {
+    100: primitiveColors.gray[100],
+    200: primitiveColors.gray[200],
+    300: primitiveColors.gray[300],
+    400: primitiveColors.gray[400],
+    500: primitiveColors.gray[500],
+    600: primitiveColors.gray[600],
+    700: primitiveColors.gray[700],
+  },
+  branding: {
+    surface: {
+      disabled: primitiveColors.purple[100],
+      enabled: primitiveColors.purple[700],
+      hover: primitiveColors.purple[800],
+      pressed: primitiveColors.purple[1000],
+    },
+    border: {
+      disabled: primitiveColors.purple[100],
+      enabled: primitiveColors.purple[700],
+      hover: primitiveColors.purple[800],
+      pressed: primitiveColors.purple[1000],
+    },
+    text: {
+      accent: {
+        disabled: primitiveColors.purple[100],
+        enabled: primitiveColors.purple[700],
+        hover: primitiveColors.purple[800],
+        pressed: primitiveColors.purple[1000],
+      },
+      onSurfaceAccent: {
+        enabled: primitiveColors.base.white,
+      },
+    },
+  },
+  success: {
+    surface: {
+      feedback: primitiveColors.green[100],
+    },
+    text: {
+      feedback: {
+        strong: primitiveColors.green[1100],
+        accent: primitiveColors.green[700],
+      },
+    },
+  },
+  danger: {
+    surface: {
+      enabled: primitiveColors.red[600],
+      hover: primitiveColors.red[700],
+      pressed: primitiveColors.red[900],
+      disabled: primitiveColors.red[100],
+    },
+    text: {
+      enabled: primitiveColors.red[600],
+      hover: primitiveColors.red[700],
+      pressed: primitiveColors.red[900],
+      disabled: primitiveColors.red[100],
+      onSurface: primitiveColors.base.white,
+      feedback: {
+        strong: primitiveColors.red[1100],
+        accent: primitiveColors.red[700],
+      },
+    },
+    border: {
+      enabled: primitiveColors.red[600],
+      hover: primitiveColors.red[700],
+      pressed: primitiveColors.red[900],
+      disabled: primitiveColors.red[100],
+    },
+  },
+  warning: {
+    surface: {
+      feedback: primitiveColors.yellow[100],
+      pills: {
+        supply: primitiveColors.orange[200],
+      },
+    },
+    text: {
+      feedback: {
+        strong: primitiveColors.yellow[1100],
+      },
+      pills: {
+        supply: primitiveColors.orange[1000],
+      },
+    },
+  },
+  border: {
+    feedback: primitiveColors.yellow[900],
+  },
+  info: {
+    surface: {
+      feedback: primitiveColors.blue[100],
+      pills: {
+        tradicional: primitiveColors.blue[100],
+      },
+    },
+    text: {
+      feedback: {
+        strong: primitiveColors.blue[1100],
+      },
+      pills: {
+        tradicional: primitiveColors.blue[1000],
+      },
+    },
+    border: {
+      feedback: primitiveColors.blue[900],
+    },
+  },
+  global: {
+    foreground: {
+      default: primitiveColors.gray[100],
+    },
+    surface: {
+      default: primitiveColors.base.white,
+      overlay: 'rgba(0, 0, 0, 0.5)',
+      disabled: primitiveColors.gray[200],
+      danger: {
+        enabled: primitiveColors.red[600],
+        hover: primitiveColors.red[700],
+        pressed: primitiveColors.red[900],
+        disabled: primitiveColors.red[100],
+      },
+      status: {
+        online: primitiveColors.green[600],
+        notification: primitiveColors.red[600],
+        offline: primitiveColors.gray[600],
+      },
+    },
+    status: {
+      online: primitiveColors.green[600],
+      notification: primitiveColors.red[600],
+      offline: primitiveColors.gray[600],
+    },
+    text: {
+      default: {
+        enabled: primitiveColors.base.black,
+      },
+      onSurface: {
+        subtitle: primitiveColors.gray[500],
+        enabled: primitiveColors.gray[800],
+      },
+      subtitle: {
+        enabled: primitiveColors.gray[700],
+      },
+      feedback: {
+        error: primitiveColors.red[100],
+        info: primitiveColors.blue[100],
+        success: primitiveColors.green[100],
+        warning: primitiveColors.yellow[100],
+        strong: {
+          error: primitiveColors.red[1100],
+          info: primitiveColors.blue[1100],
+          success: primitiveColors.green[1100],
+          warning: primitiveColors.yellow[1100],
+        },
+      },
+    },
+    border: {
+      default: primitiveColors.gray[200],
+      medium: primitiveColors.gray[400],
+      strong: primitiveColors.gray[700],
+      disabled: primitiveColors.gray[300],
+      feedback: {
+        error: primitiveColors.red[900],
+        info: primitiveColors.blue[900],
+        success: primitiveColors.green[900],
+        warning: primitiveColors.yellow[900],
+      },
+      danger: {
+        enabled: primitiveColors.red[600],
+        hover: primitiveColors.red[700],
+        pressed: primitiveColors.red[900],
+        disabled: primitiveColors.red[100],
+      },
+    },
+  },
+  category: {
+    coral: primitiveColors.coral[600],
+    tangerine: primitiveColors.tangerine[600],
+    amber: primitiveColors.amber[600],
+    gold: primitiveColors.gold[600],
+    lime: primitiveColors.lime[600],
+    mint: primitiveColors.mint[600],
+    emerald: primitiveColors.emerald[600],
+    teal: primitiveColors.teal[600],
+    cyan: primitiveColors.cyan[600],
+    aqua: primitiveColors.aqua[600],
+    crimson: primitiveColors.crimson[600],
+    forest: primitiveColors.forest[600],
+    navy: primitiveColors.navy[600],
+    rust: primitiveColors.rust[600],
+    olive: primitiveColors.olive[600],
+    grape: primitiveColors.grape[600],
+    magenta: primitiveColors.magenta[600],
+    ruby: primitiveColors.ruby[600],
+    ocean: primitiveColors.ocean[600],
+  },
+};