@oscarpalmer/oui 0.40.0 → 0.41.0

package/dist/js/{combobox.state-BfJ3Hxg8.mjs → combobox.state-AstCICiH.mjs}

@@ -1,12 +1,12 @@
 import { createEmbeddedFloatable } from "./floatable/floatable.embedded.mjs";
-import { createLocalizations, updateLocalizations } from "./l10n/index.mjs";
+import { createDefaultLocalizations, createLocalizations } from "./internal/l10n/index.mjs";
 import { getAttributeValue, getBooleanAriaValue } from "./internal/misc.mjs";
-import { LISTBOX_KEYS_ACTIVATION, LISTBOX_TYPES } from "./internal/listbox/listbox.constants.mjs";
-import { b as updateListboxValueLabel, i as filterListboxOptions, n as filterListbox, o as setListboxValues, r as filterListboxOption, s as toggleListboxOption, t as applyListboxSelection, v as updateListboxMessage, x as generateListboxIds, y as updateListboxPreview } from "./listbox.data-BQyZGKgr.mjs";
-import { initializeListboxState } from "./internal/listbox/listbox.state.mjs";
+import { OPTION_LIST_KEYS_ACTIVATION, OPTION_LIST_TYPES } from "./internal/option-list/option-list.constants.mjs";
+import { i as filterOptionListOptions, n as filterOptionList, o as setOptionListValues, r as filterOptionListOption, s as toggleOptionListOption, t as applyOptionListSelection, x as generateOptionListIds, y as updateOptionListPreview } from "./option-list.data-CgMyUwPc.mjs";
+import { initializeOptionListState } from "./internal/option-list/option-list.state.mjs";
 import { COMBOBOX_ATTRIBUTE_SELECTION_ITEM, COMBOBOX_AUTOCOMPLETES, COMBOBOX_SYMBOL, COMBOBOX_TAGNAME, comboboxAttributes, comboboxMessages, comboboxSelectors } from "./combobox/combobox.constants.mjs";
-import { createComboboxAnchor, createComboboxContent, updateComboboxAutocomplete, updateComboboxSelection, updateComboboxSelectionItems, updateComboboxTabindices } from "./combobox/combobox.dom.mjs";
-import { processListboxKeydown } from "./internal/listbox/listbox.event.mjs";
+import { createComboboxAnchor, createComboboxContent, updateComboboxAutocomplete, updateComboboxSelection, updateComboboxTabindices } from "./combobox/combobox.dom.mjs";
+import { processOptionListKeydown } from "./internal/option-list/option-list.event.mjs";
 import { setAria } from "@oscarpalmer/toretto/aria";
 import { setAttributes } from "@oscarpalmer/toretto/attribute";
 import { on } from "@oscarpalmer/toretto/event";
@@ -35,16 +35,8 @@ function hasTextSelection(element) {
 	return element instanceof HTMLInputElement && element.selectionStart !== element.selectionEnd;
 }
 function setComboboxLocalizations(first, second) {
-	updateComboboxLocalizations(comboboxLocalizations, comboboxLocalizations.values, first, second);
-}
-function updateComboboxLocalizations(instance, destination, first, second) {
-	updateLocalizations(instance, typeof first === "string" ? { [first]: second } : first, destination, () => {
-		for (const state of comboboxes) {
-			updateListboxMessage(state);
-			updateListboxValueLabel(state);
-			updateComboboxSelectionItems(state);
-		}
-	});
+	if (second === true) comboboxLocalizations.setDefaults(first);
+	else comboboxLocalizations.setLanguages(first, second);
 }
 let index = 0;
 //#endregion
