ui-ingredients 0.0.11 → 0.0.13

Sign up to get free protection for your applications and to get access to all the features.
Files changed (288) hide show
  1. package/README.md +1 -1
  2. package/dist/accordion/context.svelte.d.ts +2 -2
  3. package/dist/accordion/context.svelte.js +2 -2
  4. package/dist/accordion/item-content.svelte +28 -27
  5. package/dist/accordion/item-indicator.svelte +28 -27
  6. package/dist/accordion/item-trigger.svelte +28 -27
  7. package/dist/accordion/item.svelte +48 -48
  8. package/dist/accordion/root.svelte +68 -63
  9. package/dist/avatar/fallback.svelte +20 -20
  10. package/dist/avatar/image.svelte +18 -18
  11. package/dist/avatar/root.svelte +53 -48
  12. package/dist/carousel/indicator-group.svelte +21 -21
  13. package/dist/carousel/indicator.svelte +30 -30
  14. package/dist/carousel/item-group.svelte +20 -20
  15. package/dist/carousel/item.svelte +27 -27
  16. package/dist/carousel/next-trigger.svelte +21 -21
  17. package/dist/carousel/prev-trigger.svelte +21 -21
  18. package/dist/carousel/root.svelte +65 -60
  19. package/dist/carousel/viewport.svelte +20 -20
  20. package/dist/checkbox/control.svelte +20 -20
  21. package/dist/checkbox/hidden-input.svelte +19 -19
  22. package/dist/checkbox/indicator.svelte +20 -20
  23. package/dist/checkbox/label.svelte +20 -20
  24. package/dist/checkbox/root.svelte +69 -64
  25. package/dist/clipboard/control.svelte +20 -20
  26. package/dist/clipboard/indicator.svelte +22 -22
  27. package/dist/clipboard/input.svelte +18 -18
  28. package/dist/clipboard/label.svelte +20 -20
  29. package/dist/clipboard/root.svelte +56 -53
  30. package/dist/clipboard/trigger.svelte +21 -21
  31. package/dist/collapsible/content.svelte +20 -20
  32. package/dist/collapsible/root.svelte +64 -59
  33. package/dist/collapsible/trigger.svelte +19 -19
  34. package/dist/combobox/clear-trigger.svelte +21 -21
  35. package/dist/combobox/content.svelte +20 -20
  36. package/dist/combobox/context.svelte.d.ts +4 -4
  37. package/dist/combobox/context.svelte.js +4 -4
  38. package/dist/combobox/control.svelte +20 -20
  39. package/dist/combobox/input.svelte +18 -18
  40. package/dist/combobox/item-group-label.svelte +33 -32
  41. package/dist/combobox/item-group.svelte +32 -32
  42. package/dist/combobox/item-indicator.svelte +28 -27
  43. package/dist/combobox/item-text.svelte +29 -30
  44. package/dist/combobox/item.svelte +48 -48
  45. package/dist/combobox/label.svelte +20 -20
  46. package/dist/combobox/list.svelte +20 -20
  47. package/dist/combobox/positioner.svelte +20 -20
  48. package/dist/combobox/root.svelte +129 -124
  49. package/dist/combobox/trigger.svelte +20 -20
  50. package/dist/dialog/backdrop.svelte +20 -20
  51. package/dist/dialog/close-trigger.svelte +21 -21
  52. package/dist/dialog/content.svelte +20 -20
  53. package/dist/dialog/description.svelte +20 -20
  54. package/dist/dialog/positioner.svelte +20 -20
  55. package/dist/dialog/root.svelte +35 -28
  56. package/dist/dialog/title.svelte +20 -20
  57. package/dist/dialog/trigger.svelte +20 -20
  58. package/dist/editable/area.svelte +20 -20
  59. package/dist/editable/cancel-trigger.svelte +21 -21
  60. package/dist/editable/control.svelte +20 -20
  61. package/dist/editable/edit-trigger.svelte +21 -21
  62. package/dist/editable/input.svelte +18 -18
  63. package/dist/editable/label.svelte +20 -20
  64. package/dist/editable/preview.svelte +24 -24
  65. package/dist/editable/root.svelte +36 -29
  66. package/dist/editable/submit-trigger.svelte +21 -21
  67. package/dist/environment-provider/context.svelte.d.ts +14 -0
  68. package/dist/environment-provider/context.svelte.js +25 -0
  69. package/dist/environment-provider/index.d.ts +2 -0
  70. package/dist/environment-provider/index.js +2 -0
  71. package/dist/environment-provider/root.svelte +21 -0
  72. package/dist/environment-provider/root.svelte.d.ts +23 -0
  73. package/dist/hover-card/arrow-tip.svelte +20 -20
  74. package/dist/hover-card/arrow.svelte +20 -20
  75. package/dist/hover-card/content.svelte +20 -20
  76. package/dist/hover-card/positioner.svelte +21 -21
  77. package/dist/hover-card/root.svelte +39 -32
  78. package/dist/hover-card/trigger.svelte +20 -20
  79. package/dist/index.d.ts +2 -0
  80. package/dist/index.js +2 -0
  81. package/dist/locale-provider/context.svelte.d.ts +11 -0
  82. package/dist/locale-provider/context.svelte.js +23 -0
  83. package/dist/locale-provider/index.d.ts +2 -0
  84. package/dist/locale-provider/index.js +2 -0
  85. package/dist/locale-provider/root.svelte +20 -0
  86. package/dist/locale-provider/root.svelte.d.ts +23 -0
  87. package/dist/menu/arrow-tip.svelte.d.ts +26 -0
  88. package/dist/menu/arrow.svelte +0 -0
  89. package/dist/menu/arrow.svelte.d.ts +26 -0
  90. package/dist/menu/content.svelte +0 -0
  91. package/dist/menu/content.svelte.d.ts +26 -0
  92. package/dist/menu/context-trigger.svelte +0 -0
  93. package/dist/menu/context-trigger.svelte.d.ts +26 -0
  94. package/dist/menu/context.svelte.d.ts +10 -0
  95. package/dist/menu/context.svelte.js +20 -0
  96. package/dist/menu/index.d.ts +1 -0
  97. package/dist/menu/index.js +1 -0
  98. package/dist/menu/indicator.svelte +0 -0
  99. package/dist/menu/indicator.svelte.d.ts +26 -0
  100. package/dist/menu/item-group-label.svelte +0 -0
  101. package/dist/menu/item-group-label.svelte.d.ts +26 -0
  102. package/dist/menu/item-group.svelte +0 -0
  103. package/dist/menu/item-group.svelte.d.ts +26 -0
  104. package/dist/menu/item-indicator.svelte +0 -0
  105. package/dist/menu/item-indicator.svelte.d.ts +26 -0
  106. package/dist/menu/item-text.svelte +0 -0
  107. package/dist/menu/item-text.svelte.d.ts +26 -0
  108. package/dist/menu/item.svelte +0 -0
  109. package/dist/menu/item.svelte.d.ts +26 -0
  110. package/dist/menu/menu.d.ts +1 -0
  111. package/dist/menu/menu.js +1 -0
  112. package/dist/menu/option-item.svelte +0 -0
  113. package/dist/menu/option-item.svelte.d.ts +26 -0
  114. package/dist/menu/positioner.svelte +0 -0
  115. package/dist/menu/positioner.svelte.d.ts +26 -0
  116. package/dist/menu/root.svelte +0 -0
  117. package/dist/menu/root.svelte.d.ts +26 -0
  118. package/dist/menu/separator.svelte +0 -0
  119. package/dist/menu/separator.svelte.d.ts +26 -0
  120. package/dist/menu/trigger-item.svelte +0 -0
  121. package/dist/menu/trigger-item.svelte.d.ts +26 -0
  122. package/dist/menu/trigger.svelte +0 -0
  123. package/dist/menu/trigger.svelte.d.ts +26 -0
  124. package/dist/number-input/control.svelte +21 -21
  125. package/dist/number-input/decrement-trigger.svelte +21 -21
  126. package/dist/number-input/increment-trigger.svelte +21 -21
  127. package/dist/number-input/input.svelte +18 -18
  128. package/dist/number-input/label.svelte +20 -20
  129. package/dist/number-input/root.svelte +100 -95
  130. package/dist/number-input/scrubber.svelte +21 -21
  131. package/dist/pagination/ellipsis.svelte +22 -22
  132. package/dist/pagination/item.svelte +30 -30
  133. package/dist/pagination/next-trigger.svelte +21 -21
  134. package/dist/pagination/prev-trigger.svelte +21 -21
  135. package/dist/pagination/root.svelte +70 -65
  136. package/dist/pin-input/clear-trigger.svelte +25 -25
  137. package/dist/pin-input/hidden-input.svelte +19 -19
  138. package/dist/pin-input/input.svelte +20 -20
  139. package/dist/pin-input/label.svelte +20 -20
  140. package/dist/pin-input/root.svelte +89 -84
  141. package/dist/popover/arrow-tip.svelte +20 -20
  142. package/dist/popover/arrow.svelte +20 -20
  143. package/dist/popover/close-trigger.svelte +21 -21
  144. package/dist/popover/content.svelte +20 -20
  145. package/dist/popover/description.svelte +20 -20
  146. package/dist/popover/positioner.svelte +20 -20
  147. package/dist/popover/root.svelte +35 -28
  148. package/dist/popover/title.svelte +20 -20
  149. package/dist/popover/trigger.svelte +20 -20
  150. package/dist/portal/root.svelte +28 -20
  151. package/dist/presence/root.svelte +46 -46
  152. package/dist/progress/circle-range.svelte +21 -21
  153. package/dist/progress/circle-track.svelte +21 -21
  154. package/dist/progress/circle.svelte +20 -20
  155. package/dist/progress/label.svelte +20 -20
  156. package/dist/progress/range.svelte +20 -20
  157. package/dist/progress/root.svelte +61 -56
  158. package/dist/progress/track.svelte +20 -20
  159. package/dist/progress/value-text.svelte +24 -24
  160. package/dist/qr-code/frame.svelte +20 -20
  161. package/dist/qr-code/overlay.svelte +20 -20
  162. package/dist/qr-code/pattern.svelte +20 -20
  163. package/dist/qr-code/root.svelte +55 -50
  164. package/dist/radio-group/context.svelte.d.ts +2 -2
  165. package/dist/radio-group/context.svelte.js +2 -2
  166. package/dist/radio-group/indicator.svelte +21 -21
  167. package/dist/radio-group/item-control.svelte +28 -27
  168. package/dist/radio-group/item-hidden-input.svelte +26 -25
  169. package/dist/radio-group/item-text.svelte +26 -27
  170. package/dist/radio-group/item.svelte +58 -58
  171. package/dist/radio-group/label.svelte +20 -20
  172. package/dist/radio-group/root.svelte +68 -63
  173. package/dist/rating-group/context.svelte.d.ts +0 -2
  174. package/dist/rating-group/context.svelte.js +0 -6
  175. package/dist/rating-group/control.svelte +20 -20
  176. package/dist/rating-group/hidden-input.svelte +19 -19
  177. package/dist/rating-group/item.svelte +27 -27
  178. package/dist/rating-group/label.svelte +20 -20
  179. package/dist/rating-group/root.svelte +78 -73
  180. package/dist/segment-group/context.svelte.d.ts +10 -0
  181. package/dist/segment-group/context.svelte.js +43 -0
  182. package/dist/segment-group/index.d.ts +9 -2
  183. package/dist/segment-group/index.js +2 -2
  184. package/dist/segment-group/indicator.svelte +21 -0
  185. package/dist/segment-group/indicator.svelte.d.ts +21 -0
  186. package/dist/segment-group/item-control.svelte +28 -0
  187. package/dist/segment-group/item-control.svelte.d.ts +21 -0
  188. package/dist/segment-group/item-hidden-input.svelte +26 -0
  189. package/dist/segment-group/item-hidden-input.svelte.d.ts +21 -0
  190. package/dist/segment-group/item-text.svelte +26 -0
  191. package/dist/segment-group/item-text.svelte.d.ts +21 -0
  192. package/dist/segment-group/item.svelte +58 -0
  193. package/dist/segment-group/item.svelte.d.ts +24 -0
  194. package/dist/segment-group/label.svelte +20 -0
  195. package/dist/segment-group/label.svelte.d.ts +21 -0
  196. package/dist/segment-group/root.svelte +68 -0
  197. package/dist/segment-group/root.svelte.d.ts +24 -0
  198. package/dist/segment-group/segment-group.d.ts +7 -0
  199. package/dist/segment-group/segment-group.js +7 -0
  200. package/dist/select/clear-trigger.svelte +21 -21
  201. package/dist/select/content.svelte +20 -20
  202. package/dist/select/context.svelte.d.ts +4 -7
  203. package/dist/select/context.svelte.js +4 -4
  204. package/dist/select/control.svelte +20 -20
  205. package/dist/select/hidden-select.svelte +21 -21
  206. package/dist/select/indicator.svelte +20 -20
  207. package/dist/select/item-group-label.svelte +31 -30
  208. package/dist/select/item-group.svelte +32 -32
  209. package/dist/select/item-indicator.svelte +28 -24
  210. package/dist/select/item-text.svelte +29 -27
  211. package/dist/select/item.svelte +48 -45
  212. package/dist/select/label.svelte +20 -20
  213. package/dist/select/list.svelte +20 -20
  214. package/dist/select/positioner.svelte +20 -20
  215. package/dist/select/root.svelte +103 -98
  216. package/dist/select/trigger.svelte +20 -20
  217. package/dist/select/value-text.svelte +26 -26
  218. package/dist/slider/context.svelte.d.ts +2 -2
  219. package/dist/slider/context.svelte.js +2 -2
  220. package/dist/slider/control.svelte +20 -20
  221. package/dist/slider/hidden-input.svelte +26 -22
  222. package/dist/slider/label.svelte +20 -20
  223. package/dist/slider/marker-group.svelte +20 -20
  224. package/dist/slider/marker.svelte +29 -29
  225. package/dist/slider/range.svelte +20 -20
  226. package/dist/slider/root.svelte +91 -86
  227. package/dist/slider/thumb.svelte +38 -35
  228. package/dist/slider/track.svelte +20 -20
  229. package/dist/slider/value-text.svelte +24 -24
  230. package/dist/steps/content.svelte +22 -22
  231. package/dist/steps/context.svelte.d.ts +2 -2
  232. package/dist/steps/context.svelte.js +2 -2
  233. package/dist/steps/indicator.svelte +22 -23
  234. package/dist/steps/item.svelte +29 -29
  235. package/dist/steps/list.svelte +20 -20
  236. package/dist/steps/next-trigger.svelte +21 -21
  237. package/dist/steps/prev-trigger.svelte +21 -21
  238. package/dist/steps/progress.svelte +20 -20
  239. package/dist/steps/root.svelte +62 -58
  240. package/dist/steps/separator.svelte +22 -23
  241. package/dist/steps/trigger.svelte +22 -21
  242. package/dist/switch/control.svelte +20 -20
  243. package/dist/switch/hidden-input.svelte +19 -19
  244. package/dist/switch/label.svelte +20 -20
  245. package/dist/switch/root.svelte +71 -66
  246. package/dist/switch/thumb.svelte +20 -20
  247. package/dist/tabs/content.svelte +22 -22
  248. package/dist/tabs/list.svelte +20 -20
  249. package/dist/tabs/root.svelte +67 -62
  250. package/dist/tabs/trigger.svelte +24 -24
  251. package/dist/tags-input/clear-trigger.svelte +21 -21
  252. package/dist/tags-input/context.svelte.d.ts +2 -2
  253. package/dist/tags-input/context.svelte.js +2 -2
  254. package/dist/tags-input/control.svelte +20 -20
  255. package/dist/tags-input/hidden-input.svelte +19 -19
  256. package/dist/tags-input/input.svelte +18 -18
  257. package/dist/tags-input/item-delete-trigger.svelte +28 -27
  258. package/dist/tags-input/item-input.svelte +24 -25
  259. package/dist/tags-input/item-preview.svelte +28 -27
  260. package/dist/tags-input/item-text.svelte +25 -26
  261. package/dist/tags-input/item.svelte +58 -52
  262. package/dist/tags-input/label.svelte +20 -20
  263. package/dist/tags-input/root.svelte +104 -99
  264. package/dist/timer/action-trigger.svelte +24 -24
  265. package/dist/timer/context.svelte.d.ts +2 -2
  266. package/dist/timer/context.svelte.js +2 -2
  267. package/dist/timer/item-label.svelte +22 -23
  268. package/dist/timer/item-value.svelte +26 -27
  269. package/dist/timer/item.svelte +24 -24
  270. package/dist/timer/root.svelte +59 -56
  271. package/dist/timer/separator.svelte +20 -20
  272. package/dist/toast/action-trigger.svelte +21 -21
  273. package/dist/toast/close-trigger.svelte +21 -21
  274. package/dist/toast/create-toaster.svelte.js +12 -1
  275. package/dist/toast/description.svelte +24 -24
  276. package/dist/toast/root.svelte +29 -29
  277. package/dist/toast/title.svelte +24 -24
  278. package/dist/toast/toaster.svelte +40 -40
  279. package/dist/toggle-group/item.svelte +29 -29
  280. package/dist/toggle-group/root.svelte +68 -63
  281. package/dist/tooltip/arrow-tip.svelte +20 -20
  282. package/dist/tooltip/arrow.svelte +20 -20
  283. package/dist/tooltip/content.svelte +20 -20
  284. package/dist/tooltip/positioner.svelte +20 -20
  285. package/dist/tooltip/root.svelte +35 -28
  286. package/dist/tooltip/trigger.svelte +20 -20
  287. package/package.json +3 -2
  288. /package/dist/menu/{.gitkeep → arrow-tip.svelte} +0 -0
