@pzerelles/headlessui-svelte 2.1.2-next.43 → 2.1.2-next.44

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.
@@ -63,7 +63,7 @@
63
63
  })
64
64
  )
65
65
 
66
- const slot = $derived({
66
+ const slots = $derived({
67
67
  disabled,
68
68
  hover,
69
69
  focus,
@@ -85,4 +85,4 @@
85
85
  )
86
86
  </script>
87
87
 
88
- <ElementOrComponent {ourProps} {theirProps} {slot} defaultTag={DEFAULT_BUTTON_TAG} name="Button" bind:element />
88
+ <ElementOrComponent {ourProps} {theirProps} {slots} defaultTag={DEFAULT_BUTTON_TAG} name="Button" bind:element />
@@ -196,7 +196,7 @@
196
196
  <ElementOrComponent
197
197
  {ourProps}
198
198
  {theirProps}
199
- {slot}
199
+ slots={slot}
200
200
  defaultTag={DEFAULT_CHECKBOX_TAG}
201
201
  name="Checkbox"
202
202
  bind:element
@@ -50,4 +50,4 @@
50
50
  const ourProps = $derived(mergeProps(focusProps, hoverProps, pressProps))
51
51
  </script>
52
52
 
53
- <ElementOrComponent {ourProps} {theirProps} {slot} name="DataInteractive" />
53
+ <ElementOrComponent {ourProps} {theirProps} slots={slot} name="DataInteractive" />
@@ -30,14 +30,14 @@
30
30
  })
31
31
 
32
32
  const disabled = $derived(providedDisabled.current || false)
33
- const slot = $derived({ disabled })
33
+ const slots = $derived({ disabled })
34
34
  const ourProps = $derived({ id })
35
35
  </script>
36
36
 
37
37
  <ElementOrComponent
38
38
  {ourProps}
39
39
  {theirProps}
40
- slots={slot}
40
+ {slots}
41
41
  defaultTag={DEFAULT_DESCRIPTION_TAG}
42
42
  name="Description"
43
43
  bind:element
@@ -48,7 +48,7 @@
48
48
  <ElementOrComponent
49
49
  {ourProps}
50
50
  theirProps={{ ...theirProps, children: wrapper }}
51
- {slot}
51
+ slots={slot}
52
52
  defaultTag={DEFAULT_FIELD_TAG}
53
53
  name="Field"
54
54
  bind:element
@@ -46,4 +46,11 @@
46
46
  )
47
47
  </script>
48
48
 
49
- <ElementOrComponent {ourProps} {theirProps} {slot} defaultTag={DEFAULT_FIELDSET_TAG} name="Fieldset" bind:element />
49
+ <ElementOrComponent
50
+ {ourProps}
51
+ {theirProps}
52
+ slots={slot}
53
+ defaultTag={DEFAULT_FIELDSET_TAG}
54
+ name="Fieldset"
55
+ bind:element
56
+ />
@@ -90,7 +90,7 @@
90
90
  <ElementOrComponent
91
91
  {ourProps}
92
92
  {theirProps}
93
- {slot}
93
+ slots={slot}
94
94
  defaultTag={DEFAULT_INPUT_TAG}
95
95
  name="Input"
96
96
  bind:element
@@ -180,4 +180,11 @@
180
180
  )
181
181
  </script>
182
182
 
183
- <ElementOrComponent {ourProps} {theirProps} {slot} defaultTag={DEFAULT_BUTTON_TAG} name="ListboxButton" bind:element />
183
+ <ElementOrComponent
184
+ {ourProps}
185
+ {theirProps}
186
+ slots={slot}
187
+ defaultTag={DEFAULT_BUTTON_TAG}
188
+ name="ListboxButton"
189
+ bind:element
190
+ />
@@ -179,5 +179,12 @@
179
179
  </script>
180
180
 
181
181
  {#if selected || !usedInSelectedOption}
182
- <ElementOrComponent {ourProps} {theirProps} {slot} defaultTag={DEFAULT_OPTION_TAG} name="Listbox" bind:element />
182
+ <ElementOrComponent
183
+ {ourProps}
184
+ {theirProps}
185
+ slots={slot}
186
+ defaultTag={DEFAULT_OPTION_TAG}
187
+ name="Listbox"
188
+ bind:element
189
+ />
183
190
  {/if}
@@ -49,7 +49,7 @@
49
49
 
50
50
  <ElementOrComponent
51
51
  theirProps={{ ...theirProps, ...(theirProps.asChild ? {} : { children: option }) }}
52
- slot={{ option }}
52
+ slots={{ option }}
53
53
  defaultTag={DEFAULT_SELECTED_OPTION_TAG}
54
54
  name="ListboxSelectedOption"
55
55
  bind:element
@@ -77,4 +77,4 @@
77
77
  })
