@pzerelles/headlessui-svelte 2.1.2-next.2 → 2.1.2-next.21

This diff represents the content of publicly available package versions that have been released to one of the supported registries. The information contained in this diff is provided for informational purposes only and reflects changes between package versions as they appear in their respective public registries.
Files changed (168) hide show
  1. package/dist/button/Button.svelte.d.ts +1 -1
  2. package/dist/checkbox/Checkbox.svelte +4 -4
  3. package/dist/checkbox/Checkbox.svelte.d.ts +5 -7
  4. package/dist/close-button/CloseButton.svelte.d.ts +2 -2
  5. package/dist/data-interactive/DataInteractive.svelte.d.ts +1 -1
  6. package/dist/description/Description.svelte.d.ts +1 -1
  7. package/dist/description/context.svelte.js +1 -1
  8. package/dist/dialog/Dialog.svelte.d.ts +1 -1
  9. package/dist/dialog/DialogBackdrop.svelte.d.ts +1 -1
  10. package/dist/dialog/DialogPanel.svelte +0 -1
  11. package/dist/dialog/DialogPanel.svelte.d.ts +1 -1
  12. package/dist/dialog/DialogTitle.svelte.d.ts +1 -1
  13. package/dist/dialog/InternalDialog.svelte.d.ts +1 -1
  14. package/dist/dialog/context.svelte.js +1 -1
  15. package/dist/field/Field.svelte +21 -3
  16. package/dist/field/Field.svelte.d.ts +1 -1
  17. package/dist/fieldset/Fieldset.svelte.d.ts +1 -1
  18. package/dist/focus-trap/FocusTrap.svelte +7 -14
  19. package/dist/focus-trap/FocusTrap.svelte.d.ts +3 -15
  20. package/dist/focus-trap/FocusTrapFeatures.d.ts +14 -0
  21. package/dist/focus-trap/FocusTrapFeatures.js +15 -0
  22. package/dist/hooks/use-controllable.svelte.js +2 -1
  23. package/dist/hooks/use-did-element-move.svelte.js +5 -10
  24. package/dist/hooks/use-event-listener.svelte.d.ts +1 -1
  25. package/dist/hooks/use-event-listener.svelte.js +3 -1
  26. package/dist/hooks/use-root-containers.svelte.d.ts +2 -2
  27. package/dist/hooks/use-root-containers.svelte.js +5 -5
  28. package/dist/hooks/use-tab-direction.svelte.js +1 -1
  29. package/dist/index.d.ts +3 -0
  30. package/dist/index.js +3 -0
  31. package/dist/input/Input.svelte +2 -2
  32. package/dist/input/Input.svelte.d.ts +5 -7
  33. package/dist/internal/FloatingProvider.svelte +12 -0
  34. package/dist/internal/{HoistFormFields.svelte.d.ts → FloatingProvider.svelte.d.ts} +5 -4
  35. package/dist/internal/FormFields.svelte +22 -19
  36. package/dist/internal/FormFieldsProvider.svelte +13 -0
  37. package/dist/internal/FormFieldsProvider.svelte.d.ts +21 -0
  38. package/dist/internal/Hidden.svelte +18 -8
  39. package/dist/internal/Hidden.svelte.d.ts +3 -6
  40. package/dist/internal/HiddenFeatures.d.ts +5 -0
  41. package/dist/internal/HiddenFeatures.js +9 -0
  42. package/dist/internal/floating-provider.svelte.d.ts +3 -0
  43. package/dist/internal/floating-provider.svelte.js +206 -0
  44. package/dist/internal/floating.svelte.d.ts +48 -23
  45. package/dist/internal/floating.svelte.js +79 -260
  46. package/dist/internal/form-fields.svelte.d.ts +10 -0
  47. package/dist/internal/form-fields.svelte.js +23 -0
  48. package/dist/label/Label.svelte +5 -4
  49. package/dist/label/Label.svelte.d.ts +1 -1
  50. package/dist/label/context.svelte.js +1 -1
  51. package/dist/legend/Legend.svelte +2 -2
  52. package/dist/legend/Legend.svelte.d.ts +18 -30
  53. package/dist/listbox/Listbox.svelte +42 -66
  54. package/dist/listbox/Listbox.svelte.d.ts +6 -65
  55. package/dist/listbox/ListboxButton.svelte +10 -10
  56. package/dist/listbox/ListboxButton.svelte.d.ts +5 -7
  57. package/dist/listbox/ListboxOption.svelte +10 -6
  58. package/dist/listbox/ListboxOption.svelte.d.ts +1 -1
  59. package/dist/listbox/ListboxOptions.svelte +108 -54
  60. package/dist/listbox/ListboxOptions.svelte.d.ts +1 -1
  61. package/dist/listbox/ListboxSelectedOption.svelte +2 -4
  62. package/dist/listbox/ListboxSelectedOption.svelte.d.ts +6 -6
  63. package/dist/listbox/context.svelte.d.ts +76 -0
  64. package/dist/listbox/context.svelte.js +36 -0
  65. package/dist/menu/Menu.svelte +5 -177
  66. package/dist/menu/Menu.svelte.d.ts +1 -1
  67. package/dist/menu/MenuButton.svelte +4 -2
  68. package/dist/menu/MenuButton.svelte.d.ts +1 -1
  69. package/dist/menu/MenuHeading.svelte.d.ts +1 -1
  70. package/dist/menu/MenuItem.svelte.d.ts +6 -5
  71. package/dist/menu/MenuItems.svelte +15 -11
  72. package/dist/menu/MenuItems.svelte.d.ts +1 -1
  73. package/dist/menu/MenuSection.svelte.d.ts +1 -1
  74. package/dist/menu/MenuSeparator.svelte.d.ts +1 -1
  75. package/dist/menu/context.svelte.d.ts +30 -1
  76. package/dist/menu/context.svelte.js +208 -0
  77. package/dist/popover/Popover.svelte +161 -0
  78. package/dist/popover/Popover.svelte.d.ts +41 -0
  79. package/dist/popover/PopoverBackdrop.svelte +56 -0
  80. package/dist/popover/PopoverBackdrop.svelte.d.ts +45 -0
  81. package/dist/popover/PopoverButton.svelte +246 -0
  82. package/dist/popover/PopoverButton.svelte.d.ts +44 -0
  83. package/dist/popover/PopoverGroup.svelte +43 -0
  84. package/dist/popover/PopoverGroup.svelte.d.ts +33 -0
  85. package/dist/popover/PopoverPanel.svelte +274 -0
  86. package/dist/popover/PopoverPanel.svelte.d.ts +53 -0
  87. package/dist/popover/context.svelte.d.ts +51 -0
  88. package/dist/popover/context.svelte.js +108 -0
  89. package/dist/popover/index.d.ts +5 -0
  90. package/dist/popover/index.js +5 -0
  91. package/dist/portal/InternalPortal.svelte.d.ts +1 -1
  92. package/dist/portal/PortalGroup.svelte.d.ts +1 -1
  93. package/dist/select/Select.svelte +74 -0
  94. package/dist/select/Select.svelte.d.ts +48 -0
  95. package/dist/select/index.d.ts +1 -0
  96. package/dist/select/index.js +1 -0
  97. package/dist/switch/Switch.svelte +30 -20
  98. package/dist/switch/Switch.svelte.d.ts +5 -5
  99. package/dist/switch/SwitchGroup.svelte.d.ts +1 -1
  100. package/dist/tabs/Tab.svelte.d.ts +1 -1
  101. package/dist/tabs/TabGroup.svelte.d.ts +2 -2
  102. package/dist/tabs/TabList.svelte.d.ts +1 -1
  103. package/dist/tabs/TabPanel.svelte.d.ts +1 -1
  104. package/dist/tabs/TabPanels.svelte.d.ts +1 -1
  105. package/dist/textarea/Textarea.svelte +67 -0
  106. package/dist/textarea/Textarea.svelte.d.ts +50 -0
  107. package/dist/textarea/index.d.ts +1 -0
  108. package/dist/textarea/index.js +1 -0
  109. package/dist/transition/InternalTransitionChild.svelte.d.ts +1 -1
  110. package/dist/transition/Transition.svelte.d.ts +1 -1
  111. package/dist/transition/TransitionChild.svelte.d.ts +1 -1
  112. package/dist/transition/context.svelte.js +2 -2
  113. package/dist/utils/ElementOrComponent.svelte +2 -2
  114. package/dist/utils/ElementOrComponent.svelte.d.ts +2 -2
  115. package/dist/utils/Generic.svelte +0 -1
  116. package/dist/utils/Generic.svelte.d.ts +1 -2
  117. package/dist/utils/alternative-types.d.ts +1 -2
  118. package/dist/utils/floating-ui/svelte/components/FloatingNode.svelte +17 -0
  119. package/dist/utils/floating-ui/svelte/components/FloatingNode.svelte.d.ts +23 -0
  120. package/dist/utils/floating-ui/svelte/components/FloatingTree.svelte +50 -0
  121. package/dist/utils/floating-ui/svelte/components/FloatingTree.svelte.d.ts +41 -0
  122. package/dist/utils/floating-ui/svelte/hooks/useFloating.svelte.d.ts +6 -0
  123. package/dist/utils/floating-ui/svelte/hooks/useFloating.svelte.js +158 -0
  124. package/dist/utils/floating-ui/svelte/hooks/useFloatingRootContext.svelte.d.ts +11 -0
  125. package/dist/utils/floating-ui/svelte/hooks/useFloatingRootContext.svelte.js +53 -0
  126. package/dist/utils/floating-ui/svelte/hooks/useId.svelte.d.ts +9 -0
  127. package/dist/utils/floating-ui/svelte/hooks/useId.svelte.js +28 -0
  128. package/dist/utils/floating-ui/svelte/hooks/useInteractions.svelte.d.ts +23 -0
  129. package/dist/utils/floating-ui/svelte/hooks/useInteractions.svelte.js +72 -0
  130. package/dist/utils/floating-ui/svelte/index.d.ts +5 -0
  131. package/dist/utils/floating-ui/svelte/index.js +5 -0
  132. package/dist/utils/floating-ui/svelte/inner.svelte.d.ts +83 -0
  133. package/dist/utils/floating-ui/svelte/inner.svelte.js +178 -0
  134. package/dist/utils/floating-ui/svelte/types.d.ts +114 -0
  135. package/dist/utils/floating-ui/svelte/types.js +1 -0
  136. package/dist/utils/floating-ui/svelte/utils/createPubSub.d.ts +5 -0
  137. package/dist/utils/floating-ui/svelte/utils/createPubSub.js +14 -0
  138. package/dist/utils/floating-ui/svelte/utils/getFloatingFocusElement.d.ts +2 -0
  139. package/dist/utils/floating-ui/svelte/utils/getFloatingFocusElement.js +13 -0
  140. package/dist/utils/floating-ui/svelte/utils/log.d.ts +2 -0
  141. package/dist/utils/floating-ui/svelte/utils/log.js +19 -0
  142. package/dist/utils/floating-ui/svelte/utils.d.ts +19 -0
  143. package/dist/utils/floating-ui/svelte/utils.js +136 -0
  144. package/dist/utils/floating-ui/svelte-dom/arrow.d.ts +22 -0
  145. package/dist/utils/floating-ui/svelte-dom/arrow.js +29 -0
  146. package/dist/utils/floating-ui/svelte-dom/index.d.ts +2 -0
  147. package/dist/utils/floating-ui/svelte-dom/index.js +2 -0
  148. package/dist/utils/floating-ui/svelte-dom/types.d.ts +80 -0
  149. package/dist/utils/floating-ui/svelte-dom/types.js +3 -0
  150. package/dist/utils/floating-ui/svelte-dom/useFloating.svelte.d.ts +6 -0
  151. package/dist/utils/floating-ui/svelte-dom/useFloating.svelte.js +182 -0
  152. package/dist/utils/floating-ui/svelte-dom/utils/deepEqual.d.ts +1 -0
  153. package/dist/utils/floating-ui/svelte-dom/utils/deepEqual.js +50 -0
  154. package/dist/utils/floating-ui/svelte-dom/utils/getDPR.d.ts +1 -0
  155. package/dist/utils/floating-ui/svelte-dom/utils/getDPR.js +7 -0
  156. package/dist/utils/floating-ui/svelte-dom/utils/roundByDPR.d.ts +1 -0
  157. package/dist/utils/floating-ui/svelte-dom/utils/roundByDPR.js +5 -0
  158. package/dist/utils/floating-ui/svelte-dom/utils/useLatestRef.d.ts +4 -0
  159. package/dist/utils/floating-ui/svelte-dom/utils/useLatestRef.js +7 -0
  160. package/dist/utils/id.d.ts +1 -1
  161. package/dist/utils/id.js +1 -1
  162. package/dist/utils/style.d.ts +2 -0
  163. package/dist/utils/style.js +6 -0
  164. package/dist/utils/types.d.ts +1 -2
  165. package/package.json +25 -24
  166. package/dist/internal/HoistFormFields.svelte +0 -11
  167. package/dist/internal/id.d.ts +0 -8
  168. package/dist/internal/id.js +0 -11
