@just-web/css 0.6.1 → 0.8.0

package/esm/theme/data-attribute.d.ts

@@ -1,84 +0,0 @@
-/**
- * Gets the theme based on a data attribute value.
- *
- * @param options - Configuration options
- * @param options.themes - Record mapping theme keys to their data attribute values
- * @param options.defaultTheme - Fallback theme key if attribute value doesn't match any theme
- * @param options.attributeName - Name of the data attribute to check (must start with 'data-')
- * @param options.allowCustom - Whether to allow custom themes value
- * @returns The matching theme key, or defaultTheme if no match found
- *
- * @example
- * ```ts
- * const themes = {
- *   light: 'light',
- *   dark: 'dark',
- *   system: 'system'
- * }
- *
- * // Get theme from data-theme attribute
- * const theme = getThemeByDataAttribute({
- *   themes,
- *   defaultTheme: 'system',
- *   attributeName: 'data-theme'
- * })
- * ```
- */
-export declare function getThemeByDataAttribute<Themes extends Record<string, string>>(options: {
-    attributeName: `data-${string}`;
-    defaultTheme?: keyof Themes | undefined;
-    themes: Themes;
-    element?: Element | undefined;
-}): keyof Themes | undefined;
-export declare function getThemeByDataAttribute<Themes extends Record<string, string>>(options: {
-    attributeName: `data-${string}`;
-    allowCustom: true | undefined;
-    defaultTheme?: keyof Themes | undefined;
-    themes: Themes;
-    element?: Element | undefined;
-}): string | undefined;
-/**
- * Observes changes to a theme data attribute and calls a handler when it changes.
- *
- * @param options - Configuration options
- * @param options.themes - Record mapping theme keys to their data attribute values
- * @param options.handler - Callback function called with the new theme value or null when removed
- * @param options.defaultTheme - Fallback theme key if attribute value doesn't match any theme
- * @param options.attributeName - Name of the data attribute to observe (must start with 'data-')
- * @returns A MutationObserver that can be disconnected to stop observing
- *
- * @example
- * ```ts
- * const themes = {
- *   light: 'light',
- *   dark: 'dark'
- * }
- *
- * // Observe data-theme attribute changes
- * const observer = observeThemeByDataAttributes({
- *   themes,
- *   handler: (theme) => console.log('Theme changed to:', theme),
- *   defaultTheme: 'light',
- *   attributeName: 'data-theme'
- * })
- *
- * // Stop observing
- * observer.disconnect()
- * ```
- */
-export declare function observeThemeByDataAttributes<Themes extends Record<string, string>>(options: {
-    attributeName: `data-${string}`;
-    themes: Themes;
-    handler: (value: string | null) => void;
-    defaultTheme?: keyof Themes | undefined;
-    element?: Element | undefined;
-}): MutationObserver;
-export declare function observeThemeByDataAttributes<Themes extends Record<string, string>>(options: {
-    attributeName: `data-${string}`;
-    themes: Themes;
-    handler: (value: string | null) => void;
-    allowCustom: true | undefined;
-    defaultTheme?: keyof Themes | undefined;
-    element?: Element | undefined;
-}): MutationObserver;
-//# sourceMappingURL=data-attribute.d.ts.map

package/esm/theme/data-attribute.d.ts.map

