@atipicus/mrs-ui 1.0.2 → 2.0.1

package/dist/index.mjs

@@ -76,7 +76,6 @@ import { T, c, f, a, d, b, e } from "./Table-BrEk_oGh.mjs";
 import MuiTabs from "@mui/material/Tabs";
 import MuiTab from "@mui/material/Tab";
 import { T as T2 } from "./TimePicker-Bt5plyjC.mjs";
-import { T as T3, d as d2, e as e2, c as c2, a as a2, f as f2, b as b2 } from "./Timeline-BPdic0I4.mjs";
 import { LocalizationProvider as LocalizationProvider$1 } from "@mui/x-date-pickers/LocalizationProvider";
 import { AdapterDayjs } from "@mui/x-date-pickers/AdapterDayjs";
 const ComponentAlertLightBorderRadius = "8px";
@@ -151,6 +150,7 @@ const ComponentChipDefaultEnabledBorder = "#bdbdbd";
 const ComponentAvatarBorderRadius = "9999px";
 const ComponentAvatarSmall = "24px";
 const ComponentAvatarMedium = "40px";
+const ComponentAvatarLarge = "56px";
 const ComponentInputLightStandardEnabledBorder = "#0000006b";
 const ComponentInputLightFilledEnabledFill = "#0000000a";
 const ComponentInputLightOutlinedEnabledBorder = "#0000003b";
@@ -161,16 +161,6 @@ const ComponentInputDarkFilledEnabledFill = "#ffffff14";
 const ComponentInputDarkOutlinedEnabledBorder = "#ffffff3b";
 const ComponentRatingActiveFill = "#ffb400";
 const ComponentRatingEnabledBorder = "#0000003b";
-const ComponentSidenavWidthCollapsed = "64px";
-const ComponentSidenavWidthExpanded = "240px";
-const ComponentSidenavLightItemHoverBackground = "#00000014";
-const ComponentSidenavLightItemSelectedBackground = "#0099991f";
-const ComponentSidenavLightItemSelectedForeground = "#00686f";
-const ComponentSidenavLightBorderRadius = "8px";
-const ComponentSidenavDarkItemHoverBackground = "#ffffff14";
-const ComponentSidenavDarkItemSelectedBackground = "#0099993d";
-const ComponentSidenavDarkItemSelectedForeground = "#66b2b2";
-const ComponentSidenavDarkBorderRadius = "8px";
 const ComponentPaperLightElevation0 = "#ffffff";
 const ComponentPaperLightElevation1 = "#ffffff";
 const ComponentPaperLightElevation2 = "#ffffff";
@@ -189,9 +179,69 @@ const ComponentTableDarkBorder = "#ffffff1f";
 const ComponentTableDarkHeaderBackground = "#1e1e1e";
 const ComponentCardLightBorderRadius = "12px";
 const ComponentCardDarkBorderRadius = "12px";
+const PrimitivesColorsBrandVerones = "#00686f";
+const PrimitivesColorsBrandLima = "#99cc00";
 const PrimitivesColorsNeutralWhite = "#ffffff";
+const PrimitivesColorsNeutralBlack = "#000000";
+const PrimitivesColorsNeutralGray50 = "#fafafa";
+const PrimitivesColorsNeutralGray100 = "#f5f5f5";
+const PrimitivesColorsNeutralGray200 = "#eeeeee";
+const PrimitivesColorsNeutralGray300 = "#e0e0e0";
+const PrimitivesColorsNeutralGray400 = "#bdbdbd";
+const PrimitivesColorsNeutralGray500 = "#9e9e9e";
 const PrimitivesColorsNeutralGray600 = "#757575";