@@ -0,0 +1,24 @@
1
+ import type { Assign, HtmlIngredientProps } from '../types.js';
2
+ import type { ItemProps, ItemState } from '@zag-js/radio-group';
3
+ import type { Snippet } from 'svelte';
4
+ export interface SegmentGroupItemProps extends Assign<Omit<HtmlIngredientProps<'label'>, 'children'>, ItemProps> {
5
+ children?: Snippet<[state: ItemState]>;
6
+ }
7
+ interface $$__sveltets_2_IsomorphicComponent<Props extends Record<string, any> = any, Events extends Record<string, any> = any, Slots extends Record<string, any> = any, Exports = {}, Bindings = string> {
8
+ new (options: import('svelte').ComponentConstructorOptions<Props>): import('svelte').SvelteComponent<Props, Events, Slots> & {
9
+ $$bindings?: Bindings;
10
+ } & Exports;
11
+ (internal: unknown, props: Props & {
12
+ $$events?: Events;
13
+ $$slots?: Slots;
14
+ }): Exports & {
15
+ $set?: any;
16
+ $on?: any;
17
+ };
18
+ z_$$bindings?: Bindings;
19
+ }
20
+ declare const Item: $$__sveltets_2_IsomorphicComponent<SegmentGroupItemProps, {
21
+ [evt: string]: CustomEvent<any>;
22
+ }, {}, {}, "">;
23
+ type Item = InstanceType<typeof Item>;
24
+ export default Item;
@@ -0,0 +1,20 @@
1
+ <script lang="ts" context="module">
2
+ import type {HtmlIngredientProps} from '../types.js';
3
+
4
+ export interface SegmentGroupLabelProps extends HtmlIngredientProps<'span'> {}
5
+ </script>
6
+
7
+ <script lang="ts">
8
+ import {mergeProps} from '@zag-js/svelte';
9
+ import {useSegmentGroupContext} from './context.svelte.js';
10
+
11
+ let {children, ...props}: SegmentGroupLabelProps = $props();
12
+
13
+ let context = useSegmentGroupContext();
14
+
15
+ let attrs = $derived(mergeProps(props, context.getLabelProps()));
16
+ </script>
17
+
18
+ <span {...attrs}>
19
+ {@render children?.()}
20
+ </span>
@@ -0,0 +1,21 @@
1
+ import type { HtmlIngredientProps } from '../types.js';
2
+ export interface SegmentGroupLabelProps extends HtmlIngredientProps<'span'> {
3
+ }
4
+ interface $$__sveltets_2_IsomorphicComponent<Props extends Record<string, any> = any, Events extends Record<string, any> = any, Slots extends Record<string, any> = any, Exports = {}, Bindings = string> {
5
+ new (options: import('svelte').ComponentConstructorOptions<Props>): import('svelte').SvelteComponent<Props, Events, Slots> & {
6
+ $$bindings?: Bindings;
7
+ } & Exports;
8
+ (internal: unknown, props: Props & {
9
+ $$events?: Events;
10
+ $$slots?: Slots;
11
+ }): Exports & {
12
+ $set?: any;
13
+ $on?: any;
14
+ };
15
+ z_$$bindings?: Bindings;
16
+ }
17
+ declare const Label: $$__sveltets_2_IsomorphicComponent<SegmentGroupLabelProps, {
18
+ [evt: string]: CustomEvent<any>;
19
+ }, {}, {}, "">;
20
+ type Label = InstanceType<typeof Label>;
21
+ export default Label;
@@ -0,0 +1,68 @@
1
+ <script lang="ts" context="module">
2
+ import type {Assign, HtmlIngredientProps} from '../types.js';
3
+ import type {Snippet} from 'svelte';
4
+ import type {
5
+ CreateSegmentGroupContextProps,
6
+ CreateSegmentGroupContextReturn,
7
+ } from './context.svelte.js';
8
+
9
+ export interface SegmentGroupProps
10
+ extends Assign<
11
+ Omit<HtmlIngredientProps<'div'>, 'children'>,
12
+ Omit<CreateSegmentGroupContextProps, 'id'>
13
+ > {
14
+ children?: Snippet<[context: CreateSegmentGroupContextReturn]>;
15
+ }
16
+ </script>
17
+
18
+ <script lang="ts">
19
+ import {useEnvironmentContext} from '../environment-provider/index.js';
20
+ import {useLocaleContext} from '../locale-provider/index.js';
21
+ import {uuid} from '../utils.svelte.js';
22
+ import {mergeProps} from '@zag-js/svelte';
23
+ import {
24
+ createSegmentGroupContext,
25
+ setSegmentGroupContext,
26
+ } from './context.svelte.js';
27
+
28
+ let {
29
+ id,
30
+ ids,
31
+ dir,
32
+ form,
33
+ name,
34
+ value,
35
+ disabled,
36
+ readOnly,
37
+ orientation,
38
+ onValueChange,
39
+ getRootNode,
40
+ children,
41
+ ...props
42
+ }: SegmentGroupProps = $props();
43
+
44
+ let localeContext = useLocaleContext();
45
+ let environmentContext = useEnvironmentContext();
46
+
47
+ let context = createSegmentGroupContext({
48
+ id: id ?? uuid(),
49
+ ids,
50
+ dir: dir ?? localeContext?.dir,
51
+ form,
52
+ name,
53
+ value: $state.snapshot(value),
54
+ disabled,
55
+ readOnly,
56
+ orientation,
57
+ onValueChange,
58
+ getRootNode: getRootNode ?? environmentContext?.getRootNode,
59
+ });
60
+
61
+ let attrs = $derived(mergeProps(props, context.getRootProps()));
62
+
63
+ setSegmentGroupContext(context);
64
+ </script>
65
+
66
+ <div {...attrs}>
67
+ {@render children?.(context)}
68
+ </div>
@@ -0,0 +1,24 @@
1
+ import type { Assign, HtmlIngredientProps } from '../types.js';
2
+ import type { Snippet } from 'svelte';
3
+ import type { CreateSegmentGroupContextProps, CreateSegmentGroupContextReturn } from './context.svelte.js';
4
+ export interface SegmentGroupProps extends Assign<Omit<HtmlIngredientProps<'div'>, 'children'>, Omit<CreateSegmentGroupContextProps, 'id'>> {
5
+ children?: Snippet<[context: CreateSegmentGroupContextReturn]>;
6
+ }
7
+ interface $$__sveltets_2_IsomorphicComponent<Props extends Record<string, any> = any, Events extends Record<string, any> = any, Slots extends Record<string, any> = any, Exports = {}, Bindings = string> {
8
+ new (options: import('svelte').ComponentConstructorOptions<Props>): import('svelte').SvelteComponent<Props, Events, Slots> & {
9
+ $$bindings?: Bindings;
10
+ } & Exports;
11
+ (internal: unknown, props: Props & {
12
+ $$events?: Events;
13
+ $$slots?: Slots;
14
+ }): Exports & {
15
+ $set?: any;
16
+ $on?: any;
17
+ };
18
+ z_$$bindings?: Bindings;
19
+ }
20
+ declare const Root: $$__sveltets_2_IsomorphicComponent<SegmentGroupProps, {
21
+ [evt: string]: CustomEvent<any>;
22
+ }, {}, {}, "">;
23
+ type Root = InstanceType<typeof Root>;
24
+ export default Root;
@@ -0,0 +1,7 @@
1
+ export { default as Indicator } from './indicator.svelte';
2
+ export { default as ItemControl } from './item-control.svelte';
3
+ export { default as ItemHiddenInput } from './item-hidden-input.svelte';
4
+ export { default as ItemText } from './item-text.svelte';
5
+ export { default as Item } from './item.svelte';
6
+ export { default as Label } from './label.svelte';
7
+ export { default as Root } from './root.svelte';
@@ -0,0 +1,7 @@
1
+ export { default as Indicator } from './indicator.svelte';
2
+ export { default as ItemControl } from './item-control.svelte';
3
+ export { default as ItemHiddenInput } from './item-hidden-input.svelte';
4
+ export { default as ItemText } from './item-text.svelte';
5
+ export { default as Item } from './item.svelte';
6
+ export { default as Label } from './label.svelte';
7
+ export { default as Root } from './root.svelte';
@@ -1,21 +1,21 @@
1
- <script lang="ts" context="module">
2
- import type {HtmlIngredientProps} from '../types.js';
3
-
4
- export interface SelectClearTriggerProps
5
- extends HtmlIngredientProps<'button'> {}
6
- </script>
7
-
8
- <script lang="ts">
9
- import {mergeProps} from '@zag-js/svelte';
10
- import {useSelectContext} from './context.svelte.js';
11
-
12
- let {children, ...props}: SelectClearTriggerProps = $props();
13
-
14
- let context = useSelectContext();
15
-
16
- let attrs = $derived(mergeProps(props, context.getClearTriggerProps()));
17
- </script>
18
-
19
- <button type="button" {...attrs}>
20
- {@render children?.()}
21
- </button>
1
+ <script lang="ts" context="module">
2
+ import type {HtmlIngredientProps} from '../types.js';
3
+
4
+ export interface SelectClearTriggerProps
5
+ extends HtmlIngredientProps<'button'> {}
6
+ </script>
7
+
8
+ <script lang="ts">
9
+ import {mergeProps} from '@zag-js/svelte';
10
+ import {useSelectContext} from './context.svelte.js';
11
+
12
+ let {children, ...props}: SelectClearTriggerProps = $props();
13
+
14
+ let context = useSelectContext();
15
+
16
+ let attrs = $derived(mergeProps(props, context.getClearTriggerProps()));
17
+ </script>
18
+
19
+ <button type="button" {...attrs}>
20
+ {@render children?.()}
21
+ </button>
@@ -1,20 +1,20 @@
1
- <script lang="ts" context="module">
2
- import type {HtmlIngredientProps} from '../types.js';
3
-
4
- export interface SelectContentProps extends HtmlIngredientProps<'div'> {}
5
- </script>
6
-
7
- <script lang="ts">
8
- import {mergeProps} from '@zag-js/svelte';
9
- import {useSelectContext} from './context.svelte.js';
10
-
11
- let {children, ...props}: SelectContentProps = $props();
12
-
13
- let context = useSelectContext();
14
-
15
- let attrs = $derived(mergeProps(props, context.getContentProps()));
16
- </script>
17
-
18
- <div {...attrs}>
19
- {@render children?.()}
20
- </div>
1
+ <script lang="ts" context="module">
2
+ import type {HtmlIngredientProps} from '../types.js';
3
+
4
+ export interface SelectContentProps extends HtmlIngredientProps<'div'> {}
5
+ </script>
6
+
7
+ <script lang="ts">
8
+ import {mergeProps} from '@zag-js/svelte';
9
+ import {useSelectContext} from './context.svelte.js';
10
+
11
+ let {children, ...props}: SelectContentProps = $props();
12
+
13
+ let context = useSelectContext();
14
+
15
+ let attrs = $derived(mergeProps(props, context.getContentProps()));
16
+ </script>
17
+
18
+ <div {...attrs}>
19
+ {@render children?.()}
20
+ </div>
@@ -10,10 +10,7 @@ export interface CreateSelectContextReturn extends ReturnType<typeof createSelec
10
10
  export declare function createSelectContext<T>(props: CreateSelectContextProps<T>): any;
