@matteoaliano/forest-ui 0.3.6 → 0.4.1

package/dist/theme.js

@@ -217,17 +217,6 @@ var misc = {
     950: "#0d2d3a"
   }
 };
-var radiusSharp = {
-  xxs: 1,
-  xs: 2,
-  sm: 3,
-  md: 4,
-  lg: 5,
-  xl: 6,
-  "2xl": 8,
-  "3xl": 10,
-  "4xl": 12
-};
 var base = {
   white: "#ffffff",
   black: "#000000",
@@ -340,7 +329,8 @@ var focusRings = {
   error: "0px 0px 0px 4px #f044383d",
   errorShadowXs: "0px 1px 2px 0px #1018280d, 0px 0px 0px 4px #f044383d"
 };
-var fontFamily = '"Poppins", sans-serif';
+var fontFamily = '"Aeonik", sans-serif';
+var fontFamilyMono = '"Aeonik Mono", monospace';
 var fontSize = {
   xxs: 11,
   xs: 12,
@@ -696,18 +686,6 @@ function buildPalette(tokens) {
     chart: (_a = tokens.chartColors) != null ? _a : chartColors
   };
 }
-var palette = buildPalette({
-  base,
-  error,
-  warning,
-  success,
-  info,
-  text,
-  bg,
-  fg,
-  border,
-  chartColors
-});
 
 // src/theme/typography.ts
 function buildTypography(tokens) {
@@ -791,13 +769,6 @@ function buildTypography(tokens) {
     }
   };
 }
-var typography = buildTypography({
-  fontFamily,
-  display,
-  fontSize,
-  lineHeight,
-  fontWeight
-});
 
 // src/theme/shadows.ts
 function buildShadows(tokens) {
@@ -855,9 +826,6 @@ function buildShadows(tokens) {
     // 24
   ];
 }