@@ -1 +0,0 @@
-{"version":3,"file":"data-attribute.d.ts","sourceRoot":"","sources":["../../src/theme/data-attribute.ts"],"names":[],"mappings":"AAGA;;;;;;;;;;;;;;;;;;;;;;;;;GAyBG;AACH,wBAAgB,uBAAuB,CAAC,MAAM,SAAS,MAAM,CAAC,MAAM,EAAE,MAAM,CAAC,EAAE,OAAO,EAAE;IACvF,aAAa,EAAE,QAAQ,MAAM,EAAE,CAAA;IAC/B,YAAY,CAAC,EAAE,MAAM,MAAM,GAAG,SAAS,CAAA;IACvC,MAAM,EAAE,MAAM,CAAA;IACd,OAAO,CAAC,EAAE,OAAO,GAAG,SAAS,CAAA;CAC7B,GAAG,MAAM,MAAM,GAAG,SAAS,CAAA;AAC5B,wBAAgB,uBAAuB,CAAC,MAAM,SAAS,MAAM,CAAC,MAAM,EAAE,MAAM,CAAC,EAAE,OAAO,EAAE;IACvF,aAAa,EAAE,QAAQ,MAAM,EAAE,CAAA;IAC/B,WAAW,EAAE,IAAI,GAAG,SAAS,CAAA;IAC7B,YAAY,CAAC,EAAE,MAAM,MAAM,GAAG,SAAS,CAAA;IACvC,MAAM,EAAE,MAAM,CAAA;IACd,OAAO,CAAC,EAAE,OAAO,GAAG,SAAS,CAAA;CAC7B,GAAG,MAAM,GAAG,SAAS,CAAA;AActB;;;;;;;;;;;;;;;;;;;;;;;;;;;;GA4BG;AACH,wBAAgB,4BAA4B,CAAC,MAAM,SAAS,MAAM,CAAC,MAAM,EAAE,MAAM,CAAC,EAAE,OAAO,EAAE;IAC5F,aAAa,EAAE,QAAQ,MAAM,EAAE,CAAA;IAC/B,MAAM,EAAE,MAAM,CAAA;IACd,OAAO,EAAE,CAAC,KAAK,EAAE,MAAM,GAAG,IAAI,KAAK,IAAI,CAAA;IACvC,YAAY,CAAC,EAAE,MAAM,MAAM,GAAG,SAAS,CAAA;IACvC,OAAO,CAAC,EAAE,OAAO,GAAG,SAAS,CAAA;CAC7B,GAAG,gBAAgB,CAAA;AACpB,wBAAgB,4BAA4B,CAAC,MAAM,SAAS,MAAM,CAAC,MAAM,EAAE,MAAM,CAAC,EAAE,OAAO,EAAE;IAC5F,aAAa,EAAE,QAAQ,MAAM,EAAE,CAAA;IAC/B,MAAM,EAAE,MAAM,CAAA;IACd,OAAO,EAAE,CAAC,KAAK,EAAE,MAAM,GAAG,IAAI,KAAK,IAAI,CAAA;IACvC,WAAW,EAAE,IAAI,GAAG,SAAS,CAAA;IAC7B,YAAY,CAAC,EAAE,MAAM,MAAM,GAAG,SAAS,CAAA;IACvC,OAAO,CAAC,EAAE,OAAO,GAAG,SAAS,CAAA;CAC7B,GAAG,gBAAgB,CAAA"}

package/esm/theme/data-attribute.js

@@ -1,27 +0,0 @@
-import { findKey } from 'type-plus';
-import { getDataAttribute, observeDataAttributes } from "../utils/data-attribute.js";
-export function getThemeByDataAttribute(options) {
-    const value = getDataAttribute(options.attributeName, options.element) ?? undefined;
-    const theme = findKey(options.themes, (theme) => options.themes[theme] === value);
-    return theme ?? options.defaultTheme ?? (options.allowCustom ? value : undefined);
-}
-export function observeThemeByDataAttributes(options) {
-    return observeDataAttributes({
-        [options.attributeName]: (value) => {
-            if (value === null) {
-                options.handler(options.defaultTheme ?? null);
-                return;
-            }
-            for (const name in options.themes) {
-                if (options.themes[name] === value) {
-                    options.handler(name);
-                    return;
-                }
-            }
-            if (options.allowCustom) {
-                options.handler(value);
-            }
-        },
-    }, options.element);
-}
-//# sourceMappingURL=data-attribute.js.map

package/esm/theme/data-attribute.js.map

