feat: Update gray color palette, set primaryColor to dark, and add default props for ThemeIcon, Title, and Text components.

Author: ciro-maciel

.agent/skills/riligar-design-system/assets/theme.js

@@ -1,42 +1,28 @@
-/**
- * RiLiGar Design System - Mantine 8 Theme
- * Estética minimalista e adaptável (Light/Dark Mode).
- *
- * CENTRALIZAÇÃO TOTAL:
- * Toda a configuração visual (sizes, borders, radius) DEVE estar aqui.
- * O código do componente deve ser limpo.
- */
-
-import { createTheme } from '@mantine/core'
+import { createTheme, rem } from '@mantine/core'
 
 export const theme = createTheme({
     fontFamily: 'Montserrat, -apple-system, BlinkMacSystemFont, "Segoe UI", Roboto, Helvetica, Arial, sans-serif',
 
     colors: {
-        // Escala Baseada nas cores fornecidas
-        // Preto: #34322D
-        // Cinza: #F8F8F8
-        // Branco: #FFFFFF
+        // Escala Neutra Universal (Substitui o gray padrão)
         gray: [
-            '#F8F8F8', // 0: Gray (Background)
-            '#FFFFFF', // 1: White
-            '#EEEEEE', // 2: Light Gray (Borders)
-            '#E0E0E0', // 3: Disabled
-            '#BDBDBD', // 4: Placeholder
-            '#757575', // 5: Text Secondary
-            '#616161', // 6: Text Primary Soft
-            '#424242', // 7: Text Primary
-            '#34322D', // 8: Black (Headers/Deep)
-            '#212121', // 9: Absolute Black
+            '#F9FAFB', // 0: App Background
+            '#F3F4F6', // 1: Hover/Subtle
+            '#E5E7EB', // 2: Borders
+            '#D1D5DB', // 3: Disabled
+            '#9CA3AF', // 4: Placeholder
+            '#6B7280', // 5: Text Secondary
+            '#4B5563', // 6: Text Primary Soft
+            '#374151', // 7: Text Primary
+            '#1F2937', // 8: Headers
+            '#11181C', // 9: Absolute Black
         ],
         // Semânticos neutralizados para manter monochromaticidade total
         error: ['#F9FAFB', '#F3F4F6', '#E5E7EB', '#D1D5DB', '#9CA3AF', '#6B7280', '#4B5563', '#374151', '#1F2937', '#11181C'],
         success: ['#F9FAFB', '#F3F4F6', '#E5E7EB', '#D1D5DB', '#9CA3AF', '#6B7280', '#4B5563', '#374151', '#1F2937', '#11181C'],
     },
 
-    primaryColor: 'gray',
-    black: '#34322D',
-    white: '#FFFFFF',
+    primaryColor: 'dark', // Escala dark mapeada para cinzas
     autoContrast: true,
 
     defaultRadius: 'md', // 6px
@@ -84,7 +70,6 @@ export const theme = createTheme({
                 fw: 500,
                 radius: 'md',
             },
-            // Variações semânticas via theme vars se necessário
         },
         TextInput: {
             defaultProps: {
@@ -93,9 +78,9 @@ export const theme = createTheme({
             },
             styles: theme => ({
                 input: {
-                    border: `1px solid ${theme.colors.gray[2]}`, // Garante borda 1px
+                    border: `1px solid ${theme.colors.gray[2]}`,
                     '&:focus': {
-                        borderColor: theme.colors.gray[5], // Force gray focus
+                        borderColor: theme.colors.dark[8],
                     },
                 },
             }),
@@ -114,5 +99,23 @@ export const theme = createTheme({
                 radius: 'md',
             },
         },
+        ThemeIcon: {
+            defaultProps: {
+                size: 'lg',
+                radius: 'md',
+                variant: 'light',
+                color: 'gray',
+            },
+        },
+        Title: {
+            defaultProps: {
+                lh: 1.2,
+            },
+        },
+        Text: {
+            defaultProps: {
+                lh: 1.6,
+            },
+        },
     },
 })