@breadstone/mosaik-elements-foundation 0.0.221 → 0.0.222

package/Theming/IThemeService.d.ts

@@ -1,5 +1,5 @@
 import type { ITheme, ThemeMode, ThemeScheme, ThemeSemantic } from '@breadstone/mosaik-themes';
-import type { IEventEmitter, IEventDetail } from '@breadstone/mosaik-elements';
+import type { IEventDetail } from '@breadstone/mosaik-elements';
 /**
  * Represents a provider that can supply theme information.
  * This abstraction allows ThemeService to work with theme providers
@@ -7,51 +7,71 @@ import type { IEventEmitter, IEventDetail } from '@breadstone/mosaik-elements';
  *
  * @public
  */
-export interface IThemeProvider {
+export interface IThemeProvider extends HTMLElement {
+    /**
+     * Gets the optional theme name for scoped theme management.
+     * Providers with the same name share theme state.
+     * Providers without a name (null) share the global/default theme state.
+     */
+    readonly name: string | null;
     /**
      * Gets the current theme from this provider.
      */
     readonly theme: ITheme | null;
+    /**
+     * Gets whether this provider applies CSS variables globally to the document.
+     * When true, CSS variables are set both on this element and globally.
+     * When false (default), CSS variables are set only on this element.
+     */
+    readonly global: boolean;
     /**
      * Applies the complete theme.
+     * Called by ThemeService to update the provider's internal state.
+     * The provider should NOT set CSS variables - ThemeService handles that.
      *
-     * @param theme - The theme to apply.
+     * @param theme The theme to apply.
      */
     applyTheme(theme: ITheme): void;
     /**
      * Applies the scheme (light/dark mode color roles) from the theme.
+     * Called by ThemeService to update the provider's internal state.
      *
-     * @param scheme - The scheme to apply.
+     * @param scheme The scheme to apply.
      */
     applyScheme(scheme: ITheme['scheme']): void;
     /**
      * Applies the color palette from the theme.
+     * Called by ThemeService to update the provider's internal state.
      *
-     * @param palette - The palette to apply.
+     * @param palette The palette to apply.
      */
     applyPalette(palette: ITheme['palette']): void;
     /**
      * Applies the font family from the theme.
+     * Called by ThemeService to update the provider's internal state.
      *
-     * @param fontFamily - The font family to apply.
+     * @param fontFamily The font family to apply.
      */
     applyFontFamily(fontFamily: ITheme['fontFamily']): void;
     /**
      * Applies the typography settings from the theme.
+     * Called by ThemeService to update the provider's internal state.
      *
-     * @param typography - The typography to apply.
+     * @param typography The typography to apply.
      */
     applyTypography(typography: ITheme['typography']): void;
     /**
      * Applies the layout settings from the theme.
+     * Called by ThemeService to update the provider's internal state.
      *
-     * @param layout - The layout to apply.
+     * @param layout The layout to apply.
      */
     applyLayout(layout: ITheme['layout']): void;
     /**
      * Applies the elevation (shadow) settings from the theme.
+     * Called by ThemeService to update the provider's internal state.
      *
-     * @param elevation - The elevation to apply.
+     * @param elevation The elevation to apply.
      */
     applyElevation(elevation: ITheme['elevation']): void;
 }
@@ -65,6 +85,7 @@ export interface IThemeEventDetail extends IEventDetail {
     readonly scheme?: ITheme['scheme'] | Partial<ThemeScheme>;
     readonly palette?: ITheme['palette'] | Partial<ThemeSemantic>;
     readonly mode?: ThemeMode;
+    readonly name?: string | null;
 }
 /**
  * Represents the options for setting a CSS variable.
@@ -84,173 +105,55 @@ export interface ISetCssVariableOptions {
     readonly applyGlobally?: boolean;
 }
 /**
- * Represents the configuration options for the `{@link ThemeService}`.
+ * Represents options for theme application methods.
  *
  * @public
  */
-export interface IThemeServiceConfig {
-    /**
-     * The unique ID for the global style element.
-     * @default 'mosaik-theme-vars'
-     */
-    readonly styleId?: string;
+export interface IThemeApplyOptions {
     /**
-     * Whether to automatically initialize the service on first access.
+     * Whether to notify registered providers about the change.
+     * Set to false when the call originates from a provider to avoid infinite loops.
      * @default true
      */
-    readonly autoInitialize?: boolean;
+    readonly notifyProviders?: boolean;
 }
 /**
- * The default configuration for the `{@link ThemeService}`.
- *
- * @public
- */
-export declare const THEME_SERVICE_DEFAULT_CONFIG: Required<IThemeServiceConfig>;
-/**
- * Represents the `{@link IThemeService}` interface.
- * Provides methods for applying theme-related CSS variables to the document.
+ * Represents the configuration options for the `{@link ThemeService}`.
  *
  * @public
  */
-export interface IThemeService {
-    /**
-     * Gets whether the service has been initialized.
-     */
-    readonly isInitialized: boolean;
-    /**
-     * Gets the currently applied theme, if any.
-     */
-    readonly currentTheme: ITheme | null;
-    /**
-     * Event emitter that fires when the theme changes.
-     */
-    readonly themeChanged: IEventEmitter<IThemeEventDetail>;
-    /**
-     * Event emitter that fires when the scheme changes.
-     */
-    readonly schemeChanged: IEventEmitter<IThemeEventDetail>;
-    /**
-     * Event emitter that fires when the palette changes.
-     */
-    readonly paletteChanged: IEventEmitter<IThemeEventDetail>;
-    /**
-     * Initializes the service.
-     * Must be called before applying any theme properties (unless autoInitialize is enabled).
-     */
-    initialize(): void;
-    /**
-     * Disposes of the service and cleans up resources.
-     */
-    dispose(): void;
-    /**
-     * Registers a theme provider with the service.
-     *
-     * @param provider - The theme provider to register.
-     */
-    registerProvider(provider: IThemeProvider): void;
-    /**
-     * Unregisters a theme provider from the service.
-     *
-     * @param provider - The theme provider to unregister.
-     */
-    unregisterProvider(provider: IThemeProvider): void;
-    /**
-     * Gets the current theme from the first registered provider.
-     *
-     * @returns The current theme.
-     * @throws Error if no theme is set.
-     */
-    getTheme(): ITheme;
-    /**
-     * Gets the current theme name from the document element.
-     *
-     * @returns The current theme name or `null` if not set.
-     */
-    getDocumentTheme(): string | null;
-    /**
-     * Gets the current theme mode from the document element.
-     *
-     * @returns The current theme mode or `null` if not set.
-     */
-    getDocumentThemeMode(): ThemeMode | null;
-    /**
-     * Applies the complete theme to all registered providers.
-     *
-     * @param theme - The theme to apply.
-     */
-    applyTheme(theme: ITheme): void;
-    /**
-     * Applies the scheme (light/dark mode color roles) from the theme.
-     *
-     * @param scheme - The scheme to apply.
-     * @param themeName - The name of the theme for CSS variable prefixing.
-     */
-    applyScheme(scheme: ITheme['scheme'], themeName: string): void;
-    /**
-     * Applies the color palette from the theme.
-     *
-     * @param palette - The palette to apply.
-     * @param themeName - The name of the theme for CSS variable prefixing.
-     */
-    applyPalette(palette: ITheme['palette'], themeName: string): void;
-    /**
-     * Applies the font family from the theme.
-     *
-     * @param fontFamily - The font family to apply.
-     * @param themeName - The name of the theme for CSS variable prefixing.
-     * @param typographyKeys - The typography keys to apply the font family to.
-     */
-    applyFontFamily(fontFamily: ITheme['fontFamily'], themeName: string, typographyKeys: Array<string>): void;
-    /**
-     * Applies the typography settings from the theme.
-     *
-     * @param typography - The typography settings to apply.
-     * @param themeName - The name of the theme for CSS variable prefixing.
-     * @param fontFamily - The font family to use in shorthand typography values.
-     */
-    applyTypography(typography: ITheme['typography'], themeName: string, fontFamily: string): void;
-    /**
-     * Applies the layout settings from the theme.
-     *
-     * @param layout - The layout settings to apply.
-     * @param themeName - The name of the theme for CSS variable prefixing.
-     */
-    applyLayout(layout: ITheme['layout'], themeName: string): void;
+export interface IThemeServiceConfig {
     /**
-     * Applies the elevation (shadow) settings from the theme.
+     * The unique ID for the global style element.
      *
-     * @param elevation - The elevation settings to apply.
-     * @param themeName - The name of the theme for CSS variable prefixing.
+     * @default 'mosaik-theme-vars'
      */
-    applyElevation(elevation: ITheme['elevation'], themeName: string): void;
+    readonly styleId?: string;
     /**
-     * Replaces the scheme with the specified key.
-     * This is useful when you want to replace a specific scheme in the theme.
+     * Whether to automatically initialize the service on first access.
      *
-     * @param mode - The theme mode to replace.
-     * @param scheme - The scheme color roles to replace.
+     * @default true
      */
-    replaceScheme(mode: ThemeMode, scheme: Partial<ThemeScheme>): void;
+    readonly autoInitialize?: boolean;
     /**
-     * Replaces the palette with the specified key.
-     * This is useful when you want to replace a specific palette in the theme.
+     * The default theme to use as a fallback when no theme is set.
+     * This is reflected on the document element as `theme` attribute.
      *
-     * @param mode - The theme mode to replace.
-     * @param semantic - The semantic color roles to replace.
+     * @default undefined
      */
-    replacePalette(mode: ThemeMode, semantic: Partial<ThemeSemantic>): void;
+    readonly defaultTheme?: ITheme;
     /**
-     * Sets a CSS variable.
+     * The default theme mode to apply during initialization.
+     * This is reflected on the document element as `theme-mode` attribute.
      *
-     * @param property - The CSS variable name (e.g., `--my-var`).
-     * @param value - The value to set.
-     * @param options - Optional settings for where to apply the variable.
+     * @default 'light'
      */
-    setCssVariable(property: string, value: string, options?: ISetCssVariableOptions): void;
-    /**
-     * Gets the current theme mode from the document.
-     *
-     * @returns The current theme mode ('light' or 'dark').\n     */
-    getCurrentThemeMode(): 'light' | 'dark';
+    readonly defaultThemeMode?: ThemeMode;
 }
+/**
+ * The default configuration for the `{@link ThemeService}`.
+ *
+ * @public
+ */
+export declare const THEME_SERVICE_DEFAULT_CONFIG: IThemeServiceConfig;
 //# sourceMappingURL=IThemeService.d.ts.map

package/Theming/IThemeService.d.ts.map

@@ -1 +1 @@
-{"version":3,"file":"IThemeService.d.ts","sourceRoot":"","sources":["../../src/Theming/IThemeService.ts"],"names":[],"mappings":"AAEA,OAAO,KAAK,EAAE,MAAM,EAAE,SAAS,EAAE,WAAW,EAAE,aAAa,EAAE,MAAM,2BAA2B,CAAC;AAC/F,OAAO,KAAK,EAAE,aAAa,EAAE,YAAY,EAAE,MAAM,6BAA6B,CAAC;AAI/E;;;;;;GAMG;AACH,MAAM,WAAW,cAAc;IAE3B;;OAEG;IACH,QAAQ,CAAC,KAAK,EAAE,MAAM,GAAG,IAAI,CAAC;IAE9B;;;;OAIG;IACH,UAAU,CAAC,KAAK,EAAE,MAAM,GAAG,IAAI,CAAC;IAEhC;;;;OAIG;IACH,WAAW,CAAC,MAAM,EAAE,MAAM,CAAC,QAAQ,CAAC,GAAG,IAAI,CAAC;IAE5C;;;;OAIG;IACH,YAAY,CAAC,OAAO,EAAE,MAAM,CAAC,SAAS,CAAC,GAAG,IAAI,CAAC;IAE/C;;;;OAIG;IACH,eAAe,CAAC,UAAU,EAAE,MAAM,CAAC,YAAY,CAAC,GAAG,IAAI,CAAC;IAExD;;;;OAIG;IACH,eAAe,CAAC,UAAU,EAAE,MAAM,CAAC,YAAY,CAAC,GAAG,IAAI,CAAC;IAExD;;;;OAIG;IACH,WAAW,CAAC,MAAM,EAAE,MAAM,CAAC,QAAQ,CAAC,GAAG,IAAI,CAAC;IAE5C;;;;OAIG;IACH,cAAc,CAAC,SAAS,EAAE,MAAM,CAAC,WAAW,CAAC,GAAG,IAAI,CAAC;CAExD;AAED;;;;GAIG;AACH,MAAM,WAAW,iBAAkB,SAAQ,YAAY;IACnD,QAAQ,CAAC,KAAK,CAAC,EAAE,MAAM,CAAC;IACxB,QAAQ,CAAC,MAAM,CAAC,EAAE,MAAM,CAAC,QAAQ,CAAC,GAAG,OAAO,CAAC,WAAW,CAAC,CAAC;IAC1D,QAAQ,CAAC,OAAO,CAAC,EAAE,MAAM,CAAC,SAAS,CAAC,GAAG,OAAO,CAAC,aAAa,CAAC,CAAC;IAC9D,QAAQ,CAAC,IAAI,CAAC,EAAE,SAAS,CAAC;CAC7B;AAED;;;;GAIG;AACH,MAAM,WAAW,sBAAsB;IAEnC;;;OAGG;IACH,QAAQ,CAAC,OAAO,CAAC,EAAE,WAAW,CAAC;IAE/B;;;OAGG;IACH,QAAQ,CAAC,aAAa,CAAC,EAAE,OAAO,CAAC;CAEpC;AAED;;;;GAIG;AACH,MAAM,WAAW,mBAAmB;IAEhC;;;OAGG;IACH,QAAQ,CAAC,OAAO,CAAC,EAAE,MAAM,CAAC;IAE1B;;;OAGG;IACH,QAAQ,CAAC,cAAc,CAAC,EAAE,OAAO,CAAC;CAErC;AAED;;;;GAIG;AACH,eAAO,MAAM,4BAA4B,EAAE,QAAQ,CAAC,mBAAmB,CAGtE,CAAC;AAEF;;;;;GAKG;AACH,MAAM,WAAW,aAAa;IAE1B;;OAEG;IACH,QAAQ,CAAC,aAAa,EAAE,OAAO,CAAC;IAEhC;;OAEG;IACH,QAAQ,CAAC,YAAY,EAAE,MAAM,GAAG,IAAI,CAAC;IAErC;;OAEG;IACH,QAAQ,CAAC,YAAY,EAAE,aAAa,CAAC,iBAAiB,CAAC,CAAC;IAExD;;OAEG;IACH,QAAQ,CAAC,aAAa,EAAE,aAAa,CAAC,iBAAiB,CAAC,CAAC;IAEzD;;OAEG;IACH,QAAQ,CAAC,cAAc,EAAE,aAAa,CAAC,iBAAiB,CAAC,CAAC;IAE1D;;;OAGG;IACH,UAAU,IAAI,IAAI,CAAC;IAEnB;;OAEG;IACH,OAAO,IAAI,IAAI,CAAC;IAEhB;;;;OAIG;IACH,gBAAgB,CAAC,QAAQ,EAAE,cAAc,GAAG,IAAI,CAAC;IAEjD;;;;OAIG;IACH,kBAAkB,CAAC,QAAQ,EAAE,cAAc,GAAG,IAAI,CAAC;IAEnD;;;;;OAKG;IACH,QAAQ,IAAI,MAAM,CAAC;IAEnB;;;;OAIG;IACH,gBAAgB,IAAI,MAAM,GAAG,IAAI,CAAC;IAElC;;;;OAIG;IACH,oBAAoB,IAAI,SAAS,GAAG,IAAI,CAAC;IAEzC;;;;OAIG;IACH,UAAU,CAAC,KAAK,EAAE,MAAM,GAAG,IAAI,CAAC;IAEhC;;;;;OAKG;IACH,WAAW,CAAC,MAAM,EAAE,MAAM,CAAC,QAAQ,CAAC,EAAE,SAAS,EAAE,MAAM,GAAG,IAAI,CAAC;IAE/D;;;;;OAKG;IACH,YAAY,CAAC,OAAO,EAAE,MAAM,CAAC,SAAS,CAAC,EAAE,SAAS,EAAE,MAAM,GAAG,IAAI,CAAC;IAElE;;;;;;OAMG;IACH,eAAe,CAAC,UAAU,EAAE,MAAM,CAAC,YAAY,CAAC,EAAE,SAAS,EAAE,MAAM,EAAE,cAAc,EAAE,KAAK,CAAC,MAAM,CAAC,GAAG,IAAI,CAAC;IAE1G;;;;;;OAMG;IACH,eAAe,CAAC,UAAU,EAAE,MAAM,CAAC,YAAY,CAAC,EAAE,SAAS,EAAE,MAAM,EAAE,UAAU,EAAE,MAAM,GAAG,IAAI,CAAC;IAE/F;;;;;OAKG;IACH,WAAW,CAAC,MAAM,EAAE,MAAM,CAAC,QAAQ,CAAC,EAAE,SAAS,EAAE,MAAM,GAAG,IAAI,CAAC;IAE/D;;;;;OAKG;IACH,cAAc,CAAC,SAAS,EAAE,MAAM,CAAC,WAAW,CAAC,EAAE,SAAS,EAAE,MAAM,GAAG,IAAI,CAAC;IAExE;;;;;;OAMG;IACH,aAAa,CAAC,IAAI,EAAE,SAAS,EAAE,MAAM,EAAE,OAAO,CAAC,WAAW,CAAC,GAAG,IAAI,CAAC;IAEnE;;;;;;OAMG;IACH,cAAc,CAAC,IAAI,EAAE,SAAS,EAAE,QAAQ,EAAE,OAAO,CAAC,aAAa,CAAC,GAAG,IAAI,CAAC;IAExE;;;;;;OAMG;IACH,cAAc,CAAC,QAAQ,EAAE,MAAM,EAAE,KAAK,EAAE,MAAM,EAAE,OAAO,CAAC,EAAE,sBAAsB,GAAG,IAAI,CAAC;IAExF;;;oEAGgE;IAChE,mBAAmB,IAAI,OAAO,GAAG,MAAM,CAAC;CAE3C"}
+{"version":3,"file":"IThemeService.d.ts","sourceRoot":"","sources":["../../src/Theming/IThemeService.ts"],"names":[],"mappings":"AAEA,OAAO,KAAK,EAAE,MAAM,EAAE,SAAS,EAAE,WAAW,EAAE,aAAa,EAAE,MAAM,2BAA2B,CAAC;AAC/F,OAAO,KAAK,EAAE,YAAY,EAAE,MAAM,6BAA6B,CAAC;AAIhE;;;;;;GAMG;AACH,MAAM,WAAW,cAAe,SAAQ,WAAW;IAE/C;;;;OAIG;IACH,QAAQ,CAAC,IAAI,EAAE,MAAM,GAAG,IAAI,CAAC;IAE7B;;OAEG;IACH,QAAQ,CAAC,KAAK,EAAE,MAAM,GAAG,IAAI,CAAC;IAE9B;;;;OAIG;IACH,QAAQ,CAAC,MAAM,EAAE,OAAO,CAAC;IAEzB;;;;;;OAMG;IACH,UAAU,CAAC,KAAK,EAAE,MAAM,GAAG,IAAI,CAAC;IAEhC;;;;;OAKG;IACH,WAAW,CAAC,MAAM,EAAE,MAAM,CAAC,QAAQ,CAAC,GAAG,IAAI,CAAC;IAE5C;;;;;OAKG;IACH,YAAY,CAAC,OAAO,EAAE,MAAM,CAAC,SAAS,CAAC,GAAG,IAAI,CAAC;IAE/C;;;;;OAKG;IACH,eAAe,CAAC,UAAU,EAAE,MAAM,CAAC,YAAY,CAAC,GAAG,IAAI,CAAC;IAExD;;;;;OAKG;IACH,eAAe,CAAC,UAAU,EAAE,MAAM,CAAC,YAAY,CAAC,GAAG,IAAI,CAAC;IAExD;;;;;OAKG;IACH,WAAW,CAAC,MAAM,EAAE,MAAM,CAAC,QAAQ,CAAC,GAAG,IAAI,CAAC;IAE5C;;;;;OAKG;IACH,cAAc,CAAC,SAAS,EAAE,MAAM,CAAC,WAAW,CAAC,GAAG,IAAI,CAAC;CAExD;AAED;;;;GAIG;AACH,MAAM,WAAW,iBAAkB,SAAQ,YAAY;IACnD,QAAQ,CAAC,KAAK,CAAC,EAAE,MAAM,CAAC;IACxB,QAAQ,CAAC,MAAM,CAAC,EAAE,MAAM,CAAC,QAAQ,CAAC,GAAG,OAAO,CAAC,WAAW,CAAC,CAAC;IAC1D,QAAQ,CAAC,OAAO,CAAC,EAAE,MAAM,CAAC,SAAS,CAAC,GAAG,OAAO,CAAC,aAAa,CAAC,CAAC;IAC9D,QAAQ,CAAC,IAAI,CAAC,EAAE,SAAS,CAAC;IAC1B,QAAQ,CAAC,IAAI,CAAC,EAAE,MAAM,GAAG,IAAI,CAAC;CACjC;AAED;;;;GAIG;AACH,MAAM,WAAW,sBAAsB;IAEnC;;;OAGG;IACH,QAAQ,CAAC,OAAO,CAAC,EAAE,WAAW,CAAC;IAE/B;;;OAGG;IACH,QAAQ,CAAC,aAAa,CAAC,EAAE,OAAO,CAAC;CAEpC;AAED;;;;GAIG;AACH,MAAM,WAAW,kBAAkB;IAE/B;;;;OAIG;IACH,QAAQ,CAAC,eAAe,CAAC,EAAE,OAAO,CAAC;CAEtC;AAED;;;;GAIG;AACH,MAAM,WAAW,mBAAmB;IAEhC;;;;OAIG;IACH,QAAQ,CAAC,OAAO,CAAC,EAAE,MAAM,CAAC;IAE1B;;;;OAIG;IACH,QAAQ,CAAC,cAAc,CAAC,EAAE,OAAO,CAAC;IAElC;;;;;OAKG;IACH,QAAQ,CAAC,YAAY,CAAC,EAAE,MAAM,CAAC;IAE/B;;;;;OAKG;IACH,QAAQ,CAAC,gBAAgB,CAAC,EAAE,SAAS,CAAC;CAEzC;AAED;;;;GAIG;AACH,eAAO,MAAM,4BAA4B,EAAE,mBAK1C,CAAC"}

package/Theming/IThemeService.js

@@ -6,6 +6,8 @@
  */
 export const THEME_SERVICE_DEFAULT_CONFIG = {
     styleId: 'mosaik-theme-vars',
-    autoInitialize: true
+    autoInitialize: true,
+    defaultTheme: undefined,
+    defaultThemeMode: 'light'
 };
 //# sourceMappingURL=IThemeService.js.map

package/Theming/IThemeService.js.map

@@ -1 +1 @@
-{"version":3,"file":"IThemeService.js","sourceRoot":"","sources":["../../src/Theming/IThemeService.ts"],"names":[],"mappings":"AAAA,kBAAkB;AA8HlB;;;;GAIG;AACH,MAAM,CAAC,MAAM,4BAA4B,GAAkC;IACvE,OAAO,EAAE,mBAAmB;IAC5B,cAAc,EAAE,IAAI;CACvB,CAAC"}
+{"version":3,"file":"IThemeService.js","sourceRoot":"","sources":["../../src/Theming/IThemeService.ts"],"names":[],"mappings":"AAAA,kBAAkB;AAuLlB;;;;GAIG;AACH,MAAM,CAAC,MAAM,4BAA4B,GAAwB;IAC7D,OAAO,EAAE,mBAAmB;IAC5B,cAAc,EAAE,IAAI;IACpB,YAAY,EAAE,SAAS;IACvB,gBAAgB,EAAE,OAAO;CAC5B,CAAC"}

package/Theming/Theme2Element.d.ts

@@ -11,8 +11,9 @@ import type { IThemeProvider } from './IThemeService';
  * @public
  */
 export declare class Theme2Element extends CustomElement implements IThemeElementProps, IThemeProvider {
+    private _name;
     private _theme;
-    private _isInline;
+    private _global;
     /**
      * @public
      */
@@ -26,20 +27,32 @@ export declare class Theme2Element extends CustomElement implements IThemeElemen
      * @readonly
      */
     static get is(): string;
+    /**
+     * Gets or sets the `name` property.
+     * When set, this element will only respond to theme changes for this specific name.
+     * When null (default), responds to global/default theme changes.
+     *
+     * @public
+     */
+    get name(): string | null;
+    set name(value: string | null);
     /**
      * Gets or sets the `theme` property.
+     * If no local theme is set, returns the theme from ThemeService for this element's name.
      *
      * @public
      */
     get theme(): ITheme | null;
     set theme(value: ITheme | null);
     /**
-     * Gets or sets the `isInline` property.
+     * Gets or sets the `global` property.
+     * When true, CSS variables are applied both locally and globally.
+     * When false (default), CSS variables are only applied locally to this element.
      *
      * @public
      */
-    get isInline(): boolean;
-    set isInline(value: boolean);
+    get global(): boolean;
+    set global(value: boolean);
     /**
      * @public
      * @override
@@ -51,15 +64,69 @@ export declare class Theme2Element extends CustomElement implements IThemeElemen
      */
     disconnectedCallback(): void;
     /**
-     * @protected
+     * Applies the complete theme.
+     * Called by ThemeService to update this provider's internal state.
+     * CSS variables are handled by ThemeService directly.
+     *
+     * @public
+     * @param theme The theme to apply.
      */
-    protected onThemePropertyChanged(prev?: ITheme, next?: ITheme): void;
+    applyTheme(theme: ITheme | null): void;
+    /**
+     * Applies the scheme (light/dark mode color roles) from the theme.
+     * Called by ThemeService to update this provider's internal state.
+     *
+     * @public
+     * @param scheme The scheme to apply.
+     */
+    applyScheme(scheme: ITheme['scheme']): void;
+    /**
+     * Applies the color palette from the theme.
+     * Called by ThemeService to update this provider's internal state.
+     *
+     * @public
+     * @param palette The palette to apply.
+     */
+    applyPalette(palette: ITheme['palette']): void;
+    /**
+     * Applies the font family from the theme.
+     * Called by ThemeService to update this provider's internal state.
+     *
+     * @public
+     * @param fontFamily The font family to apply.
+     */
+    applyFontFamily(fontFamily: ITheme['fontFamily']): void;
     /**
-     * Gets the current theme name or empty string.
+     * Applies the typography settings from the theme.
+     * Called by ThemeService to update this provider's internal state.
      *
-     * @private
+     * @public
+     * @param typography The typography settings to apply.
      */
-    private getThemeName;
+    applyTypography(typography: ITheme['typography']): void;
+    /**
+     * Applies the layout settings from the theme.
+     * Called by ThemeService to update this provider's internal state.
+     *
+     * @public
+     * @param layout The layout settings to apply.
+     */
+    applyLayout(layout: ITheme['layout']): void;
+    /**
+     * Applies the elevation (shadow) settings from the theme.
+     * Called by ThemeService to update this provider's internal state.
+     *
+     * @public
+     * @param elevation The elevation settings to apply.
+     */
+    applyElevation(elevation: ITheme['elevation']): void;
+    /**
+     * Called when the theme property changes.
+     * Delegates to ThemeService for CSS variable management.
+     *
+     * @protected
+     */
+    protected onThemePropertyChanged(prev?: ITheme, next?: ITheme): void;
 }
 export declare namespace Theme2Element {
     type Props = IThemeElementProps;

package/Theming/Theme2Element.d.ts.map

@@ -1 +1 @@
-{"version":3,"file":"Theme2Element.d.ts","sourceRoot":"","sources":["../../src/Theming/Theme2Element.ts"],"names":[],"mappings":"AAEA,OAAO,KAAK,EAAE,MAAM,EAAE,MAAM,2BAA2B,CAAC;AAExD,OAAO,EAAE,aAAa,EAAE,MAAM,gDAAgD,CAAC;AAM/E,OAAO,EAAE,kBAAkB,EAAE,MAAM,sBAAsB,CAAC;AAE1D,OAAO,KAAK,EAAE,cAAc,EAAE,MAAM,iBAAiB,CAAC;AAItD;;;;;;;GAOG;AACH,qBAMa,aACT,SAAQ,aACR,YAAW,kBAAkB,EAAE,cAAc;IAI7C,OAAO,CAAC,MAAM,CAAgB;IAC9B,OAAO,CAAC,SAAS,CAAU;IAM3B;;OAEG;;IAeH;;;;;;;OAOG;IACH,WAAkB,EAAE,IAAI,MAAM,CAE7B;IAED;;;;OAIG;IACH,IACW,KAAK,IAAI,MAAM,GAAG,IAAI,CAEhC;IACD,IAAW,KAAK,CAAC,KAAK,EAAE,MAAM,GAAG,IAAI,EAKpC;IAED;;;;OAIG;IACH,IACW,QAAQ,IAAI,OAAO,CAE7B;IACD,IAAW,QAAQ,CAAC,KAAK,EAAE,OAAO,EAKjC;IAMD;;;OAGG;IACa,iBAAiB,IAAI,IAAI;IAOzC;;;OAGG;IACa,oBAAoB,IAAI,IAAI;IAwF5C;;OAEG;IAEH,SAAS,CAAC,sBAAsB,CAAC,IAAI,CAAC,EAAE,MAAM,EAAE,IAAI,CAAC,EAAE,MAAM,GAAG,IAAI;IAMpE;;;;OAIG;IACH,OAAO,CAAC,YAAY;CAMvB;AAED,yBAAiB,aAAa,CAAC;IAC3B,KAAY,KAAK,GAAG,kBAAkB,CAAC;CAC1C;AAED;;GAEG;AACH,OAAO,CAAC,MAAM,CAAC;IACX,UAAU,qBAAqB;QAC3B,eAAe,EAAE,aAAa,CAAC;KAClC;CACJ"}
+{"version":3,"file":"Theme2Element.d.ts","sourceRoot":"","sources":["../../src/Theming/Theme2Element.ts"],"names":[],"mappings":"AAEA,OAAO,KAAK,EAAE,MAAM,EAAE,MAAM,2BAA2B,CAAC;AAExD,OAAO,EAAE,aAAa,EAAE,MAAM,gDAAgD,CAAC;AAM/E,OAAO,EAAE,kBAAkB,EAAE,MAAM,sBAAsB,CAAC;AAE1D,OAAO,KAAK,EAAE,cAAc,EAAE,MAAM,iBAAiB,CAAC;AAItD;;;;;;;GAOG;AACH,qBAMa,aACT,SAAQ,aACR,YAAW,kBAAkB,EAAE,cAAc;IAI7C,OAAO,CAAC,KAAK,CAAgB;IAC7B,OAAO,CAAC,MAAM,CAAgB;IAC9B,OAAO,CAAC,OAAO,CAAU;IAMzB;;OAEG;;IAeH;;;;;;;OAOG;IACH,WAAkB,EAAE,IAAI,MAAM,CAE7B;IAED;;;;;;OAMG;IACH,IAIW,IAAI,IAAI,MAAM,GAAG,IAAI,CAE/B;IACD,IAAW,IAAI,CAAC,KAAK,EAAE,MAAM,GAAG,IAAI,EAWnC;IAED;;;;;OAKG;IACH,IACW,KAAK,IAAI,MAAM,GAAG,IAAI,CAWhC;IACD,IAAW,KAAK,CAAC,KAAK,EAAE,MAAM,GAAG,IAAI,EAKpC;IAED;;;;;;OAMG;IACH,IACW,MAAM,IAAI,OAAO,CAE3B;IACD,IAAW,MAAM,CAAC,KAAK,EAAE,OAAO,EAK/B;IAMD;;;OAGG;IACa,iBAAiB,IAAI,IAAI;IAWzC;;;OAGG;IACa,oBAAoB,IAAI,IAAI;IAI5C;;;;;;;OAOG;IACI,UAAU,CAAC,KAAK,EAAE,MAAM,GAAG,IAAI,GAAG,IAAI;IAQ7C;;;;;;OAMG;IACI,WAAW,CAAC,MAAM,EAAE,MAAM,CAAC,QAAQ,CAAC,GAAG,IAAI;IAMlD;;;;;;OAMG;IACI,YAAY,CAAC,OAAO,EAAE,MAAM,CAAC,SAAS,CAAC,GAAG,IAAI;IAMrD;;;;;;OAMG;IACI,eAAe,CAAC,UAAU,EAAE,MAAM,CAAC,YAAY,CAAC,GAAG,IAAI;IAM9D;;;;;;OAMG;IACI,eAAe,CAAC,UAAU,EAAE,MAAM,CAAC,YAAY,CAAC,GAAG,IAAI;IAM9D;;;;;;OAMG;IACI,WAAW,CAAC,MAAM,EAAE,MAAM,CAAC,QAAQ,CAAC,GAAG,IAAI;IAMlD;;;;;;OAMG;IACI,cAAc,CAAC,SAAS,EAAE,MAAM,CAAC,WAAW,CAAC,GAAG,IAAI;IAM3D;;;;;OAKG;IAEH,SAAS,CAAC,sBAAsB,CAAC,IAAI,CAAC,EAAE,MAAM,EAAE,IAAI,CAAC,EAAE,MAAM,GAAG,IAAI;CAUvE;AAED,yBAAiB,aAAa,CAAC;IAC3B,KAAY,KAAK,GAAG,kBAAkB,CAAC;CAC1C;AAED;;GAEG;AACH,OAAO,CAAC,MAAM,CAAC;IACX,UAAU,qBAAqB;QAC3B,eAAe,EAAE,aAAa,CAAC;KAClC;CACJ"}