@e-burgos/tucu-ui 2.0.8 → 2.0.10

package/package.json

@@ -1,7 +1,7 @@
 {
   "name": "@e-burgos/tucu-ui",
   "description": "Tucu UI Library",
-  "version": "2.0.8",
+  "version": "2.0.10",
   "main": "./index.js",
   "module": "./index.mjs",
   "types": "./index.d.ts",

package/themes/components/index.d.ts

@@ -1,2 +1,3 @@
 export * from './theme-provider';
 export * from './settings';
+export * from './theme-background';

package/themes/components/settings/index.d.ts

@@ -2,3 +2,4 @@ export * from './lang-selector';
 export * from './settings-button';
 export * from './settings-drawer';
 export * from './switch-mode';
+export * from './switch-variant';

package/themes/components/settings/switch-variant.d.ts

@@ -0,0 +1,5 @@
+interface SwitchVariantProps {
+    className?: string;
+}
+export declare const SwitchVariant: React.FC<SwitchVariantProps>;
+export default SwitchVariant;

package/themes/components/theme-background.d.ts

@@ -0,0 +1,33 @@
+import { CSSProperties } from 'react';
+import { BackgroundVariant } from '../hooks/use-theme';
+export interface ThemeBackgroundProps {
+    /**
+     * Positioning mode:
+     * - `'fixed'` (default): fullscreen fixed layer behind content. Content is wrapped in z-10.
+     * - `'absolute'`: absolute-positioned layer within parent. No children wrapper.
+     */
+    mode?: 'fixed' | 'absolute';
+    /** Override the variant from the theme store */
+    variant?: BackgroundVariant;
+    /** Override CDN base URL for self-hosted assets */
+    cdnBase?: string;
+    /** Additional CSS class for the background container */
+    className?: string;
+    /** Inline styles for the background container */
+    style?: CSSProperties;
+    /** Content rendered on top of the background (only used in fixed mode) */
+    children?: React.ReactNode;
+}
+/**
+ * Unified background component that renders the selected `backgroundVariant`.
+ * Used by all theme layouts (Default, Sonoma, Tahoe) via two positioning modes:
+ *
+ * - **fixed** (Default layouts): fullscreen fixed layer + content wrapper at z-10
+ * - **absolute** (macOS layouts): absolute layer within parent container, no children wrapper
+ *
+ * When variant is `'none'`, renders children without any background layer.
+ */
+export declare const ThemeBackground: React.FC<ThemeBackgroundProps>;
+/** Get the CDN URL for a specific SVG background asset */
+export declare function getBackgroundUrl(variant: Exclude<BackgroundVariant, 'none' | 'base'>, isDark: boolean, base?: string): string;
+export default ThemeBackground;

package/themes/components/theme-provider/mfe-app-theme-provider.d.ts

@@ -1,11 +1,11 @@
 import { default as React } from 'react';
 import { IAppRouteConfig } from '../../types';
-import { ThemeWrapperProps } from './theme-wrapper';
-interface MfeAppThemeProviderProps extends Omit<ThemeWrapperProps, 'children'> {
+import { ThemeWrapperProps, DistributiveOmit } from './theme-wrapper';
+type MfeAppThemeProviderProps = DistributiveOmit<ThemeWrapperProps, 'children'> & {
     basePath: string;
     appRoutesConfig: IAppRouteConfig[];
     isAuthenticated: boolean;
     loginUrl: string;
-}
+};
 export declare const MfeAppThemeProvider: React.FC<MfeAppThemeProviderProps>;
 export type { MfeAppThemeProviderProps };

package/themes/components/theme-provider/standalone-app-theme-provider.d.ts

@@ -1,12 +1,12 @@
 import { default as React } from 'react';
 import { Routes } from 'react-router-dom';
-import { ThemeWrapperProps } from './theme-wrapper';
+import { ThemeWrapperProps, DistributiveOmit } from './theme-wrapper';
 import { StandaloneAppRoutesProps } from '../../router/components/standalone-app-routes-provider';
-export interface StandaloneAppProviderProps extends Omit<ThemeWrapperProps, 'menuItems' | 'children'> {
+export type StandaloneAppProviderProps = DistributiveOmit<ThemeWrapperProps, 'menuItems' | 'children'> & {
     menuItems: StandaloneAppRoutesProps['menuItems'];
     customRoutes?: React.ReactElement<typeof Routes>;
     isAuthenticated: boolean;
     loginUrl?: string;
-}
+};
 declare const StandaloneAppProvider: React.FC<StandaloneAppProviderProps>;
 export default StandaloneAppProvider;

package/themes/components/theme-provider/theme-wrapper.d.ts

@@ -1,10 +1,12 @@
+import { BackgroundVariant } from '../../hooks/use-theme';
 import { PresetColorType, MODE } from '../../config';
 import { LayoutTypeProps } from '../../../components/layouts/root-layout';
 import { IMenuItem } from '../../../components/layouts/menus/menu-item';
-interface ThemeWrapperProps extends LayoutTypeProps {
+interface ThemeWrapperBaseProps extends Omit<LayoutTypeProps, 'layout'> {
     menuItems: IMenuItem[];
     brandColor?: PresetColorType;
     mode?: MODE;
+    background?: BackgroundVariant;
     headerClassName?: string;
     contentClassName?: string;
     fullWidth?: boolean;
@@ -23,9 +25,39 @@ interface ThemeWrapperProps extends LayoutTypeProps {
         lightBg?: PresetColorType | string;
         lightDark?: PresetColorType | string;
         darkLightDark?: PresetColorType | string;
+        success?: PresetColorType | string;
+        darkSuccess?: PresetColorType | string;
+        warning?: PresetColorType | string;
+        darkWarning?: PresetColorType | string;
+        error?: PresetColorType | string;
+        darkError?: PresetColorType | string;
+        info?: PresetColorType | string;
+        darkInfo?: PresetColorType | string;
+        fg?: PresetColorType | string;
+        darkFg?: PresetColorType | string;
+        border?: PresetColorType | string;
+        darkBorder?: PresetColorType | string;
     };
     setCurrentPathname?: (pathname: string) => void;
 }
-export declare function ThemeWrapper({ logo, rightButton, brandColor, customPaletteColor, showSettings, className, headerClassName, contentClassName, fullWidth, mode: appMode, menuItems: appMenuItems, layout: appLayout, children, setCurrentPathname, }: ThemeWrapperProps): import("react/jsx-runtime").JSX.Element;
+type DefaultLayoutType = 'clean' | 'admin' | 'horizontal';
+type MacOSLayoutType = 'macos';
+type MacOSTahoeLayoutType = 'macos-tahoe' | 'macos-tahoe-dock';
+interface DefaultThemeWrapperProps extends ThemeWrapperBaseProps {
+    themeStyle?: 'default';
+    layout?: DefaultLayoutType;
+}
+interface MacOSThemeWrapperProps extends ThemeWrapperBaseProps {
+    themeStyle: 'macos';
+    layout?: MacOSLayoutType;
+}
+interface MacOSTahoeThemeWrapperProps extends ThemeWrapperBaseProps {
+    themeStyle: 'macos-tahoe';
+    layout?: MacOSTahoeLayoutType;
+}
+type ThemeWrapperProps = DefaultThemeWrapperProps | MacOSThemeWrapperProps | MacOSTahoeThemeWrapperProps;
+/** Distributive Omit — preserves discriminated union across variants */
+type DistributiveOmit<T, K extends keyof never> = T extends unknown ? Omit<T, K> : never;
+export declare function ThemeWrapper({ logo, rightButton, themeStyle, brandColor, customPaletteColor, background, showSettings, className, headerClassName, contentClassName, fullWidth, mode: appMode, menuItems: appMenuItems, layout: appLayout, children, setCurrentPathname, }: ThemeWrapperProps): import("react/jsx-runtime").JSX.Element;
 export default ThemeWrapper;
-export type { ThemeWrapperProps };
+export type { ThemeWrapperProps, ThemeWrapperBaseProps, DefaultThemeWrapperProps, MacOSThemeWrapperProps, MacOSTahoeThemeWrapperProps, DistributiveOmit, DefaultLayoutType, MacOSLayoutType, MacOSTahoeLayoutType, };

package/themes/config/index.d.ts

@@ -4,14 +4,26 @@ export interface IThemeItem {
     value: string;
 }
 export type MODE = 'light' | 'dark';
-export type DIRECTION = 'ltr' | 'rtl';
-export type LogoType = LogoPropTypes;
+export type THEME_VARIANT = 'default' | 'macos' | 'macos-tahoe';
+export declare const defaultThemeVariant: THEME_VARIANT;
 export declare enum LAYOUT_OPTIONS {
     CLEAN = "clean",
     ADMIN = "admin",
-    HORIZONTAL = "horizontal"
+    HORIZONTAL = "horizontal",
+    MACOS = "macos",
+    MACOS_CLEAN = "macos-clean",
+    MACOS_TAHOE = "macos-tahoe",
+    MACOS_TAHOE_DOCK = "macos-tahoe-dock",
+    MACOS_TAHOE_CLEAN = "macos-tahoe-clean"
 }
-export type LayoutOptionType = 'clean' | 'admin' | 'horizontal';
+export interface ThemeStyleConfig {
+    validLayouts: LAYOUT_OPTIONS[];
+    defaultLayout: LAYOUT_OPTIONS;
+}
+export declare const THEME_STYLE_LAYOUTS: Record<THEME_VARIANT, ThemeStyleConfig>;
+export type DIRECTION = 'ltr' | 'rtl';
+export type LogoType = LogoPropTypes;
+export type LayoutOptionType = 'clean' | 'admin' | 'horizontal' | 'macos' | 'macos-clean' | 'macos-tahoe' | 'macos-tahoe-dock' | 'macos-tahoe-clean';
 export declare const layoutOptions: IThemeItem[];
 export type PresetColorType = 'Default' | 'DefaultSecondary' | 'DefaultAccent' | 'DefaultBgLight' | 'DefaultBgDark' | 'Yellow' | 'Orange' | 'Red' | 'Pink' | 'Violet' | 'Purple' | 'Blue' | 'Azure' | 'Turquoise' | 'Green' | 'Lime' | 'Black' | 'Gray';
 export declare enum PRESET_LABEL_COLORS {
@@ -48,7 +60,31 @@ export declare enum PRESET_LABEL_COLORS {
     YELLOW = "Yellow",
     DARK_YELLOW = "DarkYellow",
     CHARTREUSE = "Chartreuse",
-    DARK_CHARTREUSE = "DarkChartreuse"
+    DARK_CHARTREUSE = "DarkChartreuse",
+    DEFAULT_SUCCESS = "DefaultSuccess",
+    DEFAULT_DARK_SUCCESS = "DefaultDarkSuccess",
+    DEFAULT_WARNING = "DefaultWarning",
+    DEFAULT_DARK_WARNING = "DefaultDarkWarning",
+    DEFAULT_ERROR = "DefaultError",
+    DEFAULT_DARK_ERROR = "DefaultDarkError",
+    DEFAULT_INFO = "DefaultInfo",
+    DEFAULT_DARK_INFO = "DefaultDarkInfo",
+    DEFAULT_FG = "DefaultFg",
+    DEFAULT_DARK_FG = "DefaultDarkFg",
+    DEFAULT_BORDER = "DefaultBorder",
+    DEFAULT_DARK_BORDER = "DefaultDarkBorder",
+    MACOS_PRIMARY = "MacOSPrimary",
+    MACOS_DARK_PRIMARY = "MacOSDarkPrimary",
+    MACOS_SECONDARY = "MacOSSecondary",
+    MACOS_DARK_SECONDARY = "MacOSDarkSecondary",
+    MACOS_ACCENT = "MacOSAccent",
+    MACOS_DARK_ACCENT = "MacOSDarkAccent",
+    MACOS_MUTED = "MacOSMuted",
+    MACOS_DARK_MUTED = "MacOSDarkMuted",
+    MACOS_LIGHT_BG = "MacOSLightBg",
+    MACOS_DARK_BG = "MacOSDarkBg",
+    MACOS_LIGHT_DARK = "MacOSLightDark",
+    MACOS_DARK_LIGHT_DARK = "MacOSDarkLightDark"
 }
 export declare enum PRESET_COLORS {
     DEFAULT_PRIMARY = "#0052ff",// --color-tucu-ui-blue-60 (light mode)
@@ -84,7 +120,31 @@ export declare enum PRESET_COLORS {
     YELLOW = "#cf9700",// --color-tucu-ui-yellow-50
     DARK_YELLOW = "#c79e00",// --color-tucu-ui-dark-yellow-50
     CHARTREUSE = "#56b340",// --color-tucu-ui-chartreuse-50
-    DARK_CHARTREUSE = "#7bc869"
+    DARK_CHARTREUSE = "#7bc869",// --color-tucu-ui-dark-chartreuse-50
+    DEFAULT_SUCCESS = "#098551",// --color-tucu-ui-green-60 (light)
+    DEFAULT_DARK_SUCCESS = "#27ad75",// --color-tucu-ui-dark-green-60 (dark)
+    DEFAULT_WARNING = "#ed702f",// --color-tucu-ui-orange-40 (light)
+    DEFAULT_DARK_WARNING = "#c79e00",// --color-tucu-ui-dark-yellow-50 (dark)
+    DEFAULT_ERROR = "#cf202f",// --color-tucu-ui-red-60 (light)
+    DEFAULT_DARK_ERROR = "#f0616d",// --color-tucu-ui-dark-red-60 (dark)
+    DEFAULT_INFO = "#0052ff",// same as primary (light)
+    DEFAULT_DARK_INFO = "#578bfa",// same as dark primary (dark)
+    DEFAULT_FG = "#030712",// --color-tucu-ui-gray-100 (light)
+    DEFAULT_DARK_FG = "#ffffff",// --color-tucu-ui-dark-gray-100 (dark)
+    DEFAULT_BORDER = "color-mix(in oklab, var(--color-black) 10%, transparent)",
+    DEFAULT_DARK_BORDER = "color-mix(in oklab, var(--color-white) 8%, transparent)",
+    MACOS_PRIMARY = "#007aff",// systemBlue (light)
+    MACOS_DARK_PRIMARY = "#0a84ff",// systemBlue (dark)
+    MACOS_SECONDARY = "#ffffff",// contentBackground — cards float on gray bg
+    MACOS_DARK_SECONDARY = "#2c2c2e",// systemGray4 (dark) — elevated surface
+    MACOS_ACCENT = "#ff9500",// systemOrange (light)
+    MACOS_DARK_ACCENT = "#ff9f0a",// systemOrange (dark)
+    MACOS_MUTED = "#6c6c70",// secondaryLabel blended (light)
+    MACOS_DARK_MUTED = "#aeaeb2",// systemGray2 (dark)
+    MACOS_LIGHT_BG = "#f2f2f7",// systemGray6 — primary app background
+    MACOS_DARK_BG = "#1c1c1e",// systemGray5 (dark) — primary bg
+    MACOS_LIGHT_DARK = "#e5e5ea",// systemGray5 (light) — secondary bg wash
+    MACOS_DARK_LIGHT_DARK = "#3a3a3c"
 }
 export declare const colorPreset: IThemeItem[];
 export declare const Direction: IThemeItem[];
@@ -105,5 +165,197 @@ export declare const defaultDarkBgPreset: IThemeItem;
 export declare const defaultLightBgPreset: IThemeItem;
 export declare const defaultLightDarkPreset: IThemeItem;
 export declare const defaultDarkLightDarkPreset: IThemeItem;
+export declare const defaultSuccessPreset: IThemeItem;
+export declare const defaultDarkSuccessPreset: IThemeItem;
+export declare const defaultWarningPreset: IThemeItem;
+export declare const defaultDarkWarningPreset: IThemeItem;
+export declare const defaultErrorPreset: IThemeItem;
+export declare const defaultDarkErrorPreset: IThemeItem;
+export declare const defaultInfoPreset: IThemeItem;
+export declare const defaultDarkInfoPreset: IThemeItem;
+export declare const defaultFgPreset: IThemeItem;
+export declare const defaultDarkFgPreset: IThemeItem;
+export declare const defaultBorderPreset: IThemeItem;
+export declare const defaultDarkBorderPreset: IThemeItem;
 export declare const defaultDirection = "ltr";
 export declare const defaultMode = "dark";
+export declare const macosLightPresets: {
+    readonly primaryPreset: {
+        readonly label: PRESET_LABEL_COLORS.MACOS_PRIMARY;
+        readonly value: PRESET_COLORS.MACOS_PRIMARY;
+    };
+    readonly darkPrimaryPreset: {
+        readonly label: PRESET_LABEL_COLORS.MACOS_DARK_PRIMARY;
+        readonly value: PRESET_COLORS.MACOS_DARK_PRIMARY;
+    };
+    readonly secondaryPreset: {
+        readonly label: PRESET_LABEL_COLORS.MACOS_SECONDARY;
+        readonly value: PRESET_COLORS.DEFAULT_LIGHT_BG;
+    };
+    readonly darkSecondaryPreset: {
+        readonly label: PRESET_LABEL_COLORS.MACOS_DARK_SECONDARY;
+        readonly value: PRESET_COLORS.MACOS_DARK_SECONDARY;
+    };
+    readonly accentPreset: {
+        readonly label: PRESET_LABEL_COLORS.MACOS_ACCENT;
+        readonly value: PRESET_COLORS.MACOS_ACCENT;
+    };
+    readonly darkAccentPreset: {
+        readonly label: PRESET_LABEL_COLORS.MACOS_DARK_ACCENT;
+        readonly value: PRESET_COLORS.MACOS_DARK_ACCENT;
+    };
+    readonly mutedPreset: {
+        readonly label: PRESET_LABEL_COLORS.MACOS_MUTED;
+        readonly value: PRESET_COLORS.MACOS_MUTED;
+    };
+    readonly darkMutedPreset: {
+        readonly label: PRESET_LABEL_COLORS.MACOS_DARK_MUTED;
+        readonly value: PRESET_COLORS.MACOS_DARK_MUTED;
+    };
+    readonly lightBgPreset: {
+        readonly label: PRESET_LABEL_COLORS.MACOS_LIGHT_BG;
+        readonly value: PRESET_COLORS.MACOS_LIGHT_BG;
+    };
+    readonly darkBgPreset: {
+        readonly label: PRESET_LABEL_COLORS.MACOS_DARK_BG;
+        readonly value: PRESET_COLORS.MACOS_DARK_BG;
+    };
+    readonly lightDarkPreset: {
+        readonly label: PRESET_LABEL_COLORS.MACOS_LIGHT_DARK;
+        readonly value: PRESET_COLORS.MACOS_LIGHT_DARK;
+    };
+    readonly darkLightDarkPreset: {
+        readonly label: PRESET_LABEL_COLORS.MACOS_DARK_LIGHT_DARK;
+        readonly value: PRESET_COLORS.MACOS_DARK_LIGHT_DARK;
+    };
+};
+export interface TahoeAccentBundle {
+    id: string;
+    label: string;
+    /** Preview swatch — light mode primary */
+    swatch: string;
+    primaryLight: string;
+    primaryDark: string;
+    accentLight: string;
+    accentDark: string;
+}
+export declare const TAHOE_ACCENT_BUNDLES: TahoeAccentBundle[];
+/** Build a full macOS preset set from a Tahoe accent bundle */
+export declare function buildTahoePresets(bundle: TahoeAccentBundle): {
+    primaryPreset: {
+        label: string;
+        value: string;
+    };
+    darkPrimaryPreset: {
+        label: string;
+        value: string;
+    };
+    secondaryPreset: {
+        readonly label: PRESET_LABEL_COLORS.MACOS_SECONDARY;
+        readonly value: PRESET_COLORS.DEFAULT_LIGHT_BG;
+    };
+    darkSecondaryPreset: {
+        readonly label: PRESET_LABEL_COLORS.MACOS_DARK_SECONDARY;
+        readonly value: PRESET_COLORS.MACOS_DARK_SECONDARY;
+    };
+    accentPreset: {
+        label: string;
+        value: string;
+    };
+    darkAccentPreset: {
+        label: string;
+        value: string;
+    };
+    mutedPreset: {
+        readonly label: PRESET_LABEL_COLORS.MACOS_MUTED;
+        readonly value: PRESET_COLORS.MACOS_MUTED;
+    };
+    darkMutedPreset: {
+        readonly label: PRESET_LABEL_COLORS.MACOS_DARK_MUTED;
+        readonly value: PRESET_COLORS.MACOS_DARK_MUTED;
+    };
+    lightBgPreset: {
+        readonly label: PRESET_LABEL_COLORS.MACOS_LIGHT_BG;
+        readonly value: PRESET_COLORS.MACOS_LIGHT_BG;
+    };
+    darkBgPreset: {
+        readonly label: PRESET_LABEL_COLORS.MACOS_DARK_BG;
+        readonly value: PRESET_COLORS.MACOS_DARK_BG;
+    };
+    lightDarkPreset: {
+        readonly label: PRESET_LABEL_COLORS.MACOS_LIGHT_DARK;
+        readonly value: PRESET_COLORS.MACOS_LIGHT_DARK;
+    };
+    darkLightDarkPreset: {
+        readonly label: PRESET_LABEL_COLORS.MACOS_DARK_LIGHT_DARK;
+        readonly value: PRESET_COLORS.MACOS_DARK_LIGHT_DARK;
+    };
+    borderPreset: {
+        label: PRESET_LABEL_COLORS;
+        value: PRESET_COLORS;
+    };
+    darkBorderPreset: {
+        label: PRESET_LABEL_COLORS;
+        value: PRESET_COLORS;
+    };
+};
+export declare const SONOMA_ACCENT_BUNDLES: TahoeAccentBundle[];
+/** Build a full macOS preset set from a Sonoma accent bundle */
+export declare function buildSonomaPresets(bundle: TahoeAccentBundle): {
+    primaryPreset: {
+        label: string;
+        value: string;
+    };
+    darkPrimaryPreset: {
+        label: string;
+        value: string;
+    };
+    secondaryPreset: {
+        readonly label: PRESET_LABEL_COLORS.MACOS_SECONDARY;
+        readonly value: PRESET_COLORS.DEFAULT_LIGHT_BG;
+    };
+    darkSecondaryPreset: {
+        readonly label: PRESET_LABEL_COLORS.MACOS_DARK_SECONDARY;
+        readonly value: PRESET_COLORS.MACOS_DARK_SECONDARY;
+    };
+    accentPreset: {
+        label: string;
+        value: string;
+    };
+    darkAccentPreset: {
+        label: string;
+        value: string;
+    };
+    mutedPreset: {
+        readonly label: PRESET_LABEL_COLORS.MACOS_MUTED;
+        readonly value: PRESET_COLORS.MACOS_MUTED;
+    };
+    darkMutedPreset: {
+        readonly label: PRESET_LABEL_COLORS.MACOS_DARK_MUTED;
+        readonly value: PRESET_COLORS.MACOS_DARK_MUTED;
+    };
+    lightBgPreset: {
+        readonly label: PRESET_LABEL_COLORS.MACOS_LIGHT_BG;
+        readonly value: PRESET_COLORS.MACOS_LIGHT_BG;
+    };
+    darkBgPreset: {
+        readonly label: PRESET_LABEL_COLORS.MACOS_DARK_BG;
+        readonly value: PRESET_COLORS.MACOS_DARK_BG;
+    };
+    lightDarkPreset: {
+        readonly label: PRESET_LABEL_COLORS.MACOS_LIGHT_DARK;
+        readonly value: PRESET_COLORS.MACOS_LIGHT_DARK;
+    };
+    darkLightDarkPreset: {
+        readonly label: PRESET_LABEL_COLORS.MACOS_DARK_LIGHT_DARK;
+        readonly value: PRESET_COLORS.MACOS_DARK_LIGHT_DARK;
+    };
+    borderPreset: {
+        label: PRESET_LABEL_COLORS;
+        value: PRESET_COLORS;
+    };
+    darkBorderPreset: {
+        label: PRESET_LABEL_COLORS;
+        value: PRESET_COLORS;
+    };
+};

package/themes/hooks/use-theme-color.d.ts

@@ -12,6 +12,18 @@ interface IUseThemeColorProps {
     lightBgPreset: string;
     lightDarkPreset: string;
     darkLightDarkPreset: string;
+    successPreset: string;
+    darkSuccessPreset: string;
+    warningPreset: string;
+    darkWarningPreset: string;
+    errorPreset: string;
+    darkErrorPreset: string;
+    infoPreset: string;
+    darkInfoPreset: string;
+    fgPreset: string;
+    darkFgPreset: string;
+    borderPreset: string;
+    darkBorderPreset: string;
 }
-export declare function useThemeColor({ primaryPreset, darkPrimaryPreset, secondaryPreset, darkSecondaryPreset, accentPreset, darkAccentPreset, mutedPreset, darkMutedPreset, darkBgPreset, lightBgPreset, lightDarkPreset, darkLightDarkPreset, }: IUseThemeColorProps): void;
+export declare function useThemeColor({ primaryPreset, darkPrimaryPreset, secondaryPreset, darkSecondaryPreset, accentPreset, darkAccentPreset, mutedPreset, darkMutedPreset, darkBgPreset, lightBgPreset, lightDarkPreset, darkLightDarkPreset, successPreset, darkSuccessPreset, warningPreset, darkWarningPreset, errorPreset, darkErrorPreset, infoPreset, darkInfoPreset, fgPreset, darkFgPreset, borderPreset, darkBorderPreset, }: IUseThemeColorProps): void;
 export {};

package/themes/hooks/use-theme.d.ts

@@ -1,4 +1,6 @@
-import { DIRECTION, IThemeItem, LogoType, LAYOUT_OPTIONS, MODE, LangType } from '../config/index';
+import { DIRECTION, IThemeItem, LogoType, LAYOUT_OPTIONS, MODE, THEME_VARIANT, LangType } from '../config/index';
+export type BackgroundVariant = 'none' | 'base' | 'sonoma' | 'wave' | 'wallpaper' | 'mobile' | 'radial' | 'window' | 'aurora' | 'depth' | 'demo';
+export type TahoeBackgroundVariant = BackgroundVariant;
 /** Helper: for every key K in T, produce a setter `setK: (value: T[K]) => void` */
 type Setters<T> = {
     [K in keyof T as `set${Capitalize<string & K>}`]: (value: T[K]) => void;
@@ -17,17 +19,35 @@ interface IThemeState {
     lightBgPreset: IThemeItem;
     lightDarkPreset: IThemeItem;
     darkLightDarkPreset: IThemeItem;
+    successPreset: IThemeItem;
+    darkSuccessPreset: IThemeItem;
+    warningPreset: IThemeItem;
+    darkWarningPreset: IThemeItem;
+    errorPreset: IThemeItem;
+    darkErrorPreset: IThemeItem;
+    infoPreset: IThemeItem;
+    darkInfoPreset: IThemeItem;
+    fgPreset: IThemeItem;
+    darkFgPreset: IThemeItem;
+    borderPreset: IThemeItem;
+    darkBorderPreset: IThemeItem;
     direction: DIRECTION;
     layout: LAYOUT_OPTIONS;
     mode: MODE;
+    colorScheme: THEME_VARIANT;
     logo: LogoType;
     isSettingsOpen: boolean;
     showSettings: boolean;
     lang: LangType;
+    backgroundVariant: BackgroundVariant;
 }
 /** Full store interface: state + auto-generated setters + actions */
 export interface ITheme extends IThemeState, Setters<IThemeState> {
     restoreDefaultColors: () => void;
+    applyMacOSTheme: () => void;
+    applyMacOSTahoeTheme: () => void;
+    applyDefaultTheme: () => void;
+    applyThemeStyle: (themeStyle: THEME_VARIANT) => void;
 }
 export declare const useTheme: import('zustand').UseBoundStore<Omit<import('zustand').StoreApi<ITheme>, "setState" | "persist"> & {
     setState(partial: ITheme | Partial<ITheme> | ((state: ITheme) => ITheme | Partial<ITheme>), replace?: false | undefined): unknown;

package/documentation/APIReferenceSection-3tw3kbSC.js

@@ -1,142 +0,0 @@
-import { jsx as e, jsxs as r } from "react/jsx-runtime";
-import { C as s, a as l, T as i, q as n, J as a } from "../index-D3gBsvbO.js";
-import "lucide-react";
-import "react-router-dom";
-import "react";
-import "react-dom";
-const g = () => /* @__PURE__ */ e("div", { className: "space-y-8", children: /* @__PURE__ */ e(s, { children: /* @__PURE__ */ e(l, { title: "API Reference", className: "mt-2 mb-6", children: /* @__PURE__ */ r("div", { className: "space-y-6", children: [
-  /* @__PURE__ */ e(i, { tag: "p", className: "text-gray-600 dark:text-gray-400", children: "Complete API reference for the routing system components and interfaces." }),
-  /* @__PURE__ */ r("div", { className: "space-y-6", children: [
-    /* @__PURE__ */ r("div", { className: "space-y-3", children: [
-      /* @__PURE__ */ e(i, { tag: "h4", className: "font-semibold", children: "StandaloneAppRoutesMenuItem Properties" }),
-      /* @__PURE__ */ e(
-        n,
-        {
-          columns: [
-            {
-              key: "prop",
-              label: "Property",
-              render: (t) => /* @__PURE__ */ e("code", { className: "text-xs text-brand", children: String(t) })
-            },
-            {
-              key: "type",
-              label: "Type",
-              render: (t) => /* @__PURE__ */ e("code", { className: "text-xs", children: String(t) })
-            },
-            {
-              key: "required",
-              label: "Required",
-              render: (t) => String(t) === "Yes" ? /* @__PURE__ */ e(a, { variant: "outline", className: "text-xs", children: "Yes" }) : /* @__PURE__ */ e(a, { variant: "outline", className: "text-xs", children: "Optional" })
-            },
-            {
-              key: "description",
-              label: "Description"
-            }
-          ],
-          data: [
-            {
-              prop: "name",
-              type: "string",
-              required: "Yes",
-              description: "Display name for navigation menu"
-            },
-            {
-              prop: "path",
-              type: "string",
-              required: "Yes",
-              description: "URL path for the route"
-            },
-            {
-              prop: "component",
-              type: "JSX.Element",
-              required: "Yes",
-              description: "Component to render for this route"
-            },
-            {
-              prop: "icon",
-              type: "React.ReactNode",
-              required: "Optional",
-              description: "Icon to display in navigation"
-            },
-            {
-              prop: "dropdownItems",
-              type: "StandaloneAppRoutesMenuItem[]",
-              required: "Optional",
-              description: "Array of nested sub-routes"
-            },
-            {
-              prop: "hide",
-              type: "boolean",
-              required: "Optional",
-              description: "Hide route from navigation menu"
-            },
-            {
-              prop: "isPublic",
-              type: "boolean",
-              required: "Optional",
-              description: "Whether the route is publicly accessible (default: true)"
-            }
-          ]
-        }
-      )
-    ] }),
-    /* @__PURE__ */ r("div", { className: "space-y-3", children: [
-      /* @__PURE__ */ e(i, { tag: "h4", className: "font-semibold", children: "IAppRouteConfig Properties (MFE)" }),
-      /* @__PURE__ */ e(n, { columns: [
-        {
-          key: "prop",
-          label: "Property",
-          render: (t) => /* @__PURE__ */ e("code", { className: "text-xs text-brand", children: String(t) })
-        },
-        {
-          key: "type",
-          label: "Type",
-          render: (t) => /* @__PURE__ */ e("code", { className: "text-xs", children: String(t) })
-        },
-        {
-          key: "required",
-          label: "Required",
-          render: (t) => String(t) === "Yes" ? /* @__PURE__ */ e(a, { variant: "outline", className: "text-xs", children: "Yes" }) : /* @__PURE__ */ e(a, { variant: "outline", className: "text-xs", children: "Optional" })
-        },
-        {
-          key: "description",
-          label: "Description"
-        }
-      ], data: [
-        {
-          prop: "key",
-          type: "string",
-          required: "Yes",
-          description: "Unique identifier for the route"
-        },
-        {
-          prop: "path",
-          type: "string",
-          required: "Yes",
-          description: "URL path for the route"
-        },
-        {
-          prop: "element",
-          type: "JSX.Element",
-          required: "Yes",
-          description: "Component to render for this route"
-        },
-        {
-          prop: "isPublic",
-          type: "boolean",
-          required: "Optional",
-          description: "Whether the route is publicly accessible (default: false)"
-        },
-        {
-          prop: "disabled",
-          type: "boolean",
-          required: "Optional",
-          description: "Whether the route is disabled"
-        }
-      ] })
-    ] })
-  ] })
-] }) }) }) });
-export {
-  g as default
-};

package/documentation/APIReferenceSection-Bi_II-dh.js

@@ -1 +0,0 @@
-"use strict";Object.defineProperty(exports,Symbol.toStringTag,{value:"Module"});const e=require("react/jsx-runtime"),t=require("../index-VrMogvDN.js");require("lucide-react");require("react-router-dom");require("react");require("react-dom");const l=()=>{const i=[{key:"prop",label:"Property",render:r=>e.jsx("code",{className:"text-xs text-brand",children:String(r)})},{key:"type",label:"Type",render:r=>e.jsx("code",{className:"text-xs",children:String(r)})},{key:"required",label:"Required",render:r=>String(r)==="Yes"?e.jsx(t.Badge,{variant:"outline",className:"text-xs",children:"Yes"}):e.jsx(t.Badge,{variant:"outline",className:"text-xs",children:"Optional"})},{key:"description",label:"Description"}],s=[{prop:"name",type:"string",required:"Yes",description:"Display name for navigation menu"},{prop:"path",type:"string",required:"Yes",description:"URL path for the route"},{prop:"component",type:"JSX.Element",required:"Yes",description:"Component to render for this route"},{prop:"icon",type:"React.ReactNode",required:"Optional",description:"Icon to display in navigation"},{prop:"dropdownItems",type:"StandaloneAppRoutesMenuItem[]",required:"Optional",description:"Array of nested sub-routes"},{prop:"hide",type:"boolean",required:"Optional",description:"Hide route from navigation menu"},{prop:"isPublic",type:"boolean",required:"Optional",description:"Whether the route is publicly accessible (default: true)"}],n=[{key:"prop",label:"Property",render:r=>e.jsx("code",{className:"text-xs text-brand",children:String(r)})},{key:"type",label:"Type",render:r=>e.jsx("code",{className:"text-xs",children:String(r)})},{key:"required",label:"Required",render:r=>String(r)==="Yes"?e.jsx(t.Badge,{variant:"outline",className:"text-xs",children:"Yes"}):e.jsx(t.Badge,{variant:"outline",className:"text-xs",children:"Optional"})},{key:"description",label:"Description"}],a=[{prop:"key",type:"string",required:"Yes",description:"Unique identifier for the route"},{prop:"path",type:"string",required:"Yes",description:"URL path for the route"},{prop:"element",type:"JSX.Element",required:"Yes",description:"Component to render for this route"},{prop:"isPublic",type:"boolean",required:"Optional",description:"Whether the route is publicly accessible (default: false)"},{prop:"disabled",type:"boolean",required:"Optional",description:"Whether the route is disabled"}];return e.jsx("div",{className:"space-y-8",children:e.jsx(t.CardContainer,{children:e.jsx(t.CardTitle,{title:"API Reference",className:"mt-2 mb-6",children:e.jsxs("div",{className:"space-y-6",children:[e.jsx(t.Typography,{tag:"p",className:"text-gray-600 dark:text-gray-400",children:"Complete API reference for the routing system components and interfaces."}),e.jsxs("div",{className:"space-y-6",children:[e.jsxs("div",{className:"space-y-3",children:[e.jsx(t.Typography,{tag:"h4",className:"font-semibold",children:"StandaloneAppRoutesMenuItem Properties"}),e.jsx(t.BasicTable,{columns:i,data:s})]}),e.jsxs("div",{className:"space-y-3",children:[e.jsx(t.Typography,{tag:"h4",className:"font-semibold",children:"IAppRouteConfig Properties (MFE)"}),e.jsx(t.BasicTable,{columns:n,data:a})]})]})]})})})})};exports.default=l;