78
78
  </script>
79
79
 
80
- <ElementOrComponent {theirProps} {slot} name="Menu" />
80
+ <ElementOrComponent {theirProps} slots={slot} name="Menu" />
@@ -164,4 +164,11 @@
164
164
  )
165
165
  </script>
166
166
 
167
- <ElementOrComponent {ourProps} {theirProps} {slot} defaultTag={DEFAULT_BUTTON_TAG} name="MenuButton" bind:element />
167
+ <ElementOrComponent
168
+ {ourProps}
169
+ {theirProps}
170
+ slots={slot}
171
+ defaultTag={DEFAULT_BUTTON_TAG}
172
+ name="MenuButton"
173
+ bind:element
174
+ />
@@ -144,4 +144,4 @@
144
144
  )
145
145
  </script>
146
146
 
147
- <ElementOrComponent {ourProps} {theirProps} {slot} defaultTag={DEFAULT_ITEM_TAG} name="MenuItem" bind:element />
147
+ <ElementOrComponent {ourProps} {theirProps} slots={slot} defaultTag={DEFAULT_ITEM_TAG} name="MenuItem" bind:element />
@@ -228,7 +228,7 @@
228
228
  autofocus,
229
229
  } satisfies PopoverButtonSlot)
230
230
 
231
- const type = useResolveButtonType({
231
+ const buttonType = useResolveButtonType({
232
232
  get props() {
233
233
  return { type: theirProps.type ?? undefined, as: element ? element.tagName.toLowerCase() : DEFAULT_BUTTON_TAG }
234
234
  },
@@ -240,7 +240,7 @@
240
240
  isWithinPanel
241
241
  ? mergeProps(
242
242
  {
243
- type,
243
+ type: buttonType.type,
244
244
  onkeydown: handleKeyDown,
245
245
  onclick: handleClick,
246
246
  disabled: disabled || undefined,
@@ -253,7 +253,7 @@
253
253
  : mergeProps(
254
254
  {
255
255
  id: context.buttonId,
256
- type,
256
+ type: buttonType.type,
257
257
  "aria-expanded": context.popoverState === PopoverStates.Open,
258
258
  "aria-controls": context.panel ? context.panelId : undefined,
259
259
  disabled: disabled || undefined,
@@ -132,4 +132,11 @@
132
132
  } satisfies RadioRenderPropArg)
133
133
  </script>
134
134
 
135
- <ElementOrComponent {ourProps} {theirProps} {slot} defaultTag={DEFAULT_RADIO_TAG} bind:element name="RadioOption" />
135
+ <ElementOrComponent
136
+ {ourProps}
137
+ {theirProps}
138
+ slots={slot}
139
+ defaultTag={DEFAULT_RADIO_TAG}
140
+ bind:element
141
+ name="RadioOption"
142
+ />
@@ -215,7 +215,7 @@
215
215
  <ElementOrComponent
216
216
  {ourProps}
217
217
  {theirProps}
218
- {slot}
218
+ slots={slot}
219
219
  defaultTag={DEFAULT_RADIO_GROUP_TAG}
220
220
  bind:element
221
221
  name="RadioGroup"
@@ -135,4 +135,11 @@
135
135
  } satisfies RadioOptionRenderPropArg)
136
136
  </script>
137
137
 
138
- <ElementOrComponent {ourProps} {theirProps} {slot} defaultTag={DEFAULT_OPTION_TAG} bind:element name="RadioOption" />
138
+ <ElementOrComponent
139
+ {ourProps}
140
+ {theirProps}
141
+ slots={slot}
142
+ defaultTag={DEFAULT_OPTION_TAG}
143
+ bind:element
144
+ name="RadioOption"
145
+ />
@@ -104,7 +104,7 @@
104
104
  <ElementOrComponent
105
105
  {ourProps}
106
106
  {theirProps}
107
- {slot}
107
+ slots={slot}
108
108
  defaultTag={DEFAULT_SELECT_TAG}
109
109
  name="Select"
110
110
  bind:element
@@ -196,4 +196,4 @@
196
196
  />
197
197
  {/if}
198
198
 
199
- <ElementOrComponent {ourProps} {theirProps} {slot} defaultTag={DEFAULT_SWITCH_TAG} name="Switch" bind:element />
199
+ <ElementOrComponent {ourProps} {theirProps} slots={slot} defaultTag={DEFAULT_SWITCH_TAG} name="Switch" bind:element />
@@ -171,7 +171,7 @@
171
171
  disabled,
172
172
  } satisfies TabRenderPropArg)
173
173
 
174
- const resolvedType = useResolveButtonType({
174
+ const buttonType = useResolveButtonType({
175
175
  get props() {
176
176
  return { type: theirProps.type ?? undefined, as: element ? element.tagName.toLowerCase() : DEFAULT_TAB_TAG }
177
177
  },
@@ -188,7 +188,7 @@
188
188
  onclick: handleSelection,
189
189
  id,
190
190
  role: "tab",
191
- type: resolvedType.type,
191
+ type: buttonType.type,
192
192
  "aria-controls": panels[myIndex]?.current?.id,
193
193
  "aria-selected": selected,
194
194
  tabIndex: selected ? 0 : -1,
@@ -202,4 +202,4 @@
202
202
  )
203
203
  </script>
204
204
 
205
- <ElementOrComponent {ourProps} {theirProps} {slot} defaultTag={DEFAULT_TAB_TAG} name="Tab" bind:element />
205
+ <ElementOrComponent {ourProps} {theirProps} slots={slot} defaultTag={DEFAULT_TAB_TAG} name="Tab" bind:element />
@@ -30,4 +30,4 @@
30
30
  })
31
31
  </script>
32
32
 
33
- <ElementOrComponent {ourProps} {theirProps} {slot} defaultTag={DEFAULT_LIST_TAG} name="TabList" bind:element />
33
+ <ElementOrComponent {ourProps} {theirProps} slots={slot} defaultTag={DEFAULT_LIST_TAG} name="TabList" bind:element />
@@ -77,7 +77,7 @@
77
77
  <ElementOrComponent
78
78
  {ourProps}
79
79
  {theirProps}
80
- {slot}
80
+ slots={slot}
81
81
  defaultTag={DEFAULT_PANEL_TAG}
82
82
  features={PanelRenderFeatures}
83
83
  name="TabPanel"
@@ -22,4 +22,4 @@
22
22
  let { element = $bindable(), ...theirProps }: TabPanelsProps = $props()
23
23
  </script>
24
24
 
25
- <ElementOrComponent {theirProps} {slot} defaultTag={DEFAULT_PANELS_TAG} name="TabPanel" bind:element />
25
+ <ElementOrComponent {theirProps} slots={slot} defaultTag={DEFAULT_PANELS_TAG} name="TabPanel" bind:element />
@@ -93,7 +93,7 @@
93
93
  <ElementOrComponent
94
94
  {ourProps}
95
95
  {theirProps}
96
- {slot}
96
+ slots={slot}
97
97
  defaultTag={DEFAULT_TEXTAREA_TAG}
98
98
  name="Textarea"
99
99
  bind:element
@@ -6,8 +6,7 @@
6
6
  let {
7
7
  ourProps,
8
8
  theirProps,
9
- slots,
10
- slot = slots,
9
+ slots: slot,
11
10
  defaultTag,
12
11
  features,
13
12
  visible = true,
@@ -18,7 +17,6 @@
18
17
  }: {
19
18
  ourProps?: Expand<Props<any, TSlot> & PropsForFeatures<TFeature>>
20
19
  theirProps: Expand<Props<any, TSlot, any>>
21
- slot?: TSlot
22
20
  slots?: TSlot
23
21
  defaultTag?: string
24
22
  features?: TFeature
@@ -18,7 +18,6 @@ declare class __sveltets_Render<TFeature extends RenderFeatures, TSlot extends R
18
18
  unmount?: boolean;
19
19
  } : {}) ? T_1 extends any ? (x: T_1) => any : never : never : never) extends (x: infer R) => any ? R : never>> | undefined;
20
20
  theirProps: Expand<Props<any, TSlot_1, any>>;
21
- slot?: TSlot | undefined;
22
21
  slots?: TSlot | undefined;
23
22
  defaultTag?: string;
24
23
  features?: TFeature | undefined;
package/package.json CHANGED
@@ -1,6 +1,6 @@
1
1
  {
2
2
  "name": "@pzerelles/headlessui-svelte",
3
- "version": "2.1.2-next.43",
3
+ "version": "2.1.2-next.44",
4
4
  "scripts": {
5
5
  "dev": "vite dev",
6
6
  "build": "vite build && npm run package",