@@ -1 +0,0 @@
-{"version":3,"file":"data-attribute.js","sourceRoot":"","sources":["../../src/theme/data-attribute.ts"],"names":[],"mappings":"AAAA,OAAO,EAAE,OAAO,EAAE,MAAM,WAAW,CAAA;AACnC,OAAO,EAAE,gBAAgB,EAAE,qBAAqB,EAAE,MAAM,4BAA4B,CAAA;AAyCpF,MAAM,UAAU,uBAAuB,CAAwC,OAM9E;IACA,MAAM,KAAK,GAAG,gBAAgB,CAAC,OAAO,CAAC,aAAa,EAAE,OAAO,CAAC,OAAO,CAAC,IAAI,SAAS,CAAA;IACnF,MAAM,KAAK,GAAG,OAAO,CAAC,OAAO,CAAC,MAAM,EAAE,CAAC,KAAK,EAAE,EAAE,CAAC,OAAO,CAAC,MAAM,CAAC,KAAK,CAAC,KAAK,KAAK,CAAC,CAAA;IAEjF,OAAO,KAAK,IAAI,OAAO,CAAC,YAAY,IAAI,CAAC,OAAO,CAAC,WAAW,CAAC,CAAC,CAAC,KAAK,CAAC,CAAC,CAAC,SAAS,CAAC,CAAA;AAClF,CAAC;AA8CD,MAAM,UAAU,4BAA4B,CAAwC,OAOnF;IACA,OAAO,qBAAqB,CAC3B;QACC,CAAC,OAAO,CAAC,aAAa,CAAC,EAAE,CAAC,KAAoB,EAAE,EAAE;YACjD,IAAI,KAAK,KAAK,IAAI,EAAE,CAAC;gBACpB,OAAO,CAAC,OAAO,CAAE,OAAO,CAAC,YAAuB,IAAI,IAAI,CAAC,CAAA;gBACzD,OAAM;YACP,CAAC;YAED,KAAK,MAAM,IAAI,IAAI,OAAO,CAAC,MAAM,EAAE,CAAC;gBACnC,IAAI,OAAO,CAAC,MAAM,CAAC,IAAI,CAAC,KAAK,KAAK,EAAE,CAAC;oBACpC,OAAO,CAAC,OAAO,CAAC,IAAI,CAAC,CAAA;oBACrB,OAAM;gBACP,CAAC;YACF,CAAC;YAED,IAAI,OAAO,CAAC,WAAW,EAAE,CAAC;gBACzB,OAAO,CAAC,OAAO,CAAC,KAAK,CAAC,CAAA;YACvB,CAAC;QACF,CAAC;KACD,EACD,OAAO,CAAC,OAAO,CACf,CAAA;AACF,CAAC"}

package/esm/utils/attribute.d.ts

@@ -1,37 +0,0 @@
-/**
- * Gets the value of an attribute from an element.
- *
- * @param qualifiedName - The name of the attribute to get
- * @param element - The element to get the attribute from. Defaults to `document.documentElement`
- * @returns The attribute value cast to type T, or null if the attribute doesn't exist
- *
- * @example
- * ```ts
- * // Get theme from document root
- * const theme = getAttribute('data-theme')
- *
- * // Get data-testid from a specific element
- * const testId = getAttribute('data-testid', element)
- * ```
- */
-export declare function getAttribute<T extends string>(qualifiedName: T, element?: Element | undefined): string | null;
-/**
- * Observes attributes changes on an element and calls corresponding handlers.
- *
- * @param handlers - An object mapping attribute names to handler functions.
- * @param element - The element to observe. Defaults to `document.documentElement`.
- * @returns {MutationObserver} The observer instance, which can be used to disconnect the observer.
- *
- * @example
- * ```ts
- * const observer = observeAttributes({
- *   'data-theme': (attr, value) => console.log(`Theme changed to: ${value}`),
- *   'class': (attr, value) => console.log(`class changed to: ${value}`)
- * });
- *
- * // Later, to stop observing:
- * observer.disconnect();
- * ```
- */
-export declare function observeAttributes<T extends string>(handlers: Record<string, (value: T | null) => void>, element?: Element | undefined): MutationObserver;
-//# sourceMappingURL=attribute.d.ts.map

