import * as i0 from '@angular/core'; import { Signal, InjectionToken, Provider } from '@angular/core'; /** * SSR-safe theme management service. * * Manages the active theme by setting a `data-theme` attribute on the document * element. Supports localStorage persistence, system `prefers-color-scheme` * detection with optional live watching, and a signal-based reactive API. * * Configure via `provideComTheme()` in your application providers. * * @example * ```typescript * // In your app config * providers: [provideComTheme({ defaultTheme: 'ocean' })] * * // In a component * readonly theme = inject(ComTheme); * this.theme.setTheme('dark'); * this.theme.clearPreference(); // revert to following system * ``` */ declare class ComTheme { private readonly document; private readonly platformId; private readonly renderer; private readonly destroyRef; private readonly config; /** * Whether the current theme was automatically determined by system preference * rather than explicitly set by the user. */ private readonly _isAutomatic; /** Current active theme. */ readonly theme: Signal; /** Whether the theme is currently following system preference. */ readonly isAutomatic: Signal; private readonly _theme; constructor(); /** Set the active theme explicitly. Persists to localStorage and stops following system preference. */ setTheme(theme: string): void; /** * Remove the stored theme preference and revert to following system preference. * If system preference watching is enabled, the theme updates to match the current * system color scheme. Otherwise, falls back to the configured default theme. */ clearPreference(): void; private resolveConfig; private determineInitialTheme; private getSystemTheme; private setupSystemPreferenceWatcher; private applyTheme; private persistTheme; private getStoredTheme; private removeStoredTheme; static ɵfac: i0.ɵɵFactoryDeclaration; static ɵprov: i0.ɵɵInjectableDeclaration; } /** Consumer-facing configuration for the theme service. */ interface ComThemeConfig { /** Default theme when no stored/system preference is found. Default: `'light'`. */ defaultTheme?: string; /** * localStorage key for persistence. Set to `null` to disable persistence. * Default: `'com-theme'`. */ storageKey?: string | null; /** * Theme to apply when the system reports `prefers-color-scheme: dark`. * Set to `null` to disable system dark preference detection. * Default: `'dark'`. */ darkSchemeTheme?: string | null; /** * Theme to apply when the system reports `prefers-color-scheme: light` * (or no preference). Defaults to `defaultTheme`. */ lightSchemeTheme?: string; /** * When `true`, the service listens for live `prefers-color-scheme` changes * and applies the mapped theme — unless the user has explicitly set a theme * (stored in localStorage). Call `clearPreference()` to revert to system following. * Default: `true`. */ followSystemPreference?: boolean; /** * HTML attribute name used to apply the theme on `documentElement`. * Default: `'data-theme'`. */ attribute?: string; } /** * Injection token for theme service configuration. * * Prefer using `provideComTheme()` instead of providing this token directly. */ declare const COM_THEME_CONFIG: InjectionToken; /** * Provides theme service configuration. * * @example * ```typescript * // Minimal — defaults to light/dark, localStorage, system preference watching * bootstrapApplication(AppComponent, { * providers: [provideComTheme()], * }); * * // Custom default theme and storage key * bootstrapApplication(AppComponent, { * providers: [ * provideComTheme({ * defaultTheme: 'ocean', * storageKey: 'my-app-theme', * }), * ], * }); * ``` */ declare function provideComTheme(config?: ComThemeConfig): Provider; export { COM_THEME_CONFIG, ComTheme, provideComTheme }; export type { ComThemeConfig };