@oscarpalmer/oui 0.18.0 → 0.19.0

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

@@ -1,25 +1,16 @@
 function isNumber(value) {
 	return typeof value === "number" && !Number.isNaN(value);
 }
-
 function clamp(value, minimum, maximum, loop) {
 	if (![
 		value,
 		minimum,
 		maximum
 	].every(isNumber)) return NaN;
-	if (value < minimum) return maximum ;
-	return value > maximum ? minimum  : value;
+	if (value < minimum) return loop === true ? maximum : minimum;
+	return value > maximum ? loop === true ? minimum : maximum : value;
 }
-
-function isEventTarget(value) {
-	return typeof value === "object" && value != null && typeof value.addEventListener === "function" && typeof value.removeEventListener === "function" && typeof value.dispatchEvent === "function";
-}
-
-function getBoolean(value, defaultValue) {
-	return typeof value === "boolean" ? value : defaultValue ?? false;
-}
-
+function noop() {}
 function calculate() {
 	return new Promise((resolve) => {
 		const values = [];
@@ -27,37 +18,122 @@ function calculate() {
 		function step(now) {
 			if (last != null) values.push(now - last);
 			last = now;
-			if (values.length >= CALCULATION_TOTAL) {
-				const median = values.sort().slice(2, -2).reduce((first, second) => first + second, 0) / (values.length - CALCULATION_TRIM);
-				resolve(median);
-			} else requestAnimationFrame(step);
+			if (values.length >= TOTAL) resolve(values.sort().slice(TRIM_PART, -TRIM_PART).reduce((first, second) => first + second, 0) / (values.length - TRIM_TOTAL));
+			else requestAnimationFrame(step);
 		}
 		requestAnimationFrame(step);
 	});
 }
-function noop() {}
-var CALCULATION_TOTAL = 10;
-var CALCULATION_TRIM = 4;
-calculate().then((value) => {
-});
-
+var TOTAL = 10;
+var TRIM_PART = 2;
+var TRIM_TOTAL = 4;
+await calculate();
+function getBoolean(value, defaultValue) {
+	return typeof value === "boolean" ? value : defaultValue ?? false;
+}
+function isEventTarget(value) {
+	return typeof value === "object" && value != null && typeof value.addEventListener === "function" && typeof value.removeEventListener === "function" && typeof value.dispatchEvent === "function";
+}
+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 target = items[0];
+	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 (event.cancelBubble) 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;
+}
+var DELEGATED = /* @__PURE__ */ new Set();
+var EVENT_PREFIX = "@";
+var EVENT_SUFFIX_ACTIVE = ":active";
+var EVENT_SUFFIX_PASSIVE = ":passive";
+var 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"
+]);
+var HANDLER_ACTIVE = delegatedEventHandler.bind(false);
+var HANDLER_PASSIVE = delegatedEventHandler.bind(true);
 function createEventOptions(options) {
 	return {
 		capture: getBoolean(options?.capture),
 		once: getBoolean(options?.once),
 		passive: getBoolean(options?.passive, true),
-		signal: options?.signal
+		signal: options?.signal instanceof AbortSignal ? options.signal : 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);
 	};
 }
-
 function findAncestor(origin, selector) {
 	if (!(origin instanceof Element) || selector == null) return null;
 	if (typeof selector === "string") {
@@ -73,26 +149,42 @@ function findAncestor(origin, selector) {
 	}
 	return parent;
 }
-
 function getFocusable(parent) {
-	return getValidElements(parent, FILTERS_FOCUSABLE);
+	return getValidElements(parent, FILTERS_FOCUSABLE, false);
 }
 function getItem(element, tabbable) {
 	return {
 		element,
-		tabIndex: TABINDEX_DEFAULT
+		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]);
+		const item = getItem(elements[index], tabbable);
 		if (!filters.some((filter) => filter(item))) items.push(item);
 	}
-	return items.map((item) => item.element);
+	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(item) {
 	if (EXPRESSION_DISABLEABLE.test(item.element.tagName) && isDisabledFromFieldset(item.element)) return true;
@@ -114,6 +206,9 @@ function isDisabledFromFieldset(element) {
 	}
 	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;
@@ -124,13 +219,18 @@ function isHidden(item) {
 }
 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});
+		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));
 }
+var ATTRIBUTE_CONTENTEDITABLE = "contenteditable";
 var ATTRIBUTE_INERT = "inert";
+var ATTRIBUTE_TABINDEX = "tabindex";
 var EXPRESSION_DISABLEABLE = /^(button|input|select|textarea)$/i;