+const PrimitivesColorsNeutralGray700 = "#616161";
+const PrimitivesColorsNeutralGray800 = "#424242";
+const PrimitivesColorsNeutralGray900 = "#212121";
+const PrimitivesColorsStatusError50 = "#fdeded";
+const PrimitivesColorsStatusError100 = "#f8b8b8";
+const PrimitivesColorsStatusError500 = "#ab1a1a";
+const PrimitivesColorsStatusError600 = "#8b1515";
+const PrimitivesColorsStatusError700 = "#5f2120";
+const PrimitivesColorsStatusWarning50 = "#fff4e5";
+const PrimitivesColorsStatusWarning500 = "#dfa00a";
+const PrimitivesColorsStatusWarning600 = "#b88308";
+const PrimitivesColorsStatusWarning700 = "#3e2410";
+const PrimitivesColorsStatusInfo50 = "#e5f6fd";
+const PrimitivesColorsStatusInfo100 = "#d1daf0";
+const PrimitivesColorsStatusInfo500 = "#125c87";
+const PrimitivesColorsStatusInfo600 = "#143996";
+const PrimitivesColorsStatusInfo700 = "#014361";
+const PrimitivesColorsStatusInfo800 = "#0c225a";
+const PrimitivesColorsStatusSuccess50 = "#edf7ed";
+const PrimitivesColorsStatusSuccess100 = "#b3d1c7";
+const PrimitivesColorsStatusSuccess500 = "#2e7d32";
+const PrimitivesColorsStatusSuccess600 = "#036642";
+const PrimitivesColorsStatusSuccess700 = "#1e4620";
+const PrimitivesColorsStatusSuccess800 = "#023321";
+const PrimitivesColorsAlphaBlack4 = "#0000000a";
+const PrimitivesColorsAlphaBlack8 = "#00000014";
+const PrimitivesColorsAlphaBlack12 = "#0000001f";
+const PrimitivesColorsAlphaBlack23 = "#0000003b";
+const PrimitivesColorsAlphaBlack26 = "#00000042";
+const PrimitivesColorsAlphaBlack38 = "#00000061";
+const PrimitivesColorsAlphaBlack42 = "#0000006b";
+const PrimitivesColorsAlphaBlack56 = "#0000008f";
+const PrimitivesColorsAlphaBlack60 = "#00000099";
+const PrimitivesColorsAlphaBlack87 = "#000000de";
+const PrimitivesColorsAlphaWhite8 = "#ffffff14";
+const PrimitivesColorsAlphaWhite12 = "#ffffff1f";
+const PrimitivesColorsAlphaWhite16 = "#ffffff29";
+const PrimitivesColorsAlphaWhite23 = "#ffffff3b";
+const PrimitivesColorsAlphaWhite26 = "#ffffff42";
 const PrimitivesColorsAlphaWhite30 = "#ffffff4d";
+const PrimitivesColorsAlphaWhite42 = "#ffffff6b";
+const PrimitivesColorsAlphaWhite50 = "#ffffff80";
+const PrimitivesColorsAlphaWhite70 = "#ffffffb3";
+const PrimitivesColorsAlphaWhite100 = "#ffffff";
+const PrimitivesColorsAlphaPrimary8 = "#00999914";
+const PrimitivesColorsAlphaPrimary12 = "#0099991f";
+const PrimitivesColorsAlphaPrimary16 = "#00999929";
+const PrimitivesColorsAlphaPrimary25 = "#00999940";
+const PrimitivesColorsAlphaPrimary24Dark = "#0099993d";
+const PrimitivesColorsAlphaPrimary32Dark = "#00999952";
+const PrimitivesColorsAlphaPrimary40Dark = "#00999966";
+const PrimitivesColorsSpecialRating = "#ffb400";
 const PrimitivesMotionDurationFast = "100ms";
 const PrimitivesMotionDurationBase = "200ms";
 const PrimitivesMotionDurationModerate = "300ms";
@@ -422,7 +472,7 @@ const shapeTokens = {
   sm: 4,
   md: 8,
   lg: 12,
-  xl: 24,
+  xl: 20,
   rounded: 9999
   // pill shape
 };
@@ -481,7 +531,153 @@ const lightTokens = {
       disabled: SemanticColorLightActionDisabled,
       disabledBackground: SemanticColorLightActionDisabledBackground
     },
