@webpros/mui-theme 0.2.0 → 0.3.1

package/dist/src/tokens/colors/Light.js

@@ -319,7 +319,7 @@ export const LightStateLayers = {
             opacity08: 'rgba(33, 110, 172, 0.08)',
             opacity12: 'rgba(33, 110, 172, 0.12)',
             opacity16: 'rgba(33, 110, 172, 0.16)',
-            opacity28: 'rgba(33, 110, 172, 0.2)',
+            opacity28: 'rgba(33, 110, 172, 0.28)',
             opacity48: 'rgba(33, 110, 172, 0.48)',
         },
         success: {
@@ -536,28 +536,28 @@ export const LightStateLayers = {
     },
     stateLayers: {
         basePrimary: {
-            opacity08: 'rgba(255, 255, 255, 0.08)',
-            opacity12: 'rgba(255, 255, 255, 0.12)',
-            opacity16: 'rgba(255, 255, 255, 0.2)',
-            opacity64: 'rgba(255, 255, 255, 0.64)',
+            opacity08: 'rgba(14, 9, 0, 0.08)',
+            opacity12: 'rgba(14, 9, 0, 0.12)',
+            opacity16: 'rgba(14, 9, 0, 0.2)',
+            opacity64: 'rgba(14, 9, 0, 0.64)',
         },
         surfacesOnSurface: {
-            opacity08: 'rgba(255, 255, 255, 0.08)',
-            opacity12: 'rgba(255, 255, 255, 0.12)',
-            opacity16: 'rgba(255, 255, 255, 0.16)',
-            opacity28: 'rgba(255, 255, 255, 0.28)',
-            opacity38: 'rgba(255, 255, 255, 0.38)',
-            opacity48: 'rgba(255, 255, 255, 0.48)',
-            opacity64: 'rgba(255, 255, 255, 0.64)',
-            opacity10: 'rgba(255, 255, 255, 0.1)',
+            opacity08: 'rgba(14, 9, 0, 0.08)',
+            opacity12: 'rgba(14, 9, 0, 0.12)',
+            opacity16: 'rgba(14, 9, 0, 0.16)',
+            opacity28: 'rgba(14, 9, 0, 0.28)',
+            opacity38: 'rgba(14, 9, 0, 0.38)',
+            opacity48: 'rgba(14, 9, 0, 0.48)',
+            opacity64: 'rgba(14, 9, 0, 0.64)',
+            opacity10: 'rgba(14, 9, 0, 0.1)',
         },
         surfacesOnSurfaceVariant: {
-            opacity08: 'rgba(255, 255, 255, 0.08)',
-            opacity12: 'rgba(255, 255, 255, 0.12)',
-            opacity16: 'rgba(255, 255, 255, 0.16)',
-            opacity28: 'rgba(255, 255, 255, 0.28)',
-            opacity48: 'rgba(255, 255, 255, 0.48)',
-            opacity64: 'rgba(255, 255, 255, 0.64)',
+            opacity08: 'rgba(14, 9, 0, 0.08)',
+            opacity12: 'rgba(14, 9, 0, 0.12)',
+            opacity16: 'rgba(14, 9, 0, 0.16)',
+            opacity28: 'rgba(14, 9, 0, 0.28)',
+            opacity48: 'rgba(14, 9, 0, 0.48)',
+            opacity64: 'rgba(14, 9, 0, 0.64)',
         },
     },
 };
@@ -780,6 +780,20 @@ export const LightInverseStateLayers = {
             opacity28: 'rgba(206, 211, 214, 0.28)',
             opacity38: 'rgba(206, 211, 214, 0.38)',
         },