package/esm/utils/attribute.d.ts.map

@@ -1 +0,0 @@
-{"version":3,"file":"attribute.d.ts","sourceRoot":"","sources":["../../src/utils/attribute.ts"],"names":[],"mappings":"AAEA;;;;;;;;;;;;;;;GAeG;AACH,wBAAgB,YAAY,CAAC,CAAC,SAAS,MAAM,EAC5C,aAAa,EAAE,CAAC,EAChB,OAAO,GAAE,OAAO,GAAG,SAAoC,iBAGvD;AAED;;;;;;;;;;;;;;;;;GAiBG;AACH,wBAAgB,iBAAiB,CAAC,CAAC,SAAS,MAAM,EACjD,QAAQ,EAAE,MAAM,CAAC,MAAM,EAAE,CAAC,KAAK,EAAE,CAAC,GAAG,IAAI,KAAK,IAAI,CAAC,EACnD,OAAO,GAAE,OAAO,GAAG,SAAoC,oBAcvD"}

package/esm/utils/attribute.js

@@ -1,53 +0,0 @@
-import { ctx } from "../globals.ctx.js";
-/**
- * Gets the value of an attribute from an element.
- *
- * @param qualifiedName - The name of the attribute to get
- * @param element - The element to get the attribute from. Defaults to `document.documentElement`
- * @returns The attribute value cast to type T, or null if the attribute doesn't exist
- *
- * @example
- * ```ts
- * // Get theme from document root
- * const theme = getAttribute('data-theme')
- *
- * // Get data-testid from a specific element
- * const testId = getAttribute('data-testid', element)
- * ```
- */
-export function getAttribute(qualifiedName, element = ctx.getDocumentElement()) {
-    return element?.getAttribute(qualifiedName);
-}
-/**
- * Observes attributes changes on an element and calls corresponding handlers.
- *
- * @param handlers - An object mapping attribute names to handler functions.
- * @param element - The element to observe. Defaults to `document.documentElement`.
- * @returns {MutationObserver} The observer instance, which can be used to disconnect the observer.
- *
- * @example
- * ```ts
- * const observer = observeAttributes({
- *   'data-theme': (attr, value) => console.log(`Theme changed to: ${value}`),
- *   'class': (attr, value) => console.log(`class changed to: ${value}`)
- * });
- *
- * // Later, to stop observing:
- * observer.disconnect();
- * ```
- */
-export function observeAttributes(handlers, element = ctx.getDocumentElement()) {
-    const observer = new MutationObserver((mutations) => {
-        for (const mutation of mutations) {
-            const attribute = mutation.attributeName;
-            const value = element.getAttribute(attribute);
-            handlers[attribute]?.(value);
-        }
-    });
-    observer.observe(element, {
-        attributes: true,
-        attributeFilter: Object.keys(handlers),
-    });
-    return observer;
-}
-//# sourceMappingURL=attribute.js.map

package/esm/utils/attribute.js.map

@@ -1 +0,0 @@
-{"version":3,"file":"attribute.js","sourceRoot":"","sources":["../../src/utils/attribute.ts"],"names":[],"mappings":"AAAA,OAAO,EAAE,GAAG,EAAE,MAAM,mBAAmB,CAAA;AAEvC;;;;;;;;;;;;;;;GAeG;AACH,MAAM,UAAU,YAAY,CAC3B,aAAgB,EAChB,UAA+B,GAAG,CAAC,kBAAkB,EAAE;IAEvD,OAAO,OAAO,EAAE,YAAY,CAAC,aAAa,CAAC,CAAA;AAC5C,CAAC;AAED;;;;;;;;;;;;;;;;;GAiBG;AACH,MAAM,UAAU,iBAAiB,CAChC,QAAmD,EACnD,UAA+B,GAAG,CAAC,kBAAkB,EAAE;IAEvD,MAAM,QAAQ,GAAG,IAAI,gBAAgB,CAAC,CAAC,SAAS,EAAE,EAAE;QACnD,KAAK,MAAM,QAAQ,IAAI,SAAS,EAAE,CAAC;YAClC,MAAM,SAAS,GAAG,QAAQ,CAAC,aAAc,CAAA;YACzC,MAAM,KAAK,GAAG,OAAO,CAAC,YAAY,CAAC,SAAS,CAAa,CAAA;YACzD,QAAQ,CAAC,SAAS,CAAC,EAAE,CAAC,KAAK,CAAC,CAAA;QAC7B,CAAC;IACF,CAAC,CAAC,CAAA;IACF,QAAQ,CAAC,OAAO,CAAC,OAAO,EAAE;QACzB,UAAU,EAAE,IAAI;QAChB,eAAe,EAAE,MAAM,CAAC,IAAI,CAAC,QAAQ,CAAC;KACtC,CAAC,CAAA;IACF,OAAO,QAAQ,CAAA;AAChB,CAAC"}

