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

package/dist/hooks/use-tab-direction.svelte.d.ts

@@ -0,0 +1,7 @@
+export declare enum Direction {
+    Forwards = 0,
+    Backwards = 1
+}
+export declare function useTabDirection(): {
+    readonly current: Direction;
+};

package/dist/hooks/use-tab-direction.svelte.js

@@ -0,0 +1,25 @@
+import { useWindowEvent } from "./use-window-event.svelte.js";
+export var Direction;
+(function (Direction) {
+    Direction[Direction["Forwards"] = 0] = "Forwards";
+    Direction[Direction["Backwards"] = 1] = "Backwards";
+})(Direction || (Direction = {}));
+export function useTabDirection() {
+    let direction = $state(Direction.Forwards);
+    let enabled = true;
+    useWindowEvent({
+        enabled,
+        type: "keydown",
+        listener: (event) => {
+            if (event.key === "Tab") {
+                direction = event.shiftKey ? Direction.Backwards : Direction.Forwards;
+            }
+        },
+        options: true,
+    });
+    return {
+        get current() {
+            return direction;
+        },
+    };
+}

package/dist/hooks/use-text-value.svelte.d.ts

@@ -0,0 +1,3 @@
+export declare function useTextValue(options: {
+    element: HTMLElement | null;
+}): () => string;

package/dist/hooks/use-text-value.svelte.js

@@ -0,0 +1,20 @@
+import { getTextValue } from "../utils/get-text-value.js";
+export function useTextValue(options) {
+    const { element } = $derived(options);
+    let cacheKey = $state("");
+    let cacheValue = $state("");
+    return () => {
+        if (!element)
+            return "";
+        // Check for a cached version
+        let currentKey = element.innerText;
+        if (cacheKey === currentKey) {
+            return cacheValue;
+        }
+        // Calculate the value
+        let value = getTextValue(element).trim().toLowerCase();
+        cacheKey = currentKey;
+        cacheValue = value;
+        return value;
+    };
+}

package/dist/hooks/use-tracked-pointer.d.ts

@@ -0,0 +1,4 @@
+export declare function useTrackedPointer(): {
+    wasMoved(evt: PointerEvent): boolean;
+    update(evt: PointerEvent): void;
+};

package/dist/hooks/use-tracked-pointer.js

@@ -0,0 +1,26 @@
+import { BROWSER } from "esm-env";
+function eventToPosition(evt) {
+    return [evt.screenX, evt.screenY];
+}
+export function useTrackedPointer() {
+    let lastPos = [-1, -1];
+    return {
+        wasMoved(evt) {
+            // FIXME: Remove this once we use browser testing in all the relevant places.
+            // NOTE: This is replaced with a compile-time define during the build process
+            // This hack exists to work around a few failing tests caused by our inability to "move" the virtual pointer in JSDOM pointer events.
+            if (!BROWSER && process.env.TEST_BYPASS_TRACKED_POINTER) {
+                return true;
+            }
+            let newPos = eventToPosition(evt);
+            if (lastPos[0] === newPos[0] && lastPos[1] === newPos[1]) {
+                return false;
+            }
+            lastPos = newPos;
+            return true;
+        },
+        update(evt) {
+            lastPos = eventToPosition(evt);
+        },
+    };
+}

package/dist/hooks/use-transition.svelte.d.ts

@@ -0,0 +1,20 @@
+type TransitionData = {
+    closed?: boolean;
+    enter?: boolean;
+    leave?: boolean;
+    transition?: boolean;
+};
+export declare function transitionDataAttributes(data: TransitionData): Record<string, string>;
+export declare function useTransition(options: {
+    enabled: boolean;
+    element: HTMLElement | null | undefined;
+    show: boolean;
+    events?: {
+        start?(show: boolean): void;
+        end?(show: boolean): void;
+    };
+}): {
+    readonly visible: boolean;
+    readonly data: TransitionData;
+};
+export {};

package/dist/hooks/use-transition.svelte.js