+        info: {
+            opacity08: 'rgba(107, 180, 239, 0.08)',
+            opacity12: 'rgba(107, 180, 239, 0.12)',
+            opacity16: 'rgba(107, 180, 239, 0.2)',
+            opacity28: 'rgba(107, 180, 239, 0.28)',
+            opacity38: 'rgba(107, 180, 239, 0.38)',
+        },
+        warning: {
+            opacity08: 'rgba(222, 144, 66, 0.08)',
+            opacity12: 'rgba(222, 144, 66, 0.12)',
+            opacity16: 'rgba(222, 144, 66, 0.2)',
+            opacity28: 'rgba(222, 144, 66, 0.28)',
+            opacity38: 'rgba(222, 144, 66, 0.38)',
+        },
     },
 };
 export const LightSchemesGenerated = {
@@ -1025,7 +1039,7 @@ export const LightStateLayersGenerated = {
     'stateLayers.status.info.opacity08': { r: 33, g: 110, b: 172, a: 0.08 },
     'stateLayers.status.info.opacity12': { r: 33, g: 110, b: 172, a: 0.12 },
     'stateLayers.status.info.opacity16': { r: 33, g: 110, b: 172, a: 0.16 },
-    'stateLayers.status.info.opacity28': { r: 33, g: 110, b: 172, a: 0.2 },
+    'stateLayers.status.info.opacity28': { r: 33, g: 110, b: 172, a: 0.28 },
     'stateLayers.status.info.opacity48': { r: 33, g: 110, b: 172, a: 0.48 },
     'stateLayers.status.success.opacity08': { r: 67, g: 125, b: 70, a: 0.08 },
     'stateLayers.status.success.opacity12': { r: 67, g: 125, b: 70, a: 0.12 },
@@ -1174,54 +1188,24 @@ export const LightStateLayersGenerated = {
     'stateLayers.surfaces.surfaceDim.opacity12': { r: 206, g: 208, b: 224, a: 0.12 },
     'stateLayers.surfaces.surfaceDim.opacity16': { r: 206, g: 208, b: 224, a: 0.16 },
     'stateLayers.surfaces.surfaceDim.opacity10': { r: 206, g: 208, b: 224, a: 0.1 },
-    'stateLayers.stateLayers.basePrimary.opacity08': { r: 255, g: 255, b: 255, a: 0.08 },
-    'stateLayers.stateLayers.basePrimary.opacity12': { r: 255, g: 255, b: 255, a: 0.12 },
-    'stateLayers.stateLayers.basePrimary.opacity16': { r: 255, g: 255, b: 255, a: 0.2 },
-    'stateLayers.stateLayers.basePrimary.opacity64': { r: 255, g: 255, b: 255, a: 0.64 },
-    'stateLayers.stateLayers.surfacesOnSurface.opacity08': { r: 255, g: 255, b: 255, a: 0.08 },
-    'stateLayers.stateLayers.surfacesOnSurface.opacity12': { r: 255, g: 255, b: 255, a: 0.12 },
-    'stateLayers.stateLayers.surfacesOnSurface.opacity16': { r: 255, g: 255, b: 255, a: 0.16 },
-    'stateLayers.stateLayers.surfacesOnSurface.opacity28': { r: 255, g: 255, b: 255, a: 0.28 },
-    'stateLayers.stateLayers.surfacesOnSurface.opacity38': { r: 255, g: 255, b: 255, a: 0.38 },
-    'stateLayers.stateLayers.surfacesOnSurface.opacity48': { r: 255, g: 255, b: 255, a: 0.48 },
-    'stateLayers.stateLayers.surfacesOnSurface.opacity64': { r: 255, g: 255, b: 255, a: 0.64 },
-    'stateLayers.stateLayers.surfacesOnSurface.opacity10': { r: 255, g: 255, b: 255, a: 0.1 },
-    'stateLayers.stateLayers.surfacesOnSurfaceVariant.opacity08': {
-        r: 255,
-        g: 255,
-        b: 255,
-        a: 0.08,
-    },
-    'stateLayers.stateLayers.surfacesOnSurfaceVariant.opacity12': {
-        r: 255,
-        g: 255,
-        b: 255,
-        a: 0.12,
-    },
-    'stateLayers.stateLayers.surfacesOnSurfaceVariant.opacity16': {
-        r: 255,
-        g: 255,
-        b: 255,
-        a: 0.16,
-    },
-    'stateLayers.stateLayers.surfacesOnSurfaceVariant.opacity28': {
-        r: 255,
-        g: 255,
-        b: 255,
-        a: 0.28,
-    },
-    'stateLayers.stateLayers.surfacesOnSurfaceVariant.opacity48': {
-        r: 255,
-        g: 255,
-        b: 255,
-        a: 0.48,
-    },
-    'stateLayers.stateLayers.surfacesOnSurfaceVariant.opacity64': {
-        r: 255,
-        g: 255,
-        b: 255,
-        a: 0.64,
-    },
+    'stateLayers.stateLayers.basePrimary.opacity08': { r: 14, g: 9, b: 0, a: 0.08 },
+    'stateLayers.stateLayers.basePrimary.opacity12': { r: 14, g: 9, b: 0, a: 0.12 },
+    'stateLayers.stateLayers.basePrimary.opacity16': { r: 14, g: 9, b: 0, a: 0.2 },
+    'stateLayers.stateLayers.basePrimary.opacity64': { r: 14, g: 9, b: 0, a: 0.64 },
+    'stateLayers.stateLayers.surfacesOnSurface.opacity08': { r: 14, g: 9, b: 0, a: 0.08 },
+    'stateLayers.stateLayers.surfacesOnSurface.opacity12': { r: 14, g: 9, b: 0, a: 0.12 },
+    'stateLayers.stateLayers.surfacesOnSurface.opacity16': { r: 14, g: 9, b: 0, a: 0.16 },
+    'stateLayers.stateLayers.surfacesOnSurface.opacity28': { r: 14, g: 9, b: 0, a: 0.28 },
+    'stateLayers.stateLayers.surfacesOnSurface.opacity38': { r: 14, g: 9, b: 0, a: 0.38 },
+    'stateLayers.stateLayers.surfacesOnSurface.opacity48': { r: 14, g: 9, b: 0, a: 0.48 },
+    'stateLayers.stateLayers.surfacesOnSurface.opacity64': { r: 14, g: 9, b: 0, a: 0.64 },
+    'stateLayers.stateLayers.surfacesOnSurface.opacity10': { r: 14, g: 9, b: 0, a: 0.1 },
+    'stateLayers.stateLayers.surfacesOnSurfaceVariant.opacity08': { r: 14, g: 9, b: 0, a: 0.08 },
+    'stateLayers.stateLayers.surfacesOnSurfaceVariant.opacity12': { r: 14, g: 9, b: 0, a: 0.12 },
+    'stateLayers.stateLayers.surfacesOnSurfaceVariant.opacity16': { r: 14, g: 9, b: 0, a: 0.16 },
+    'stateLayers.stateLayers.surfacesOnSurfaceVariant.opacity28': { r: 14, g: 9, b: 0, a: 0.28 },
+    'stateLayers.stateLayers.surfacesOnSurfaceVariant.opacity48': { r: 14, g: 9, b: 0, a: 0.48 },
+    'stateLayers.stateLayers.surfacesOnSurfaceVariant.opacity64': { r: 14, g: 9, b: 0, a: 0.64 },
 };
 export const LightInverseSchemesGenerated = {
     'inverseSchemes.surfaces.surface': { r: 49, g: 48, b: 54, a: 1 },
@@ -1395,4 +1379,14 @@ export const LightInverseStateLayersGenerated = {
     'inverseStateLayers.status.onUndefinedContainer.opacity16': { r: 206, g: 211, b: 214, a: 0.16 },
     'inverseStateLayers.status.onUndefinedContainer.opacity28': { r: 206, g: 211, b: 214, a: 0.28 },
     'inverseStateLayers.status.onUndefinedContainer.opacity38': { r: 206, g: 211, b: 214, a: 0.38 },
+    'inverseStateLayers.status.info.opacity08': { r: 107, g: 180, b: 239, a: 0.08 },
+    'inverseStateLayers.status.info.opacity12': { r: 107, g: 180, b: 239, a: 0.12 },
+    'inverseStateLayers.status.info.opacity16': { r: 107, g: 180, b: 239, a: 0.2 },
+    'inverseStateLayers.status.info.opacity28': { r: 107, g: 180, b: 239, a: 0.28 },
+    'inverseStateLayers.status.info.opacity38': { r: 107, g: 180, b: 239, a: 0.38 },
+    'inverseStateLayers.status.warning.opacity08': { r: 222, g: 144, b: 66, a: 0.08 },
+    'inverseStateLayers.status.warning.opacity12': { r: 222, g: 144, b: 66, a: 0.12 },
+    'inverseStateLayers.status.warning.opacity16': { r: 222, g: 144, b: 66, a: 0.2 },
+    'inverseStateLayers.status.warning.opacity28': { r: 222, g: 144, b: 66, a: 0.28 },
+    'inverseStateLayers.status.warning.opacity38': { r: 222, g: 144, b: 66, a: 0.38 },
 };

package/dist/src/tokens/colors/inverseStateLayers.d.ts

@@ -168,6 +168,20 @@ export type InverseStateLayers = {
             opacity28: string;
             opacity38: string;
         };
+        info: {
+            opacity08: string;
+            opacity12: string;
+            opacity16: string;
+            opacity28: string;
+            opacity38: string;
+        };
+        warning: {
+            opacity08: string;
+            opacity12: string;
+            opacity16: string;
+            opacity28: string;
+            opacity38: string;
+        };
     };
 };
 export type InverseStateLayersKey = `inverseStateLayers.${RecursiveKeyOf<InverseStateLayers>}`;

package/dist/src/tokens/index.d.ts

@@ -1,5 +1,3 @@
-export type { AdditionalColorKey } from './legacyColors/additionalColors';
-export type { AdditionalColorTone } from './legacyColors/Tone';
 export type { TypescaleTypographyVariants } from './typography';
 export { typographyVariants } from './typography';
 export type { M3ShadowLayer, M3ShadowTokenName, M3ShadowTokens } from './shadows';

package/dist/src/tokens/legacyColors/LegacyDark.js

@@ -1,5 +1,4 @@
 // Copyright 2025 WebPros International GmbH. All rights reserved.
-import { additionalColors } from '../../tokens/legacyColors/additionalColors';
 // reference
 // https://www.figma.com/design/RPLeGa2LdhKElQQ0xIXtSh/WebPros-dashboard?node-id=53699-35493&t=pvKyGGnGRUL3kYn8-1
 export const LegacyDarkTokensDefault = {
@@ -76,13 +75,4 @@ export const LegacyDarkTokensDefault = {
     undefinedContainer: '#3D464D',
     onUndefinedContainer: '#E4EBF0',
     supportive: '#8FAAB6',
-    // Custom accent colors matching with the theme.
-    // Should not be used in MUI components directly (i.e. for setting background/text somewhere) inside customization.
-    // Only for outer usage
-    // reference -
-    // Charts
-    // https://www.figma.com/design/RPLeGa2LdhKElQQ0xIXtSh/WebPros-dashboard?node-id=7648-60043&t=DhlQVfQGF7gEbkuU-0
-    // Colors
-    // https://www.figma.com/design/RPLeGa2LdhKElQQ0xIXtSh/WebPros-dashboard?node-id=7648-60043&t=DhlQVfQGF7gEbkuU-0
-    additionalColors,
 };

package/dist/src/tokens/legacyColors/LegacyLight.js

@@ -1,5 +1,4 @@
 // Copyright 2025 WebPros International GmbH. All rights reserved.
-import { additionalColors } from '../../tokens/legacyColors/additionalColors';
 // reference
 // https://www.figma.com/design/RPLeGa2LdhKElQQ0xIXtSh/WebPros-dashboard?node-id=53699-35493&t=pvKyGGnGRUL3kYn8-1
 export const LegacyLightTokensDefault = {
@@ -74,13 +73,4 @@ export const LegacyLightTokensDefault = {
     undefinedContainer: '#DFE2E4',
     onUndefinedContainer: '#263238',
     supportive: '#546E7A',
-    // Custom accent colors matching with the theme.
-    // Should not be used in MUI components directly (i.e. for setting background/text somewhere) inside customization.
-    // Only for outer usage
-    // reference -
-    // Charts
-    // https://www.figma.com/design/RPLeGa2LdhKElQQ0xIXtSh/WebPros-dashboard?node-id=7648-60043&t=DhlQVfQGF7gEbkuU-0
-    // Colors
-    // https://www.figma.com/design/RPLeGa2LdhKElQQ0xIXtSh/WebPros-dashboard?node-id=7648-60043&t=DhlQVfQGF7gEbkuU-0
-    additionalColors,
 };

package/dist/src/tokens/legacyColors/ThemeColorTokensLegacy.d.ts

@@ -1,4 +1,3 @@
-import { AdditionalColors } from '../../tokens/legacyColors/additionalColors/additionalColors';
 export type ThemeColorTokensLegacy = {
     primary: string;
     onPrimary: string;
@@ -70,5 +69,4 @@ export type ThemeColorTokensLegacy = {
     undefinedContainer: string;
     onUndefinedContainer: string;
     supportive: string;
-    additionalColors: AdditionalColors;
 };

package/dist/src/tokens/legacyColors/Tone.d.ts

@@ -156,19 +156,3 @@ export declare const ErrorDefault: {
     '99': string;
     '100': string;
 };
-export type AdditionalColorTone = {
-    50: string;
-    100: string;
-    200: string;
-    300: string;
-    400: string;
-    500: string;
-    600: string;
-    700: string;
-    800: string;
-    900: string;
-    A100: string;
-    A200: string;
-    A400: string;
-    A700: string;
-};

package/dist/src/utils/createIcon.d.ts

@@ -0,0 +1,12 @@
+import { Icon, IconWeight, IconProps } from '@phosphor-icons/react';
+import { SxProps, Theme } from '@mui/material/styles';
+type MuiColorToken = 'inherit' | 'primary' | 'secondary' | 'error' | 'warning' | 'info' | 'success' | 'action' | 'disabled';
+export type CustomIconProps = Omit<IconProps, 'color'> & {
+    color?: string | MuiColorToken;
+    sx?: SxProps<Theme>;
+};
+export type CustomIcon = Icon;
+type WeightPaths = Partial<Record<IconWeight, string>>;
+export declare function createStaticIcon(displayName: string, svg: string): CustomIcon;
+export declare function createIcon(displayName: string, svgOrPath: string | WeightPaths): CustomIcon;
+export {};

package/dist/src/utils/createIcon.js

@@ -0,0 +1,94 @@
+import { __rest } from "tslib";
+import { jsx as _jsx } from "react/jsx-runtime";
+// Copyright 2025 WebPros International GmbH. All rights reserved.
+import { forwardRef } from 'react';
+import { SSRBase } from '@phosphor-icons/react/dist/ssr';
+import { styled } from '@mui/material/styles';
+import Box from '@mui/material/Box';
+function extractPath(svg) {
+    const cleanedSvg = svg.replace(/fill="[^"]*"/g, '');
+    const match = cleanedSvg.match(/d="([^"]+)"/);
+    if (!(match === null || match === void 0 ? void 0 : match[1])) {
+        throw new Error('createIcon: No path found in SVG. Make sure SVG contains a <path d="..."> element.');
+    }
+    return match[1];
+}
+const StyledIconWrapper = styled('span', {
+    shouldForwardProp: (prop) => prop !== 'iconColor',
+})(({ theme, iconColor }) => {
+    if (!iconColor || iconColor === 'inherit') {
+        return { display: 'inline-flex', color: 'inherit' };
+    }
+    const paletteColors = [
+        'primary',
+        'secondary',
+        'error',
+        'warning',
+        'info',
+        'success',
+    ];
+    if (paletteColors.includes(iconColor)) {
+        return {
+            display: 'inline-flex',
+            color: theme.palette[iconColor].main,
+        };
+    }
+    if (iconColor === 'action') {
+        return { display: 'inline-flex', color: theme.palette.action.active };
+    }
+    if (iconColor === 'disabled') {
+        return { display: 'inline-flex', color: theme.palette.action.disabled };
+    }
+    return { display: 'inline-flex', color: iconColor };
+});
+function extractPathsData(svg) {
+    var _a, _b;
+    const pathRegex = /<path[^>]*d="([^"]+)"[^>]*\/?>/g;
+    const paths = [];
+    let match;
+    while ((match = pathRegex.exec(svg)) !== null) {
+        const fullMatch = match[0];
+        const d = (_a = match[1]) !== null && _a !== void 0 ? _a : '';
+        const fillMatch = fullMatch.match(/fill="([^"]*)"/);
+        const fill = (_b = fillMatch === null || fillMatch === void 0 ? void 0 : fillMatch[1]) !== null && _b !== void 0 ? _b : 'currentColor';
+        paths.push({ d, fill });
+    }
+    return paths;
+}
+export function createStaticIcon(displayName, svg) {
+    const pathsData = extractPathsData(svg);
+    const IconComponent = forwardRef((props, ref) => {
+        const _a = props, { sx, size = 24, variant = 'outline', color } = _a, rest = __rest(_a, ["sx", "size", "variant", "color"]);
+        const paths = pathsData.map((p, i) => {
+            if (variant === 'outline') {
+                if (i === 0) {
+                    return (_jsx("path", { d: p.d, fill: "transparent", stroke: "currentColor", strokeWidth: 8 }, i));
+                }
+                return _jsx("path", { d: p.d, fill: "currentColor" }, i);
+            }
+            return _jsx("path", { d: p.d, fill: p.fill }, i);
+        });
+        return (_jsx(Box, { component: "span", ref: ref, sx: Object.assign({ display: 'inline-flex', verticalAlign: 'middle', width: size, height: size }, sx), children: _jsx(StyledIconWrapper, { iconColor: variant === 'outline' ? color : undefined, children: _jsx("svg", Object.assign({ viewBox: "0 0 256 256", width: "100%", height: "100%" }, rest, { children: paths })) }) }));
+    });
+    IconComponent.displayName = displayName;
+    return IconComponent;
+}
+export function createIcon(displayName, svgOrPath) {
+    const weights = new Map();
+    if (typeof svgOrPath === 'string') {
+        const pathData = svgOrPath.includes('<svg') ? extractPath(svgOrPath) : svgOrPath;
+        weights.set('regular', _jsx("path", { d: pathData }));
+    }
+    else {
+        Object.entries(svgOrPath).forEach(([weight, pathOrSvg]) => {
+            const pathData = pathOrSvg.includes('<svg') ? extractPath(pathOrSvg) : pathOrSvg;
+            weights.set(weight, _jsx("path", { d: pathData }));
+        });
+    }
+    const IconComponent = forwardRef((props, ref) => {
+        const _a = props, { color, sx } = _a, rest = __rest(_a, ["color", "sx"]);
+        return (_jsx(Box, { component: "span", sx: Object.assign({ display: 'inline-flex', verticalAlign: 'middle' }, sx), children: _jsx(StyledIconWrapper, { iconColor: color, children: _jsx(SSRBase, Object.assign({ ref: ref }, rest, { color: "currentColor", weights: weights })) }) }));
+    });
+    IconComponent.displayName = displayName;
+    return IconComponent;
+}

