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

package/dist/transition/InternalTransitionChild.svelte.d.ts

@@ -0,0 +1,55 @@
+import type { ElementType } from "../utils/types.js";
+import type { TransitionRootProps } from "./Transition.svelte";
+import { DEFAULT_TRANSITION_CHILD_TAG } from "./TransitionChild.svelte";
+/**
+ * Check if we should forward the ref to the child element or not. This is to
+ * prevent crashes when the `as` prop is a Fragment _and_ the component just acts
+ * as a state container (aka, there is no actual transition happening).
+ *
+ * E.g.:
+ *
+ * ```tsx
+ * <Transition show={true}>
+ *   <Transition.Child enter="duration-100"><div>Child 1</div></Transition.Child>
+ *   <Transition.Child enter="duration-200"><div>Child 2</div></Transition.Child>
+ * </Transition>
+ * ```
+ *
+ * In this scenario, the child components are transitioning, but the
+ * `Transition` parent, which is a `Fragment`, is not. So we should not forward
+ * the ref to the `Fragment`.
+ */
+export declare function shouldForwardRef<TTag extends ElementType = typeof DEFAULT_TRANSITION_CHILD_TAG>(props: TransitionRootProps<TTag>): boolean;
+declare class __sveltets_Render<TTag extends ElementType = typeof DEFAULT_TRANSITION_CHILD_TAG> {
+    props(): {
+        as?: TTag | undefined;
+    } & (Exclude<keyof import("../utils/types.js").PropsOf<TTag>, ("as" | "children" | "refName" | "class") | "unmount" | "transition" | keyof import("./context.svelte.js").TransitionClasses | keyof import("./context.svelte.js").TransitionEvents | "appear"> 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<HTMLElement> | 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: HTMLElement) => string) | undefined;
+    } : {}) & {
+        unmount?: boolean | undefined;
+    } & import("./context.svelte.js").TransitionClasses & import("./context.svelte.js").TransitionEvents & {
+        transition?: boolean;
+        appear?: boolean;
+    };
+    events(): {} & {
+        [evt: string]: CustomEvent<any>;
+    };
+    slots(): {};
+    bindings(): "ref";
+    exports(): {};
+}
+interface $$IsomorphicComponent {
+    new <TTag extends ElementType = typeof DEFAULT_TRANSITION_CHILD_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_TRANSITION_CHILD_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 InternalTransitionChild: $$IsomorphicComponent;
+type InternalTransitionChild<TTag extends ElementType = typeof DEFAULT_TRANSITION_CHILD_TAG> = InstanceType<typeof InternalTransitionChild<TTag>>;
+export default InternalTransitionChild;

package/dist/transition/Transition.svelte

@@ -0,0 +1,89 @@
+<script lang="ts" module>import { State, useOpenClosed } from "../internal/open-closed.js";
+import { setContext, untrack } from "svelte";
+import {
+  DEFAULT_TRANSITION_CHILD_TAG,
+  TransitionChildRenderFeatures
+} from "./TransitionChild.svelte";
+</script>
+
+<script lang="ts" generics="TTag extends ElementType = typeof DEFAULT_TRANSITION_CHILD_TAG">import InternalTransitionChild, { shouldForwardRef } from "./InternalTransitionChild.svelte";
+import ElementOrComponent from "../utils/ElementOrComponent.svelte";
+import {
+  hasChildren,
+  TreeStates,
+  useNesting
+} from "./context.svelte.js";
+let { ref = $bindable(), show, ..._props } = $props();
+const { appear = false, unmount = true, ...theirProps } = $derived(_props);
+const requiresRef = shouldForwardRef(_props);
+const usesOpenClosedState = useOpenClosed();
+if (show === void 0 && usesOpenClosedState !== null) {
+  show = (usesOpenClosedState.value & State.Open) === State.Open;
+}
+if (show === void 0) {
+  throw new Error("A <Transition /> is used but it is missing a `show={true | false}` prop.");
+}
+let _state = $state(show ? TreeStates.Visible : TreeStates.Hidden);
+const nestingBag = useNesting({
+  done: () => {
+    if (show) return;
+    _state = TreeStates.Hidden;
+  }
+});
+let initial = $state(true);
+let changes = $state([show]);
+$effect(() => {
+  if (untrack(() => initial) === false) {
+    return;
+  }
+  if (changes[changes.length - 1] !== show) {
+    changes.push(show);
+    initial = false;
+  }
+});
+$effect(() => {
+  if (show) {
+    _state = TreeStates.Visible;
+  } else if (!hasChildren(nestingBag) && untrack(() => ref)) {
+    _state = TreeStates.Hidden;
+  }
+});
+const sharedProps = $derived({ unmount });
+const beforeEnter = () => {
+  if (initial) initial = false;
+  _props.beforeEnter?.();
+};
+const beforeLeave = () => {
+  if (initial) initial = false;
+  _props.beforeLeave?.();
+};
+setContext("NestingContext", nestingBag);
+setContext("TransitionContext", {
+  get show() {
+    return show;
+  },
+  get appear() {
+    return appear;
+  },
+  get initial() {
+    return initial;
+  }
+});
+const InternalChild = InternalTransitionChild;
+</script>
+
+{#snippet children()}
+  <InternalChild bind:ref {...sharedProps} {...theirProps} {beforeEnter} {beforeLeave} />
+{/snippet}
+
+<ElementOrComponent
+  ourProps={{
+    ...sharedProps,
+    children,
+  }}
+  theirProps={{}}
+  defaultTag={"svelte:fragment"}
+  features={TransitionChildRenderFeatures}
+  visible={_state === TreeStates.Visible}
+  name="Transition"
+/>

package/dist/transition/Transition.svelte.d.ts

@@ -0,0 +1,42 @@
+import type { ElementType } from "../utils/types.js";
+import { type TransitionChildProps, DEFAULT_TRANSITION_CHILD_TAG } from "./TransitionChild.svelte";
+export type TransitionRootProps<TTag extends ElementType = typeof DEFAULT_TRANSITION_CHILD_TAG> = TransitionChildProps<TTag> & {
+    show?: boolean;
+    appear?: boolean;
+};
+declare class __sveltets_Render<TTag extends ElementType = typeof DEFAULT_TRANSITION_CHILD_TAG> {
+    props(): {
+        as?: TTag | undefined;
+    } & (Exclude<keyof import("../utils/types.js").PropsOf<TTag>, ("as" | "children" | "refName" | "class") | "unmount" | "transition" | keyof import("./context.svelte.js").TransitionClasses | keyof import("./context.svelte.js").TransitionEvents | "appear"> 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<HTMLElement> | 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: HTMLElement) => string) | undefined;
+    } : {}) & {
+        unmount?: boolean | undefined;
+    } & import("./context.svelte.js").TransitionClasses & import("./context.svelte.js").TransitionEvents & {
+        transition?: boolean;
+        appear?: boolean;
+    } & {
+        show?: boolean;
+        appear?: boolean;
+    };
+    events(): {} & {
+        [evt: string]: CustomEvent<any>;
+    };
+    slots(): {};
+    bindings(): "ref";
+    exports(): {};
+}
+interface $$IsomorphicComponent {
+    new <TTag extends ElementType = typeof DEFAULT_TRANSITION_CHILD_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_TRANSITION_CHILD_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 Transition: $$IsomorphicComponent;
+type Transition<TTag extends ElementType = typeof DEFAULT_TRANSITION_CHILD_TAG> = InstanceType<typeof Transition<TTag>>;
+export default Transition;

package/dist/transition/TransitionChild.svelte

@@ -0,0 +1,16 @@
+<script lang="ts" module>import { RenderFeatures } from "../utils/render.js";
+export const DEFAULT_TRANSITION_CHILD_TAG = "svelte:fragment";
+export const TransitionChildRenderFeatures = RenderFeatures.RenderStrategy;
+</script>
+
+<script lang="ts" generics="TTag extends ElementType = typeof DEFAULT_TRANSITION_CHILD_TAG">import { useOpenClosed } from "../internal/open-closed.js";
+import { getContext } from "svelte";
+import InternalTransitionChild from "./InternalTransitionChild.svelte";
+import Transition from "./Transition.svelte";
+const hasTransitionContext = !!getContext("TransitionContext");
+const hasOpenClosedContext = useOpenClosed() !== null;
+let { ref = $bindable(), as, ...props } = $props();
+const TransitionRootOrChild = !hasTransitionContext && hasOpenClosedContext ? Transition : InternalTransitionChild;
+</script>
+
+<TransitionRootOrChild bind:ref {...props} />

package/dist/transition/TransitionChild.svelte.d.ts

@@ -0,0 +1,44 @@
+import type { ElementType, Props } from "../utils/types.js";
+import { RenderFeatures, type PropsForFeatures } from "../utils/render.js";
+import type { TransitionEvents, TransitionClasses } from "./context.svelte.js";
+type TransitionChildPropsWeControl = never;
+export type TransitionChildProps<TTag extends ElementType> = Props<TTag, TransitionChildRenderPropArg, TransitionChildPropsWeControl, PropsForFeatures<typeof TransitionChildRenderFeatures> & TransitionClasses & TransitionEvents & {
+    transition?: boolean;
+    appear?: boolean;
+}>;
+export declare const DEFAULT_TRANSITION_CHILD_TAG = "svelte:fragment";
+export type TransitionChildRenderPropArg = HTMLElement;
+export declare const TransitionChildRenderFeatures = RenderFeatures.RenderStrategy;
+declare class __sveltets_Render<TTag extends ElementType = typeof DEFAULT_TRANSITION_CHILD_TAG> {
+    props(): {
+        as?: TTag | undefined;
+    } & (Exclude<keyof import("../utils/types.js").PropsOf<TTag>, ("as" | "children" | "refName" | "class") | "unmount" | "transition" | keyof TransitionClasses | keyof TransitionEvents | "appear"> 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<HTMLElement> | 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: HTMLElement) => string) | undefined;
+    } : {}) & {
+        unmount?: boolean | undefined;
+    } & TransitionClasses & TransitionEvents & {
+        transition?: boolean;
+        appear?: boolean;
+    };
+    events(): {} & {
+        [evt: string]: CustomEvent<any>;
+    };
+    slots(): {};
+    bindings(): "ref";
+    exports(): {};
+}
+interface $$IsomorphicComponent {
+    new <TTag extends ElementType = typeof DEFAULT_TRANSITION_CHILD_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_TRANSITION_CHILD_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 TransitionChild: $$IsomorphicComponent;
+type TransitionChild<TTag extends ElementType = typeof DEFAULT_TRANSITION_CHILD_TAG> = InstanceType<typeof TransitionChild<TTag>>;
+export default TransitionChild;

package/dist/transition/context.svelte.d.ts

@@ -0,0 +1,64 @@
+import type { MutableRefObject } from "../utils/ref.svelte.js";
+import { RenderStrategy } from "../utils/render.js";
+type ContainerElement = MutableRefObject<HTMLElement | null>;
+export type TransitionDirection = "enter" | "leave";
+export interface TransitionContextValues {
+    show: boolean;
+    appear: boolean;
+    initial: boolean;
+}
+export declare enum TreeStates {
+    Visible = "visible",
+    Hidden = "hidden"
+}
+export interface TransitionClasses {
+    enter?: string;
+    enterFrom?: string;
+    enterTo?: string;
+    /**
+     * @deprecated The `enterTo` and `leaveTo` classes stay applied after the transition has finished.
+     */
+    entered?: string;
+    leave?: string;
+    leaveFrom?: string;
+    leaveTo?: string;
+}
+export interface TransitionEvents {
+    beforeEnter?: () => void;
+    afterEnter?: () => void;
+    beforeLeave?: () => void;
+    afterLeave?: () => void;
+}
+export declare function useTransitionContext(): TransitionContextValues;
+export declare function useParentNesting(): NestingContextValues;
+export interface NestingContextValues {
+    children: {
+        el: ContainerElement;
+        state: TreeStates;
+    }[];
+    register: (el: ContainerElement) => () => void;
+    unregister: (el: ContainerElement, strategy?: RenderStrategy) => void;
+    onStart: (el: ContainerElement, direction: TransitionDirection, cb: () => void) => void;
+    onStop: (el: ContainerElement, direction: TransitionDirection, cb: () => void) => void;
+    chains: Record<TransitionDirection, [container: ContainerElement, promise: Promise<void>][]>;
+    wait: Promise<void>;
+}
+export declare function hasChildren(bag: NestingContextValues["children"] | {
+    children: NestingContextValues["children"];
+}): boolean;
+export declare function useNesting(options: {
+    done?: () => void;
+    parent?: NestingContextValues;
+}): {
+    readonly children: {
+        el: ContainerElement;
+        state: TreeStates;
+    }[];
+    register: (container: ContainerElement) => () => void;
+    unregister: (container: ContainerElement, strategy?: RenderStrategy) => void;
+    onStart: (container: ContainerElement, direction: TransitionDirection, cb: (direction: TransitionDirection) => void) => void;
+    onStop: (_container: ContainerElement, direction: TransitionDirection, cb: (direction: TransitionDirection) => void) => void;
+    readonly wait: Promise<void>;
+    readonly chains: Record<TransitionDirection, [identifier: ContainerElement, promise: Promise<void>][]>;
+};
+export {};

package/dist/transition/context.svelte.js

@@ -0,0 +1,120 @@
+import { useIsMounted } from "../hooks/use-is-mounted.svelte.js";
+import { useDisposables } from "../utils/disposables.js";
+import { match } from "../utils/match.js";
+import { RenderStrategy } from "../utils/render.js";
+import { getContext } from "svelte";
+export var TreeStates;
+(function (TreeStates) {
+    TreeStates["Visible"] = "visible";
+    TreeStates["Hidden"] = "hidden";
+})(TreeStates || (TreeStates = {}));
+export function useTransitionContext() {
+    const context = getContext("TransitionContext");
+    if (context === null) {
+        throw new Error("A <Transition.Child /> is used but it is missing a parent <Transition /> or <Transition.Root />.");
+    }
+    return context;
+}
+export function useParentNesting() {
+    let context = getContext("NestingContext");
+    if (context === null) {
+        throw new Error("A <Transition.Child /> is used but it is missing a parent <Transition /> or <Transition.Root />.");
+    }
+    return context;
+}
+export function hasChildren(bag) {
+    if ("children" in bag)
+        return hasChildren(bag.children);
+    return bag.filter(({ state }) => state === TreeStates.Visible).length > 0;
+}
+export function useNesting(options) {
+    const { done, parent } = $derived(options);
+    let transitionableChildren = $state([]);
+    const mounted = useIsMounted();
+    const d = useDisposables();
+    const unregister = (container, strategy = RenderStrategy.Hidden) => {
+        const idx = transitionableChildren.findIndex(({ el }) => el === container);
+        if (idx === -1)
+            return;
+        match(strategy, {
+            [RenderStrategy.Unmount]() {
+                transitionableChildren.splice(idx, 1);
+            },
+            [RenderStrategy.Hidden]() {
+                transitionableChildren[idx].state = TreeStates.Hidden;
+            },
+        });
+        d.microTask(() => {
+            if (!hasChildren(transitionableChildren) && mounted.current) {
+                done?.();
+            }
+        });
+    };
+    const register = (container) => {
+        const child = transitionableChildren.find(({ el }) => el === container);
+        if (!child) {
+            transitionableChildren.push({ el: container, state: TreeStates.Visible });
+        }
+        else if (child.state !== TreeStates.Visible) {
+            child.state = TreeStates.Visible;
+        }
+        return () => unregister(container, RenderStrategy.Unmount);
+    };
+    let todos = $state([]);
+    let wait = $state(Promise.resolve());
+    let chains = $state({
+        enter: [],
+        leave: [],
+    });
+    let onStart = (container, direction, cb) => {
+        // Clear out all existing todos
+        todos.splice(0);
+        // Remove all existing promises for the current container from the parent because we can
+        // ignore those and use only the new one.
+        if (parent) {
+            parent.chains[direction] = parent.chains[direction].filter(([containerInParent]) => containerInParent !== container);
+        }
+        // Wait until our own transition is done
+        parent?.chains[direction].push([
+            container,
+            new Promise((resolve) => {
+                todos.push(resolve);
+            }),
+        ]);
+        // Wait until our children are done
+        parent?.chains[direction].push([
+            container,
+            new Promise((resolve) => {
+                Promise.all(chains[direction].map(([_container, promise]) => promise)).then(() => resolve());
+            }),
+        ]);
+        if (direction === "enter") {
+            wait = wait.then(() => parent?.wait).then(() => cb(direction));
+        }
+        else {
+            cb(direction);
+        }
+    };
+    const onStop = (_container, direction, cb) => {
+        Promise.all(chains[direction].splice(0).map(([_container, promise]) => promise)) // Wait for my children
+            .then(() => {
+            todos.shift()?.(); // I'm ready
+        })
+            .then(() => cb(direction));
+    };
+    return {
+        get children() {
+            return transitionableChildren;
+        },
+        register,
+        unregister,
+        onStart,
+        onStop,
+        get wait() {
+            return wait;
+        },
+        get chains() {
+            return chains;
+        },
+    };
+}

package/dist/transition/index.d.ts

@@ -0,0 +1,2 @@
+export { default as Transition, type TransitionRootProps } from "./Transition.svelte";
+export { default as TransitionChild, type TransitionChildProps } from "./TransitionChild.svelte";

package/dist/transition/index.js

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

package/dist/utils/ElementOrComponent.svelte

@@ -0,0 +1,26 @@
+<script lang="ts" generics="TFeature extends RenderFeatures, TTag extends ElementType, TSlot, TValue">import { mergePropsAdvanced, RenderFeatures, RenderStrategy } from "./render.js";
+import Generic from "./Generic.svelte";
+let {
+  ourProps,
+  theirProps,
+  slots,
+  slot = slots,
+  defaultTag,
+  features,
+  visible = true,
+  name,
+  ref = $bindable(),
+  value = $bindable(),
+  checked = $bindable()
+} = $props();
+const featureFlags = $derived(features ?? RenderFeatures.None);
+const { static: isStatic = false, unmount = true, ...rest } = $derived(mergePropsAdvanced(theirProps, ourProps ?? {}));
+const render = $derived(
+  visible || featureFlags & RenderFeatures.Static && isStatic || featureFlags & RenderFeatures.RenderStrategy && !unmount
+);
+const hiddenProps = $derived(
+  !visible && !(featureFlags & RenderFeatures.Static) && featureFlags & RenderFeatures.RenderStrategy && !unmount ? { hidden: true, style: "display: none;" } : {}
+);
+</script>
+
+{#if render}<Generic {...rest} {...hiddenProps} {slot} tag={defaultTag} {name} bind:ref bind:value bind:checked />{/if}

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

@@ -0,0 +1,56 @@
+import type { ElementType } from "./types.js";
+import { RenderFeatures } from "./render.js";
+declare class __sveltets_Render<TFeature extends RenderFeatures, TTag extends ElementType, TSlot, TValue> {
+    props(): {
+        ourProps?: Expand<{
+            [x: string]: any;
+            [x: number]: any;
+        } & {
+            children?: import("./types.js").Children<TSlot> | undefined;
+            ref?: HTMLElement;
+        } & {
+            class?: any;
+        } & Expand<((TFeature extends RenderFeatures.Static ? {
+            static?: boolean;
+        } : {}) extends infer T ? T extends (TFeature extends RenderFeatures.Static ? {
+            static?: boolean;
+        } : {}) ? T extends any ? (x: T) => any : never : never : never) | ((TFeature extends RenderFeatures.RenderStrategy ? {
+            unmount?: boolean;
+        } : {}) extends infer T_1 ? T_1 extends (TFeature extends RenderFeatures.RenderStrategy ? {
+            unmount?: boolean;
+        } : {}) ? T_1 extends any ? (x: T_1) => any : never : never : never) extends (x: infer R) => any ? R : never>> | undefined;
+        theirProps: {
+            as?: TTag | undefined;
+            children?: import("./types.js").Children<TSlot> | undefined;
+            ref?: HTMLElement | undefined;
+            class?: any;
+        };
+        slot?: TSlot | undefined;
+        slots?: TSlot | undefined;
+        defaultTag: ElementType;
+        features?: TFeature | undefined;
+        visible?: boolean;
+        name: string;
+        ref?: HTMLElement;
+        value?: TValue | undefined;
+        checked?: boolean;
+    };
+    events(): {} & {
+        [evt: string]: CustomEvent<any>;
+    };
+    slots(): {};
+    bindings(): "ref" | "value" | "checked";
+    exports(): {};
+}
+interface $$IsomorphicComponent {
+    new <TFeature extends RenderFeatures, TTag extends ElementType, TSlot, TValue>(options: import('svelte').ComponentConstructorOptions<ReturnType<__sveltets_Render<TFeature, TTag, TSlot, TValue>['props']>>): import('svelte').SvelteComponent<ReturnType<__sveltets_Render<TFeature, TTag, TSlot, TValue>['props']>, ReturnType<__sveltets_Render<TFeature, TTag, TSlot, TValue>['events']>, ReturnType<__sveltets_Render<TFeature, TTag, TSlot, TValue>['slots']>> & {
+        $$bindings?: ReturnType<__sveltets_Render<TFeature, TTag, TSlot, TValue>['bindings']>;
+    } & ReturnType<__sveltets_Render<TFeature, TTag, TSlot, TValue>['exports']>;
+    <TFeature extends RenderFeatures, TTag extends ElementType, TSlot, TValue>(internal: unknown, props: ReturnType<__sveltets_Render<TFeature, TTag, TSlot, TValue>['props']> & {
+        $$events?: ReturnType<__sveltets_Render<TFeature, TTag, TSlot, TValue>['events']>;
+    }): ReturnType<__sveltets_Render<TFeature, TTag, TSlot, TValue>['exports']>;
+    z_$$bindings?: ReturnType<__sveltets_Render<any, any, any, any>['bindings']>;
+}
+declare const ElementOrComponent: $$IsomorphicComponent;
+type ElementOrComponent<TFeature extends RenderFeatures, TTag extends ElementType, TSlot, TValue> = InstanceType<typeof ElementOrComponent<TFeature, TTag, TSlot, TValue>>;
+export default ElementOrComponent;

package/dist/utils/Generic.svelte

@@ -0,0 +1,44 @@
+<script lang="ts" generics="TTag extends keyof SvelteHTMLProps, TSlot, TValue">import { stateFromSlot } from "./state.js";
+let {
+  slot = {},
+  tag,
+  name,
+  ref = $bindable(),
+  value = $bindable(),
+  checked = $bindable(),
+  children,
+  as = tag,
+  unmount,
+  static: isStatic,
+  ...props
+} = $props();
+const resolvedClass = $derived(
+  typeof props.class === "function" ? props.class(slot) : props.class
+);
+</script>
+
+{#if as === "svelte:fragment"}
+  {#if children}{@render children(slot, {
+      ...props,
+      ...(resolvedClass ? { class: resolvedClass } : {}),
+      ...stateFromSlot(slot),
+    })}{/if}
+{:else if children}
+  {#if as === "select"}
+    <select bind:this={ref} {...props} class={resolvedClass} {...stateFromSlot(slot)} bind:value>
+      {@render children(slot, {})}
+    </select>
+  {:else}
+    <svelte:element this={as} bind:this={ref} {...props} class={resolvedClass} {...stateFromSlot(slot)}>
+      {@render children(slot, {})}
+    </svelte:element>
+  {/if}
+{:else if as === "input" && props.type === "checkbox"}
+  <input type="checkbox" bind:this={ref} {...props} class={resolvedClass} {...stateFromSlot(slot)} bind:checked />
+{:else if as === "input"}
+  <input bind:this={ref} {...props} class={resolvedClass} {...stateFromSlot(slot)} bind:value />
+{:else if as === "textarea"}
+  <textarea bind:this={ref} {...props} class={resolvedClass} {...stateFromSlot(slot)} bind:value></textarea>
+{:else}
+  <svelte:element this={as} bind:this={ref} {...props} class={resolvedClass} {...stateFromSlot(slot)} />
+{/if}

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

@@ -0,0 +1,35 @@
+import type { ElementType, SvelteHTMLProps } from "./types.js";
+declare class __sveltets_Render<TTag extends keyof SvelteHTMLProps, TSlot, TValue> {
+    props(): {
+        as?: TTag | undefined;
+        slot: TSlot;
+        tag: ElementType;
+        name: string;
+        ref?: HTMLElement;
+        value?: TValue | undefined;
+        checked?: boolean;
+    } & (Exclude<keyof import("./types.js").PropsOf<TTag>, "as" | "children" | "refName" | "class"> extends infer T extends keyof import("./types.js").PropsOf<TTag> ? { [P in T]: import("./types.js").PropsOf<TTag>[P]; } : never) & {
+        children?: import("./types.js").Children<TSlot> | undefined;
+        ref?: HTMLElement;
+    } & (true extends (import("./types.js").PropsOf<TTag> extends infer T_1 ? T_1 extends import("./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("./types.js").PropsOf<TTag>["class"] | ((bag: TSlot) => string) | undefined;
+    } : {});
+    events(): {} & {
+        [evt: string]: CustomEvent<any>;
+    };
+    slots(): {};
+    bindings(): "ref" | "value" | "checked";
+    exports(): {};
+}
+interface $$IsomorphicComponent {
+    new <TTag extends keyof SvelteHTMLProps, TSlot, TValue>(options: import('svelte').ComponentConstructorOptions<ReturnType<__sveltets_Render<TTag, TSlot, TValue>['props']>>): import('svelte').SvelteComponent<ReturnType<__sveltets_Render<TTag, TSlot, TValue>['props']>, ReturnType<__sveltets_Render<TTag, TSlot, TValue>['events']>, ReturnType<__sveltets_Render<TTag, TSlot, TValue>['slots']>> & {
+        $$bindings?: ReturnType<__sveltets_Render<TTag, TSlot, TValue>['bindings']>;
+    } & ReturnType<__sveltets_Render<TTag, TSlot, TValue>['exports']>;
+    <TTag extends keyof SvelteHTMLProps, TSlot, TValue>(internal: unknown, props: ReturnType<__sveltets_Render<TTag, TSlot, TValue>['props']> & {
+        $$events?: ReturnType<__sveltets_Render<TTag, TSlot, TValue>['events']>;
+    }): ReturnType<__sveltets_Render<TTag, TSlot, TValue>['exports']>;
+    z_$$bindings?: ReturnType<__sveltets_Render<any, any, any>['bindings']>;
+}
+declare const Generic: $$IsomorphicComponent;
+type Generic<TTag extends keyof SvelteHTMLProps, TSlot, TValue> = InstanceType<typeof Generic<TTag, TSlot, TValue>>;
+export default Generic;

package/dist/utils/StableCollection.svelte

@@ -1,4 +1,4 @@
-<script lang="ts" context="module">import { useId } from "../hooks/use-id.js";
+<script lang="ts" module>import { useId } from "../hooks/use-id.js";
 import { getContext, setContext } from "svelte";
 function createCollection() {
   return {

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

@@ -7,7 +7,10 @@ interface $$__sveltets_2_IsomorphicComponent<Props extends Record<string, any> =
     (internal: unknown, props: Props & {
         $$events?: Events;
         $$slots?: Slots;
-    }): Exports;
+    }): Exports & {
+        $set?: any;
+        $on?: any;
+    };
     z_$$bindings?: Bindings;
 }
 declare const StableCollection: $$__sveltets_2_IsomorphicComponent<{

package/dist/utils/active-element-history.d.ts

@@ -0,0 +1 @@
+export declare let history: HTMLElement[];