@pzerelles/headlessui-svelte 2.1.2-next.4 → 2.1.2-next.40

package/dist/focus-trap/FocusTrap.svelte.d.ts

@@ -1,58 +1,16 @@
-import type { ElementType, Props } from "../utils/types.js";
+import type { Props } from "../utils/types.js";
+import { FocusTrapFeatures } from "./FocusTrapFeatures.js";
 type Containers = (() => Iterable<HTMLElement>) | Iterable<HTMLElement>;
-declare let DEFAULT_FOCUS_TRAP_TAG: "div";
-export declare enum FocusTrapFeatures {
-    /** No features enabled for the focus trap. */
-    None = 0,
-    /** Ensure that we move focus initially into the container. */
-    InitialFocus = 1,
-    /** Ensure that pressing `Tab` and `Shift+Tab` is trapped within the container. */
-    TabLock = 2,
-    /** Ensure that programmatically moving focus outside of the container is disallowed. */
-    FocusLock = 4,
-    /** Ensure that we restore the focus when unmounting the focus trap. */
-    RestoreFocus = 8,
-    /** Initial focus should look for the `data-autofocus` */
-    AutoFocus = 16
-}
-type FocusTrapRenderPropArg = {};
-type FocusTrapPropsWeControl = never;
-export type FocusTrapProps<TTag extends ElementType = typeof DEFAULT_FOCUS_TRAP_TAG> = Props<TTag, FocusTrapRenderPropArg, FocusTrapPropsWeControl, {
+declare const DEFAULT_FOCUS_TRAP_TAG: "div";
+export * from "./FocusTrapFeatures.js";
+export type FocusTrapOwnProps = {
+    element?: HTMLElement;
     initialFocus?: HTMLElement;
     initialFocusFallback?: HTMLElement;
     features?: FocusTrapFeatures;
     containers?: Containers;
-}>;
-declare class __sveltets_Render<TTag extends ElementType = typeof DEFAULT_FOCUS_TRAP_TAG> {
-    props(): {
-        as?: TTag | undefined;
-    } & (Exclude<keyof import("../utils/types.js").PropsOf<TTag>, ("as" | "children" | "refName" | "class") | "features" | "containers" | "initialFocus" | "initialFocusFallback"> 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<FocusTrapRenderPropArg> | 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: FocusTrapRenderPropArg) => string) | undefined;
-    } : {}) & {
-        initialFocus?: HTMLElement;
-        initialFocusFallback?: HTMLElement;
-        features?: FocusTrapFeatures;
-        containers?: Containers;
-    };
-    events(): {} & {
-        [evt: string]: CustomEvent<any>;
-    };
-    slots(): {};
-    bindings(): "ref";
-    exports(): {};
-}
-interface $$IsomorphicComponent {
-    new <TTag extends ElementType = typeof DEFAULT_FOCUS_TRAP_TAG>(options: import('svelte').ComponentConstructorOptions<ReturnType<__sveltets_Render<TTag>['props']>>): import('svelte').SvelteComponent<ReturnType<__sveltets_Render<TTag>['props']>, ReturnType<__sveltets_Render<TTag>['events']>, ReturnType<__sveltets_Render<TTag>['slots']>> & {
-        $$bindings?: ReturnType<__sveltets_Render<TTag>['bindings']>;
-    } & ReturnType<__sveltets_Render<TTag>['exports']>;
-    <TTag extends ElementType = typeof DEFAULT_FOCUS_TRAP_TAG>(internal: unknown, props: ReturnType<__sveltets_Render<TTag>['props']> & {
-        $$events?: ReturnType<__sveltets_Render<TTag>['events']>;
-    }): ReturnType<__sveltets_Render<TTag>['exports']>;
-    z_$$bindings?: ReturnType<__sveltets_Render<any>['bindings']>;
-}
-declare const FocusTrap: $$IsomorphicComponent;
-type FocusTrap<TTag extends ElementType = typeof DEFAULT_FOCUS_TRAP_TAG> = InstanceType<typeof FocusTrap<TTag>>;
+};
+export type FocusTrapProps = Props<typeof DEFAULT_FOCUS_TRAP_TAG, {}, FocusTrapOwnProps>;
+declare const FocusTrap: import("svelte").Component<FocusTrapProps, {}, "element">;
+type FocusTrap = ReturnType<typeof FocusTrap>;
 export default FocusTrap;

package/dist/focus-trap/FocusTrapFeatures.d.ts