package/esm/utils/data-attribute.d.ts

@@ -1,24 +0,0 @@
-export declare function getDataAttribute<T extends `data-${string}`>(qualifiedName: T, element?: Element | undefined): string | null;
-/**
- * Observes changes to `data-*` attributes on an element and calls corresponding handlers.
- *
- * @param options - Configuration options
- * @param options.handlers - An object mapping `data-*` attribute names to handler functions.
- * @param options.element - The element to observe. Defaults to `document.documentElement`
- * @returns {MutationObserver} The observer instance, which can be used to disconnect the observer
- *
- * @example
- * ```ts
- * const observer = observeDataAttributes({
- *   handlers: {
- *     'data-theme': (value) => console.log(`Theme changed to: ${value}`),
- *     'data-mode': (value) => console.log(`Mode changed to: ${value}`)
- *   }
- * });
- *
- * // Later, to stop observing:
- * observer.disconnect();
- * ```
- */
-export declare function observeDataAttributes<T extends string, K extends `data-${string}`>(handlers: Record<K, (value: T | null) => void>, element?: Element | undefined): MutationObserver;
-//# sourceMappingURL=data-attribute.d.ts.map

package/esm/utils/data-attribute.d.ts.map

@@ -1 +0,0 @@
-{"version":3,"file":"data-attribute.d.ts","sourceRoot":"","sources":["../../src/utils/data-attribute.ts"],"names":[],"mappings":"AAGA,wBAAgB,gBAAgB,CAAC,CAAC,SAAS,QAAQ,MAAM,EAAE,EAC1D,aAAa,EAAE,CAAC,EAChB,OAAO,GAAE,OAAO,GAAG,SAAoC,iBAGvD;AAED;;;;;;;;;;;;;;;;;;;;GAoBG;AACH,wBAAgB,qBAAqB,CAAC,CAAC,SAAS,MAAM,EAAE,CAAC,SAAS,QAAQ,MAAM,EAAE,EACjF,QAAQ,EAAE,MAAM,CAAC,CAAC,EAAE,CAAC,KAAK,EAAE,CAAC,GAAG,IAAI,KAAK,IAAI,CAAC,EAC9C,OAAO,CAAC,EAAE,OAAO,GAAG,SAAS,oBAG7B"}

package/esm/utils/data-attribute.js

@@ -1,30 +0,0 @@
-import { ctx } from "../globals.ctx.js";
-import { getAttribute, observeAttributes } from "./attribute.js";
-export function getDataAttribute(qualifiedName, element = ctx.getDocumentElement()) {
-    return getAttribute(qualifiedName, element);
-}
-/**
- * Observes changes to `data-*` attributes on an element and calls corresponding handlers.
- *
- * @param options - Configuration options
- * @param options.handlers - An object mapping `data-*` attribute names to handler functions.
- * @param options.element - The element to observe. Defaults to `document.documentElement`
- * @returns {MutationObserver} The observer instance, which can be used to disconnect the observer
- *
- * @example
- * ```ts
- * const observer = observeDataAttributes({
- *   handlers: {
- *     'data-theme': (value) => console.log(`Theme changed to: ${value}`),
- *     'data-mode': (value) => console.log(`Mode changed to: ${value}`)
- *   }
- * });
- *
- * // Later, to stop observing:
- * observer.disconnect();
- * ```
- */
-export function observeDataAttributes(handlers, element) {
-    return observeAttributes(handlers, element);
-}
-//# sourceMappingURL=data-attribute.js.map

