@odx/foundation 1.0.0-rc.3 → 1.0.0-rc.5

package/dist/lib/format.js

@@ -1,63 +1,66 @@
+//#region src/lib/format.ts
 function parseDate(value) {
-  const createDate = (value2) => Number.isNaN(value2) ? null : new Date(value2);
-  if (value instanceof Date) {
-    return createDate(value.getTime());
-  }
-  const date = new Date(value);
-  if (Number.isNaN(date.getTime()) && typeof value === "string") {
-    return createDate(Number(value));
-  }
-  return createDate(date.getTime());
+	const createDate = (value) => Number.isNaN(value) ? null : new Date(value);
+	if (value instanceof Date) return createDate(value.getTime());
+	const date = new Date(value);
+	if (Number.isNaN(date.getTime()) && typeof value === "string") return createDate(Number(value));
+	return createDate(date.getTime());
 }
 function formatDate(input, options) {
-  const value = parseDate(input);
-  if (!value) return "";
-  if (options?.dateStyle === "iso8601") {
-    return new Intl.DateTimeFormat("sv-SE", { dateStyle: "short" }).format(value);
-  }
-  return new Intl.DateTimeFormat(options?.locale, options).format(value);
+	const value = parseDate(input);
+	if (!value) return "";
+	if (options?.dateStyle === "iso8601") return new Intl.DateTimeFormat("sv-SE", { dateStyle: "short" }).format(value);
+	return new Intl.DateTimeFormat(options?.locale, options).format(value);
 }
 function formatNumber(input, options) {
-  const value = Number(input);
-  if (Number.isNaN(value)) return "";
-  if (options?.currency) {
-    options.style = "currency";
-  } else if (options?.unit) {
-    options.style = "unit";
-  }
-  return new Intl.NumberFormat(options?.locale, options).format(value);
+	const value = Number(input);
+	if (Number.isNaN(value)) return "";
+	if (options?.currency) options.style = "currency";
+	else if (options?.unit) options.style = "unit";
+	return new Intl.NumberFormat(options?.locale, options).format(value);
 }
 function formatList(input, options) {
-  if (input.length === 0) return "";
-  return new Intl.ListFormat(options?.locale, options).format(input);
+	if (input.length === 0) return "";
+	return new Intl.ListFormat(options?.locale, options).format(input);
 }
 const TIME_UNIT_MAP = {
-  second: { max: 59e3, value: 1e3 },
-  // max 59 seconds
-  minute: { max: 276e4, value: 6e4 },
-  // max 46 minutes
-  hour: { max: 72e6, value: 36e5 },
-  // max 20 hours
-  day: { max: 5184e5, value: 864e5 },
-  // max 6 days
-  week: { max: 24192e5, value: 6048e5 },
-  // max 28 days
-  month: { max: 28512e6, value: 2592e6 },
-  // max 11 months
-  year: { max: Number.POSITIVE_INFINITY, value: 31536e6 }
+	second: {
+		max: 59e3,
+		value: 1e3
+	},
+	minute: {
+		max: 276e4,
+		value: 6e4
+	},
+	hour: {
+		max: 72e6,
+		value: 36e5
+	},
+	day: {
+		max: 5184e5,
+		value: 864e5
+	},
+	week: {
+		max: 24192e5,
+		value: 6048e5
+	},
+	month: {
+		max: 28512e6,
+		value: 2592e6
+	},
+	year: {
+		max: Number.POSITIVE_INFINITY,
+		value: 31536e6
+	}
 };
 function formatRelativeTime(input, options) {
-  const value = parseDate(input);
-  if (!value) return "";
-  const relativeTime = value.getTime() - Date.now();
-  const minUnit = options?.minUnit && TIME_UNIT_MAP[options.minUnit] || TIME_UNIT_MAP.second;
-  const [unit, unitConfig] = Object.entries(TIME_UNIT_MAP).find(
-    ([_, { value: value2, max }]) => Math.abs(relativeTime) < max && minUnit.value <= value2
-  );
-  return new Intl.RelativeTimeFormat(options?.locale, options).format(
-    Math.round(relativeTime / unitConfig.value),
-    unit
-  );
+	const startDate = parseDate(options?.start ?? Date.now());
+	const value = parseDate(input);
+	if (!value || !startDate) return "";
+	const relativeTime = value.getTime() - startDate.getTime();
+	const minUnit = options?.minUnit && TIME_UNIT_MAP[options.minUnit] || TIME_UNIT_MAP.second;
+	const [unit, unitConfig] = Object.entries(TIME_UNIT_MAP).find(([_, { value, max }]) => Math.abs(relativeTime) < max && minUnit.value <= value);
+	return new Intl.RelativeTimeFormat(options?.locale, options).format(Math.round(relativeTime / unitConfig.value), unit);
 }