package/dist/src/utils/getMUIComponents.js

@@ -1,4 +1,4 @@
-import { getAccordion, getAccordionSummary, getAccordionDetails, getAlert, getAppBar, getBackdrop, getBadge, getBreadcrumbs, getButton, getCard, getCheckbox, getChip, getCssBaseline, getDivider, getDrawer, getFab, getIconButton, getLink, getList, getListItem, getListItemButton, getListItemIcon, getListItemAvatar, getListSubheader, getMenu, getMenuItem, getPaginationItem, getPaper, getPopover, getSwitch, getTab, getTabs, getTextField, getToggleButton, getToggleButtonGroup, getTooltip, getTypography, getAvatar, getSelect, getInputLabel, getTimePicker, getSnackbar, getCircularProgress, getLinearProgress, getDialog, getDataGrid, getTable, getAutocomplete, getInputBase, getSkeleton, getFormLabel, getOutlinedInput, getFormHelperText, getRadio, } from '../components';
+import { getAccordion, getAccordionSummary, getAccordionDetails, getAlert, getAppBar, getBackdrop, getBadge, getBreadcrumbs, getButton, getCheckbox, getChip, getCssBaseline, getDivider, getDrawer, getFab, getIconButton, getLink, getList, getListItem, getListItemButton, getListItemIcon, getListItemAvatar, getListSubheader, getMenu, getMenuItem, getPaginationItem, getPaper, getPopover, getSwitch, getTab, getTabs, getTextField, getToggleButton, getToggleButtonGroup, getTooltip, getTypography, getAvatar, getSelect, getInputLabel, getTimePicker, getSnackbar, getCircularProgress, getLinearProgress, getDialog, getTable, getAutocomplete, getInputBase, getSkeleton, getFormLabel, getOutlinedInput, getFormHelperText, getRadio, } from '../components';
 export const getMUIComponents = (theme, _mode) => ({
-    components: Object.assign(Object.assign(Object.assign(Object.assign(Object.assign(Object.assign(Object.assign(Object.assign(Object.assign(Object.assign(Object.assign(Object.assign(Object.assign(Object.assign(Object.assign(Object.assign(Object.assign(Object.assign(Object.assign(Object.assign(Object.assign(Object.assign(Object.assign(Object.assign(Object.assign(Object.assign(Object.assign(Object.assign(Object.assign(Object.assign(Object.assign(Object.assign(Object.assign(Object.assign(Object.assign(Object.assign(Object.assign(Object.assign(Object.assign(Object.assign(Object.assign(Object.assign(Object.assign(Object.assign(Object.assign(Object.assign(Object.assign(Object.assign(Object.assign(Object.assign(Object.assign(Object.assign(Object.assign(Object.assign({}, getCssBaseline(theme)), getBackdrop(theme)), getAccordion(theme)), getAccordionSummary(theme)), getAccordionDetails(theme)), getAlert(theme)), getAppBar(theme)), getAvatar(theme)), getBadge(theme)), getBreadcrumbs(theme)), getSelect()), getTimePicker(theme)), getInputLabel()), getButton(theme)), getCard(theme)), getCheckbox(theme)), getChip(theme)), getDivider(theme)), getDrawer(theme)), getFab(theme)), getIconButton(theme)), getLink(theme)), getList(theme)), getListItem(theme)), getListItemButton(theme)), getListItemIcon(theme)), getListItemAvatar(theme)), getListSubheader(theme)), getMenu(theme)), getMenuItem(theme)), getPaginationItem(theme)), getPaper(theme)), getPopover(theme)), getSwitch(theme)), getTab(theme)), getTabs(theme)), getTextField(theme)), getToggleButton(theme)), getToggleButtonGroup(theme)), getTooltip(theme)), getTypography(theme)), getSnackbar(theme)), getCircularProgress(theme)), getLinearProgress(theme)), getDialog(theme)), getDataGrid(theme)), getTable(theme)), getAutocomplete()), getInputBase()), getSkeleton(theme)), getFormLabel()), getOutlinedInput()), getFormHelperText()), getRadio(theme)),
+    components: Object.assign(Object.assign(Object.assign(Object.assign(Object.assign(Object.assign(Object.assign(Object.assign(Object.assign(Object.assign(Object.assign(Object.assign(Object.assign(Object.assign(Object.assign(Object.assign(Object.assign(Object.assign(Object.assign(Object.assign(Object.assign(Object.assign(Object.assign(Object.assign(Object.assign(Object.assign(Object.assign(Object.assign(Object.assign(Object.assign(Object.assign(Object.assign(Object.assign(Object.assign(Object.assign(Object.assign(Object.assign(Object.assign(Object.assign(Object.assign(Object.assign(Object.assign(Object.assign(Object.assign(Object.assign(Object.assign(Object.assign(Object.assign(Object.assign(Object.assign(Object.assign(Object.assign({}, getCssBaseline(theme)), getBackdrop(theme)), getAccordion(theme)), getAccordionSummary(theme)), getAccordionDetails(theme)), getAlert(theme)), getAppBar(theme)), getAvatar(theme)), getBadge(theme)), getBreadcrumbs(theme)), getSelect()), getTimePicker(theme)), getInputLabel()), getButton(theme)), getCheckbox(theme)), getChip(theme)), getDivider(theme)), getDrawer(theme)), getFab(theme)), getIconButton(theme)), getLink(theme)), getList(theme)), getListItem(theme)), getListItemButton(theme)), getListItemIcon(theme)), getListItemAvatar(theme)), getListSubheader(theme)), getMenu(theme)), getMenuItem(theme)), getPaginationItem(theme)), getPaper(theme)), getPopover(theme)), getSwitch(theme)), getTab(theme)), getTabs(theme)), getTextField(theme)), getToggleButton(theme)), getToggleButtonGroup(theme)), getTooltip(theme)), getTypography(theme)), getSnackbar(theme)), getCircularProgress(theme)), getLinearProgress(theme)), getDialog(theme)), getTable(theme)), getAutocomplete()), getInputBase()), getSkeleton(theme)), getFormLabel()), getOutlinedInput()), getFormHelperText()), getRadio(theme)),
 });