+var EXPRESSION_SPECIAL_TABINDEX = /^(audio|details|video)$/i;
 var EXPRESSION_SUMMARY = /^summary$/i;
 var EXPRESSION_TRUEISH = /^(|true)$/i;
 var FILTERS_FOCUSABLE = [
@@ -139,6 +239,7 @@ var FILTERS_FOCUSABLE = [
 	isHidden,
 	isSummarised
 ];
+[...FILTERS_FOCUSABLE];
 var SELECTOR_DETAILS_CLOSED_CHILDREN = "details:not([open]) *";
 var SELECTOR_FIELDSET_DISABLED = "fieldset[disabled] *";
 var SELECTOR_SUMMARY_FIRST = "details > summary:first-of-type";
@@ -157,195 +258,151 @@ var SELECTOR_FULL = [
 ].map((selector) => `${selector}:not([inert])`).join(",");
 var STYLE_HIDDEN = "hidden";
 var STYLE_NONE = "none";
+var TABINDEX_BASE = 0;
 var TABINDEX_DEFAULT = -1;
-
-class FocusTrap {
-    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 = undefined;
-    }
-    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);
-    }
-}
-//
+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;
+	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.target, 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();
+	let element = findAncestor(event.target, 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) {
-    const focusTrap = FOCUSTRAPS_ALL.get(findAncestor(event.target, ATTRIBUTE_SELECTOR));
-    lastTarget = focusTrap == null ? undefined : event.target;
+	lastTarget = FOCUSTRAPS_ALL.get(findAncestor(event.target, ATTRIBUTE_SELECTOR)) == null ? void 0 : event.target;
 }
 function onKeydown(event) {
-    switch (event.key) {
-        case 'Escape':
-            onEscape(event);
-            break;
-        case 'Tab':
-            onTab(event);
-            break;
-        default:
-            return;
-    }
+	switch (event.key) {
+		case "Escape":
+			onEscape(event);
+			break;
+		case "Tab":
+			onTab(event);
+			break;
+		default: return;
+	}
 }
 function onPointerdown(event) {
-    const lastFocusTrap = findAncestor(lastTarget, ATTRIBUTE_SELECTOR);
-    const nextFocusTrap = findAncestor(event.target, 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();
-        }
-    }
+	const lastFocusTrap = findAncestor(lastTarget, ATTRIBUTE_SELECTOR);
+	const nextFocusTrap = findAncestor(event.target, 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.target, 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);
-    }
+	const element = findAncestor(event.target, 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;
+	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);
-    }
+	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);
-    if (focusTrap.disabled) {
-        if ((index === length - 1 && next === 0) ||
-            (index === 0 && next === length - 1)) {
-            lastTarget = undefined;
-            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];
-    }
+	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 = undefined;
-        focusTrap.enable();
-    }
-    else {
-        const next = elements.length === 0 ? element : elements.at(index ?? 0);
-        next.focus();
-        lastTarget = next;
-    }
-}
-//
-const FOCUS_TRAP_SELECTOR = 'oui-focus-trap';
+	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,
+	capture: true,
+	passive: false
 };
 const FOCUS_TRAP_CONTAIN = `${FOCUS_TRAP_SELECTOR}-contain`;
 const FOCUS_TRAP_NOESCAPE = `${FOCUS_TRAP_SELECTOR}-noescape`;
-const FOCUSTRAPS_ALL = new WeakMap();
-const FOCUSTRAPS_DISABLED = new Set();
+const FOCUSTRAPS_ALL = /* @__PURE__ */ new WeakMap();
+const FOCUSTRAPS_DISABLED = /* @__PURE__ */ new Set();
 let lastTarget;
-//
-on(document, 'focusin', onFocusIn, EVENT_OPTIONS);
-on(document, 'keydown', onKeydown, EVENT_OPTIONS);
-on(document, 'mousedown', onPointerdown, EVENT_OPTIONS);
-on(document, 'touchstart', onPointerdown, EVENT_OPTIONS);
-
+on(document, "focusin", onFocusIn, EVENT_OPTIONS);
+on(document, "keydown", onKeydown, EVENT_OPTIONS);
+on(document, "mousedown", onPointerdown, EVENT_OPTIONS);
+on(document, "touchstart", onPointerdown, EVENT_OPTIONS);
 export { FOCUSTRAPS_ALL, FOCUS_TRAP_CONTAIN, FOCUS_TRAP_NOESCAPE, FOCUS_TRAP_SELECTOR, FocusTrap, createFocusTrap };