@@ -0,0 +1,253 @@
+import { disposables, useDisposables } from "../utils/disposables.js";
+import { once } from "../utils/once.js";
+import { untrack } from "svelte";
+/**
+ * ```
+ * ┌──────┐                │        ┌──────────────┐
+ * │Closed│                │        │Closed        │
+ * └──────┘                │        └──────────────┘
+ * ┌──────┐┌──────┐┌──────┐│┌──────┐┌──────┐┌──────┐
+ * │Frame ││Frame ││Frame │││Frame ││Frame ││Frame │
+ * └──────┘└──────┘└──────┘│└──────┘└──────┘└──────┘
+ * ┌──────────────────────┐│┌──────────────────────┐
+ * │Enter                 │││Leave                 │
+ * └──────────────────────┘│└──────────────────────┘
+ * ┌──────────────────────┐│┌──────────────────────┐
+ * │Transition            │││Transition            │
+ * ├──────────────────────┘│└──────────────────────┘
+ * │
+ * └─ Applied when `Enter` or `Leave` is applied.
+ * ```
+ */
+var TransitionState;
+(function (TransitionState) {
+    TransitionState[TransitionState["None"] = 0] = "None";
+    TransitionState[TransitionState["Closed"] = 1] = "Closed";
+    TransitionState[TransitionState["Enter"] = 2] = "Enter";
+    TransitionState[TransitionState["Leave"] = 4] = "Leave";
+})(TransitionState || (TransitionState = {}));
+export function transitionDataAttributes(data) {
+    const attributes = {};
+    for (const key in data) {
+        if (data[key] === true) {
+            attributes[`data-${key}`] = "";
+        }
+    }
+    return attributes;
+}
+export function useTransition(options) {
+    const { enabled, element, show, events } = $derived(options);
+    let visible = $state(show);
+    let flags = $state(enabled && visible ? TransitionState.Enter | TransitionState.Closed : TransitionState.None);
+    let inFlight = $state(false);
+    let cancelled = $state(false);
+    const d = useDisposables();
+    function retry(enabled, show, node, d) {
+        if (!enabled)
+            return;
+        if (show) {
+            visible = true;
+        }
+        if (!node) {
+            // Retry if the DOM node isn't available yet
+            if (show) {
+                flags |= TransitionState.Enter | TransitionState.Closed;
+                return d.nextFrame(() => retry(enabled, show, node, d));
+            }
+            return;
+        }
+        events?.start?.(show);
+        return transition(node, {
+            inFlight,
+            prepare() {
+                if (cancelled) {
+                    // Cancelled a cancellation, we're back to the original state.
+                    cancelled = false;
+                }
+                else {
+                    // If we were already in-flight, then we want to cancel the current
+                    // transition.
+                    cancelled = inFlight;
+                }
+                inFlight = true;
+                if (cancelled)
+                    return;
+                if (show) {
+                    flags = TransitionState.Enter | TransitionState.Closed;
+                }
+                else {
+                    flags = TransitionState.Leave | (flags & TransitionState.Closed);
+                }
+            },
+            run() {
+                if (cancelled) {
+                    // If we cancelled a transition, then the `show` state is going to
+                    // be inverted already, but that doesn't mean we have to go to that
+                    // new state.
+                    //
+                    // What we actually want is to revert to the "idle" state (the
+                    // stable state where an `Enter` transitions to, and a `Leave`
+                    // transitions from.)
+                    //
+                    // Because of this, it might look like we are swapping the flags in
+                    // the following branches, but that's not the case.
+                    if (!show) {
+                        flags = TransitionState.Leave | TransitionState.Closed;
+                    }
+                    else {
+                        flags = TransitionState.Enter | TransitionState.Closed;
+                    }
+                }
+                else {
+                    if (show) {
+                        flags = flags & ~TransitionState.Closed;
+                    }
+                    else {
+                        flags |= TransitionState.Closed;
+                    }
+                }
+            },
+            done() {
+                if (cancelled) {
+                    if (typeof node.getAnimations === "function" && node.getAnimations().length > 0) {
+                        return;
+                    }
+                }
+                inFlight = false;
+                flags = 0;
+                if (!show) {
+                    visible = false;
+                }
+                events?.end?.(show);
+            },
+        });
+    }
+    $effect(() => {
+        // eslint-disable-next-line @typescript-eslint/no-unused-expressions
+        ;
+        [enabled, show, element, d];
+        return untrack(() => retry(enabled, show, element, d));
+    });
+    const data = $derived({
+        closed: enabled ? !!(flags & TransitionState.Closed) : undefined,
+        enter: enabled ? !!(flags & TransitionState.Enter) : undefined,
+        leave: enabled ? !!(flags & TransitionState.Leave) : undefined,
+        transition: enabled ? !!(flags & (TransitionState.Enter | TransitionState.Leave)) : undefined,
+    });
+    return {
+        get visible() {
+            return enabled ? visible : show;
+        },
+        get data() {
+            return data;
+        },
+    };
+}
+function transition(node, { prepare, run, done, inFlight, }) {
+    const d = disposables();
+    // Prepare the transitions by ensuring that all the "before" classes are
+    // applied and flushed to the DOM.
+    prepareTransition(node, {
+        prepare,
+        inFlight,
+    });
+    // This is a workaround for a bug in all major browsers.
+    //
+    // 1. When an element is just mounted
+    // 2. And you apply a transition to it (e.g.: via a class)
+    // 3. And you're using `getComputedStyle` and read any returned value
+    // 4. Then the `transition` immediately jumps to the end state
+    //
+    // This means that no transition happens at all. To fix this, we delay the
+    // actual transition by one frame.
+    d.nextFrame(() => {
+        // Wait for the transition, once the transition is complete we can cleanup.
+        // This is registered first to prevent race conditions, otherwise it could
+        // happen that the transition is already done before we start waiting for
+        // the actual event.
+        d.add(waitForTransition(node, done));
+        // Initiate the transition by applying the new classes.
+        run();
+    });
+    return d.dispose;
+}
+function waitForTransition(node, _done) {
+    const done = once(_done);
+    const d = disposables();
+    if (!node)
+        return d.dispose;
+    // Safari returns a comma separated list of values, so let's sort them and take the highest value.
+    const { transitionDuration, transitionDelay } = getComputedStyle(node);
+    const [durationMs, delayMs] = [transitionDuration, transitionDelay].map((value) => {
+        const [resolvedValue = 0] = value
+            .split(",")
+            // Remove falsy we can't work with
+            .filter(Boolean)
+            // Values are returned as `0.3s` or `75ms`
+            .map((v) => (v.includes("ms") ? parseFloat(v) : parseFloat(v) * 1000))
+            .sort((a, z) => z - a);
+        return resolvedValue;
+    });
+    const totalDuration = durationMs + delayMs;
+    if (totalDuration !== 0) {
+        if (process.env.NODE_ENV === "test") {
+            const dispose = d.setTimeout(() => {
+                done();
+                dispose();
+            }, totalDuration);
+        }
+        else {
+            const disposeGroup = d.group((d) => {
+                // Mark the transition as done when the timeout is reached. This is a fallback in case the
+                // transitionrun event is not fired.
+                const cancelTimeout = d.setTimeout(() => {
+                    done();
+                    d.dispose();
+                }, totalDuration);
+                // The moment the transitionrun event fires, we should cleanup the timeout fallback, because
+                // then we know that we can use the native transition events because something is
+                // transitioning.
+                d.addEventListener(node, "transitionrun", (event) => {
+                    if (event.target !== event.currentTarget)
+                        return;
+                    cancelTimeout();
+                    d.addEventListener(node, "transitioncancel", (event) => {
+                        if (event.target !== event.currentTarget)
+                            return;
+                        done();
+                        disposeGroup();
+                    });
+                });
+            });
+            d.addEventListener(node, "transitionend", (event) => {
+                if (event.target !== event.currentTarget)
+                    return;
+                done();
+                d.dispose();
+            });
+        }
+    }
+    else {
+        // No transition is happening, so we should cleanup already. Otherwise we have to wait until we
+        // get disposed.
+        done();
+    }
+    return d.dispose;
+}
+function prepareTransition(node, { inFlight, prepare }) {
+    // If we are already transitioning, then we don't need to force cancel the
+    // current transition (by triggering a reflow).
+    if (inFlight) {
+        prepare();
+        return;
+    }
+    const previous = node.style.transition;
+    // Force cancel current transition
+    node.style.transition = "none";
+    prepare();
+    // Trigger a reflow, flushing the CSS changes
+    // eslint-disable-next-line @typescript-eslint/no-unused-expressions
+    node.offsetHeight;
+    // Reset the transition to what it was before
+    node.style.transition = previous;
+}