package/esm/utils/data-attribute.js.map

@@ -1 +0,0 @@
-{"version":3,"file":"data-attribute.js","sourceRoot":"","sources":["../../src/utils/data-attribute.ts"],"names":[],"mappings":"AAAA,OAAO,EAAE,GAAG,EAAE,MAAM,mBAAmB,CAAA;AACvC,OAAO,EAAE,YAAY,EAAE,iBAAiB,EAAE,MAAM,gBAAgB,CAAA;AAEhE,MAAM,UAAU,gBAAgB,CAC/B,aAAgB,EAChB,UAA+B,GAAG,CAAC,kBAAkB,EAAE;IAEvD,OAAO,YAAY,CAAC,aAAa,EAAE,OAAO,CAAC,CAAA;AAC5C,CAAC;AAED;;;;;;;;;;;;;;;;;;;;GAoBG;AACH,MAAM,UAAU,qBAAqB,CACpC,QAA8C,EAC9C,OAA6B;IAE7B,OAAO,iBAAiB,CAAC,QAAQ,EAAE,OAAO,CAAC,CAAA;AAC5C,CAAC"}

package/esm/utils/get-css-prop-values.d.ts

@@ -1,17 +0,0 @@
-import type { CreateTuple } from 'type-plus';
-/**
- * Retrieves CSS custom property values from the specified element.
- *
- * @param element - The HTML element to get property values from
- * @param props - CSS custom property names to retrieve, must be in the format `--property-name`
- * @returns Array of property values corresponding to the requested custom properties
- */
-export declare function getCSSPropValues<Props extends Array<`--${string}`>>(element: HTMLElement, ...props: Props): CreateTuple<Props['length'], string>;
-/**
- * Retrieves CSS custom property values from `document.body`.
- *
- * @param props - CSS custom property names to retrieve, must be in the format `--property-name`
- * @returns Array of property values corresponding to the requested custom properties
- */
-export declare function getCSSPropValues<Props extends Array<`--${string}`>>(...props: Props): CreateTuple<Props['length'], string>;
-//# sourceMappingURL=get-css-prop-values.d.ts.map

package/esm/utils/get-css-prop-values.d.ts.map

@@ -1 +0,0 @@
-{"version":3,"file":"get-css-prop-values.d.ts","sourceRoot":"","sources":["../../src/utils/get-css-prop-values.ts"],"names":[],"mappings":"AAAA,OAAO,KAAK,EAAE,WAAW,EAAE,MAAM,WAAW,CAAA;AAE5C;;;;;;GAMG;AACH,wBAAgB,gBAAgB,CAAC,KAAK,SAAS,KAAK,CAAC,KAAK,MAAM,EAAE,CAAC,EAClE,OAAO,EAAE,WAAW,EACpB,GAAG,KAAK,EAAE,KAAK,GACb,WAAW,CAAC,KAAK,CAAC,QAAQ,CAAC,EAAE,MAAM,CAAC,CAAA;AACvC;;;;;GAKG;AACH,wBAAgB,gBAAgB,CAAC,KAAK,SAAS,KAAK,CAAC,KAAK,MAAM,EAAE,CAAC,EAClE,GAAG,KAAK,EAAE,KAAK,GACb,WAAW,CAAC,KAAK,CAAC,QAAQ,CAAC,EAAE,MAAM,CAAC,CAAA"}

package/esm/utils/get-css-prop-values.js

@@ -1,8 +0,0 @@
-export function getCSSPropValues(element, ...props) {
-    if (typeof element === 'string') {
-        return getCSSPropValues(globalThis.document.body, element, ...props);
-    }
-    const style = globalThis.getComputedStyle(element);
-    return props.map((v) => style.getPropertyValue(v));
-}
-//# sourceMappingURL=get-css-prop-values.js.map

