@webpros/mui-theme 0.1.6 → 0.2.0

package/dist/src/tokens/ThemeColorTokens.js

@@ -1,172 +1,8 @@
 // Copyright 2025 WebPros International GmbH. All rights reserved.
-import { additionalColors } from './additionalColors';
+import { DarkSchemes, DarkSchemesGenerated, DarkStateLayers, DarkStateLayersGenerated, DarkInverseSchemes, DarkInverseSchemesGenerated, DarkInverseStateLayers, DarkInverseStateLayersGenerated, LightSchemes, LightSchemesGenerated, LightStateLayers, LightStateLayersGenerated, LightInverseSchemes, LightInverseSchemesGenerated, LightInverseStateLayers, LightInverseStateLayersGenerated, } from '../tokens/colors';
+import { LegacyDarkTokensDefault, LegacyLightTokensDefault, } from '../tokens/legacyColors';
 // reference
-// https://www.figma.com/design/RPLeGa2LdhKElQQ0xIXtSh/WebPros-dashboard?node-id=53699-35493&t=pvKyGGnGRUL3kYn8-1
-export const LightTokensDefault = {
-    primary: '#4527A0',
-    onPrimary: '#FFFFFF',
-    primaryContainer: '#E2DFFF',
-    onPrimaryContainer: '#1E1A69',
-    secondary: '#5F6690',
-    onSecondary: '#FFFFFF',
-    secondaryContainer: '#D3D5E3',
-    onSecondaryContainer: '#282B40',
-    tertiary: '#546E7A',
-    onTertiary: '#FFFFFF',
-    tertiaryContainer: '#DAE9F0',
-    onTertiaryContainer: '#11262F',
-    error: '#BA1A1A',
-    onError: '#FFFFFF',
-    errorContainer: '#FFDAD6',
-    onErrorContainer: '#940E0F',
-    errorFixedDim: '#EF5350',
-    primaryFixed: '#E7DFFF',
-    primaryFixedDim: '#D0C0FF',
-    onPrimaryFixed: '#281C4C',
-    onPrimaryFixedVariant: '#4F4178',
-    secondaryFixed: '#E4E5F0',
-    secondaryFixedDim: '#C8CBD9',
-    onSecondaryFixed: '#1A1C2C',
-    onSecondaryFixedVariant: '#454859',
-    tertiaryFixed: '#D6E7EF',
-    tertiaryFixedDim: '#B9DAEA',
-    onTertiaryFixed: '#11262F',
-    onTertiaryFixedVariant: '#3C5560',
-    surface: '#F2F3FA',
-    onSurface: '#1B1C21',
-    surfaceDim: '#CED0E0',
-    surfaceBright: '#EDF0FF',
-    surfaceContainerLowest: '#FFFFFF',
-    surfaceContainerLow: '#E7E9F4',
-    surfaceContainer: '#E4E5F0',
-    surfaceContainerHigh: '#FFFFFF',
-    surfaceContainerHighest: '#DDDFED',
-    surfaceVariant: '#E4E6F0',
-    onSurfaceVariant: '#505263',
-    outline: '#8C8E96',
-    outlineVariant: '#EEEEF1',
-    inverseSurface: '#313036',
-    inverseOnSurface: '#F3EFF7',
-    inversePrimary: '#D0C0FF',
-    shadow: '#000000',
-    scrim: '#000000',
-    surfaceTint: '#5D4D8D',
-    background: '#E9EBF6',
-    onBackground: '#1B1C21',
-    // custom colors
-    info: '#0373CE',
-    onInfo: '#FFFFFF',
-    infoContainer: '#C8E8FF',
-    onInfoContainer: '#094A94',
-    infoFixedDim: '#03A9F4',
-    success: '#2D8731',
-    onSuccess: '#FFFFFF',
-    successContainer: '#CAEFCD',
-    onSuccessContainer: '#0F5C13',
-    successFixedDim: '#4CAF50',
-    warning: '#C75300',
-    onWarning: '#FFFFFF',
-    warningContainer: '#FFE0B2',
-    onWarningContainer: '#892303',
-    warningFixedDim: '#FF9800',
-    undefined: '#90A4AE',
-    onUndefined: '#FFFFFF',
-    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,
-};
+export const LightTokensDefault = Object.assign(Object.assign({}, LegacyLightTokensDefault), { schemes: LightSchemes, stateLayers: LightStateLayers, inverseSchemes: LightInverseSchemes, inverseStateLayers: LightInverseStateLayers, generatedSchemes: LightSchemesGenerated, generatedStateLayers: LightStateLayersGenerated, generatedInverseSchemes: LightInverseSchemesGenerated, generatedInverseStateLayers: LightInverseStateLayersGenerated });
 // reference
 // https://www.figma.com/design/RPLeGa2LdhKElQQ0xIXtSh/WebPros-dashboard?node-id=53699-35493&t=pvKyGGnGRUL3kYn8-1