package/dist/hooks/use-tree-walker.svelte.d.ts

@@ -0,0 +1,8 @@
+type AcceptNode = (node: HTMLElement) => typeof NodeFilter.FILTER_ACCEPT | typeof NodeFilter.FILTER_SKIP | typeof NodeFilter.FILTER_REJECT;
+export declare function useTreeWalker(options: {
+    enabled: boolean;
+    container: HTMLElement | null;
+    accept: AcceptNode;
+    walk(node: HTMLElement): void;
+}): void;
+export {};

package/dist/hooks/use-tree-walker.svelte.js

@@ -0,0 +1,19 @@
+import { getOwnerDocument } from "../utils/owner.js";
+export function useTreeWalker(options) {
+    const { enabled, container, accept, walk } = $derived(options);
+    $effect(() => {
+        if (!container)
+            return;
+        if (!enabled)
+            return;
+        const ownerDocument = getOwnerDocument(container);
+        if (!ownerDocument)
+            return;
+        const acceptNode = Object.assign((node) => accept(node), { acceptNode: accept });
+        const walker = ownerDocument.createTreeWalker(container, NodeFilter.SHOW_ELEMENT, acceptNode, 
+        // @ts-expect-error This `false` is a simple small fix for older browsers
+        false);
+        while (walker.nextNode())
+            walk(walker.currentNode);
+    });
+}