-
+//#endregion
 export { formatDate, formatList, formatNumber, formatRelativeTime, parseDate };

package/dist/lib/localization.d.ts

@@ -1,12 +1,15 @@
-import { FormatOptions } from './format.js';
-export interface LocalizationOptions extends FormatOptions {
-    defaultLocale: () => Intl.Locale | Intl.UnicodeBCP47LocaleIdentifier;
-    fallbackLanguage: () => Intl.UnicodeBCP47LocaleIdentifier;
-    fallbackTranslation: (key: string) => string;
+import { FormatOptions } from "./format.js";
+
+//#region src/lib/localization.d.ts
+interface LocalizationOptions extends FormatOptions {
+  defaultLocale: () => Intl.Locale | Intl.UnicodeBCP47LocaleIdentifier;
+  fallbackLanguage: () => Intl.UnicodeBCP47LocaleIdentifier;
+  fallbackTranslation: (key: string) => string;
 }
-export declare const LocalizationOptions: (config?: Partial<LocalizationOptions>) => LocalizationOptions;
-export declare function setLocalizationOptions(options?: Partial<LocalizationOptions> | null): void;
-export declare function getLocalizationOptions(options?: Partial<LocalizationOptions> | null): LocalizationOptions;
-export declare function getLocale(localeInput?: Intl.Locale | Intl.UnicodeBCP47LocaleIdentifier | null): Intl.Locale;
-export declare function setLocale(localeInput?: Intl.Locale | Intl.UnicodeBCP47LocaleIdentifier | null): void;
-//# sourceMappingURL=localization.d.ts.map
+declare const LocalizationOptions: (config?: Partial<LocalizationOptions>) => LocalizationOptions;
+declare function setLocalizationOptions(options?: Partial<LocalizationOptions> | null): void;
+declare function getLocalizationOptions(options?: Partial<LocalizationOptions> | null): LocalizationOptions;
+declare function getLocale(localeInput?: Intl.Locale | Intl.UnicodeBCP47LocaleIdentifier | null): Intl.Locale;
+declare function setLocale(localeInput?: Intl.Locale | Intl.UnicodeBCP47LocaleIdentifier | null): void;
+//#endregion
+export { LocalizationOptions, getLocale, getLocalizationOptions, setLocale, setLocalizationOptions };

package/dist/lib/localization.js

@@ -1,28 +1,28 @@
-import { sharedSignal } from './signals.js';
-
+import { sharedSignal } from "./signals.js";
+//#region src/lib/localization.ts
 const locale = sharedSignal("locale", null);
 const localizationOptions = sharedSignal("localizationOptions", null);
 const LocalizationOptions = (config) => ({
-  defaultLocale: () => navigator.language,
-  fallbackLanguage: () => "en",
-  fallbackTranslation: (key) => key,
-  ...config,
-  relativeTimeFormatOptions: {
-    minUnit: "minute",
-    ...config?.relativeTimeFormatOptions
-  }
+	defaultLocale: () => navigator.language,
+	fallbackLanguage: () => "en",
+	fallbackTranslation: (key) => key,
+	...config,
+	relativeTimeFormatOptions: {
+		minUnit: "minute",
+		...config?.relativeTimeFormatOptions
+	}
 });
 function setLocalizationOptions(options) {
-  localizationOptions.set(getLocalizationOptions(options));
+	localizationOptions.set(getLocalizationOptions(options));
 }
 function getLocalizationOptions(options) {
-  return LocalizationOptions(options ?? localizationOptions.get() ?? {});
+	return LocalizationOptions(options ?? localizationOptions.get() ?? {});
 }
 function getLocale(localeInput) {
-  return new Intl.Locale(localeInput || locale.get() || getLocalizationOptions().defaultLocale());
+	return new Intl.Locale(localeInput || locale.get() || getLocalizationOptions().defaultLocale());
 }
 function setLocale(localeInput) {
-  locale.set(localeInput ? getLocale(localeInput) : null);
+	locale.set(localeInput ? getLocale(localeInput) : null);
 }
-
+//#endregion
 export { LocalizationOptions, getLocale, getLocalizationOptions, setLocale, setLocalizationOptions };

package/dist/lib/models.d.ts

@@ -1,39 +1,5 @@
-export type Alignment = (typeof Alignment)[keyof typeof Alignment];
-export declare const Alignment: {
-    readonly START: "start";
-    readonly CENTER: "center";
-    readonly END: "end";
-};
-export type Spacing = (typeof Spacing)[keyof typeof Spacing];
-export declare const Spacing: {
-    readonly 0: "0";
-    readonly SM: "sm";
-    readonly MD: "md";
-    readonly LG: "lg";
-};
-export type Justify = (typeof Justify)[keyof typeof Justify];
-export declare const Justify: {
-    readonly START: "start";
-    readonly END: "end";
-    readonly CENTER: "center";
-    readonly SPACE_BETWEEN: "space-between";
-    readonly SPACE_AROUND: "space-around";
-    readonly SPACE_EVENLY: "space-evenly";
-};
-export type Variant = (typeof Variant)[keyof typeof Variant];
-export declare const Variant: {
-    readonly NEUTRAL: "neutral";
-    readonly PRIMARY: "primary";
-    readonly ACCENT: "accent";
-    readonly SUCCESS: "success";
-    readonly WARNING: "warning";
-    readonly DANGER: "danger";
-    readonly ACCENT_GHOST: "accent-ghost";
-    readonly DANGER_GHOST: "danger-ghost";
-    readonly CONFIRMATION: "confirmation";
-    readonly SUBTLE: "subtle";
-    readonly GHOST: "ghost";
-};
-export type UnitIdentifier = SingleUnitIdentifier | `${SingleUnitIdentifier}-per-${SingleUnitIdentifier}` | (string & {});
-export type SingleUnitIdentifier = 'acre' | 'bit' | 'byte' | 'celsius' | 'centimeter' | 'day' | 'degree' | 'fahrenheit' | 'fluid-ounce' | 'foot' | 'gallon' | 'gigabit' | 'gigabyte' | 'gram' | 'hectare' | 'hour' | 'inch' | 'kilobit' | 'kilobyte' | 'kilogram' | 'kilometer' | 'liter' | 'megabit' | 'megabyte' | 'meter' | 'microsecond' | 'mile' | 'mile-scandinavian' | 'milliliter' | 'millimeter' | 'millisecond' | 'minute' | 'month' | 'nanosecond' | 'ounce' | 'percent' | 'petabyte' | 'pound' | 'second' | 'stone' | 'terabit' | 'terabyte' | 'week' | 'yard' | 'year';
-//# sourceMappingURL=models.d.ts.map
+//#region src/lib/models.d.ts
+type UnitIdentifier = SingleUnitIdentifier | `${SingleUnitIdentifier}-per-${SingleUnitIdentifier}` | (string & {});
+type SingleUnitIdentifier = 'acre' | 'bit' | 'byte' | 'celsius' | 'centimeter' | 'day' | 'degree' | 'fahrenheit' | 'fluid-ounce' | 'foot' | 'gallon' | 'gigabit' | 'gigabyte' | 'gram' | 'hectare' | 'hour' | 'inch' | 'kilobit' | 'kilobyte' | 'kilogram' | 'kilometer' | 'liter' | 'megabit' | 'megabyte' | 'meter' | 'microsecond' | 'mile' | 'mile-scandinavian' | 'milliliter' | 'millimeter' | 'millisecond' | 'minute' | 'month' | 'nanosecond' | 'ounce' | 'percent' | 'petabyte' | 'pound' | 'second' | 'stone' | 'terabit' | 'terabyte' | 'week' | 'yard' | 'year';
+//#endregion
+export { UnitIdentifier };

package/dist/lib/signals.d.ts

@@ -1,20 +1,23 @@
-import { Signal as NativeSignal } from 'signal-polyfill';
-export type Signal<T> = NativeSignal.State<T> & {
-    update: (updateFn: (value: T) => T) => void;
+import { Signal } from "signal-polyfill";
+
+//#region src/lib/signals.d.ts
+type Signal$1<T> = Signal.State<T> & {
+  update: (updateFn: (value: T) => T) => void;
 };
-export type SignalOptions<T> = NativeSignal.Options<T> & {
-    watched?(): void;
-    unwatched?(): void;
+type SignalOptions<T> = Signal.Options<T> & {
+  watched?(): void;
+  unwatched?(): void;
 };
-export type ReadonlySignal<T> = NativeSignal.Computed<T>;
-export declare function signal<T>(value: T, options?: SignalOptions<T>): Signal<T>;
+type ReadonlySignal<T> = Signal.Computed<T>;
+declare function signal<T>(value: T, options?: SignalOptions<T>): Signal$1<T>;
 /**
  * Creates or retrieves a shared signal stored on the global object. This is useful for signals that need to be shared across multiple modules without explicitly passing them around, such as localization settings or translation records.
  */
-export declare function sharedSignal<T>(key: string, ...args: Parameters<typeof signal<T>>): ReturnType<typeof signal<T>>;
-export declare function computed<T>(computeFn: () => T, options?: SignalOptions<T>): ReadonlySignal<T>;
-export declare function effect(callback: (() => void) | (() => () => void)): () => void;
+declare function sharedSignal<T>(key: string, ...args: Parameters<typeof signal<T>>): ReturnType<typeof signal<T>>;
+declare function computed<T>(computeFn: () => T, options?: SignalOptions<T>): ReadonlySignal<T>;
+declare function effect(callback: (() => void) | (() => () => void)): () => void;
 declare global {
-    var __ODX_SHARED_SIGNALS__: Record<string, unknown>;
+  var __ODX_SHARED_SIGNALS__: Record<string, unknown>;
 }
-//# sourceMappingURL=signals.d.ts.map
+//#endregion
+export { ReadonlySignal, Signal$1 as Signal, SignalOptions, computed, effect, sharedSignal, signal };

package/dist/lib/signals.js

@@ -1,47 +1,52 @@
-import { Signal } from 'signal-polyfill';
-
+import { Signal } from "signal-polyfill";
+//#region src/lib/signals.ts
 function transformOptions(options) {
-  if (!options) return;
-  return { equals: options.equals, [Signal.subtle.watched]: options.watched, [Signal.subtle.unwatched]: options.unwatched };
+	if (!options) return;
+	return {
+		equals: options.equals,
+		[Signal.subtle.watched]: options.watched,
+		[Signal.subtle.unwatched]: options.unwatched
+	};
 }
 function signal(value, options) {
-  const state = new Signal.State(value, transformOptions(options));
-  state.update = (updateFn) => state.set(updateFn(state.get()));
-  return state;
+	const state = new Signal.State(value, transformOptions(options));
+	state.update = (updateFn) => state.set(updateFn(state.get()));
+	return state;
 }
+/**
+* Creates or retrieves a shared signal stored on the global object. This is useful for signals that need to be shared across multiple modules without explicitly passing them around, such as localization settings or translation records.
+*/
 function sharedSignal(key, ...args) {
-  if (!(key in globalThis.__ODX_SHARED_SIGNALS__)) {
-    globalThis.__ODX_SHARED_SIGNALS__[key] = signal(...args);
-  }
-  return globalThis.__ODX_SHARED_SIGNALS__[key];
+	if (!(key in globalThis.__ODX_SHARED_SIGNALS__)) globalThis.__ODX_SHARED_SIGNALS__[key] = signal(...args);
+	return globalThis.__ODX_SHARED_SIGNALS__[key];
 }
 function computed(computeFn, options) {
-  return new Signal.Computed(computeFn, transformOptions(options));
+	return new Signal.Computed(computeFn, transformOptions(options));
 }
 let needsEnqueue = true;
 const watcher = new Signal.subtle.Watcher(() => {
-  if (!needsEnqueue) return;
-  needsEnqueue = false;
-  queueMicrotask(() => {
-    needsEnqueue = true;
-    for (const signal2 of watcher.getPending()) signal2.get();
-    watcher.watch();
-  });
+	if (!needsEnqueue) return;
+	needsEnqueue = false;
+	queueMicrotask(() => {
+		needsEnqueue = true;
+		for (const signal of watcher.getPending()) signal.get();
+		watcher.watch();
+	});
 });
 function effect(callback) {
-  let cleanup;
-  const signal2 = computed(() => {
-    cleanup?.();
-    cleanup = callback() || void 0;
-  });
-  watcher.watch(signal2);
-  signal2.get();
-  return () => {
-    watcher.unwatch(signal2);
-    cleanup?.();
-    cleanup = void 0;
-  };
+	let cleanup;
+	const signal = computed(() => {
+		cleanup?.();
+		cleanup = callback() || void 0;
+	});
+	watcher.watch(signal);
+	signal.get();
+	return () => {
+		watcher.unwatch(signal);
+		cleanup?.();
+		cleanup = void 0;
+	};
 }
 globalThis.__ODX_SHARED_SIGNALS__ ||= {};
-
+//#endregion
 export { computed, effect, sharedSignal, signal };

package/dist/lib/theming.d.ts

@@ -1,16 +1,19 @@
-import { ThemeConfig } from '@odx/design-tokens';
+import { ThemeConfig } from "@odx/design-tokens";
+
+//#region src/lib/theming.d.ts
 declare global {
-    var __ODX_THEME_ROOT__: HTMLElement;
+  var __ODX_THEME_ROOT__: HTMLElement;
 }
-export declare const userPrefersDarkMode: boolean;
-export declare const darkModeIcon = "core::night-mode";
-export declare const lightModeIcon = "core::brightness";
-export declare function setTheme(config: ThemeConfig, root?: HTMLElement): void;
-export declare function isDarkModeEnabled(): boolean;
-export declare function toggleDarkMode(enabled?: boolean | 'auto', root?: HTMLElement): void;
-export interface AttachDarkModeToggleOptions<T extends HTMLElement> {
-    update?(host: T, darkModeEnabled: boolean, icon: string): void;
-    root?: HTMLElement;
+declare const userPrefersDarkMode: boolean;
+declare const darkModeIcon = "core::night-mode";
+declare const lightModeIcon = "core::brightness";
+declare function setTheme$1(config: ThemeConfig, root?: HTMLElement): void;
+declare function isDarkModeEnabled(): boolean;
+declare function toggleDarkMode(enabled?: boolean | 'auto', root?: HTMLElement): void;
+interface AttachDarkModeToggleOptions<T extends HTMLElement> {
+  update?(host: T, darkModeEnabled: boolean, icon: string): void;
+  root?: HTMLElement;
 }
-export declare function attachDarkModeToggle<T extends HTMLElement>(host: T, options?: AttachDarkModeToggleOptions<T>): () => void;
-//# sourceMappingURL=theming.d.ts.map
+declare function attachDarkModeToggle<T extends HTMLElement>(host: T, options?: AttachDarkModeToggleOptions<T>): () => void;
+//#endregion
+export { AttachDarkModeToggleOptions, attachDarkModeToggle, darkModeIcon, isDarkModeEnabled, lightModeIcon, setTheme$1 as setTheme, toggleDarkMode, userPrefersDarkMode };

package/dist/lib/theming.js

@@ -1,37 +1,34 @@
-import { darkModeClass, lightModeClass, setTheme as setTheme$1 } from '@odx/design-tokens';
-import { sharedSignal, effect } from './signals.js';
-
+import { effect, sharedSignal } from "./signals.js";
+import { darkModeClass, lightModeClass, setTheme } from "@odx/design-tokens";
+//#region src/lib/theming.ts
 const { matches: userPrefersDarkMode = false } = globalThis.matchMedia?.("(prefers-color-scheme: dark)") ?? {};
 const darkModeIcon = "core::night-mode";
 const lightModeIcon = "core::brightness";
-globalThis.__ODX_THEME_ROOT__ ??= document.querySelector(".odx-root") ?? document.documentElement;
+globalThis.__ODX_THEME_ROOT__ ??= document.documentElement;
 const hasDarkModeClass = globalThis.__ODX_THEME_ROOT__.classList.contains(darkModeClass);
 const hasLightModeClass = globalThis.__ODX_THEME_ROOT__.classList.contains(lightModeClass);
 const darkModeEnabled = sharedSignal("darkModeEnabled", hasDarkModeClass || hasLightModeClass ? hasDarkModeClass : userPrefersDarkMode);
-function setTheme(config, root = globalThis.__ODX_THEME_ROOT__) {
-  setTheme$1(config, root);
-  if (!config.mode) return;
-  if (config.mode === "auto") {
-    darkModeEnabled.set(userPrefersDarkMode);
-  } else {
-    darkModeEnabled.set(config.mode === "dark" ? true : !isDarkModeEnabled());
-  }
+function setTheme$1(config, root = globalThis.__ODX_THEME_ROOT__) {
+	setTheme(config, root);
+	if (!config.mode) return;
+	if (config.mode === "auto") darkModeEnabled.set(userPrefersDarkMode);
+	else darkModeEnabled.set(config.mode === "dark" ? true : !isDarkModeEnabled());
 }
 function isDarkModeEnabled() {
-  return darkModeEnabled.get();
+	return darkModeEnabled.get();
 }
 function toggleDarkMode(enabled, root = globalThis.__ODX_THEME_ROOT__) {
-  enabled ||= !isDarkModeEnabled();
-  setTheme({ mode: enabled === "auto" ? enabled : enabled ? "dark" : "light" }, root);
+	enabled ||= !isDarkModeEnabled();
+	setTheme$1({ mode: enabled === "auto" ? enabled : enabled ? "dark" : "light" }, root);
 }
 function attachDarkModeToggle(host, options = {}) {
-  host.addEventListener("click", () => toggleDarkMode(void 0, options.root));
-  return effect(() => {
-    const darkModeEnabled2 = isDarkModeEnabled();
-    const icon = darkModeEnabled2 ? lightModeIcon : darkModeIcon;
-    host.setAttribute("icon", icon);
-    options.update?.(host, darkModeEnabled2, icon);
-  });
+	host.addEventListener("click", () => toggleDarkMode(void 0, options.root));
+	return effect(() => {
+		const darkModeEnabled = isDarkModeEnabled();
+		const icon = darkModeEnabled ? lightModeIcon : darkModeIcon;
+		host.setAttribute("icon", icon);
+		options.update?.(host, darkModeEnabled, icon);
+	});
 }
-
-export { attachDarkModeToggle, darkModeIcon, isDarkModeEnabled, lightModeIcon, setTheme, toggleDarkMode, userPrefersDarkMode };
+//#endregion
+export { attachDarkModeToggle, darkModeIcon, isDarkModeEnabled, lightModeIcon, setTheme$1 as setTheme, toggleDarkMode, userPrefersDarkMode };

package/dist/lib/utils/shared-media-observer.js

@@ -1,43 +1,41 @@
+//#region src/lib/utils/shared-media-observer.ts
 const mediaQueryRegistry = /* @__PURE__ */ new Map();
 const eventListenerRegistry = /* @__PURE__ */ new Map();
 function handleMediaChange(event) {
-  const listeners = eventListenerRegistry.get(event.media);
-  if (!listeners?.size) return;
-  const listenersArray = Array.from(listeners);
-  let i = listenersArray.length;
-  while (i--) {
-    listenersArray[i]?.(event);
-  }
+	const listeners = eventListenerRegistry.get(event.media);
+	if (!listeners?.size) return;
+	const listenersArray = Array.from(listeners);
+	let i = listenersArray.length;
+	while (i--) listenersArray[i]?.(event);
 }
 function observeMedia(query, listener) {
-  let listeners = eventListenerRegistry.get(query);
-  if (!listeners) {
-    listeners = /* @__PURE__ */ new Set();
-    eventListenerRegistry.set(query, listeners);
-  }
-  listeners.add(listener);
-  let mediaQueryList = mediaQueryRegistry.get(query);
-  if (!mediaQueryList) {
-    mediaQueryList = globalThis.matchMedia(query);
-    mediaQueryRegistry.set(query, mediaQueryList);
-    mediaQueryList.addEventListener("change", handleMediaChange);
-  }
-  const initialEvent = new MediaQueryListEvent("change", {
-    media: mediaQueryList.media,
-    matches: mediaQueryList.matches
-  });
-  listener(initialEvent);
-  return () => unobserveMedia(query, listener);
+	let listeners = eventListenerRegistry.get(query);
+	if (!listeners) {
+		listeners = /* @__PURE__ */ new Set();
+		eventListenerRegistry.set(query, listeners);
+	}
+	listeners.add(listener);
+	let mediaQueryList = mediaQueryRegistry.get(query);
+	if (!mediaQueryList) {
+		mediaQueryList = globalThis.matchMedia(query);
+		mediaQueryRegistry.set(query, mediaQueryList);
+		mediaQueryList.addEventListener("change", handleMediaChange);
+	}
+	listener(new MediaQueryListEvent("change", {
+		media: mediaQueryList.media,
+		matches: mediaQueryList.matches
+	}));
+	return () => unobserveMedia(query, listener);
 }
 function unobserveMedia(query, listener) {
-  const listeners = eventListenerRegistry.get(query);
-  if (!listeners?.delete(listener)) return;
-  if (listeners.size > 0) return;
-  eventListenerRegistry.delete(query);
-  const mediaQueryList = mediaQueryRegistry.get(query);
-  if (!mediaQueryList) return;
-  mediaQueryList.removeEventListener("change", handleMediaChange);
-  mediaQueryRegistry.delete(query);
+	const listeners = eventListenerRegistry.get(query);
+	if (!listeners?.delete(listener)) return;
+	if (listeners.size > 0) return;
+	eventListenerRegistry.delete(query);
+	const mediaQueryList = mediaQueryRegistry.get(query);
+	if (!mediaQueryList) return;
+	mediaQueryList.removeEventListener("change", handleMediaChange);
+	mediaQueryRegistry.delete(query);
 }
-
-export { observeMedia, unobserveMedia };
+//#endregion
+export { observeMedia };

package/dist/main.d.ts

@@ -1,7 +1,7 @@
-export * from './lib/breakpoints.js';
-export * from './lib/format.js';
-export * from './lib/localization.js';
-export type { UnitIdentifier } from './lib/models.js';
-export * from './lib/signals.js';
-export * from './lib/theming.js';
-//# sourceMappingURL=main.d.ts.map
+import { ReadonlySignal, Signal, SignalOptions, computed, effect, sharedSignal, signal } from "./lib/signals.js";
+import { Breakpoint, BreakpointConfig, BreakpointOperator, breakpointAttribute, buildBreakpoint, createBreakpointUpdater, defaultBreakpoints, expandBreakpoints, observeBreakpoint, registeredBreakpoints, setupBreakpoints } from "./lib/breakpoints.js";
+import { UnitIdentifier } from "./lib/models.js";
+import { DateTimeFormatOptions, FormatOptions, ListFormatOptions, NumberFormatOptions, RelativeTimeFormatOptions, formatDate, formatList, formatNumber, formatRelativeTime, parseDate } from "./lib/format.js";
+import { LocalizationOptions, getLocale, getLocalizationOptions, setLocale, setLocalizationOptions } from "./lib/localization.js";
+import { AttachDarkModeToggleOptions, attachDarkModeToggle, darkModeIcon, isDarkModeEnabled, lightModeIcon, setTheme, toggleDarkMode, userPrefersDarkMode } from "./lib/theming.js";
+export { AttachDarkModeToggleOptions, Breakpoint, BreakpointConfig, BreakpointOperator, DateTimeFormatOptions, FormatOptions, ListFormatOptions, LocalizationOptions, NumberFormatOptions, ReadonlySignal, RelativeTimeFormatOptions, Signal, SignalOptions, type UnitIdentifier, attachDarkModeToggle, breakpointAttribute, buildBreakpoint, computed, createBreakpointUpdater, darkModeIcon, defaultBreakpoints, effect, expandBreakpoints, formatDate, formatList, formatNumber, formatRelativeTime, getLocale, getLocalizationOptions, isDarkModeEnabled, lightModeIcon, observeBreakpoint, parseDate, registeredBreakpoints, setLocale, setLocalizationOptions, setTheme, setupBreakpoints, sharedSignal, signal, toggleDarkMode, userPrefersDarkMode };

package/dist/main.js

@@ -1,5 +1,6 @@
-export { breakpointAttribute, buildBreakpoint, createBreakpointUpdater, defaultBreakpoints, expandBreakpoints, observeBreakpoint, registeredBreakpoints, setupBreakpoints } from './lib/breakpoints.js';
-export { formatDate, formatList, formatNumber, formatRelativeTime, parseDate } from './lib/format.js';
-export { LocalizationOptions, getLocale, getLocalizationOptions, setLocale, setLocalizationOptions } from './lib/localization.js';
-export { computed, effect, sharedSignal, signal } from './lib/signals.js';
-export { attachDarkModeToggle, darkModeIcon, isDarkModeEnabled, lightModeIcon, setTheme, toggleDarkMode, userPrefersDarkMode } from './lib/theming.js';
+import { computed, effect, sharedSignal, signal } from "./lib/signals.js";
+import { breakpointAttribute, buildBreakpoint, createBreakpointUpdater, defaultBreakpoints, expandBreakpoints, observeBreakpoint, registeredBreakpoints, setupBreakpoints } from "./lib/breakpoints.js";
+import { formatDate, formatList, formatNumber, formatRelativeTime, parseDate } from "./lib/format.js";
+import { LocalizationOptions, getLocale, getLocalizationOptions, setLocale, setLocalizationOptions } from "./lib/localization.js";
+import { attachDarkModeToggle, darkModeIcon, isDarkModeEnabled, lightModeIcon, setTheme, toggleDarkMode, userPrefersDarkMode } from "./lib/theming.js";
+export { LocalizationOptions, attachDarkModeToggle, breakpointAttribute, buildBreakpoint, computed, createBreakpointUpdater, darkModeIcon, defaultBreakpoints, effect, expandBreakpoints, formatDate, formatList, formatNumber, formatRelativeTime, getLocale, getLocalizationOptions, isDarkModeEnabled, lightModeIcon, observeBreakpoint, parseDate, registeredBreakpoints, setLocale, setLocalizationOptions, setTheme, setupBreakpoints, sharedSignal, signal, toggleDarkMode, userPrefersDarkMode };