package/esm/utils/get-css-prop-values.js.map

@@ -1 +0,0 @@
-{"version":3,"file":"get-css-prop-values.js","sourceRoot":"","sources":["../../src/utils/get-css-prop-values.ts"],"names":[],"mappings":"AAsBA,MAAM,UAAU,gBAAgB,CAAqC,OAAgB,EAAE,GAAG,KAAY;IACrG,IAAI,OAAO,OAAO,KAAK,QAAQ,EAAE,CAAC;QACjC,OAAO,gBAAgB,CAAC,UAAU,CAAC,QAAQ,CAAC,IAAI,EAAE,OAAwB,EAAE,GAAG,KAAK,CAAC,CAAA;IACtF,CAAC;IACD,MAAM,KAAK,GAAG,UAAU,CAAC,gBAAgB,CAAC,OAAsB,CAAC,CAAA;IACjE,OAAO,KAAK,CAAC,GAAG,CAAC,CAAC,CAAC,EAAE,EAAE,CAAC,KAAK,CAAC,gBAAgB,CAAC,CAAC,CAAC,CAAQ,CAAA;AAC1D,CAAC"}

package/esm/utils/prefers-color-scheme.d.ts

@@ -1,34 +0,0 @@
-/**
- * Observes system color scheme preference changes and calls handlers when they occur.
- *
- * @param themes - An object mapping theme names to handler functions that are called when that theme is activated
- * @returns A cleanup function that removes all event listeners
- *
- * @example
- * ```ts
- * // Observe light/dark mode changes
- * const cleanup = observePrefersColorScheme({
- *   light: (theme) => console.log('Light mode activated'),
- *   dark: (theme) => console.log('Dark mode activated')
- * })
- *
- * // Later, to stop observing:
- * cleanup()
- * ```
- */
-export declare function observePrefersColorScheme<T extends string>(themes: Record<T, (value: T | null) => void>): () => void;
-/**
- * Gets the current preferred color theme from the system settings.
- *
- * @param themes - A list of theme names to check against the system preference
- * @returns The first matching theme from the provided list, or null if none match
- *
- * @example
- * ```ts
- * // Check if system prefers light or dark mode
- * const theme = getPrefersColorTheme('light', 'dark')
- * // Returns 'light', 'dark', or null
- * ```
- */
-export declare function getPrefersColorTheme<T extends string>(...themes: T[]): T | null;
-//# sourceMappingURL=prefers-color-scheme.d.ts.map

package/esm/utils/prefers-color-scheme.d.ts.map

@@ -1 +0,0 @@
-{"version":3,"file":"prefers-color-scheme.d.ts","sourceRoot":"","sources":["../../src/utils/prefers-color-scheme.ts"],"names":[],"mappings":"AAGA;;;;;;;;;;;;;;;;;GAiBG;AACH,wBAAgB,yBAAyB,CAAC,CAAC,SAAS,MAAM,EAAE,MAAM,EAAE,MAAM,CAAC,CAAC,EAAE,CAAC,KAAK,EAAE,CAAC,GAAG,IAAI,KAAK,IAAI,CAAC,cAkBvG;AAED;;;;;;;;;;;;GAYG;AACH,wBAAgB,oBAAoB,CAAC,CAAC,SAAS,MAAM,EAAE,GAAG,MAAM,EAAE,CAAC,EAAE,YAEpE"}

package/esm/utils/prefers-color-scheme.js

