@cdevhub/ngx-tw 0.5.0 → 0.6.0

package/fesm2022/cdevhub-ngx-tw-theme.mjs

@@ -1,12 +1,28 @@
 import * as i0 from '@angular/core';
-import { InjectionToken, makeEnvironmentProviders, inject, PLATFORM_ID, NgZone, signal, computed, effect, Injectable, input, Directive } from '@angular/core';
+import { InjectionToken, makeEnvironmentProviders, provideEnvironmentInitializer, inject, PLATFORM_ID, NgZone, signal, computed, effect, Injectable, input, Directive } from '@angular/core';
 import { DOCUMENT, isPlatformBrowser } from '@angular/common';
 
 /** Ordered list of every {@link TwTheme} value, used by `cycleTheme()` and for UI iteration. */
-const TW_THEMES = ['light', 'dark', 'high-contrast', 'system'];
+const TW_THEMES = [
+    'light',
+    'dark',
+    'high-contrast',
+    'high-contrast-dark',
+    'system',
+];
 /** Ordered list of every {@link TwResolvedTheme} value (i.e. {@link TW_THEMES} minus `'system'`). */
-const TW_RESOLVED_THEMES = ['light', 'dark', 'high-contrast'];
-/** Built-in defaults merged under any user-provided {@link TwThemeConfig} by `provideTheme()`. */
+const TW_RESOLVED_THEMES = [
+    'light',
+    'dark',
+    'high-contrast',
+    'high-contrast-dark',
+];
+/**
+ * Built-in defaults merged under any user-provided {@link TwThemeConfig} by
+ * `provideTheme()`. Typed `Required<TwThemeConfig>` so readers keep a
+ * non-optional `string` / `TwTheme` for every field even though the interface
+ * itself is all-optional.
+ */
 const DEFAULT_TW_THEME_CONFIG = {
     defaultTheme: 'system',
     storageKey: 'ngx-tw-theme',
@@ -14,47 +30,110 @@ const DEFAULT_TW_THEME_CONFIG = {
     target: 'documentElement',
 };
 
-/** Injection token carrying the resolved {@link TwThemeConfig} (storage key, attribute, target element, default theme). */
-const THEME_CONFIG = new InjectionToken('THEME_CONFIG');
 /**
- * Registers {@link ThemeService} and a {@link THEME_CONFIG} value built by
- * merging `config` over {@link DEFAULT_TW_THEME_CONFIG}. Call once in the
- * app's environment providers.
+ * Injection token carrying the resolved {@link TwThemeConfig} (storage key,
+ * attribute, target element, default theme).
+ *
+ * The value is `Required<TwThemeConfig>`: `TwThemeConfig`'s members are
+ * optional so consumers can pass a partial config, but `provideTheme` fills
+ * every key from {@link DEFAULT_TW_THEME_CONFIG} before providing it. Injectors
+ * therefore still read a non-optional field for each setting, exactly as
+ * before this token's type was tightened.
+ */
+const TW_THEME_CONFIG = new InjectionToken('TW_THEME_CONFIG');
+/**
+ * @deprecated Renamed to {@link TW_THEME_CONFIG} for consistency with every
+ * other ngx-tw injection token. This is the *same token instance*, not a copy —
+ * providing under either name and injecting under the other resolves — so the
+ * rename is safe to adopt incrementally. Removed in the next major.
+ */
+const THEME_CONFIG = TW_THEME_CONFIG;
+/**
+ * Registers {@link ThemeService}, a {@link TW_THEME_CONFIG} value built by merging
+ * `config` over {@link DEFAULT_TW_THEME_CONFIG}, and an environment initializer
+ * that constructs the service at bootstrap. Call once in the app's environment
+ * providers.
+ *
+ * The initializer is what makes the call self-sufficient. Everything that
+ * applies a theme lives in `ThemeService`'s field initialisers and constructor
+ * effect, so without it the stored preference was read — and `data-theme`
+ * written — only once something happened to `inject(ThemeService)`. An app
+ * whose theme toggle sits in a lazily-loaded route therefore rendered every
+ * other route with no `data-theme` at all, silently falling back to the
+ * `prefers-color-scheme` CSS branch; the failure looked intermittent because
+ * it disappeared whenever the stored choice agreed with the OS. Injecting the
+ * service yourself is still supported and is idempotent.
+ *
+ * Keys explicitly set to `undefined` are dropped before merging. Root
+ * `tsconfig.json` does not set `exactOptionalPropertyTypes`, so
+ * `provideTheme({ storageKey: env.themeKey })` type-checks even when
+ * `env.themeKey` is `string | undefined` — and a plain spread would then write
+ * `undefined` into a field `TwThemeConfig` types as `string`, making
+ * `ThemeService` persist under the literal `localStorage` key `"undefined"`
+ * (and, for `attribute`, call `setAttribute("undefined", …)`).
+ *
+ * Providing the service does **not** write to `localStorage`; only an explicit
+ * `setTheme()` / `cycleTheme()` does. For a flash-free first paint when the
+ * stored choice disagrees with the OS, pair this with
+ * {@link TW_THEME_BOOTSTRAP_SCRIPT} in `index.html`.
  */
 function provideTheme(config) {
+    const overrides = Object.fromEntries(Object.entries(config ?? {}).filter(([, value]) => value !== undefined));
     return makeEnvironmentProviders([
         {
-            provide: THEME_CONFIG,
-            useValue: { ...DEFAULT_TW_THEME_CONFIG, ...config },
+            provide: TW_THEME_CONFIG,
+            useValue: { ...DEFAULT_TW_THEME_CONFIG, ...overrides },
         },
         ThemeService,
+        provideEnvironmentInitializer(() => {
+            inject(ThemeService);
+        }),
     ]);
 }
 
+/** OS colour-scheme query backing `'system'` resolution. */
+const DARK_QUERY = '(prefers-color-scheme: dark)';
+/** OS contrast query backing `'system'` → `'high-contrast'` / `'high-contrast-dark'` resolution. */
+const CONTRAST_QUERY = '(prefers-contrast: more)';
 /**
  * Stateful runtime service that owns the active theme, reacts to OS
- * `prefers-color-scheme` changes, persists the user selection to
- * `localStorage`, and writes the resolved theme onto the configured DOM
- * target as a `data-theme` attribute.
+ * `prefers-color-scheme` / `prefers-contrast` changes, persists an explicit
+ * user selection to `localStorage`, and writes the resolved theme onto the
+ * configured DOM target as a `data-theme` attribute.
  *
  * The selected {@link theme} may be `'system'` (defer to the OS); the
  * {@link resolvedTheme} computed from it is always one of `'light'`,
- * `'dark'`, or `'high-contrast'` — never `'system'`. Register via
- * {@link provideTheme} in the app's environment providers.
+ * `'dark'`, `'high-contrast'`, or `'high-contrast-dark'` — never `'system'`.
+ * Register via
+ * {@link provideTheme} in the app's environment providers; `provideTheme`
+ * also constructs the service at bootstrap, so injecting it is only needed
+ * to read or change the theme.
+ *
+ * Storage is written **only** by {@link setTheme} / {@link cycleTheme}.
+ * Merely providing the service never touches `localStorage`, so the
+ * configured `defaultTheme` keeps applying until the user actually picks
+ * something, and apps under a storage-consent flow can provide the service
+ * before consent is granted.
  */
 class ThemeService {
-    config = inject(THEME_CONFIG);
+    config = inject(TW_THEME_CONFIG);
     document = inject(DOCUMENT);
     isBrowser = isPlatformBrowser(inject(PLATFORM_ID));
     ngZone = inject(NgZone);
-    mediaQuery = null;
-    mediaListener = (e) => {
-        this.systemTheme.set(e.matches ? 'dark' : 'light');
+    darkQuery = null;
+    contrastQuery = null;
+    // One listener for both queries: the resolution rule reads them together, so
+    // a handler that only knew its own query would clobber the other's decision
+    // on the next OS tick. The event payload is deliberately ignored — a
+    // `MediaQueryList`'s `matches` is already updated when `change` fires, so
+    // re-reading both is the single source of truth.
+    mediaListener = () => {
+        this.systemTheme.set(this.detectSystemTheme());
     };
     /** The user-selected theme (may be `'system'`). */
     theme = signal(this.loadInitialTheme(), /* @ts-ignore */
     ...(ngDevMode ? [{ debugName: "theme" }] : /* istanbul ignore next */ []));
-    /** The OS color scheme preference. */
+    /** The OS appearance preference — `prefers-color-scheme` plus `prefers-contrast`. */
     systemTheme = signal(this.detectSystemTheme(), /* @ts-ignore */
     ...(ngDevMode ? [{ debugName: "systemTheme" }] : /* istanbul ignore next */ []));
     /** The resolved theme actually applied to the DOM (never `'system'`). */
@@ -63,14 +142,42 @@ class ThemeService {
         return t === 'system' ? this.systemTheme() : t;
     }, /* @ts-ignore */
     ...(ngDevMode ? [{ debugName: "resolvedTheme" }] : /* istanbul ignore next */ []));
-    /** True when the resolved theme is `'dark'`. */
-    isDark = computed(() => this.resolvedTheme() === 'dark', /* @ts-ignore */
+    /**
+     * True when the resolved theme is a **dark** scheme — `'dark'` or
+     * `'high-contrast-dark'`.
+     *
+     * It answers the appearance question, not "which scheme": the canonical use
+     * is picking a colour that has to sit on the page background (a chart grid,
+     * a canvas fill), and dark high contrast needs the dark answer there just as
+     * much as plain dark does. It is therefore **not** mutually exclusive with
+     * {@link isHighContrast}; branch on {@link resolvedTheme} for one case.
+     */
+    isDark = computed(() => {
+        const t = this.resolvedTheme();
+        return t === 'dark' || t === 'high-contrast-dark';
+    }, /* @ts-ignore */
     ...(ngDevMode ? [{ debugName: "isDark" }] : /* istanbul ignore next */ []));
-    /** True when the resolved theme is `'light'`. */
+    /**
+     * True when the resolved theme is exactly `'light'`.
+     *
+     * Deliberately narrower than {@link isDark}'s mirror image: the light-based
+     * `'high-contrast'` does **not** set it, because widening it would change
+     * what a shipped scheme reports to consumers already reading this flag.
+     * Use `!isDark()` for the appearance question.
+     */
     isLight = computed(() => this.resolvedTheme() === 'light', /* @ts-ignore */
     ...(ngDevMode ? [{ debugName: "isLight" }] : /* istanbul ignore next */ []));
-    /** True when the resolved theme is `'high-contrast'`. */
-    isHighContrast = computed(() => this.resolvedTheme() === 'high-contrast', /* @ts-ignore */
+    /**
+     * True when the resolved theme is an **increased-contrast** scheme —
+     * `'high-contrast'` or `'high-contrast-dark'`.
+     *
+     * It answers the contrast question, so it can be true at the same time as
+     * {@link isDark}.
+     */
+    isHighContrast = computed(() => {
+        const t = this.resolvedTheme();
+        return t === 'high-contrast' || t === 'high-contrast-dark';
+    }, /* @ts-ignore */
     ...(ngDevMode ? [{ debugName: "isHighContrast" }] : /* istanbul ignore next */ []));
     /** Snapshot of the full theme state — selected, resolved, system, and boolean flags. */
     state = computed(() => ({
@@ -84,38 +191,61 @@ class ThemeService {
     ...(ngDevMode ? [{ debugName: "state" }] : /* istanbul ignore next */ []));
     constructor() {
         if (this.isBrowser) {
-            // Register the media-query listener outside the Angular zone — it fires
-            // on OS theme changes, not user interaction, and we don't want zone.js
-            // bookkeeping for every system colour-scheme tick. The listener calls
+            // Register the media-query listeners outside the Angular zone — they fire
+            // on OS preference changes, not user interaction, and we don't want
+            // zone.js bookkeeping for every system tick. The listener calls
             // `signal.set()`, which schedules its own change detection.
+            // Both `MediaQueryList`s already exist: the `systemTheme` field
+            // initialiser above ran `detectSystemTheme()`, which mints them. The
+            // `??=` keeps this correct if that ever stops being true.
             this.ngZone.runOutsideAngular(() => {
-                this.mediaQuery = window.matchMedia('(prefers-color-scheme: dark)');
-                this.mediaQuery.addEventListener('change', this.mediaListener);
+                this.darkQuery ??= window.matchMedia(DARK_QUERY);
+                this.contrastQuery ??= window.matchMedia(CONTRAST_QUERY);
+                this.darkQuery.addEventListener('change', this.mediaListener);
+                this.contrastQuery.addEventListener('change', this.mediaListener);
             });
         }
         effect(() => {
-            const resolved = this.resolvedTheme();
-            const selected = this.theme();
-            this.applyToDocument(resolved);
-            this.persistTheme(selected);
+            this.applyToDocument(this.resolvedTheme());
         });
     }
-    /** Sets the selected theme. Pass `'system'` to follow the OS preference. */
+    /**
+     * Sets the selected theme and persists it. Pass `'system'` to follow the OS
+     * preference.
+     *
+     * This is the only entry point that writes to `localStorage` — see the note
+     * on the class.
+     */
     setTheme(theme) {
         this.theme.set(theme);
+        this.persistTheme(theme);
     }
-    /** Advances the selected theme to the next entry in {@link TW_THEMES}, wrapping around. */
+    /** Advances the selected theme to the next entry in {@link TW_THEMES}, wrapping around, and persists it. */
     cycleTheme() {
-        const current = this.theme();
-        const idx = TW_THEMES.indexOf(current);
-        this.theme.set(TW_THEMES[(idx + 1) % TW_THEMES.length]);
+        const idx = TW_THEMES.indexOf(this.theme());
+        this.setTheme(TW_THEMES[(idx + 1) % TW_THEMES.length]);
     }
-    /** Writes the configured theme attribute onto an arbitrary element — used to scope themes to a subtree. */
+    /**
+     * Writes the configured theme attribute onto an arbitrary element, scoping
+     * that subtree to the given theme.
+     *
+     * Each of the four schemes ships an element-agnostic `[data-theme=…]` block
+     * (`_light.css`, `_dark.css`, `_high-contrast.css`,
+     * `_high-contrast-dark.css`), so the tokens really do re-resolve on the
+     * element and cascade into its descendants — including back to `'light'`
+     * from inside a dark page.
+     *
+     * Caveat: those CSS blocks key off the literal `data-theme` attribute. If
+     * `provideTheme({ attribute })` renamed it, this method writes the renamed
+     * attribute and the shipped stylesheet will not react — a custom attribute
+     * only works with matching custom CSS.
+     */
     applyToElement(element, theme) {
         element.setAttribute(this.config.attribute, theme);
     }
     ngOnDestroy() {
-        this.mediaQuery?.removeEventListener('change', this.mediaListener);
+        this.darkQuery?.removeEventListener('change', this.mediaListener);
+        this.contrastQuery?.removeEventListener('change', this.mediaListener);
     }
     loadInitialTheme() {
         if (!this.isBrowser)
@@ -131,10 +261,35 @@ class ThemeService {
         }
         return this.config.defaultTheme;
     }
+    /**
+     * Resolves `'system'` against the OS.
+     *
+     * The two preferences are treated as independent axes and composed, not
+     * ranked: `prefers-color-scheme` picks the appearance and
+     * `prefers-contrast: more` picks the contrast, giving the full 2×2 —
+     * `light` / `dark` / `high-contrast` / `high-contrast-dark`.
+     *
+     * This is only correct because the library ships **both** high-contrast
+     * ramps. While `_high-contrast.css` was the only one, contrast had to be
+     * suppressed whenever the OS also asked for dark, or a user running dark +
+     * increased contrast — a common pairing — would have been moved from a dark
+     * surface onto a white one. `_high-contrast-dark.css` removed that
+     * constraint, so the ranking is gone; if a future change ever drops one of
+     * the two ramps, this method has to go back to ranking them.
+     *
+     * Both queries are minted here (not in the constructor) because the
+     * `systemTheme` field initialiser calls this before the constructor body
+     * runs; the constructor then attaches `change` listeners to the same two
+     * objects, so the resolution stays live rather than read-once.
+     */
     detectSystemTheme() {
         if (!this.isBrowser)
             return 'light';
-        return window.matchMedia('(prefers-color-scheme: dark)').matches ? 'dark' : 'light';
+        const prefersDark = (this.darkQuery ??= window.matchMedia(DARK_QUERY)).matches;
+        const prefersMoreContrast = (this.contrastQuery ??= window.matchMedia(CONTRAST_QUERY)).matches;
+        if (prefersMoreContrast)
+            return prefersDark ? 'high-contrast-dark' : 'high-contrast';
+        return prefersDark ? 'dark' : 'light';
     }
     applyToDocument(theme) {
         if (!this.isBrowser)
@@ -162,7 +317,20 @@ i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "22.0.7", ngImpor
         }], ctorParameters: () => [] });
 
 class ThemeDirective {
-    /** Scopes a subtree to a specific resolved theme by writing `data-theme` on the host. Required. */
+    /**
+     * Scopes a subtree to a specific resolved theme by writing `data-theme` on
+     * the host. Required.
+     *
+     * Works in every direction: each of the four schemes ships an
+     * element-agnostic `[data-theme="…"]` block (`_light.css`, `_dark.css`,
+     * `_high-contrast.css`, `_high-contrast-dark.css`), so a `'light'` pane
+     * inside a dark page re-resolves the tokens rather than inheriting the
+     * ancestor's.
+     *
+     * The attribute name is the literal `data-theme` that the shipped CSS keys
+     * off — it deliberately ignores `provideTheme({ attribute })`, since a
+     * renamed attribute matches none of those blocks.
+     */
     twTheme = input.required(/* @ts-ignore */
     ...(ngDevMode ? [{ debugName: "twTheme" }] : /* istanbul ignore next */ []));
     static ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "22.0.7", ngImport: i0, type: ThemeDirective, deps: [], target: i0.ɵɵFactoryTarget.Directive });
@@ -178,9 +346,53 @@ i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "22.0.7", ngImpor
                 }]
         }], propDecorators: { twTheme: [{ type: i0.Input, args: [{ isSignal: true, alias: "twTheme", required: true }] }] } });
 