@@ -62,7 +54,7 @@ function onComboboxClickContent(event, state) {
 	const option = findAncestor(event, comboboxSelectors.option);
 	if (!(option instanceof HTMLElement)) filter.element.focus();
 	else if (readonly) onComboboxPreview("set", state, option);
-	else toggleListboxOption(state, option);
+	else toggleOptionListOption(state, option);
 }
 function onComboboxClickDocument(event) {
 	const combobox = findAncestor(event, COMBOBOX_TAGNAME);
@@ -86,7 +78,7 @@ function onComboboxClickDocument(event) {
 		const option = options.selected.find((option) => option.id === getData(selection, "option", false));
 		if (disabled) state.component.anchor.element.focus();
 		else if (readonly) updateComboboxTabindices(state, option);
-		else toggleListboxOption(state, option);
+		else toggleOptionListOption(state, option);
 		return;
 	}
 	if (findAncestor(event, comboboxSelectors.anchor) != null && !disabled) {
@@ -98,18 +90,18 @@ function onComboboxEnter(state) {
 	const { active, anchor, disabled, readonly } = state.component;
 	if (disabled || readonly) return;
 	if (hasTextSelection(anchor.element)) onComboboxSelection(state, true);
-	else toggleListboxOption(state, active);
+	else toggleOptionListOption(state, active);
 }
 function onComboboxEscape(state) {
 	state.component.floatable.hide();
 }
 function onComboboxFilter(preview, state, update, active, emit) {
-	if (state.component.autocomplete.none) applyListboxSelection({
+	if (state.component.autocomplete.none) applyOptionListSelection({
 		state,
 		added: false,
 		emit: (emit ?? true) && update
 	});
-	else updateListboxPreview(preview, state, active);
+	else updateOptionListPreview(preview, state, active);
 }
 function onComboboxFocusout(event) {
 	setTimeout(() => {
@@ -117,8 +109,8 @@ function onComboboxFocusout(event) {
 		const state = combobox?.[COMBOBOX_SYMBOL];
 		const component = state?.component;
 		if (combobox == null || state == null || component == null || component.disabled || component.readonly || component.type === "select" || component.host === document.activeElement || component.host.contains(document.activeElement)) return;
-		const option = filterListboxOption(state, component.filter.element.value, true);
-		applyListboxSelection({
+		const option = filterOptionListOption(state, component.filter.element.value, true);
+		applyOptionListSelection({
 			option,
 			state,
 			added: false,
@@ -129,7 +121,7 @@ function onComboboxFocusout(event) {
 function onComboboxInput(event) {
 	const combobox = findAncestor(event, COMBOBOX_TAGNAME);
 	const state = combobox?.[COMBOBOX_SYMBOL];
-	if (combobox != null && state != null && event.target === state.component.filter.element) filterListbox(event.inputType, state);
+	if (combobox != null && state != null && event.target === state.component.filter.element) filterOptionList(event.inputType, state);
 }
 function onComboboxKeydown(event) {
 	const combobox = findAncestor(event, COMBOBOX_TAGNAME);
@@ -137,10 +129,10 @@ function onComboboxKeydown(event) {
 	if (combobox == null || state == null) return;
 	const item = findAncestor(event, comboboxSelectors.selectionItem);
 	if (item instanceof HTMLElement) onComboboxKeydownSelection(event, state, item);
-	else processListboxKeydown(event, state);
+	else processOptionListKeydown(event, state);
 }
 function onComboboxKeydownSelection(event, state, item) {
-	if (LISTBOX_KEYS_ACTIVATION.has(event.key)) {
+	if (OPTION_LIST_KEYS_ACTIVATION.has(event.key)) {
 		event.preventDefault();
 		onComboboxRemoveSelection(state, item);
 		return;
@@ -180,16 +172,16 @@ function onComboboxRemoveSelection(state, item) {
 	const { disabled, options, readonly } = state.component;
 	if (disabled || readonly) return;
 	const option = options.selected.find((option) => option.id === getData(item, "option", false));
-	if (option != null) toggleListboxOption(state, option);
+	if (option != null) toggleOptionListOption(state, option);
 }
 function onComboboxNavigation(preview, state, active) {
-	updateListboxPreview(preview, state, active);
+	updateOptionListPreview(preview, state, active);
 }
 function onComboboxSelection(state, hasSelection) {
 	const { active, anchor, filter } = state.component;
 	if (!(hasSelection ?? hasTextSelection(anchor.element))) return;
 	filter.value = anchor.element === filter.element ? filter.element.value : "";
-	toggleListboxOption(state, filterListboxOptions(state) ?? active);
+	toggleOptionListOption(state, filterOptionListOptions(state) ?? active);
 }
 function onComboboxTab(state) {
 	setTimeout(() => {
@@ -217,16 +209,16 @@ on(document, "keydown", onComboboxKeydown, { passive: false });
 //#region src/js/combobox/combobox.state.ts
 function createComponentState(element, state) {
 	const select = element.querySelector("select");
-	if (select == null || select.id === "") throw new Error(comboboxMessages.select);
+	if (!(select instanceof HTMLSelectElement) || select.id === "") throw new Error(comboboxMessages.select);
 	const label = element.querySelector(`label[for="${select.id}"]`);
-	if (label == null) throw new Error(comboboxMessages.label);
+	if (!(label instanceof HTMLLabelElement)) throw new Error(comboboxMessages.label);
 	element.id = select.id;
 	const disabled = getBooleanAriaValue(element, "disabled") || select.disabled;
 	const multiple = element.multiple || select.multiple;
 	const readonly = getBooleanAriaValue(element, "readonly");
 	const required = getBooleanAriaValue(element, "required") || select.required;
 	const id = getComboboxId();
-	const type = multiple ? "select" : getAttributeValue(element, "type", LISTBOX_TYPES, "select");
+	const type = multiple ? "select" : getAttributeValue(element, "type", OPTION_LIST_TYPES, "select");
 	const autocomplete = getComboboxAutoComplete(element, type === "select");
 	setAttributes(element, {
 		autocomplete: autocomplete.value,
@@ -235,7 +227,7 @@ function createComponentState(element, state) {
 	const labelId = label.id;
 	label.htmlFor = id;
 	label.id = `${id}_label`;
-	generateListboxIds(id, select);
+	generateOptionListIds(id, select);
 	const parameters = {
 		autocomplete,
 		element,
@@ -287,10 +279,7 @@ function createComponentState(element, state) {
 		list: content.list.element,
 		listbox: false,
 		listeners: [],
-		localizations: {
-			component: {},
-			global: comboboxLocalizations
-		},
+		localizations: createLocalizations(comboboxLocalizations),
 		message: content.message,
 		name: element.name,
 		options: {
@@ -304,13 +293,13 @@ function createComponentState(element, state) {
 			label: content.value
 		}
 	};
-	return initializeListboxState(state, comboboxes, onAttachCombobox);
+	return initializeOptionListState(state, comboboxes, onAttachCombobox);
 }
 function initializeCombobox(element, state) {
 	element.tabIndex = -1;
 	createComponentState(element, state);
 	if (state.form.restored != null) {
-		setListboxValues(state, state.form.restored);
+		setOptionListValues(state, state.form.restored);
 		state.form.restored = void 0;
 	}
 }
@@ -364,7 +353,7 @@ const comboboxCallbacks = {
 		skipNavigation: skipComboboxNavigation
 	}
 };
-const comboboxLocalizations = createLocalizations({
+const comboboxLocalizations = createDefaultLocalizations({
 	empty: "No results found",
 	input: "Please enter a value",
 	invalid: "Please select an option from the list",
@@ -376,4 +365,4 @@ const comboboxLocalizations = createLocalizations({
 });
 const comboboxes = /* @__PURE__ */ new Set();
 //#endregion
-export { skipComboboxNavigation as C, setComboboxLocalizations as D, hasTextSelection as E, updateComboboxLocalizations as O, preventComboboxActivation as S, getComboboxId as T, onComboboxPreview as _, onDetachCombobox as a, onComboboxTab as b, onComboboxClickContent as c, onComboboxFilter as d, onComboboxFocusout as f, onComboboxNavigation as g, onComboboxKeydownSelection as h, onAttachCombobox as i, onComboboxEnter as l, onComboboxKeydown as m, comboboxes as n, onComboboxActivation as o, onComboboxInput as p, initializeCombobox as r, onComboboxApply as s, comboboxLocalizations as t, onComboboxEscape as u, onComboboxRemoveSelection as v, getComboboxAutoComplete as w, onComboboxToggle as x, onComboboxSelection as y };
+export { skipComboboxNavigation as C, setComboboxLocalizations as D, hasTextSelection as E, preventComboboxActivation as S, getComboboxId as T, onComboboxPreview as _, onDetachCombobox as a, onComboboxTab as b, onComboboxClickContent as c, onComboboxFilter as d, onComboboxFocusout as f, onComboboxNavigation as g, onComboboxKeydownSelection as h, onAttachCombobox as i, onComboboxEnter as l, onComboboxKeydown as m, comboboxes as n, onComboboxActivation as o, onComboboxInput as p, initializeCombobox as r, onComboboxApply as s, comboboxLocalizations as t, onComboboxEscape as u, onComboboxRemoveSelection as v, getComboboxAutoComplete as w, onComboboxToggle as x, onComboboxSelection as y };

package/dist/js/dialog/dialog.model.d.mts

@@ -1,2 +1,2 @@
-import { a as DIALOG_SELECTOR_MOVER, c as OuiDialog, i as DIALOG_MESSAGE, l as OuiDialogState, n as DIALOG_ATTRIBUTE_CONTAINER, o as DIALOG_SELECTOR_RESIZER, r as DIALOG_ATTRIBUTE_OPEN, s as DIALOG_SYMBOL, t as DIALOG_ATTRIBUTE, u as dialogs } from "../dialog.model-DX2mndMh.mjs";
+import { a as DIALOG_SELECTOR_MOVER, c as OuiDialog, i as DIALOG_MESSAGE, l as OuiDialogState, n as DIALOG_ATTRIBUTE_CONTAINER, o as DIALOG_SELECTOR_RESIZER, r as DIALOG_ATTRIBUTE_OPEN, s as DIALOG_SYMBOL, t as DIALOG_ATTRIBUTE, u as dialogs } from "../dialog.model-HVzYWoDo.mjs";
 export { DIALOG_ATTRIBUTE, DIALOG_ATTRIBUTE_CONTAINER, DIALOG_ATTRIBUTE_OPEN, DIALOG_MESSAGE, DIALOG_SELECTOR_MOVER, DIALOG_SELECTOR_RESIZER, DIALOG_SYMBOL, OuiDialog, OuiDialogState, dialogs };

package/dist/js/dialog/index.d.mts

@@ -1,4 +1,4 @@
-import { c as OuiDialog, l as OuiDialogState } from "../dialog.model-DX2mndMh.mjs";
+import { c as OuiDialog, l as OuiDialogState } from "../dialog.model-HVzYWoDo.mjs";
 //#region src/js/dialog/index.d.ts
 declare function OuiDialog(this: OuiDialog, state: OuiDialogState): void;
 /**

package/dist/js/{dialog.model-DX2mndMh.d.mts → dialog.model-HVzYWoDo.d.mts}

@@ -1,5 +1,5 @@
-import { u as OuiMovable } from "./movable.model-BHaK_mKw.mjs";
-import { n as OuiResizable } from "./resizable.model-BwzJcTVJ.mjs";
+import { u as OuiMovable } from "./movable.model-D9nnPWKk.mjs";
+import { n as OuiResizable } from "./resizable.model-YEtcC9li.mjs";
 import { RemovableEventListener } from "@oscarpalmer/toretto/models";
 //#region src/js/dialog/dialog.model.d.ts
 type OuiDialog = {
@@ -40,6 +40,6 @@ declare const DIALOG_MESSAGE = "The element must be an instance of HTMLDialogEle
 declare const DIALOG_SELECTOR_MOVER: string;
 declare const DIALOG_SELECTOR_RESIZER: string;
 declare const DIALOG_SYMBOL: unique symbol;
-declare const dialogs: WeakMap<HTMLElement, OuiDialogState>;
+declare const dialogs: WeakMap<Element, OuiDialogState>;
 //#endregion
 export { DIALOG_SELECTOR_MOVER as a, OuiDialog as c, DIALOG_MESSAGE as i, OuiDialogState as l, DIALOG_ATTRIBUTE_CONTAINER as n, DIALOG_SELECTOR_RESIZER as o, DIALOG_ATTRIBUTE_OPEN as r, DIALOG_SYMBOL as s, DIALOG_ATTRIBUTE as t, dialogs as u };

package/dist/js/floatable/floatable.embedded.d.mts

@@ -1,2 +1,2 @@
-import { i as removeFloatable, n as createFloatable, r as getOnBeforeToggleListener, t as createEmbeddedFloatable } from "../floatable.embedded-MeTyXjFn.mjs";
+import { i as removeFloatable, n as createFloatable, r as getOnBeforeToggleListener, t as createEmbeddedFloatable } from "../floatable.embedded-ncshL3Sa.mjs";
 export { createEmbeddedFloatable, createFloatable, getOnBeforeToggleListener, removeFloatable };

package/dist/js/floatable/floatable.embedded.mjs

@@ -60,8 +60,8 @@ function destroyFloatable() {
 	if (state.destroyed) return;
 	state.destroyed = true;
 	removeFloatable(state.content);
-	state.anchor = null;
-	state.content = null;
+	state.anchor = void 0;
+	state.content = void 0;
 }
 function getOnBeforeToggleListener(element) {
 	return on(element, "beforetoggle", (event) => {

package/dist/js/floatable/floatable.standalone.d.mts

@@ -1,3 +1,3 @@
 import { c as OuiFloatable, t as CreateOuiFloatableOptions, u as OuiFloatablePosition } from "../floatable.model-DXsQgoU7.mjs";
-import { n as createFloatable } from "../floatable.embedded-MeTyXjFn.mjs";
+import { n as createFloatable } from "../floatable.embedded-ncshL3Sa.mjs";
 export { type CreateOuiFloatableOptions, type OuiFloatable, type OuiFloatablePosition, createFloatable };

package/dist/js/{floatable.embedded-MeTyXjFn.d.mts → floatable.embedded-ncshL3Sa.d.mts}

@@ -1,7 +1,7 @@
 import { c as OuiFloatable, l as OuiFloatableOptions, t as CreateOuiFloatableOptions } from "./floatable.model-DXsQgoU7.mjs";
 import { RemovableEventListener } from "@oscarpalmer/toretto/models";
 //#region src/js/floatable/floatable.embedded.d.ts
-declare function createEmbeddedFloatable(anchor: HTMLElement, content: HTMLElement, options: OuiFloatableOptions): OuiFloatable;
+declare function createEmbeddedFloatable(anchor: Element, content: Element, options: OuiFloatableOptions): OuiFloatable;
 /**
  * Create a _OuiFloatable_ for an anchor and content element
  *
@@ -10,8 +10,8 @@ declare function createEmbeddedFloatable(anchor: HTMLElement, content: HTMLEleme
  * @param options _OuiFloatable_ options
  * @returns _OuiFloatable_ instance
  */
-declare function createFloatable(anchor: HTMLElement, content: HTMLElement, options?: CreateOuiFloatableOptions): OuiFloatable;
-declare function getOnBeforeToggleListener(element: HTMLElement): RemovableEventListener;
+declare function createFloatable(anchor: Element, content: Element, options?: CreateOuiFloatableOptions): OuiFloatable;
+declare function getOnBeforeToggleListener(element: Element): RemovableEventListener;
 declare function removeFloatable(content: HTMLElement): void;
 //#endregion
 export { removeFloatable as i, createFloatable as n, getOnBeforeToggleListener as r, createEmbeddedFloatable as t };

package/dist/js/focus-trap/focus-trap.embedded.d.mts

@@ -1,2 +1,2 @@
-import { n as removeFocusTrap, t as createFocusTrap } from "../focus-trap.embedded-DIU05m1z.mjs";
+import { n as removeFocusTrap, t as createFocusTrap } from "../focus-trap.embedded-DpcPkP7c.mjs";
 export { createFocusTrap, removeFocusTrap };

package/dist/js/focus-trap/focus-trap.embedded.mjs

@@ -103,12 +103,12 @@ function getState(element, options) {
 }
 function onEscape(event) {
 	let element = findAncestor(event, FOCUSTRAP_SELECTOR);
-	let instance = focusTraps.get(element);
+	let instance = element == null ? void 0 : focusTraps.get(element);
 	let state = instance?.[FOCUSTRAP_SYMBOL];
 	if (element == null || instance == null || state == null) return;
 	while (state.disabled) {
-		element = findAncestor(state.element.parentElement, FOCUSTRAP_SELECTOR);
-		instance = focusTraps.get(element);
+		element = state.element.parentElement == null ? void 0 : findAncestor(state.element.parentElement, FOCUSTRAP_SELECTOR);
+		instance = element == null ? void 0 : focusTraps.get(element);
 		state = instance?.[FOCUSTRAP_SYMBOL];
 		if (element == null || instance == null || state == null) return;
 		if (!state.disabled) break;
@@ -116,7 +116,8 @@ function onEscape(event) {
 	instance?.disable();
 }
 function onFocusIn(event) {
-	lastTarget = focusTraps.get(findAncestor(event, FOCUSTRAP_SELECTOR)) == null ? void 0 : event.target;
+	const target = findAncestor(event, FOCUSTRAP_SELECTOR);
+	lastTarget = (target == null ? void 0 : focusTraps.get(target)) != null && event.target instanceof HTMLElement ? event.target : void 0;
 }
 function onKeydown(event) {
 	switch (event.key) {
@@ -130,12 +131,12 @@ function onKeydown(event) {
 	}
 }
 function onPointerdown(event) {
-	const last = findAncestor(lastTarget, FOCUSTRAP_SELECTOR);
+	const last = lastTarget == null ? void 0 : findAncestor(lastTarget, FOCUSTRAP_SELECTOR);
 	const next = findAncestor(event, FOCUSTRAP_SELECTOR);
 	if (last != null && next !== last) {
 		if (focusTraps.get(last)?.[FOCUSTRAP_SYMBOL]?.options.contain ?? false) {
 			event.preventDefault();
-			lastTarget?.focus();
+			lastTarget?.focus?.();
 		}
 	}
 	if (disabledFocusTraps.size === 0) return;
@@ -146,8 +147,8 @@ function onPointerdown(event) {
 }
 function onTab(event) {
 	const element = findAncestor(event, FOCUSTRAP_SELECTOR);
-	const instance = focusTraps.get(element);
-	if (instance == null || dispatch(element, "oui:focus-trap").defaultPrevented) return;
+	const instance = element == null ? void 0 : focusTraps.get(element);
+	if (!(element instanceof HTMLElement) || instance == null || dispatch(element, "oui:focus-trap").defaultPrevented) return;
 	if (!instance.disabled) event.preventDefault();
 	const elements = getFocusable(element);
 	const index = elements.indexOf(event.target);
@@ -201,7 +202,7 @@ function tabToTrap(instance, elements, element, index) {
 		instance.enable();
 	} else {
 		const next = elements.length === 0 ? element : elements.at(index ?? 0);
-		next.focus();
+		next?.focus?.();
 		lastTarget = next;
 	}
 }

package/dist/js/focus-trap/focus-trap.model.d.mts

@@ -1,2 +1,2 @@
-import { a as FOCUSTRAP_MESSAGE, c as OuiFocusTrap, d as disabledFocusTraps, f as focusTraps, i as FOCUSTRAP_EVENT_OPTIONS, l as OuiFocusTrapOptions, n as FOCUSTRAP_ATTRIBUTE_CONTAIN, o as FOCUSTRAP_SELECTOR, r as FOCUSTRAP_ATTRIBUTE_NOESCAPE, s as FOCUSTRAP_SYMBOL, t as FOCUSTRAP_ATTRIBUTE, u as OuiFocusTrapState } from "../focus-trap.model-BeX6UYlw.mjs";
+import { a as FOCUSTRAP_MESSAGE, c as OuiFocusTrap, d as disabledFocusTraps, f as focusTraps, i as FOCUSTRAP_EVENT_OPTIONS, l as OuiFocusTrapOptions, n as FOCUSTRAP_ATTRIBUTE_CONTAIN, o as FOCUSTRAP_SELECTOR, r as FOCUSTRAP_ATTRIBUTE_NOESCAPE, s as FOCUSTRAP_SYMBOL, t as FOCUSTRAP_ATTRIBUTE, u as OuiFocusTrapState } from "../focus-trap.model-CpltX5B5.mjs";
 export { FOCUSTRAP_ATTRIBUTE, FOCUSTRAP_ATTRIBUTE_CONTAIN, FOCUSTRAP_ATTRIBUTE_NOESCAPE, FOCUSTRAP_EVENT_OPTIONS, FOCUSTRAP_MESSAGE, FOCUSTRAP_SELECTOR, FOCUSTRAP_SYMBOL, OuiFocusTrap, OuiFocusTrapOptions, OuiFocusTrapState, disabledFocusTraps, focusTraps };

package/dist/js/focus-trap/focus-trap.standalone.d.mts

@@ -1,3 +1,3 @@
-import { c as OuiFocusTrap, l as OuiFocusTrapOptions } from "../focus-trap.model-BeX6UYlw.mjs";
-import { t as createFocusTrap } from "../focus-trap.embedded-DIU05m1z.mjs";
+import { c as OuiFocusTrap, l as OuiFocusTrapOptions } from "../focus-trap.model-CpltX5B5.mjs";
+import { t as createFocusTrap } from "../focus-trap.embedded-DpcPkP7c.mjs";
 export { type OuiFocusTrap, type OuiFocusTrapOptions, createFocusTrap };

package/dist/js/{focus-trap.embedded-DIU05m1z.d.mts → focus-trap.embedded-DpcPkP7c.d.mts}

@@ -1,4 +1,4 @@
-import { c as OuiFocusTrap, l as OuiFocusTrapOptions } from "./focus-trap.model-BeX6UYlw.mjs";
+import { c as OuiFocusTrap, l as OuiFocusTrapOptions } from "./focus-trap.model-CpltX5B5.mjs";
 //#region src/js/focus-trap/focus-trap.embedded.d.ts
 /**
  * Creates _(or retrieves)_ a _focus trap_ for an element
@@ -7,7 +7,7 @@ import { c as OuiFocusTrap, l as OuiFocusTrapOptions } from "./focus-trap.model-
  * @param options _Focus trap_ options
  * @returns _Focus trap_ instance
  */
-declare function createFocusTrap(element: HTMLElement, options?: OuiFocusTrapOptions): OuiFocusTrap;
-declare function removeFocusTrap(element: HTMLElement): void;
+declare function createFocusTrap(element: Element, options?: OuiFocusTrapOptions): OuiFocusTrap;
+declare function removeFocusTrap(element: Element): void;
 //#endregion
 export { removeFocusTrap as n, createFocusTrap as t };

package/dist/js/{focus-trap.model-BeX6UYlw.d.mts → focus-trap.model-CpltX5B5.d.mts}

@@ -69,6 +69,6 @@ declare const FOCUSTRAP_MESSAGE = "Element must be an HTMLElement or SVGElement"
 declare const FOCUSTRAP_SELECTOR: string;
 declare const FOCUSTRAP_SYMBOL: unique symbol;
 declare const disabledFocusTraps: Set<OuiFocusTrap>;
-declare const focusTraps: WeakMap<HTMLElement, OuiFocusTrap>;
+declare const focusTraps: WeakMap<Element, OuiFocusTrap>;
 //#endregion
 export { FOCUSTRAP_MESSAGE as a, OuiFocusTrap as c, disabledFocusTraps as d, focusTraps as f, FOCUSTRAP_EVENT_OPTIONS as i, OuiFocusTrapOptions as l, FOCUSTRAP_ATTRIBUTE_CONTAIN as n, FOCUSTRAP_SELECTOR as o, FOCUSTRAP_ATTRIBUTE_NOESCAPE as r, FOCUSTRAP_SYMBOL as s, FOCUSTRAP_ATTRIBUTE as t, OuiFocusTrapState as u };

package/dist/js/index.d.mts

@@ -1,30 +1,30 @@
 import { c as OuiFloatable, t as CreateOuiFloatableOptions, u as OuiFloatablePosition } from "./floatable.model-DXsQgoU7.mjs";
-import { M as OuiColorPickerEvent } from "./color-picker.constants-D1mxw_Le.mjs";
-import { a as setColorPickerLocalizations } from "./color-picker.misc-CtsXGrOe.mjs";
+import { N as OuiColorPickerEvent } from "./color-picker.constants-BZgXQr5o.mjs";
+import { a as setColorPickerLocalizations } from "./color-picker.misc-BIS3R6jk.mjs";
 import { OuiColorPickerElement } from "./color-picker/index.mjs";
-import { i as setComboboxLocalizations } from "./combobox.misc-C1tPZZDi.mjs";
+import { i as setComboboxLocalizations } from "./combobox.misc-DRDFk6X8.mjs";
 import { OuiComboboxElement } from "./combobox/index.mjs";
-import { $ as OuiSortable, p as CreateOuiDraggableOptions, u as OuiMovable } from "./movable.model-BHaK_mKw.mjs";
-import { n as OuiResizable, t as CreateOuiResizableOptions } from "./resizable.model-BwzJcTVJ.mjs";
-import { c as OuiDialog } from "./dialog.model-DX2mndMh.mjs";
+import { $ as OuiSortable, p as CreateOuiDraggableOptions, u as OuiMovable } from "./movable.model-D9nnPWKk.mjs";
+import { n as OuiResizable, t as CreateOuiResizableOptions } from "./resizable.model-YEtcC9li.mjs";
+import { c as OuiDialog } from "./dialog.model-HVzYWoDo.mjs";
 import { getDialog } from "./dialog/index.mjs";
-import { n as createFloatable } from "./floatable.embedded-MeTyXjFn.mjs";
+import { n as createFloatable } from "./floatable.embedded-ncshL3Sa.mjs";
 import "./floatable/floatable.standalone.mjs";
-import { c as OuiFocusTrap, l as OuiFocusTrapOptions } from "./focus-trap.model-BeX6UYlw.mjs";
-import { t as createFocusTrap } from "./focus-trap.embedded-DIU05m1z.mjs";
-import { t as createMovable } from "./movable.embedded-DoyXLegc.mjs";
+import { c as OuiFocusTrap, l as OuiFocusTrapOptions } from "./focus-trap.model-CpltX5B5.mjs";
+import { t as createFocusTrap } from "./focus-trap.embedded-DpcPkP7c.mjs";
+import { t as createMovable } from "./movable.embedded-C1bDTLGs.mjs";
 import "./movable/movable.standalone.mjs";
-import { t as createResizable } from "./resizable.embedded-Bf1qBUdt.mjs";
+import { t as createResizable } from "./resizable.embedded-BemH-7Re.mjs";
 import "./resizable/resizable.standalone.mjs";
-import { t as createSortable } from "./sortable.embedded-DzBKAwSG.mjs";
+import { t as createSortable } from "./sortable.embedded-CrEGff9k.mjs";
 import "./sortable/sortable.standalone.mjs";
-import { n as setListboxLocalizations } from "./misc.listbox-CtoGvXQo.mjs";
+import { n as setListboxLocalizations } from "./listbox.misc-DwfB4Mu_.mjs";
 import { OuiListboxElement } from "./listbox/index.mjs";
-import { t as OuiPopover } from "./popover.model-ubKNG612.mjs";
+import { t as OuiPopover } from "./popover.model-DiLdz0Hc.mjs";
 import { getPopover } from "./popover/index.mjs";
 import { OuiSplitterElement } from "./splitter/index.mjs";
-import { r as OuiTabsEvent } from "./tabs.model-DRBX_JtI.mjs";
+import { r as OuiTabsEvent } from "./tabs.model-BHPy7fPo.mjs";
 import { OuiTabsElement } from "./tabs/index.mjs";
-import { t as OuiTooltip } from "./tooltip.model-DRkY_BsL.mjs";
+import { t as OuiTooltip } from "./tooltip.model-BpNStw5z.mjs";
 import { getTooltip, setTooltipDelay } from "./tooltip/index.mjs";
 export { type CreateOuiFloatableOptions, type CreateOuiDraggableOptions as CreateOuiMovableOptions, type CreateOuiDraggableOptions as CreateOuiSortableOptions, type CreateOuiResizableOptions, OuiColorPickerElement, OuiColorPickerEvent, OuiComboboxElement, type OuiDialog, type OuiFloatable, type OuiFloatablePosition, type OuiFocusTrap, type OuiFocusTrapOptions, OuiListboxElement, type OuiMovable, type OuiPopover, type OuiResizable, type OuiSortable, OuiSplitterElement, OuiTabsElement, OuiTabsEvent, type OuiTooltip, createFloatable, createFocusTrap, createMovable, createResizable as createOuiResizable, createSortable, getDialog, getPopover, getTooltip, setColorPickerLocalizations, setComboboxLocalizations, setListboxLocalizations, setTooltipDelay };

package/dist/js/index.mjs

@@ -11,12 +11,12 @@ import "./resizable/resizable.standalone.mjs";
 import { createSortable } from "./sortable/sortable.embedded.mjs";
 import "./sortable/sortable.standalone.mjs";
 import { OuiColorPickerEvent } from "./color-picker/color-picker.model.mjs";
-import { d as setColorPickerLocalizations } from "./color-picker.event-Cksj5TvS.mjs";
+import { setColorPickerLocalizations } from "./color-picker/color-picker.misc.mjs";
 import { OuiColorPickerElement } from "./color-picker/index.mjs";
-import { D as setComboboxLocalizations } from "./combobox.state-BfJ3Hxg8.mjs";
+import { D as setComboboxLocalizations } from "./combobox.state-AstCICiH.mjs";
 import { OuiComboboxElement } from "./combobox/index.mjs";
 import { getDialog } from "./dialog/index.mjs";
-import { n as setListboxLocalizations } from "./misc.listbox-CjfBUbHD.mjs";
+import { s as setListboxLocalizations } from "./listbox.state-BrN296BM.mjs";
 import { OuiListboxElement } from "./listbox/index.mjs";
 import { getPopover } from "./popover/index.mjs";
 import { OuiSplitterElement } from "./splitter/index.mjs";

package/dist/js/internal/attributable.d.mts

@@ -1,3 +1,3 @@
 //#region src/js/internal/attributable.d.ts
-export declare function attributable(attribute: string, add: (element: HTMLElement) => void, remove: (element: HTMLElement) => void): void;
+export declare function attributable(attribute: string, add: (element: Element) => void, remove: (element: Element) => void): void;
 //#endregion

package/dist/js/internal/draggable/draggable.model.d.mts

@@ -1,2 +1,2 @@
-import { A as OuiDraggableGlobals, B as OuiDraggableOptionsDrag, C as OuiDragCancel, D as OuiDraggable, E as OuiDragMovePosition, F as OuiDraggableOptionsContainer, G as OuiDraggableStates, H as OuiDraggableOptionsPositionGetOffset, I as OuiDraggableOptionsContainerOnDestroy, J as draggableHorizontals, K as draggableContainers, L as OuiDraggableOptionsContainerOnInitialize, M as OuiDraggableInstances, N as OuiDraggableItem, O as OuiDraggableBound, P as OuiDraggableOptions, Q as draggableVerticals, R as OuiDraggableOptionsDirection, S as OuiDragBegin, T as OuiDragMove, U as OuiDraggableOptionsPositionGetOriginal, V as OuiDraggableOptionsPosition, W as OuiDraggableState, X as draggableStyleToggler, Y as draggableProperties, Z as draggableStyles, _ as DRAGGABLE_SELECTOR, b as DRAGGABLE_SELECTOR_SORTABLE_ITEM, g as DRAGGABLE_KEY_ESCAPE, h as DRAGGABLE_ATTRIBUTE_SORTABLE, j as OuiDraggableGlobalsElement, k as OuiDraggableDirection, m as DRAGGABLE_ATTRIBUTE_MOVABLE, p as CreateOuiDraggableOptions, q as draggableGlobals, v as DRAGGABLE_SELECTOR_MOVABLE_HANDLE, w as OuiDragEnd, x as DRAGGABLE_SYMBOL, y as DRAGGABLE_SELECTOR_SORTABLE_HANDLE, z as OuiDraggableOptionsDirectionOnAfter } from "../../movable.model-BHaK_mKw.mjs";
+import { A as OuiDraggableGlobals, B as OuiDraggableOptionsDrag, C as OuiDragCancel, D as OuiDraggable, E as OuiDragMovePosition, F as OuiDraggableOptionsContainer, G as OuiDraggableStates, H as OuiDraggableOptionsPositionGetOffset, I as OuiDraggableOptionsContainerOnDestroy, J as draggableHorizontals, K as draggableContainers, L as OuiDraggableOptionsContainerOnInitialize, M as OuiDraggableInstances, N as OuiDraggableItem, O as OuiDraggableBound, P as OuiDraggableOptions, Q as draggableVerticals, R as OuiDraggableOptionsDirection, S as OuiDragBegin, T as OuiDragMove, U as OuiDraggableOptionsPositionGetOriginal, V as OuiDraggableOptionsPosition, W as OuiDraggableState, X as draggableStyleToggler, Y as draggableProperties, Z as draggableStyles, _ as DRAGGABLE_SELECTOR, b as DRAGGABLE_SELECTOR_SORTABLE_ITEM, g as DRAGGABLE_KEY_ESCAPE, h as DRAGGABLE_ATTRIBUTE_SORTABLE, j as OuiDraggableGlobalsElement, k as OuiDraggableDirection, m as DRAGGABLE_ATTRIBUTE_MOVABLE, p as CreateOuiDraggableOptions, q as draggableGlobals, v as DRAGGABLE_SELECTOR_MOVABLE_HANDLE, w as OuiDragEnd, x as DRAGGABLE_SYMBOL, y as DRAGGABLE_SELECTOR_SORTABLE_HANDLE, z as OuiDraggableOptionsDirectionOnAfter } from "../../movable.model-D9nnPWKk.mjs";
 export { CreateOuiDraggableOptions, DRAGGABLE_ATTRIBUTE_MOVABLE, DRAGGABLE_ATTRIBUTE_SORTABLE, DRAGGABLE_KEY_ESCAPE, DRAGGABLE_SELECTOR, DRAGGABLE_SELECTOR_MOVABLE_HANDLE, DRAGGABLE_SELECTOR_SORTABLE_HANDLE, DRAGGABLE_SELECTOR_SORTABLE_ITEM, DRAGGABLE_SYMBOL, OuiDragBegin, OuiDragCancel, OuiDragEnd, OuiDragMove, OuiDragMovePosition, OuiDraggable, OuiDraggableBound, OuiDraggableDirection, OuiDraggableGlobals, OuiDraggableGlobalsElement, OuiDraggableInstances, OuiDraggableItem, OuiDraggableOptions, OuiDraggableOptionsContainer, OuiDraggableOptionsContainerOnDestroy, OuiDraggableOptionsContainerOnInitialize, OuiDraggableOptionsDirection, OuiDraggableOptionsDirectionOnAfter, OuiDraggableOptionsDrag, OuiDraggableOptionsPosition, OuiDraggableOptionsPositionGetOffset, OuiDraggableOptionsPositionGetOriginal, OuiDraggableState, OuiDraggableStates, draggableContainers, draggableGlobals, draggableHorizontals, draggableProperties, draggableStyleToggler, draggableStyles, draggableVerticals };

package/dist/js/internal/draggable/index.d.mts

@@ -1,13 +1,13 @@
-import { D as OuiDraggable, G as OuiDraggableStates, M as OuiDraggableInstances, O as OuiDraggableBound, P as OuiDraggableOptions, W as OuiDraggableState, p as CreateOuiDraggableOptions } from "../../movable.model-BHaK_mKw.mjs";
+import { D as OuiDraggable, G as OuiDraggableStates, M as OuiDraggableInstances, O as OuiDraggableBound, P as OuiDraggableOptions, W as OuiDraggableState, p as CreateOuiDraggableOptions } from "../../movable.model-D9nnPWKk.mjs";
 import { PlainObject } from "@oscarpalmer/atoms/models";
 //#region src/js/internal/draggable/index.d.ts
-export declare function addDraggable<Property extends keyof OuiDraggableInstances, Instance extends OuiDraggableInstances[Property]>(this: OuiDraggableBound<Property, Instance>, element: HTMLElement, options?: CreateOuiDraggableOptions): Instance;
-export declare function destroyDraggable(draggable: OuiDraggable): void;
-export declare function getDraggableStates(element: HTMLElement): OuiDraggableStates | undefined;
-export declare function getDraggableElement(this: OuiDraggable): HTMLElement;
-export declare function initializeDraggable<ExtraState extends PlainObject = PlainObject>(draggable: OuiDraggable, name: keyof OuiDraggableStates, event: string, attribute: string, element: HTMLElement, options: OuiDraggableOptions<ExtraState>, extras: ExtraState): OuiDraggableState & ExtraState;
+export declare function addDraggable<Property extends keyof OuiDraggableInstances, Instance extends OuiDraggableInstances[Property]>(this: OuiDraggableBound<Property, Instance>, element: Element, options?: CreateOuiDraggableOptions): Instance;
+export declare function destroyDraggable<ExtraState extends PlainObject>(draggable: OuiDraggable<ExtraState>): void;
+export declare function getDraggableStates(element: Element): OuiDraggableStates | undefined;
+export declare function getDraggableElement<ExtraState extends PlainObject>(this: OuiDraggable<ExtraState>): Element;
+export declare function initializeDraggable<ExtraState extends PlainObject>(draggable: OuiDraggable<ExtraState>, name: keyof OuiDraggableStates, event: string, attribute: string, element: Element, options: OuiDraggableOptions<ExtraState>, extras: ExtraState): OuiDraggableState<ExtraState>;
 export declare function removeDraggable<Property extends keyof OuiDraggableInstances, Instance extends OuiDraggableInstances[Property]>(this: {
-  constructor: new (element: HTMLElement) => Instance;
+  constructor: new (element: Element) => Instance;
   property: Property;
-}, element: HTMLElement): void;
+}, element: Element): void;
 //#endregion

package/dist/js/internal/draggable/index.mjs

@@ -19,7 +19,7 @@ function addDraggable(element, options) {
 }
 function cancelDrag(item) {
 	if (item == null) return;
-	item.state.options.drag.onCancel?.(draggableGlobals, item);
+	item.state.options.drag.onCancel?.(item);
 	dispatch(item.state.element, `oui:${item.state.name}:cancel`, { detail: { element: item.state.options.getOrigin() } });
 	reset();
 }
@@ -74,10 +74,10 @@ function initializeDraggable(draggable, name, event, attribute, element, options
 		event,
 		name,
 		options,
-		horizontal: true,
-		vertical: true,
 		destroyed: false,
-		styling: toggleStyles(element, draggableStyles)
+		horizontal: true,
+		styling: toggleStyles(element, draggableStyles),
+		vertical: true
 	};
 	const item = {
 		state,
@@ -98,6 +98,7 @@ function onKeydown(event) {
 function onPointerdown(event) {
 	if (event.altKey || event.ctrlKey || event.metaKey || event.shiftKey || (supportsTouch.value ? event.type === "mousedown" : event.type === "touchstart" || event.button !== 0)) return;
 	const container = findAncestor(event, DRAGGABLE_SELECTOR);
+	if (container == null) return;
 	const instances = draggableGlobals.instances.get(container);
 	const states = draggableGlobals.states.get(container);
 	if (instances == null || states == null) return;
@@ -129,13 +130,13 @@ function onPointerdown(event) {
 		rectangle,
 		node: dragged
 	};
-	draggableGlobals.offset = item.state.options.position.getOffset(draggableGlobals, item, element, position);
-	draggableGlobals.original = item.state.options.position.getOriginal(draggableGlobals, item, position);
+	draggableGlobals.offset = item.state.options.position.getOffset(item, element, position);
+	draggableGlobals.original = item.state.options.position.getOriginal(item, position);
 	if (dispatch(item.state.element, `oui:${item.state.name}:begin`, { detail: {
 		element,
 		position: { ...draggableGlobals.original }
 	} }).defaultPrevented) {
-		item.state.options.drag.onCancel?.(draggableGlobals, item);
+		item.state.options.drag.onCancel?.(item);
 		reset();
 		return;
 	}
@@ -145,7 +146,7 @@ function onPointerdown(event) {
 		inset: `${next.y}px auto auto ${next.x}px`,
 		transform: "translate3d(0, 0, 0)"
 	});
-	item.state.options.drag.onBegin?.(event, draggableGlobals, item, element, handle, next);
+	item.state.options.drag.onBegin?.(event, item, element, handle, next);
 	item.state.styling.set();
 	draggableStyleToggler.set();
 }
@@ -155,26 +156,34 @@ function onPointermove(event) {
 	if (position == null) return;
 	const next = getNextPosition(current, position);
 	if (draggableGlobals.element != null) setStyle(draggableGlobals.element.node, "inset", `${next.y}px auto auto ${next.x}px`);
-	const detail = current.state.options.drag.onMove(event, draggableGlobals, current, {
+	const detail = current.state.options.drag.onMove(event, current, {
 		calculated: next,
 		original: position
 	});
 	if (dispatch(current.state.element, `oui:${current.state.name}:move`, { detail }).defaultPrevented) cancelDrag(current);
 }
 function onPointerup(event) {
-	current?.state.options.drag.onEnd?.(event, draggableGlobals, current, reset);
+	current?.state.options.drag.onEnd?.(event, current, reset);
 }
 function removeDraggable(element) {
 	const { property } = this;
 	removeInstance(draggableGlobals.instances, property, element);
-	removeInstance(draggableGlobals.states, property, element);
-}
-function removeInstance(map, name, element) {
-	const instances = map.get(element);
-	if (instances == null || instances[name] == null) return;
-	if (typeof instances[name].destroy === "function") instances[name].destroy();
-	instances[name] = void 0;
-	if (instances[draggableProperties[name]] == null) map.delete(element);
+	removeState(draggableGlobals.states, property, element);
+}
+function removeInstance(instances, name, element) {
+	removeStored(instances, name, element);
+}
+function removeState(map, name, element) {
+	removeStored(map, name, element);
+}
+function removeStored(map, name, element) {
+	const stored = map.get(element);
+	const item = stored?.[name];
+	if (stored == null || item == null) return;
+	const itemAsPlainObject = item;
+	if (typeof itemAsPlainObject.destroy === "function") itemAsPlainObject.destroy();
+	stored[name] = void 0;
+	if (stored[draggableProperties[name]] == null) map.delete(element);
 }
 function reset() {
 	current?.state.styling.remove();

package/dist/js/internal/l10n/index.d.mts

@@ -0,0 +1,5 @@
+import { _ as OuiLocalizationsValues, p as OuiLocalizations, u as OuiDefaultLocalizations } from "../../l10n.model-D1E1u35L.mjs";
+//#region src/js/internal/l10n/index.d.ts
+export declare function createDefaultLocalizations<Localizations extends OuiLocalizationsValues>(values: Localizations): OuiDefaultLocalizations<Localizations>;
+export declare function createLocalizations<Localizations extends OuiLocalizationsValues>(defaults: OuiDefaultLocalizations<Localizations>): OuiLocalizations<Localizations>;
+//#endregion