package/dist/hooks/use-watch.svelte.d.ts

@@ -0,0 +1,4 @@
+export declare function useWatch<T extends any[]>(options: {
+    action: (newValues: [...T], oldValues: [...T]) => void | (() => void);
+    dependencies: [...T];
+}): void;

package/dist/hooks/use-watch.svelte.js

@@ -0,0 +1,16 @@
+import { untrack } from "svelte";
+export function useWatch(options) {
+    const { action, dependencies } = $derived(options);
+    let track = [];
+    $effect(() => {
+        let oldValues = untrack(() => [...track]);
+        for (let [idx, value] of dependencies.entries()) {
+            if (untrack(() => track[idx]) !== value) {
+                // At least 1 item changed
+                let returnValue = action(dependencies, oldValues);
+                track = dependencies;
+                return returnValue;
+            }
+        }
+    });
+}

package/dist/hooks/use-window-event.svelte.d.ts

@@ -0,0 +1,6 @@
+export declare function useWindowEvent<TType extends keyof WindowEventMap>(params: {
+    enabled: boolean;
+    type: TType;
+    listener: (ev: WindowEventMap[TType]) => any;
+    options?: boolean | AddEventListenerOptions;
+}): void;

package/dist/hooks/use-window-event.svelte.js

@@ -0,0 +1,12 @@
+export function useWindowEvent(params) {
+    let { enabled, type, listener, options } = $derived(params);
+    $effect(() => {
+        if (!enabled)
+            return;
+        function handler(event) {
+            listener(event);
+        }
+        window.addEventListener(type, handler, options);
+        return () => window.removeEventListener(type, handler, options);
+    });
+}

package/dist/index.d.ts

@@ -1,6 +1,19 @@
+export * from "./button/index.js";
 export * from "./checkbox/index.js";
+export * from "./close-button/index.js";
+export * from "./data-interactive/index.js";
 export * from "./description/index.js";
+export * from "./dialog/index.js";
 export * from "./field/index.js";
 export * from "./fieldset/index.js";
+export * from "./input/index.js";
 export * from "./label/index.js";
 export * from "./legend/index.js";
+export * from "./listbox/index.js";
+export * from "./menu/index.js";
+export * from "./switch/index.js";
+export * from "./tabs/index.js";
+export * from "./transition/index.js";
+export * from "./hooks/use-id.js";
+export * from "./utils/types.js";
+export { mergeProps } from "./utils/render.js";

package/dist/index.js

@@ -1,6 +1,19 @@
+export * from "./button/index.js";
 export * from "./checkbox/index.js";
+export * from "./close-button/index.js";
+export * from "./data-interactive/index.js";
 export * from "./description/index.js";
+export * from "./dialog/index.js";
 export * from "./field/index.js";
 export * from "./fieldset/index.js";
+export * from "./input/index.js";
 export * from "./label/index.js";
 export * from "./legend/index.js";
+export * from "./listbox/index.js";
+export * from "./menu/index.js";
+export * from "./switch/index.js";
+export * from "./tabs/index.js";
+export * from "./transition/index.js";
+export * from "./hooks/use-id.js";
+export * from "./utils/types.js";
+export { mergeProps } from "./utils/render.js";

package/dist/input/Input.svelte