+/**
+ * Body of an inline `<head>` script that applies a previously persisted theme
+ * before the app bundle runs, eliminating the flash of the wrong theme on
+ * reload.
+ *
+ * `ThemeService` cannot cover this case: it is JavaScript in the application
+ * bundle, so the browser has already painted by the time it writes
+ * `data-theme` — and `provideTheme`'s environment initializer does not change
+ * that. The CSS `@media (prefers-color-scheme: dark)` fallback covers users
+ * who never chose a theme; the flash is what an *explicit* choice that
+ * disagrees with the OS looks like — light chosen on a dark machine, or
+ * either high-contrast scheme chosen on a machine not already asking for
+ * increased contrast (the CSS has a `prefers-color-scheme` branch but
+ * deliberately no `prefers-contrast` one, so neither contrast scheme is
+ * reachable without an explicit `data-theme`).
+ *
+ * The string is built from {@link DEFAULT_TW_THEME_CONFIG}, so the storage key
+ * and attribute cannot drift from what `ThemeService` actually uses — that
+ * drift is the reason this ships as code rather than as a README snippet
+ * alone. Copy the literal script into `index.html`, or interpolate this
+ * constant during an SSR / index transform:
+ *
+ * ```html
+ * <head>
+ *   <script>try{var t=localStorage.getItem('ngx-tw-theme');if(t&&t!=='system')document.documentElement.setAttribute('data-theme',t)}catch(e){}</script>
+ * </head>
+ * ```
+ *
+ * Notes on the behaviour it deliberately does *not* have:
+ * - A stored `'system'` writes nothing, so the CSS `prefers-color-scheme`
+ *   fallback keeps deciding — which is exactly what `'system'` means.
+ * - It assumes the default `target: 'documentElement'`. A `<head>` script runs
+ *   before `<body>` exists, so `target: 'body'` cannot be bootstrapped this
+ *   way.
+ * - If you overrode `storageKey` or `attribute` via `provideTheme`, adapt the
+ *   literal snippet to match; this constant only encodes the defaults.
+ * - It is dependency-free and wrapped in `try`/`catch`, so a browser with
+ *   storage blocked falls through to the CSS behaviour instead of throwing
+ *   before the app loads.
+ */
+const TW_THEME_BOOTSTRAP_SCRIPT = `try{var t=localStorage.getItem(${JSON.stringify(DEFAULT_TW_THEME_CONFIG.storageKey)});` +
+    `if(t&&t!=='system')document.documentElement.setAttribute(` +
+    `${JSON.stringify(DEFAULT_TW_THEME_CONFIG.attribute)},t)}catch(e){}`;
+
 /**
  * Generated bundle index. Do not edit.
  */
 