@@ -17,7 +17,7 @@ declare class __sveltets_Render<TTag extends ElementType = typeof DEFAULT_BUTTON
17
17
  props(): {
18
18
  as?: TTag | undefined;
19
19
  } & (Exclude<keyof import("../utils/types.js").PropsOf<TTag>, ("as" | "children" | "refName" | "class") | "disabled" | "autofocus" | "type"> extends infer T extends keyof import("../utils/types.js").PropsOf<TTag> ? { [P in T]: import("../utils/types.js").PropsOf<TTag>[P]; } : never) & {
20
- children?: import("../utils/types.js").Children<ButtonRenderPropArg> | undefined;
20
+ children?: import("svelte").Snippet<[ButtonRenderPropArg, Record<string, any>]> | undefined;
21
21
  ref?: HTMLElement;
22
22
  } & (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) ? {
23
23
  class?: import("../utils/types.js").PropsOf<TTag>["class"] | ((bag: ButtonRenderPropArg) => string) | undefined;
@@ -3,7 +3,7 @@
3
3
 
4
4
  <script lang="ts" generics="TType, TTag extends ElementType = typeof DEFAULT_CHECKBOX_TAG">import { tick } from "svelte";
5
5
  import { attemptSubmit } from "../utils/form.js";
6
- import { getIdContext, htmlid } from "../utils/id.js";
6
+ import { useProvidedId, htmlid } from "../utils/id.js";
7
7
  import { useActivePress } from "../hooks/use-active-press.svelte.js";
8
8
  import { useFocusRing } from "../hooks/use-focus-ring.svelte.js";
9
9
  import FormFields from "../internal/FormFields.svelte";
@@ -15,12 +15,12 @@ import { mergeProps } from "../utils/render.js";
15
15
  import ElementOrComponent from "../utils/ElementOrComponent.svelte";
16
16
  import { useControllable } from "../hooks/use-controllable.svelte.js";
17
17
  const internalId = htmlid();
18
- const providedId = getIdContext();
18
+ const providedId = useProvidedId();
19
19
  const providedDisabled = useDisabled();
20
20
  let {
21
21
  ref = $bindable(),
22
22
  id = providedId || `headlessui-checkbox-${internalId}`,
23
- disabled: ownDisabled = false,
23
+ disabled: theirDisabled = false,
24
24
  autofocus = false,
25
25
  checked: controlledChecked = $bindable(),
26
26
  defaultChecked: _defaultChecked,
@@ -45,7 +45,7 @@ const controllable = useControllable(
45
45
  defaultChecked ?? false
46
46
  );
47
47
  const { value: checked, onchange } = $derived(controllable);
48
- const disabled = $derived(providedDisabled.value || ownDisabled);
48
+ const disabled = $derived(providedDisabled?.value ?? theirDisabled);
49
49
  const { isHovered: hover, hoverProps } = $derived(
50
50
  useHover({
51
51
  get disabled() {
@@ -1,4 +1,4 @@
1
- import type { ElementType, Props } from "../utils/types.js";
1
+ import type { ElementType, Props, PropsOf } from "../utils/types.js";
2
2
  declare let DEFAULT_CHECKBOX_TAG: "span";
3
3
  type CheckboxRenderPropArg = {
4
4
  checked: boolean;
@@ -12,7 +12,6 @@ type CheckboxRenderPropArg = {
12
12
  };
13
13
  type CheckboxPropsWeControl = "aria-checked" | "aria-describedby" | "aria-disabled" | "aria-labelledby" | "role" | "tabIndex";
14
14
  export type CheckboxProps<TTag extends ElementType = typeof DEFAULT_CHECKBOX_TAG, TType = string> = Props<TTag, CheckboxRenderPropArg, CheckboxPropsWeControl, {
15
- id?: string;
16
15
  value?: TType;
17
16
  disabled?: boolean;
18
17
  indeterminate?: boolean;
@@ -26,13 +25,12 @@ export type CheckboxProps<TTag extends ElementType = typeof DEFAULT_CHECKBOX_TAG
26
25
  declare class __sveltets_Render<TType, TTag extends ElementType = typeof DEFAULT_CHECKBOX_TAG> {
27
26
  props(): {
28
27
  as?: TTag | undefined;
29
- } & (Exclude<keyof import("../utils/types.js").PropsOf<TTag>, "form" | ("as" | "children" | "refName" | "class") | "disabled" | "autofocus" | "name" | "value" | "checked" | "id" | "onchange" | "indeterminate" | CheckboxPropsWeControl | "defaultChecked"> extends infer T extends keyof import("../utils/types.js").PropsOf<TTag> ? { [P in T]: import("../utils/types.js").PropsOf<TTag>[P]; } : never) & {
30
- children?: import("../utils/types.js").Children<CheckboxRenderPropArg> | undefined;
28
+ } & (Exclude<keyof PropsOf<TTag>, "form" | ("as" | "children" | "refName" | "class") | "disabled" | "autofocus" | "value" | "checked" | "name" | "onchange" | "indeterminate" | CheckboxPropsWeControl | "defaultChecked"> extends infer T extends keyof PropsOf<TTag> ? { [P in T]: PropsOf<TTag>[P]; } : never) & {
29
+ children?: import("svelte").Snippet<[CheckboxRenderPropArg, Record<string, any>]> | undefined;
31
30
  ref?: HTMLElement;
32
- } & (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) ? {
33
- class?: import("../utils/types.js").PropsOf<TTag>["class"] | ((bag: CheckboxRenderPropArg) => string) | undefined;
31
+ } & (true extends (PropsOf<TTag> extends infer T_1 ? T_1 extends 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) ? {
32
+ class?: PropsOf<TTag>["class"] | ((bag: CheckboxRenderPropArg) => string) | undefined;
34
33
  } : {}) & {
35
- id?: string;
36
34
  value?: TType | undefined;
37
35
  disabled?: boolean;
38
36
  indeterminate?: boolean;
@@ -6,13 +6,13 @@ declare class __sveltets_Render<TTag extends ElementType = typeof DEFAULT_BUTTON
6
6
  props(): {
7
7
  as?: TTag | undefined;
8
8
  } & (Exclude<keyof import("../utils/types.js").PropsOf<TTag>, ("as" | "children" | "refName" | "class") | "disabled" | "autofocus" | "type"> extends infer T extends keyof import("../utils/types.js").PropsOf<TTag> ? { [P in T]: import("../utils/types.js").PropsOf<TTag>[P]; } : never) & {
9
- children?: import("../utils/types.js").Children<{
9
+ children?: import("svelte").Snippet<[{
10
10
  disabled: boolean;
11
11
  hover: boolean;
12
12
  focus: boolean;
13
13
  active: boolean;
14
14
  autofocus: boolean;
15
- }> | undefined;
15
+ }, Record<string, any>]> | undefined;
16
16
  ref?: HTMLElement;
17
17
  } & (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) ? {
18
18
  class?: import("../utils/types.js").PropsOf<TTag>["class"] | ((bag: {
@@ -13,7 +13,7 @@ declare class __sveltets_Render<TTag extends ElementType = typeof DEFAULT_DATA_I
13
13
  props(): {
14
14
  as?: TTag | undefined;
15
15
  } & (Exclude<keyof import("../utils/types.js").PropsOf<TTag>, "as" | "children" | "refName" | "class"> extends infer T extends keyof import("../utils/types.js").PropsOf<TTag> ? { [P in T]: import("../utils/types.js").PropsOf<TTag>[P]; } : never) & {
16
- children?: import("../utils/types.js").Children<DataInteractiveRenderPropArg> | undefined;
16
+ children?: Snippet<[DataInteractiveRenderPropArg, Record<string, any>]> | undefined;
17
17
  ref?: HTMLElement;
18
18
  } & (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) ? {
19
19
  class?: import("../utils/types.js").PropsOf<TTag>["class"] | ((bag: DataInteractiveRenderPropArg) => string) | undefined;
@@ -5,7 +5,7 @@ declare class __sveltets_Render<TTag extends ElementType = typeof DEFAULT_DESCRI
5
5
  props(): {
6
6
  as?: TTag | undefined;
7
7
  } & (Exclude<keyof PropsOf<TTag>, "as" | "children" | "refName" | "class"> extends infer T extends keyof PropsOf<TTag> ? { [P in T]: PropsOf<TTag>[P]; } : never) & {
8
- children?: import("../utils/types.js").Children<{}> | undefined;
8
+ children?: import("svelte").Snippet<[{}, Record<string, any>]> | undefined;
9
9
  ref?: HTMLElement;
10
10
  } & (true extends (PropsOf<TTag> extends infer T_1 ? T_1 extends 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) ? {
11
11
  class?: PropsOf<TTag>["class"] | ((bag: {}) => string) | undefined;
@@ -1,7 +1,7 @@
1
1
  import { getContext, setContext } from "svelte";
2
2
  export function useDescriptionContext() {
3
3
  let context = getContext("DescriptionContext");
4
- if (context === null) {
4
+ if (!context) {
5
5
  let err = new Error("You used a <Description /> component, but it is not inside a relevant parent.");
6
6
  if (Error.captureStackTrace)
7
7
  Error.captureStackTrace(err, useDescriptionContext);
@@ -22,7 +22,7 @@ declare class __sveltets_Render<TTag extends ElementType = typeof DEFAULT_DIALOG
22
22
  props(): {
23
23
  as?: TTag | undefined;
24
24
  } & (Exclude<keyof import("../utils/types.js").PropsOf<TTag>, ("as" | "children" | "refName" | "class") | "autofocus" | "unmount" | "static" | "id" | "role" | "onclose" | "initialFocus" | DialogPropsWeControl | "open" | "transition" | "__demoMode"> extends infer T extends keyof import("../utils/types.js").PropsOf<TTag> ? { [P in T]: import("../utils/types.js").PropsOf<TTag>[P]; } : never) & {
25
- children?: import("../utils/types.js").Children<DialogRenderPropArg> | undefined;
25
+ children?: Snippet<[DialogRenderPropArg, Record<string, any>]> | undefined;
26
26
  ref?: HTMLElement;
27
27
  } & (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) ? {
28
28
  class?: import("../utils/types.js").PropsOf<TTag>["class"] | ((bag: DialogRenderPropArg) => string) | undefined;
@@ -10,7 +10,7 @@ declare class __sveltets_Render<TTag extends ElementType = typeof DEFAULT_BACKDR
10
10
  props(): {
11
11
  as?: TTag | undefined;
12
12
  } & (Exclude<keyof import("../utils/types.js").PropsOf<TTag>, ("as" | "children" | "refName" | "class") | "transition"> extends infer T extends keyof import("../utils/types.js").PropsOf<TTag> ? { [P in T]: import("../utils/types.js").PropsOf<TTag>[P]; } : never) & {
13
- children?: import("../utils/types.js").Children<BackdropRenderPropArg> | undefined;
13
+ children?: import("svelte").Snippet<[BackdropRenderPropArg, Record<string, any>]> | undefined;
14
14
  ref?: HTMLElement;
15
15
  } & (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) ? {
16
16
  class?: import("../utils/types.js").PropsOf<TTag>["class"] | ((bag: BackdropRenderPropArg) => string) | undefined;
@@ -6,7 +6,6 @@ import { DialogStates, useDialogContext } from "./context.svelte.js";
6
6
  import ElementOrComponent from "../utils/ElementOrComponent.svelte";
7
7
  import { mergeProps } from "../utils/render.js";
8
8
  import TransitionChild from "../transition/TransitionChild.svelte";
9
- import { onMount } from "svelte";
10
9
  let internalId = useId();
11
10
  let {
12
11
  ref = $bindable(),
@@ -11,7 +11,7 @@ declare class __sveltets_Render<TTag extends ElementType = typeof DEFAULT_PANEL_
11
11
  props(): {
12
12
  as?: TTag | undefined;
13
13
  } & (Exclude<keyof import("../utils/types.js").PropsOf<TTag>, ("as" | "children" | "refName" | "class") | "id" | "transition"> extends infer T extends keyof import("../utils/types.js").PropsOf<TTag> ? { [P in T]: import("../utils/types.js").PropsOf<TTag>[P]; } : never) & {
14
- children?: import("../utils/types.js").Children<PanelRenderPropArg> | undefined;
14
+ children?: import("svelte").Snippet<[PanelRenderPropArg, Record<string, any>]> | undefined;
15
15
  ref?: HTMLElement;
16
16
  } & (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) ? {
17
17
  class?: import("../utils/types.js").PropsOf<TTag>["class"] | ((bag: PanelRenderPropArg) => string) | undefined;
@@ -8,7 +8,7 @@ declare class __sveltets_Render<TTag extends ElementType = typeof DEFAULT_TITLE_
8
8
  props(): {
9
9
  as?: TTag | undefined;
10
10
  } & (Exclude<keyof PropsOf<TTag>, "as" | "children" | "refName" | "class"> extends infer T extends keyof PropsOf<TTag> ? { [P in T]: PropsOf<TTag>[P]; } : never) & {
11
- children?: import("../utils/types.js").Children<TitleRenderPropArg> | undefined;
11
+ children?: import("svelte").Snippet<[TitleRenderPropArg, Record<string, any>]> | undefined;
12
12
  ref?: HTMLElement;
13
13
  } & (true extends (PropsOf<TTag> extends infer T_1 ? T_1 extends 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) ? {
14
14
  class?: PropsOf<TTag>["class"] | ((bag: TitleRenderPropArg) => string) | undefined;
@@ -4,7 +4,7 @@ declare class __sveltets_Render<TTag extends ElementType = typeof DEFAULT_DIALOG
4
4
  props(): {
5
5
  as?: TTag | undefined;
6
6
  } & (Exclude<keyof import("../utils/types.js").PropsOf<TTag>, ("as" | "children" | "refName" | "class") | "autofocus" | "unmount" | "static" | "id" | "role" | "onclose" | "initialFocus" | ("aria-describedby" | "aria-labelledby" | "aria-modal") | "open" | "transition" | "__demoMode"> extends infer T extends keyof import("../utils/types.js").PropsOf<TTag> ? { [P in T]: import("../utils/types.js").PropsOf<TTag>[P]; } : never) & {
7
- children?: import("../utils/types.js").Children<DialogRenderPropArg> | undefined;
7
+ children?: import("svelte").Snippet<[DialogRenderPropArg, Record<string, any>]> | undefined;
8
8
  ref?: HTMLElement;
9
9
  } & (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) ? {
10
10
  class?: import("../utils/types.js").PropsOf<TTag>["class"] | ((bag: DialogRenderPropArg) => string) | undefined;
@@ -6,7 +6,7 @@ export var DialogStates;
6
6
  })(DialogStates || (DialogStates = {}));
7
7
  export function useDialogContext(component) {
8
8
  const context = getContext("DialogContext");
9
- if (context === null) {
9
+ if (!context) {
10
10
  let err = new Error(`<${component} /> is missing a parent <Dialog /> component.`);
11
11
  if (Error.captureStackTrace)
12
12
  Error.captureStackTrace(err, useDialogContext);
@@ -3,13 +3,18 @@
3
3
 
4
4
  <script lang="ts" generics="TTag extends ElementType = typeof DEFAULT_FIELD_TAG">import { useDisabled } from "../hooks/use-disabled.js";
5
5
  import { createIdContext } from "../utils/id.js";
6
- import { stateFromSlot } from "../utils/state.js";
7
6
  import { nanoid } from "nanoid";
8
7
  import { setContext } from "svelte";
9
8
  import { useLabels } from "../label/context.svelte.js";
10
9
  import { useDescriptions } from "../description/context.svelte.js";
11
10
  import ElementOrComponent from "../utils/ElementOrComponent.svelte";
12
- let { ref = $bindable(), disabled: ownDisabled = false, ...theirProps } = $props();
11
+ import FormFieldsProvider from "../internal/FormFieldsProvider.svelte";
12
+ let {
13
+ ref = $bindable(),
14
+ disabled: ownDisabled = false,
15
+ children: theirChildren,
16
+ ...theirProps
17
+ } = $props();
13
18
  const inputId = `headlessui-control-${nanoid(8)}`;
14
19
  createIdContext(inputId);
15
20
  useLabels();
@@ -28,4 +33,17 @@ const ourProps = $derived({
28
33
  });
29
34
  </script>
30
35
 
31
- <ElementOrComponent {ourProps} {theirProps} {slot} defaultTag={DEFAULT_FIELD_TAG} name="Field" bind:ref />
36
+ {#snippet children(slot: FieldRenderPropArg, props: Record<string, any>)}
37
+ <FormFieldsProvider>
38
+ {#if theirChildren}{@render theirChildren(slot, props)}{/if}
39
+ </FormFieldsProvider>
40
+ {/snippet}
41
+
42
+ <ElementOrComponent
43
+ {ourProps}
44
+ theirProps={{ ...theirProps, children }}
45
+ {slot}
46
+ defaultTag={DEFAULT_FIELD_TAG}
47
+ name="Field"
48
+ bind:ref
49
+ />
@@ -9,7 +9,7 @@ declare class __sveltets_Render<TTag extends ElementType = typeof DEFAULT_FIELD_
9
9
  props(): {
10
10
  as?: TTag | undefined;
11
11
  } & (Exclude<keyof import("../utils/types.js").PropsOf<TTag>, ("as" | "children" | "refName" | "class") | "disabled"> extends infer T extends keyof import("../utils/types.js").PropsOf<TTag> ? { [P in T]: import("../utils/types.js").PropsOf<TTag>[P]; } : never) & {
12
- children?: import("../utils/types.js").Children<FieldRenderPropArg> | undefined;
12
+ children?: import("svelte").Snippet<[FieldRenderPropArg, Record<string, any>]> | undefined;
13
13
  ref?: HTMLElement;
14
14
  } & (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) ? {
15
15
  class?: import("../utils/types.js").PropsOf<TTag>["class"] | ((bag: FieldRenderPropArg) => string) | undefined;
@@ -9,7 +9,7 @@ declare class __sveltets_Render<TTag extends ElementType = typeof DEFAULT_FIELDS
9
9
  props(): {
10
10
  as?: TTag | undefined;
11
11
  } & (Exclude<keyof import("../utils/types.js").PropsOf<TTag>, ("as" | "children" | "refName" | "class") | "disabled" | FieldsetPropsWeControl> extends infer T extends keyof import("../utils/types.js").PropsOf<TTag> ? { [P in T]: import("../utils/types.js").PropsOf<TTag>[P]; } : never) & {
12
- children?: import("../utils/types.js").Children<FieldsetRenderPropArg> | undefined;
12
+ children?: import("svelte").Snippet<[FieldsetRenderPropArg, Record<string, any>]> | undefined;
13
13
  ref?: HTMLElement;
14
14
  } & (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) ? {
15
15
  class?: import("../utils/types.js").PropsOf<TTag>["class"] | ((bag: FieldsetRenderPropArg) => string) | undefined;
@@ -11,6 +11,7 @@ import { match } from "../utils/match.js";
11
11
  import { useDisposables } from "../utils/disposables.js";
12
12
  import Hidden, { HiddenFeatures } from "../internal/Hidden.svelte";
13
13
  import ElementOrComponent from "../utils/ElementOrComponent.svelte";
14
+ import { FocusTrapFeatures } from "./FocusTrapFeatures.js";
14
15
  function resolveContainers(containers) {
15
16
  if (!containers) return /* @__PURE__ */ new Set();
16
17
  if (typeof containers === "function") return new Set(containers());
@@ -23,15 +24,7 @@ function resolveContainers(containers) {
23
24
  return all;
24
25
  }
25
26
  let DEFAULT_FOCUS_TRAP_TAG = "div";
26
- export var FocusTrapFeatures = /* @__PURE__ */ ((FocusTrapFeatures2) => {
27
- FocusTrapFeatures2[FocusTrapFeatures2["None"] = 0] = "None";
28
- FocusTrapFeatures2[FocusTrapFeatures2["InitialFocus"] = 1] = "InitialFocus";
29
- FocusTrapFeatures2[FocusTrapFeatures2["TabLock"] = 2] = "TabLock";
30
- FocusTrapFeatures2[FocusTrapFeatures2["FocusLock"] = 4] = "FocusLock";
31
- FocusTrapFeatures2[FocusTrapFeatures2["RestoreFocus"] = 8] = "RestoreFocus";
32
- FocusTrapFeatures2[FocusTrapFeatures2["AutoFocus"] = 16] = "AutoFocus";
33
- return FocusTrapFeatures2;
34
- })(FocusTrapFeatures || {});
27
+ export * from "./FocusTrapFeatures.js";
35
28
  function useRestoreElement(options) {
36
29
  const { enabled } = $derived(options ?? { enabled: true });
37
30
  let localHistory = $state(history.slice());
@@ -58,7 +51,7 @@ function useRestoreElement(options) {
58
51
  }
59
52
  function useRestoreFocus(options) {
60
53
  const { features, ownerDocument } = $derived(options);
61
- const enabled = $derived(Boolean(features & 8 /* RestoreFocus */));
54
+ const enabled = $derived(Boolean(features & FocusTrapFeatures.RestoreFocus));
62
55
  const restoreElement = useRestoreElement({
63
56
  get enabled() {
64
57
  return enabled;
@@ -85,14 +78,14 @@ function useInitialFocus(options) {
85
78
  let previousActiveElement = $state(null);
86
79
  let enabled = useIsTopLayer({
87
80
  get enabled() {
88
- return Boolean(features & 1 /* InitialFocus */);
81
+ return Boolean(features & FocusTrapFeatures.InitialFocus);
89
82
  },
90
83
  scope: "focus-trap#initial-focus"
91
84
  });
92
85
  let mounted = useIsMounted();
93
86
  useWatch({
94
87
  action: () => {
95
- if (features === 0 /* None */) {
88
+ if (features === FocusTrapFeatures.None) {
96
89
  return;
97
90
  }
98
91
  if (!enabled) {
@@ -120,7 +113,7 @@ function useInitialFocus(options) {
120
113
  if (initialFocus) {
121
114
  focusElement(initialFocus);
122
115
  } else {
123
- if (features & 16 /* AutoFocus */) {
116
+ if (features & FocusTrapFeatures.AutoFocus) {
124
117
  if (focusIn(containerElement, Focus.First | Focus.AutoFocus) !== FocusResult.Error) {
125
118
  return;
126
119
  }
@@ -154,7 +147,7 @@ function useInitialFocus(options) {
154
147
  function useFocusLock(options) {
155
148
  let { features, ownerDocument, container, containers, previousActiveElement } = $derived(options);
156
149
  const mounted = useIsMounted();
157
- const enabled = $derived(Boolean(features & 4 /* FocusLock */));
150
+ const enabled = $derived(Boolean(features & FocusTrapFeatures.FocusLock));
158
151
  useEventListener({
159
152
  get element() {
160
153
  return ownerDocument?.defaultView;
@@ -1,20 +1,8 @@
1
1
  import type { ElementType, Props } from "../utils/types.js";
2
+ import { FocusTrapFeatures } from "./FocusTrapFeatures.js";
2
3
  type Containers = (() => Iterable<HTMLElement>) | Iterable<HTMLElement>;
3
4
  declare let DEFAULT_FOCUS_TRAP_TAG: "div";
4
- export declare enum FocusTrapFeatures {
5
- /** No features enabled for the focus trap. */
6
- None = 0,
7
- /** Ensure that we move focus initially into the container. */
8
- InitialFocus = 1,
9
- /** Ensure that pressing `Tab` and `Shift+Tab` is trapped within the container. */
10
- TabLock = 2,
11
- /** Ensure that programmatically moving focus outside of the container is disallowed. */
12
- FocusLock = 4,
13
- /** Ensure that we restore the focus when unmounting the focus trap. */
14
- RestoreFocus = 8,
15
- /** Initial focus should look for the `data-autofocus` */
16
- AutoFocus = 16
17
- }
5
+ export * from "./FocusTrapFeatures.js";
18
6
  type FocusTrapRenderPropArg = {};
19
7
  type FocusTrapPropsWeControl = never;
20
8
  export type FocusTrapProps<TTag extends ElementType = typeof DEFAULT_FOCUS_TRAP_TAG> = Props<TTag, FocusTrapRenderPropArg, FocusTrapPropsWeControl, {
@@ -27,7 +15,7 @@ declare class __sveltets_Render<TTag extends ElementType = typeof DEFAULT_FOCUS_
27
15
  props(): {
28
16
  as?: TTag | undefined;
29
17
  } & (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) & {
30
- children?: import("../utils/types.js").Children<FocusTrapRenderPropArg> | undefined;
18
+ children?: import("svelte").Snippet<[FocusTrapRenderPropArg, Record<string, any>]> | undefined;
31
19
  ref?: HTMLElement;
32
20
  } & (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) ? {
33
21
  class?: import("../utils/types.js").PropsOf<TTag>["class"] | ((bag: FocusTrapRenderPropArg) => string) | undefined;
@@ -0,0 +1,14 @@
1
+ export declare enum FocusTrapFeatures {
2
+ /** No features enabled for the focus trap. */
3
+ None = 0,
4
+ /** Ensure that we move focus initially into the container. */
5
+ InitialFocus = 1,
6
+ /** Ensure that pressing `Tab` and `Shift+Tab` is trapped within the container. */
7
+ TabLock = 2,
8
+ /** Ensure that programmatically moving focus outside of the container is disallowed. */
9
+ FocusLock = 4,
10
+ /** Ensure that we restore the focus when unmounting the focus trap. */
11
+ RestoreFocus = 8,
12
+ /** Initial focus should look for the `data-autofocus` */
13
+ AutoFocus = 16
14
+ }
@@ -0,0 +1,15 @@
1
+ export var FocusTrapFeatures;
2
+ (function (FocusTrapFeatures) {
3
+ /** No features enabled for the focus trap. */
4
+ FocusTrapFeatures[FocusTrapFeatures["None"] = 0] = "None";
5
+ /** Ensure that we move focus initially into the container. */
6
+ FocusTrapFeatures[FocusTrapFeatures["InitialFocus"] = 1] = "InitialFocus";
7
+ /** Ensure that pressing `Tab` and `Shift+Tab` is trapped within the container. */
8
+ FocusTrapFeatures[FocusTrapFeatures["TabLock"] = 2] = "TabLock";
9
+ /** Ensure that programmatically moving focus outside of the container is disallowed. */
10
+ FocusTrapFeatures[FocusTrapFeatures["FocusLock"] = 4] = "FocusLock";
11
+ /** Ensure that we restore the focus when unmounting the focus trap. */
12
+ FocusTrapFeatures[FocusTrapFeatures["RestoreFocus"] = 8] = "RestoreFocus";
13
+ /** Initial focus should look for the `data-autofocus` */
14
+ FocusTrapFeatures[FocusTrapFeatures["AutoFocus"] = 16] = "AutoFocus";
15
+ })(FocusTrapFeatures || (FocusTrapFeatures = {}));
@@ -27,7 +27,8 @@ export function useControllable(input, onchange, defaultValue) {
27
27
  }
28
28
  else {
29
29
  internalValue = value;
30
- input.controlledValue = value;
30
+ if (isControlled)
31
+ input.controlledValue = value;
31
32
  }
32
33
  },
33
34
  };
@@ -1,23 +1,18 @@
1
1
  export function useDidElementMove(options) {
2
2
  const { enabled, element } = $derived(options);
3
- let elementPosition = $state({ left: 0, top: 0 });
3
+ let elementPosition = $state();
4
4
  $effect(() => {
5
5
  if (!element)
6
6
  return;
7
- let DOMRect = element.getBoundingClientRect();
7
+ const DOMRect = element.getBoundingClientRect();
8
8
  if (DOMRect)
9
9
  elementPosition = DOMRect;
10
10
  });
11
11
  const value = $derived.by(() => {
12
- if (element == null)
12
+ if (element == null || !enabled || element === document.activeElement || elementPosition === undefined)
13
13
  return false;
14
- if (!enabled)
15
- return false;
16
- if (element === document.activeElement)
17
- return false;
18
- let buttonRect = element.getBoundingClientRect();
19
- let didElementMove = buttonRect.top !== elementPosition.top || buttonRect.left !== elementPosition.left;
20
- return didElementMove;
14
+ const buttonRect = element.getBoundingClientRect();
15
+ return buttonRect.top !== elementPosition.top || buttonRect.left !== elementPosition.left;
21
16
  });
22
17
  return {
23
18
  get value() {
@@ -1,6 +1,6 @@
1
1
  export declare function useEventListener<TType extends keyof WindowEventMap>(params: {
2
2
  element: HTMLElement | Document | Window | EventTarget | null | undefined;
3
3
  type: TType;
4
- listener: (event: WindowEventMap[TType]) => any;
4
+ listener: (event: WindowEventMap[TType]) => unknown;
5
5
  options?: boolean | AddEventListenerOptions;
6
6
  }): void;
@@ -1,5 +1,7 @@
1
1
  export function useEventListener(params) {
2
- let { element = window, type, listener, options } = $derived(params);
2
+ if (typeof window === "undefined")
3
+ return;
4
+ const { element = window, type, listener, options } = $derived(params);
3
5
  $effect(() => {
4
6
  if (!element)
5
7
  return;
@@ -1,8 +1,8 @@
1
1
  export { default as MainTreeProvider, useMainTreeNode } from "../internal/MainTreeProvider.svelte";
2
2
  export declare function useRootContainers(options?: {
3
- defaultContainers?: (HTMLElement | null)[];
3
+ defaultContainers?: (HTMLElement | undefined | null)[];
4
4
  portals?: HTMLElement[];
5
- mainTreeNode?: HTMLElement | null;
5
+ mainTreeNode?: HTMLElement | undefined | null;
6
6
  }): {
7
7
  readonly resolvedContainers: HTMLElement[];
8
8
  contains: (element: HTMLElement) => boolean;
@@ -6,21 +6,21 @@ export function useRootContainers(options = {}) {
6
6
  mainTreeNode, } = $derived(options);
7
7
  const ownerDocument = $derived(getOwnerDocument(mainTreeNode));
8
8
  const resolvedContainers = $derived.by(() => {
9
- let containers = [];
9
+ const containers = [];
10
10
  // Resolve default containers
11
- for (let container of defaultContainers) {
12
- if (container === null)
11
+ for (const container of defaultContainers) {
12
+ if (!container)
13
13
  continue;
14
14
  containers.push(container);
15
15
  }
16
16
  // Resolve portal containers
17
17
  if (portals) {
18
- for (let portal of portals) {
18
+ for (const portal of portals) {
19
19
  containers.push(portal);
20
20
  }
21
21
  }
22
22
  // Resolve third party (root) containers
23
- for (let container of ownerDocument?.querySelectorAll("html > *, body > *") ?? []) {
23
+ for (const container of ownerDocument?.querySelectorAll("html > *, body > *") ?? []) {
24
24
  if (container === document.body)
25
25
  continue; // Skip `<body>`
26
26
  if (container === document.head)
@@ -6,7 +6,7 @@ export var Direction;
6
6
  })(Direction || (Direction = {}));
7
7
  export function useTabDirection() {
8
8
  let direction = $state(Direction.Forwards);
9
- let enabled = true;
9
+ const enabled = true;
10
10
  useWindowEvent({
11
11
  enabled,
12
12
  type: "keydown",
package/dist/index.d.ts CHANGED
@@ -11,8 +11,11 @@ export * from "./label/index.js";
11
11
  export * from "./legend/index.js";
12
12
  export * from "./listbox/index.js";
13
13
  export * from "./menu/index.js";
14
+ export * from "./popover/index.js";
15
+ export * from "./select/index.js";
14
16
  export * from "./switch/index.js";
15
17
  export * from "./tabs/index.js";
18
+ export * from "./textarea/index.js";
16
19
  export * from "./transition/index.js";
17
20
  export * from "./hooks/use-id.js";
18
21
  export * from "./utils/types.js";
package/dist/index.js CHANGED
@@ -11,8 +11,11 @@ export * from "./label/index.js";
11
11
  export * from "./legend/index.js";
12
12
  export * from "./listbox/index.js";
13
13
  export * from "./menu/index.js";
14
+ export * from "./popover/index.js";
15
+ export * from "./select/index.js";
14
16
  export * from "./switch/index.js";
15
17
  export * from "./tabs/index.js";
18
+ export * from "./textarea/index.js";
16
19
  export * from "./transition/index.js";
17
20
  export * from "./hooks/use-id.js";
18
21
  export * from "./utils/types.js";
@@ -3,7 +3,7 @@
3
3
 
4
4
  <script lang="ts" generics="TTag extends ElementType = typeof DEFAULT_INPUT_TAG, TValue = string">import { htmlid } from "../utils/id.js";
5
5
  import { useDisabled } from "../hooks/use-disabled.js";
6
- import { useProvidedId } from "../internal/id.js";
6
+ import { useProvidedId } from "../utils/id.js";
7
7
  import { useLabelledBy } from "../label/context.svelte.js";
8
8
  import { useDescribedBy } from "../description/context.svelte.js";
9
9
  import { useHover } from "../hooks/use-hover.svelte.js";
@@ -16,7 +16,7 @@ const providedDisabled = useDisabled();
16
16
  let {
17
17
  ref = $bindable(),
18
18
  value = $bindable(),
19
- id = providedId?.value || `headlessui-input-${internalId}`,
19
+ id = providedId || `headlessui-input-${internalId}`,
20
20
  disabled: theirDisabled = false,
21
21
  autofocus = false,
22
22
  invalid = false,
@@ -1,4 +1,4 @@
1
- import type { ElementType, Props } from "../utils/types.js";
1
+ import type { ElementType, Props, PropsOf } from "../utils/types.js";
2
2
  declare const DEFAULT_INPUT_TAG: "input";
3
3
  type InputRenderPropArg = {
4
4
  disabled: boolean;
@@ -9,7 +9,6 @@ type InputRenderPropArg = {
9
9
  };
10
10
  type InputPropsWeControl = "aria-labelledby" | "aria-describedby";
11
11
  export type InputProps<TTag extends ElementType = typeof DEFAULT_INPUT_TAG, TValue = string> = Props<TTag, InputRenderPropArg, InputPropsWeControl, {
12
- id?: string;
13
12
  value?: TValue;
14
13
  disabled?: boolean;
15
14
  invalid?: boolean;
@@ -19,13 +18,12 @@ declare class __sveltets_Render<TTag extends ElementType = typeof DEFAULT_INPUT_
19
18
  props(): {
20
19
  as?: TTag | undefined;
21
20
  value?: TValue | undefined;
22
- } & (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) & {
23
- children?: import("../utils/types.js").Children<InputRenderPropArg> | undefined;
21
+ } & (Exclude<keyof PropsOf<TTag>, ("as" | "children" | "refName" | "class") | "invalid" | "disabled" | "autofocus" | "value" | InputPropsWeControl> extends infer T extends keyof PropsOf<TTag> ? { [P in T]: PropsOf<TTag>[P]; } : never) & {
22
+ children?: import("svelte").Snippet<[InputRenderPropArg, Record<string, any>]> | undefined;
24
23
  ref?: HTMLElement;
25
- } & (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) ? {
26
- class?: import("../utils/types.js").PropsOf<TTag>["class"] | ((bag: InputRenderPropArg) => string) | undefined;
24
+ } & (true extends (PropsOf<TTag> extends infer T_1 ? T_1 extends 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) ? {
25
+ class?: PropsOf<TTag>["class"] | ((bag: InputRenderPropArg) => string) | undefined;
27
26
  } : {}) & {
28
- id?: string;
29
27
  value?: TValue | undefined;
30
28
  disabled?: boolean;
31
29
  invalid?: boolean;
@@ -0,0 +1,12 @@
1
+ <script lang="ts" module></script>
2
+
3
+ <script lang="ts">import { useFloatingProvider } from "./floating-provider.svelte.js";
4
+ const { children, enabled = true } = $props();
5
+ useFloatingProvider({
6
+ get enabled() {
7
+ return enabled;
8
+ }
9
+ });
10
+ </script>
11
+
12
+ {#if children}{@render children()}{/if}