@@ -0,0 +1,59 @@
+<script lang="ts" module>const DEFAULT_INPUT_TAG = "input";
+</script>
+
+<script lang="ts" generics="TTag extends ElementType = typeof DEFAULT_INPUT_TAG, TValue = string">import { htmlid } from "../utils/id.js";
+import { useDisabled } from "../hooks/use-disabled.js";
+import { useProvidedId } from "../internal/id.js";
+import { useLabelledBy } from "../label/context.svelte.js";
+import { useDescribedBy } from "../description/context.svelte.js";
+import { useHover } from "../hooks/use-hover.svelte.js";
+import { useFocusRing } from "../hooks/use-focus-ring.svelte.js";
+import { mergeProps } from "../utils/render.js";
+import ElementOrComponent from "../utils/ElementOrComponent.svelte";
+const internalId = htmlid();
+const providedId = useProvidedId();
+const providedDisabled = useDisabled();
+let {
+  ref = $bindable(),
+  value = $bindable(),
+  id = providedId?.value || `headlessui-input-${internalId}`,
+  disabled: theirDisabled = false,
+  autofocus = false,
+  invalid = false,
+  ...theirProps
+} = $props();
+const disabled = $derived(providedDisabled?.value ?? theirDisabled);
+const labelledBy = useLabelledBy();
+const describedBy = useDescribedBy();
+const { isHovered: hover, hoverProps } = $derived(
+  useHover({
+    get disabled() {
+      return disabled;
+    }
+  })
+);
+const { isFocusVisible: focus, focusProps } = $derived(
+  useFocusRing({
+    get autofocus() {
+      return autofocus;
+    }
+  })
+);
+const ourProps = $derived(
+  mergeProps(
+    {
+      id,
+      "aria-labelledby": labelledBy?.value,
+      "aria-describedby": describedBy?.value,
+      "aria-invalid": invalid ? "" : void 0,
+      disabled: disabled || void 0,
+      autofocus
+    },
+    focusProps,
+    hoverProps
+  )
+);
+const slot = $derived({ disabled, invalid, hover, focus, autofocus });
+</script>
+
+<ElementOrComponent {ourProps} {theirProps} {slot} defaultTag={DEFAULT_INPUT_TAG} name="Input" bind:ref bind:value />

package/dist/input/Input.svelte.d.ts

@@ -0,0 +1,52 @@
+import type { ElementType, Props } from "../utils/types.js";
+declare const DEFAULT_INPUT_TAG: "input";
+type InputRenderPropArg = {
+    disabled: boolean;
+    hover: boolean;
+    focus: boolean;
+    autofocus: boolean;
+    invalid: boolean;
+};
+type InputPropsWeControl = "aria-labelledby" | "aria-describedby";
+export type InputProps<TTag extends ElementType = typeof DEFAULT_INPUT_TAG, TValue = string> = Props<TTag, InputRenderPropArg, InputPropsWeControl, {
+    id?: string;
+    value?: TValue;
+    disabled?: boolean;
+    invalid?: boolean;
+    autofocus?: boolean;
+}>;
+declare class __sveltets_Render<TTag extends ElementType = typeof DEFAULT_INPUT_TAG, TValue = string> {
+    props(): {
+        as?: TTag | undefined;
+        value?: TValue | undefined;
+    } & (Exclude<keyof import("../utils/types.js").PropsOf<TTag>, ("as" | "children" | "refName" | "class") | "invalid" | "disabled" | "autofocus" | "value" | "id" | InputPropsWeControl> extends infer T extends keyof import("../utils/types.js").PropsOf<TTag> ? { [P in T]: import("../utils/types.js").PropsOf<TTag>[P]; } : never) & {
+        children?: import("../utils/types.js").Children<InputRenderPropArg> | undefined;
+        ref?: HTMLElement;
+    } & (true extends (import("../utils/types.js").PropsOf<TTag> extends infer T_1 ? T_1 extends import("../utils/types.js").PropsOf<TTag> ? T_1 extends never ? never : "class" extends infer T_2 ? T_2 extends "class" ? T_2 extends keyof T_1 ? true : never : never : never : never : never) ? {
+        class?: import("../utils/types.js").PropsOf<TTag>["class"] | ((bag: InputRenderPropArg) => string) | undefined;
+    } : {}) & {
+        id?: string;
+        value?: TValue | undefined;
+        disabled?: boolean;
+        invalid?: boolean;
+        autofocus?: boolean;
+    };
+    events(): {} & {
+        [evt: string]: CustomEvent<any>;
+    };
+    slots(): {};
+    bindings(): "ref" | "value";
+    exports(): {};
+}
+interface $$IsomorphicComponent {
+    new <TTag extends ElementType = typeof DEFAULT_INPUT_TAG, TValue = string>(options: import('svelte').ComponentConstructorOptions<ReturnType<__sveltets_Render<TTag, TValue>['props']>>): import('svelte').SvelteComponent<ReturnType<__sveltets_Render<TTag, TValue>['props']>, ReturnType<__sveltets_Render<TTag, TValue>['events']>, ReturnType<__sveltets_Render<TTag, TValue>['slots']>> & {
+        $$bindings?: ReturnType<__sveltets_Render<TTag, TValue>['bindings']>;
+    } & ReturnType<__sveltets_Render<TTag, TValue>['exports']>;
+    <TTag extends ElementType = typeof DEFAULT_INPUT_TAG, TValue = string>(internal: unknown, props: ReturnType<__sveltets_Render<TTag, TValue>['props']> & {
+        $$events?: ReturnType<__sveltets_Render<TTag, TValue>['events']>;
+    }): ReturnType<__sveltets_Render<TTag, TValue>['exports']>;
+    z_$$bindings?: ReturnType<__sveltets_Render<any, any>['bindings']>;
+}
+declare const Input: $$IsomorphicComponent;
+type Input<TTag extends ElementType = typeof DEFAULT_INPUT_TAG, TValue = string> = InstanceType<typeof Input<TTag, TValue>>;
+export default Input;

