@oscarpalmer/oui 0.26.1 → 0.28.0

package/dist/js/resizable/resizable.embedded.mjs

@@ -0,0 +1,186 @@
+import { attributable } from "../internal/attributable.mjs";
+import { getPosition, on } from "@oscarpalmer/toretto/event";
+import { isPlainObject } from "@oscarpalmer/atoms/is";
+import { isHTMLOrSVGElement } from "@oscarpalmer/toretto/is";
+import { getNumber } from "@oscarpalmer/atoms/number";
+import { findAncestor } from "@oscarpalmer/toretto/find";
+import { toggleStyles } from "@oscarpalmer/toretto/style";
+import supportsTouch from "@oscarpalmer/toretto/touch";
+//#region src/js/resizable/resizable.embedded.ts
+var OuiResizable = class {
+	#state;
+	constructor(state) {
+		this.#state = state;
+	}
+	destroy() {
+		destroyResizable(this.#state);
+	}
+	set() {
+		const [width, height] = getAndSetDimensions(this.#state.element, this.#state.options);
+		console.log("set", width, height);
+		this.#state.width = width;
+		this.#state.height = height;
+	}
+	reset() {
+		this.#state.element.style.height = "";
+		this.#state.element.style.width = "";
+	}
+};
+function addResizable(element, options) {
+	let item = items.get(element);
+	if (item == null) {
+		const handle = element.querySelector(SELECTOR_HANDLE_SCOPED);
+		if (!isHTMLOrSVGElement(handle)) return;
+		const state = getState(element, handle, options);
+		item = {
+			instance: new OuiResizable(state),
+			state
+		};
+		items.set(element, item);
+	}
+	return item?.instance;
+}
+/**
+* Creates _(or retrieves)_ a _OuiResizable_ instance for an element
+*
+* @param element Element to make resizable
+* @returns _OuiResizable_ instance
+*/
+function createResizable(element, options) {
+	if (!isHTMLOrSVGElement(element)) throw new TypeError(MESSAGE_ELEMENT);
+	if (!isHTMLOrSVGElement(element.querySelector(SELECTOR_HANDLE_SCOPED))) throw new Error(MESSAGE_HANDLE);
+	return addResizable(element, options ?? {});
+}
+function destroyResizable(state) {
+	state.element = void 0;
+	state.handle = void 0;
+}
+function getAndSetDimensions(element, options, input) {
+	let { height, width } = input ?? element.getBoundingClientRect();
+	if (options.maximumWidth > -1 && width > options.maximumWidth) width = options.maximumWidth;
+	else if (options.minimumWidth > -1 && width < options.minimumWidth) width = options.minimumWidth;
+	if (options.maximumHeight > -1 && height > options.maximumHeight) height = options.maximumHeight;
+	else if (options.minimumHeight > -1 && height < options.minimumHeight) height = options.minimumHeight;
+	if (element.checkVisibility()) {
+		element.style.height = `${height}px`;
+		element.style.width = `${width}px`;
+	}
+	return [width, height];
+}
+function getProperties(element, widthProperty, heightProperty) {
+	const computed = getComputedStyle(element);
+	return [computed[widthProperty], computed[heightProperty]];
+}
+function getRestrictions(maximum, minimum) {
+	const [maximumWidth, maximumHeight] = getXAndY.apply(null, typeof maximum === "string" ? [maximum] : maximum);
+	const [minimumWidth, minimumHeight] = getXAndY.apply(null, typeof minimum === "string" ? [minimum] : minimum);
+	if (maximumWidth > -1 && minimumWidth > -1 && maximumWidth <= minimumWidth) throw new Error(MESSAGE_WIDTH);
+	if (maximumHeight > -1 && minimumHeight > -1 && maximumHeight <= minimumHeight) throw new Error(MESSAGE_HEIGHT);
+	return {
+		maximumHeight,
+		maximumWidth,
+		minimumHeight,
+		minimumWidth
+	};
+}
+function getState(element, handle, input) {
+	element.setAttribute(RESIZABLE_ATTRIBUTE, "");
+	const options = getValidOptions(element, input);
+	const [width, height] = getAndSetDimensions(element, options);
+	return {
+		element,
+		handle,
+		height,
+		options,
+		width,
+		styles: toggleStyles(element, styles)
+	};
+}
+function getValidOptions(element, input) {
+	const original = isPlainObject(input) ? input : {};
+	return { ...getRestrictions(input == null ? element.getAttribute(ATTRIBUTE_MAXIMUM) ?? getProperties(element, "maxWidth", "maxHeight") : [original.maximumWidth, original.maximumHeight], input == null ? element.getAttribute(ATTRIBUTE_MINIMUM) ?? getProperties(element, "minWidth", "minHeight") : [original.minimumWidth, original.minimumHeight]) };
+}
+function getXAndY(first, second) {
+	const [x, y] = typeof first === "string" && second == null ? first.split(",") : [first, second];
+	let xAsNumber = typeof x === "string" ? Number.parseFloat(x) : getNumber(x);
+	let yAsNumber = typeof y === "string" ? Number.parseFloat(y) : getNumber(y);
+	if (Number.isNaN(xAsNumber) || xAsNumber <= 0) xAsNumber = -1;
+	if (Number.isNaN(yAsNumber) || yAsNumber <= 0) yAsNumber = -1;
+	return [xAsNumber, yAsNumber];
+}
+function onKeydown(event) {
+	if (current == null || event.key !== "Escape") return;
+	current.state.element.style.height = `${current.state.height}px`;
+	current.state.element.style.width = `${current.state.width}px`;
+	resetResizable();
+}
+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 handle = findAncestor(event, SELECTOR_HANDLE);
+	const element = handle && findAncestor(handle, SELECTOR);
+	const stored = element && items.get(element);
+	const position = getPosition(event);
+	if (stored == null || position == null) return;
+	if (supportsTouch.value) event.preventDefault();
+	current = stored;
+	start = position;
+	current.state.styles.set();
+	styleToggler.set();
+}
+function onPointermove(event) {
+	if (current == null) return;
+	const { x, y } = getPosition(event) ?? {};
+	if (x == null || y == null) return;
+	const width = current.state.width + (x - (start?.x ?? 0));
+	const height = current.state.height + (y - (start?.y ?? 0));
+	getAndSetDimensions(current.state.element, current.state.options, {
+		height,
+		width
+	});
+}
+function onPointerup() {
+	if (current == null) return;
+	const { height, width } = current.state.element.getBoundingClientRect();
+	current.state.height = height;
+	current.state.width = width;
+	resetResizable();
+}
+function removeResizable(element) {
+	items.get(element)?.instance.destroy();
+	items.delete(element);
+}
+function resetResizable() {
+	current?.state.styles.remove();
+	styleToggler.remove();
+	current = void 0;
+	start = void 0;
+}
+const RESIZABLE_ATTRIBUTE = "oui-resizable";
+const RESIZABLE_ATTRIBUTE_HANDLE = `${RESIZABLE_ATTRIBUTE}-handle`;
+const ATTRIBUTE_MAXIMUM = `${RESIZABLE_ATTRIBUTE}-maximum`;
+const ATTRIBUTE_MINIMUM = `${RESIZABLE_ATTRIBUTE}-minimum`;
+const MESSAGE_ELEMENT = "The element must be an instance of HTMLElement or SVGElement";
+const MESSAGE_HEIGHT = "The maximum height must be greater than the minimum height";
+const MESSAGE_HANDLE = `The element must contain a child with the attribute "${RESIZABLE_ATTRIBUTE_HANDLE}"`;
+const MESSAGE_WIDTH = "The maximum width must be greater than the minimum width";
+const SELECTOR = `[${RESIZABLE_ATTRIBUTE}]`;
+const SELECTOR_HANDLE = `[${RESIZABLE_ATTRIBUTE_HANDLE}]`;
+const SELECTOR_HANDLE_SCOPED = `:scope > ${SELECTOR_HANDLE}`;
+const items = /* @__PURE__ */ new WeakMap();
+const styles = {
+	touchAction: "none",
+	userSelect: "none",
+	webkitUserSelect: "none"
+};
+const styleToggler = toggleStyles(document.body, styles);
+let current;
+let start;
+on(document, "keydown", onKeydown);
+on(document, "mousedown", onPointerdown);
+on(document, "pointermove", onPointermove);
+on(document, "pointerup", onPointerup);
+on(document, "touchcancel", onPointerup);
+on(document, "touchstart", onPointerdown, { passive: false });
+attributable(RESIZABLE_ATTRIBUTE, addResizable, removeResizable);
+//#endregion
+export { OuiResizable, RESIZABLE_ATTRIBUTE, RESIZABLE_ATTRIBUTE_HANDLE, createResizable };

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

@@ -0,0 +1,2 @@
+import { a as createResizable, n as OuiResizable, t as CreateOuiResizableOptions } from "../resizable.embedded-CXrUVPzR.mjs";
+export { type CreateOuiResizableOptions, type OuiResizable, createResizable as createOuiResizable };

package/dist/js/resizable/resizable.standalone.mjs

@@ -0,0 +1,2 @@
+import { createResizable } from "./resizable.embedded.mjs";
+export { createResizable as createOuiResizable };

package/dist/js/resizable.embedded-CXrUVPzR.d.mts

@@ -0,0 +1,35 @@
+import { StyleToggler } from "@oscarpalmer/toretto/style";
+
+//#region src/js/resizable/resizable.embedded.d.ts
+type CreateOuiResizableOptions = {
+  maximumHeight?: number;
+  maximumWidth?: number;
+  minimumHeight?: number;
+  minimumWidth?: number;
+};
+declare class OuiResizable {
+  #private;
+  constructor(state: OuiResizableState);
+  destroy(): void;
+  set(): void;
+  reset(): void;
+}
+type OuiResizableState = {
+  element: HTMLElement;
+  handle: HTMLElement;
+  height: number;
+  options: Required<CreateOuiResizableOptions>;
+  styles: StyleToggler;
+  width: number;
+};
+/**
+ * Creates _(or retrieves)_ a _OuiResizable_ instance for an element
+ *
+ * @param element Element to make resizable
+ * @returns _OuiResizable_ instance
+ */
+declare function createResizable(element: HTMLElement, options?: CreateOuiResizableOptions): OuiResizable;
+declare const RESIZABLE_ATTRIBUTE = "oui-resizable";
+declare const RESIZABLE_ATTRIBUTE_HANDLE = "oui-resizable-handle";
+//#endregion
+export { createResizable as a, RESIZABLE_ATTRIBUTE_HANDLE as i, OuiResizable as n, RESIZABLE_ATTRIBUTE as r, CreateOuiResizableOptions as t };

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

@@ -0,0 +1,2 @@
+import { d as OuiSortable, f as createSortable } from "../draggable-zszaW1qS.mjs";
+export { OuiSortable, createSortable };

package/dist/js/{sortable.mjs → sortable/sortable.embedded.mjs}

@@ -1,18 +1,13 @@
-import { attributable } from "./internal/attributable.mjs";
-import { OuiDraggable, addDraggable, removeDraggable } from "./internal/draggable.mjs";
+import { attributable } from "../internal/attributable.mjs";
+import { OuiDraggable, addDraggable, getDraggableStates, removeDraggable } from "../internal/draggable.mjs";
 import { getPosition } from "@oscarpalmer/toretto/event";
 import { isHTMLOrSVGElement } from "@oscarpalmer/toretto/is";
 import { findAncestor, getElementFromPosition } from "@oscarpalmer/toretto/find";
 import { createElement } from "@oscarpalmer/toretto/create";
-//#region src/js/sortable.ts
+//#region src/js/sortable/sortable.embedded.ts
 var OuiSortable = class extends OuiDraggable {
-	connections;
-	origin;
-	get dragged() {
-		return getDragPlaceholder();
-	}
-	constructor(element) {
-		super("sort", element, {
+	constructor(element, options) {
+		super("sortable", "sort", ATTRIBUTE, element, {
 			container: {
 				attribute: ATTRIBUTE_CONTAINER,
 				map: CONTAINERS
@@ -24,17 +19,19 @@ var OuiSortable = class extends OuiDraggable {
 				onEnd,
 				onMove
 			},
+			input: options,
 			position: {
 				getOffset: getOffsetPosition,
 				getOriginal: getOriginalPosition
-			}
-		});
-		this.connections = this.element.getAttribute(ATTRIBUTE_CONNECTIONS);
+			},
+			getDragged: getDragPlaceholder,
+			getOrigin: () => (getDraggableStates(element)?.sortable)?.origin
+		}, { connections: element.getAttribute(ATTRIBUTE_CONNECTIONS) });
 	}
 };
 function afterEnd(insert, from, events, elements, position, valid) {
 	elements.origin?.removeAttribute(ATTRIBUTE_ORIGIN);
-	from.origin = void 0;
+	from.state.origin = void 0;
 	resetPlaceholders();
 	if (!valid || events.some((event) => event.defaultPrevented)) return;
 	if (insert !== "insert") {
@@ -49,44 +46,50 @@ function afterEnd(insert, from, events, elements, position, valid) {
 	elements.target?.insertAdjacentElement(insertion, elements.origin);
 	document.body.removeAttribute(ATTRIBUTE_ACTIVE);
 }
+/**
+* Creates _(or retrieves)_ a _OuiSortable_ instance for an element
+*
+* @param element Element to make sortable
+* @returns _OuiSortable_ instance
+*/
+function createSortable(element, options) {
+	if (!isHTMLOrSVGElement(element)) throw new TypeError(MESSAGE);
+	return addSortable(element, options);
+}
 function getDragPlaceholder() {
 	placeholder.drag.default ??= createElement("div");
 	return placeholder.drag.custom ?? placeholder.drag.default;
 }
-function getOffsetPosition(_, draggable, element, position) {
+function getOffsetPosition(_, item, element, position) {
 	const rectangle = element.getBoundingClientRect();
 	return {
-		x: draggable.horizontal ? 0 : position.x - rectangle.left,
-		y: draggable.vertical ? 0 : position.y - rectangle.top
+		x: item.state.horizontal ? 0 : position.x - rectangle.left,
+		y: item.state.vertical ? 0 : position.y - rectangle.top
 	};
 }
 function getOriginalPosition(_, __, position) {
 	return position;
 }
-function getPositionPlaceholder(sortable) {
+function getPositionPlaceholder(item) {
 	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`);
+	if (item.state.origin != null) placeholder.position.style.setProperty("--placeholder-height", `${item.state.origin.getBoundingClientRect().height}px`);
 	return placeholder.position;
 }
-function onBegin(_, state, draggable, element) {
-	const sortable = draggable;
-	sortable.origin = element;
-	setPlaceholder(state, sortable, element);
+function onBegin(_, globals, item, element) {
+	item.state.origin = element;
+	setPlaceholder(globals, item, element);
 	element.setAttribute(ATTRIBUTE_ORIGIN, "");
 	document.body.setAttribute(ATTRIBUTE_ACTIVE, "");
 }
-function onCancel(_, draggable) {
-	const sortable = draggable;
-	const { origin } = sortable;
-	origin?.removeAttribute(ATTRIBUTE_ORIGIN);
+function onCancel(_, item) {
+	item.state.origin?.removeAttribute(ATTRIBUTE_ORIGIN);
 	document.body.removeAttribute(ATTRIBUTE_ACTIVE);
 	resetPlaceholders();
-	sortable.origin = void 0;
+	item.state.origin = void 0;
 }
-function onEnd(event, state, draggable, reset) {
-	const from = draggable;
-	const { origin } = from;
+function onEnd(event, globals, item, reset) {
+	const { origin } = item.state;
 	const position = getPosition(event) ?? {
 		x: 0,
 		y: 0
@@ -96,18 +99,26 @@ function onEnd(event, state, draggable, reset) {
 	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;
+	let toInstance;
+	let toState;
 	if (element == null) {
 		element = findAncestor(target, SELECTOR);
-		to = state.instances.get(element)?.sortable;
+		toInstance = globals.instances.get(element)?.sortable;
+		toState = globals.states.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);
+	} else {
+		toInstance = globals.instances.get(element.parentElement)?.sortable;
+		toState = globals.states.get(element.parentElement)?.sortable;
+	}
+	const valid = insert != null && validatePosition(globals, item, {
+		instance: toInstance,
+		state: toState
+	}, position);
 	const options = {
 		detail: valid ? {
 			from: {
 				element: origin,
-				position: { ...state.original }
+				position: { ...globals.original }
 			},
 			to: {
 				element,
@@ -119,25 +130,34 @@ function onEnd(event, state, draggable, reset) {
 	};
 	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);
+	item.instance.element.dispatchEvent(fromEvent);
+	if (item.instance !== toInstance) toInstance?.element.dispatchEvent(toEvent);
 	setTimeout(() => {
-		afterEnd(insert, from, [fromEvent, toEvent], {
+		afterEnd(insert, item, [fromEvent, toEvent], {
 			origin,
 			target: element
 		}, position, valid);
 		reset();
 	});
 }
-function onMove(event, state, draggable, position) {
-	const from = draggable;
-	const fromElement = from.origin;
+function onMove(event, globals, item, position) {
+	const fromElement = item.state.origin;
 	const toElement = findAncestor(event, SELECTOR_ITEM);
-	let to;
-	if (toElement == null) to = state.instances.get(findAncestor(event, SELECTOR))?.sortable;
-	else to = state.instances.get(toElement.parentElement)?.sortable;
-	if (!validatePosition(state, from, to, position.original)) return;
-	const placeholder = getPositionPlaceholder(from);
+	let toInstance;
+	let toState;
+	if (toElement == null) {
+		const element = findAncestor(event, SELECTOR);
+		toInstance = globals.instances.get(element)?.sortable;
+		toState = globals.states.get(element)?.sortable;
+	} else {
+		toInstance = globals.instances.get(toElement.parentElement)?.sortable;
+		toState = globals.states.get(toElement.parentElement)?.sortable;
+	}
+	if (toInstance == null || !validatePosition(globals, item, {
+		instance: toInstance,
+		state: toState
+	}, position.original)) return;
+	const placeholder = getPositionPlaceholder(item);
 	if (toElement != null && toElement !== fromElement) {
 		const { height, top } = toElement.getBoundingClientRect();
 		let place;
@@ -153,7 +173,7 @@ function onMove(event, state, draggable, position) {
 	return {
 		from: {
 			element: fromElement,
-			position: { ...state.original }
+			position: { ...globals.original }
 		},
 		to: {
 			element: toElement,
@@ -167,21 +187,21 @@ function resetPlaceholders() {
 	placeholder.position?.remove();
 	placeholder.drag.custom = void 0;
 }
-function setPlaceholder(state, sortable, origin) {
+function setPlaceholder(state, item, origin) {
 	const element = getDragPlaceholder();
 	placeholder.drag.default.innerHTML = "";
-	updatePlaceholder(sortable, element);
+	updatePlaceholder(item, element);
 	const event = new CustomEvent(EVENT_PLACEHOLDER, {
 		cancelable: true,
 		detail: {
 			origin,
-			parent: sortable.element,
+			parent: item.state.element,
 			placeholder: element,
 			create: (value) => {
 				if (!isHTMLOrSVGElement(value)) return;
 				const element = value;
 				placeholder.drag.custom = element;
-				updatePlaceholder(sortable, element);
+				updatePlaceholder(item, element);
 				state.element = {
 					rectangle: element.getBoundingClientRect(),
 					node: element
@@ -189,27 +209,30 @@ function setPlaceholder(state, sortable, origin) {
 			}
 		}
 	});
-	sortable.element.dispatchEvent(event);
+	item.instance.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) {
+function updatePlaceholder(item, element) {
 	element.style.position = "fixed";
 	element.setAttribute(ATTRIBUTE_PLACEHOLDER_DRAG, "");
-	if (sortable.horizontal) element.setAttribute(ATTRIBUTE_HORIZONTAL, "");
+	const state = getDraggableStates(item.state.element)?.sortable;
+	if (state == null) return;
+	if (state.horizontal) element.setAttribute(ATTRIBUTE_HORIZONTAL, "");
 	else element.removeAttribute(ATTRIBUTE_HORIZONTAL);
-	if (sortable.vertical) element.setAttribute(ATTRIBUTE_VERTICAL, "");
+	if (state.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);
+	const rectangle = from.state.origin?.getBoundingClientRect();
+	const fromState = getDraggableStates(from.state.element)?.sortable;
+	if (rectangle != null && !(fromState?.horizontal ?? true)) valid = position.x >= rectangle.left && position.x <= rectangle.right;
+	if (valid && rectangle != null && !(fromState?.vertical ?? true)) valid = position.y >= rectangle.top && position.y <= rectangle.bottom;
+	if (valid && from.state.connections != null) valid = to?.state.element.matches(from.state.connections) ?? true;
+	if (valid && to?.state.connections != null) valid = from.state.element.matches(to.state.connections);
 	return valid;
 }
 const ATTRIBUTE = "oui-sortable";
@@ -227,6 +250,7 @@ const EVENT_END = "sort:end";
 const EVENT_PLACEHOLDER = "sort:placeholder";
 const INSERT_AFTER = "afterend";
 const INSERT_BEFORE = "beforebegin";
+const MESSAGE = "The element must be an instance of HTMLElement or SVGElement";
 const SELECTOR = `[${ATTRIBUTE}]`;
 const SELECTOR_ITEM = `[${ATTRIBUTE}] > *`;
 const bound = {
@@ -240,6 +264,7 @@ const placeholder = {
 	},
 	position: void 0
 };
-attributable(ATTRIBUTE, addDraggable.bind(bound), removeDraggable.bind(bound));
+const addSortable = addDraggable.bind(bound);
+attributable(ATTRIBUTE, addSortable, removeDraggable.bind(bound));
 //#endregion
-export { OuiSortable };
+export { OuiSortable, createSortable };

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

@@ -0,0 +1,2 @@
+import { d as OuiSortable, f as createSortable, t as CreateOuiDraggableOptions } from "../draggable-zszaW1qS.mjs";
+export { type CreateOuiDraggableOptions as CreateOuiSortableOptions, type OuiSortable, createSortable };

package/dist/js/sortable/sortable.standalone.mjs

@@ -0,0 +1,2 @@
+import { createSortable } from "./sortable.embedded.mjs";
+export { createSortable };

package/dist/js/splitter.mjs

@@ -282,11 +282,11 @@ const ATTRIBUTE_ACTIVE = `${SELECTOR}-active`;
 const ATTRIBUTE_HANDLE = `${SELECTOR}-handle`;
 const ATTRIBUTE_HORIZONTAL = `${SELECTOR}-horizontal`;
 const ATTRIBUTE_SEPARATOR = `${SELECTOR}-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([
+const KEYS_ABSOLUTE = /* @__PURE__ */ new Set(["End", "Home"]);
+const KEYS_HORIZONTAL = /* @__PURE__ */ new Set(["ArrowDown", "ArrowUp"]);
+const KEYS_NEGATIVE = /* @__PURE__ */ new Set(["ArrowLeft", "ArrowUp"]);
+const KEYS_VERTICAL = /* @__PURE__ */ new Set(["ArrowLeft", "ArrowRight"]);
+const KEYS_ALL = /* @__PURE__ */ new Set([
 	...KEYS_ABSOLUTE,
 	...KEYS_HORIZONTAL,
 	...KEYS_VERTICAL
@@ -315,7 +315,7 @@ on(document, "keydown", onKeydown);
 on(document, "mousedown", onPointerdown);
 on(document, "pointermove", onPointermove);
 on(document, "pointerup", onPointerup);
-on(document, "touchcancel", onPointerup, { passive: false });
+on(document, "touchcancel", onPointerup);
 on(document, "touchstart", onPointerdown, { passive: false });
 //#endregion
 export { OuiSplitterElement };

package/dist/js/toolbar.mjs

@@ -88,17 +88,17 @@ const KEY_ARROW_DOWN = "ArrowDown";
 const KEY_ARROW_RIGHT = "ArrowRight";
 const KEY_END = "End";
 const KEY_HOME = "Home";
-const KEYS_ABSOLUTE = new Set([KEY_END, KEY_HOME]);
-const KEYS_HORIZONTAL = new Set([KEY_ARROW_RIGHT, "ArrowLeft"]);
-const KEYS_VERTICAL = new Set([KEY_ARROW_DOWN, "ArrowUp"]);
-const KEYS_ALL = new Set([
+const KEYS_ABSOLUTE = /* @__PURE__ */ new Set([KEY_END, KEY_HOME]);
+const KEYS_HORIZONTAL = /* @__PURE__ */ new Set([KEY_ARROW_RIGHT, "ArrowLeft"]);
+const KEYS_VERTICAL = /* @__PURE__ */ new Set([KEY_ARROW_DOWN, "ArrowUp"]);
+const KEYS_ALL = /* @__PURE__ */ new Set([
 	...KEYS_ABSOLUTE,
 	...KEYS_HORIZONTAL,
 	...KEYS_VERTICAL
 ]);
-const KEYS_NEXT = new Set([KEY_ARROW_DOWN, KEY_ARROW_RIGHT]);
+const KEYS_NEXT = /* @__PURE__ */ new Set([KEY_ARROW_DOWN, KEY_ARROW_RIGHT]);
 const ORIENTATION_HORIZONTAL = "horizontal";
-const ORIENTATIONS = new Set([ORIENTATION_HORIZONTAL, "vertical"]);
+const ORIENTATIONS = /* @__PURE__ */ new Set([ORIENTATION_HORIZONTAL, "vertical"]);
 const PROPERTY_DISABLED = "disabled";
 const SELECTOR = `[${ATTRIBUTE}-item]`;
 const instances = /* @__PURE__ */ new WeakMap();

package/dist/js/tooltip.d.mts

@@ -1,4 +1,4 @@
-import { n as OuiFloatable } from "./embedded-CSOh5njI.mjs";
+import { i as OuiFloatable } from "./floatable.embedded-YxGwzgbE.mjs";
 
 //#region src/js/tooltip.d.ts
 declare class OuiTooltip {
@@ -23,7 +23,7 @@ declare class OuiTooltip {
 }
 type OuiTooltipState = {
   anchor: HTMLElement;
-  content: HTMLElement;
+  elements: HTMLElement[];
   floatable: OuiFloatable;
   timer?: number;
   tooltip: OuiTooltip;