@pzerelles/headlessui-svelte 2.0.0-next.1 → 2.1.2-next.2

package/dist/utils/focus-management.js

@@ -0,0 +1,242 @@
+import { disposables } from "./disposables.js";
+import { match } from "./match.js";
+import { getOwnerDocument } from "./owner.js";
+// Credit:
+//  - https://stackoverflow.com/a/30753870
+export let focusableSelector = [
+    "[contentEditable=true]",
+    "[tabindex]",
+    "a[href]",
+    "area[href]",
+    "button:not([disabled])",
+    "iframe",
+    "input:not([disabled])",
+    "select:not([disabled])",
+    "textarea:not([disabled])",
+]
+    .map(process.env.NODE_ENV === "test"
+    ? // TODO: Remove this once JSDOM fixes the issue where an element that is
+        // "hidden" can be the document.activeElement, because this is not possible
+        // in real browsers.
+        (selector) => `${selector}:not([tabindex='-1']):not([style*='display: none'])`
+    : (selector) => `${selector}:not([tabindex='-1'])`)
+    .join(",");
+let autoFocusableSelector = [
+    // In a perfect world this was just `autofocus`, but React doesn't pass `autofocus` to the DOM...
+    "[data-autofocus]",
+]
+    .map(process.env.NODE_ENV === "test"
+    ? // TODO: Remove this once JSDOM fixes the issue where an element that is
+        // "hidden" can be the document.activeElement, because this is not possible
+        // in real browsers.
+        (selector) => `${selector}:not([tabindex='-1']):not([style*='display: none'])`
+    : (selector) => `${selector}:not([tabindex='-1'])`)
+    .join(",");
+export var Focus;
+(function (Focus) {
+    /** Focus the first non-disabled element */
+    Focus[Focus["First"] = 1] = "First";
+    /** Focus the previous non-disabled element */
+    Focus[Focus["Previous"] = 2] = "Previous";
+    /** Focus the next non-disabled element */
+    Focus[Focus["Next"] = 4] = "Next";
+    /** Focus the last non-disabled element */
+    Focus[Focus["Last"] = 8] = "Last";
+    /** Wrap tab around */
+    Focus[Focus["WrapAround"] = 16] = "WrapAround";
+    /** Prevent scrolling the focusable elements into view */
+    Focus[Focus["NoScroll"] = 32] = "NoScroll";
+    /** Focus the first focusable element with the `data-autofocus` attribute. */
+    Focus[Focus["AutoFocus"] = 64] = "AutoFocus";
+})(Focus || (Focus = {}));
+export var FocusResult;
+(function (FocusResult) {
+    /** Something went wrong while trying to focus. */
+    FocusResult[FocusResult["Error"] = 0] = "Error";
+    /** When `Focus.WrapAround` is enabled, going from position `N` to `N+1` where `N` is the last index in the array, then we overflow. */
+    FocusResult[FocusResult["Overflow"] = 1] = "Overflow";
+    /** Focus was successful. */
+    FocusResult[FocusResult["Success"] = 2] = "Success";
+    /** When `Focus.WrapAround` is enabled, going from position `N` to `N-1` where `N` is the first index in the array, then we underflow. */
+    FocusResult[FocusResult["Underflow"] = 3] = "Underflow";
+})(FocusResult || (FocusResult = {}));
+var Direction;
+(function (Direction) {
+    Direction[Direction["Previous"] = -1] = "Previous";
+    Direction[Direction["Next"] = 1] = "Next";
+})(Direction || (Direction = {}));
+export function getFocusableElements(container = document.body) {
+    if (container == null)
+        return [];
+    return Array.from(container.querySelectorAll(focusableSelector)).sort(
+    // We want to move `tabIndex={0}` to the end of the list, this is what the browser does as well.
+    (a, z) => Math.sign((a.tabIndex || Number.MAX_SAFE_INTEGER) - (z.tabIndex || Number.MAX_SAFE_INTEGER)));
+}
+export function getAutoFocusableElements(container = document.body) {
+    if (container == null)
+        return [];
+    return Array.from(container.querySelectorAll(autoFocusableSelector)).sort(
+    // We want to move `tabIndex={0}` to the end of the list, this is what the browser does as well.
+    (a, z) => Math.sign((a.tabIndex || Number.MAX_SAFE_INTEGER) - (z.tabIndex || Number.MAX_SAFE_INTEGER)));
+}
+export var FocusableMode;
+(function (FocusableMode) {
+    /** The element itself must be focusable. */
+    FocusableMode[FocusableMode["Strict"] = 0] = "Strict";
+    /** The element should be inside of a focusable element. */
+    FocusableMode[FocusableMode["Loose"] = 1] = "Loose";
+})(FocusableMode || (FocusableMode = {}));
+export function isFocusableElement(element, mode = FocusableMode.Strict) {
+    if (element === getOwnerDocument(element)?.body)
+        return false;
+    return match(mode, {
+        [FocusableMode.Strict]() {
+            return element.matches(focusableSelector);
+        },
+        [FocusableMode.Loose]() {
+            let next = element;
+            while (next !== null) {
+                if (next.matches(focusableSelector))
+                    return true;
+                next = next.parentElement;
+            }
+            return false;
+        },
+    });
+}
+export function restoreFocusIfNecessary(element) {
+    let ownerDocument = getOwnerDocument(element);
+    disposables().nextFrame(() => {
+        if (ownerDocument && !isFocusableElement(ownerDocument.activeElement, FocusableMode.Strict)) {
+            focusElement(element);
+        }
+    });
+}
+// The method of triggering an action, this is used to determine how we should
+// restore focus after an action has been performed.
+var ActivationMethod;
+(function (ActivationMethod) {
+    /* If the action was triggered by a keyboard event. */
+    ActivationMethod[ActivationMethod["Keyboard"] = 0] = "Keyboard";
+    /* If the action was triggered by a mouse / pointer / ... event.*/
+    ActivationMethod[ActivationMethod["Mouse"] = 1] = "Mouse";
+})(ActivationMethod || (ActivationMethod = {}));
+// We want to be able to set and remove the `data-headlessui-mouse` attribute on the `html` element.
+if (typeof window !== "undefined" && typeof document !== "undefined") {
+    document.addEventListener("keydown", (event) => {
+        if (event.metaKey || event.altKey || event.ctrlKey) {
+            return;
+        }
+        document.documentElement.dataset.headlessuiFocusVisible = "";
+    }, true);
+    document.addEventListener("click", (event) => {
+        // Event originated from an actual mouse click
+        if (event.detail === ActivationMethod.Mouse) {
+            delete document.documentElement.dataset.headlessuiFocusVisible;
+        }
+        // Event originated from a keyboard event that triggered the `click` event
+        else if (event.detail === ActivationMethod.Keyboard) {
+            document.documentElement.dataset.headlessuiFocusVisible = "";
+        }
+    }, true);
+}
+export function focusElement(element) {
+    element?.focus({ preventScroll: true });
+}
+// https://developer.mozilla.org/en-US/docs/Web/API/HTMLInputElement/select
+let selectableSelector = ["textarea", "input"].join(",");
+function isSelectableElement(element) {
+    return element?.matches?.(selectableSelector) ?? false;
+}
+export function sortByDomNode(nodes, resolveKey = (i) => i) {
+    return nodes.slice().sort((aItem, zItem) => {
+        let a = resolveKey(aItem);
+        let z = resolveKey(zItem);
+        if (a === null || z === null)
+            return 0;
+        let position = a.compareDocumentPosition(z);
+        if (position & Node.DOCUMENT_POSITION_FOLLOWING)
+            return -1;
+        if (position & Node.DOCUMENT_POSITION_PRECEDING)
+            return 1;
+        return 0;
+    });
+}
+export function focusFrom(current, focus) {
+    return focusIn(getFocusableElements(), focus, { relativeTo: current });
+}
+export function focusIn(container, focus, { sorted = true, relativeTo = null, skipElements = [], } = {}) {
+    let ownerDocument = Array.isArray(container)
+        ? container.length > 0
+            ? container[0].ownerDocument
+            : document
+        : container.ownerDocument;
+    let elements = Array.isArray(container)
+        ? sorted
+            ? sortByDomNode(container)
+            : container
+        : focus & Focus.AutoFocus
+            ? getAutoFocusableElements(container)
+            : getFocusableElements(container);
+    if (skipElements.length > 0 && elements.length > 1) {
+        elements = elements.filter((element) => !skipElements.some((skipElement) => skipElement != null && "current" in skipElement
+            ? skipElement?.current === element // Handle MutableRefObject
+            : skipElement === element // Handle HTMLElement directly
+        ));
+    }
+    relativeTo = relativeTo ?? ownerDocument.activeElement;
+    let direction = (() => {
+        if (focus & (Focus.First | Focus.Next))
+            return Direction.Next;
+        if (focus & (Focus.Previous | Focus.Last))
+            return Direction.Previous;
+        throw new Error("Missing Focus.First, Focus.Previous, Focus.Next or Focus.Last");
+    })();
+    let startIndex = (() => {
+        if (focus & Focus.First)
+            return 0;
+        if (focus & Focus.Previous)
+            return Math.max(0, elements.indexOf(relativeTo)) - 1;
+        if (focus & Focus.Next)
+            return Math.max(0, elements.indexOf(relativeTo)) + 1;
+        if (focus & Focus.Last)
+            return elements.length - 1;
+        throw new Error("Missing Focus.First, Focus.Previous, Focus.Next or Focus.Last");
+    })();
+    let focusOptions = focus & Focus.NoScroll ? { preventScroll: true } : {};
+    let offset = 0;
+    let total = elements.length;
+    let next = undefined;
+    do {
+        // Guard against infinite loops
+        if (offset >= total || offset + total <= 0)
+            return FocusResult.Error;
+        let nextIdx = startIndex + offset;
+        if (focus & Focus.WrapAround) {
+            nextIdx = (nextIdx + total) % total;
+        }
+        else {
+            if (nextIdx < 0)
+                return FocusResult.Underflow;
+            if (nextIdx >= total)
+                return FocusResult.Overflow;
+        }
+        next = elements[nextIdx];
+        // Try the focus the next element, might not work if it is "hidden" to the user.
+        next?.focus(focusOptions);
+        // Try the next one in line
+        offset += direction;
+    } while (next !== ownerDocument.activeElement);
+    // By default if you <Tab> to a text input or a textarea, the browser will
+    // select all the text once the focus is inside these DOM Nodes. However,
+    // since we are manually moving focus this behavior is not happening. This
+    // code will make sure that the text gets selected as-if you did it manually.
+    // Note: We only do this when going forward / backward. Not for the
+    // Focus.First or Focus.Last actions. This is similar to the `autoFocus`
+    // behavior on an input where the input will get focus but won't be
+    // selected.
+    if (focus & (Focus.Next | Focus.Previous) && isSelectableElement(next)) {
+        next.select();
+    }
+    return FocusResult.Success;
+}

