@oscarpalmer/oui 0.22.0 → 0.22.1

package/dist/js/index.mjs

@@ -1,2537 +1,7 @@
-//#region src/js/internal/attributable.ts
-function attributable(attribute, add, remove) {
-	new MutationObserver((entries) => {
-		const { length } = entries;
-		for (let index = 0; index < length; index += 1) {
-			const entry = entries[index];
-			if (entry.type === "attributes" && entry.target instanceof HTMLElement) if (entry.target.hasAttribute(attribute)) handleAdded(attribute, [entry.target], add);
-			else handleRemoved([entry.target], remove);
-			else if (entry.type === "childList") {
-				handleAdded(attribute, entry.addedNodes, add);
-				handleRemoved(entry.removedNodes, remove);
-			}
-		}
-	}).observe(document, {
-		attributeFilter: [attribute],
-		attributes: true,
-		childList: true,
-		subtree: true
-	});
-	requestAnimationFrame(() => {
-		handleAdded(attribute, document.querySelectorAll(`[${attribute}]`), add);
-	});
-}
-function handleAdded(attribute, nodes, add) {
-	const elements = [...nodes].filter((node) => node instanceof HTMLElement);
-	const { length } = elements;
-	for (let index = 0; index < length; index += 1) {
-		const element = elements[index];
-		if (element.hasAttribute(attribute)) add(element);
-		if (element.hasChildNodes()) handleAdded(attribute, element.childNodes, add);
-	}
-}
-function handleRemoved(nodes, remove) {
-	const elements = [...nodes].filter((node) => node instanceof HTMLElement);
-	const { length } = elements;
-	for (let index = 0; index < length; index += 1) {
-		const element = elements[index];
-		remove(element);
-		if (element.hasChildNodes()) handleRemoved(element.childNodes, remove);
-	}
-}
-//#endregion
-//#region node_modules/@oscarpalmer/atoms/dist/internal/is.mjs
-/**
-* Is the value a number?
-*
-* @param value Value to check
-* @returns `true` if the value is a `number`, otherwise `false`
-*/
-function isNumber(value) {
-	return typeof value === "number" && !Number.isNaN(value);
-}
-/**
-* Is the value a plain object?
-*
-* @param value Value to check
-* @returns `true` if the value is a plain object, otherwise `false`
-*/
-function isPlainObject(value) {
-	if (value === null || typeof value !== "object") return false;
-	if (Symbol.toStringTag in value || Symbol.iterator in value) return false;
-	const prototype = Object.getPrototypeOf(value);
-	return prototype === null || prototype === Object.prototype || Object.getPrototypeOf(prototype) === null;
-}
-//#endregion
-//#region node_modules/@oscarpalmer/atoms/dist/internal/number.mjs
-/**
-* Clamp a number between a minimum and maximum value
-*
-* @param value Value to clamp
-* @param minimum Minimum value
-* @param maximum Maximum value
-* @param loop If `true`, the value will loop around when smaller than the minimum or larger than the maximum _(defaults to `false`)_
-* @returns Clamped value
-*
-* @example
-* ```typescript
-* clamp(10, 0, 5);       // => 5
-* clamp(10, 0, 5, true); // => 0
-* ```
-*/
-function clamp(value, minimum, maximum, loop) {
-	if (![
-		value,
-		minimum,
-		maximum
-	].every(isNumber)) return NaN;
-	if (value < minimum) return loop === true ? maximum : minimum;
-	return value > maximum ? loop === true ? minimum : maximum : value;
-}
-//#endregion
-//#region node_modules/@oscarpalmer/toretto/dist/internal/is.mjs
-/**
-* Is the value an event position?
-*
-* @param value Value to check
-* @returns `true` if it's an event position, otherwise `false`
-*/
-function isEventPosition(value) {
-	return typeof value === "object" && value != null && typeof value.x === "number" && typeof value.y === "number";
-}
-/**
-* Is the value an event target?
-*
-* @param value Value to check
-* @returns `true` if it's an event target, otherwise `false`
-*/
-function isEventTarget(value) {
-	return typeof value === "object" && value != null && typeof value.addEventListener === "function" && typeof value.removeEventListener === "function" && typeof value.dispatchEvent === "function";
-}
-/**
-* Is the value an HTML or SVG element?
-*
-* @param value Value to check
-* @returns `true` if it's an HTML or SVG element, otherwise `false`
-*/
-function isHTMLOrSVGElement(value) {
-	return value instanceof HTMLElement || value instanceof SVGElement;
-}
-/**
-* Is the value an input element? _(`<input>`, `<select>`, or `<textarea>`)_
-*
-* @param value Value to check
-* @returns `true` if it's an input element, otherwise `false`
-*/
-function isInputElement(value) {
-	return value instanceof HTMLInputElement || value instanceof HTMLSelectElement || value instanceof HTMLTextAreaElement;
-}
-//#endregion
-//#region node_modules/@oscarpalmer/atoms/dist/internal/string.mjs
-/**
-* Get the string value from any value
-*
-* @param value Original value
-* @returns String representation of the value
-*
-* @example
-* ```typescript
-* getString(null)       // => ''
-* getString('foo')      // => 'foo'
-* getString(123)        // => '123'
-* getString(true)       // => 'true'
-* getString([1, 2, 3])  // => '1,2,3'
-* getString({a: 1})     // => '{"a":1}'
-* getString(() => 123)  // => '123'
-* ```
-*/
-function getString(value) {
-	if (typeof value === "string") return value;
-	if (value == null) return "";
-	if (typeof value === "function") return getString(value());
-	if (typeof value !== "object") return String(value);
-	const asString = String(value.valueOf?.() ?? value);
-	return asString.startsWith("[object ") ? JSON.stringify(value) : asString;
-}
-/**
-* Join an array of values into a string _(while ignoring empty values)_
-*
-* _(`null`, `undefined`, and any values that become whitespace-only strings are considered empty)_
-*
-* @param array Array of values
-* @param delimiter Delimiter to use between values
-* @returns Joined string
-*/
-function join(array, delimiter) {
-	if (!Array.isArray(array)) return "";
-	const { length } = array;
-	if (length === 0) return "";
-	const values = [];
-	for (let index = 0; index < length; index += 1) {
-		const item = getString(array[index]);
-		if (item.length > 0) values.push(item);
-	}
-	return values.join(typeof delimiter === "string" ? delimiter : "");
-}
-/**
-* Split a string into words _(and other readable parts)_
-*
-* @param value Original string
-* @returns Array of words found in the string
-*/
-function words(value) {
-	return typeof value === "string" ? value.match(EXPRESSION_WORDS) ?? [] : [];
-}
-const EXPRESSION_WORDS = /[^\x00-\x2f\x3a-\x40\x5b-\x60\x7b-\x7f]+/g;
-//#endregion
-//#region node_modules/@oscarpalmer/atoms/dist/internal/sized.mjs
-function getSizedMaximum(first, second) {
-	let actual;
-	if (typeof first === "number") actual = first;
-	else actual = typeof second === "number" ? second : MAXIMUM_DEFAULT;
-	return clamp(actual, 1, MAXIMUM_ABSOLUTE);
-}
-const MAXIMUM_ABSOLUTE = 16777216;
-const MAXIMUM_DEFAULT = 1048576;
-//#endregion
-//#region node_modules/@oscarpalmer/atoms/dist/sized/map.mjs
-/**
-* A _Map_ with a maximum size
-*
-* Behavior is similar to a _LRU_ cache, where the least recently used entries are removed
-*/
-var SizedMap = class extends Map {
-	/**
-	* The maximum size of the _Map_
-	*/
-	#maximumSize;
-	/**
-	* Is the _Map_ full?
-	*/
-	get full() {
-		return super.size >= this.#maximumSize;
-	}
-	get maximum() {
-		return this.#maximumSize;
-	}
-	constructor(first, second) {
-		const maximum = getSizedMaximum(first, second);
-		super();
-		this.#maximumSize = maximum;
-		if (Array.isArray(first)) {
-			const { length } = first;
-			if (length <= maximum) for (let index = 0; index < length; index += 1) this.set(...first[index]);
-			else for (let index = 0; index < maximum; index += 1) this.set(...first[length - maximum + index]);
-		}
-	}
-	/**
-	* @inheritdoc
-	*/
-	get(key) {
-		if (super.has(key)) {
-			const value = super.get(key);
-			this.#setValue(key, value, true);
-			return value;
-		}
-	}
-	/**
-	* @inheritdoc
-	*/
-	set(key, value) {
-		return this.#setValue(key, value, super.has(key));
-	}
-	#setValue(key, value, has) {
-		if (has) super.delete(key);
-		else if (super.size >= this.#maximumSize) super.delete(super.keys().next().value);
-		super.set(key, value);
-		return this;
-	}
-};
-//#endregion
-//#region node_modules/@oscarpalmer/atoms/dist/function/memoize.mjs
-/**
-* A _Memoized_ function instance, caching and retrieving results based on the its parameters _(or a custom cache key)_
-*/
-var Memoized = class {
-	#state;
-	/**
-	* Maximum cache size
-	*
-	* @returns Maximum cache size _(or `Number.NaN` if the instance has been destroyed)_
-	*/
-	get maximum() {
-		return this.#state.cache?.maximum ?? NaN;
-	}
-	/**
-	* Current cache size
-	*
-	* @returns Current cache size _(or `Number.NaN` if the instance has been destroyed)_
-	*/
-	get size() {
-		return this.#state.cache?.size ?? NaN;
-	}
-	constructor(callback, options) {
-		const cache = new SizedMap(options.cacheSize);
-		const getter = (...parameters) => {
-			const key = options.cacheKey?.(...parameters) ?? (parameters.length === 1 ? parameters[0] : join(parameters.map(getString), SEPARATOR));
-			if (cache.has(key)) return cache.get(key);
-			const value = callback(...parameters);
-			cache.set(key, value);
-			return value;
-		};
-		this.#state = {
-			cache,
-			getter
-		};
-	}
-	/**
-	* Clear the cache
-	*/
-	clear() {
-		this.#state.cache?.clear();
-	}
-	/**
-	* Delete a result from the cache
-	*
-	* @param key Key to delete
-	* @returns `true` if the key existed and was removed, otherwise `false`
-	*/
-	delete(key) {
-		return this.#state.cache?.delete(key) ?? false;
-	}
-	/**
-	* Destroy the instance
-	*
-	* _(When a Memoized instance is destroyed, its cache and callback are removed, and calls to `run` will throw an error)_
-	*/
-	destroy() {
-		this.#state.cache?.clear();
-		this.#state.cache = void 0;
-		this.#state.getter = void 0;
-	}
-	/**
-	* Get a result from the cache
-	*
-	* @param key Key to get
-	* @returns Cached result or `undefined` if it does not exist
-	*/
-	get(key) {
-		return this.#state.cache?.get(key);
-	}
-	/**
-	* Does the result exist?
-	*
-	* @param key Key to check
-	* @returns `true` if the result exists, otherwise `false`
-	*/
-	has(key) {
-		return this.#state.cache?.has(key) ?? false;
-	}
-	/**
-	* Run the callback with the provided parameters
-	*
-	* @param parameters Parameters to pass to the callback
-	* @returns Cached or computed _(then cached)_ result
-	*/
-	run(...parameters) {
-		if (this.#state.cache == null || this.#state.getter == null) throw new Error(MEMOIZED_ERROR_DESTROYED);
-		return this.#state.getter(...parameters);
-	}
-};
-function getMemoizationOptions(input) {
-	const { cacheKey, cacheSize } = isPlainObject(input) ? input : {};
-	return {
-		cacheKey: typeof cacheKey === "function" ? cacheKey : void 0,
-		cacheSize: typeof cacheSize === "number" && cacheSize > 0 ? cacheSize : DEFAULT_CACHE_SIZE
-	};
-}
-/**
-* Memoize a function, caching and retrieving results based on the first parameter
-*
-* @param callback Callback to memoize
-* @param options Memoization options
-* @returns _Memoized_ instance
-*/
-function memoize(callback, options) {
-	if (typeof callback !== "function") throw new TypeError(MEMOIZED_ERROR_CALLBACK);
-	return new Memoized(callback, getMemoizationOptions(options));
-}
-const DEFAULT_CACHE_SIZE = 1024;
-const MEMOIZED_ERROR_CALLBACK = "Memoized requires a callback function";
-const MEMOIZED_ERROR_DESTROYED = "The Memoized instance has been destroyed";
-const SEPARATOR = "_";
-//#endregion
-//#region node_modules/@oscarpalmer/atoms/dist/string/case.mjs
-/**
-* Convert a string to camel case _(thisIsCamelCase)_
-*
-* @param value String to convert
-* @returns Camel-cased string
-*/
-function camelCase(value) {
-	return toCase(CASE_CAMEL, value, true, false);
-}
-/**
-* Capitalize the first letter of a string _(and lowercase the rest)_
-*
-* @param value String to capitalize
-* @returns Capitalized string
-*/
-function capitalize(value) {
-	if (typeof value !== "string" || value.length === 0) return "";
-	memoizedCapitalize ??= memoize((v) => v.length === 1 ? v.toLocaleUpperCase() : `${v.charAt(0).toLocaleUpperCase()}${v.slice(1).toLocaleLowerCase()}`);
-	return memoizedCapitalize.run(value);
-}
-/**
-* Convert a string to kebab case _(this-is-kebab-case)_
-*
-* @param value String to convert
-* @returns Kebab-cased string
-*/
-function kebabCase(value) {
-	return toCase(CASE_KEBAB, value, false, false);
-}
-function toCase(type, value, capitalizeAny, capitalizeFirst) {
-	caseMemoizers[type] ??= memoize(toCaseCallback.bind({
-		type,
-		capitalizeAny,
-		capitalizeFirst
-	}));
-	return caseMemoizers[type].run(value);
-}
-function toCaseCallback(value) {
-	if (typeof value !== "string") return "";
-	if (value.length < 1) return value;
-	const { capitalizeAny, capitalizeFirst, type } = this;
-	const parts = words(value);
-	const partsLength = parts.length;
-	const cased = [];
-	for (let partIndex = 0; partIndex < partsLength; partIndex += 1) {
-		const items = parts[partIndex].replace(EXPRESSION_ACRONYM, (full, one, two, three) => three === S ? full : `${one}-${two}${three}`).replace(EXPRESSION_CAMEL_CASE, REPLACEMENT_CAMEL_CASE).split("-");
-		const itemsLength = items.length;
-		const partResult = [];
-		let itemCount = 0;
-		for (let itemIndex = 0; itemIndex < itemsLength; itemIndex += 1) {
-			const item = items[itemIndex];
-			if (item.length === 0) continue;
-			if (!capitalizeAny || itemCount === 0 && partIndex === 0 && !capitalizeFirst) partResult.push(item.toLocaleLowerCase());
-			else partResult.push(capitalize(item));
-			itemCount += 1;
-		}
-		cased.push(join(partResult, delimiters[type]));
-	}
-	return join(cased, delimiters[type]);
-}
-const CASE_CAMEL = "camel";
-const CASE_KEBAB = "kebab";
-const CASE_PASCAL = "pascal";
-const CASE_SNAKE = "snake";
-const DELIMTER_EMPTY = "";
-const DELIMITER_HYPHEN = "-";
-const DELIMITER_UNDERSCORE = "_";
-const EXPRESSION_CAMEL_CASE = /(\p{Ll})(\p{Lu})/gu;
-const EXPRESSION_ACRONYM = /(\p{Lu}*)(\p{Lu})(\p{Ll}+)/gu;
-const REPLACEMENT_CAMEL_CASE = "$1-$2";
-const S = "s";
-const caseMemoizers = {};
-const delimiters = {
-	[CASE_CAMEL]: DELIMTER_EMPTY,
-	[CASE_KEBAB]: DELIMITER_HYPHEN,
-	[CASE_PASCAL]: DELIMTER_EMPTY,
-	[CASE_SNAKE]: DELIMITER_UNDERSCORE
-};
-let memoizedCapitalize;
-//#endregion
-//#region node_modules/@oscarpalmer/toretto/dist/internal/get-value.mjs
-function getBoolean(value, defaultValue) {
-	return typeof value === "boolean" ? value : defaultValue ?? false;
-}
-function getStyleValue(element, property, computed) {
-	if (property.startsWith(CSS_VARIABLE_PREFIX$1)) return element.style.getPropertyValue(property);
-	const name = camelCase(property);
-	return computed ? getComputedStyle(element)[name] : element.style[name];
-}
-const CSS_VARIABLE_PREFIX$1 = "--";
-//#endregion
-//#region node_modules/@oscarpalmer/toretto/dist/event/delegation.mjs
-function addDelegatedHandler(doc, type, name, passive) {
-	if (DELEGATED.has(name)) return;
-	DELEGATED.add(name);
-	doc.addEventListener(type, passive ? HANDLER_PASSIVE : HANDLER_ACTIVE, { passive });
-}
-function addDelegatedListener(target, type, name, listener, passive) {
-	target[name] ??= /* @__PURE__ */ new Set();
-	target[name].add(listener);
-	addDelegatedHandler(document, type, name, passive);
-	return () => {
-		removeDelegatedListener(target, name, listener);
-	};
-}
-function delegatedEventHandler(event) {
-	const key = `${EVENT_PREFIX}${event.type}${this ? EVENT_SUFFIX_PASSIVE : EVENT_SUFFIX_ACTIVE}`;
-	const items = event.composedPath();
-	const { length } = items;
-	let cancelled = false;
-	let target = items[0];
-	const originalStopPropagation = event.stopPropagation;
-	event.stopPropagation = function() {
-		cancelled = true;
-		originalStopPropagation.call(event);
-	};
-	event.stopImmediatePropagation = event.stopPropagation.bind(event);
-	Object.defineProperties(event, {
-		currentTarget: {
-			configurable: true,
-			get() {
-				return target;
-			}
-		},
-		target: {
-			configurable: true,
-			value: target
-		}
-	});
-	for (let index = 0; index < length; index += 1) {
-		const item = items[index];
-		const listeners = item[key];
-		if (item.disabled || listeners == null) continue;
-		target = item;
-		for (const listener of listeners) {
-			listener.call(item, event);
-			if (cancelled) return;
-		}
-	}
-}
-function getDelegatedName(target, type, options) {
-	if (isEventTarget(target) && EVENT_TYPES.has(type) && !options.capture && !options.once && options.signal == null) return `${EVENT_PREFIX}${type}${options.passive ? EVENT_SUFFIX_PASSIVE : EVENT_SUFFIX_ACTIVE}`;
-}
-function removeDelegatedListener(target, name, listener) {
-	const handlers = target[name];
-	if (handlers == null || !handlers.has(listener)) return false;
-	handlers.delete(listener);
-	if (handlers.size === 0) target[name] = void 0;
-	return true;
-}
-const DELEGATED = /* @__PURE__ */ new Set();
-const EVENT_PREFIX = "@";
-const EVENT_SUFFIX_ACTIVE = ":active";
-const EVENT_SUFFIX_PASSIVE = ":passive";
-const EVENT_TYPES = new Set([
-	"beforeinput",
-	"click",
-	"dblclick",
-	"contextmenu",
-	"focusin",
-	"focusout",
-	"input",
-	"keydown",
-	"keyup",
-	"mousedown",
-	"mousemove",
-	"mouseout",
-	"mouseover",
-	"mouseup",
-	"pointerdown",
-	"pointermove",
-	"pointerout",
-	"pointerover",
-	"pointerup",
-	"touchend",
-	"touchmove",
-	"touchstart"
-]);
-const HANDLER_ACTIVE = delegatedEventHandler.bind(false);
-const HANDLER_PASSIVE = delegatedEventHandler.bind(true);
-//#endregion
-//#region node_modules/@oscarpalmer/atoms/dist/is.mjs
-/**
-* Is the value `undefined`, `null`, or stringified as a whitespace-only string?
-*
-* @param value Value to check
-* @returns `true` if the value is nullable or matches a whitespace-only string, otherwise `false`
-*/
-function isNullableOrWhitespace(value) {
-	return value == null || EXPRESSION_WHITESPACE$1.test(getString(value));
-}
-const EXPRESSION_WHITESPACE$1 = /^\s*$/;
-//#endregion
-//#region node_modules/@oscarpalmer/atoms/dist/internal/function/misc.mjs
-/**
-* A function that does nothing, which can be useful, I guess…
-*/
-function noop() {}
-//#endregion
-//#region node_modules/@oscarpalmer/toretto/dist/event/index.mjs
-function createEventOptions(options) {
-	return {
-		capture: getBoolean(options?.capture),
-		once: getBoolean(options?.once),
-		passive: getBoolean(options?.passive, true),
-		signal: options?.signal instanceof AbortSignal ? options.signal : void 0
-	};
-}
-/**
-* Get the X- and Y-coordinates from a pointer event
-*
-* @param event Pointer event
-* @returns X- and Y-coordinates
-*/
-function getPosition(event) {
-	let x;
-	let y;
-	if (event instanceof MouseEvent) {
-		x = event.clientX;
-		y = event.clientY;
-	} else if (event instanceof TouchEvent) {
-		x = event.touches[0]?.clientX;
-		y = event.touches[0]?.clientY;
-	}
-	return typeof x === "number" && typeof y === "number" ? {
-		x,
-		y
-	} : void 0;
-}
-function on(target, type, listener, options) {
-	if (!isEventTarget(target) || typeof type !== "string" || typeof listener !== "function") return noop;
-	const extended = createEventOptions(options);
-	const delegated = getDelegatedName(target, type, extended);
-	if (delegated != null) return addDelegatedListener(target, type, delegated, listener, extended.passive);
-	target.addEventListener(type, listener, extended);
-	if (extended.once) return noop;
-	return () => {
-		target.removeEventListener(type, listener, extended);
-	};
-}
-//#endregion
-//#region node_modules/@oscarpalmer/toretto/dist/find/relative.mjs
-function findAncestor(origin, selector) {
-	const element = getElement(origin);
-	if (element == null || selector == null) return null;
-	if (typeof selector === "string") {
-		if (Element.prototype.matches.call(element, selector)) return element;
-		return Element.prototype.closest.call(element, selector);
-	}
-	if (typeof selector !== "function") return null;
-	if (selector(element)) return element;
-	let parent = element.parentElement;
-	while (parent != null && !selector(parent)) {
-		if (parent === document.body) return null;
-		parent = parent.parentElement;
-	}
-	return parent;
-}
-function getElement(origin) {
-	if (origin instanceof Element) return origin;
-	return origin instanceof Event && origin.target instanceof Element ? origin.target : void 0;
-}
-//#endregion
-//#region node_modules/@oscarpalmer/toretto/dist/find/index.mjs
-/**
-* Get elements from an event position
-*
-* @param position Event position
-* @returns Elements at the event position
-*/
-function getElementFromPosition(position) {
-	if (!isEventPosition(position) || typeof document.elementFromPoint !== "function") return [];
-	const { x, y } = position;
-	const elements = [];
-	const events = [];
-	let current;
-	while (true) {
-		current = document.elementFromPoint(x, y);
-		if (current == null || elements.indexOf(current) !== -1) break;
-		if (!(current instanceof HTMLElement)) continue;
-		elements.push(current);
-		events.push({
-			value: current.style.getPropertyValue(STYLE_POINTER_EVENTS),
-			priority: current.style.getPropertyPriority(STYLE_POINTER_EVENTS)
-		});
-		current.style.setProperty(STYLE_POINTER_EVENTS, STYLE_NONE$1, STYLE_IMPORTANT);
-	}
-	const { length } = elements;
-	for (let index = 0; index < length; index += 1) {
-		const element = elements[index];
-		const event = events[index];
-		if (element instanceof HTMLElement) element.style.setProperty(STYLE_POINTER_EVENTS, event.value ?? "", event.priority);
-	}
-	return elements;
-}
-const STYLE_IMPORTANT = "important";
-const STYLE_NONE$1 = "none";
-const STYLE_POINTER_EVENTS = "pointer-events";
-//#endregion
-//#region node_modules/@oscarpalmer/toretto/dist/focusable.mjs
-/**
-* Get a list of focusable elements within a parent element
-*
-* @param parent Parent element
-* @returns Focusable elements
-*/
-function getFocusable(parent) {
-	return getValidElements(parent, FILTERS_FOCUSABLE, false);
-}
-function getItem(element, tabbable) {
-	return {
-		element,
-		tabIndex: tabbable ? getTabIndex(element) : TABINDEX_DEFAULT
-	};
-}
-function getTabIndex(element) {
-	const tabIndex = element?.tabIndex ?? TABINDEX_DEFAULT;
-	if (tabIndex < TABINDEX_BASE && (EXPRESSION_SPECIAL_TABINDEX.test(element.tagName) || isEditable(element)) && !hasTabIndex(element)) return TABINDEX_BASE;
-	return tabIndex;
-}
-function getValidElements(parent, filters, tabbable) {
-	if (!(parent instanceof Element)) return [];
-	const elements = [...parent.querySelectorAll(SELECTOR_FULL)];
-	const items = [];
-	let { length } = elements;
-	for (let index = 0; index < length; index += 1) {
-		const item = getItem(elements[index], tabbable);
-		if (!filters.some((filter) => filter(item))) items.push(item);
-	}
-	if (!tabbable) return items.map((item) => item.element);
-	const indiced = [];
-	const zeroed = [];
-	length = items.length;
-	for (let index = 0; index < length; index += 1) {
-		const item = items[index];
-		if (item.tabIndex === TABINDEX_BASE) zeroed.push(item.element);
-		else indiced[item.tabIndex] = [...indiced[item.tabIndex] ?? [], item.element];
-	}
-	return [...indiced.flat(), ...zeroed];
-}
-function hasTabIndex(element) {
-	return !Number.isNaN(Number.parseInt(element.getAttribute(ATTRIBUTE_TABINDEX), 10));
-}
-function isDisabled$1(item) {
-	if (EXPRESSION_DISABLEABLE.test(item.element.tagName) && isDisabledFromFieldset(item.element)) return true;
-	return item.element.disabled ?? false;
-}
-function isDisabledFromFieldset(element) {
-	let parent = element.parentElement;
-	while (parent != null) {
-		if (parent instanceof HTMLFieldSetElement && parent.disabled) {
-			const children = Array.from(parent.children);
-			const { length } = children;
-			for (let index = 0; index < length; index += 1) {
-				const child = children[index];
-				if (child instanceof HTMLLegendElement) return parent.matches(SELECTOR_FIELDSET_DISABLED) || !child.contains(element);
-			}
-			return true;
-		}
-		parent = parent.parentElement;
-	}
-	return false;
-}
-function isEditable(element) {
-	return EXPRESSION_TRUEISH.test(element.getAttribute(ATTRIBUTE_CONTENTEDITABLE));
-}
-function isHidden(item) {
-	if ((item.element.hidden ?? false) || item.element instanceof HTMLInputElement && item.element.type === STYLE_HIDDEN) return true;
-	if ((item.element.matches(SELECTOR_SUMMARY_FIRST) ? item.element.parentElement : item.element)?.matches(SELECTOR_DETAILS_CLOSED_CHILDREN) ?? false) return true;
-	const style = getComputedStyle(item.element);
-	if (style.display === STYLE_NONE || style.visibility === STYLE_HIDDEN) return true;
-	const { height, width } = item.element.getBoundingClientRect();
-	return height === 0 && width === 0;
-}
-function isInert(item) {
-	return (item.element.inert ?? false) || EXPRESSION_TRUEISH.test(item.element.getAttribute(ATTRIBUTE_INERT)) || item.element.parentElement != null && isInert({
-		element: item.element.parentElement,
-		tabIndex: TABINDEX_DEFAULT
-	});
-}
-function isSummarised(item) {
-	return item.element instanceof HTMLDetailsElement && [...item.element.children].some((child) => EXPRESSION_SUMMARY.test(child.tagName));
-}
-const ATTRIBUTE_CONTENTEDITABLE = "contenteditable";
-const ATTRIBUTE_INERT = "inert";
-const ATTRIBUTE_TABINDEX = "tabindex";
-const EXPRESSION_DISABLEABLE = /^(button|input|select|textarea)$/i;
-const EXPRESSION_SPECIAL_TABINDEX = /^(audio|details|video)$/i;
-const EXPRESSION_SUMMARY = /^summary$/i;
-const EXPRESSION_TRUEISH = /^(|true)$/i;
-const FILTERS_FOCUSABLE = [
-	isDisabled$1,
-	isInert,
-	isHidden,
-	isSummarised
-];
-[...FILTERS_FOCUSABLE];
-const SELECTOR_DETAILS_CLOSED_CHILDREN = "details:not([open]) *";
-const SELECTOR_FIELDSET_DISABLED = "fieldset[disabled] *";
-const SELECTOR_SUMMARY_FIRST = "details > summary:first-of-type";
-const SELECTOR_FULL = [
-	"[contenteditable]:not([contenteditable=\"false\"])",
-	"[tabindex]:not(slot)",
-	"a[href]",
-	"audio[controls]",
-	"button",
-	"details",
-	SELECTOR_SUMMARY_FIRST,
-	"input",
-	"select",
-	"textarea",
-	"video[controls]"
-].map((selector) => `${selector}:not([inert])`).join(",");
-const STYLE_HIDDEN = "hidden";
-const STYLE_NONE = "none";
-const TABINDEX_BASE = 0;
-const TABINDEX_DEFAULT = -1;
-//#endregion
-//#region src/js/focus-trap/embedded.ts
-var FocusTrap = class {
-	disabled = false;
-	connected = true;
-	element;
-	embedded;
-	get contain() {
-		return this.element.hasAttribute(FOCUS_TRAP_CONTAIN);
-	}
-	get noescape() {
-		return this.element.hasAttribute(FOCUS_TRAP_NOESCAPE);
-	}
-	constructor(element, options) {
-		this.element = element;
-		this.embedded = options != null;
-		element.setAttribute("tabindex", "-1");
-		if (options != null) element.setAttribute(FOCUS_TRAP_SELECTOR, "");
-		if (options?.noescape) element.setAttribute(FOCUS_TRAP_NOESCAPE, "");
-	}
-	connect() {
-		setConnected(this, true);
-	}
-	destroy() {
-		this.element = void 0;
-	}
-	disable() {
-		if (!(this.disabled || this.noescape)) setDisabled(this, true);
-	}
-	disconnect() {
-		setConnected(this, false);
-	}
-	enable() {
-		if (this.disabled) setDisabled(this, false);
-	}
-	focus(last) {
-		tabToTrap(this, getFocusable(this.element), this.element, last ? -1 : 0);
-	}
-};
-function createFocusTrap(element, options) {
-	let focusTrap = FOCUSTRAPS_ALL.get(element);
-	if (focusTrap == null) {
-		focusTrap = new FocusTrap(element, options);
-		FOCUSTRAPS_ALL.set(element, focusTrap);
-	}
-	return focusTrap;
-}
-function onEscape(event) {
-	let element = findAncestor(event, ATTRIBUTE_SELECTOR);
-	let focusTrap = FOCUSTRAPS_ALL.get(element);
-	if (element == null || focusTrap == null) return;
-	while (focusTrap.disabled) {
-		element = findAncestor(focusTrap.element.parentElement, ATTRIBUTE_SELECTOR);
-		focusTrap = FOCUSTRAPS_ALL.get(element);
-		if (element == null || focusTrap == null) return;
-		if (!focusTrap.disabled) break;
-	}
-	focusTrap?.disable();
-}
-function onFocusIn(event) {
-	lastTarget = FOCUSTRAPS_ALL.get(findAncestor(event, ATTRIBUTE_SELECTOR)) == null ? void 0 : event.target;
-}
-function onKeydown$2(event) {
-	switch (event.key) {
-		case "Escape":
-			onEscape(event);
-			break;
-		case "Tab":
-			onTab(event);
-			break;
-		default: return;
-	}
-}
-function onPointerdown$2(event) {
-	const lastFocusTrap = findAncestor(lastTarget, ATTRIBUTE_SELECTOR);
-	const nextFocusTrap = findAncestor(event, ATTRIBUTE_SELECTOR);
-	if (lastFocusTrap != null && nextFocusTrap !== lastFocusTrap) {
-		if (FOCUSTRAPS_ALL.get(lastFocusTrap)?.contain ?? false) {
-			event.preventDefault();
-			lastTarget?.focus();
-		}
-	}
-	if (FOCUSTRAPS_DISABLED.size === 0) return;
-	for (const focusTrap of FOCUSTRAPS_DISABLED) if (focusTrap.element !== nextFocusTrap) focusTrap.enable();
-}
-function onTab(event) {
-	const element = findAncestor(event, ATTRIBUTE_SELECTOR);
-	const focusTrap = FOCUSTRAPS_ALL.get(element);
-	if (focusTrap == null) return;
-	if (!focusTrap.disabled) event.preventDefault();
-	const elements = getFocusable(element);
-	const index = elements.indexOf(event.target);
-	if (index === -1 || elements.length === 0) tabToTrap(focusTrap, elements, element);
-	else tabToElement(focusTrap, elements, index, event.shiftKey ? -1 : 1);
-}
-function setConnected(focusTrap, value) {
-	if (!focusTrap.embedded || focusTrap.connected === value) return;
-	focusTrap.connected = value;
-}
-function setDisabled(focusTrap, value) {
-	focusTrap.disabled = value;
-	if (value) FOCUSTRAPS_DISABLED.add(focusTrap);
-	else FOCUSTRAPS_DISABLED.delete(focusTrap);
-}
-function tabToElement(focusTrap, elements, index, modifier) {
-	const { length } = elements;
-	const next = clamp(index + modifier, 0, length - 1, true);
-	if (focusTrap.disabled) {
-		if (index === length - 1 && next === 0 || index === 0 && next === length - 1) {
-			lastTarget = void 0;
-			focusTrap.enable();
-		}
-		return;
-	}
-	const element = elements[next];
-	const elementFocusTrap = FOCUSTRAPS_ALL.get(element);
-	if (elementFocusTrap != null) elementFocusTrap.focus(modifier === -1);
-	else {
-		elements[next].focus();
-		lastTarget = elements[next];
-	}
-}
-function tabToTrap(focusTrap, elements, element, index) {
-	if (focusTrap.disabled) {
-		lastTarget = void 0;
-		focusTrap.enable();
-	} else {
-		const next = elements.length === 0 ? element : elements.at(index ?? 0);
-		next.focus();
-		lastTarget = next;
-	}
-}
-const FOCUS_TRAP_SELECTOR = "oui-focus-trap";
-const ATTRIBUTE_SELECTOR = `[${FOCUS_TRAP_SELECTOR}]`;
-const EVENT_OPTIONS = {
-	capture: true,
-	passive: false
-};
-const FOCUS_TRAP_CONTAIN = `${FOCUS_TRAP_SELECTOR}-contain`;
-const FOCUS_TRAP_NOESCAPE = `${FOCUS_TRAP_SELECTOR}-noescape`;
-const FOCUSTRAPS_ALL = /* @__PURE__ */ new WeakMap();
-const FOCUSTRAPS_DISABLED = /* @__PURE__ */ new Set();
-let lastTarget;
-on(document, "focusin", onFocusIn, EVENT_OPTIONS);
-on(document, "keydown", onKeydown$2, EVENT_OPTIONS);
-on(document, "mousedown", onPointerdown$2, EVENT_OPTIONS);
-on(document, "touchstart", onPointerdown$2, EVENT_OPTIONS);
-//#endregion
-//#region src/js/focus-trap/standalone.ts
-function removeFocusTraps(element) {
-	FOCUSTRAPS_ALL.get(element)?.destroy();
-	FOCUSTRAPS_ALL.delete(element);
-}
-attributable(FOCUS_TRAP_SELECTOR, createFocusTrap, removeFocusTraps);
-new Set([
-	Node.ELEMENT_NODE,
-	Node.TEXT_NODE,
-	Node.PROCESSING_INSTRUCTION_NODE,
-	Node.COMMENT_NODE,
-	Node.DOCUMENT_TYPE_NODE
-]);
-//#endregion
-//#region node_modules/@oscarpalmer/toretto/dist/internal/property.mjs
-function getPropertyValue(element, name, value) {
-	if (isInputElement(element) && name === "value") return getString(value);
-	return value;
-}
-function updateProperty(element, name, value, dispatch) {
-	let property = name;
-	if (!(property in element)) property = camelCase(name);
-	const next = getPropertyValue(element, name, value);
-	if (!(property in element) || Object.is(element[property], next)) return;
-	element[property] = next;
-	const event = dispatch && elementEvents[element.tagName]?.[property];
-	if (typeof event === "string") element.dispatchEvent(new Event(event, {
-		bubbles: true,
-		cancelable: true
-	}));
-}
-const elementEvents = {
-	DETAILS: { open: "toggle" },
-	INPUT: {
-		checked: "change",
-		value: "input"
-	},
-	SELECT: { value: "change" },
-	TEXTAREA: { value: "input" }
-};
-//#endregion
-//#region node_modules/@oscarpalmer/toretto/dist/internal/attribute.mjs
-function isAttribute(value) {
-	return value instanceof Attr || isPlainObject(value) && typeof value.name === "string" && "value" in value;
-}
-function updateAttribute(element, name, value, dispatch) {
-	const lowerCaseName = name.toLowerCase();
-	const isBoolean = booleanAttributesSet.has(lowerCaseName);
-	const next = isBoolean ? value === true || typeof value === "string" && (value === "" || value.toLowerCase() === lowerCaseName) : value == null ? "" : value;
-	if (isBoolean || dispatchedAttributes.has(name)) updateProperty(element, name, next, dispatch);
-	updateElementValue(element, name, isBoolean ? next ? "" : null : value, element.setAttribute, element.removeAttribute, isBoolean, false);
-}
-/**
-* List of boolean attributes
-*/
-const booleanAttributes = Object.freeze([
-	"async",
-	"autofocus",
-	"autoplay",
-	"checked",
-	"controls",
-	"default",
-	"defer",
-	"disabled",
-	"formnovalidate",
-	"hidden",
-	"inert",
-	"ismap",
-	"itemscope",
-	"loop",
-	"multiple",
-	"muted",
-	"nomodule",
-	"novalidate",
-	"open",
-	"playsinline",
-	"readonly",
-	"required",
-	"reversed",
-	"selected"
-]);
-const booleanAttributesSet = new Set(booleanAttributes);
-const dispatchedAttributes = new Set([
-	"checked",
-	"open",
-	"value"
-]);
-document.createElement("form");
-//#endregion
-//#region node_modules/@oscarpalmer/toretto/dist/internal/element-value.mjs
-function ignoreSetAttribute(element, name) {
-	if (element instanceof HTMLTextAreaElement && name === "value") return true;
-	return false;
-}
-function normalizeKey(key, style) {
-	return style && key.startsWith(CSS_VARIABLE_PREFIX) ? key : kebabCase(key);
-}
-function setElementValue(element, first, second, third, callback, style) {
-	if (!isHTMLOrSVGElement(element)) return;
-	if (typeof first === "string") setElementValues(element, first, second, third, callback, style);
-	else if (isAttribute(first)) setElementValues(element, first.name, first.value, third, callback, style);
-}
-function setElementValues(element, first, second, third, callback, style) {
-	if (!isHTMLOrSVGElement(element)) return;
-	const dispatch = third !== false;
-	if (typeof first === "string") {
-		callback(element, normalizeKey(first, style), second, dispatch);
-		return;
-	}
-	const isArray = Array.isArray(first);
-	if (!isArray && !(typeof first === "object" && first !== null)) return;
-	const entries = isArray ? first : Object.entries(first).map(([name, value]) => ({
-		name,
-		value
-	}));
-	const { length } = entries;
-	for (let index = 0; index < length; index += 1) {
-		const entry = entries[index];
-		if (typeof entry === "object" && typeof entry?.name === "string") callback(element, normalizeKey(entry.name, style), entry.value, dispatch);
-	}
-}
-function updateElementValue(element, key, value, set, remove, isBoolean, json) {
-	if (isBoolean ? value == null : isNullableOrWhitespace(value)) remove.call(element, key);
-	else if (!ignoreSetAttribute(element, key)) set.call(element, key, json ? JSON.stringify(value) : getString(value));
-}
-const CSS_VARIABLE_PREFIX = "--";
-//#endregion
-//#region node_modules/@oscarpalmer/toretto/dist/style.mjs
-/**
-* Get styles from an element
-*
-* @param element Element to get the styles from
-* @param properties Styles to get
-* @param computed Get the computed styles? _(defaults to `false`)_
-* @returns Style values
-*/
-function getStyles(element, properties, computed) {
-	const styles = {};
-	if (!(isHTMLOrSVGElement(element) && Array.isArray(properties))) return styles;
-	const { length } = properties;
-	for (let index = 0; index < length; index += 1) {
-		const property = properties[index];
-		if (typeof property === "string") styles[property] = getStyleValue(element, property, computed === true);
-	}
-	return styles;
-}
-/**
-* Set styles on an element
-*
-* @param element Element to set the styles on
-* @param styles Styles to set
-*/
-function setStyles(element, styles) {
-	setElementValues(element, styles, null, null, updateStyleProperty, true);
-}
-/**
-* Toggle styles for an element
-*
-* @param element Element to style
-* @param styles Styles to be set or removed
-* @returns Style toggler
-*/
-function toggleStyles(element, styles) {
-	function toggle(set) {
-		hasSet = set;
-		let next;
-		if (set) {
-			values = getStyles(element, keys);
-			next = styles;
-		} else {
-			next = { ...values };
-			values = {};
-			for (let index = 0; index < length; index += 1) values[keys[index]] = void 0;
-		}
-		setStyles(element, next);
-	}
-	const keys = Object.keys(styles);
-	const { length } = keys;
-	let hasSet = false;
-	let values = {};
-	return {
-		set() {
-			if (!hasSet) toggle(true);
-		},
-		remove() {
-			if (hasSet) toggle(false);
-		}
-	};
-}
-function updateStyleProperty(element, key, value) {
-	updateElementValue(element, key, value, function(property, style) {
-		if (property.startsWith(VARIABLE_PREFIX)) this.style.setProperty(property, getString(style));
-		else this.style[property] = getString(style);
-	}, function(property) {
-		if (property.startsWith(VARIABLE_PREFIX)) this.style.removeProperty(property);
-		else this.style[property] = "";
-		if (this.getAttribute(ATTRIBUTE_STYLE) === "") this.removeAttribute(ATTRIBUTE_STYLE);
-	}, false, false);
-}
-const ATTRIBUTE_STYLE = "style";
-const VARIABLE_PREFIX = "--";
-//#endregion
-//#region node_modules/@oscarpalmer/toretto/dist/touch.mjs
-function getSupport() {
-	if (window == null || navigator == null) return false;
-	if ("matchMedia" in window) {
-		const media = matchMedia?.("(pointer: coarse)");
-		if (typeof media?.matches === "boolean" && media.matches) return true;
-	}
-	if ("ontouchstart" in window) return true;
-	if (typeof navigator.maxTouchPoints === "number" && navigator.maxTouchPoints > 0) return true;
-	if (typeof navigator.msMaxTouchPoints === "number" && navigator.msMaxTouchPoints > 0) return true;
-	return false;
-}
-/**
-* Does the device support touch events?
-*/
-const supportsTouch = (() => {
-	let support = getSupport();
-	const instance = Object.create({
-		get() {
-			return support;
-		},
-		update() {
-			support = getSupport();
-			return support;
-		}
-	});
-	Object.defineProperty(instance, "value", { get() {
-		return support;
-	} });
-	return instance;
-})();
-//#endregion
-//#region src/js/internal/draggable.ts
-var Draggable = class {
-	prefix;
-	element;
-	options;
-	container;
-	hasHandles;
-	horizontal = true;
-	vertical = true;
-	constructor(prefix, element, options) {
-		this.prefix = prefix;
-		this.element = element;
-		this.options = options;
-		setContainer(this, options);
-		setDirection(this, options);
-	}
-	destroy() {
-		unsetContainer(this, this.options);
-		this.container = void 0;
-		this.element = void 0;
-		this.options = void 0;
-	}
-};
-function addDraggable(element) {
-	let instances = state.instances.get(element);
-	if (instances == null) {
-		instances = {};
-		state.instances.set(element, instances);
-	}
-	instances[this.property] ??= new this.constructor(element);
-}
-function getHandle(event, isMovable) {
-	return findAncestor(event, isMovable ? SELECTOR_MOVABLE_HANDLE : SELECTOR_SORTABLE_HANDLE);
-}
-function getNextPosition(draggable, position) {
-	let x = state.original?.x ?? 0;
-	let y = state.original?.y ?? 0;
-	if (draggable.horizontal) {
-		x = position.x - (state.offset?.x ?? 0);
-		if (state.container != null && state.element != null) x = clamp(x, state.container.left, state.container.right - state.element.rectangle.width);
-	}
-	if (draggable.vertical) {
-		y = position.y - (state.offset?.y ?? 0);
-		if (state.container != null && state.element != null) y = clamp(y, state.container.top, state.container.bottom - state.element.rectangle.height);
-	}
-	return {
-		x,
-		y
-	};
-}
-function onKeydown$1(event) {
-	if (current == null || event.key !== KEY_ESCAPE) return;
-	const { origin } = current;
-	current.options.drag.onCancel?.(state, current);
-	current.element.dispatchEvent(new CustomEvent(`${current.prefix}:cancel`, { detail: { element: origin } }));
-	reset();
-}
-function onPointerdown$1(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, SELECTOR$4);
-	const instances = state.instances.get(container);
-	if (instances == null) return;
-	const isMovable = container.hasAttribute(ATTRIBUTE_MOVABLE);
-	const instance = isMovable ? instances.movable : instances.sortable;
-	if (instance == null) return;
-	if (supportsTouch.value) event.preventDefault();
-	let element = container;
-	if (!isMovable) {
-		element = findAncestor(event, SELECTOR_SORTABLE_ITEM);
-		if (element == null || element.parentElement !== container) return;
-	}
-	let handle = element;
-	instance.hasHandles ??= element.querySelector(SELECTOR_SORTABLE_HANDLE) != null;
-	if (instance.hasHandles) handle = getHandle(event, isMovable);
-	if (handle == null) return;
-	const { dragged } = instance;
-	const rectangle = dragged.getBoundingClientRect();
-	const position = getPosition(event) ?? {
-		x: 0,
-		y: 0
-	};
-	current = instance;
-	state.container = instance.container?.getBoundingClientRect();
-	state.element = {
-		rectangle,
-		node: dragged
-	};
-	state.offset = instance.options.position.getOffset(state, instance, element, position);
-	state.original = instance.options.position.getOriginal(state, instance, position);
-	const begin = new CustomEvent(`${instance.prefix}:begin`, {
-		detail: {
-			element,
-			position: { ...state.original }
-		},
-		cancelable: true
-	});
-	instance.element.dispatchEvent(begin);
-	setTimeout(() => {
-		if (begin.defaultPrevented) {
-			current?.options.drag.onCancel(state, instance);
-			reset();
-			return;
-		}
-		const next = getNextPosition(instance, position);
-		dragged.style.position = "fixed";
-		dragged.style.inset = `${next.y}px auto auto ${next.x}px`;
-		instance.options.drag.onBegin(event, state, instance, element, handle, next);
-		styleToggler.set();
-	});
-}
-function onPointermove$1(event) {
-	if (current == null) return;
-	const position = getPosition(event);
-	if (position == null) return;
-	const next = getNextPosition(current, position);
-	if (state.element != null) state.element.node.style.inset = `${next.y}px auto auto ${next.x}px`;
-	const detail = current.options.drag.onMove(event, state, current, {
-		calculated: next,
-		original: position
-	});
-	current.element.dispatchEvent(new CustomEvent(`${current.prefix}:move`, { detail }));
-}
-function onPointerup$1(event) {
-	current?.options.drag.onEnd?.(event, state, current, reset);
-}
-function removeDraggable(element) {
-	const { property } = this;
-	const instances = state.instances.get(element);
-	if (instances == null || instances[property] == null) return;
-	instances[property]?.destroy();
-	instances[property] = void 0;
-	if (instances[properties[property]] == null) state.instances.delete(element);
-}
-function reset() {
-	current = void 0;
-	state.container = void 0;
-	state.element = void 0;
-	state.offset = void 0;
-	state.original = void 0;
-	styleToggler.remove();
-}
-function setContainer(draggable, options) {
-	const selector = draggable.element.getAttribute(options.container.attribute);
-	if (typeof selector !== "string") return;
-	draggable.container = globals.has(selector) ? draggable.element.ownerDocument.body : document.querySelector(selector) ?? void 0;
-	if (draggable.container == null) return;
-	const set = options.container.map.get(draggable.container);
-	if (set == null) options.container.map.set(draggable.container, new Set([draggable]));
-	else set.add(draggable);
-	options.container.onInitialize?.(draggable);
-}
-function setDirection(draggable, options) {
-	const direction = draggable.element.getAttribute(options.direction.attribute);
-	if (horizontals.has(direction)) draggable.vertical = false;
-	else if (verticals.has(direction)) draggable.horizontal = false;
-	options.direction.onAfter?.(draggable);
-}
-function unsetContainer(draggable, options) {
-	const { container } = draggable;
-	if (container == null) return;
-	const set = options.container.map.get(container);
-	let empty = false;
-	if (set != null) {
-		set.delete(draggable);
-		if (set.size === 0) {
-			empty = true;
-			options.container.map.delete(container);
-		}
-	}
-	options.container.onDestroy?.(draggable, container, empty);
-}
-const ATTRIBUTE_MOVABLE = "oui-movable";
-const ATTRIBUTE_SORTABLE = "oui-sortable";
-const KEY_ESCAPE = "Escape";
-const SELECTOR$4 = `[${ATTRIBUTE_MOVABLE}], [${ATTRIBUTE_SORTABLE}]`;
-const SELECTOR_MOVABLE_HANDLE = `[${ATTRIBUTE_MOVABLE}-handle]`;
-const SELECTOR_SORTABLE_HANDLE = `[${ATTRIBUTE_SORTABLE}-handle]`;
-const SELECTOR_SORTABLE_ITEM = `[${ATTRIBUTE_SORTABLE}] > *`;
-const globals = new Set([
-	"body",
-	"document",
-	"window"
-]);
-const horizontals = new Set(["horizontal", "x"]);
-const properties = {
-	movable: "sortable",
-	sortable: "movable"
-};
-const state = {
-	container: void 0,
-	element: void 0,
-	instances: /* @__PURE__ */ new WeakMap(),
-	offset: void 0,
-	original: void 0
-};
-const styleToggler = toggleStyles(document.body, {
-	touchAction: "none",
-	userSelect: "none",
-	webkitUserSelect: "none"
-});
-const verticals = new Set(["vertical", "y"]);
-let current;
-on(document, "keydown", onKeydown$1);
-on(document, "mousedown", onPointerdown$1);
-on(document, "pointermove", onPointermove$1);
-on(document, "pointerup", onPointerup$1);
-on(document, "touchcancel", onPointerup$1, { passive: false });
-on(document, "touchstart", onPointerdown$1, { passive: false });
-//#endregion
-//#region src/js/movable.ts
-var Movable = class extends Draggable {
-	inset;
-	moved = false;
-	offset;
-	position;
-	get dragged() {
-		return this.element;
-	}
-	get origin() {
-		return this.element;
-	}
-	constructor(element) {
-		super("move", element, {
-			container: {
-				attribute: ATTRIBUTE_CONTAINER$1,
-				map: CONTAINERS$1,
-				onDestroy: destroyContainer,
-				onInitialize: initializeContainer
-			},
-			direction: {
-				attribute: ATTRIBUTE_DIRECTION$1,
-				onAfter: afterDirection
-			},
-			drag: {
-				onBegin: onBegin$1,
-				onCancel: onCancel$1,
-				onEnd: onEnd$2,
-				onMove: onMove$1
-			},
-			position: {
-				getOffset: getOffsetPosition$1,
-				getOriginal: getOriginalPosition$1
-			}
-		});
-		this.hasHandles = element.querySelector(SELECTOR_HANDLE$1) != null;
-		this.inset = element.style.inset;
-		this.position = element.style.position;
-	}
-	destroy() {
-		super.destroy();
-		MOVED.delete(this);
-		this.element.style.inset = this.inset;
-		this.element.style.position = this.position;
-	}
-};
-function afterDirection(draggable) {
-	const container = draggable.container?.getBoundingClientRect();
-	if (container != null) setOffset(draggable, container);
-}
-function destroyContainer(_, container, empty) {
-	if (empty) resizer.unobserve(container);
-}
-function getOffsetPosition$1(state, _, __, position) {
-	return {
-		x: position.x - (state.element?.rectangle.left ?? 0),
-		y: position.y - (state.element?.rectangle.top ?? 0)
-	};
-}
-function getOriginalPosition$1(state) {
-	return {
-		x: state.element?.rectangle.left ?? 0,
-		y: state.element?.rectangle.top ?? 0
-	};
-}
-function initializeContainer(draggable) {
-	resizer.observe(draggable.container);
-}
-function onBegin$1() {}
-function onCancel$1(state, draggable) {
-	const { element, inset, moved, position } = draggable;
-	const { x, y } = state.original ?? {
-		x: 0,
-		y: 0
-	};
-	if (moved) element.style.inset = `${y}px auto auto ${x}px`;
-	else {
-		element.style.position = position;
-		element.style.inset = inset;
-	}
-}
-function onEnd$2(event, state, draggable, reset) {
-	const movable = draggable;
-	if (!movable.moved) {
-		movable.moved = true;
-		if (movable.container != null) MOVED.add(movable);
-	}
-	const container = movable.container?.getBoundingClientRect();
-	if (container != null) setOffset(movable, container);
-	const end = new CustomEvent(EVENT_END$1, {
-		detail: {
-			from: { ...state.original },
-			to: getPosition(event)
-		},
-		cancelable: true
-	});
-	movable.element.dispatchEvent(end);
-	setTimeout(() => {
-		if (end.defaultPrevented) onCancel$1(state, draggable);
-		reset();
-	});
-}
-function onMove$1(_, state, __, position) {
-	return {
-		from: { ...state.original },
-		to: { ...position.calculated }
-	};
-}
-function onResize(entries) {
-	const { length } = entries;
-	for (let index = 0; index < length; index += 1) {
-		const entry = entries[index];
-		const set = CONTAINERS$1.get(entry.target);
-		if (set == null) continue;
-		for (const movable of set) reposition(movable);
-	}
-}
-function onScroll() {
-	for (const moved of MOVED) reposition(moved);
-}
-function reposition(movable) {
-	if (!movable.moved || movable.container == null) return;
-	const container = movable.container.getBoundingClientRect();
-	const x = container.left + (movable.offset?.x ?? 0);
-	const y = container.top + (movable.offset?.y ?? 0);
-	movable.element.style.inset = `${y}px auto auto ${x}px`;
-}
-function setOffset(movable, container) {
-	movable.offset = {};
-	const element = movable.element.getBoundingClientRect();
-	movable.offset.y = element.top - container.top;
-	movable.offset.x = element.left - container.left;
-}
-const ATTRIBUTE$2 = "oui-movable";
-const ATTRIBUTE_CONTAINER$1 = `${ATTRIBUTE$2}-container`;
-const ATTRIBUTE_DIRECTION$1 = `${ATTRIBUTE$2}-direction`;
-const CONTAINERS$1 = /* @__PURE__ */ new Map();
-const EVENT_END$1 = "move:end";
-const MOVED = /* @__PURE__ */ new Set();
-const SELECTOR_HANDLE$1 = `[${ATTRIBUTE$2}-handle]`;
-const bound$1 = {
-	constructor: Movable,
-	property: "movable"
-};
-const resizer = new ResizeObserver(onResize);
-attributable(ATTRIBUTE$2, addDraggable.bind(bound$1), removeDraggable.bind(bound$1));
-on(document, "scroll", onScroll);
-//#endregion
-//#region src/js/internal/floatable.ts
-var Floatable = class {
-	options;
-	active = false;
-	disabled = false;
-	frame;
-	ignoreFocus = false;
-	constructor(options) {
-		this.options = options;
-		initialize(this);
-	}
-	destroy() {
-		stop(this);
-		const state = getState();
-		state?.active.delete(this);
-		state?.mapped.delete(this.options.anchor);
-		state?.mapped.delete(this.options.content);
-		this.options.anchor = void 0;
-		this.options.content = void 0;
-	}
-	disable() {
-		if (this.disabled) return;
-		this.disabled = true;
-		stop(this);
-		getState()?.active.delete(this);
-	}
-	enable() {
-		if (!this.disabled) return;
-		this.disabled = false;
-		initialize(this);
-	}
-	toggle(active, ignoreFocus) {
-		if (this.disabled || this.active === active) return;
-		const state = getState();
-		if (state == null) return;
-		this.ignoreFocus = !active && (ignoreFocus ?? false);
-		stop(this);
-		if (active) state.active.add(this);
-		else state.active.delete(this);
-		if (this.options.interactive) if (active) state.order.push(this);
-		else {
-			const index = state.order.indexOf(this);
-			if (index > -1) state.order.splice(index, 1);
-		}
-		if (active) activate(this);
-		else deactivate(this);
-	}
-};
-function activate(floatable) {
-	floatable.active = true;
-	document.body.append(floatable.options.content);
-	floatable.options.content.hidden = false;
-	setPosition(floatable);
-}
-function closeAbove(element) {
-	const state = getState();
-	if (state == null) return;
-	const index = state.order.findIndex((floatable) => floatable.options.anchor === element || floatable.options.content === element);
-	if (index === -1 || index === state.order.length - 1) return;
-	while (index < state.order.length - 1) state.order.pop()?.toggle(false, true);
-}
-function closeAll() {
-	const state = getState();
-	const floatables = [...state?.active ?? []];
-	state?.active.clear();
-	for (const floatable of floatables) floatable.toggle(false, true);
-}
-function closeNonInteractive(state) {
-	for (const floatable of state.active) if (!floatable.options.interactive) floatable.toggle(false);
-}
-function deactivate(floatable) {
-	floatable.active = false;
-	if (!floatable.options.reusable) {
-		floatable.options.content.hidden = true;
-		floatable.options.anchor.insertAdjacentElement(INSERT_AFTEREND, floatable.options.content);
-	}
-	floatable.options.onAfter?.(false);
-}
-function getAnchorName() {
-	index$2 += 1;
-	return `--oui-floatable-anchor-${index$2}`;
-}
-function getState() {
-	return window._oscarpalmer_oui_floatable;
-}
-function initialize(floatable) {
-	const { anchor, content, interactive } = floatable.options;
-	if (interactive) {
-		anchor.setAttribute(ATTRIBUTE_ANCHOR, "");
-		content.setAttribute(ATTRIBUTE_CONTENT$1, "");
-	}
-	const anchorName = getAnchorName();
-	anchor.style.anchorName = anchorName;
-	content.style.position = "absolute";
-	content.style.positionAnchor = anchorName;
-	content.style.positionTry = "normal flip-start";
-	const state = getState();
-	state?.mapped.set(anchor, floatable);
-	state?.mapped.set(content, floatable);
-}
-function isDisabled(element) {
-	return element.disabled || element.readOnly || element.getAttribute("aria-disabled") === "true";
-}
-function onClick$1(event) {
-	const related = findAncestor(event, SELECTOR_ALL);
-	if (!(related instanceof HTMLElement)) closeAll();
-	else if (related.hasAttribute(ATTRIBUTE_CONTENT$1)) closeAbove(related);
-	else if (!isDisabled(related)) toggle$1(related);
-}
-function onKeyDown(event) {
-	if (event.key !== "Escape") return;
-	const state = getState();
-	if (state == null || state.active.size === 0) return;
-	closeNonInteractive(state);
-	const related = findAncestor(event, SELECTOR_CONTENT$2);
-	if (!(related instanceof HTMLElement)) return;
-	closeAbove(related);
-	const floatable = state.mapped.get(related);
-	if (floatable != null) floatable.toggle(false);
-}
-function setPosition(floatable) {
-	let position = floatable.options.anchor.getAttribute(floatable.options.positionAttribute) ?? floatable.options.defaultPosition;
-	if (AREAS[position] == null) position = floatable.options.defaultPosition;
-	const area = AREAS[position];
-	floatable.options.content.style.positionArea = area;
-	floatable.options.content.setAttribute(ATTRIBUTE_POSITION$1, POSITIONS[area]);
-	floatable.options.onAfter?.(true);
-}
-function stop(floatable) {
-	if (floatable.frame != null) cancelAnimationFrame(floatable.frame);
-	floatable.frame = void 0;
-}
-function toggle$1(anchor) {
-	const floatable = getState()?.mapped.get(anchor);
-	if (floatable == null) {
-		closeAll();
-		return;
-	}
-	const active = Boolean(floatable.active);
-	const content = findAncestor(floatable.options.anchor, SELECTOR_CONTENT$2);
-	if (content == null) closeAll();
-	else closeAbove(content);
-	floatable.toggle(!active);
-}
-const AREAS = {
-	above: "block-start",
-	"above-end": "start span-start",
-	"above-start": "start span-end",
-	below: "block-end",
-	"below-end": "end span-start",
-	"below-start": "end span-end",
-	end: "center end",
-	"end-bottom": "span-start end",
-	"end-top": "span-end end",
-	start: "center start",
-	"start-bottom": "span-start start",
-	"start-top": "span-end start"
-};
-const ATTRIBUTE_ANCHOR = "oui-floatable-anchor";
-const ATTRIBUTE_CONTENT$1 = "oui-floatable-content";
-const ATTRIBUTE_POSITION$1 = "oui-position";
-const INSERT_AFTEREND = "afterend";
-const POSITIONS = Object.fromEntries(Object.entries(AREAS).map(([position, area]) => [area, position]));
-const SELECTOR_ALL = `[${ATTRIBUTE_ANCHOR}], [${ATTRIBUTE_CONTENT$1}]`;
-const SELECTOR_CONTENT$2 = `[${ATTRIBUTE_CONTENT$1}]`;
-let index$2 = 0;
-if (window._oscarpalmer_oui_floatable == null) {
-	Object.defineProperty(window, "_oscarpalmer_oui_floatable", {
-		enumerable: false,
-		value: {
-			active: /* @__PURE__ */ new Set(),
-			mapped: /* @__PURE__ */ new Map(),
-			order: []
-		},
-		writable: false
-	});
-	on(document, "keydown", (event) => {
-		onKeyDown(event);
-	});
-	on(document, "click", (event) => {
-		onClick$1(event);
-	});
-}
-//#endregion
-//#region src/js/popover.ts
-let index$1 = 0;
-var OuiPopoverElement = class extends HTMLElement {
-	#floatable;
-	#focusTrap;
-	constructor() {
-		super();
-		const content = this.querySelector(SELECTOR_CONTENT$1);
-		const toggle = this.querySelector(SELECTOR_TOGGLE);
-		if (!(content instanceof HTMLElement)) throw new Error("A oui-popover must have a direct child element with the [oui-popover-content]-attribute");
-		if (!(toggle instanceof HTMLButtonElement)) throw new Error("A oui-popover must have a direct child element with the [oui-popover-toggle]-attribute and be a button");
-		content.hidden = true;
-		content.setAttribute("role", "dialog");
-		content.setAttribute("aria-modal", "true");
-		if (isNullableOrWhitespace(content.id)) content.setAttribute("id", `${ATTRIBUTE_ID_PREFIX}_${++index$1}`);
-		toggle.setAttribute("aria-controls", content.id);
-		toggle.setAttribute("aria-haspopup", "dialog");
-		this.#floatable = new Floatable({
-			content,
-			anchor: toggle,
-			defaultPosition: "below-start",
-			interactive: true,
-			positionAttribute: "position",
-			reusable: false,
-			onAfter: (active) => {
-				if (active) focus(content);
-				else if (!this.#floatable.ignoreFocus) toggle.focus();
-			}
-		});
-		this.#focusTrap = createFocusTrap(content, { noescape: true });
-		POPOVERS.set(toggle, this.#floatable);
-		POPOVERS.set(content, this.#floatable);
-	}
-	close() {
-		this.hidePopover();
-	}
-	connectedCallback() {
-		this.#floatable.enable();
-		this.#focusTrap.connect();
-	}
-	disconnectedCallback() {
-		this.#floatable.disable();
-		this.#focusTrap.disconnect();
-	}
-	hidePopover() {
-		if (this.#floatable.active && this.isConnected) this.#floatable.toggle(false);
-	}
-	open() {
-		this.showPopover();
-	}
-	showPopover() {
-		if (!this.#floatable.active && this.isConnected) this.#floatable.toggle(true);
-	}
-	toggle() {
-		this.togglePopover();
-	}
-	togglePopover(options) {
-		if (typeof options === "boolean") {
-			if (options === true) this.showPopover();
-			else this.hidePopover();
-			return options;
-		}
-		if (this.#floatable.active) {
-			this.hidePopover();
-			return false;
-		}
-		this.showPopover();
-		return true;
-	}
-};
-function focus(content) {
-	let target = getFocusable(content)[0];
-	if (!(target instanceof HTMLElement)) target = content;
-	requestAnimationFrame(() => {
-		target.focus();
-	});
-}
-const ATTRIBUTE_ID_PREFIX = "oui_popover_content_";
-const POPOVERS = /* @__PURE__ */ new Map();
-const SELECTOR$3 = "oui-popover";
-const SELECTOR_CONTENT$1 = `:scope > [${SELECTOR$3}-content]`;
-const SELECTOR_TOGGLE = `:scope > [${SELECTOR$3}-toggle]`;
-customElements.define(SELECTOR$3, OuiPopoverElement);
-//#endregion
-//#region node_modules/@oscarpalmer/toretto/dist/attribute/set.attribute.mjs
-function setAttribute(element, first, second, third) {
-	setElementValue(element, first, second, third, updateAttribute);
-}
-function setAttributes(element, attributes, dispatch) {
-	setElementValues(element, attributes, null, dispatch, updateAttribute);
-}
-//#endregion
-//#region node_modules/@oscarpalmer/toretto/dist/property/set.property.mjs
-/**
-* Set the values of one or more properties on an element
-*
-* Also updates attributes for boolean/dispatchable properties, and if `dispatch` is `true`, will dispatch events for dispatchable properties
-*
-* @param target Target element
-* @param properties Properties to set
-* @param dispatch Dispatch events for properties? _(defaults to `true`)_
-*/
-function setProperties(target, properties, dispatch) {
-	if (!isHTMLOrSVGElement(target) || !isPlainObject(properties)) return;
-	const shouldDispatch = dispatch !== false;
-	const keys = Object.keys(properties);
-	const { length } = keys;
-	for (let index = 0; index < length; index += 1) setPropertyValue(target, keys[index], properties[keys[index]], shouldDispatch);
-}
-function setPropertyValue(element, property, value, dispatch) {
-	if (booleanAttributesSet.has(property.toLowerCase()) || dispatchedAttributes.has(property)) setAttribute(element, property, value, dispatch);
-	else updateProperty(element, property, value, dispatch);
-}
-//#endregion
-//#region node_modules/@oscarpalmer/toretto/dist/create.mjs
-function createElement(tag, properties, attributes, styles) {
-	if (typeof tag !== "string") throw new TypeError(MESSAGE);
-	const element = document.createElement(tag);
-	if (properties != null) setProperties(element, properties);
-	if (attributes != null) setAttributes(element, attributes);
-	if (styles != null) setStyles(element, styles);
-	return element;
-}
-const MESSAGE = "Tag name must be a string";
-//#endregion
-//#region src/js/sortable.ts
-var Sortable = class extends Draggable {
-	connections;
-	origin;
-	get dragged() {
-		return getDragPlaceholder();
-	}
-	constructor(element) {
-		super("sort", element, {
-			container: {
-				attribute: ATTRIBUTE_CONTAINER,
-				map: CONTAINERS
-			},
-			direction: { attribute: ATTRIBUTE_DIRECTION },
-			drag: {
-				onBegin,
-				onCancel,
-				onEnd: onEnd$1,
-				onMove
-			},
-			position: {
-				getOffset: getOffsetPosition,
-				getOriginal: getOriginalPosition
-			}
-		});
-		this.connections = this.element.getAttribute(ATTRIBUTE_CONNECTIONS);
-	}
-};
-function afterEnd(insert, from, events, elements, position, valid) {
-	elements.origin?.removeAttribute(ATTRIBUTE_ORIGIN);
-	from.origin = void 0;
-	resetPlaceholders();
-	if (!valid || events.some((event) => event.defaultPrevented)) return;
-	if (insert !== "insert") {
-		elements.target.append(elements.origin);
-		return;
-	}
-	if (position == null) return;
-	const { height, top } = elements.target.getBoundingClientRect();
-	let insertion;
-	if (position.y < top + height / 2) insertion = INSERT_BEFORE;
-	else insertion = INSERT_AFTER;
-	elements.target?.insertAdjacentElement(insertion, elements.origin);
-	document.body.removeAttribute(ATTRIBUTE_ACTIVE$1);
-}
-function getDragPlaceholder() {
-	placeholder.drag.default ??= createElement("div");
-	return placeholder.drag.custom ?? placeholder.drag.default;
-}
-function getOffsetPosition(_, draggable, element, position) {
-	const rectangle = element.getBoundingClientRect();
-	return {
-		x: draggable.horizontal ? 0 : position.x - rectangle.left,
-		y: draggable.vertical ? 0 : position.y - rectangle.top
-	};
-}
-function getOriginalPosition(_, __, position) {
-	return position;
-}
-function getPositionPlaceholder(sortable) {
-	placeholder.position ??= createElement("div");
-	placeholder.position.setAttribute(ATTRIBUTE_PLACEHOLDER_POSITION, "");
-	if (sortable.origin != null) placeholder.position.style.setProperty("--placeholder-height", `${sortable.origin.getBoundingClientRect().height}px`);
-	return placeholder.position;
-}
-function onBegin(_, state, draggable, element) {
-	const sortable = draggable;
-	sortable.origin = element;
-	setPlaceholder(state, sortable, element);
-	element.setAttribute(ATTRIBUTE_ORIGIN, "");
-	document.body.setAttribute(ATTRIBUTE_ACTIVE$1, "");
-}
-function onCancel(_, draggable) {
-	const sortable = draggable;
-	const { origin } = sortable;
-	origin?.removeAttribute(ATTRIBUTE_ORIGIN);
-	document.body.removeAttribute(ATTRIBUTE_ACTIVE$1);
-	resetPlaceholders();
-	sortable.origin = void 0;
-}
-function onEnd$1(event, state, draggable, reset) {
-	const from = draggable;
-	const { origin } = from;
-	const position = getPosition(event) ?? {
-		x: 0,
-		y: 0
-	};
-	const target = getElementFromPosition(position)[0];
-	let element = findAncestor(target, SELECTOR_ITEM);
-	if (element?.hasAttribute(ATTRIBUTE_PLACEHOLDER_POSITION)) if (element.getAttribute(ATTRIBUTE_PLACEHOLDER_POSITION) === "after") element = element.previousElementSibling;
-	else element = element.nextElementSibling;
-	let insert = "insert";
-	let to;
-	if (element == null) {
-		element = findAncestor(target, SELECTOR$2);
-		to = state.instances.get(element)?.sortable;
-		insert = element == null ? void 0 : element.children.length === 0 ? "append" : "prepend";
-	} else to = state.instances.get(element.parentElement)?.sortable;
-	const valid = insert != null && validatePosition(state, from, to, position);
-	const options = {
-		detail: valid ? {
-			from: {
-				element: origin,
-				position: { ...state.original }
-			},
-			to: {
-				element,
-				position: { ...position }
-			}
-		} : void 0,
-		bubbles: false,
-		cancelable: true
-	};
-	const fromEvent = new CustomEvent(EVENT_END, options);
-	const toEvent = new CustomEvent(EVENT_END, options);
-	from.element.dispatchEvent(fromEvent);
-	if (from !== to) to?.element.dispatchEvent(toEvent);
-	setTimeout(() => {
-		afterEnd(insert, from, [fromEvent, toEvent], {
-			origin,
-			target: element
-		}, position, valid);
-		reset();
-	});
-}
-function onMove(event, state, draggable, position) {
-	const from = draggable;
-	const fromElement = from.origin;
-	const toElement = findAncestor(event, SELECTOR_ITEM);
-	let to;
-	if (toElement == null) to = state.instances.get(findAncestor(event, SELECTOR$2))?.sortable;
-	else to = state.instances.get(toElement.parentElement)?.sortable;
-	if (!validatePosition(state, from, to, position.original)) return;
-	const placeholder = getPositionPlaceholder(from);
-	if (toElement != null && toElement !== fromElement) {
-		const { height, top } = toElement.getBoundingClientRect();
-		let place;
-		if (position.calculated.y < top + height / 2) {
-			place = "before";
-			toElement.insertAdjacentElement(INSERT_BEFORE, placeholder);
-		} else {
-			place = "after";
-			toElement.insertAdjacentElement(INSERT_AFTER, placeholder);
-		}
-		placeholder.setAttribute(ATTRIBUTE_PLACEHOLDER_POSITION, place);
-	} else placeholder.remove();
-	return {
-		from: {
-			element: fromElement,
-			position: { ...state.original }
-		},
-		to: {
-			element: toElement,
-			position: { ...position.calculated }
-		}
-	};
-}
-function resetPlaceholders() {
-	placeholder.drag.custom?.remove();
-	placeholder.drag.default?.remove();
-	placeholder.position?.remove();
-	placeholder.drag.custom = void 0;
-}
-function setPlaceholder(state, sortable, origin) {
-	const element = getDragPlaceholder();
-	placeholder.drag.default.innerHTML = "";
-	updatePlaceholder(sortable, element);
-	const event = new CustomEvent(EVENT_PLACEHOLDER, {
-		cancelable: true,
-		detail: {
-			origin,
-			parent: sortable.element,
-			placeholder: element,
-			create: (value) => {
-				if (!(value instanceof HTMLElement)) return;
-				placeholder.drag.custom = value;
-				updatePlaceholder(sortable, value);
-				state.element = {
-					rectangle: value.getBoundingClientRect(),
-					node: value
-				};
-			}
-		}
-	});
-	sortable.element.dispatchEvent(event);
-	setTimeout(() => {
-		if (!event.defaultPrevented && placeholder.drag.custom == null) placeholder.drag.default?.append(element.cloneNode(true));
-		document.body.append(placeholder.drag.custom ?? placeholder.drag.default ?? "");
-	});
-}
-function updatePlaceholder(sortable, element) {
-	element.style.position = "fixed";
-	element.setAttribute(ATTRIBUTE_PLACEHOLDER_DRAG, "");
-	if (sortable.horizontal) element.setAttribute(ATTRIBUTE_HORIZONTAL$1, "");
-	else element.removeAttribute(ATTRIBUTE_HORIZONTAL$1);
-	if (sortable.vertical) element.setAttribute(ATTRIBUTE_VERTICAL, "");
-	else element.removeAttribute(ATTRIBUTE_VERTICAL);
-}
-function validatePosition(_, from, to, position) {
-	let valid = true;
-	const rectangle = from.origin?.getBoundingClientRect();
-	if (rectangle != null && !from.horizontal) valid = position.x >= rectangle.left && position.x <= rectangle.right;
-	if (valid && rectangle != null && !from.vertical) valid = position.y >= rectangle.top && position.y <= rectangle.bottom;
-	if (valid && from.connections != null) valid = to?.element.matches(from.connections) ?? true;
-	if (valid && to?.connections != null) valid = from.element.matches(to.connections);
-	return valid;
-}
-const ATTRIBUTE$1 = "oui-sortable";
-const ATTRIBUTE_ACTIVE$1 = `${ATTRIBUTE$1}-active`;
-const ATTRIBUTE_CONNECTIONS = `${ATTRIBUTE$1}-connections`;
-const ATTRIBUTE_CONTAINER = `${ATTRIBUTE$1}-container`;
-const ATTRIBUTE_DIRECTION = `${ATTRIBUTE$1}-direction`;
-const ATTRIBUTE_HORIZONTAL$1 = `${ATTRIBUTE$1}-horizontal`;
-const ATTRIBUTE_ORIGIN = `${ATTRIBUTE$1}-origin`;
-const ATTRIBUTE_PLACEHOLDER_DRAG = `${ATTRIBUTE$1}-placeholder-drag`;
-const ATTRIBUTE_PLACEHOLDER_POSITION = `${ATTRIBUTE$1}-placeholder-position`;
-const ATTRIBUTE_VERTICAL = `${ATTRIBUTE$1}-vertical`;
-const CONTAINERS = /* @__PURE__ */ new Map();
-const EVENT_END = "sort:end";
-const EVENT_PLACEHOLDER = "sort:placeholder";
-const INSERT_AFTER = "afterend";
-const INSERT_BEFORE = "beforebegin";
-const SELECTOR$2 = `[${ATTRIBUTE$1}]`;
-const SELECTOR_ITEM = `[${ATTRIBUTE$1}] > *`;
-const bound = {
-	constructor: Sortable,
-	property: "sortable"
-};
-const placeholder = {
-	drag: {
-		custom: void 0,
-		default: void 0
-	},
-	position: void 0
-};
-attributable(ATTRIBUTE$1, addDraggable.bind(bound), removeDraggable.bind(bound));
-//#endregion
-//#region node_modules/@oscarpalmer/atoms/dist/math.mjs
-/**
-* Round a number
-*
-* @param value Number to round
-* @param decimals Number of decimal places to round to _(defaults to `0`)_
-* @returns Rounded number, or `Number.NaN` if the value if unable to be rounded
-*/
-function round(value, decimals) {
-	return roundNumber(Math.round, value, decimals);
-}
-function roundNumber(callback, value, decimals) {
-	if (typeof value !== "number") return NaN;
-	if (typeof decimals !== "number" || decimals < 1) return callback(value);
-	const mod = 10 ** decimals;
-	return callback((value + Number.EPSILON) * mod) / mod;
-}
-//#endregion
-//#region src/js/splitter.ts
-var OuiSplitterElement = class extends HTMLElement {
-	static observedAttributes = [
-		"max",
-		"min",
-		"size",
-		"type"
-	];
-	#splitter;
-	get max() {
-		return this.#splitter.values.max;
-	}
-	set max(value) {
-		this.setAttribute("max", String(value));
-	}
-	get min() {
-		return this.#splitter.values.min;
-	}
-	set min(value) {
-		this.setAttribute("min", String(value));
-	}
-	get size() {
-		return this.#splitter.values.now.current;
-	}
-	set size(value) {
-		this.setAttribute("size", String(value));
-	}
-	get type() {
-		return this.getAttribute("type") ?? "vertical";
-	}
-	set type(value) {
-		this.setAttribute("type", value);
-	}
-	constructor() {
-		super();
-		const panels = [...this.children].filter((child) => child instanceof HTMLElement);
-		if (panels.length !== 2) throw new Error(`${SELECTOR$1} must have exactly two panels.`);
-		this.#splitter = new Splitter(this, panels);
-	}
-	connectedCallback() {
-		this.#splitter.updateConnections(1);
-	}
-	disconnectedCallback() {
-		this.#splitter.updateConnections(0);
-	}
-	attributeChangedCallback(name) {
-		switch (name) {
-			case "max":
-			case "min":
-			case "size":
-				this.#splitter.updateValues();
-				break;
-			case "type":
-				this.#splitter.updateOrientation();
-				break;
-			default: break;
-		}
-	}
-};
-let index = 0;
-var Splitter = class {
-	element;
-	handle;
-	panels;
-	rectangle;
-	separator;
-	types;
-	values;
-	constructor(element, panels) {
-		this.element = element;
-		this.panels = panels;
-		if (isNullableOrWhitespace(element.id)) element.id = `oui_splitter_${++index}`;
-		this.values = getValues(element);
-		this.handle = createHandle();
-		this.rectangle = element.getBoundingClientRect();
-		this.separator = createSeparator(this);
-		this.separator.append(this.handle);
-		panels[0].insertAdjacentElement("afterend", this.separator);
-		this.updateOrientation();
-		this.updateValues();
-	}
-	updateConnections(add) {
-		const method = METHODS_CONNECT[add];
-		MAPPED_ELEMENTS[method](this.element, this);
-		MAPPED_ELEMENTS[method](this.handle, this);
-		MAPPED_ELEMENTS[method](this.separator, this);
-		if (this.types.auto) RESIZE_OBSERVER[METHODS_OBSERVE[add]](this.element);
-	}
-	updateOrientation() {
-		this.types = getTypes(this);
-		if (this.types.auto) RESIZE_OBSERVER.observe(this.element);
-		else RESIZE_OBSERVER.unobserve(this.element);
-		if (this.types.horizontal) this.element.setAttribute(ATTRIBUTE_HORIZONTAL, "");
-		else this.element.removeAttribute(ATTRIBUTE_HORIZONTAL);
-		setAriaOrientation(this);
-	}
-	updateValues() {
-		this.values = getValues(this.element);
-		requestAnimationFrame(() => {
-			setSize(this, this.values.now.current);
-			setAriaValue(this);
-		});
-	}
-};
-function createHandle() {
-	const handle = document.createElement("span");
-	handle.setAttribute("aria-hidden", "true");
-	handle.setAttribute(ATTRIBUTE_HANDLE, "");
-	return handle;
-}
-function createSeparator(splitter) {
-	const separator = document.createElement("div");
-	separator.role = "separator";
-	separator.tabIndex = 0;
-	separator.setAttribute("aria-controls", splitter.element.id);
-	separator.setAttribute("aria-label", "Resize panels");
-	separator.setAttribute(ATTRIBUTE_SEPARATOR, "");
-	return separator;
-}
-function getContained(min, value, max) {
-	return round(clamp(value, min, max), VALUE_DECIMALS);
-}
-function getSize(splitter, value) {
-	const { height, left, top, width } = splitter.rectangle;
-	const fraction = (value - (splitter.types.horizontal ? top : left)) / (splitter.types.horizontal ? height : width);
-	return getContained(splitter.values.min, fraction, splitter.values.max);
-}
-function getTypes(splitter, width, height) {
-	const type = splitter.element.getAttribute("type")?.trim() ?? "";
-	if (type === "horizontal") return {
-		auto: false,
-		horizontal: true
-	};
-	if (type === "auto") return {
-		auto: true,
-		horizontal: (height ?? splitter.rectangle.height) > (width ?? splitter.rectangle.width)
-	};
-	return {
-		auto: false,
-		horizontal: false
-	};
-}
-function getValue(element, name, defaultValue) {
-	const value = element.getAttribute(name);
-	if (isNullableOrWhitespace(value)) return defaultValue;
-	const parsed = Number.parseFloat(value);
-	if (Number.isNaN(parsed)) return defaultValue;
-	if (parsed < 0) return defaultValue;
-	return parsed > 1 ? parsed / NAVIGATION_MAXIMUM_TOTAL : parsed;
-}
-function getValues(element) {
-	const values = {
-		max: getValue(element, "max", NAVIGATION_MAXIMUM_PERCENTAGE),
-		min: getValue(element, "min", NAVIGATION_MINIMUM_PERCENTAGE),
-		now: {
-			current: .5,
-			previous: .5
-		}
-	};
-	const value = getContained(values.min, getValue(element, "size", values.now.current), values.max);
-	values.now.current = value;
-	values.now.previous = value;
-	return values;
-}
-function onEnd(reset) {
-	if (splitter == null) return;
-	splitter.handle.removeAttribute(ATTRIBUTE_ACTIVE);
-	splitter.separator.removeAttribute(ATTRIBUTE_ACTIVE);
-	if (reset) setSize(splitter, splitter.values.now.previous);
-	else splitter.values.now.previous = splitter.values.now.current;
-	splitter = void 0;
-	STYLING_TOGGLER.remove();
-}
-function onKeydown(event) {
-	switch (true) {
-		case KEYS_ALL.has(event.key):
-			onNavigate(event);
-			break;
-		case event.key === "Escape":
-			onEnd(true);
-			break;
-		default: break;
-	}
-}
-function onNavigate(event) {
-	const splitter = MAPPED_ELEMENTS.get(findAncestor(event, "[oui-splitter-separator]"));
-	if (splitter == null) return;
-	const { types, values } = splitter;
-	if (KEYS_ABSOLUTE.has(event.key)) {
-		setSize(splitter, event.key === "End" ? values.max : values.min, true);
-		return;
-	}
-	if (types.horizontal && !KEYS_HORIZONTAL.has(event.key) || !(types.horizontal || KEYS_VERTICAL.has(event.key))) return;
-	const offset = KEYS_NEGATIVE.has(event.key) ? -1 : 1;
-	setSize(splitter, getContained(values.min, values.now.current + offset * NAVIGATION_MODIFIER, values.max), true);
-}
-function onObservation(entries) {
-	if (frame != null) cancelAnimationFrame(frame);
-	frame = requestAnimationFrame(() => {
-		for (const entry of entries) {
-			const splitter = MAPPED_ELEMENTS.get(entry.target);
-			if (splitter == null) return;
-			splitter.types = getTypes(splitter, entry.contentRect.width, entry.contentRect.height);
-			if (splitter.types.horizontal) splitter.element.setAttribute(ATTRIBUTE_HORIZONTAL, "");
-			else splitter.element.removeAttribute(ATTRIBUTE_HORIZONTAL);
-			setAriaOrientation(splitter);
-		}
-		frame = void 0;
-	});
-}
-function onPointerdown(event) {
-	if (supportsTouch.value ? event.type === "mousedown" : event.type === "touchstart") return;
-	splitter = MAPPED_ELEMENTS.get(findAncestor(event, SELECTOR_HANDLE));
-	if (splitter == null) return;
-	if (supportsTouch.value) event.preventDefault();
-	splitter.handle.setAttribute(ATTRIBUTE_ACTIVE, "");
-	splitter.separator.setAttribute(ATTRIBUTE_ACTIVE, "");
-	splitter.rectangle = splitter.element.getBoundingClientRect();
-	STYLING_TOGGLER.set();
-}
-function onPointermove(event) {
-	if (splitter == null) return;
-	const position = getPosition(event);
-	if (position != null) {
-		splitter.values.now.current = getSize(splitter, splitter.types.horizontal ? position.y : position.x);
-		setSize(splitter, splitter.values.now.current);
-	}
-}
-function onPointerup() {
-	if (splitter != null) onEnd(false);
-}
-function setAriaOrientation(splitter) {
-	splitter.separator.setAttribute("aria-orientation", splitter.types.horizontal ? "horizontal" : "vertical");
-}
-function setAriaValue(splitter) {
-	splitter.separator.setAttribute("aria-valuemax", String(splitter.values.max));
-	splitter.separator.setAttribute("aria-valuemin", String(splitter.values.min));
-	splitter.separator.setAttribute("aria-valuenow", String(splitter.values.now.current));
-}
-function setSize(splitter, size, previous) {
-	splitter.values.now.current = size;
-	if (previous) splitter.values.now.previous = size;
-	splitter.element.style.setProperty("--oui-splitter-size", `${size}`);
-	setAriaValue(splitter);
-}
-const SELECTOR$1 = "oui-splitter";
-const ATTRIBUTE_ACTIVE = `${SELECTOR$1}-active`;
-const ATTRIBUTE_HANDLE = `${SELECTOR$1}-handle`;
-const ATTRIBUTE_HORIZONTAL = `${SELECTOR$1}-horizontal`;
-const ATTRIBUTE_SEPARATOR = `${SELECTOR$1}-separator`;
-const KEYS_ABSOLUTE = new Set(["End", "Home"]);
-const KEYS_HORIZONTAL = new Set(["ArrowDown", "ArrowUp"]);
-const KEYS_NEGATIVE = new Set(["ArrowLeft", "ArrowUp"]);
-const KEYS_VERTICAL = new Set(["ArrowLeft", "ArrowRight"]);
-const KEYS_ALL = new Set([
-	...KEYS_ABSOLUTE,
-	...KEYS_HORIZONTAL,
-	...KEYS_VERTICAL
-]);
-const MAPPED_ELEMENTS = /* @__PURE__ */ new WeakMap();
-const METHODS_CONNECT = ["delete", "set"];
-const METHODS_OBSERVE = ["unobserve", "observe"];
-const NAVIGATION_MAXIMUM_PERCENTAGE = .9;
-const NAVIGATION_MAXIMUM_TOTAL = 100;
-const NAVIGATION_MINIMUM_PERCENTAGE = .1;
-const NAVIGATION_MODIFIER = .05;
-const RESIZE_OBSERVER = new ResizeObserver(onObservation);
-const SELECTOR_HANDLE = `[${ATTRIBUTE_HANDLE}]`;
-const STYLING_TOGGLER = toggleStyles(document.body, {
-	touchAction: "none",
-	userSelect: "none",
-	webkitUserSelect: "none"
-});
-const VALUE_DECIMALS = 6;
-let frame;
-let splitter;
-customElements.define(SELECTOR$1, OuiSplitterElement);
-on(document, "keydown", onKeydown);
-on(document, "mousedown", onPointerdown);
-on(document, "pointermove", onPointermove);
-on(document, "pointerup", onPointerup);
-on(document, "touchcancel", onPointerup, { passive: false });
-on(document, "touchstart", onPointerdown, { passive: false });
-//#endregion
-//#region src/js/tooltip.ts
-var Tooltip = class {
-	elements;
-	floatable;
-	constructor(anchor, elements) {
-		const content = getContent();
-		this.elements = elements;
-		this.floatable = new Floatable({
-			anchor,
-			content,
-			defaultPosition: "above",
-			interactive: false,
-			positionAttribute: ATTRIBUTE_POSITION,
-			reusable: true,
-			onAfter: (active) => {
-				if (active) {
-					content.innerHTML = "";
-					content.append(...this.elements);
-				}
-				if (active || TOOLTIPS_ACTIVE.size > 0) return;
-				content.removeAttribute(ATTRIBUTE_CONTENT_ACTIVE);
-				contentTimer = setTimeout(() => {
-					content.innerHTML = "";
-					content.remove();
-				}, delayClose);
-			}
-		});
-	}
-	destroy() {
-		const { floatable } = this;
-		TOOLTIPS_ACTIVE.delete(this);
-		TOOLTIPS_PENDING.delete(this);
-		TOOLTIPS_ALL.delete(floatable.options.anchor);
-		TOOLTIPS_ALL.delete(floatable.options.content);
-		floatable.destroy();
-		this.elements = [];
-		this.floatable = void 0;
-	}
-};
-function addTooltip(anchor) {
-	if (TOOLTIPS_ALL.has(anchor)) return;
-	const elements = getElements(anchor);
-	if (elements != null) TOOLTIPS_ALL.set(anchor, new Tooltip(anchor, elements));
-}
-function closeTooltips(current) {
-	const pending = [...TOOLTIPS_PENDING];
-	for (const item of pending) {
-		if (item === current) continue;
-		TOOLTIPS_PENDING.delete(item);
-	}
-	const active = [...TOOLTIPS_ACTIVE];
-	for (const item of active) {
-		if (item === current) continue;
-		TOOLTIPS_ACTIVE.delete(item);
-		item.floatable.toggle(false);
-	}
-}
-function getElements(anchor) {
-	let elements = findElements(anchor.getAttribute(ARIA_LABELLEDBY));
-	if (elements.length > 0) return elements.map((element) => element.cloneNode(true));
-	elements = findElements(anchor.getAttribute(ARIA_DESCRIBEDBY));
-	if (elements.length > 0) return elements.map((element) => element.cloneNode(true));
-	let content = anchor.getAttribute(ARIA_LABEL);
-	if (isNullableOrWhitespace(content)) content = anchor.getAttribute(ARIA_DESCRIPTION);
-	if (isNullableOrWhitespace(content)) return;
-	const paragraph = document.createElement("p");
-	paragraph.textContent = content;
-	return [paragraph];
-}
-function findElements(attribute) {
-	const ids = attribute?.split(EXPRESSION_WHITESPACE) ?? [];
-	const elements = [];
-	for (const id of ids) {
-		if (isNullableOrWhitespace(id)) continue;
-		const element = document.querySelector(`#${id}`);
-		if (element instanceof HTMLElement) {
-			const cloned = element.cloneNode(true);
-			cloned.hidden = false;
-			elements.push(cloned);
-		}
-	}
-	return elements;
-}
-function getContent() {
-	if (contentElement != null) return contentElement;
-	contentElement = document.createElement("div");
-	contentElement.setAttribute(ATTRIBUTE_CONTENT, "");
-	contentElement.role = "tooltip";
-	contentElement.tabIndex = -1;
-	return contentElement;
-}
-function onActivate(event) {
-	onToggle(event, true);
-}
-function onChange() {
-	if (TOOLTIPS_ACTIVE.size === 0) return;
-}
-function onClick(event) {
-	if (findAncestor(event, SELECTOR_CONTENT) != null) event.stopPropagation();
-}
-function onDeactivate(event) {
-	onToggle(event, false);
-}
-function onToggle(event, activate) {
-	if (toggle != null) cancelAnimationFrame(toggle);
-	if (findAncestor(event, SELECTOR_CONTENT) != null) {
-		if (contentTimer != null) clearTimeout(contentTimer);
-		return;
-	}
-	toggle = requestAnimationFrame(() => {
-		toggle = void 0;
-		const element = findAncestor(event, SELECTOR);
-		const tooltip = TOOLTIPS_ALL.get(element);
-		if (TOOLTIPS_ACTIVE.size > 0 || TOOLTIPS_PENDING.size > 0) closeTooltips(tooltip);
-		if (tooltip == null || tooltip.floatable.active === activate) return;
-		if (activate) {
-			clearTimeout(contentTimer);
-			TOOLTIPS_PENDING.add(tooltip);
-			contentTimer = setTimeout(() => {
-				TOOLTIPS_ACTIVE.add(tooltip);
-				TOOLTIPS_PENDING.delete(tooltip);
-				tooltip.floatable.options.content.style.positionAnchor = tooltip.floatable.options.anchor.style.anchorName;
-				tooltip.floatable.toggle(true);
-				setTimeout(() => {
-					tooltip.floatable.options.content.setAttribute(ATTRIBUTE_CONTENT_ACTIVE, "");
-				});
-			}, delayOpen);
-			return;
-		}
-		TOOLTIPS_ACTIVE.delete(tooltip);
-		tooltip.floatable.toggle(false);
-	});
-}
-function removeTooltip(element) {
-	if (!element.hasAttribute(ATTRIBUTE_CONTENT)) TOOLTIPS_ALL.get(element)?.destroy();
-}
-function setTooltipDelay(open, close) {
-	delayClose = typeof close === "number" && close >= 0 ? close : delayClose;
-	delayOpen = typeof open === "number" && open >= 0 ? open : delayOpen;
-}
-const ARIA_DESCRIBEDBY = "aria-describedby";
-const ARIA_DESCRIPTION = "aria-description";
-const ARIA_LABEL = "aria-label";
-const ARIA_LABELLEDBY = "aria-labelledby";
-const ATTRIBUTE = "oui-tooltip";
-const ATTRIBUTE_CONTENT = `${ATTRIBUTE}-content`;
-const ATTRIBUTE_CONTENT_ACTIVE = `${ATTRIBUTE_CONTENT}-active`;
-const ATTRIBUTE_POSITION = `${ATTRIBUTE}-position`;
-const SELECTOR = `[${ATTRIBUTE}]`;
-const SELECTOR_CONTENT = `[${ATTRIBUTE_CONTENT}]`;
-const EXPRESSION_WHITESPACE = /\s+/;
-const TOOLTIPS_ACTIVE = /* @__PURE__ */ new Set();
-const TOOLTIPS_ALL = /* @__PURE__ */ new WeakMap();
-const TOOLTIPS_PENDING = /* @__PURE__ */ new Set();
-let contentElement;
-let contentTimer;
-let delayClose = 250;
-let delayOpen = 500;
-let toggle;
-attributable(ATTRIBUTE, addTooltip, removeTooltip);
-on(document, "click", onClick, { capture: true });
-on(document, "focusin", onActivate);
-on(document, "focusout", onDeactivate);
-on(document, "mousemove", onActivate);
-on(window, "resize", onChange);
-on(document, "scroll", onChange);
-on(document, "touchstart", onActivate);
-//#endregion
+import "./focus-trap/standalone.mjs";
+import "./movable.mjs";
+import { OuiPopoverElement } from "./popover.mjs";
+import "./sortable.mjs";
+import { OuiSplitterElement } from "./splitter.mjs";
+import { setTooltipDelay } from "./tooltip.mjs";
 export { OuiPopoverElement, OuiSplitterElement, setTooltipDelay };