-export const DarkTokensDefault = {
-    primary: '#B09BEF',
-    onPrimary: '#19132D',
-    primaryContainer: '#4E388E',
-    onPrimaryContainer: '#F9F7FF',
-    secondary: '#9497AC',
-    onSecondary: '#23242A',
-    secondaryContainer: '#464854',
-    onSecondaryContainer: '#EDEEF1',
-    tertiary: '#8FAAB6',
-    onTertiary: '#3B4347',
-    tertiaryContainer: '#325261',
-    onTertiaryContainer: '#EDF0F1',
-    error: '#FA7A9A',
-    onError: '#68182C',
-    errorContainer: '#8C3148',
-    onErrorContainer: '#FFF2F5',
-    errorFixedDim: '#EF5350',
-    primaryFixed: '#E7DFFF',
-    primaryFixedDim: '#D0C0FF',
-    onPrimaryFixed: '#281C4C',
-    onPrimaryFixedVariant: '#4F4178',
-    secondaryFixed: '#E4E5F0',
-    secondaryFixedDim: '#C8CBD9',
-    onSecondaryFixed: '#1A1C2C',
-    onSecondaryFixedVariant: '#454859',
-    tertiaryFixed: '#D6E7EF',
-    tertiaryFixedDim: '#B9DAEA',
-    onTertiaryFixed: '#11262F',
-    onTertiaryFixedVariant: '#3C5560',
-    surface: '#222326',
-    onSurface: '#E5E7F3',
-    surfaceDim: '#131418',
-    surfaceBright: '#38393F',
-    surfaceContainerLowest: '#31323A',
-    surfaceContainerLow: '#25262C',
-    surfaceContainer: '#202126',
-    surfaceContainerHigh: '#1A1B20',
-    surfaceContainerHighest: '#16171A',
-    surfaceVariant: '#2B2C31',
-    onSurfaceVariant: '#AFB3C5',
-    outline: '#7F8293',
-    outlineVariant: '#454652',
-    inverseSurface: '#D9DBE4',
-    inverseOnSurface: '#222326',
-    inversePrimary: '#644EA5',
-    shadow: '#000000',
-    scrim: '#000000',
-    surfaceTint: '#9E8DD3',
-    background: '#151517',
-    onBackground: '#E2E4EE',
-    // custom colors
-    info: '#5696CE',
-    onInfo: '#0A253A',
-    infoContainer: '#124771',
-    onInfoContainer: '#E0ECF6',
-    infoFixedDim: '#03A9F4',
-    // ok
-    success: '#6EBB72',
-    onSuccess: '#0C440F',
-    successContainer: '#125F16',
-    onSuccessContainer: '#F1FDF1',
-    successFixedDim: '#4CAF50',
-    warning: '#DC8A4F',
-    onWarning: '#4E2305',
-    warningContainer: '#7B3C0F',
-    onWarningContainer: '#FAF0E9',
-    warningFixedDim: '#FF9800',
-    // ok
-    undefined: '#9BABB3',
-    onUndefined: '#2A3438',
-    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,
-};
+export const DarkTokensDefault = Object.assign(Object.assign({}, LegacyDarkTokensDefault), { schemes: DarkSchemes, stateLayers: DarkStateLayers, inverseSchemes: DarkInverseSchemes, inverseStateLayers: DarkInverseStateLayers, generatedSchemes: DarkSchemesGenerated, generatedStateLayers: DarkStateLayersGenerated, generatedInverseSchemes: DarkInverseSchemesGenerated, generatedInverseStateLayers: DarkInverseStateLayersGenerated });

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

@@ -1,12 +1,9 @@
 import { ThemeColorTokens } from './ThemeColorTokens';
-import { TonalPalette } from './TonalPalette';
 export type ThemeScheme = {
-    tones: TonalPalette;
     light: ThemeColorTokens;
     dark: ThemeColorTokens;
 };
 export declare const ThemeSchemeDefault: {
-    tones: TonalPalette;
     light: ThemeColorTokens;
     dark: ThemeColorTokens;
 };

package/dist/src/tokens/ThemeScheme.js

@@ -1,8 +1,6 @@
 // Copyright 2025 WebPros International GmbH. All rights reserved.
 import { DarkTokensDefault, LightTokensDefault } from './ThemeColorTokens';
-import { TonalPaletteDefault } from './TonalPalette';
 export const ThemeSchemeDefault = {
-    tones: TonalPaletteDefault,
     light: LightTokensDefault,
     dark: DarkTokensDefault,
 };

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

@@ -0,0 +1,16 @@
+import { Schemes } from './schemes';
+import { StateLayers } from './stateLayers';
+import { InverseSchemes } from './inverseSchemes';
+import { InverseStateLayers } from './inverseStateLayers';
+import { SchemesGenerated } from './schemes';
+import { StateLayersGenerated } from './stateLayers';
+import { InverseSchemesGenerated } from './inverseSchemes';
+import { InverseStateLayersGenerated } from './inverseStateLayers';
+export declare const DarkSchemes: Schemes;
+export declare const DarkStateLayers: StateLayers;
+export declare const DarkInverseSchemes: InverseSchemes;
+export declare const DarkInverseStateLayers: InverseStateLayers;
+export declare const DarkSchemesGenerated: SchemesGenerated;
+export declare const DarkStateLayersGenerated: StateLayersGenerated;
+export declare const DarkInverseSchemesGenerated: InverseSchemesGenerated;
+export declare const DarkInverseStateLayersGenerated: InverseStateLayersGenerated;