@@ -0,0 +1,14 @@
+export declare enum FocusTrapFeatures {
+    /** No features enabled for the focus trap. */
+    None = 0,
+    /** Ensure that we move focus initially into the container. */
+    InitialFocus = 1,
+    /** Ensure that pressing `Tab` and `Shift+Tab` is trapped within the container. */
+    TabLock = 2,
+    /** Ensure that programmatically moving focus outside of the container is disallowed. */
+    FocusLock = 4,
+    /** Ensure that we restore the focus when unmounting the focus trap. */
+    RestoreFocus = 8,
+    /** Initial focus should look for the `data-autofocus` */
+    AutoFocus = 16
+}

package/dist/focus-trap/FocusTrapFeatures.js

@@ -0,0 +1,15 @@
+export var FocusTrapFeatures;
+(function (FocusTrapFeatures) {
+    /** No features enabled for the focus trap. */
+    FocusTrapFeatures[FocusTrapFeatures["None"] = 0] = "None";
+    /** Ensure that we move focus initially into the container. */
+    FocusTrapFeatures[FocusTrapFeatures["InitialFocus"] = 1] = "InitialFocus";
+    /** Ensure that pressing `Tab` and `Shift+Tab` is trapped within the container. */
+    FocusTrapFeatures[FocusTrapFeatures["TabLock"] = 2] = "TabLock";
+    /** Ensure that programmatically moving focus outside of the container is disallowed. */
+    FocusTrapFeatures[FocusTrapFeatures["FocusLock"] = 4] = "FocusLock";
+    /** Ensure that we restore the focus when unmounting the focus trap. */
+    FocusTrapFeatures[FocusTrapFeatures["RestoreFocus"] = 8] = "RestoreFocus";
+    /** Initial focus should look for the `data-autofocus` */
+    FocusTrapFeatures[FocusTrapFeatures["AutoFocus"] = 16] = "AutoFocus";
+})(FocusTrapFeatures || (FocusTrapFeatures = {}));

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

@@ -27,7 +27,8 @@ export function useControllable(input, onchange, defaultValue) {
             }
             else {
                 internalValue = value;
-                input.controlledValue = value;
+                if (isControlled)
+                    input.controlledValue = value;
             }
         },
     };

package/dist/hooks/use-did-element-move.svelte.js