@@ -1,54 +0,0 @@
-import { mapKey } from 'type-plus';
-import { ctx } from "../globals.ctx.js";
-/**
- * Observes system color scheme preference changes and calls handlers when they occur.
- *
- * @param themes - An object mapping theme names to handler functions that are called when that theme is activated
- * @returns A cleanup function that removes all event listeners
- *
- * @example
- * ```ts
- * // Observe light/dark mode changes
- * const cleanup = observePrefersColorScheme({
- *   light: (theme) => console.log('Light mode activated'),
- *   dark: (theme) => console.log('Dark mode activated')
- * })
- *
- * // Later, to stop observing:
- * cleanup()
- * ```
- */
-export function observePrefersColorScheme(themes) {
-    const removers = mapKey(themes, (t) => {
-        const m = ctx.matchMedia(`(prefers-color-scheme: ${t})`);
-        const listener = (event) => {
-            if (event.matches) {
-                themes[t]?.(t);
-            }
-        };
-        m.addEventListener('change', listener);
-        return () => m.removeEventListener('change', listener);
-    });
-    return () => {
-        for (const remover of removers) {
-            remover();
-        }
-    };
-}
-/**
- * Gets the current preferred color theme from the system settings.
- *
- * @param themes - A list of theme names to check against the system preference
- * @returns The first matching theme from the provided list, or null if none match
- *
- * @example
- * ```ts
- * // Check if system prefers light or dark mode
- * const theme = getPrefersColorTheme('light', 'dark')
- * // Returns 'light', 'dark', or null
- * ```
- */
-export function getPrefersColorTheme(...themes) {
-    return themes.find((theme) => ctx.matchMedia(`(prefers-color-scheme: ${theme})`).matches) ?? null;
-}
-//# sourceMappingURL=prefers-color-scheme.js.map

package/esm/utils/prefers-color-scheme.js.map

@@ -1 +0,0 @@
-{"version":3,"file":"prefers-color-scheme.js","sourceRoot":"","sources":["../../src/utils/prefers-color-scheme.ts"],"names":[],"mappings":"AAAA,OAAO,EAAE,MAAM,EAAE,MAAM,WAAW,CAAA;AAClC,OAAO,EAAE,GAAG,EAAE,MAAM,mBAAmB,CAAA;AAEvC;;;;;;;;;;;;;;;;;GAiBG;AACH,MAAM,UAAU,yBAAyB,CAAmB,MAA4C;IACvG,MAAM,QAAQ,GAAG,MAAM,CAAC,MAAM,EAAE,CAAC,CAAC,EAAE,EAAE;QACrC,MAAM,CAAC,GAAG,GAAG,CAAC,UAAU,CAAC,0BAA0B,CAAW,GAAG,CAAC,CAAA;QAClE,MAAM,QAAQ,GAAG,CAAC,KAA0B,EAAE,EAAE;YAC/C,IAAI,KAAK,CAAC,OAAO,EAAE,CAAC;gBACnB,MAAM,CAAC,CAAC,CAAC,EAAE,CAAC,CAAC,CAAC,CAAA;YACf,CAAC;QACF,CAAC,CAAA;QAED,CAAC,CAAC,gBAAgB,CAAC,QAAQ,EAAE,QAAQ,CAAC,CAAA;QACtC,OAAO,GAAG,EAAE,CAAC,CAAC,CAAC,mBAAmB,CAAC,QAAQ,EAAE,QAAQ,CAAC,CAAA;IACvD,CAAC,CAAC,CAAA;IAEF,OAAO,GAAG,EAAE;QACX,KAAK,MAAM,OAAO,IAAI,QAAQ,EAAE,CAAC;YAChC,OAAO,EAAE,CAAA;QACV,CAAC;IACF,CAAC,CAAA;AACF,CAAC;AAED;;;;;;;;;;;;GAYG;AACH,MAAM,UAAU,oBAAoB,CAAmB,GAAG,MAAW;IACpE,OAAO,MAAM,CAAC,IAAI,CAAC,CAAC,KAAK,EAAE,EAAE,CAAC,GAAG,CAAC,UAAU,CAAC,0BAA0B,KAAK,GAAG,CAAC,CAAC,OAAO,CAAC,IAAI,IAAI,CAAA;AAClG,CAAC"}

package/src/tailwind.css

@@ -1,3 +0,0 @@
-@import "tailwindcss";
-
-@custom-variant dark (&:where(.dark, .dark *));