-    divider: SemanticColorLightDivider
+    divider: SemanticColorLightDivider,
+    primitives: {
+      brand: {
+        veronesMain: PrimitivesColorsBrandVerones,
+        lima: PrimitivesColorsBrandLima
+      },
+      neutral: {
+        white: PrimitivesColorsNeutralWhite,
+        black: PrimitivesColorsNeutralBlack,
+        gray: {
+          50: PrimitivesColorsNeutralGray50,
+          100: PrimitivesColorsNeutralGray100,
+          200: PrimitivesColorsNeutralGray200,
+          300: PrimitivesColorsNeutralGray300,
+          400: PrimitivesColorsNeutralGray400,
+          500: PrimitivesColorsNeutralGray500,
+          600: PrimitivesColorsNeutralGray600,
+          700: PrimitivesColorsNeutralGray700,
+          800: PrimitivesColorsNeutralGray800,
+          900: PrimitivesColorsNeutralGray900
+        }
+      },
+      status: {
+        error: {
+          50: PrimitivesColorsStatusError50,
+          100: PrimitivesColorsStatusError100,
+          500: PrimitivesColorsStatusError500,
+          600: PrimitivesColorsStatusError600,
+          700: PrimitivesColorsStatusError700
+        },
+        warning: {
+          50: PrimitivesColorsStatusWarning50,
+          500: PrimitivesColorsStatusWarning500,
+          600: PrimitivesColorsStatusWarning600,
+          700: PrimitivesColorsStatusWarning700
+        },
+        info: {
+          50: PrimitivesColorsStatusInfo50,
+          100: PrimitivesColorsStatusInfo100,
+          500: PrimitivesColorsStatusInfo500,
+          600: PrimitivesColorsStatusInfo600,
+          700: PrimitivesColorsStatusInfo700,
+          800: PrimitivesColorsStatusInfo800
+        },
+        success: {
+          50: PrimitivesColorsStatusSuccess50,
+          100: PrimitivesColorsStatusSuccess100,
+          500: PrimitivesColorsStatusSuccess500,
+          600: PrimitivesColorsStatusSuccess600,
+          700: PrimitivesColorsStatusSuccess700,
+          800: PrimitivesColorsStatusSuccess800
+        }
+      },
+      alpha: {
+        black: {
+          4: PrimitivesColorsAlphaBlack4,
+          8: PrimitivesColorsAlphaBlack8,
+          12: PrimitivesColorsAlphaBlack12,
+          23: PrimitivesColorsAlphaBlack23,
+          26: PrimitivesColorsAlphaBlack26,
+          38: PrimitivesColorsAlphaBlack38,
+          42: PrimitivesColorsAlphaBlack42,
+          56: PrimitivesColorsAlphaBlack56,
+          60: PrimitivesColorsAlphaBlack60,
+          87: PrimitivesColorsAlphaBlack87
+        },
+        white: {
+          8: PrimitivesColorsAlphaWhite8,
+          12: PrimitivesColorsAlphaWhite12,
+          16: PrimitivesColorsAlphaWhite16,
+          23: PrimitivesColorsAlphaWhite23,
+          26: PrimitivesColorsAlphaWhite26,
+          30: PrimitivesColorsAlphaWhite30,
+          42: PrimitivesColorsAlphaWhite42,
+          50: PrimitivesColorsAlphaWhite50,
+          70: PrimitivesColorsAlphaWhite70,
+          100: PrimitivesColorsAlphaWhite100
+        },
+        primary: {
+          8: PrimitivesColorsAlphaPrimary8,
+          12: PrimitivesColorsAlphaPrimary12,
+          16: PrimitivesColorsAlphaPrimary16,
+          25: PrimitivesColorsAlphaPrimary25,
+          "24-dark": PrimitivesColorsAlphaPrimary24Dark,
+          "32-dark": PrimitivesColorsAlphaPrimary32Dark,
+          "40-dark": PrimitivesColorsAlphaPrimary40Dark
+        }
+      },
+      special: {
+        rating: PrimitivesColorsSpecialRating
+      }
+    },
+    semantic: {
+      primary: {
+        main: SemanticColorLightPrimaryMain,
+        dark: SemanticColorLightPrimaryDark,
+        light: SemanticColorLightPrimaryLight,
+        contrastText: SemanticColorLightPrimaryContrastText
+      },
+      secondary: {
+        main: SemanticColorLightSecondaryMain,
+        dark: SemanticColorLightSecondaryDark,
+        light: SemanticColorLightSecondaryLight,
+        contrastText: SemanticColorLightSecondaryContrastText
+      },
+      error: {
+        main: SemanticColorLightErrorMain,
+        dark: SemanticColorLightErrorDark,
+        light: SemanticColorLightErrorLight,
+        contrastText: SemanticColorLightErrorContrastText
+      },
+      warning: {
+        main: SemanticColorLightWarningMain,
+        dark: SemanticColorLightWarningDark,
+        light: SemanticColorLightWarningLight,
+        contrastText: SemanticColorLightWarningContrastText
+      },
+      info: {
+        main: SemanticColorLightInfoMain,
+        dark: SemanticColorLightInfoDark,
+        light: SemanticColorLightInfoLight,
+        contrastText: SemanticColorLightInfoContrastText
+      },
+      success: {
+        main: SemanticColorLightSuccessMain,
+        dark: SemanticColorLightSuccessDark,
+        light: SemanticColorLightSuccessLight,
+        contrastText: SemanticColorLightSuccessContrastText
+      },
+      background: {
+        default: SemanticColorLightBackgroundDefault,
+        paper: SemanticColorLightBackgroundPaper
+      },
+      text: {
+        primary: SemanticColorLightTextPrimary,
+        secondary: SemanticColorLightTextSecondary,
+        disabled: SemanticColorLightTextDisabled
+      },
+      action: {
+        active: SemanticColorLightActionActive,
+        hover: SemanticColorLightActionHover,
+        selected: SemanticColorLightActionSelected,
+        disabled: SemanticColorLightActionDisabled,
+        disabledBackground: SemanticColorLightActionDisabledBackground
+      },
+      divider: SemanticColorLightDivider
+    }
   },
   components: {
     alert: {
@@ -757,6 +953,135 @@ const darkTokens = {
     }
   }
 };