package/dist/input/index.d.ts

@@ -0,0 +1 @@
+export { default as Input, type InputProps } from "./Input.svelte";

package/dist/input/index.js

@@ -0,0 +1 @@
+export { default as Input } from "./Input.svelte";

package/dist/internal/FocusSentinel.svelte

@@ -0,0 +1,45 @@
+<script lang="ts">import { onMount } from "svelte";
+import Hidden, { HiddenFeatures } from "./Hidden.svelte";
+let { onfocus } = $props();
+let enabled = $state(true);
+let mounted = $state(false);
+onMount(() => {
+  mounted = true;
+});
+</script>
+
+{#if enabled}
+  <Hidden
+    as="button"
+    type="button"
+    features={HiddenFeatures.Focusable}
+    onfocus={(event: FocusEvent) => {
+      event.preventDefault()
+      let frame: ReturnType<typeof requestAnimationFrame>
+
+      let tries = 50
+      function forwardFocus() {
+        // Prevent infinite loops
+        if (tries-- <= 0) {
+          if (frame) cancelAnimationFrame(frame)
+          return
+        }
+
+        // Try to move focus to the correct element. This depends on the implementation
+        // of `onFocus` of course since it would be different for each place we use it in.
+        if (onfocus?.()) {
+          cancelAnimationFrame(frame)
+          if (!mounted) return
+
+          enabled = false
+          return
+        }
+
+        // Retry
+        frame = requestAnimationFrame(forwardFocus)
+      }
+
+      frame = requestAnimationFrame(forwardFocus)
+    }}
+  />
+{/if}

package/dist/internal/FocusSentinel.svelte.d.ts

@@ -0,0 +1,20 @@
+interface $$__sveltets_2_IsomorphicComponent<Props extends Record<string, any> = any, Events extends Record<string, any> = any, Slots extends Record<string, any> = any, Exports = {}, Bindings = string> {
+    new (options: import('svelte').ComponentConstructorOptions<Props>): import('svelte').SvelteComponent<Props, Events, Slots> & {
+        $$bindings?: Bindings;
+    } & Exports;
+    (internal: unknown, props: Props & {
+        $$events?: Events;
+        $$slots?: Slots;
+    }): Exports & {
+        $set?: any;
+        $on?: any;
+    };
+    z_$$bindings?: Bindings;
+}
+declare const FocusSentinel: $$__sveltets_2_IsomorphicComponent<{
+    onfocus: () => boolean;
+}, {
+    [evt: string]: CustomEvent<any>;
+}, {}, {}, "">;
+type FocusSentinel = InstanceType<typeof FocusSentinel>;
+export default FocusSentinel;