@@ -1,23 +1,18 @@
 export function useDidElementMove(options) {
     const { enabled, element } = $derived(options);
-    let elementPosition = $state({ left: 0, top: 0 });
+    let elementPosition = $state();
     $effect(() => {
         if (!element)
             return;
-        let DOMRect = element.getBoundingClientRect();
+        const DOMRect = element.getBoundingClientRect();
         if (DOMRect)
             elementPosition = DOMRect;
     });
     const value = $derived.by(() => {
-        if (element == null)
+        if (element == null || !enabled || element === document.activeElement || elementPosition === undefined)
             return false;
-        if (!enabled)
-            return false;
-        if (element === document.activeElement)
-            return false;
-        let buttonRect = element.getBoundingClientRect();
-        let didElementMove = buttonRect.top !== elementPosition.top || buttonRect.left !== elementPosition.left;
-        return didElementMove;
+        const buttonRect = element.getBoundingClientRect();
+        return buttonRect.top !== elementPosition.top || buttonRect.left !== elementPosition.left;
     });
     return {
         get value() {

package/dist/hooks/use-disabled.d.ts

@@ -1,3 +1,8 @@
 export declare const useDisabled: () => {
-    readonly value: boolean;
+    readonly current: boolean;
+};
+export declare const provideDisabled: (disabled: () => boolean, options?: {
+    ignoreParent?: boolean;
+}) => {
+    readonly current: boolean;
 };

package/dist/hooks/use-disabled.js

@@ -1,9 +1,14 @@
-import { getContext } from "svelte";
+import { getContext, setContext } from "svelte";
 export const useDisabled = () => {
-    const context = getContext("DisabledContext");
-    return {
-        get value() {
-            return context?.value ?? false;
+    return getContext("DisabledContext") ?? { current: false };
+};
+export const provideDisabled = (disabled, options) => {
+    const parentDisabled = options?.ignoreParent ? { current: false } : useDisabled();
+    const context = {
+        get current() {
+            return disabled() || parentDisabled.current;
         },
     };
+    setContext("DisabledContext", context);
+    return context;
 };

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

@@ -1,6 +1,6 @@
 export declare function useEventListener<TType extends keyof WindowEventMap>(params: {
     element: HTMLElement | Document | Window | EventTarget | null | undefined;
     type: TType;
-    listener: (event: WindowEventMap[TType]) => any;
+    listener: (event: WindowEventMap[TType]) => unknown;
     options?: boolean | AddEventListenerOptions;
 }): void;

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

@@ -1,5 +1,7 @@
 export function useEventListener(params) {
-    let { element = window, type, listener, options } = $derived(params);
+    if (typeof window === "undefined")
+        return;
+    const { element = window, type, listener, options } = $derived(params);
     $effect(() => {
         if (!element)
             return;

package/dist/hooks/use-inert-others.svelte.js

@@ -5,7 +5,7 @@ const originals = new Map();
 const counts = new Map();
 function markInert(element) {
     // Increase count
-    let count = counts.get(element) ?? 0;
+    const count = counts.get(element) ?? 0;
     counts.set(element, count + 1);
     // Already marked as inert, no need to do it again
     if (count !== 0)
@@ -22,7 +22,7 @@ function markInert(element) {
 }
 function markNotInert(element) {
     // Decrease counts
-    let count = counts.get(element) ?? 1; // Should always exist
+    const count = counts.get(element) ?? 1; // Should always exist
     if (count === 1)
         counts.delete(element); // We are the last one, so we can delete the count
     else
@@ -30,7 +30,7 @@ function markNotInert(element) {
     // Not the last one, so we don't restore the original values (yet)
     if (count !== 1)
         return;
-    let original = originals.get(element);
+    const original = originals.get(element);
     if (!original)
         return; // Should never happen
     // Restore original values
@@ -70,7 +70,7 @@ function markNotInert(element) {
 export function useInertOthers(options) {
     const { enabled, elements } = $derived(options);
     const { allowed, disallowed } = $derived(elements ?? {});
-    let isTopLayer = useIsTopLayer({
+    const isTopLayer = useIsTopLayer({
         get enabled() {
             return enabled;
         },
@@ -79,25 +79,25 @@ export function useInertOthers(options) {
     $effect(() => {
         if (!isTopLayer.value)
             return;
-        let d = disposables();
+        const d = disposables();
         // Mark all disallowed elements as inert
-        for (let element of disallowed ?? []) {
+        for (const element of disallowed ?? []) {
             if (!element)
                 continue;
             d.add(markInert(element));
         }
         // Mark all siblings of allowed elements (and parents) as inert
-        let allowedElements = allowed ?? [];
-        for (let element of allowedElements) {
+        const allowedElements = allowed ?? [];
+        for (const element of allowedElements) {
             if (!element)
                 continue;
-            let ownerDocument = getOwnerDocument(element);
+            const ownerDocument = getOwnerDocument(element);
             if (!ownerDocument)
                 continue;
             let parent = element.parentElement;
             while (parent && parent !== ownerDocument.body) {
                 // Mark all siblings as inert
-                for (let node of parent.children) {
+                for (const node of parent.children) {
                     // If the node contains any of the elements we should not mark it as inert
                     // because it would make the elements unreachable.
                     if (node.tagName.toLowerCase() === "svelte:fragment" || allowedElements.some((el) => node.contains(el)))

package/dist/hooks/use-resolve-button-type.svelte.js

@@ -1,4 +1,3 @@
-import { untrack } from "svelte";
 function resolveType(props) {
     if (props.type)
         return props.type;

package/dist/hooks/use-root-containers.svelte.d.ts

@@ -1,8 +1,8 @@
 export { default as MainTreeProvider, useMainTreeNode } from "../internal/MainTreeProvider.svelte";
 export declare function useRootContainers(options?: {
-    defaultContainers?: (HTMLElement | null)[];
+    defaultContainers?: (HTMLElement | undefined | null)[];
     portals?: HTMLElement[];
-    mainTreeNode?: HTMLElement | null;
+    mainTreeNode?: HTMLElement | undefined | null;
 }): {
     readonly resolvedContainers: HTMLElement[];
     contains: (element: HTMLElement) => boolean;

package/dist/hooks/use-root-containers.svelte.js

@@ -6,21 +6,21 @@ export function useRootContainers(options = {}) {
     mainTreeNode, } = $derived(options);
     const ownerDocument = $derived(getOwnerDocument(mainTreeNode));
     const resolvedContainers = $derived.by(() => {
-        let containers = [];
+        const containers = [];
         // Resolve default containers
-        for (let container of defaultContainers) {
-            if (container === null)
+        for (const container of defaultContainers) {
+            if (!container)
                 continue;
             containers.push(container);
         }
         // Resolve portal containers
         if (portals) {
-            for (let portal of portals) {
+            for (const portal of portals) {
                 containers.push(portal);
             }
         }
         // Resolve third party (root) containers
-        for (let container of ownerDocument?.querySelectorAll("html > *, body > *") ?? []) {
+        for (const container of ownerDocument?.querySelectorAll("html > *, body > *") ?? []) {
             if (container === document.body)
                 continue; // Skip `<body>`
             if (container === document.head)

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

@@ -6,7 +6,7 @@ export var Direction;
 })(Direction || (Direction = {}));
 export function useTabDirection() {
     let direction = $state(Direction.Forwards);
-    let enabled = true;
+    const enabled = true;
     useWindowEvent({
         enabled,
         type: "keydown",

package/dist/index.d.ts

@@ -11,10 +11,13 @@ export * from "./label/index.js";
 export * from "./legend/index.js";
 export * from "./listbox/index.js";
 export * from "./menu/index.js";
+export * from "./popover/index.js";
+export * from "./radio-group/index.js";
+export * from "./select/index.js";
 export * from "./switch/index.js";
 export * from "./tabs/index.js";
 export * from "./textarea/index.js";
 export * from "./transition/index.js";
+export * from "./utils/index.js";
 export * from "./hooks/use-id.js";
-export * from "./utils/types.js";
-export { mergeProps } from "./utils/render.js";
+export * from "./hooks/use-disabled.js";

package/dist/index.js

@@ -11,10 +11,13 @@ export * from "./label/index.js";
 export * from "./legend/index.js";
 export * from "./listbox/index.js";
 export * from "./menu/index.js";
+export * from "./popover/index.js";
+export * from "./radio-group/index.js";
+export * from "./select/index.js";
 export * from "./switch/index.js";
 export * from "./tabs/index.js";
 export * from "./textarea/index.js";
 export * from "./transition/index.js";
+export * from "./utils/index.js";
 export * from "./hooks/use-id.js";
-export * from "./utils/types.js";
-export { mergeProps } from "./utils/render.js";
+export * from "./hooks/use-disabled.js";

package/dist/input/Input.svelte

@@ -1,9 +1,10 @@
 <script lang="ts" module>
-  import type { ElementType, Props } from "../utils/types.js"
+  import type { Props } from "../utils/types.js"
+  import type { SvelteHTMLElements } from "svelte/elements"
 
   const DEFAULT_INPUT_TAG = "input" as const
 
-  type InputRenderPropArg = {
+  export type InputRenderPropArg = {
     disabled: boolean
     hover: boolean
     focus: boolean
@@ -12,24 +13,22 @@
   }
   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
-    }
-  >
+  export type InputOwnProps<TValue = string> = {
+    element?: HTMLElement
+    id?: string
+    value?: TValue
+    disabled?: boolean
+    invalid?: boolean
+    autofocus?: boolean
+  }
+
+  export type InputProps<TValue = string> = Props<typeof DEFAULT_INPUT_TAG, InputRenderPropArg, InputOwnProps<TValue>>
 </script>
 
-<script lang="ts" generics="TTag extends ElementType = typeof DEFAULT_INPUT_TAG, TValue = string">
+<script lang="ts" generics="TValue = string">
   import { htmlid } from "../utils/id.js"
   import { useDisabled } from "../hooks/use-disabled.js"
-  import { useProvidedId } from "../internal/id.js"
+  import { useProvidedId } from "../utils/id.js"
   import { useLabelledBy } from "../label/context.svelte.js"
   import { useDescribedBy } from "../description/context.svelte.js"
   import { useHover } from "../hooks/use-hover.svelte.js"
@@ -42,15 +41,15 @@
   const providedDisabled = useDisabled()
 
   let {
-    ref = $bindable(),
+    element = $bindable(),
     value = $bindable(),
-    id = providedId?.value || `headlessui-input-${internalId}`,
+    id = providedId || `headlessui-input-${internalId}`,
     disabled: theirDisabled = false,
     autofocus = false,
     invalid = false,
     ...theirProps
-  }: { as?: TTag; value?: TValue } & InputProps<TTag, TValue> = $props()
-  const disabled = $derived(providedDisabled?.value ?? theirDisabled)
+  }: InputProps<TValue> = $props()
+  const disabled = $derived(providedDisabled.current || theirDisabled)
 
   const labelledBy = useLabelledBy()
   const describedBy = useDescribedBy()
@@ -88,4 +87,12 @@
   const slot = $derived({ disabled, invalid, hover, focus, autofocus } satisfies InputRenderPropArg)
 </script>
 
-<ElementOrComponent {ourProps} {theirProps} {slot} defaultTag={DEFAULT_INPUT_TAG} name="Input" bind:ref bind:value />
+<ElementOrComponent
+  {ourProps}
+  {theirProps}
+  {slot}
+  defaultTag={DEFAULT_INPUT_TAG}
+  name="Input"
+  bind:element
+  bind:value
+/>

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

@@ -1,52 +1,35 @@
-import type { ElementType, Props } from "../utils/types.js";
+import type { Props } from "../utils/types.js";
 declare const DEFAULT_INPUT_TAG: "input";
-type InputRenderPropArg = {
+export 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, {
+export type InputOwnProps<TValue = string> = {
+    element?: HTMLElement;
     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>;
-    };
+};
+export type InputProps<TValue = string> = Props<typeof DEFAULT_INPUT_TAG, InputRenderPropArg, InputOwnProps<TValue>>;
+declare class __sveltets_Render<TValue = string> {
+    props(): InputProps<TValue>;
+    events(): {};
     slots(): {};
-    bindings(): "ref" | "value";
+    bindings(): "element" | "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']>;
+    new <TValue = string>(options: import('svelte').ComponentConstructorOptions<ReturnType<__sveltets_Render<TValue>['props']>>): import('svelte').SvelteComponent<ReturnType<__sveltets_Render<TValue>['props']>, ReturnType<__sveltets_Render<TValue>['events']>, ReturnType<__sveltets_Render<TValue>['slots']>> & {
+        $$bindings?: ReturnType<__sveltets_Render<TValue>['bindings']>;
+    } & ReturnType<__sveltets_Render<TValue>['exports']>;
+    <TValue = string>(internal: unknown, props: ReturnType<__sveltets_Render<TValue>['props']> & {}): ReturnType<__sveltets_Render<TValue>['exports']>;
+    z_$$bindings?: ReturnType<__sveltets_Render<any>['bindings']>;
 }
 declare const Input: $$IsomorphicComponent;
-type Input<TTag extends ElementType = typeof DEFAULT_INPUT_TAG, TValue = string> = InstanceType<typeof Input<TTag, TValue>>;
+type Input<TValue = string> = InstanceType<typeof Input<TValue>>;
 export default Input;

package/dist/input/index.d.ts

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

package/dist/input/index.js

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

package/dist/internal/FloatingProvider.svelte

@@ -0,0 +1,17 @@
+<script lang="ts" module>
+</script>
+
+<script lang="ts">
+  import type { Snippet } from "svelte"
+  import { useFloatingProvider } from "./floating-provider.svelte.js"
+
+  const { children, enabled = true }: { children: Snippet; enabled?: boolean } = $props()
+
+  useFloatingProvider({
+    get enabled() {
+      return enabled
+    },
+  })
+</script>
+
+{#if children}{@render children()}{/if}

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

@@ -0,0 +1,8 @@
+import type { Snippet } from "svelte";
+type $$ComponentProps = {
+    children: Snippet;
+    enabled?: boolean;
+};
+declare const FloatingProvider: import("svelte").Component<$$ComponentProps, {}, "">;
+type FloatingProvider = ReturnType<typeof FloatingProvider>;
+export default FloatingProvider;

package/dist/internal/FocusSentinel.svelte

@@ -14,40 +14,41 @@
   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)
+  const handleFocus = (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)
+  }
+</script>
+
+{#if enabled}
+  <Hidden asChild features={HiddenFeatures.Focusable}>
+    {#snippet children({ props })}
+      <button {...props} type="button" onfocus={handleFocus}>&zwnj;</button>
+    {/snippet}
+  </Hidden>
 {/if}

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

@@ -1,20 +1,6 @@
-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<{
+interface FocusSentinelProps {
     onfocus: () => boolean;
-}, {
-    [evt: string]: CustomEvent<any>;
-}, {}, {}, "">;
-type FocusSentinel = InstanceType<typeof FocusSentinel>;
+}
+declare const FocusSentinel: import("svelte").Component<FocusSentinelProps, {}, "">;
+type FocusSentinel = ReturnType<typeof FocusSentinel>;
 export default FocusSentinel;