package/dist/utils/focusVisible.svelte.d.ts

@@ -4,7 +4,7 @@ export interface FocusVisibleProps {
     /** Whether the element is a text input. */
     isTextInput?: boolean;
     /** Whether the element will be auto focused. */
-    autoFocus?: boolean;
+    autofocus?: boolean;
 }
 export interface FocusVisibleResult {
     /** Whether keyboard focus is visible globally. */
@@ -13,7 +13,7 @@ export interface FocusVisibleResult {
 interface GlobalListenerData {
     focus: () => void;
 }
-export declare let hasSetupGlobalListeners: Map<Window, GlobalListenerData>;
+export declare const hasSetupGlobalListeners: Map<Window, GlobalListenerData>;
 /**
  * EXPERIMENTAL
  * Adds a window (i.e. iframe) to the list of windows that are being tracked for focus visible.
@@ -31,7 +31,7 @@ export declare let hasSetupGlobalListeners: Map<Window, GlobalListenerData>;
  * @param element @default document.body - The element provided will be used to get the window to add.
  * @returns A function to remove the event listeners and cleanup the state.
  */
-export declare function addWindowFocusTracking(element?: HTMLElement | null): () => void;
+export declare function addWindowFocusTracking(element?: HTMLElement): () => void;
 /**
  * If true, keyboard focus is visible.
  */

package/dist/utils/focusVisible.svelte.js

@@ -13,12 +13,13 @@
 // Original licensing for the following can be found in the
 // NOTICE file in the root directory of this source tree.
 // See https://github.com/facebook/react/tree/cc7c1aece46a6b69b41958d731e0fd27c94bfc6c/packages/react-interactions
-import { getOwnerDocument, getOwnerWindow } from "./dom.js";
+import { getOwnerWindow } from "./dom.js";
 import { isVirtualClick } from "./isVirtualEvent.js";
+import { getOwnerDocument } from "./owner.js";
 import { isMac } from "./platform.js";
 let currentModality = null;
-let changeHandlers = new Set();
-export let hasSetupGlobalListeners = new Map(); // We use a map here to support setting event listeners across multiple document objects.
+const changeHandlers = new Set();
+export const hasSetupGlobalListeners = new Map(); // We use a map here to support setting event listeners across multiple document objects.
 let hasEventBeforeFocus = false;
 let hasBlurredWindowRecently = false;
 // Only Tab or Esc keys will make focus visible on text input elements
@@ -27,7 +28,7 @@ const FOCUS_VISIBLE_INPUT_KEYS = {
     Escape: true,
 };
 function triggerChangeHandlers(modality, e) {
-    for (let handler of changeHandlers) {
+    for (const handler of changeHandlers) {
         handler(modality, e);
     }
 }
@@ -98,27 +99,31 @@ function setupGlobalFocusEvents(element) {
     // However, we need to detect other cases when a focus event occurs without
     // a preceding user event (e.g. screen reader focus). Overriding the focus
     // method on HTMLElement.prototype is a bit hacky, but works.
-    let focus = windowObject.HTMLElement.prototype.focus;
-    windowObject.HTMLElement.prototype.focus = function () {
+    const focus = windowObject.HTMLElement.prototype.focus;
+    windowObject.HTMLElement.prototype.focus = function (...args) {
         hasEventBeforeFocus = true;
-        focus.apply(this, arguments);
+        focus.apply(this, args);
     };
-    documentObject.addEventListener("keydown", handleKeyboardEvent, true);
-    documentObject.addEventListener("keyup", handleKeyboardEvent, true);
-    documentObject.addEventListener("click", handleClickEvent, true);
+    if (documentObject) {
+        documentObject.addEventListener("keydown", handleKeyboardEvent, true);
+        documentObject.addEventListener("keyup", handleKeyboardEvent, true);
+        documentObject.addEventListener("click", handleClickEvent, true);
+    }
     // Register focus events on the window so they are sure to happen
     // before React's event listeners (registered on the document).
     windowObject.addEventListener("focus", handleFocusEvent, true);
     windowObject.addEventListener("blur", handleWindowBlur, false);
-    if (typeof PointerEvent !== "undefined") {
-        documentObject.addEventListener("pointerdown", handlePointerEvent, true);
-        documentObject.addEventListener("pointermove", handlePointerEvent, true);
-        documentObject.addEventListener("pointerup", handlePointerEvent, true);
-    }
-    else {
-        documentObject.addEventListener("mousedown", handlePointerEvent, true);
-        documentObject.addEventListener("mousemove", handlePointerEvent, true);
-        documentObject.addEventListener("mouseup", handlePointerEvent, true);
+    if (documentObject) {
+        if (typeof PointerEvent !== "undefined") {
+            documentObject.addEventListener("pointerdown", handlePointerEvent, true);
+            documentObject.addEventListener("pointermove", handlePointerEvent, true);
+            documentObject.addEventListener("pointerup", handlePointerEvent, true);
+        }
+        else {
+            documentObject.addEventListener("mousedown", handlePointerEvent, true);
+            documentObject.addEventListener("mousemove", handlePointerEvent, true);
+            documentObject.addEventListener("mouseup", handlePointerEvent, true);
+        }
     }
     // Add unmount handler
     windowObject.addEventListener("beforeunload", () => {
@@ -129,27 +134,31 @@ function setupGlobalFocusEvents(element) {
 const tearDownWindowFocusTracking = (element, loadListener) => {
     const windowObject = getOwnerWindow(element);
     const documentObject = getOwnerDocument(element);
-    if (loadListener) {
+    if (loadListener && documentObject) {
         documentObject.removeEventListener("DOMContentLoaded", loadListener);
     }
     if (!hasSetupGlobalListeners.has(windowObject)) {
         return;
     }
     windowObject.HTMLElement.prototype.focus = hasSetupGlobalListeners.get(windowObject).focus;
-    documentObject.removeEventListener("keydown", handleKeyboardEvent, true);
-    documentObject.removeEventListener("keyup", handleKeyboardEvent, true);
-    documentObject.removeEventListener("click", handleClickEvent, true);
+    if (documentObject) {
+        documentObject.removeEventListener("keydown", handleKeyboardEvent, true);
+        documentObject.removeEventListener("keyup", handleKeyboardEvent, true);
+        documentObject.removeEventListener("click", handleClickEvent, true);
+    }
     windowObject.removeEventListener("focus", handleFocusEvent, true);
     windowObject.removeEventListener("blur", handleWindowBlur, false);
-    if (typeof PointerEvent !== "undefined") {
-        documentObject.removeEventListener("pointerdown", handlePointerEvent, true);
-        documentObject.removeEventListener("pointermove", handlePointerEvent, true);
-        documentObject.removeEventListener("pointerup", handlePointerEvent, true);
-    }
-    else {
-        documentObject.removeEventListener("mousedown", handlePointerEvent, true);
-        documentObject.removeEventListener("mousemove", handlePointerEvent, true);
-        documentObject.removeEventListener("mouseup", handlePointerEvent, true);
+    if (documentObject) {
+        if (typeof PointerEvent !== "undefined") {
+            documentObject.removeEventListener("pointerdown", handlePointerEvent, true);
+            documentObject.removeEventListener("pointermove", handlePointerEvent, true);
+            documentObject.removeEventListener("pointerup", handlePointerEvent, true);
+        }
+        else {
+            documentObject.removeEventListener("mousedown", handlePointerEvent, true);
+            documentObject.removeEventListener("mousemove", handlePointerEvent, true);
+            documentObject.removeEventListener("mouseup", handlePointerEvent, true);
+        }
     }
     hasSetupGlobalListeners.delete(windowObject);
 };
@@ -173,14 +182,16 @@ const tearDownWindowFocusTracking = (element, loadListener) => {
 export function addWindowFocusTracking(element) {
     const documentObject = getOwnerDocument(element);
     let loadListener;
-    if (documentObject.readyState !== "loading") {
-        setupGlobalFocusEvents(element);
-    }
-    else {
-        loadListener = () => {
+    if (documentObject) {
+        if (documentObject.readyState !== "loading") {
             setupGlobalFocusEvents(element);
-        };
-        documentObject.addEventListener("DOMContentLoaded", loadListener);
+        }
+        else {
+            loadListener = () => {
+                setupGlobalFocusEvents(element);
+            };
+            documentObject.addEventListener("DOMContentLoaded", loadListener);
+        }
     }
     return () => tearDownWindowFocusTracking(element, loadListener);
 }
@@ -246,8 +257,8 @@ function isKeyboardFocusEvent(isTextInput, modality, e) {
  * Manages focus visible state for the page, and subscribes individual components for updates.
  */
 /*export function useFocusVisible(props: FocusVisibleProps = {}): FocusVisibleResult {
-  let { isTextInput, autoFocus } = props
-  let [isFocusVisibleState, setFocusVisible] = useState(autoFocus || isFocusVisible())
+  let { isTextInput, autofocus } = props
+  let [isFocusVisibleState, setFocusVisible] = useState(autofocus || isFocusVisible())
   useFocusVisibleListener(
     (isFocusVisible) => {
       setFocusVisible(isFocusVisible)

package/dist/utils/get-text-value.d.ts

@@ -0,0 +1 @@
+export declare function getTextValue(element: HTMLElement): string;

package/dist/utils/get-text-value.js

@@ -0,0 +1,71 @@
+let emojiRegex = /([\u2700-\u27BF]|[\uE000-\uF8FF]|\uD83C[\uDC00-\uDFFF]|\uD83D[\uDC00-\uDFFF]|[\u2011-\u26FF]|\uD83E[\uDD10-\uDDFF])/g;
+function getTextContents(element) {
+    // Using innerText instead of textContent because:
+    //
+    // > textContent gets the content of all elements, including <script> and <style> elements. In
+    // > contrast, innerText only shows "human-readable" elements.
+    // >
+    // > — https://developer.mozilla.org/en-US/docs/Web/API/Node/textContent#differences_from_innertext
+    let currentInnerText = element.innerText ?? "";
+    // Remove all the elements that shouldn't be there.
+    //
+    // [hidden]       — The user doesn't see it
+    // [aria-hidden]  — The screen reader doesn't see it
+    // [role="img"]   — Even if it is text, it is used as an image
+    //
+    // This is probably the slowest part, but if you want complete control over the text value, then
+    // it is better to set an `aria-label` instead.
+    let copy = element.cloneNode(true);
+    if (!(copy instanceof HTMLElement)) {
+        return currentInnerText;
+    }
+    let dropped = false;
+    // Drop the elements that shouldn't be there.
+    for (let child of copy.querySelectorAll('[hidden],[aria-hidden],[role="img"]')) {
+        child.remove();
+        dropped = true;
+    }
+    // Now that the elements are removed, we can get the innerText such that we can strip the emojis.
+    let value = dropped ? copy.innerText ?? "" : currentInnerText;
+    // Check if it contains some emojis or not, if so, we need to remove them
+    // because ideally we work with simple text values.
+    //
+    // Ideally we can use the much simpler RegEx: /\p{Extended_Pictographic}/u
+    // but we can't rely on this yet, so we use the more complex one.
+    if (emojiRegex.test(value)) {
+        value = value.replace(emojiRegex, "");
+    }
+    return value;
+}
+export function getTextValue(element) {
+    // Try to use the `aria-label` first
+    let label = element.getAttribute("aria-label");
+    if (typeof label === "string")
+        return label.trim();
+    // Try to use the `aria-labelledby` second
+    let labelledby = element.getAttribute("aria-labelledby");
+    if (labelledby) {
+        // aria-labelledby can be a space-separated list of IDs, so we need to split them up and
+        // combine them into a single string.
+        let labels = labelledby
+            .split(" ")
+            .map((labelledby) => {
+            let labelEl = document.getElementById(labelledby);
+            if (labelEl) {
+                let label = labelEl.getAttribute("aria-label");
+                // Try to use the `aria-label` first (of the referenced element)
+                if (typeof label === "string")
+                    return label.trim();
+                // This time, the `aria-labelledby` isn't used anymore (in Safari), so we just have to
+                // look at the contents itself.
+                return getTextContents(labelEl).trim();
+            }
+            return null;
+        })
+            .filter(Boolean);
+        if (labels.length > 0)
+            return labels.join(", ");
+    }
+    // Try to use the text contents of the element itself
+    return getTextContents(element).trim();
+}

package/dist/utils/id.d.ts

@@ -1,4 +1,4 @@
-export declare const alphaid: (size?: number | undefined) => string;
+export declare const alphaid: (size?: number) => string;
 export declare const htmlid: (size?: number) => string;
 export declare const getIdContext: () => string | undefined;
 export declare const createIdContext: (id: string) => string | undefined;

package/dist/utils/match.d.ts

@@ -0,0 +1 @@
+export declare function match<TValue extends string | number = string, TReturnValue = unknown>(value: TValue, lookup: Record<TValue, TReturnValue | ((...args: any[]) => TReturnValue)>, ...args: any[]): TReturnValue;

package/dist/utils/match.js

@@ -0,0 +1,13 @@
+/* eslint-disable @typescript-eslint/no-explicit-any */
+export function match(value, lookup, ...args) {
+    if (value in lookup) {
+        const returnValue = lookup[value];
+        return typeof returnValue === "function" ? returnValue(...args) : returnValue;
+    }
+    const error = new Error(`Tried to handle "${value}" but there is no handler defined. Only defined handlers are: ${Object.keys(lookup)
+        .map((key) => `"${key}"`)
+        .join(", ")}.`);
+    if (Error.captureStackTrace)
+        Error.captureStackTrace(error, match);
+    throw error;
+}

package/dist/utils/on-document-ready.d.ts

@@ -0,0 +1 @@
+export declare function onDocumentReady(cb: () => void): void;

package/dist/utils/on-document-ready.js

@@ -0,0 +1,12 @@
+export function onDocumentReady(cb) {
+    function check() {
+        if (document.readyState === "loading")
+            return;
+        cb();
+        document.removeEventListener("DOMContentLoaded", check);
+    }
+    if (typeof window !== "undefined" && typeof document !== "undefined") {
+        document.addEventListener("DOMContentLoaded", check);
+        check();
+    }
+}

package/dist/utils/once.d.ts

@@ -0,0 +1 @@
+export declare function once<T>(cb: (...args: T[]) => void): (...args: T[]) => void;

package/dist/utils/once.js

@@ -0,0 +1,9 @@
+export function once(cb) {
+    let state = { called: false };
+    return (...args) => {
+        if (state.called)
+            return;
+        state.called = true;
+        return cb(...args);
+    };
+}

package/dist/utils/owner.d.ts

@@ -0,0 +1 @@
+export declare function getOwnerDocument<T extends Element>(element: T | null | undefined): Document | null;

package/dist/utils/owner.js

@@ -0,0 +1,8 @@
+import { BROWSER } from "esm-env";
+export function getOwnerDocument(element) {
+    if (!BROWSER)
+        return null;
+    if (element instanceof Node)
+        return element.ownerDocument;
+    return document;
+}

package/dist/utils/platform.d.ts

@@ -2,3 +2,5 @@ export declare function testUserAgent(re: RegExp): any;
 export declare function testPlatform(re: RegExp): boolean;
 export declare const isMac: () => boolean;
 export declare const isAndroid: () => boolean;
+export declare function isIOS(): any;
+export declare function isMobile(): any;

package/dist/utils/platform.js

@@ -1,3 +1,4 @@
+/* eslint-disable @typescript-eslint/no-explicit-any */
 export function testUserAgent(re) {
     if (typeof window === "undefined" || window.navigator == null) {
         return false;
@@ -27,3 +28,19 @@ export const isMac = cached(function () {
 export const isAndroid = cached(function () {
     return testUserAgent(/Android/i);
 });
+export function isIOS() {
+    // TODO: This is not a great way to detect iOS, but it's the best I can do for now.
+    // - `window.platform` is deprecated
+    // - `window.userAgentData.platform` is still experimental (https://developer.mozilla.org/en-US/docs/Web/API/NavigatorUAData/platform)
+    // - `window.userAgent` also doesn't contain the required information
+    return (
+    // Check if it is an iPhone
+    testUserAgent(/iPhone/i) ||
+        // Check if it is an iPad. iPad reports itself as "MacIntel", but we can check if it is a touch
+        // screen. Let's hope that Apple doesn't release a touch screen Mac (or maybe this would then
+        // work as expected 🤔).
+        (isMac() && typeof window !== "undefined" && window.navigator != null && window.navigator.maxTouchPoints > 0));
+}
+export function isMobile() {
+    return isIOS() || isAndroid();
+}

package/dist/utils/ref.svelte.d.ts

@@ -0,0 +1,4 @@
+export type MutableRefObject<T> = {
+    current: T;
+};
+export declare const useRef: <T>(current: T) => MutableRefObject<T>;

package/dist/utils/ref.svelte.js

@@ -0,0 +1,4 @@
+export const useRef = (current) => {
+    const ref = $state({ current });
+    return ref;
+};

package/dist/utils/render.d.ts

@@ -0,0 +1,34 @@
+import type { Props } from "./types.js";
+export declare enum RenderFeatures {
+    /** No features at all */
+    None = 0,
+    /**
+     * When used, this will allow us to use one of the render strategies.
+     *
+     * **The render strategies are:**
+     *    - **Unmount**   _(Will unmount the component.)_
+     *    - **Hidden**    _(Will hide the component using the [hidden] attribute.)_
+     */
+    RenderStrategy = 1,
+    /**
+     * When used, this will allow the user of our component to be in control. This can be used when
+     * you want to transition based on some state.
+     */
+    Static = 2
+}
+export declare enum RenderStrategy {
+    Unmount = 0,
+    Hidden = 1
+}
+type UnionToIntersection<T> = (T extends any ? (x: T) => any : never) extends (x: infer R) => any ? R : never;
+type PropsForFeature<TPassedInFeatures extends RenderFeatures, TForFeature extends RenderFeatures, TProps> = TPassedInFeatures extends TForFeature ? TProps : {};
+export type PropsForFeatures<T extends RenderFeatures> = Expand<UnionToIntersection<PropsForFeature<T, RenderFeatures.Static, {
+    static?: boolean;
+}> | PropsForFeature<T, RenderFeatures.RenderStrategy, {
+    unmount?: boolean;
+}>>>;
+export declare function mergeProps<T extends Props<any, any>[]>(...listOfProps: T): Props<any, any>;
+export declare function mergePropsAdvanced(...listOfProps: Props<any, any>[]): Props<any, any>;
+export declare function compact<T extends Record<any, any>>(object: T): {} & T;
+export declare function omit<T extends Record<any, any>>(object: T, keysToOmit?: string[]): T;
+export {};