+const styleCompositions = {
+  /**
+   * Button style compositions
+   * Used by: MuiButton, MuiFab, MuiToggleButton
+   */
+  button: {
+    /**
+     * Base button styles
+     */
+    base: () => ({
+      fontWeight: typographyTokens.fontWeightSemiBold,
+      textTransform: "none",
+      borderRadius: shapeTokens.md,
+      transition: "all 0.2s ease"
+    }),
+    /**
+     * Button size variants
+     */
+    sizes: {
+      small: {
+        fontSize: "0.8125rem",
+        padding: "4px 10px"
+      },
+      medium: {
+        fontSize: "0.875rem",
+        padding: "6px 16px"
+      },
+      large: {
+        fontSize: "1rem",
+        padding: "8px 22px"
+      }
+    },
+    /**
+     * Button state styles
+     */
+    states: {
+      disabled: () => ({
+        opacity: 0.5,
+        cursor: "not-allowed",
+        pointerEvents: "none"
+      })
+    }
+  },
+  /**
+   * List item style compositions
+   * Used by: MuiListItem, MuiListItemButton
+   */
+  listItem: {
+    /**
+     * Base list item styles
+     */
+    base: () => ({
+      borderRadius: shapeTokens.sm,
+      transition: "all 0.2s ease"
+    }),
+    /**
+     * List item state styles
+     */
+    states: {
+      selected: (theme2) => ({
+        backgroundColor: theme2.palette.action.selected,
+        fontWeight: typographyTokens.fontWeightSemiBold
+      }),
+      hover: (theme2) => ({
+        backgroundColor: theme2.palette.action.hover
+      }),
+      disabled: () => ({
+        opacity: 0.5,
+        cursor: "not-allowed",
+        pointerEvents: "none"
+      })
+    }
+  },
+  /**
+   * Chip style compositions
+   * Used by: MuiChip
+   */
+  chip: {
+    /**
+     * Base chip styles
+     */
+    base: () => ({
+      borderRadius: shapeTokens.rounded,
+      fontWeight: typographyTokens.fontWeightMedium,
+      transition: "all 0.2s ease"
+    }),
+    /**
+     * Chip size variants
+     */
+    sizes: {
+      small: {
+        fontSize: "0.75rem",
+        padding: "4px 8px"
+      },
+      medium: {
+        fontSize: "0.875rem",
+        padding: "6px 12px"
+      }
+    },
+    /**
+     * Chip state styles
+     */
+    states: {
+      disabled: () => ({
+        opacity: 0.5,
+        cursor: "not-allowed"
+      })
+    }
+  },
+  /**
+   * Typography weight shortcuts
+   */
+  typography: {
+    bold: { fontWeight: typographyTokens.fontWeightBold },
+    semiBold: { fontWeight: typographyTokens.fontWeightSemiBold },
+    medium: { fontWeight: typographyTokens.fontWeightMedium },
+    regular: { fontWeight: typographyTokens.fontWeightRegular },
+    light: { fontWeight: typographyTokens.fontWeightLight }
+  },
+  /**
+   * Border radius shortcuts
+   */
+  borderRadius: {
+    small: { borderRadius: shapeTokens.sm },
+    medium: { borderRadius: shapeTokens.md },
+    large: { borderRadius: shapeTokens.lg },
+    rounded: { borderRadius: shapeTokens.rounded }
+  }
+};
 const spacing$1 = (factor) => {
   const baseUnit = 8;
   return baseUnit * factor;
@@ -771,9 +1096,7 @@ const getComponentOverrides = (mode) => {
     // =========================================================================
     MuiCssBaseline: {
       styleOverrides: {
-        body: {
-          fontFamily: typography2.fontFamily
-        },
+        body: {},
         // Apply Nunito font globally
         "*": {
           fontFamily: "inherit"
@@ -789,36 +1112,22 @@ const getComponentOverrides = (mode) => {
       },
       styleOverrides: {
         root: {
-          borderRadius: shape2.md,
-          textTransform: "none",
-          fontWeight: typography2.fontWeightSemiBold,
-          fontFamily: typography2.fontFamily
-        },
-        sizeSmall: {
-          fontSize: "0.8125rem",
-          padding: "4px 10px"
-        },
-        sizeMedium: {
-          fontSize: "0.875rem",
-          padding: "6px 16px"
+          ...styleCompositions.button.base(),
+          textTransform: "none"
         },
-        sizeLarge: {
-          fontSize: "1rem",
-          padding: "8px 22px"
-        }
+        sizeSmall: styleCompositions.button.sizes.small,
+        sizeMedium: styleCompositions.button.sizes.medium,
+        sizeLarge: styleCompositions.button.sizes.large
       }
     },
     MuiIconButton: {
       styleOverrides: {
-        root: {
-          fontFamily: typography2.fontFamily
-        }
+        root: {}
       }
     },
     MuiToggleButton: {
       styleOverrides: {
         root: {
-          fontFamily: typography2.fontFamily,
           textTransform: "none"
         }
       }
@@ -849,16 +1158,13 @@ const getComponentOverrides = (mode) => {
         variant: "outlined"
       },
       styleOverrides: {
-        root: {
-          fontFamily: typography2.fontFamily
-        }
+        root: {}
       }
     },
     MuiOutlinedInput: {
       styleOverrides: {
         root: {
-          fontFamily: typography2.fontFamily,
-          borderRadius: shape2.sm
+          borderRadius: shape2.md
         },
         notchedOutline: {
           borderColor: modeTokens.components.input.outlined.enabledBorder
@@ -868,17 +1174,14 @@ const getComponentOverrides = (mode) => {
     MuiFilledInput: {
       styleOverrides: {
         root: {
-          fontFamily: typography2.fontFamily,
           backgroundColor: modeTokens.components.input.filled.enabledFill,
-          borderRadius: `${shape2.sm}px ${shape2.sm}px 0 0`
+          borderRadius: `${shape2.md}px ${shape2.md}px 0 0`
         }
       }
     },
     MuiInput: {
       styleOverrides: {
-        root: {
-          fontFamily: typography2.fontFamily
-        },
+        root: {},
         underline: {
           "&:before": {
             borderBottomColor: modeTokens.components.input.standard.enabledBorder
@@ -888,23 +1191,17 @@ const getComponentOverrides = (mode) => {
     },
     MuiInputLabel: {
       styleOverrides: {
-        root: {
-          fontFamily: typography2.fontFamily
-        }
+        root: {}
       }
     },
     MuiSelect: {
       styleOverrides: {
-        root: {
-          fontFamily: typography2.fontFamily
-        }
+        root: {}
       }
     },
     MuiAutocomplete: {
       styleOverrides: {
-        root: {
-          fontFamily: typography2.fontFamily
-        }
+        root: {}
       }
     },
     // =========================================================================
@@ -946,8 +1243,7 @@ const getComponentOverrides = (mode) => {
     MuiChip: {
       styleOverrides: {
         root: {
-          fontFamily: typography2.fontFamily,
-          borderRadius: shape2.rounded
+          ...styleCompositions.chip.base()
         },
         outlined: {
           borderColor: modeTokens.components.chip.defaultEnabledBorder
@@ -963,7 +1259,6 @@ const getComponentOverrides = (mode) => {
     MuiAlert: {
       styleOverrides: {
         root: {
-          fontFamily: typography2.fontFamily,
           borderRadius: `${shape2.md}px`
         },
         // Filled variants
@@ -1025,9 +1320,7 @@ const getComponentOverrides = (mode) => {
     },
     MuiSnackbar: {
       styleOverrides: {
-        root: {
-          fontFamily: typography2.fontFamily
-        }
+        root: {}
       }
     },
     // =========================================================================
@@ -1035,9 +1328,7 @@ const getComponentOverrides = (mode) => {
     // =========================================================================
     MuiPaper: {
       styleOverrides: {
-        root: {
-          fontFamily: typography2.fontFamily
-        },
+        root: {},
         rounded: {
           borderRadius: shape2.md
         },
@@ -1055,31 +1346,25 @@ const getComponentOverrides = (mode) => {
     MuiCard: {
       styleOverrides: {
         root: {
-          borderRadius: shape2.lg,
-          fontFamily: typography2.fontFamily
+          borderRadius: shape2.lg
         }
       }
     },
     MuiDialog: {
       styleOverrides: {
         paper: {
-          borderRadius: shape2.lg,
-          fontFamily: typography2.fontFamily
+          borderRadius: shape2.lg
         }
       }
     },
     MuiDrawer: {
       styleOverrides: {
-        paper: {
-          fontFamily: typography2.fontFamily
-        }
+        paper: {}
       }
     },
     MuiAppBar: {
       styleOverrides: {
-        root: {
-          fontFamily: typography2.fontFamily
-        }
+        root: {}
       }
     },
     // =========================================================================
@@ -1087,15 +1372,12 @@ const getComponentOverrides = (mode) => {
     // =========================================================================
     MuiTable: {
       styleOverrides: {
-        root: {
-          fontFamily: typography2.fontFamily
-        }
+        root: {}
       }
     },
     MuiTableCell: {
       styleOverrides: {
         root: {
-          fontFamily: typography2.fontFamily,
           borderBottomColor: modeTokens.components.table.border
         },
         head: {
@@ -1108,40 +1390,35 @@ const getComponentOverrides = (mode) => {
     // =========================================================================
     MuiList: {
       styleOverrides: {
-        root: {
-          fontFamily: typography2.fontFamily
-        }
+        root: {}
       }
     },
     MuiListItem: {
       styleOverrides: {
-        root: {
-          fontFamily: typography2.fontFamily
-        }
+        root: {}
       }
     },
     MuiListItemButton: {
       styleOverrides: {
         root: {
-          fontFamily: typography2.fontFamily,
-          borderRadius: shape2.sm,
+          ...styleCompositions.listItem.base(),
           "&.Mui-selected": {
-            backgroundColor: modeTokens.colors.action.selected
+            backgroundColor: modeTokens.colors.action.selected,
+            fontWeight: typography2.fontWeightSemiBold
           },
           "&.Mui-selected:hover": {
             backgroundColor: modeTokens.colors.action.hover
+          },
+          "&:hover": {
+            backgroundColor: modeTokens.colors.action.hover
           }
         }
       }
     },
     MuiListItemText: {
       styleOverrides: {
-        primary: {
-          fontFamily: typography2.fontFamily
-        },
-        secondary: {
-          fontFamily: typography2.fontFamily
-        }
+        primary: {},
+        secondary: {}
       }
     },
     MuiMenu: {
@@ -1153,9 +1430,7 @@ const getComponentOverrides = (mode) => {
     },
     MuiMenuItem: {
       styleOverrides: {
-        root: {
-          fontFamily: typography2.fontFamily
-        }
+        root: {}
       }
     },
     // =========================================================================
@@ -1163,38 +1438,29 @@ const getComponentOverrides = (mode) => {
     // =========================================================================
     MuiTabs: {
       styleOverrides: {
-        root: {
-          fontFamily: typography2.fontFamily
-        }
+        root: {}
       }
     },
     MuiTab: {
       styleOverrides: {
         root: {
-          fontFamily: typography2.fontFamily,
           textTransform: "none"
         }
       }
     },
     MuiBreadcrumbs: {
       styleOverrides: {
-        root: {
-          fontFamily: typography2.fontFamily
-        }
+        root: {}
       }
     },
     MuiPagination: {
       styleOverrides: {
-        root: {
-          fontFamily: typography2.fontFamily
-        }
+        root: {}
       }
     },
     MuiStepper: {
       styleOverrides: {
-        root: {
-          fontFamily: typography2.fontFamily
-        }
+        root: {}
       }
     },
     // =========================================================================
@@ -1202,16 +1468,12 @@ const getComponentOverrides = (mode) => {
     // =========================================================================
     MuiTypography: {
       styleOverrides: {
-        root: {
-          fontFamily: typography2.fontFamily
-        }
+        root: {}
       }
     },
     MuiLink: {
       styleOverrides: {
-        root: {
-          fontFamily: typography2.fontFamily
-        }
+        root: {}
       }
     },
     // =========================================================================
@@ -1219,23 +1481,17 @@ const getComponentOverrides = (mode) => {
     // =========================================================================
     MuiAvatar: {
       styleOverrides: {
-        root: {
-          fontFamily: typography2.fontFamily
-        }
+        root: {}
       }
     },
     MuiBadge: {
       styleOverrides: {
-        badge: {
-          fontFamily: typography2.fontFamily
-        }
+        badge: {}
       }
     },
     MuiTooltip: {
       styleOverrides: {
-        tooltip: {
-          fontFamily: typography2.fontFamily
-        }
+        tooltip: {}
       }
     },
     MuiDivider: {
@@ -1250,23 +1506,17 @@ const getComponentOverrides = (mode) => {
     // =========================================================================
     MuiFormControlLabel: {
       styleOverrides: {
-        label: {
-          fontFamily: typography2.fontFamily
-        }
+        label: {}
       }
     },
     MuiFormHelperText: {
       styleOverrides: {
-        root: {
-          fontFamily: typography2.fontFamily
-        }
+        root: {}
       }
     },
     MuiFormLabel: {
       styleOverrides: {
-        root: {
-          fontFamily: typography2.fontFamily
-        }
+        root: {}
       }
     },
     // =========================================================================
@@ -1294,6 +1544,8 @@ const lightTheme = createTheme({
     text: lightTokens.colors.text,
     action: lightTokens.colors.action,
     divider: lightTokens.colors.divider,
+    primitives: lightTokens.colors.primitives,
+    semantic: lightTokens.colors.semantic,
     _components: lightTokens.components
   },
   typography: {
@@ -1372,6 +1624,7 @@ const Avatar = React.forwardRef(
     const getSizeToken = () => {
       if (size === 24) return ComponentAvatarSmall;
       if (size === 40) return ComponentAvatarMedium;
+      if (size === 56) return ComponentAvatarLarge;
       return `${size}px`;
     };
     const getFontSize = () => {
@@ -2079,8 +2332,12 @@ const Select = React.forwardRef(
         fullWidth,
         sx: {
           fontFamily: (theme2) => theme2.typography.fontFamily,
+          borderRadius: shapeTokens.lg,
           // Outlined variant specific styles
           ...variant === "outlined" && {
+            "& .MuiOutlinedInput-root": {
+              borderRadius: shapeTokens.lg
+            },
             "& .MuiOutlinedInput-notchedOutline": {
               borderColor: (theme2) => theme2.palette._components?.input?.outlined?.enabledBorder || theme2.palette.divider
             },
@@ -3384,8 +3641,7 @@ const Sidenav = React.forwardRef(
     listSx
   }, ref) => {
     const theme2 = useTheme();
-    const mode = theme2.palette.mode;
-    const sidenavWidth = width ?? (variant === "slim" ? ComponentSidenavWidthCollapsed : ComponentSidenavWidthExpanded);
+    const sidenavWidth = width ?? (variant === "slim" ? 72 : 256);
     const handleItemClick = (item) => {
       if (item.onClick) {
         item.onClick();
@@ -3401,18 +3657,12 @@ const Sidenav = React.forwardRef(
           selected: item.selected,
           onClick: () => handleItemClick(item),
           sx: {
-            borderRadius: mode === "light" ? ComponentSidenavLightBorderRadius : ComponentSidenavDarkBorderRadius,
+            // Note: borderRadius and colors are now defined in theme.ts
+            // MuiListItemButton override via sidenavTokens
             mx: 1,
             px: variant === "slim" ? 1.5 : 2,
             justifyContent: variant === "slim" ? "center" : "flex-start",
-            minHeight: 48,
-            "&.Mui-selected": {
-              backgroundColor: mode === "light" ? ComponentSidenavLightItemSelectedBackground : ComponentSidenavDarkItemSelectedBackground,
-              color: mode === "light" ? ComponentSidenavLightItemSelectedForeground : ComponentSidenavDarkItemSelectedForeground,
-              "&:hover": {
-                backgroundColor: mode === "light" ? ComponentSidenavLightItemHoverBackground : ComponentSidenavDarkItemHoverBackground
-              }
-            }
+            minHeight: 48
           },
           children: [
             item.icon && /* @__PURE__ */ jsx(
@@ -3610,7 +3860,7 @@ const Snackbar = React.forwardRef(
               severity,
               variant,
               icon,
-              onClose: showCloseButton ? (e3) => handleClose(e3) : void 0,
+              onClose: showCloseButton ? (e2) => handleClose(e2) : void 0,
               sx: { width: "100%" },
               children: children || message
             }
@@ -3618,7 +3868,7 @@ const Snackbar = React.forwardRef(
         }
       );
     }
-    const defaultAction = action !== void 0 ? action : /* @__PURE__ */ jsx(IconButton$1, { size: "small", "aria-label": "close", color: "inherit", onClick: (e3) => handleClose(e3), children: /* @__PURE__ */ jsx(MaterialSymbol, { icon: "close", size: "small" }) });
+    const defaultAction = action !== void 0 ? action : /* @__PURE__ */ jsx(IconButton$1, { size: "small", "aria-label": "close", color: "inherit", onClick: (e2) => handleClose(e2), children: /* @__PURE__ */ jsx(MaterialSymbol, { icon: "close", size: "small" }) });
     return /* @__PURE__ */ jsx(
       MuiSnackbar,
       {
@@ -4133,13 +4383,6 @@ export {
   Tabs,
   TextField,
   T2 as TimePicker,
-  T3 as Timeline,
-  d2 as TimelineConnector,
-  e2 as TimelineContent,
-  c2 as TimelineDot,
-  a2 as TimelineItem,
-  f2 as TimelineOppositeContent,
-  b2 as TimelineSeparator,
   Toolbar,
   Tooltip,
   Typography,