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

package/dist/{lib/mixins/is-localized.d.ts → i18n/lib/is-localized.mixin.d.ts}

@@ -1,7 +1,7 @@
 import { Signal } from '@lit-labs/signals';
-import { CustomElement } from '../models';
-import { formatDate, formatList, formatNumber, formatRelativeTime, getLocale } from '../utils';
-import { Constructor } from './dedupe-mixin';
+import { Constructor, CustomElement } from '@odx/foundation';
+import { formatDate, formatList, formatNumber, formatRelativeTime } from './format.js';
+import { getLocale } from './localization.js';
 export interface IsLocalized {
     readonly locale: Signal.Computed<ReturnType<typeof getLocale>>;
     formatDate: typeof formatDate;
@@ -10,4 +10,4 @@ export interface IsLocalized {
     formatRelativeTime: typeof formatRelativeTime;
 }
 export declare const IsLocalized: <T extends Constructor<CustomElement>>(superClass: T) => Constructor<IsLocalized> & T;
-//# sourceMappingURL=is-localized.d.ts.map
+//# sourceMappingURL=is-localized.mixin.d.ts.map

package/dist/{lib/mixins/is-localized.js → i18n/lib/is-localized.mixin.js}

@@ -1,8 +1,8 @@
 import { SignalWatcher, computed } from '@lit-labs/signals';
+import { dedupeMixin } from '@odx/foundation';
 import { property } from 'lit/decorators.js';
-import { dedupeMixin } from './dedupe-mixin.js';
-import { getLocale } from '../utils/localization.js';
-import { formatDate, formatNumber, formatList, formatRelativeTime } from '../utils/format.js';
+import { formatDate, formatNumber, formatList, formatRelativeTime } from './format.js';
+import { getLocale } from './localization.js';
 
 var __defProp = Object.defineProperty;
 var __decorateClass = (decorators, target, key, kind) => {
@@ -19,16 +19,16 @@ const IsLocalized = dedupeMixin((superClass) => {
       super(...arguments);
       this.locale = computed(() => getLocale(this.lang));
     }
-    formatDate(input, options) {
+    formatDate(...[input, options]) {
       return formatDate(input, { ...options, locale: options?.locale ?? this.locale.get() });
     }
-    formatNumber(input, options) {
+    formatNumber(...[input, options]) {
       return formatNumber(input, { ...options, locale: options?.locale ?? this.locale.get() });
     }
-    formatList(input, options) {
+    formatList(...[input, options]) {
       return formatList(input, { ...options, locale: options?.locale ?? this.locale.get() });
     }
-    formatRelativeTime(input, options) {
+    formatRelativeTime(...[input, options]) {
       return formatRelativeTime(input, { ...options, locale: options?.locale ?? this.locale.get() });
     }
   }

package/dist/i18n/lib/localization.d.ts

@@ -0,0 +1,5 @@
+import { Locale } from './models.js';
+export declare function watchLocaleChanges(root?: HTMLElement): void;
+export declare function setLocale(locale: Locale | null): void;
+export declare function getLocale(locale?: Locale | null): Intl.Locale;
+//# sourceMappingURL=localization.d.ts.map

package/dist/i18n/lib/localization.js

@@ -0,0 +1,28 @@
+import { signal } from '@lit-labs/signals';
+import { createMutationObserver } from '@odx/foundation';
+import { getI18nOptions } from './config.js';
+
+const activeLocale = signal(null, { equals: (t, t2) => t?.toString() === t2?.toString() });
+function watchLocaleChanges(root = document.documentElement) {
+  const updateLocale = () => activeLocale.set(getLocale(root.lang));
+  const observer = createMutationObserver(updateLocale);
+  observer.observe(root, { attributes: true, attributeFilter: ["lang"] });
+  updateLocale();
+}
+function setLocale(locale) {
+  if (locale === null) {
+    document.documentElement.lang = getI18nOptions().defaultLocale().toString();
+  } else {
+    document.documentElement.lang = getLocale(locale).toString();
+  }
+}
+function getLocale(locale) {
+  const fallbackLocale = activeLocale.get() || getI18nOptions().defaultLocale();
+  try {
+    return new Intl.Locale(locale || fallbackLocale);
+  } catch {
+    return new Intl.Locale(fallbackLocale);
+  }
+}
+
+export { getLocale, setLocale, watchLocaleChanges };

package/dist/{lib/models/single-unit-identifier.d.ts → i18n/lib/models.d.ts}

@@ -1,6 +1,7 @@
+export type Locale = Intl.UnicodeBCP47LocaleIdentifier | Intl.Locale;
 /**
  * Single units sanctioned for use in ECMAScript.
  * See: https://tc39.es/ecma402/#table-sanctioned-single-unit-identifiers
  */
 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=single-unit-identifier.d.ts.map
+//# sourceMappingURL=models.d.ts.map

package/dist/i18n/lib/translate.d.ts

@@ -0,0 +1,5 @@
+import { Signal } from '@lit-labs/signals';
+import { Locale } from './models.js';
+export declare function setTranslation(locale: Locale, translation: Record<string, string>): void;
+export declare function translate(key: string, context?: Record<string, string | number> | null, locale?: Locale | null): Signal.Computed<string>;
+//# sourceMappingURL=translate.d.ts.map

package/dist/i18n/lib/translate.js

@@ -0,0 +1,18 @@
+import { signal, computed } from '@lit-labs/signals';
+import { interpolate } from '@odx/foundation';
+import { getLocale } from './localization.js';
+
+const translations = signal({});
+function setTranslation(locale, translation) {
+  const { language } = getLocale(locale);
+  translations.set({ ...translations.get(), [language]: { ...translations.get()[language], ...translation } });
+}
+function translate(key, context, locale) {
+  return computed(() => {
+    const translation = translations.get()[getLocale(locale).language];
+    if (typeof translation?.[key] !== "string") return key;
+    return interpolate(translation[key], { ...translation, ...context });
+  });
+}
+
+export { setTranslation, translate };

package/dist/i18n/main.d.ts

@@ -0,0 +1,7 @@
+export * from './lib/config.js';
+export * from './lib/format.js';
+export * from './lib/is-localized.mixin.js';
+export * from './lib/localization.js';
+export * from './lib/models.js';
+export * from './lib/translate.js';
+//# sourceMappingURL=main.d.ts.map

package/dist/i18n/main.js

@@ -0,0 +1,5 @@
+export { getI18nOptions, setI18nOptions } from './lib/config.js';
+export { formatDate, formatList, formatNumber, formatRelativeTime } from './lib/format.js';
+export { IsLocalized } from './lib/is-localized.mixin.js';
+export { getLocale, setLocale, watchLocaleChanges } from './lib/localization.js';
+export { setTranslation, translate } from './lib/translate.js';

package/dist/lib/controllers/focus-trap.controller.js

@@ -1,7 +1,7 @@
 import { createFocusTrap } from 'focus-trap';
 import { isServer } from 'lit';
-import { createOptions } from '../utils/create-options.js';
-import { waitForAnimations } from '../utils/wait-for-animations.js';
+import { waitForAnimations } from '../utils/dom.js';
+import { createOptions } from '../utils/object.js';
 
 const FocusTrapControllerOptions = createOptions({
   escapeDeactivates: false,

package/dist/lib/{utils → decorators}/request-update-on-aria-change.d.ts

@@ -1,5 +1,5 @@
 import { ReactiveElement } from 'lit';
-import { ARIAProperty } from '../models';
+import { ARIAProperty } from '../models/aria-mixin-strict.js';
 /**
  * Sets up a `ReactiveElement` constructor to enable updates when delegating
  * aria attributes. Elements may bind `this.aria*` properties to `aria-*`

package/dist/lib/directives/slot-fallback.js

@@ -1,12 +1,12 @@
 import { directive, Directive } from 'lit/directive.js';
+import { toggleAttribute } from '../utils/dom.js';
 
 class SlotFallbackDirective extends Directive {
   update({ options, element }) {
-    if (!options?.host || !(element instanceof HTMLSlotElement)) return;
-    const host = options.host;
-    const slottedElementSelector = element.name ? `[slot="${element.name}"]` : "*";
-    if (host.querySelectorAll(slottedElementSelector).length > 0 || host.textContent?.trim()) return;
-    host.textContent = "";
+    const host = options?.host;
+    if (!host || !(element instanceof HTMLSlotElement)) return;
+    const attributeName = ["empty-slot", element.name].filter(Boolean).join("-");
+    toggleAttribute(host, attributeName, !host.textContent?.trim() && element.assignedElements().length === 0);
   }
   render() {
   }

package/dist/lib/facade/checkbox-form-control.d.ts

@@ -1,5 +1,5 @@
-import { CustomElement } from '../models';
-declare const CheckboxFormControl_base: import('../mixins').Constructor<import('../mixins').IsFormControl<string>> & typeof CustomElement;
+import { CustomElement } from '../custom-element.js';
+declare const CheckboxFormControl_base: import('../main.js').Constructor<import('../mixins/form-control.js').IsFormControl<string>> & typeof CustomElement;
 export declare abstract class CheckboxFormControl extends CheckboxFormControl_base {
     #private;
     static shadowRootOptions: ShadowRootInit;

package/dist/lib/facade/checkbox-form-control.js

@@ -1,9 +1,9 @@
 import { isServer } from 'lit';
 import { property } from 'lit/decorators.js';
+import { CustomElement } from '../custom-element.js';
+import { toAriaBooleanAttribute } from '../directives/aria-boolean-attr.js';
 import { FormControl } from '../mixins/form-control.js';
 import { getKeyboardEventInfo } from '../utils/keyboard-events.js';
-import { toAriaBooleanAttribute } from '../directives/aria-boolean-attr.js';
-import { CustomElement } from '../models/custom-element.js';
 
 var __defProp = Object.defineProperty;
 var __decorateClass = (decorators, target, key, kind) => {

package/dist/lib/facade/checkbox-group-form-control.d.ts

@@ -1,7 +1,7 @@
 import { PropertyValues } from 'lit';
-import { CustomElement } from '../models';
-import { CheckboxFormControl } from './checkbox-form-control';
-declare const CheckboxGroupFormControl_base: import('../mixins').Constructor<import('../mixins').IsFormControl<string[]>> & typeof CustomElement;
+import { CustomElement } from '../custom-element.js';
+import { CheckboxFormControl } from './checkbox-form-control.js';
+declare const CheckboxGroupFormControl_base: import('../main.js').Constructor<import('../mixins/form-control.js').IsFormControl<string[]>> & typeof CustomElement;
 export declare abstract class CheckboxGroupFormControl extends CheckboxGroupFormControl_base {
     #private;
     private elements;

package/dist/lib/facade/checkbox-group-form-control.js

@@ -1,8 +1,8 @@
 import { isServer } from 'lit';
 import { queryAssignedElements, property } from 'lit/decorators.js';
-import { CheckboxFormControl } from './checkbox-form-control.js';
+import { CustomElement } from '../custom-element.js';
 import { FormControl } from '../mixins/form-control.js';
-import { CustomElement } from '../models/custom-element.js';
+import { CheckboxFormControl } from './checkbox-form-control.js';
 
 var __defProp = Object.defineProperty;
 var __decorateClass = (decorators, target, key, kind) => {

package/dist/lib/facade/option-control.d.ts

@@ -1,7 +1,7 @@
 import { PropertyValueMap } from 'lit';
-import { CanBeDisabled } from '../mixins';
-import { CustomElement } from '../models';
-declare const OptionControl_base: import('../mixins').Constructor<CanBeDisabled> & typeof CustomElement;
+import { CustomElement } from '../custom-element.js';
+import { CanBeDisabled } from '../mixins/can-be-disabled.js';
+declare const OptionControl_base: import('../main.js').Constructor<CanBeDisabled> & typeof CustomElement;
 export declare abstract class OptionControl extends OptionControl_base {
     role: 'option' | 'gridcell' | 'row' | 'tab' | null;
     selected: boolean;

package/dist/lib/facade/option-control.js

@@ -1,7 +1,7 @@
 import { property } from 'lit/decorators.js';
-import { CanBeDisabled } from '../mixins/can-be-disabled.js';
-import { CustomElement } from '../models/custom-element.js';
+import { CustomElement } from '../custom-element.js';
 import { toAriaBooleanAttribute } from '../directives/aria-boolean-attr.js';
+import { CanBeDisabled } from '../mixins/can-be-disabled.js';
 
 var __defProp = Object.defineProperty;
 var __decorateClass = (decorators, target, key, kind) => {

package/dist/lib/facade/radio-group-form-control.d.ts

@@ -1,7 +1,7 @@
 import { PropertyValues } from 'lit';
-import { CustomElement } from '../models';
-import { CheckboxFormControl } from './checkbox-form-control';
-declare const RadioGroupFormControl_base: import('../mixins').Constructor<import('../mixins').IsFormControl<string>> & typeof CustomElement;
+import { CustomElement } from '../custom-element.js';
+import { CheckboxFormControl } from './checkbox-form-control.js';
+declare const RadioGroupFormControl_base: import('../main.js').Constructor<import('../mixins/form-control.js').IsFormControl<string>> & typeof CustomElement;
 export declare abstract class RadioGroupFormControl extends RadioGroupFormControl_base {
     #private;
     static shadowRootOptions: {

package/dist/lib/facade/radio-group-form-control.js

@@ -1,9 +1,9 @@
 import { isServer } from 'lit';
 import { queryAssignedElements } from 'lit/decorators.js';
-import { CheckboxFormControl } from './checkbox-form-control.js';
+import { CustomElement } from '../custom-element.js';
 import { RovingTabindexController } from '../external/roving-tabindex.js';
 import { FormControl } from '../mixins/form-control.js';
-import { CustomElement } from '../models/custom-element.js';
+import { CheckboxFormControl } from './checkbox-form-control.js';
 
 var __defProp = Object.defineProperty;
 var __decorateClass = (decorators, target, key, kind) => {

package/dist/lib/facade/select-form-control.d.ts

@@ -1,7 +1,7 @@
 import { PropertyValues } from 'lit';
-import { CustomElement } from '../models';
-import { OptionControl } from './option-control';
-declare const SelectFormControl_base: import('../mixins').Constructor<import('../mixins').IsFormControl<string | string[]>> & typeof CustomElement;
+import { CustomElement } from '../custom-element.js';
+import { OptionControl } from './option-control.js';
+declare const SelectFormControl_base: import('../main.js').Constructor<import('../mixins/form-control.js').IsFormControl<string | string[]>> & typeof CustomElement;
 export declare abstract class SelectFormControl<Option extends OptionControl = OptionControl> extends SelectFormControl_base {
     #private;
     protected abstract options: Option[];

package/dist/lib/facade/select-form-control.js

@@ -1,10 +1,10 @@
 import { isServer } from 'lit';
 import { property } from 'lit/decorators.js';
-import { OptionControl } from './option-control.js';
-import { getElementFromEvent } from '../utils/dom.js';
+import { CustomElement } from '../custom-element.js';
 import { FormControl } from '../mixins/form-control.js';
-import { CustomElement } from '../models/custom-element.js';
+import { getElementFromEvent } from '../utils/dom.js';
 import { getKeyboardEventInfo } from '../utils/keyboard-events.js';
+import { OptionControl } from './option-control.js';
 
 var __defProp = Object.defineProperty;
 var __decorateClass = (decorators, target, key, kind) => {

package/dist/lib/main.d.ts

@@ -1,8 +1,32 @@
-export * from './controllers';
-export * from './directives';
-export * from './external';
-export * from './facade';
-export * from './mixins';
-export * from './models';
-export * from './utils';
+export * from './controllers/focus-trap.controller.js';
+export * from './decorators/request-update-on-aria-change.js';
+export * from './directives/aria-boolean-attr.js';
+export * from './directives/optional-attr.js';
+export * from './directives/optional-slot.js';
+export * from './directives/slot-fallback.js';
+export * from './external/roving-tabindex.js';
+export * from './facade/checkbox-form-control.js';
+export * from './facade/checkbox-group-form-control.js';
+export * from './facade/option-control.js';
+export * from './facade/radio-group-form-control.js';
+export * from './facade/select-form-control.js';
+export * from './mixins/can-be-disabled.js';
+export * from './mixins/can-be-readonly.js';
+export * from './mixins/can-be-required.js';
+export * from './mixins/can-be-validated.js';
+export * from './mixins/dedupe-mixin.js';
+export * from './mixins/form-control.js';
+export * from './mixins/number-control.js';
+export * from './mixins/with-aria-controls.js';
+export * from './mixins/with-loading-state.js';
+export * from './models/aria-mixin-strict.js';
+export * from './utils/date.js';
+export * from './utils/dom.js';
+export * from './utils/get-unique-id.js';
+export * from './utils/keyboard-events.js';
+export * from './utils/object.js';
+export * from './utils/shared-intersection-observer.js';
+export * from './utils/shared-resize-observer.js';
+export * from './utils/string.js';
+export * from './custom-element.js';
 //# sourceMappingURL=main.d.ts.map

package/dist/lib/main.js

@@ -1,4 +1,5 @@
 export { FocusTrapController } from './controllers/focus-trap.controller.js';
+export { requestUpdateOnAriaChange } from './decorators/request-update-on-aria-change.js';
 export { fromAriaBooleanAttribute, toAriaBooleanAttribute } from './directives/aria-boolean-attr.js';
 export { optionalAttr } from './directives/optional-attr.js';
 export { optionalSlot } from './directives/optional-slot.js';
@@ -15,21 +16,15 @@ export { CanBeRequired } from './mixins/can-be-required.js';
 export { CanBeValidated } from './mixins/can-be-validated.js';
 export { dedupeMixin } from './mixins/dedupe-mixin.js';
 export { FormControl } from './mixins/form-control.js';
-export { IsLocalized } from './mixins/is-localized.js';
-export { IsTranslatable } from './mixins/is-translatable.js';
 export { NumberControl } from './mixins/number-control.js';
 export { WithAriaControls } from './mixins/with-aria-controls.js';
 export { WithLoadingState } from './mixins/with-loading-state.js';
-export { CustomElement, customElement } from './models/custom-element.js';
-export { createMutationObserver } from './utils/create-mutation-observer.js';
-export { createOptions } from './utils/create-options.js';
-export { findClosestDocument, getAssignedElements, getElementFromEvent, toPx, toggleAttribute } from './utils/dom.js';
-export { formatDate, formatList, formatNumber, formatRelativeTime, iso8601DateTimeFormat } from './utils/format.js';
+export { parseDate } from './utils/date.js';
+export { createMutationObserver, findClosestDocument, getAssignedElements, getElementFromEvent, toPx, toggleAttribute, waitForAnimations } from './utils/dom.js';
 export { clearUniqueIdCache, getUniqueId } from './utils/get-unique-id.js';
 export { KeyboardKey, getKeyboardEventInfo } from './utils/keyboard-events.js';
-export { getLocale, getLocalizationOptions, setLocale, setLocalizationOptions, watchLocaleChanges } from './utils/localization.js';
-export { parseDate } from './utils/parse-date.js';
-export { requestUpdateOnAriaChange } from './utils/request-update-on-aria-change.js';
-export { SharedIntersectionObserver } from './utils/shared-intersection-observer.js';
-export { SharedResizeObserver } from './utils/shared-resize-observer.js';
-export { waitForAnimations } from './utils/wait-for-animations.js';
+export { createOptions } from './utils/object.js';
+export { SharedIntersectionObserver, createIntersectionObserver } from './utils/shared-intersection-observer.js';
+export { SharedResizeObserver, createResizeObserver } from './utils/shared-resize-observer.js';
+export { interpolate } from './utils/string.js';
+export { CustomElement, customElement } from './custom-element.js';

package/dist/lib/mixins/can-be-disabled.d.ts

@@ -1,5 +1,5 @@
-import { CustomElement } from '../models';
-import { Constructor } from './dedupe-mixin';
+import { CustomElement } from '../custom-element.js';
+import { Constructor } from './dedupe-mixin.js';
 export interface CanBeDisabled {
     disabled: boolean;
     _contextDisabled: boolean;

package/dist/lib/mixins/can-be-readonly.d.ts

@@ -1,5 +1,5 @@
-import { CustomElement } from '../models';
-import { Constructor } from './dedupe-mixin';
+import { CustomElement } from '../custom-element.js';
+import { Constructor } from './dedupe-mixin.js';
 export interface CanBeReadonly {
     readonly: boolean;
 }

package/dist/lib/mixins/can-be-required.d.ts

@@ -1,5 +1,5 @@
-import { CustomElement } from '../models';
-import { Constructor } from './dedupe-mixin';
+import { CustomElement } from '../custom-element.js';
+import { Constructor } from './dedupe-mixin.js';
 export interface CanBeRequired {
     required: boolean;
 }

package/dist/lib/mixins/can-be-validated.d.ts

@@ -1,5 +1,5 @@
-import { CustomElement } from '../models';
-import { Constructor } from './dedupe-mixin';
+import { CustomElement } from '../custom-element.js';
+import { Constructor } from './dedupe-mixin.js';
 export interface CanBeValidated {
     readonly internals: ElementInternals;
     get validity(): ValidityState;

package/dist/lib/mixins/form-control.d.ts

@@ -1,9 +1,9 @@
-import { CustomElement } from '../models';
-import { CanBeDisabled } from './can-be-disabled';
-import { CanBeReadonly } from './can-be-readonly';
-import { CanBeRequired } from './can-be-required';
-import { CanBeValidated } from './can-be-validated';
-import { Constructor } from './dedupe-mixin';
+import { CustomElement } from '../custom-element.js';
+import { CanBeDisabled } from './can-be-disabled.js';
+import { CanBeReadonly } from './can-be-readonly.js';
+import { CanBeRequired } from './can-be-required.js';
+import { CanBeValidated } from './can-be-validated.js';
+import { Constructor } from './dedupe-mixin.js';
 type ValueType = string | number | boolean | string[] | number[] | boolean[];
 export interface IsFormControl<V extends ValueType = string> extends CanBeDisabled, CanBeReadonly, CanBeRequired, CanBeValidated {
     form: HTMLFormElement | null;

package/dist/lib/mixins/form-control.js

@@ -1,10 +1,10 @@
 import { property } from 'lit/decorators.js';
+import { CustomElement } from '../custom-element.js';
 import { CanBeDisabled } from './can-be-disabled.js';
 import { CanBeReadonly } from './can-be-readonly.js';
 import { CanBeRequired } from './can-be-required.js';
 import { CanBeValidated } from './can-be-validated.js';
 import { dedupeMixin } from './dedupe-mixin.js';
-import { CustomElement } from '../models/custom-element.js';
 
 var __defProp = Object.defineProperty;
 var __decorateClass = (decorators, target, key, kind) => {

package/dist/lib/mixins/number-control.d.ts

@@ -1,6 +1,6 @@
-import { CustomElement } from '../models';
-import { Constructor } from './dedupe-mixin';
-import { IsFormControl } from './form-control';
+import { CustomElement } from '../custom-element.js';
+import { Constructor } from './dedupe-mixin.js';
+import { IsFormControl } from './form-control.js';
 export interface IsNumberControl extends Omit<IsFormControl, 'value'> {
     min: number;
     max: number;

package/dist/lib/mixins/with-aria-controls.d.ts

@@ -1,6 +1,6 @@
-import { CustomElement } from '../models';
-import { CanBeDisabled } from './can-be-disabled';
-import { Constructor } from './dedupe-mixin';
+import { CustomElement } from '../custom-element.js';
+import { CanBeDisabled } from './can-be-disabled.js';
+import { Constructor } from './dedupe-mixin.js';
 export interface WithAriaControls extends CanBeDisabled {
     id: string;
     readonly region: HTMLElement | null;

package/dist/lib/mixins/with-aria-controls.js

@@ -1,7 +1,7 @@
 import { property } from 'lit/decorators.js';
+import { getUniqueId } from '../utils/get-unique-id.js';
 import { CanBeDisabled } from './can-be-disabled.js';
 import { dedupeMixin } from './dedupe-mixin.js';
-import { getUniqueId } from '../utils/get-unique-id.js';
 
 var __defProp = Object.defineProperty;
 var __decorateClass = (decorators, target, key, kind) => {

package/dist/lib/mixins/with-loading-state.d.ts

@@ -1,5 +1,5 @@
-import { CustomElement } from '../models';
-import { Constructor } from './dedupe-mixin';
+import { CustomElement } from '../custom-element.js';
+import { Constructor } from './dedupe-mixin.js';
 export interface HasLoadingState {
     loading: boolean;
     get loadingContainer(): HTMLElement;

package/dist/lib/utils/{parse-date.d.ts → date.d.ts}

@@ -1,2 +1,2 @@
 export declare function parseDate(value: number | string | Date): Date | null;
-//# sourceMappingURL=parse-date.d.ts.map
+//# sourceMappingURL=date.d.ts.map

package/dist/lib/utils/dom.d.ts

@@ -1,6 +1,14 @@
+/**
+ * Creates a new MutationObserver instance.
+ *
+ * @param {MutationCallback} callback - The callback to execute when a mutation occurs.
+ * @returns {MutationObserver} A MutationObserver instance or a dummy object with no-op methods if unsupported.
+ */
+export declare function createMutationObserver(callback: MutationCallback): MutationObserver;
 export declare function toggleAttribute(element: Element | null | undefined, name: string, value?: string | number | boolean | null): void;
 export declare function getElementFromEvent<T>(event: Event, filterFn: (node: Element) => boolean): T;
 export declare function findClosestDocument(node: Node): ShadowRoot | Document | null;
 export declare function toPx(value?: string | number | null): string | null;
 export declare function getAssignedElements<T extends HTMLElement = HTMLElement>(host: HTMLElement, ...slots: string[]): T[];
+export declare function waitForAnimations(element?: Element | null, subtree?: boolean): Promise<Animation[]>;
 //# sourceMappingURL=dom.d.ts.map

package/dist/lib/utils/dom.js

@@ -1,5 +1,12 @@
 import { round } from 'es-toolkit';
 
+function createMutationObserver(callback) {
+  try {
+    return new MutationObserver(callback);
+  } catch {
+    return { takeRecords: () => [], observe: () => void 0, disconnect: () => void 0 };
+  }
+}
 function toggleAttribute(element, name, value) {
   if (!element) return;
   if (typeof value === "boolean") {
@@ -31,5 +38,11 @@ function getAssignedElements(host, ...slots) {
   const selector = slots.map((slot) => `[slot=${slot}]`).join(", ") || "*";
   return Array.from(host.querySelectorAll(`:is(${selector})`));
 }
+async function waitForAnimations(element, subtree = false) {
+  if (!element || typeof element.getAnimations !== "function") {
+    return [];
+  }
+  return Promise.all(element.getAnimations({ subtree }).map((animation) => animation.finished)).catch(() => []);
+}
 
-export { findClosestDocument, getAssignedElements, getElementFromEvent, toPx, toggleAttribute };
+export { createMutationObserver, findClosestDocument, getAssignedElements, getElementFromEvent, toPx, toggleAttribute, waitForAnimations };

package/dist/lib/utils/{create-options.d.ts → object.d.ts}

@@ -1,2 +1,2 @@
 export declare function createOptions<T extends object>(defaultOptions: T): (options?: Partial<T> | null) => T;
-//# sourceMappingURL=create-options.d.ts.map
+//# sourceMappingURL=object.d.ts.map

package/dist/lib/utils/shared-intersection-observer.d.ts

@@ -1,3 +1,10 @@
+/**
+ * Creates a IntersectionObserver instance safely, falling back to a dummy if the API is not supported.
+ *
+ * @param {IntersectionObserverCallback} callback - The callback to execute when an observed element's size changes.
+ * @returns {IntersectionObserver} A IntersectionObserver instance or a dummy object with no-op methods if unsupported.
+ */
+export declare function createIntersectionObserver(callback: IntersectionObserverCallback): IntersectionObserver;
 export interface SharedIntersectionObserverOptions {
     fpsLimit: number;
 }

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

@@ -1,5 +1,10 @@
-import { createIntersectionObserver } from './create-intersection-observer.js';
-
+function createIntersectionObserver(callback) {
+  try {
+    return new IntersectionObserver(callback);
+  } catch {
+    return { root: null, rootMargin: "", thresholds: [], takeRecords: () => [], observe: () => void 0, disconnect: () => void 0, unobserve: () => void 0 };
+  }
+}
 class SharedIntersectionObserverInstance {
   #observer;
   #handlers = /* @__PURE__ */ new WeakMap();
@@ -29,4 +34,4 @@ class SharedIntersectionObserverInstance {
 }
 const SharedIntersectionObserver = new SharedIntersectionObserverInstance();
 
-export { SharedIntersectionObserver };
+export { SharedIntersectionObserver, createIntersectionObserver };

package/dist/lib/utils/shared-resize-observer.d.ts

@@ -1,3 +1,10 @@
+/**
+ * Creates a ResizeObserver instance safely, falling back to a dummy if the API is not supported.
+ *
+ * @param {ResizeObserverCallback} callback - The callback to execute when an observed element's size changes.
+ * @returns {ResizeObserver} A ResizeObserver instance or a dummy object with no-op methods if unsupported.
+ */
+export declare function createResizeObserver(callback: ResizeObserverCallback): ResizeObserver;
 export interface SharedResizeObserverOptions extends ResizeObserverOptions {
     fpsLimit: number;
 }

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

@@ -1,5 +1,10 @@
-import { createResizeObserver } from './create-resize-observer.js';
-
+function createResizeObserver(callback) {
+  try {
+    return new ResizeObserver(callback);
+  } catch {
+    return { observe: () => void 0, disconnect: () => void 0, unobserve: () => void 0 };
+  }
+}
 class SharedResizeObserverInstance {
   #observer;
   #handlers = /* @__PURE__ */ new WeakMap();
@@ -30,4 +35,4 @@ class SharedResizeObserverInstance {
 }
 const SharedResizeObserver = new SharedResizeObserverInstance();
 
-export { SharedResizeObserver };
+export { SharedResizeObserver, createResizeObserver };

package/dist/lib/utils/string.d.ts

@@ -0,0 +1,2 @@
+export declare function interpolate(value: string, context: Record<string, string | number>): string;
+//# sourceMappingURL=string.d.ts.map