-export { DEFAULT_TW_THEME_CONFIG, THEME_CONFIG, TW_RESOLVED_THEMES, TW_THEMES, ThemeDirective, ThemeService, provideTheme };
+export { DEFAULT_TW_THEME_CONFIG, THEME_CONFIG, TW_RESOLVED_THEMES, TW_THEMES, TW_THEME_BOOTSTRAP_SCRIPT, TW_THEME_CONFIG, ThemeDirective, ThemeService, provideTheme };
 //# sourceMappingURL=cdevhub-ngx-tw-theme.mjs.map

package/fesm2022/cdevhub-ngx-tw-theme.mjs.map

@@ -1 +1 @@
-{"version":3,"file":"cdevhub-ngx-tw-theme.mjs","sources":["../../../projects/ngx-tw/theme/theme.types.ts","../../../projects/ngx-tw/theme/theme.config.ts","../../../projects/ngx-tw/theme/theme.service.ts","../../../projects/ngx-tw/theme/theme.directive.ts","../../../projects/ngx-tw/theme/cdevhub-ngx-tw-theme.ts"],"sourcesContent":["/** The user-selectable theme. `'system'` defers to the OS `prefers-color-scheme` setting. */\nexport type TwTheme = 'light' | 'dark' | 'high-contrast' | 'system';\n\n/** The theme actually applied to the DOM after resolving `'system'` against the OS preference. */\nexport type TwResolvedTheme = 'light' | 'dark' | 'high-contrast';\n\n/** Ordered list of every {@link TwTheme} value, used by `cycleTheme()` and for UI iteration. */\nexport const TW_THEMES = ['light', 'dark', 'high-contrast', 'system'] as const satisfies readonly TwTheme[];\n\n/** Ordered list of every {@link TwResolvedTheme} value (i.e. {@link TW_THEMES} minus `'system'`). */\nexport const TW_RESOLVED_THEMES = ['light', 'dark', 'high-contrast'] as const satisfies readonly TwResolvedTheme[];\n\n/** Runtime configuration for {@link provideTheme}; controls storage, attribute name, target element, and default. */\nexport interface TwThemeConfig {\n  /** The default theme when no preference is stored. Defaults to `'system'`. */\n  defaultTheme: TwTheme;\n  /** localStorage key for persisting theme preference. Defaults to `'ngx-tw-theme'`. */\n  storageKey: string;\n  /** The HTML attribute written to the target element. Defaults to `'data-theme'`. */\n  attribute: string;\n  /** Which element receives the theme attribute. Defaults to `'documentElement'`. */\n  target: 'documentElement' | 'body';\n}\n\n/** Composite snapshot of `ThemeService` state — selected, resolved, system, and boolean flags. */\nexport interface TwThemeState {\n  /** The user-selected theme — may be `'system'`. */\n  readonly theme: TwTheme;\n  /** The theme actually applied to the DOM — never `'system'`. */\n  readonly resolvedTheme: TwResolvedTheme;\n  /** The OS color-scheme preference detected via `prefers-color-scheme`. */\n  readonly systemTheme: TwResolvedTheme;\n  /** True when {@link resolvedTheme} is `'dark'`. */\n  readonly isDark: boolean;\n  /** True when {@link resolvedTheme} is `'light'`. */\n  readonly isLight: boolean;\n  /** True when {@link resolvedTheme} is `'high-contrast'`. */\n  readonly isHighContrast: boolean;\n}\n\n/** Built-in defaults merged under any user-provided {@link TwThemeConfig} by `provideTheme()`. */\nexport const DEFAULT_TW_THEME_CONFIG: TwThemeConfig = {\n  defaultTheme: 'system',\n  storageKey: 'ngx-tw-theme',\n  attribute: 'data-theme',\n  target: 'documentElement',\n};\n","import { InjectionToken, makeEnvironmentProviders, type EnvironmentProviders } from '@angular/core';\nimport { type TwThemeConfig, DEFAULT_TW_THEME_CONFIG } from './theme.types';\nimport { ThemeService } from './theme.service';\n\n/** Injection token carrying the resolved {@link TwThemeConfig} (storage key, attribute, target element, default theme). */\nexport const THEME_CONFIG = new InjectionToken<TwThemeConfig>('THEME_CONFIG');\n\n/**\n * Registers {@link ThemeService} and a {@link THEME_CONFIG} value built by\n * merging `config` over {@link DEFAULT_TW_THEME_CONFIG}. Call once in the\n * app's environment providers.\n */\nexport function provideTheme(config?: Partial<TwThemeConfig>): EnvironmentProviders {\n  return makeEnvironmentProviders([\n    {\n      provide: THEME_CONFIG,\n      useValue: { ...DEFAULT_TW_THEME_CONFIG, ...config },\n    },\n    ThemeService,\n  ]);\n}\n","import {\n  Injectable,\n  NgZone,\n  computed,\n  effect,\n  inject,\n  signal,\n  PLATFORM_ID,\n  type OnDestroy,\n} from '@angular/core';\nimport { DOCUMENT, isPlatformBrowser } from '@angular/common';\nimport { THEME_CONFIG } from './theme.config';\nimport { TW_THEMES, type TwTheme, type TwResolvedTheme, type TwThemeState } from './theme.types';\n\n/**\n * Stateful runtime service that owns the active theme, reacts to OS\n * `prefers-color-scheme` changes, persists the user selection to\n * `localStorage`, and writes the resolved theme onto the configured DOM\n * target as a `data-theme` attribute.\n *\n * The selected {@link theme} may be `'system'` (defer to the OS); the\n * {@link resolvedTheme} computed from it is always one of `'light'`,\n * `'dark'`, or `'high-contrast'` — never `'system'`. Register via\n * {@link provideTheme} in the app's environment providers.\n */\n@Injectable()\nexport class ThemeService implements OnDestroy {\n  private readonly config = inject(THEME_CONFIG);\n  private readonly document = inject(DOCUMENT);\n  private readonly isBrowser = isPlatformBrowser(inject(PLATFORM_ID));\n  private readonly ngZone = inject(NgZone);\n\n  private mediaQuery: MediaQueryList | null = null;\n  private readonly mediaListener = (e: MediaQueryListEvent) => {\n    this.systemTheme.set(e.matches ? 'dark' : 'light');\n  };\n\n  /** The user-selected theme (may be `'system'`). */\n  readonly theme = signal<TwTheme>(this.loadInitialTheme());\n\n  /** The OS color scheme preference. */\n  readonly systemTheme = signal<TwResolvedTheme>(this.detectSystemTheme());\n\n  /** The resolved theme actually applied to the DOM (never `'system'`). */\n  readonly resolvedTheme = computed<TwResolvedTheme>(() => {\n    const t = this.theme();\n    return t === 'system' ? this.systemTheme() : t;\n  });\n\n  /** True when the resolved theme is `'dark'`. */\n  readonly isDark = computed(() => this.resolvedTheme() === 'dark');\n  /** True when the resolved theme is `'light'`. */\n  readonly isLight = computed(() => this.resolvedTheme() === 'light');\n  /** True when the resolved theme is `'high-contrast'`. */\n  readonly isHighContrast = computed(() => this.resolvedTheme() === 'high-contrast');\n\n  /** Snapshot of the full theme state — selected, resolved, system, and boolean flags. */\n  readonly state = computed<TwThemeState>(() => ({\n    theme: this.theme(),\n    resolvedTheme: this.resolvedTheme(),\n    systemTheme: this.systemTheme(),\n    isDark: this.isDark(),\n    isLight: this.isLight(),\n    isHighContrast: this.isHighContrast(),\n  }));\n\n  constructor() {\n    if (this.isBrowser) {\n      // Register the media-query listener outside the Angular zone — it fires\n      // on OS theme changes, not user interaction, and we don't want zone.js\n      // bookkeeping for every system colour-scheme tick. The listener calls\n      // `signal.set()`, which schedules its own change detection.\n      this.ngZone.runOutsideAngular(() => {\n        this.mediaQuery = window.matchMedia('(prefers-color-scheme: dark)');\n        this.mediaQuery.addEventListener('change', this.mediaListener);\n      });\n    }\n\n    effect(() => {\n      const resolved = this.resolvedTheme();\n      const selected = this.theme();\n      this.applyToDocument(resolved);\n      this.persistTheme(selected);\n    });\n  }\n\n  /** Sets the selected theme. Pass `'system'` to follow the OS preference. */\n  setTheme(theme: TwTheme): void {\n    this.theme.set(theme);\n  }\n\n  /** Advances the selected theme to the next entry in {@link TW_THEMES}, wrapping around. */\n  cycleTheme(): void {\n    const current = this.theme();\n    const idx = TW_THEMES.indexOf(current);\n    this.theme.set(TW_THEMES[(idx + 1) % TW_THEMES.length]);\n  }\n\n  /** Writes the configured theme attribute onto an arbitrary element — used to scope themes to a subtree. */\n  applyToElement(element: HTMLElement, theme: TwResolvedTheme): void {\n    element.setAttribute(this.config.attribute, theme);\n  }\n\n  ngOnDestroy(): void {\n    this.mediaQuery?.removeEventListener('change', this.mediaListener);\n  }\n\n  private loadInitialTheme(): TwTheme {\n    if (!this.isBrowser) return this.config.defaultTheme;\n    try {\n      const stored = localStorage.getItem(this.config.storageKey);\n      if (stored && (TW_THEMES as readonly string[]).includes(stored)) {\n        return stored as TwTheme;\n      }\n    } catch {\n      /* localStorage unavailable */\n    }\n    return this.config.defaultTheme;\n  }\n\n  private detectSystemTheme(): TwResolvedTheme {\n    if (!this.isBrowser) return 'light';\n    return window.matchMedia('(prefers-color-scheme: dark)').matches ? 'dark' : 'light';\n  }\n\n  private applyToDocument(theme: TwResolvedTheme): void {\n    if (!this.isBrowser) return;\n    const target =\n      this.config.target === 'documentElement'\n        ? this.document.documentElement\n        : this.document.body;\n    target.setAttribute(this.config.attribute, theme);\n  }\n\n  private persistTheme(theme: TwTheme): void {\n    if (!this.isBrowser) return;\n    try {\n      localStorage.setItem(this.config.storageKey, theme);\n    } catch {\n      /* localStorage unavailable */\n    }\n  }\n}\n","import { Directive, input } from '@angular/core';\nimport type { TwResolvedTheme } from './theme.types';\n\n@Directive({\n  selector: '[twTheme]',\n  host: {\n    '[attr.data-theme]': 'twTheme()',\n  },\n})\nexport class ThemeDirective {\n  /** Scopes a subtree to a specific resolved theme by writing `data-theme` on the host. Required. */\n  readonly twTheme = input.required<TwResolvedTheme>();\n}\n","/**\n * Generated bundle index. Do not edit.\n */\n\nexport * from './index';\n"],"names":[],"mappings":"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"}
+{"version":3,"file":"cdevhub-ngx-tw-theme.mjs","sources":["../../../projects/ngx-tw/theme/theme.types.ts","../../../projects/ngx-tw/theme/theme.config.ts","../../../projects/ngx-tw/theme/theme.service.ts","../../../projects/ngx-tw/theme/theme.directive.ts","../../../projects/ngx-tw/theme/theme.bootstrap.ts","../../../projects/ngx-tw/theme/cdevhub-ngx-tw-theme.ts"],"sourcesContent":["/**\n * The user-selectable theme. `'system'` defers to the OS, resolving\n * `prefers-color-scheme` and `prefers-contrast` as two independent axes: dark\n * plus increased contrast lands on `'high-contrast-dark'`, light plus increased\n * contrast on `'high-contrast'`.\n */\nexport type TwTheme = 'light' | 'dark' | 'high-contrast' | 'high-contrast-dark' | 'system';\n\n/**\n * The theme actually applied to the DOM after resolving `'system'` against the\n * OS preference.\n *\n * The two axes are appearance (light / dark) and contrast (normal / increased),\n * so the four values are their product: `'high-contrast'` is the light-based\n * increased-contrast scheme and `'high-contrast-dark'` the dark-based one.\n */\nexport type TwResolvedTheme = 'light' | 'dark' | 'high-contrast' | 'high-contrast-dark';\n\n/** Ordered list of every {@link TwTheme} value, used by `cycleTheme()` and for UI iteration. */\nexport const TW_THEMES = [\n  'light',\n  'dark',\n  'high-contrast',\n  'high-contrast-dark',\n  'system',\n] as const satisfies readonly TwTheme[];\n\n/** Ordered list of every {@link TwResolvedTheme} value (i.e. {@link TW_THEMES} minus `'system'`). */\nexport const TW_RESOLVED_THEMES = [\n  'light',\n  'dark',\n  'high-contrast',\n  'high-contrast-dark',\n] as const satisfies readonly TwResolvedTheme[];\n\n/**\n * Runtime configuration for {@link provideTheme}; controls storage, attribute\n * name, target element, and default.\n *\n * Every member is optional. This interface only ever reaches consumers through\n * `provideTheme(config?: Partial<TwThemeConfig>)`, which fills each unset key\n * from {@link DEFAULT_TW_THEME_CONFIG} — so a consumer holding a config object\n * typed as `TwThemeConfig` must not be forced to restate keys they do not\n * override, and adding a member in a future minor must not break them. The\n * resolved value handed to {@link TW_THEME_CONFIG} is `Required<TwThemeConfig>`.\n */\nexport interface TwThemeConfig {\n  /** The default theme when no preference is stored. Defaults to `'system'`. */\n  defaultTheme?: TwTheme;\n  /**\n   * localStorage key for persisting an explicit theme choice. Defaults to\n   * `'ngx-tw-theme'`. Only `setTheme()` / `cycleTheme()` write it — providing\n   * the service never does.\n   */\n  storageKey?: string;\n  /** The HTML attribute written to the target element. Defaults to `'data-theme'`. */\n  attribute?: string;\n  /** Which element receives the theme attribute. Defaults to `'documentElement'`. */\n  target?: 'documentElement' | 'body';\n}\n\n/**\n * Composite snapshot of `ThemeService` state — selected, resolved, system, and\n * boolean flags.\n *\n * The three flags are **not** mutually exclusive: `'high-contrast-dark'` sets\n * both {@link isDark} and {@link isHighContrast}, because it is dark *and*\n * high contrast. Branch on {@link resolvedTheme} when you need one case.\n */\nexport interface TwThemeState {\n  /** The user-selected theme — may be `'system'`. */\n  readonly theme: TwTheme;\n  /** The theme actually applied to the DOM — never `'system'`. */\n  readonly resolvedTheme: TwResolvedTheme;\n  /** The OS appearance preference detected via `prefers-color-scheme` and `prefers-contrast`. */\n  readonly systemTheme: TwResolvedTheme;\n  /** True when {@link resolvedTheme} is a dark scheme — `'dark'` or `'high-contrast-dark'`. */\n  readonly isDark: boolean;\n  /** True when {@link resolvedTheme} is exactly `'light'`; the light-based `'high-contrast'` does not set it. */\n  readonly isLight: boolean;\n  /** True when {@link resolvedTheme} is an increased-contrast scheme — `'high-contrast'` or `'high-contrast-dark'`. */\n  readonly isHighContrast: boolean;\n}\n\n/**\n * Built-in defaults merged under any user-provided {@link TwThemeConfig} by\n * `provideTheme()`. Typed `Required<TwThemeConfig>` so readers keep a\n * non-optional `string` / `TwTheme` for every field even though the interface\n * itself is all-optional.\n */\nexport const DEFAULT_TW_THEME_CONFIG: Required<TwThemeConfig> = {\n  defaultTheme: 'system',\n  storageKey: 'ngx-tw-theme',\n  attribute: 'data-theme',\n  target: 'documentElement',\n};\n","import {\n  InjectionToken,\n  inject,\n  makeEnvironmentProviders,\n  provideEnvironmentInitializer,\n  type EnvironmentProviders,\n} from '@angular/core';\nimport { type TwThemeConfig, DEFAULT_TW_THEME_CONFIG } from './theme.types';\nimport { ThemeService } from './theme.service';\n\n/**\n * Injection token carrying the resolved {@link TwThemeConfig} (storage key,\n * attribute, target element, default theme).\n *\n * The value is `Required<TwThemeConfig>`: `TwThemeConfig`'s members are\n * optional so consumers can pass a partial config, but `provideTheme` fills\n * every key from {@link DEFAULT_TW_THEME_CONFIG} before providing it. Injectors\n * therefore still read a non-optional field for each setting, exactly as\n * before this token's type was tightened.\n */\nexport const TW_THEME_CONFIG = new InjectionToken<Required<TwThemeConfig>>('TW_THEME_CONFIG');\n\n/**\n * @deprecated Renamed to {@link TW_THEME_CONFIG} for consistency with every\n * other ngx-tw injection token. This is the *same token instance*, not a copy —\n * providing under either name and injecting under the other resolves — so the\n * rename is safe to adopt incrementally. Removed in the next major.\n */\nexport const THEME_CONFIG = TW_THEME_CONFIG;\n\n/**\n * Registers {@link ThemeService}, a {@link TW_THEME_CONFIG} value built by merging\n * `config` over {@link DEFAULT_TW_THEME_CONFIG}, and an environment initializer\n * that constructs the service at bootstrap. Call once in the app's environment\n * providers.\n *\n * The initializer is what makes the call self-sufficient. Everything that\n * applies a theme lives in `ThemeService`'s field initialisers and constructor\n * effect, so without it the stored preference was read — and `data-theme`\n * written — only once something happened to `inject(ThemeService)`. An app\n * whose theme toggle sits in a lazily-loaded route therefore rendered every\n * other route with no `data-theme` at all, silently falling back to the\n * `prefers-color-scheme` CSS branch; the failure looked intermittent because\n * it disappeared whenever the stored choice agreed with the OS. Injecting the\n * service yourself is still supported and is idempotent.\n *\n * Keys explicitly set to `undefined` are dropped before merging. Root\n * `tsconfig.json` does not set `exactOptionalPropertyTypes`, so\n * `provideTheme({ storageKey: env.themeKey })` type-checks even when\n * `env.themeKey` is `string | undefined` — and a plain spread would then write\n * `undefined` into a field `TwThemeConfig` types as `string`, making\n * `ThemeService` persist under the literal `localStorage` key `\"undefined\"`\n * (and, for `attribute`, call `setAttribute(\"undefined\", …)`).\n *\n * Providing the service does **not** write to `localStorage`; only an explicit\n * `setTheme()` / `cycleTheme()` does. For a flash-free first paint when the\n * stored choice disagrees with the OS, pair this with\n * {@link TW_THEME_BOOTSTRAP_SCRIPT} in `index.html`.\n */\nexport function provideTheme(config?: Partial<TwThemeConfig>): EnvironmentProviders {\n  const overrides = Object.fromEntries(\n    Object.entries(config ?? {}).filter(([, value]) => value !== undefined),\n  );\n  return makeEnvironmentProviders([\n    {\n      provide: TW_THEME_CONFIG,\n      useValue: { ...DEFAULT_TW_THEME_CONFIG, ...overrides } as Required<TwThemeConfig>,\n    },\n    ThemeService,\n    provideEnvironmentInitializer(() => {\n      inject(ThemeService);\n    }),\n  ]);\n}\n","import {\n  Injectable,\n  NgZone,\n  computed,\n  effect,\n  inject,\n  signal,\n  PLATFORM_ID,\n  type OnDestroy,\n} from '@angular/core';\nimport { DOCUMENT, isPlatformBrowser } from '@angular/common';\nimport { TW_THEME_CONFIG } from './theme.config';\nimport { TW_THEMES, type TwTheme, type TwResolvedTheme, type TwThemeState } from './theme.types';\n\n/** OS colour-scheme query backing `'system'` resolution. */\nconst DARK_QUERY = '(prefers-color-scheme: dark)';\n\n/** OS contrast query backing `'system'` → `'high-contrast'` / `'high-contrast-dark'` resolution. */\nconst CONTRAST_QUERY = '(prefers-contrast: more)';\n\n/**\n * Stateful runtime service that owns the active theme, reacts to OS\n * `prefers-color-scheme` / `prefers-contrast` changes, persists an explicit\n * user selection to `localStorage`, and writes the resolved theme onto the\n * configured DOM target as a `data-theme` attribute.\n *\n * The selected {@link theme} may be `'system'` (defer to the OS); the\n * {@link resolvedTheme} computed from it is always one of `'light'`,\n * `'dark'`, `'high-contrast'`, or `'high-contrast-dark'` — never `'system'`.\n * Register via\n * {@link provideTheme} in the app's environment providers; `provideTheme`\n * also constructs the service at bootstrap, so injecting it is only needed\n * to read or change the theme.\n *\n * Storage is written **only** by {@link setTheme} / {@link cycleTheme}.\n * Merely providing the service never touches `localStorage`, so the\n * configured `defaultTheme` keeps applying until the user actually picks\n * something, and apps under a storage-consent flow can provide the service\n * before consent is granted.\n */\n@Injectable()\nexport class ThemeService implements OnDestroy {\n  private readonly config = inject(TW_THEME_CONFIG);\n  private readonly document = inject(DOCUMENT);\n  private readonly isBrowser = isPlatformBrowser(inject(PLATFORM_ID));\n  private readonly ngZone = inject(NgZone);\n\n  private darkQuery: MediaQueryList | null = null;\n  private contrastQuery: MediaQueryList | null = null;\n\n  // One listener for both queries: the resolution rule reads them together, so\n  // a handler that only knew its own query would clobber the other's decision\n  // on the next OS tick. The event payload is deliberately ignored — a\n  // `MediaQueryList`'s `matches` is already updated when `change` fires, so\n  // re-reading both is the single source of truth.\n  private readonly mediaListener = () => {\n    this.systemTheme.set(this.detectSystemTheme());\n  };\n\n  /** The user-selected theme (may be `'system'`). */\n  readonly theme = signal<TwTheme>(this.loadInitialTheme());\n\n  /** The OS appearance preference — `prefers-color-scheme` plus `prefers-contrast`. */\n  readonly systemTheme = signal<TwResolvedTheme>(this.detectSystemTheme());\n\n  /** The resolved theme actually applied to the DOM (never `'system'`). */\n  readonly resolvedTheme = computed<TwResolvedTheme>(() => {\n    const t = this.theme();\n    return t === 'system' ? this.systemTheme() : t;\n  });\n\n  /**\n   * True when the resolved theme is a **dark** scheme — `'dark'` or\n   * `'high-contrast-dark'`.\n   *\n   * It answers the appearance question, not \"which scheme\": the canonical use\n   * is picking a colour that has to sit on the page background (a chart grid,\n   * a canvas fill), and dark high contrast needs the dark answer there just as\n   * much as plain dark does. It is therefore **not** mutually exclusive with\n   * {@link isHighContrast}; branch on {@link resolvedTheme} for one case.\n   */\n  readonly isDark = computed(() => {\n    const t = this.resolvedTheme();\n    return t === 'dark' || t === 'high-contrast-dark';\n  });\n  /**\n   * True when the resolved theme is exactly `'light'`.\n   *\n   * Deliberately narrower than {@link isDark}'s mirror image: the light-based\n   * `'high-contrast'` does **not** set it, because widening it would change\n   * what a shipped scheme reports to consumers already reading this flag.\n   * Use `!isDark()` for the appearance question.\n   */\n  readonly isLight = computed(() => this.resolvedTheme() === 'light');\n  /**\n   * True when the resolved theme is an **increased-contrast** scheme —\n   * `'high-contrast'` or `'high-contrast-dark'`.\n   *\n   * It answers the contrast question, so it can be true at the same time as\n   * {@link isDark}.\n   */\n  readonly isHighContrast = computed(() => {\n    const t = this.resolvedTheme();\n    return t === 'high-contrast' || t === 'high-contrast-dark';\n  });\n\n  /** Snapshot of the full theme state — selected, resolved, system, and boolean flags. */\n  readonly state = computed<TwThemeState>(() => ({\n    theme: this.theme(),\n    resolvedTheme: this.resolvedTheme(),\n    systemTheme: this.systemTheme(),\n    isDark: this.isDark(),\n    isLight: this.isLight(),\n    isHighContrast: this.isHighContrast(),\n  }));\n\n  constructor() {\n    if (this.isBrowser) {\n      // Register the media-query listeners outside the Angular zone — they fire\n      // on OS preference changes, not user interaction, and we don't want\n      // zone.js bookkeeping for every system tick. The listener calls\n      // `signal.set()`, which schedules its own change detection.\n      // Both `MediaQueryList`s already exist: the `systemTheme` field\n      // initialiser above ran `detectSystemTheme()`, which mints them. The\n      // `??=` keeps this correct if that ever stops being true.\n      this.ngZone.runOutsideAngular(() => {\n        this.darkQuery ??= window.matchMedia(DARK_QUERY);\n        this.contrastQuery ??= window.matchMedia(CONTRAST_QUERY);\n        this.darkQuery.addEventListener('change', this.mediaListener);\n        this.contrastQuery.addEventListener('change', this.mediaListener);\n      });\n    }\n\n    effect(() => {\n      this.applyToDocument(this.resolvedTheme());\n    });\n  }\n\n  /**\n   * Sets the selected theme and persists it. Pass `'system'` to follow the OS\n   * preference.\n   *\n   * This is the only entry point that writes to `localStorage` — see the note\n   * on the class.\n   */\n  setTheme(theme: TwTheme): void {\n    this.theme.set(theme);\n    this.persistTheme(theme);\n  }\n\n  /** Advances the selected theme to the next entry in {@link TW_THEMES}, wrapping around, and persists it. */\n  cycleTheme(): void {\n    const idx = TW_THEMES.indexOf(this.theme());\n    this.setTheme(TW_THEMES[(idx + 1) % TW_THEMES.length]);\n  }\n\n  /**\n   * Writes the configured theme attribute onto an arbitrary element, scoping\n   * that subtree to the given theme.\n   *\n   * Each of the four schemes ships an element-agnostic `[data-theme=…]` block\n   * (`_light.css`, `_dark.css`, `_high-contrast.css`,\n   * `_high-contrast-dark.css`), so the tokens really do re-resolve on the\n   * element and cascade into its descendants — including back to `'light'`\n   * from inside a dark page.\n   *\n   * Caveat: those CSS blocks key off the literal `data-theme` attribute. If\n   * `provideTheme({ attribute })` renamed it, this method writes the renamed\n   * attribute and the shipped stylesheet will not react — a custom attribute\n   * only works with matching custom CSS.\n   */\n  applyToElement(element: HTMLElement, theme: TwResolvedTheme): void {\n    element.setAttribute(this.config.attribute, theme);\n  }\n\n  ngOnDestroy(): void {\n    this.darkQuery?.removeEventListener('change', this.mediaListener);\n    this.contrastQuery?.removeEventListener('change', this.mediaListener);\n  }\n\n  private loadInitialTheme(): TwTheme {\n    if (!this.isBrowser) return this.config.defaultTheme;\n    try {\n      const stored = localStorage.getItem(this.config.storageKey);\n      if (stored && (TW_THEMES as readonly string[]).includes(stored)) {\n        return stored as TwTheme;\n      }\n    } catch {\n      /* localStorage unavailable */\n    }\n    return this.config.defaultTheme;\n  }\n\n  /**\n   * Resolves `'system'` against the OS.\n   *\n   * The two preferences are treated as independent axes and composed, not\n   * ranked: `prefers-color-scheme` picks the appearance and\n   * `prefers-contrast: more` picks the contrast, giving the full 2×2 —\n   * `light` / `dark` / `high-contrast` / `high-contrast-dark`.\n   *\n   * This is only correct because the library ships **both** high-contrast\n   * ramps. While `_high-contrast.css` was the only one, contrast had to be\n   * suppressed whenever the OS also asked for dark, or a user running dark +\n   * increased contrast — a common pairing — would have been moved from a dark\n   * surface onto a white one. `_high-contrast-dark.css` removed that\n   * constraint, so the ranking is gone; if a future change ever drops one of\n   * the two ramps, this method has to go back to ranking them.\n   *\n   * Both queries are minted here (not in the constructor) because the\n   * `systemTheme` field initialiser calls this before the constructor body\n   * runs; the constructor then attaches `change` listeners to the same two\n   * objects, so the resolution stays live rather than read-once.\n   */\n  private detectSystemTheme(): TwResolvedTheme {\n    if (!this.isBrowser) return 'light';\n    const prefersDark = (this.darkQuery ??= window.matchMedia(DARK_QUERY)).matches;\n    const prefersMoreContrast = (this.contrastQuery ??= window.matchMedia(CONTRAST_QUERY)).matches;\n    if (prefersMoreContrast) return prefersDark ? 'high-contrast-dark' : 'high-contrast';\n    return prefersDark ? 'dark' : 'light';\n  }\n\n  private applyToDocument(theme: TwResolvedTheme): void {\n    if (!this.isBrowser) return;\n    const target =\n      this.config.target === 'documentElement'\n        ? this.document.documentElement\n        : this.document.body;\n    target.setAttribute(this.config.attribute, theme);\n  }\n\n  private persistTheme(theme: TwTheme): void {\n    if (!this.isBrowser) return;\n    try {\n      localStorage.setItem(this.config.storageKey, theme);\n    } catch {\n      /* localStorage unavailable */\n    }\n  }\n}\n","import { Directive, input } from '@angular/core';\nimport type { TwResolvedTheme } from './theme.types';\n\n@Directive({\n  selector: '[twTheme]',\n  host: {\n    '[attr.data-theme]': 'twTheme()',\n  },\n})\nexport class ThemeDirective {\n  /**\n   * Scopes a subtree to a specific resolved theme by writing `data-theme` on\n   * the host. Required.\n   *\n   * Works in every direction: each of the four schemes ships an\n   * element-agnostic `[data-theme=\"…\"]` block (`_light.css`, `_dark.css`,\n   * `_high-contrast.css`, `_high-contrast-dark.css`), so a `'light'` pane\n   * inside a dark page re-resolves the tokens rather than inheriting the\n   * ancestor's.\n   *\n   * The attribute name is the literal `data-theme` that the shipped CSS keys\n   * off — it deliberately ignores `provideTheme({ attribute })`, since a\n   * renamed attribute matches none of those blocks.\n   */\n  readonly twTheme = input.required<TwResolvedTheme>();\n}\n","import { DEFAULT_TW_THEME_CONFIG } from './theme.types';\n\n/**\n * Body of an inline `<head>` script that applies a previously persisted theme\n * before the app bundle runs, eliminating the flash of the wrong theme on\n * reload.\n *\n * `ThemeService` cannot cover this case: it is JavaScript in the application\n * bundle, so the browser has already painted by the time it writes\n * `data-theme` — and `provideTheme`'s environment initializer does not change\n * that. The CSS `@media (prefers-color-scheme: dark)` fallback covers users\n * who never chose a theme; the flash is what an *explicit* choice that\n * disagrees with the OS looks like — light chosen on a dark machine, or\n * either high-contrast scheme chosen on a machine not already asking for\n * increased contrast (the CSS has a `prefers-color-scheme` branch but\n * deliberately no `prefers-contrast` one, so neither contrast scheme is\n * reachable without an explicit `data-theme`).\n *\n * The string is built from {@link DEFAULT_TW_THEME_CONFIG}, so the storage key\n * and attribute cannot drift from what `ThemeService` actually uses — that\n * drift is the reason this ships as code rather than as a README snippet\n * alone. Copy the literal script into `index.html`, or interpolate this\n * constant during an SSR / index transform:\n *\n * ```html\n * <head>\n *   <script>try{var t=localStorage.getItem('ngx-tw-theme');if(t&&t!=='system')document.documentElement.setAttribute('data-theme',t)}catch(e){}</script>\n * </head>\n * ```\n *\n * Notes on the behaviour it deliberately does *not* have:\n * - A stored `'system'` writes nothing, so the CSS `prefers-color-scheme`\n *   fallback keeps deciding — which is exactly what `'system'` means.\n * - It assumes the default `target: 'documentElement'`. A `<head>` script runs\n *   before `<body>` exists, so `target: 'body'` cannot be bootstrapped this\n *   way.\n * - If you overrode `storageKey` or `attribute` via `provideTheme`, adapt the\n *   literal snippet to match; this constant only encodes the defaults.\n * - It is dependency-free and wrapped in `try`/`catch`, so a browser with\n *   storage blocked falls through to the CSS behaviour instead of throwing\n *   before the app loads.\n */\nexport const TW_THEME_BOOTSTRAP_SCRIPT =\n  `try{var t=localStorage.getItem(${JSON.stringify(DEFAULT_TW_THEME_CONFIG.storageKey)});` +\n  `if(t&&t!=='system')document.documentElement.setAttribute(` +\n  `${JSON.stringify(DEFAULT_TW_THEME_CONFIG.attribute)},t)}catch(e){}`;\n","/**\n * Generated bundle index. Do not edit.\n */\n\nexport * from './index';\n"],"names":[],"mappings":"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"}