11
11
  export declare function setSelectContext(value: CreateSelectContextReturn): void;
12
12
  export declare function useSelectContext(): CreateSelectContextReturn;
13
- export declare function setSelectItemGroupContext(value: select.ItemGroupProps): void;
14
- export declare function useSelectItemGroupContext(): select.ItemGroupProps;
15
- export interface CreateItemContextReturn<T> extends select.ItemProps<T> {
16
- label: string;
17
- }
18
- export declare function setSelectItemContext(value: select.ItemProps): void;
19
- export declare function useSelectItemContext(): select.ItemProps<any>;
13
+ export declare function setSelectItemGroupPropsContext(value: select.ItemGroupProps): void;
14
+ export declare function useSelectItemGroupPropsContext(): select.ItemGroupProps;
15
+ export declare function setSelectItemPropsContext(value: select.ItemProps): void;
16
+ export declare function useSelectItemPropsContext(): select.ItemProps<any>;
@@ -24,15 +24,15 @@ export function setSelectContext(value) {
24
24
  export function useSelectContext() {
25
25
  return getContext('Select');
26
26
  }
27
- export function setSelectItemGroupContext(value) {
27
+ export function setSelectItemGroupPropsContext(value) {
28
28
  setContext('SelectItemGroup', value);
29
29
  }
30
- export function useSelectItemGroupContext() {
30
+ export function useSelectItemGroupPropsContext() {
31
31
  return getContext('SelectItemGroup');
32
32
  }
33
- export function setSelectItemContext(value) {
33
+ export function setSelectItemPropsContext(value) {
34
34
  setContext('SelectItem', value);
35
35
  }
36
- export function useSelectItemContext() {
36
+ export function useSelectItemPropsContext() {
37
37
  return getContext('SelectItem');
38
38
  }
@@ -1,20 +1,20 @@
1
- <script lang="ts" context="module">
2
- import type {HtmlIngredientProps} from '../types.js';
3
-
4
- export interface SelectControlProps extends HtmlIngredientProps<'div'> {}
5
- </script>
6
-
7
- <script lang="ts">
8
- import {mergeProps} from '@zag-js/svelte';
9
- import {useSelectContext} from './context.svelte.js';
10
-
11
- let {children, ...props}: SelectControlProps = $props();
12
-
13
- let context = useSelectContext();
14
-
15
- let attrs = $derived(mergeProps(props, context.getControlProps()));
16
- </script>
17
-
18
- <div {...attrs}>
19
- {@render children?.()}
20
- </div>
1
+ <script lang="ts" context="module">
2
+ import type {HtmlIngredientProps} from '../types.js';
3
+
4
+ export interface SelectControlProps extends HtmlIngredientProps<'div'> {}
5
+ </script>
6
+
7
+ <script lang="ts">
8
+ import {mergeProps} from '@zag-js/svelte';
9
+ import {useSelectContext} from './context.svelte.js';
10
+
11
+ let {children, ...props}: SelectControlProps = $props();
12
+
13
+ let context = useSelectContext();
14
+
15
+ let attrs = $derived(mergeProps(props, context.getControlProps()));
16
+ </script>
17
+
18
+ <div {...attrs}>
19
+ {@render children?.()}
20
+ </div>
@@ -1,21 +1,21 @@
1
- <script lang="ts" context="module">
2
- import type {HtmlIngredientProps} from '../types.js';
3
-
4
- export interface SelectHiddenSelectProps
5
- extends HtmlIngredientProps<'select'> {}
6
- </script>
7
-
8
- <script lang="ts">
9
- import {mergeProps} from '@zag-js/svelte';
10
- import {useSelectContext} from './context.svelte.js';
11
-
12
- let {children, ...props}: SelectHiddenSelectProps = $props();
13
-
14
- let context = useSelectContext();
15
-
16
- let attrs = $derived(mergeProps(props, context.getHiddenSelectProps()));
17
- </script>
18
-
19
- <select {...attrs}>
20
- {@render children?.()}
21
- </select>
1
+ <script lang="ts" context="module">
2
+ import type {HtmlIngredientProps} from '../types.js';
3
+
4
+ export interface SelectHiddenSelectProps
5
+ extends HtmlIngredientProps<'select'> {}
6
+ </script>
7
+
8
+ <script lang="ts">
9
+ import {mergeProps} from '@zag-js/svelte';
10
+ import {useSelectContext} from './context.svelte.js';
11
+
12
+ let {children, ...props}: SelectHiddenSelectProps = $props();
13
+
14
+ let context = useSelectContext();
15
+
16
+ let attrs = $derived(mergeProps(props, context.getHiddenSelectProps()));
17
+ </script>
18
+
19
+ <select {...attrs}>
20
+ {@render children?.()}
21
+ </select>
@@ -1,20 +1,20 @@
1
- <script lang="ts" context="module">
2
- import type {HtmlIngredientProps} from '../types.js';
3
-
4
- export interface SelectIndicatorProps extends HtmlIngredientProps<'span'> {}
5
- </script>
6
-
7
- <script lang="ts">
8
- import {mergeProps} from '@zag-js/svelte';
9
- import {useSelectContext} from './context.svelte.js';
10
-
11
- let {children, ...props}: SelectIndicatorProps = $props();
12
-
13
- let context = useSelectContext();
14
-
15
- let attrs = $derived(mergeProps(props, context.getIndicatorProps()));
16
- </script>
17
-
18
- <span {...attrs}>
19
- {@render children?.()}
20
- </span>
1
+ <script lang="ts" context="module">
2
+ import type {HtmlIngredientProps} from '../types.js';
3
+
4
+ export interface SelectIndicatorProps extends HtmlIngredientProps<'span'> {}
5
+ </script>
6
+
7
+ <script lang="ts">
8
+ import {mergeProps} from '@zag-js/svelte';
9
+ import {useSelectContext} from './context.svelte.js';
10
+
11
+ let {children, ...props}: SelectIndicatorProps = $props();
12
+
13
+ let context = useSelectContext();
14
+
15
+ let attrs = $derived(mergeProps(props, context.getIndicatorProps()));
16
+ </script>
17
+
18
+ <span {...attrs}>
19
+ {@render children?.()}
20
+ </span>
@@ -1,30 +1,31 @@
1
- <script lang="ts" context="module">
2
- import type {HtmlIngredientProps} from '../types.js';
3
-
4
- export interface SelectItemGroupLabelProps
5
- extends HtmlIngredientProps<'span'> {}
6
- </script>
7
-
8
- <script lang="ts">
9
- import {mergeProps} from '@zag-js/svelte';
10
- import {
11
- useSelectContext,
12
- useSelectItemGroupContext,
13
- } from './context.svelte.js';
14
-
15
- let {children, ...props}: SelectItemGroupLabelProps = $props();
16
-
17
- let context = useSelectContext();
18
- let itemGroupContext = useSelectItemGroupContext();
19
-
20
- let attrs = $derived(
21
- mergeProps(
22
- props,
23
- context.getItemGroupLabelProps({htmlFor: itemGroupContext.id}),
24
- ),
25
- );
26
- </script>
27
-
28
- <span {...attrs}>
29
- {@render children?.()}
30
- </span>
1
+ <script lang="ts" context="module">
2
+ import type {HtmlIngredientProps} from '../types.js';
3
+
4
+ export interface SelectItemGroupLabelProps
5
+ extends HtmlIngredientProps<'span'> {}
6
+ </script>
7
+
8
+ <script lang="ts">
9
+ import {mergeProps} from '@zag-js/svelte';
10
+ import {
11
+ useSelectContext,
12
+ useSelectItemGroupPropsContext,
13
+ } from './context.svelte.js';
14
+
15
+ let {children, ...props}: SelectItemGroupLabelProps = $props();
16
+
17
+ let context = useSelectContext();
18
+
19
+ let itemGroupProps = useSelectItemGroupPropsContext();
20
+
21
+ let attrs = $derived(
22
+ mergeProps(
23
+ props,
24
+ context.getItemGroupLabelProps({htmlFor: itemGroupProps.id}),
25
+ ),
26
+ );
27
+ </script>
28
+
29
+ <span {...attrs}>
30
+ {@render children?.()}
31
+ </span>
@@ -1,32 +1,32 @@
1
- <script lang="ts" context="module">
2
- import type {Assign, HtmlIngredientProps} from '../types.js';
3
- import type {ItemGroupProps} from '@zag-js/select';
4
-
5
- export interface SelectItemGroupProps
6
- extends Assign<HtmlIngredientProps<'div'>, Omit<ItemGroupProps, 'id'>> {}
7
- </script>
8
-
9
- <script lang="ts">
10
- import {uuid} from '../utils.svelte.js';
11
- import {mergeProps} from '@zag-js/svelte';
12
- import {
13
- setSelectItemGroupContext,
14
- useSelectContext,
15
- } from './context.svelte.js';
16
-
17
- let {id, children, ...props}: SelectItemGroupProps = $props();
18
-
19
- let context = useSelectContext();
20
-
21
- let uid = uuid();
22
-
23
- let attrs = $derived(
24
- mergeProps(props, context.getItemGroupProps({id: id ?? uid})),
25
- );
26
-
27
- setSelectItemGroupContext({id: id ?? uid});
28
- </script>
29
-
30
- <div {...attrs}>
31
- {@render children?.()}
32
- </div>
1
+ <script lang="ts" context="module">
2
+ import type {Assign, HtmlIngredientProps} from '../types.js';
3
+ import type {ItemGroupProps} from '@zag-js/select';
4
+
5
+ export interface SelectItemGroupProps
6
+ extends Assign<HtmlIngredientProps<'div'>, Omit<ItemGroupProps, 'id'>> {}
7
+ </script>
8
+
9
+ <script lang="ts">
10
+ import {uuid} from '../utils.svelte.js';
11
+ import {mergeProps} from '@zag-js/svelte';
12
+ import {
13
+ setSelectItemGroupPropsContext,
14
+ useSelectContext,
15
+ } from './context.svelte.js';
16
+
17
+ let {id, children, ...props}: SelectItemGroupProps = $props();
18
+
19
+ let context = useSelectContext();
20
+
21
+ let uid = uuid();
22
+
23
+ let attrs = $derived(
24
+ mergeProps(props, context.getItemGroupProps({id: id ?? uid})),
25
+ );
26
+
27
+ setSelectItemGroupPropsContext({id: id ?? uid});
28
+ </script>
29
+
30
+ <div {...attrs}>
31
+ {@render children?.()}
32
+ </div>
@@ -1,24 +1,28 @@
1
- <script lang="ts" context="module">
2
- import type {HtmlIngredientProps} from '../types.js';
3
-
4
- export interface SelectItemIndicatorProps
5
- extends HtmlIngredientProps<'span'> {}
6
- </script>
7
-
8
- <script lang="ts">
9
- import {mergeProps} from '@zag-js/svelte';
10
- import {useSelectContext, useSelectItemContext} from './context.svelte.js';
11
-
12
- let {children, ...props}: SelectItemIndicatorProps = $props();
13
-
14
- let context = useSelectContext();
15
- let itemContext = useSelectItemContext();
16
-
17
- let attrs = $derived(
18
- mergeProps(props, context.getItemIndicatorProps(itemContext)),
19
- );
20
- </script>
21
-
22
- <span {...attrs}>
23
- {@render children?.()}
24
- </span>
1
+ <script lang="ts" context="module">
2
+ import type {HtmlIngredientProps} from '../types.js';
3
+
4
+ export interface SelectItemIndicatorProps
5
+ extends HtmlIngredientProps<'span'> {}
6
+ </script>
7
+
8
+ <script lang="ts">
9
+ import {mergeProps} from '@zag-js/svelte';
10
+ import {
11
+ useSelectContext,
12
+ useSelectItemPropsContext,
13
+ } from './context.svelte.js';
14
+
15
+ let {children, ...props}: SelectItemIndicatorProps = $props();
16
+
17
+ let context = useSelectContext();
18
+
19
+ let itemProps = useSelectItemPropsContext();
20
+
21
+ let attrs = $derived(
22
+ mergeProps(props, context.getItemIndicatorProps(itemProps)),
23
+ );
24
+ </script>
25
+
26
+ <span {...attrs}>
27
+ {@render children?.()}
28
+ </span>