@pzerelles/headlessui-svelte 2.1.2-next.31 → 2.1.2-next.33

package/dist/portal/InternalPortal.svelte

@@ -1,97 +1,154 @@
-<script lang="ts" module>import { usePortalRoot } from "../internal/portal-force-root.svelte.js";
-import { getOwnerDocument } from "../utils/owner.js";
-import { getContext, onMount, setContext } from "svelte";
-import { env } from "../utils/env.js";
-function usePortalTarget(options) {
-  const { element } = $derived(options);
-  const forceInRoot = usePortalRoot();
-  const portalGroupContext = getContext("PortalGroupContext");
-  const { target: groupTarget } = $derived(portalGroupContext ?? {});
-  const ownerDocument = $derived(getOwnerDocument(element));
-  const initialTarget = () => {
-    if (!forceInRoot?.force && groupTarget) return groupTarget ?? null;
-    if (env.isServer) return null;
-    let existingRoot = ownerDocument?.getElementById("headlessui-portal-root");
-    if (existingRoot) return existingRoot;
-    if (ownerDocument === null) return null;
-    let root = ownerDocument.createElement("div");
-    root.setAttribute("id", "headlessui-portal-root");
-    return ownerDocument.body.appendChild(root);
-  };
-  let target = $state(initialTarget());
-  $effect(() => {
-    if (!target) return;
-    if (!ownerDocument?.body.contains(target)) {
-      ownerDocument?.body.appendChild(target);
-    }
-  });
-  $effect(() => {
-    if (forceInRoot?.force) return;
-    if (!groupTarget) return;
-    target = groupTarget;
-  });
-  return {
-    get target() {
-      return target;
+<script lang="ts" module>
+  import { usePortalRoot } from "../internal/portal-force-root.svelte.js"
+  import { getOwnerDocument } from "../utils/owner.js"
+  import { getContext, onMount, setContext } from "svelte"
+  import { env } from "../utils/env.js"
+  import type { Props } from "../utils/types.js"
+  import type { PortalGroupContext } from "./PortalGroup.svelte"
+  import type { SvelteHTMLElements } from "svelte/elements"
+
+  function usePortalTarget(options: { element: HTMLElement | null }): { readonly target: HTMLElement | null } {
+    const { element } = $derived(options)
+    const forceInRoot = usePortalRoot()
+    const portalGroupContext = getContext<PortalGroupContext>("PortalGroupContext")
+    const { target: groupTarget } = $derived(portalGroupContext ?? {})
+
+    const ownerDocument = $derived(getOwnerDocument(element))
+
+    const initialTarget = () => {
+      // Group context is used, but still null
+      if (!forceInRoot?.force && groupTarget) return groupTarget ?? null
+
+      // No group context is used, let's create a default portal root
+      if (env.isServer) return null
+      let existingRoot = ownerDocument?.getElementById("headlessui-portal-root")
+      if (existingRoot) return existingRoot
+
+      if (ownerDocument === null) return null
+
+      let root = ownerDocument.createElement("div")
+      root.setAttribute("id", "headlessui-portal-root")
+      return ownerDocument.body.appendChild(root)
     }
-  };
-}
-export function useNestedPortals() {
-  const parent = getContext("PortalParentContext");
-  const portals = $state([]);
-  const register = (portal) => {
-    portals.push(portal);
-    if (parent) parent.register(portal);
-    return () => unregister(portal);
-  };
-  const unregister = (portal) => {
-    let idx = portals.indexOf(portal);
-    if (idx !== -1) portals.splice(idx, 1);
-    if (parent) parent.unregister(portal);
-  };
-  const context = {
-    register,
-    unregister,
-    get portals() {
-      return portals;
+
+    let target = $state(initialTarget())
+
+    // Ensure the portal root is always in the DOM
+    $effect(() => {
+      if (!target) return
+
+      if (!ownerDocument?.body.contains(target)) {
+        ownerDocument?.body.appendChild(target)
+      }
+    })
+
+    $effect(() => {
+      if (forceInRoot?.force) return
+      if (!groupTarget) return
+      target = groupTarget
+    })
+
+    return {
+      get target() {
+        return target
+      },
     }
-  };
-  setContext("PortalParentContext", context);
-  return context;
-}
-export const DEFAULT_PORTAL_TAG = "div";
-</script>
+  }
+
+  // ---
 
-<script lang="ts" generics="TTag extends ElementType = typeof DEFAULT_PORTAL_TAG">import ElementOrComponent from "../utils/ElementOrComponent.svelte";
-let { ref = $bindable(), ...theirProps } = $props();
-const portalTarget = usePortalTarget({
-  get element() {
-    return ref ?? null;
+  type PortalParentContext = {
+    register: (portal: HTMLElement) => () => void
+    unregister: (portal: HTMLElement) => void
+    readonly portals: HTMLElement[]
   }
-});
-const { target } = $derived(portalTarget);
-const parent = getContext("PortalParentContext");
-$effect(() => {
-  if (!target || !ref) return;
-  if (ref.parentNode !== target) {
-    ref.setAttribute("data-headlessui-portal", "");
-    target.appendChild(ref);
+
+  export function useNestedPortals() {
+    const parent = getContext<PortalParentContext>("PortalParentContext")
+    const portals = $state<HTMLElement[]>([])
+
+    const register = (portal: HTMLElement) => {
+      portals.push(portal)
+      if (parent) parent.register(portal)
+      return () => unregister(portal)
+    }
+
+    const unregister = (portal: HTMLElement) => {
+      let idx = portals.indexOf(portal)
+      if (idx !== -1) portals.splice(idx, 1)
+      if (parent) parent.unregister(portal)
+    }
+
+    const context: PortalParentContext = {
+      register,
+      unregister,
+      get portals() {
+        return portals
+      },
+    }
+    setContext("PortalParentContext", context)
+
+    return context
   }
-});
-onMount(() => {
-  if (parent) parent.register(ref);
-  return () => {
-    if (!target || !ref) return;
-    if (ref instanceof Node && target.contains(ref)) {
-      target.removeChild(ref);
+
+  // ---
+
+  export const DEFAULT_PORTAL_TAG = "div"
+  type PortalRenderPropArg = {}
+  type PortalPropsWeControl = never
+
+  export type PortalProps = Props<
+    typeof DEFAULT_PORTAL_TAG,
+    PortalRenderPropArg,
+    {
+      element?: HTMLElement
+      enabled?: boolean
+    }
+  >
+</script>
+
+<script lang="ts">
+  import ElementOrComponent from "../utils/ElementOrComponent.svelte"
+
+  let { element = $bindable(), ...theirProps }: PortalProps = $props()
+
+  const portalTarget = usePortalTarget({
+    get element() {
+      return element ?? null
+    },
+  })
+  const { target } = $derived(portalTarget)
+  const parent = getContext<PortalParentContext>("PortalParentContext")
+  //const ready = useServerHandoffComplete()
+
+  $effect(() => {
+    if (!target || !element) return
+
+    // Element already exists in target, always calling target.appendChild(element) will cause a
+    // brief unmount/remount.
+    if (element.parentNode !== target) {
+      element.setAttribute("data-headlessui-portal", "")
+      target.appendChild(element)
     }
-    if (target.childNodes.length <= 0) {
-      target.parentElement?.removeChild(target);
+  })
+
+  onMount(() => {
+    if (parent) parent.register(element!)
+
+    return () => {
+      if (!target || !element) return
+
+      if (element instanceof Node && target.contains(element)) {
+        target.removeChild(element)
+      }
+
+      if (target.childNodes.length <= 0) {
+        target.parentElement?.removeChild(target)
+      }
     }
-  };
-});
+  })
 </script>
 
 {#if target}
-  <ElementOrComponent {theirProps} defaultTag={DEFAULT_PORTAL_TAG} name="InternalPortal" bind:ref />
+  <ElementOrComponent {theirProps} defaultTag={DEFAULT_PORTAL_TAG} name="InternalPortal" bind:element />
 {/if}

package/dist/portal/InternalPortal.svelte.d.ts

@@ -1,4 +1,4 @@
-import type { ElementType, Props } from "../utils/types.js";
+import type { Props } from "../utils/types.js";
 type PortalParentContext = {
     register: (portal: HTMLElement) => () => void;
     unregister: (portal: HTMLElement) => void;
@@ -7,35 +7,9 @@ type PortalParentContext = {
 export declare function useNestedPortals(): PortalParentContext;
 export declare const DEFAULT_PORTAL_TAG = "div";
 type PortalRenderPropArg = {};
-type PortalPropsWeControl = never;
-export type PortalProps<TTag extends ElementType = typeof DEFAULT_PORTAL_TAG> = Props<TTag, PortalRenderPropArg, PortalPropsWeControl, {
+export type PortalProps = Props<typeof DEFAULT_PORTAL_TAG, PortalRenderPropArg, {
+    element?: HTMLElement;
     enabled?: boolean;
 }>;
-declare class __sveltets_Render<TTag extends ElementType = typeof DEFAULT_PORTAL_TAG> {
-    props(): {
-        as?: TTag | undefined;
-    } & (Exclude<keyof import("../utils/types.js").PropsOf<TTag>, ("slot" | "as" | "children" | "class" | "ref") | "enabled"> extends infer T extends keyof import("../utils/types.js").PropsOf<TTag> ? { [P in T]: import("../utils/types.js").PropsOf<TTag>[P]; } : never) & {
-        children?: import("svelte").Snippet<[{
-            slot: PortalRenderPropArg;
-            props: Record<string, any>;
-        }]> | undefined;
-        class?: string | ((bag: PortalRenderPropArg) => string) | null | undefined;
-        ref?: HTMLElement;
-    } & {
-        enabled?: boolean;
-    };
-    events(): {};
-    slots(): {};
-    bindings(): "ref";
-    exports(): {};
-}
-interface $$IsomorphicComponent {
-    new <TTag extends ElementType = typeof DEFAULT_PORTAL_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_PORTAL_TAG>(internal: unknown, props: ReturnType<__sveltets_Render<TTag>['props']> & {}): ReturnType<__sveltets_Render<TTag>['exports']>;
-    z_$$bindings?: ReturnType<__sveltets_Render<any>['bindings']>;
-}
-declare const InternalPortal: $$IsomorphicComponent;
-type InternalPortal<TTag extends ElementType = typeof DEFAULT_PORTAL_TAG> = InstanceType<typeof InternalPortal<TTag>>;
+declare const InternalPortal: import("svelte").Component<PortalProps, {}, "element">;
 export default InternalPortal;

package/dist/portal/Portal.svelte

@@ -1,7 +1,11 @@
-<script lang="ts" generics="TTag extends ElementType = typeof DEFAULT_PORTAL_TAG">import InternalPortal, { DEFAULT_PORTAL_TAG } from "./InternalPortal.svelte";
-let { ref = $bindable(), enabled = true, ...theirProps } = $props();
+<script lang="ts">
+  import InternalPortal, { type PortalProps } from "./InternalPortal.svelte"
+
+  let { element = $bindable(), enabled = true, ...theirProps }: PortalProps = $props()
 </script>
 
 {#if enabled}
-  <InternalPortal {...theirProps} bind:ref />
-{:else if theirProps.children}{@render theirProps.children()}{/if}
+  <InternalPortal {...theirProps} bind:element />
+{:else}
+  {@render theirProps.children?.({})}
+{/if}

package/dist/portal/Portal.svelte.d.ts

@@ -1,19 +1,3 @@
-import type { ElementType } from "../utils/types.js";
-import { DEFAULT_PORTAL_TAG, type PortalProps } from "./InternalPortal.svelte";
-declare class __sveltets_Render<TTag extends ElementType = typeof DEFAULT_PORTAL_TAG> {
-    props(): PortalProps<TTag>;
-    events(): {};
-    slots(): {};
-    bindings(): "ref";
-    exports(): {};
-}
-interface $$IsomorphicComponent {
-    new <TTag extends ElementType = typeof DEFAULT_PORTAL_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_PORTAL_TAG>(internal: unknown, props: ReturnType<__sveltets_Render<TTag>['props']> & {}): ReturnType<__sveltets_Render<TTag>['exports']>;
-    z_$$bindings?: ReturnType<__sveltets_Render<any>['bindings']>;
-}
-declare const Portal: $$IsomorphicComponent;
-type Portal<TTag extends ElementType = typeof DEFAULT_PORTAL_TAG> = InstanceType<typeof Portal<TTag>>;
+import { type PortalProps } from "./InternalPortal.svelte";
+declare const Portal: import("svelte").Component<PortalProps, {}, "element">;
 export default Portal;

package/dist/portal/PortalGroup.svelte

@@ -1,14 +1,27 @@
-<script lang="ts" module>const DEFAULT_GROUP_TAG = "svelte:fragment";
-</script>
+<script lang="ts" module>
+  import type { PropsAsChild } from "../utils/types.js"
+
+  const DEFAULT_GROUP_TAG = "svelte:fragment"
+  type GroupRenderPropArg = {}
 
-<script lang="ts" generics="TTag extends ElementType = typeof DEFAULT_GROUP_TAG">import ElementOrComponent from "../utils/ElementOrComponent.svelte";
-import { setContext } from "svelte";
-let { ref = $bindable(), target, ...theirProps } = $props();
-setContext("PortalGroupContext", {
-  get target() {
-    return target;
+  export type PortalGroupContext = {
+    readonly target: HTMLElement | null
   }
-});
+
+  export type PortalGroupProps = PropsAsChild<GroupRenderPropArg, { target: HTMLElement | null }>
+</script>
+
+<script lang="ts">
+  import ElementOrComponent from "../utils/ElementOrComponent.svelte"
+  import { setContext } from "svelte"
+
+  let { target, ...theirProps }: PortalGroupProps = $props()
+
+  setContext("PortalGroupContext", {
+    get target() {
+      return target
+    },
+  })
 </script>
 
-<ElementOrComponent {theirProps} defaultTag={DEFAULT_GROUP_TAG} name="PortalGroup" bind:ref />
+<ElementOrComponent {theirProps} name="PortalGroup" />

package/dist/portal/PortalGroup.svelte.d.ts

@@ -1,38 +1,10 @@
-import type { ElementType, Props } from "../utils/types.js";
-declare const DEFAULT_GROUP_TAG = "svelte:fragment";
+import type { PropsAsChild } from "../utils/types.js";
 type GroupRenderPropArg = {};
-type GroupPropsWeControl = never;
 export type PortalGroupContext = {
     readonly target: HTMLElement | null;
 };
-export type PortalGroupProps<TTag extends ElementType = typeof DEFAULT_GROUP_TAG> = Props<TTag, GroupRenderPropArg, GroupPropsWeControl, {
+export type PortalGroupProps = PropsAsChild<GroupRenderPropArg, {
     target: HTMLElement | null;
 }>;
-declare class __sveltets_Render<TTag extends ElementType = typeof DEFAULT_GROUP_TAG> {
-    props(): {
-        as?: TTag | undefined;
-    } & (Exclude<keyof import("../utils/types.js").PropsOf<TTag>, ("slot" | "as" | "children" | "class" | "ref") | "target"> extends infer T extends keyof import("../utils/types.js").PropsOf<TTag> ? { [P in T]: import("../utils/types.js").PropsOf<TTag>[P]; } : never) & {
-        children?: import("svelte").Snippet<[{
-            slot: GroupRenderPropArg;
-            props: Record<string, any>;
-        }]> | undefined;
-        class?: string | ((bag: GroupRenderPropArg) => string) | null | undefined;
-        ref?: HTMLElement;
-    } & {
-        target: HTMLElement | null;
-    };
-    events(): {};
-    slots(): {};
-    bindings(): "ref";
-    exports(): {};
-}
-interface $$IsomorphicComponent {
-    new <TTag extends ElementType = typeof DEFAULT_GROUP_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_GROUP_TAG>(internal: unknown, props: ReturnType<__sveltets_Render<TTag>['props']> & {}): ReturnType<__sveltets_Render<TTag>['exports']>;
-    z_$$bindings?: ReturnType<__sveltets_Render<any>['bindings']>;
-}
-declare const PortalGroup: $$IsomorphicComponent;
-type PortalGroup<TTag extends ElementType = typeof DEFAULT_GROUP_TAG> = InstanceType<typeof PortalGroup<TTag>>;
+declare const PortalGroup: import("svelte").Component<PortalGroupProps, {}, "">;
 export default PortalGroup;

package/dist/select/Select.svelte

@@ -1,74 +1,105 @@
-<script lang="ts" module>let DEFAULT_SELECT_TAG = "select";
-</script>
+<script lang="ts" module>
+  import type { Props } from "../utils/types.js"
 
-<script lang="ts" generics="TTag extends ElementType = typeof DEFAULT_SELECT_TAG">import { useId } from "../hooks/use-id.js";
-import { useProvidedId } from "../utils/id.js";
-import { useDisabled } from "../hooks/use-disabled.js";
-import { useFocusRing } from "../hooks/use-focus-ring.svelte.js";
-import { useHover } from "../hooks/use-hover.svelte.js";
-import { useActivePress } from "../hooks/use-active-press.svelte.js";
-import { useLabelledBy } from "../label/context.svelte.js";
-import { useDescribedBy } from "../description/context.svelte.js";
-import { mergeProps } from "../utils/render.js";
-import ElementOrComponent from "../utils/ElementOrComponent.svelte";
-const internalId = useId();
-const providedId = useProvidedId();
-const providedDisabled = useDisabled();
-let {
-  ref = $bindable(),
-  id = providedId || `headlessui-select-${internalId}`,
-  disabled: theirDisabled = false,
-  invalid = false,
-  autofocus = false,
-  ...theirProps
-} = $props();
-const disabled = $derived(providedDisabled.current ?? theirDisabled);
-const labelledBy = useLabelledBy();
-const describedBy = useDescribedBy();
-const { isFocusVisible: focus, focusProps } = $derived(
-  useFocusRing({
-    get autofocus() {
-      return autofocus;
-    }
-  })
-);
-const { isHovered: hover, hoverProps } = $derived(
-  useHover({
-    get disabled() {
-      return disabled;
-    }
-  })
-);
-const { pressed: active, pressProps } = $derived(
-  useActivePress({
-    get disabled() {
-      return disabled;
-    }
-  })
-);
-const ourProps = $derived(
-  mergeProps(
+  let DEFAULT_SELECT_TAG = "select" as const
+
+  type SelectRenderPropArg = {
+    disabled: boolean
+    hover: boolean
+    focus: boolean
+    active: boolean
+    autofocus: boolean
+    invalid: boolean
+  }
+  type SelectPropsWeControl = "aria-labelledby" | "aria-describedby"
+
+  export type SelectProps = Props<
+    typeof DEFAULT_SELECT_TAG,
+    SelectRenderPropArg,
     {
-      id,
-      "aria-labelledby": labelledBy.value,
-      "aria-describedby": describedBy.value,
-      "aria-invalid": invalid ? "" : void 0,
-      disabled: disabled || void 0,
-      autofocus
-    },
-    focusProps,
-    hoverProps,
-    pressProps
+      element?: HTMLElement
+      id?: string
+      disabled?: boolean
+      invalid?: boolean
+      autofocus?: boolean
+    }
+  >
+</script>
+
+<script lang="ts">
+  import { useId } from "../hooks/use-id.js"
+  import { useProvidedId } from "../utils/id.js"
+  import { useDisabled } from "../hooks/use-disabled.js"
+  import { useFocusRing } from "../hooks/use-focus-ring.svelte.js"
+  import { useHover } from "../hooks/use-hover.svelte.js"
+  import { useActivePress } from "../hooks/use-active-press.svelte.js"
+  import { useLabelledBy } from "../label/context.svelte.js"
+  import { useDescribedBy } from "../description/context.svelte.js"
+  import { mergeProps } from "../utils/render.js"
+  import ElementOrComponent from "../utils/ElementOrComponent.svelte"
+
+  const internalId = useId()
+  const providedId = useProvidedId()
+  const providedDisabled = useDisabled()
+  let {
+    element = $bindable(),
+    id = providedId || `headlessui-select-${internalId}`,
+    disabled: theirDisabled = false,
+    invalid = false,
+    autofocus = false,
+    ...theirProps
+  }: SelectProps = $props()
+
+  const disabled = $derived(providedDisabled.current ?? theirDisabled)
+  const labelledBy = useLabelledBy()
+  const describedBy = useDescribedBy()
+
+  const { isFocusVisible: focus, focusProps } = $derived(
+    useFocusRing({
+      get autofocus() {
+        return autofocus
+      },
+    })
+  )
+  const { isHovered: hover, hoverProps } = $derived(
+    useHover({
+      get disabled() {
+        return disabled
+      },
+    })
   )
-);
-const slot = $derived({
-  disabled,
-  invalid,
-  hover,
-  focus,
-  active,
-  autofocus
-});
+  const { pressed: active, pressProps } = $derived(
+    useActivePress({
+      get disabled() {
+        return disabled
+      },
+    })
+  )
+
+  const ourProps = $derived(
+    mergeProps(
+      {
+        id,
+        "aria-labelledby": labelledBy.value,
+        "aria-describedby": describedBy.value,
+        "aria-invalid": invalid ? "" : undefined,
+        disabled: disabled || undefined,
+        autofocus,
+      },
+      focusProps,
+      hoverProps,
+      pressProps
+    )
+  )
+
+  const slot = $derived({
+    disabled,
+    invalid,
+    hover,
+    focus,
+    active,
+    autofocus,
+  } satisfies SelectRenderPropArg)
 </script>
 
-<ElementOrComponent {ourProps} {theirProps} {slot} defaultTag={DEFAULT_SELECT_TAG} name="Select" bind:ref />
+<ElementOrComponent {ourProps} {theirProps} {slot} defaultTag={DEFAULT_SELECT_TAG} name="Select" bind:element />

package/dist/select/Select.svelte.d.ts

@@ -1,4 +1,4 @@
-import type { ElementType, Props, PropsOf } from "../utils/types.js";
+import type { Props } from "../utils/types.js";
 declare let DEFAULT_SELECT_TAG: "select";
 type SelectRenderPropArg = {
     disabled: boolean;
@@ -8,39 +8,12 @@ type SelectRenderPropArg = {
     autofocus: boolean;
     invalid: boolean;
 };
-type SelectPropsWeControl = "aria-labelledby" | "aria-describedby";
-export type SelectProps<TTag extends ElementType = typeof DEFAULT_SELECT_TAG> = Props<TTag, SelectRenderPropArg, SelectPropsWeControl, {
+export type SelectProps = Props<typeof DEFAULT_SELECT_TAG, SelectRenderPropArg, {
+    element?: HTMLElement;
+    id?: string;
     disabled?: boolean;
     invalid?: boolean;
     autofocus?: boolean;
 }>;
-declare class __sveltets_Render<TTag extends ElementType = typeof DEFAULT_SELECT_TAG> {
-    props(): {
-        as?: TTag | undefined;
-    } & (Exclude<keyof PropsOf<TTag>, ("slot" | "as" | "children" | "class" | "ref") | "invalid" | "disabled" | "autofocus" | SelectPropsWeControl> extends infer T extends keyof PropsOf<TTag> ? { [P in T]: PropsOf<TTag>[P]; } : never) & {
-        children?: import("svelte").Snippet<[{
-            slot: SelectRenderPropArg;
-            props: Record<string, any>;
-        }]> | undefined;
-        class?: string | ((bag: SelectRenderPropArg) => string) | null | undefined;
-        ref?: HTMLElement;
-    } & {
-        disabled?: boolean;
-        invalid?: boolean;
-        autofocus?: boolean;
-    };
-    events(): {};
-    slots(): {};
-    bindings(): "ref";
-    exports(): {};
-}
-interface $$IsomorphicComponent {
-    new <TTag extends ElementType = typeof DEFAULT_SELECT_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_SELECT_TAG>(internal: unknown, props: ReturnType<__sveltets_Render<TTag>['props']> & {}): ReturnType<__sveltets_Render<TTag>['exports']>;
-    z_$$bindings?: ReturnType<__sveltets_Render<any>['bindings']>;
-}
-declare const Select: $$IsomorphicComponent;
-type Select<TTag extends ElementType = typeof DEFAULT_SELECT_TAG> = InstanceType<typeof Select<TTag>>;
+declare const Select: import("svelte").Component<SelectProps, {}, "element">;
 export default Select;