package/dist/src/utils/getMUIPalette.d.ts

@@ -1,94 +1,25 @@
-import { ThemeOptions } from '@mui/material';
+import { PaletteColor, PaletteColorOptions, ThemeOptions } from '@mui/material';
 import { ThemeMode } from '../tokens/ThemeMode';
 import { ThemeScheme } from '../tokens/ThemeScheme';
 import { Schemes, StateLayers } from '../tokens/colors';
-import { AdditionalColorTone } from '../tokens/legacyColors/Tone';
-declare module '@mui/material/styles/createPalette' {
+declare module '@mui/material/styles' {
     interface M3Palette {
         onPrimary: PaletteColor;
-        primaryContainer: PaletteColor;
         onPrimaryContainer: PaletteColor;
         secondary: PaletteColor;
-        onSecondary: PaletteColor;
-        secondaryContainer: PaletteColor;
-        onSecondaryContainer: PaletteColor;
-        tertiary: PaletteColor;
-        onTertiary: PaletteColor;
-        tertiaryContainer: PaletteColor;
-        onTertiaryContainer: PaletteColor;
         onError: PaletteColor;
-        errorContainer: PaletteColor;
-        onErrorContainer: PaletteColor;
-        primaryFixed: PaletteColor;
-        primaryFixedDim: PaletteColor;
-        onPrimaryFixed: PaletteColor;
-        onPrimaryFixedVariant: PaletteColor;
-        secondaryFixed: PaletteColor;
-        secondaryFixedDim: PaletteColor;
-        onSecondaryFixed: PaletteColor;
-        onSecondaryFixedVariant: PaletteColor;
-        tertiaryFixed: PaletteColor;
-        tertiaryFixedDim: PaletteColor;
-        onTertiaryFixed: PaletteColor;
-        onTertiaryFixedVariant: PaletteColor;
         surface: PaletteColor;
         onSurface: PaletteColor;
         surfaceDim: PaletteColor;
-        surfaceBright: PaletteColor;
         surfaceContainerLowest: PaletteColor;
-        surfaceContainerLow: PaletteColor;
         surfaceContainer: PaletteColor;
-        surfaceContainerHigh: PaletteColor;
-        surfaceContainerHighest: PaletteColor;
         onSurfaceVariant: PaletteColor;
-        outline: PaletteColor;
-        outlineVariant: PaletteColor;
-        inversePrimary: PaletteColor;
-        inverseSurface: PaletteColor;
-        inverseOnSurface: PaletteColor;
-        shadow: PaletteColor;
-        scrim: PaletteColor;
-        onBackground: PaletteColor;
-        onInfo: PaletteColor;
-        infoContainer: PaletteColor;
-        onInfoContainer: PaletteColor;
-        onSuccess: PaletteColor;
-        successContainer: PaletteColor;
-        onSuccessContainer: PaletteColor;
-        onWarning: PaletteColor;
-        warningContainer: PaletteColor;
-        onWarningContainer: PaletteColor;
-        undefined: PaletteColor;
-        onUndefined: PaletteColor;
-        undefinedContainer: PaletteColor;
-        onUndefinedContainer: PaletteColor;
         supportive: PaletteColor;
     }
-    interface M3AdditionalColors {
-        red: AdditionalColorTone;
-        pink: AdditionalColorTone;
-        purple: AdditionalColorTone;
-        deepPurple: AdditionalColorTone;
-        indigo: AdditionalColorTone;
-        blue: AdditionalColorTone;
-        lightBlue: AdditionalColorTone;
-        cyan: AdditionalColorTone;
-        teal: AdditionalColorTone;
-        green: AdditionalColorTone;
-        lightGreen: AdditionalColorTone;
-        lime: AdditionalColorTone;
-        yellow: AdditionalColorTone;
-        amber: AdditionalColorTone;
-        orange: AdditionalColorTone;
-        deepOrange: AdditionalColorTone;
-        brown: AdditionalColorTone;
+    interface Palette extends M3Palette {
     }
     interface M3PaletteOptions extends Record<keyof M3Palette, PaletteColorOptions | StateLayers | Schemes> {
         themeMode: string;
-        additional: M3AdditionalColors;
-    }
-    interface Palette extends M3Palette {
-        additional: M3AdditionalColors;
     }
     interface PaletteOptions extends M3PaletteOptions {
     }