-var shadows2 = buildShadows({
-  shadows
-});
 
 // src/theme/components.ts
 function buildComponents(tokens) {
@@ -950,7 +918,11 @@ function buildComponents(tokens) {
     MuiIconButton: {
       styleOverrides: {
         root: {
-          borderRadius: radius5.md
+          borderRadius: radius5.md,
+          padding: 6,
+          "& .MuiSvgIcon-root": {
+            fontSize: 20
+          }
         }
       }
     },
@@ -980,6 +952,15 @@ function buildComponents(tokens) {
         variant: "outlined"
       }
     },
+    MuiFormControl: {
+      styleOverrides: {
+        root: {
+          "&:has(.Mui-disabled)": {
+            opacity: 0.5
+          }
+        }
+      }
+    },
     MuiInputBase: {
       styleOverrides: {
         input: {
@@ -997,20 +978,27 @@ function buildComponents(tokens) {
         root: {
           borderRadius: radius5.md,
           boxShadow: tokenShadows.xs,
-          "&:hover .MuiOutlinedInput-notchedOutline": {
+          "&&:hover:not(.Mui-focused):not(.Mui-disabled) .MuiOutlinedInput-notchedOutline": {
             borderColor: border5.brand
           },
-          "&.Mui-focused .MuiOutlinedInput-notchedOutline": {
+          "&&.Mui-focused .MuiOutlinedInput-notchedOutline": {
             borderColor: border5.brandSolid,
             borderWidth: 1,
             boxShadow: "none"
           },
-          "&.Mui-error .MuiOutlinedInput-notchedOutline": {
+          "&&.Mui-error:not(.Mui-focused) .MuiOutlinedInput-notchedOutline": {
             borderColor: border5.error
           },
-          "&.Mui-error.Mui-focused .MuiOutlinedInput-notchedOutline": {
+          "&&.Mui-error.Mui-focused .MuiOutlinedInput-notchedOutline": {
             borderColor: border5.errorSolid,
             boxShadow: "none"
+          },
+          "& .MuiInputAdornment-root .MuiIconButton-root": {
+            color: fg5.quaternary,
+            "&:hover": {
+              backgroundColor: bg5.primaryHover,
+              color: fg5.brandPrimary
+            }
           }
         },
         notchedOutline: {
@@ -1482,6 +1470,40 @@ function buildComponents(tokens) {
         }
       }
     },
+    // ─── Tabs ──────────────────────────────────────────────────────────
+    MuiTabs: {
+      styleOverrides: {
+        root: {
+          minHeight: 48
+        },
+        indicator: {
+          backgroundColor: fg5.brandPrimary,
+          height: 2
+        }
+      }
+    },
+    MuiTab: {
+      styleOverrides: {
+        root: {
+          minHeight: 48,
+          height: 48,
+          padding: "12px 16px",
+          fontSize: 14,
+          fontWeight: 600,
+          lineHeight: "20px",
+          textTransform: "none",
+          color: text5.tertiary,
+          borderRadius: `${radius5.md}px ${radius5.md}px 0 0`,
+          "&:hover": {
+            backgroundColor: bg5.primaryHover
+          },
+          "&.Mui-selected": {
+            color: fg5.brandPrimary,
+            backgroundColor: bg5.brandPrimary
+          }
+        }
+      }
+    },
     // ─── Chip ───────────────────────────────────────────────────────
     MuiChip: {
       styleOverrides: {
@@ -1502,15 +1524,15 @@ function buildComponents(tokens) {
         },
         colorDefault: {
           "&.MuiChip-filled": {
-            backgroundColor: gray[50],
-            color: gray[700],
-            "& .MuiChip-deleteIcon": { color: gray[400] }
+            backgroundColor: tokens.bg.secondaryHover,
+            color: tokens.fg.secondary,
+            "& .MuiChip-deleteIcon": { color: tokens.fg.quinary }
           }
         },
         colorPrimary: {
           "&.MuiChip-filled": {
             backgroundColor: tokens.bg.brandPrimary,
-            color: tokens.text.brandPrimary,
+            color: tokens.fg.brandPrimary,
             "& .MuiChip-deleteIcon": { color: tokens.fg.brandPrimary }
           }
         },
@@ -1600,13 +1622,16 @@ function buildComponents(tokens) {
       styleOverrides: {
         root: {
           backgroundColor: bg5.secondary,
-          borderBottom: `1px solid ${border5.secondary}`
+          "& .MuiTableRow-root:last-child .MuiTableCell-root": {
+            borderBottom: `1px solid ${border5.secondary}`
+          }
         }
       }
     },
     MuiTableRow: {
       styleOverrides: {
         root: {
+          backgroundColor: bg5.secondary,
           "&:last-child td, &:last-child th": {
             border: 0
           },
@@ -1962,6 +1987,7 @@ function buildComponents(tokens) {
             }
           },
           row: {
+            backgroundColor: bg5.secondary,
             "&:hover": {
               backgroundColor: bg5.primaryHover
             },
@@ -2004,7 +2030,7 @@ function buildComponents(tokens) {
             "& .MuiOutlinedInput-notchedOutline": {
               borderColor: border5.primary
             },
-            "&:hover .MuiOutlinedInput-notchedOutline": {
+            "&:hover:not(:has(.Mui-disabled)) .MuiOutlinedInput-notchedOutline": {
               borderColor: border5.brand
             },
             "& .Mui-focused .MuiOutlinedInput-notchedOutline": {
@@ -2014,7 +2040,6 @@ function buildComponents(tokens) {
             },
             "& .MuiInputAdornment-root .MuiIconButton-root": {
               color: fg5.quaternary,
-              padding: 4,
               "&:hover": {
                 backgroundColor: bg5.primaryHover,
                 color: fg5.brandPrimary
@@ -2166,21 +2191,6 @@ function buildComponents(tokens) {
     }
   };
 }
-var components = buildComponents({
-  base,
-  error,
-  warning,
-  success,
-  info,
-  radius,
-  focusRings,
-  shadows,
-  text,
-  bg,
-  fg,
-  border,
-  buttonColors,
-  sliderColors});
 
 // src/theme/buildTheme.ts
 function buildThemeOptions(tokens) {
@@ -2457,6 +2467,7 @@ var forestExternalPreset = {
         shadows,
         focusRings: focusRings2,
         fontFamily: '"Aeonik", sans-serif',
+        fontFamilyMono: '"Aeonik Mono", monospace',
         fontSize,
         lineHeight,
         fontWeight,
@@ -2597,7 +2608,7 @@ var border3 = {
   tertiary: gray[100],
   disabled: gray[300],
   disabledSubtle: gray[200],
-  brand: colors.brand[300],
+  brand: gray[400],
   brandSolid: colors.brand[600],
   brandSolidAlt: colors.brand[600],
   error: error[300],
@@ -2757,6 +2768,7 @@ var forestAgencyPreset = {
         shadows,
         focusRings: focusRings3,
         fontFamily: '"Aeonik", sans-serif',
+        fontFamilyMono: '"Aeonik Mono", monospace',
         fontSize,
         lineHeight,
         fontWeight,
@@ -3040,6 +3052,7 @@ var forestInternalPreset = {
         shadows,
         focusRings: focusRings4,
         fontFamily: '"Aeonik", sans-serif',
+        fontFamilyMono: '"Aeonik Mono", monospace',
         fontSize,
         lineHeight,
         fontWeight,
@@ -3094,13 +3107,13 @@ exports.buildTheme = buildTheme;
 exports.buildThemeOptions = buildThemeOptions;
 exports.buttonColors = buttonColors;
 exports.chartColors = chartColors;
-exports.components = components;
 exports.container = container;
 exports.display = display;
 exports.error = error;
 exports.fg = fg;
 exports.focusRings = focusRings;
 exports.fontFamily = fontFamily;
+exports.fontFamilyMono = fontFamilyMono;
 exports.fontSize = fontSize;
 exports.fontWeight = fontWeight;
 exports.forestAgencyPreset = forestAgencyPreset;
@@ -3117,18 +3130,15 @@ exports.lineHeight = lineHeight;
 exports.magenta = magenta;
 exports.misc = misc;
 exports.navColors = navColors;
-exports.palette = palette;
 exports.radius = radius;
-exports.radiusSharp = radiusSharp;
 exports.red = red;
 exports.registerPreset = registerPreset;
-exports.shadows = shadows2;
+exports.shadows = shadows;
 exports.sliderColors = sliderColors;
 exports.spacing = spacing;
 exports.success = success;
 exports.text = text;
 exports.toggleColors = toggleColors;
-exports.typography = typography;
 exports.violet = violet;
 exports.warning = warning;
 exports.widths = widths;