ui-ingredients 0.27.0 → 0.29.0

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 (431) hide show
  1. package/README.md +49 -48
  2. package/dist/accordion/accordion-item-content.svelte +56 -56
  3. package/dist/accordion/accordion-item-indicator.svelte +35 -36
  4. package/dist/accordion/accordion-item-trigger.svelte +35 -36
  5. package/dist/accordion/accordion-item.svelte +63 -63
  6. package/dist/accordion/accordion-root.svelte +64 -65
  7. package/dist/alert/alert-description.svelte +29 -30
  8. package/dist/alert/alert-indicator.svelte +29 -30
  9. package/dist/alert/alert-root.svelte +44 -34
  10. package/dist/alert/alert-root.svelte.d.ts +3 -3
  11. package/dist/alert/alert-title.svelte +29 -30
  12. package/dist/alert/create-alert.svelte.d.ts +12 -1
  13. package/dist/alert/create-alert.svelte.js +40 -1
  14. package/dist/alert/index.d.ts +1 -1
  15. package/dist/alert/index.js +1 -1
  16. package/dist/alert-dialog/alert-dialog-anatomy.d.ts +2 -2
  17. package/dist/alert-dialog/alert-dialog-backdrop.svelte +48 -48
  18. package/dist/alert-dialog/alert-dialog-close-trigger.svelte +32 -32
  19. package/dist/alert-dialog/alert-dialog-content.svelte +41 -41
  20. package/dist/alert-dialog/alert-dialog-description.svelte +31 -32
  21. package/dist/alert-dialog/alert-dialog-positioner.svelte +39 -40
  22. package/dist/alert-dialog/alert-dialog-root.svelte +48 -48
  23. package/dist/alert-dialog/alert-dialog-title.svelte +29 -30
  24. package/dist/alert-dialog/alert-dialog-trigger.svelte +29 -30
  25. package/dist/angle-slider/angle-slider-control.svelte +29 -29
  26. package/dist/angle-slider/angle-slider-hidden-input.svelte +28 -28
  27. package/dist/angle-slider/angle-slider-label.svelte +29 -29
  28. package/dist/angle-slider/angle-slider-marker-group.svelte +31 -31
  29. package/dist/angle-slider/angle-slider-marker.svelte +37 -38
  30. package/dist/angle-slider/angle-slider-root.svelte +57 -58
  31. package/dist/angle-slider/angle-slider-thumb.svelte +29 -29
  32. package/dist/angle-slider/angle-slider-value-text.svelte +35 -35
  33. package/dist/avatar/avatar-fallback.svelte +29 -30
  34. package/dist/avatar/avatar-image.svelte +22 -23
  35. package/dist/avatar/avatar-root.svelte +44 -45
  36. package/dist/breadcrumbs/breadcrumbs-item.svelte +29 -30
  37. package/dist/breadcrumbs/breadcrumbs-link.svelte +37 -38
  38. package/dist/breadcrumbs/breadcrumbs-list.svelte +29 -30
  39. package/dist/breadcrumbs/breadcrumbs-root.svelte +33 -34
  40. package/dist/breadcrumbs/breadcrumbs-separator.svelte +31 -30
  41. package/dist/carousel/carousel-autoplay-trigger.svelte +31 -32
  42. package/dist/carousel/carousel-control.svelte +29 -30
  43. package/dist/carousel/carousel-indicator-group.svelte +31 -32
  44. package/dist/carousel/carousel-indicator.svelte +40 -41
  45. package/dist/carousel/carousel-item-group.svelte +29 -30
  46. package/dist/carousel/carousel-item.svelte +37 -38
  47. package/dist/carousel/carousel-next-trigger.svelte +29 -30
  48. package/dist/carousel/carousel-prev-trigger.svelte +29 -30
  49. package/dist/carousel/carousel-root.svelte +63 -64
  50. package/dist/checkbox/checkbox-control.svelte +29 -30
  51. package/dist/checkbox/checkbox-hidden-input.svelte +26 -27
  52. package/dist/checkbox/checkbox-indicator.svelte +29 -30
  53. package/dist/checkbox/checkbox-label.svelte +29 -30
  54. package/dist/checkbox/checkbox-root.svelte +59 -59
  55. package/dist/clipboard/clipboard-control.svelte +29 -30
  56. package/dist/clipboard/clipboard-indicator.svelte +36 -40
  57. package/dist/clipboard/clipboard-input.svelte +26 -27
  58. package/dist/clipboard/clipboard-label.svelte +29 -30
  59. package/dist/clipboard/clipboard-root.svelte +51 -51
  60. package/dist/clipboard/clipboard-trigger.svelte +29 -30
  61. package/dist/collapsible/collapsible-content.svelte +40 -41
  62. package/dist/collapsible/collapsible-root.svelte +72 -72
  63. package/dist/collapsible/collapsible-trigger.svelte +29 -29
  64. package/dist/color-picker/color-picker-anatomy.d.ts +2 -2
  65. package/dist/color-picker/color-picker-area-background.svelte +35 -36
  66. package/dist/color-picker/color-picker-area-thumb.svelte +35 -36
  67. package/dist/color-picker/color-picker-area.svelte +44 -44
  68. package/dist/color-picker/color-picker-channel-input.svelte +40 -41
  69. package/dist/color-picker/color-picker-channel-slider-label.svelte +35 -36
  70. package/dist/color-picker/color-picker-channel-slider-thumb.svelte +45 -45
  71. package/dist/color-picker/color-picker-channel-slider-track.svelte +45 -45
  72. package/dist/color-picker/color-picker-channel-slider-value-text.svelte +44 -45
  73. package/dist/color-picker/color-picker-channel-slider.svelte +51 -51
  74. package/dist/color-picker/color-picker-content.svelte +40 -41
  75. package/dist/color-picker/color-picker-control.svelte +29 -30
  76. package/dist/color-picker/color-picker-eye-dropper-trigger.svelte +31 -32
  77. package/dist/color-picker/color-picker-format-select.svelte +39 -40
  78. package/dist/color-picker/color-picker-format-trigger.svelte +31 -32
  79. package/dist/color-picker/color-picker-hidden-input.svelte +28 -29
  80. package/dist/color-picker/color-picker-label.svelte +29 -30
  81. package/dist/color-picker/color-picker-positioner.svelte +37 -38
  82. package/dist/color-picker/color-picker-root.svelte +87 -86
  83. package/dist/color-picker/color-picker-swatch-group.svelte +31 -32
  84. package/dist/color-picker/color-picker-swatch-indicator.svelte +35 -36
  85. package/dist/color-picker/color-picker-swatch-trigger.svelte +43 -44
  86. package/dist/color-picker/color-picker-swatch.svelte +44 -44
  87. package/dist/color-picker/color-picker-transparency-grid.svelte +36 -37
  88. package/dist/color-picker/color-picker-trigger.svelte +29 -30
  89. package/dist/color-picker/color-picker-value-swatch.svelte +40 -41
  90. package/dist/color-picker/color-picker-value-text.svelte +35 -36
  91. package/dist/color-picker/color-picker-view.svelte +41 -41
  92. package/dist/combobox/combobox-clear-trigger.svelte +31 -32
  93. package/dist/combobox/combobox-content.svelte +36 -37
  94. package/dist/combobox/combobox-control.svelte +29 -30
  95. package/dist/combobox/combobox-input.svelte +24 -25
  96. package/dist/combobox/combobox-item-group-label.svelte +40 -41
  97. package/dist/combobox/combobox-item-group.svelte +40 -45
  98. package/dist/combobox/combobox-item-indicator.svelte +35 -36
  99. package/dist/combobox/combobox-item-text.svelte +39 -40
  100. package/dist/combobox/combobox-item.svelte +46 -47
  101. package/dist/combobox/combobox-label.svelte +29 -30
  102. package/dist/combobox/combobox-list.svelte +29 -30
  103. package/dist/combobox/combobox-positioner.svelte +39 -40
  104. package/dist/combobox/combobox-root.svelte +101 -100
  105. package/dist/combobox/combobox-trigger.svelte +40 -41
  106. package/dist/date-picker/date-picker-anatomy.d.ts +2 -2
  107. package/dist/date-picker/date-picker-clear-trigger.svelte +31 -32
  108. package/dist/date-picker/date-picker-content.svelte +40 -41
  109. package/dist/date-picker/date-picker-control.svelte +29 -30
  110. package/dist/date-picker/date-picker-day-table-cell-trigger.svelte +35 -36
  111. package/dist/date-picker/date-picker-day-table-cell.svelte +52 -52
  112. package/dist/date-picker/date-picker-input.svelte +33 -34
  113. package/dist/date-picker/date-picker-label.svelte +36 -37
  114. package/dist/date-picker/date-picker-month-select.svelte +40 -41
  115. package/dist/date-picker/date-picker-month-table-cell-trigger.svelte +35 -36
  116. package/dist/date-picker/date-picker-month-table-cell.svelte +50 -50
  117. package/dist/date-picker/date-picker-next-trigger.svelte +35 -36
  118. package/dist/date-picker/date-picker-positioner.svelte +39 -40
  119. package/dist/date-picker/date-picker-preset-trigger.svelte +36 -37
  120. package/dist/date-picker/date-picker-prev-trigger.svelte +35 -36
  121. package/dist/date-picker/date-picker-range-text.svelte +33 -34
  122. package/dist/date-picker/date-picker-root.svelte +88 -88
  123. package/dist/date-picker/date-picker-table-body.svelte +35 -36
  124. package/dist/date-picker/date-picker-table-head.svelte +35 -36
  125. package/dist/date-picker/date-picker-table-header.svelte +35 -36
  126. package/dist/date-picker/date-picker-table-row.svelte +35 -36
  127. package/dist/date-picker/date-picker-table.svelte +45 -46
  128. package/dist/date-picker/date-picker-trigger.svelte +29 -30
  129. package/dist/date-picker/date-picker-view-control.svelte +35 -36
  130. package/dist/date-picker/date-picker-view-trigger.svelte +35 -36
  131. package/dist/date-picker/date-picker-view.svelte +39 -41
  132. package/dist/date-picker/date-picker-year-select.svelte +37 -38
  133. package/dist/date-picker/date-picker-year-table-cell-trigger.svelte +35 -36
  134. package/dist/date-picker/date-picker-year-table-cell.svelte +50 -50
  135. package/dist/dialog/dialog-backdrop.svelte +44 -44
  136. package/dist/dialog/dialog-close-trigger.svelte +29 -30
  137. package/dist/dialog/dialog-content.svelte +36 -37
  138. package/dist/dialog/dialog-description.svelte +29 -30
  139. package/dist/dialog/dialog-positioner.svelte +35 -36
  140. package/dist/dialog/dialog-root.svelte +48 -48
  141. package/dist/dialog/dialog-title.svelte +29 -30
  142. package/dist/dialog/dialog-trigger.svelte +29 -30
  143. package/dist/drawer/drawer-anatomy.d.ts +2 -2
  144. package/dist/drawer/drawer-backdrop.svelte +44 -44
  145. package/dist/drawer/drawer-body.svelte +29 -30
  146. package/dist/drawer/drawer-close-trigger.svelte +29 -30
  147. package/dist/drawer/drawer-content.svelte +36 -37
  148. package/dist/drawer/drawer-description.svelte +29 -30
  149. package/dist/drawer/drawer-footer.svelte +29 -30
  150. package/dist/drawer/drawer-header.svelte +29 -30
  151. package/dist/drawer/drawer-positioner.svelte +35 -36
  152. package/dist/drawer/drawer-root.svelte +48 -48
  153. package/dist/drawer/drawer-title.svelte +29 -30
  154. package/dist/drawer/drawer-trigger.svelte +29 -30
  155. package/dist/editable/editable-area.svelte +29 -30
  156. package/dist/editable/editable-cancel-trigger.svelte +31 -32
  157. package/dist/editable/editable-control.svelte +29 -30
  158. package/dist/editable/editable-edit-trigger.svelte +29 -30
  159. package/dist/editable/editable-input.svelte +22 -23
  160. package/dist/editable/editable-label.svelte +29 -30
  161. package/dist/editable/editable-preview.svelte +33 -37
  162. package/dist/editable/editable-root.svelte +71 -73
  163. package/dist/editable/editable-submit-trigger.svelte +31 -32
  164. package/dist/environment-provider/environment-provider.svelte +41 -41
  165. package/dist/field/field-error-text.svelte +48 -49
  166. package/dist/field/field-helper-text.svelte +31 -32
  167. package/dist/field/field-input.svelte +22 -23
  168. package/dist/field/field-label.svelte +29 -30
  169. package/dist/field/field-required-indicator.svelte +35 -36
  170. package/dist/field/field-root.svelte +61 -62
  171. package/dist/field/field-select.svelte +27 -28
  172. package/dist/field/field-textarea.svelte +50 -51
  173. package/dist/file-upload/file-upload-clear-trigger.svelte +31 -32
  174. package/dist/file-upload/file-upload-dropzone.svelte +29 -30
  175. package/dist/file-upload/file-upload-hidden-input.svelte +28 -29
  176. package/dist/file-upload/file-upload-item-delete-trigger.svelte +35 -36
  177. package/dist/file-upload/file-upload-item-group.svelte +29 -30
  178. package/dist/file-upload/file-upload-item-name.svelte +39 -40
  179. package/dist/file-upload/file-upload-item-preview-image.svelte +40 -41
  180. package/dist/file-upload/file-upload-item-preview.svelte +35 -36
  181. package/dist/file-upload/file-upload-item-size-text.svelte +39 -40
  182. package/dist/file-upload/file-upload-item.svelte +42 -43
  183. package/dist/file-upload/file-upload-label.svelte +29 -30
  184. package/dist/file-upload/file-upload-root.svelte +67 -67
  185. package/dist/file-upload/file-upload-trigger.svelte +29 -30
  186. package/dist/floating-panel/floating-panel-body.svelte +29 -30
  187. package/dist/floating-panel/floating-panel-close-trigger.svelte +31 -32
  188. package/dist/floating-panel/floating-panel-content.svelte +40 -41
  189. package/dist/floating-panel/floating-panel-drag-trigger.svelte +31 -32
  190. package/dist/floating-panel/floating-panel-header.svelte +29 -30
  191. package/dist/floating-panel/floating-panel-maximize-trigger.svelte +31 -32
  192. package/dist/floating-panel/floating-panel-minimize-trigger.svelte +31 -32
  193. package/dist/floating-panel/floating-panel-positioner.svelte +39 -40
  194. package/dist/floating-panel/floating-panel-resize-trigger.svelte +43 -44
  195. package/dist/floating-panel/floating-panel-restore-trigger.svelte +31 -32
  196. package/dist/floating-panel/floating-panel-root.svelte +47 -47
  197. package/dist/floating-panel/floating-panel-title.svelte +29 -30
  198. package/dist/floating-panel/floating-panel-trigger.svelte +31 -32
  199. package/dist/highlight/highlight.svelte +42 -42
  200. package/dist/hover-card/hover-card-arrow-tip.svelte +29 -30
  201. package/dist/hover-card/hover-card-arrow.svelte +29 -30
  202. package/dist/hover-card/hover-card-content.svelte +36 -37
  203. package/dist/hover-card/hover-card-positioner.svelte +39 -40
  204. package/dist/hover-card/hover-card-root.svelte +51 -52
  205. package/dist/hover-card/hover-card-trigger.svelte +29 -30
  206. package/dist/locale-provider/local-provider.svelte +22 -26
  207. package/dist/menu/menu-arrow-tip.svelte +29 -30
  208. package/dist/menu/menu-arrow.svelte +29 -30
  209. package/dist/menu/menu-content.svelte +36 -37
  210. package/dist/menu/menu-context-trigger.svelte +29 -30
  211. package/dist/menu/menu-indicator.svelte +29 -30
  212. package/dist/menu/menu-item-group-label.svelte +38 -42
  213. package/dist/menu/menu-item-group.svelte +40 -45
  214. package/dist/menu/menu-item.svelte +46 -47
  215. package/dist/menu/menu-option-item-indicator.svelte +35 -37
  216. package/dist/menu/menu-option-item-text.svelte +39 -41
  217. package/dist/menu/menu-option-item.svelte +54 -56
  218. package/dist/menu/menu-positioner.svelte +35 -36
  219. package/dist/menu/menu-root.svelte +74 -74
  220. package/dist/menu/menu-separator.svelte +29 -30
  221. package/dist/menu/menu-trigger-item.svelte +29 -30
  222. package/dist/menu/menu-trigger.svelte +29 -30
  223. package/dist/number-input/number-input-control.svelte +29 -30
  224. package/dist/number-input/number-input-decrement-trigger.svelte +31 -32
  225. package/dist/number-input/number-input-increment-trigger.svelte +31 -32
  226. package/dist/number-input/number-input-input.svelte +26 -27
  227. package/dist/number-input/number-input-label.svelte +29 -30
  228. package/dist/number-input/number-input-root.svelte +73 -73
  229. package/dist/number-input/number-input-scrubber.svelte +29 -30
  230. package/dist/number-input/number-input-value-text.svelte +35 -36
  231. package/dist/pagination/pagination-ellipsis.svelte +40 -41
  232. package/dist/pagination/pagination-item.svelte +40 -47
  233. package/dist/pagination/pagination-next-trigger.svelte +31 -32
  234. package/dist/pagination/pagination-prev-trigger.svelte +31 -32
  235. package/dist/pagination/pagination-root.svelte +56 -56
  236. package/dist/pin-input/pin-input-clear-trigger.svelte +31 -32
  237. package/dist/pin-input/pin-input-control.svelte +29 -30
  238. package/dist/pin-input/pin-input-hidden-input.svelte +26 -27
  239. package/dist/pin-input/pin-input-input.svelte +33 -34
  240. package/dist/pin-input/pin-input-label.svelte +29 -30
  241. package/dist/pin-input/pin-input-root.svelte +66 -67
  242. package/dist/popover/popover-anchor.svelte +29 -30
  243. package/dist/popover/popover-arrow-tip.svelte +29 -30
  244. package/dist/popover/popover-arrow.svelte +29 -30
  245. package/dist/popover/popover-close-trigger.svelte +29 -30
  246. package/dist/popover/popover-content.svelte +36 -37
  247. package/dist/popover/popover-description.svelte +29 -30
  248. package/dist/popover/popover-indicator.svelte +29 -30
  249. package/dist/popover/popover-positioner.svelte +39 -40
  250. package/dist/popover/popover-root.svelte +60 -60
  251. package/dist/popover/popover-title.svelte +29 -30
  252. package/dist/popover/popover-trigger.svelte +29 -30
  253. package/dist/portal/portal-provider.svelte +21 -21
  254. package/dist/portal/portal.svelte +43 -43
  255. package/dist/presence/presence.svelte +46 -47
  256. package/dist/progress/progress-circle-range.svelte +30 -30
  257. package/dist/progress/progress-circle-track.svelte +30 -30
  258. package/dist/progress/progress-circle.svelte +30 -30
  259. package/dist/progress/progress-label.svelte +30 -30
  260. package/dist/progress/progress-range.svelte +30 -30
  261. package/dist/progress/progress-root.svelte +54 -53
  262. package/dist/progress/progress-track.svelte +30 -30
  263. package/dist/progress/progress-value-text.svelte +34 -34
  264. package/dist/progress/progress-view.svelte +32 -32
  265. package/dist/qr-code/index.d.ts +1 -0
  266. package/dist/qr-code/qr-code-download-trigger.svelte +45 -0
  267. package/dist/qr-code/qr-code-download-trigger.svelte.d.ts +22 -0
  268. package/dist/qr-code/qr-code-frame.svelte +30 -30
  269. package/dist/qr-code/qr-code-overlay.svelte +30 -30
  270. package/dist/qr-code/qr-code-pattern.svelte +30 -30
  271. package/dist/qr-code/qr-code-root.svelte +51 -47
  272. package/dist/qr-code/qr-code.d.ts +1 -0
  273. package/dist/qr-code/qr-code.js +1 -0
  274. package/dist/radio-group/radio-group-indicator.svelte +29 -30
  275. package/dist/radio-group/radio-group-item-control.svelte +35 -36
  276. package/dist/radio-group/radio-group-item-hidden-input.svelte +32 -33
  277. package/dist/radio-group/radio-group-item-text.svelte +35 -36
  278. package/dist/radio-group/radio-group-item.svelte +46 -48
  279. package/dist/radio-group/radio-group-label.svelte +29 -30
  280. package/dist/radio-group/radio-group-root.svelte +54 -55
  281. package/dist/rating-group/rating-group-control.svelte +29 -30
  282. package/dist/rating-group/rating-group-hidden-input.svelte +28 -29
  283. package/dist/rating-group/rating-group-item.svelte +37 -42
  284. package/dist/rating-group/rating-group-label.svelte +29 -30
  285. package/dist/rating-group/rating-group-root.svelte +61 -62
  286. package/dist/segment-group/segment-group-indicator.svelte +31 -32
  287. package/dist/segment-group/segment-group-item-control.svelte +35 -36
  288. package/dist/segment-group/segment-group-item-hidden-input.svelte +32 -33
  289. package/dist/segment-group/segment-group-item-text.svelte +35 -36
  290. package/dist/segment-group/segment-group-item.svelte +46 -47
  291. package/dist/segment-group/segment-group-label.svelte +29 -30
  292. package/dist/segment-group/segment-group-root.svelte +56 -57
  293. package/dist/select/select-clear-trigger.svelte +29 -30
  294. package/dist/select/select-content.svelte +36 -37
  295. package/dist/select/select-control.svelte +29 -30
  296. package/dist/select/select-hidden-select.svelte +29 -30
  297. package/dist/select/select-indicator.svelte +29 -30
  298. package/dist/select/select-item-group-label.svelte +38 -40
  299. package/dist/select/select-item-group.svelte +41 -45
  300. package/dist/select/select-item-indicator.svelte +35 -36
  301. package/dist/select/select-item-text.svelte +39 -40
  302. package/dist/select/select-item.svelte +46 -47
  303. package/dist/select/select-label.svelte +29 -30
  304. package/dist/select/select-list.svelte +29 -30
  305. package/dist/select/select-positioner.svelte +35 -36
  306. package/dist/select/select-root.svelte +87 -87
  307. package/dist/select/select-trigger.svelte +31 -32
  308. package/dist/select/select-value-text.svelte +36 -37
  309. package/dist/signature-pad/signature-pad-clear-trigger.svelte +31 -32
  310. package/dist/signature-pad/signature-pad-control.svelte +29 -30
  311. package/dist/signature-pad/signature-pad-current-segment-path.svelte +36 -39
  312. package/dist/signature-pad/signature-pad-guide.svelte +29 -30
  313. package/dist/signature-pad/signature-pad-hidden-input.svelte +33 -34
  314. package/dist/signature-pad/signature-pad-label.svelte +29 -30
  315. package/dist/signature-pad/signature-pad-root.svelte +58 -58
  316. package/dist/signature-pad/signature-pad-segment-path.svelte +36 -37
  317. package/dist/signature-pad/signature-pad-segment.svelte +29 -30
  318. package/dist/slider/slider-control.svelte +29 -30
  319. package/dist/slider/slider-dragging-indicator.svelte +35 -36
  320. package/dist/slider/slider-hidden-input.svelte +32 -33
  321. package/dist/slider/slider-label.svelte +29 -30
  322. package/dist/slider/slider-marker-group.svelte +29 -30
  323. package/dist/slider/slider-marker.svelte +31 -39
  324. package/dist/slider/slider-range.svelte +29 -30
  325. package/dist/slider/slider-root.svelte +67 -68
  326. package/dist/slider/slider-thumb.svelte +42 -43
  327. package/dist/slider/slider-track.svelte +29 -30
  328. package/dist/slider/slider-value-text.svelte +33 -34
  329. package/dist/splitter/splitter-panel.svelte +37 -38
  330. package/dist/splitter/splitter-resize-trigger.svelte +50 -52
  331. package/dist/splitter/splitter-root.svelte +51 -52
  332. package/dist/steps/steps-completed-content.svelte +49 -50
  333. package/dist/steps/steps-content.svelte +53 -54
  334. package/dist/steps/steps-indicator.svelte +35 -37
  335. package/dist/steps/steps-item.svelte +46 -48
  336. package/dist/steps/steps-list.svelte +29 -30
  337. package/dist/steps/steps-next-trigger.svelte +29 -30
  338. package/dist/steps/steps-prev-trigger.svelte +29 -30
  339. package/dist/steps/steps-progress.svelte +29 -30
  340. package/dist/steps/steps-root.svelte +63 -64
  341. package/dist/steps/steps-separator.svelte +35 -36
  342. package/dist/steps/steps-trigger.svelte +35 -36
  343. package/dist/switch/switch-control.svelte +29 -30
  344. package/dist/switch/switch-hidden-input.svelte +26 -27
  345. package/dist/switch/switch-label.svelte +29 -30
  346. package/dist/switch/switch-root.svelte +57 -58
  347. package/dist/switch/switch-thumb.svelte +29 -30
  348. package/dist/tabs/tabs-content.svelte +37 -38
  349. package/dist/tabs/tabs-indicator.svelte +29 -30
  350. package/dist/tabs/tabs-list.svelte +29 -30
  351. package/dist/tabs/tabs-root.svelte +57 -56
  352. package/dist/tabs/tabs-trigger.svelte +40 -41
  353. package/dist/tags-input/tags-input-clear-trigger.svelte +31 -32
  354. package/dist/tags-input/tags-input-control.svelte +29 -30
  355. package/dist/tags-input/tags-input-hidden-input.svelte +28 -29
  356. package/dist/tags-input/tags-input-input.svelte +26 -27
  357. package/dist/tags-input/tags-input-item-delete-trigger.svelte +35 -36
  358. package/dist/tags-input/tags-input-item-input.svelte +32 -33
  359. package/dist/tags-input/tags-input-item-preview.svelte +35 -36
  360. package/dist/tags-input/tags-input-item-text.svelte +35 -36
  361. package/dist/tags-input/tags-input-item.svelte +46 -48
  362. package/dist/tags-input/tags-input-label.svelte +29 -30
  363. package/dist/tags-input/tags-input-root.svelte +73 -73
  364. package/dist/time-picker/time-picker-clear-trigger.svelte +31 -32
  365. package/dist/time-picker/time-picker-column.svelte +33 -34
  366. package/dist/time-picker/time-picker-content.svelte +38 -39
  367. package/dist/time-picker/time-picker-control.svelte +29 -30
  368. package/dist/time-picker/time-picker-hour-cell.svelte +33 -34
  369. package/dist/time-picker/time-picker-input.svelte +26 -27
  370. package/dist/time-picker/time-picker-label.svelte +29 -30
  371. package/dist/time-picker/time-picker-minute-cell.svelte +33 -34
  372. package/dist/time-picker/time-picker-period-cell.svelte +36 -42
  373. package/dist/time-picker/time-picker-positioner.svelte +37 -38
  374. package/dist/time-picker/time-picker-root.svelte +80 -80
  375. package/dist/time-picker/time-picker-second-cell.svelte +33 -34
  376. package/dist/time-picker/time-picker-spacer.svelte +29 -30
  377. package/dist/time-picker/time-picker-trigger.svelte +29 -30
  378. package/dist/timer/timer-action-trigger.svelte +36 -37
  379. package/dist/timer/timer-area.svelte +29 -30
  380. package/dist/timer/timer-control.svelte +29 -30
  381. package/dist/timer/timer-item-label.svelte +35 -36
  382. package/dist/timer/timer-item-value.svelte +39 -40
  383. package/dist/timer/timer-item.svelte +42 -43
  384. package/dist/timer/timer-root.svelte +54 -54
  385. package/dist/timer/timer-separator.svelte +29 -30
  386. package/dist/toast/toast-action-trigger.svelte +29 -29
  387. package/dist/toast/toast-actor.svelte +19 -19
  388. package/dist/toast/toast-close-trigger.svelte +29 -29
  389. package/dist/toast/toast-description.svelte +33 -33
  390. package/dist/toast/toast-ghost-after.svelte +29 -29
  391. package/dist/toast/toast-ghost-before.svelte +29 -29
  392. package/dist/toast/toast-root.svelte +32 -32
  393. package/dist/toast/toast-title.svelte +33 -33
  394. package/dist/toast/toaster.svelte +67 -67
  395. package/dist/toggle/toggle-root.svelte +48 -49
  396. package/dist/toggle-group/toggle-group-item.svelte +41 -43
  397. package/dist/toggle-group/toggle-group-root.svelte +56 -57
  398. package/dist/tooltip/tooltip-arrow-tip.svelte +29 -30
  399. package/dist/tooltip/tooltip-arrow.svelte +29 -30
  400. package/dist/tooltip/tooltip-content.svelte +36 -37
  401. package/dist/tooltip/tooltip-positioner.svelte +39 -40
  402. package/dist/tooltip/tooltip-root.svelte +44 -44
  403. package/dist/tooltip/tooltip-trigger.svelte +29 -30
  404. package/dist/tour/tour-action-trigger.svelte +38 -39
  405. package/dist/tour/tour-anatomy.d.ts +2 -2
  406. package/dist/tour/tour-arrow-tip.svelte +31 -32
  407. package/dist/tour/tour-arrow.svelte +31 -32
  408. package/dist/tour/tour-backdrop.svelte +43 -43
  409. package/dist/tour/tour-close-trigger.svelte +29 -30
  410. package/dist/tour/tour-content.svelte +35 -37
  411. package/dist/tour/tour-description.svelte +33 -34
  412. package/dist/tour/tour-positioner.svelte +35 -36
  413. package/dist/tour/tour-progress-text.svelte +33 -34
  414. package/dist/tour/tour-root.svelte +46 -47
  415. package/dist/tour/tour-spotlight.svelte +29 -30
  416. package/dist/tour/tour-title.svelte +33 -34
  417. package/dist/tour/tour-trigger.svelte +29 -30
  418. package/dist/tree-view/tree-view-branch-content.svelte +56 -58
  419. package/dist/tree-view/tree-view-branch-control.svelte +35 -35
  420. package/dist/tree-view/tree-view-branch-indent-guide.svelte +35 -35
  421. package/dist/tree-view/tree-view-branch-indicator.svelte +35 -35
  422. package/dist/tree-view/tree-view-branch-text.svelte +35 -35
  423. package/dist/tree-view/tree-view-branch-trigger.svelte +35 -35
  424. package/dist/tree-view/tree-view-branch.svelte +62 -62
  425. package/dist/tree-view/tree-view-item-indicator.svelte +35 -35
  426. package/dist/tree-view/tree-view-item-text.svelte +35 -35
  427. package/dist/tree-view/tree-view-item.svelte +42 -43
  428. package/dist/tree-view/tree-view-label.svelte +29 -29
  429. package/dist/tree-view/tree-view-root.svelte +67 -67
  430. package/dist/tree-view/tree-view-tree.svelte +29 -29
  431. package/package.json +58 -58
@@ -1,38 +1,37 @@
1
- <script lang="ts" module>
2
- import type {MarkerProps} from '@zag-js/angle-slider';
3
- import type {Assign, HtmlIngredientProps} from '../types.js';
4
-
5
- export interface AngleSliderMarkerProps
6
- extends Assign<HtmlIngredientProps<'div', HTMLDivElement>, MarkerProps> {}
7
- </script>
8
-
9
- <script lang="ts">
10
- import {mergeProps} from '@zag-js/svelte';
11
- import {createSplitProps} from '../create-split-props.js';
12
- import {getAngleSliderContext} from './angle-slider-context.svelte.js';
13
-
14
- let {
15
- ref = $bindable(null),
16
- asChild,
17
- children,
18
- ...props
19
- }: AngleSliderMarkerProps = $props();
20
-
21
- let [markerProps, localProps] = $derived(
22
- createSplitProps<MarkerProps>(['value'])(props),
23
- );
24
-
25
- let angleSlider = getAngleSliderContext();
26
-
27
- let mergedProps = $derived(
28
- mergeProps(angleSlider.getMarkerProps(markerProps), localProps),
29
- );
30
- </script>
31
-
32
- {#if asChild}
33
- {@render asChild(mergedProps)}
34
- {:else}
35
- <div {...mergedProps}>
36
- {@render children?.()}
37
- </div>
38
- {/if}
1
+ <script lang="ts" module>
2
+ import type {MarkerProps} from '@zag-js/angle-slider';
3
+ import type {Assign, HtmlIngredientProps} from '../types.js';
4
+
5
+ export interface AngleSliderMarkerProps
6
+ extends Assign<HtmlIngredientProps<'div', HTMLDivElement>, MarkerProps> {}
7
+ </script>
8
+
9
+ <script lang="ts">
10
+ import {mergeProps} from '@zag-js/svelte';
11
+ import {createSplitProps} from '../create-split-props.js';
12
+ import {getAngleSliderContext} from './angle-slider-context.svelte.js';
13
+
14
+ let {
15
+ ref = $bindable(null),
16
+ asChild,
17
+ children,
18
+ ...props
19
+ }: AngleSliderMarkerProps = $props();
20
+
21
+ let [markerProps, localProps] = $derived(
22
+ createSplitProps<MarkerProps>(['value'])(props),
23
+ );
24
+
25
+ let angleSlider = getAngleSliderContext();
26
+ let mergedProps = $derived(
27
+ mergeProps(angleSlider.getMarkerProps(markerProps), localProps),
28
+ );
29
+ </script>
30
+
31
+ {#if asChild}
32
+ {@render asChild(mergedProps)}
33
+ {:else}
34
+ <div {...mergedProps}>
35
+ {@render children?.()}
36
+ </div>
37
+ {/if}
@@ -1,58 +1,57 @@
1
- <script lang="ts" module>
2
- import type {Assign, HtmlIngredientProps} from '../types.js';
3
- import {
4
- type CreateAngleSliderProps,
5
- type CreateAngleSliderReturn,
6
- } from './create-angle-slider.svelte.js';
7
-
8
- export interface AngleSliderProps
9
- extends Assign<
10
- HtmlIngredientProps<'div', HTMLDivElement, CreateAngleSliderReturn>,
11
- CreateAngleSliderProps
12
- > {}
13
- </script>
14
-
15
- <script lang="ts">
16
- import {mergeProps, reflect} from '@zag-js/svelte';
17
- import {createSplitProps} from '../create-split-props.js';
18
- import {setAngleSliderContext} from './angle-slider-context.svelte.js';
19
- import {createAngleSlider} from './create-angle-slider.svelte.js';
20
-
21
- let {
22
- ref = $bindable(null),
23
- asChild,
24
- children,
25
- ...props
26
- }: AngleSliderProps = $props();
27
-
28
- let [createAngleSliderProps, localProps] = $derived(
29
- createSplitProps<CreateAngleSliderProps>([
30
- 'id',
31
- 'ids',
32
- 'name',
33
- 'step',
34
- 'value',
35
- 'invalid',
36
- 'disabled',
37
- 'readOnly',
38
- 'onValueChange',
39
- 'onValueChangeEnd',
40
- ])(props),
41
- );
42
-
43
- let angleSlider = createAngleSlider(reflect(() => createAngleSliderProps));
44
-
45
- let mergedProps = $derived(
46
- mergeProps(angleSlider.getRootProps(), localProps),
47
- );
48
-
49
- setAngleSliderContext(angleSlider);
50
- </script>
51
-
52
- {#if asChild}
53
- {@render asChild(mergedProps, angleSlider)}
54
- {:else}
55
- <div bind:this={ref} {...mergedProps}>
56
- {@render children?.(angleSlider)}
57
- </div>
58
- {/if}
1
+ <script lang="ts" module>
2
+ import type {Assign, HtmlIngredientProps} from '../types.js';
3
+ import {
4
+ type CreateAngleSliderProps,
5
+ type CreateAngleSliderReturn,
6
+ } from './create-angle-slider.svelte.js';
7
+
8
+ export interface AngleSliderProps
9
+ extends Assign<
10
+ HtmlIngredientProps<'div', HTMLDivElement, CreateAngleSliderReturn>,
11
+ CreateAngleSliderProps
12
+ > {}
13
+ </script>
14
+
15
+ <script lang="ts">
16
+ import {mergeProps, reflect} from '@zag-js/svelte';
17
+ import {createSplitProps} from '../create-split-props.js';
18
+ import {setAngleSliderContext} from './angle-slider-context.svelte.js';
19
+ import {createAngleSlider} from './create-angle-slider.svelte.js';
20
+
21
+ let {
22
+ ref = $bindable(null),
23
+ asChild,
24
+ children,
25
+ ...props
26
+ }: AngleSliderProps = $props();
27
+
28
+ let [createAngleSliderProps, localProps] = $derived(
29
+ createSplitProps<CreateAngleSliderProps>([
30
+ 'disabled',
31
+ 'id',
32
+ 'ids',
33
+ 'invalid',
34
+ 'name',
35
+ 'onValueChange',
36
+ 'onValueChangeEnd',
37
+ 'readOnly',
38
+ 'step',
39
+ 'value',
40
+ ])(props),
41
+ );
42
+
43
+ let angleSlider = createAngleSlider(reflect(() => createAngleSliderProps));
44
+ let mergedProps = $derived(
45
+ mergeProps(angleSlider.getRootProps(), localProps),
46
+ );
47
+
48
+ setAngleSliderContext(angleSlider);
49
+ </script>
50
+
51
+ {#if asChild}
52
+ {@render asChild(mergedProps, angleSlider)}
53
+ {:else}
54
+ <div bind:this={ref} {...mergedProps}>
55
+ {@render children?.(angleSlider)}
56
+ </div>
57
+ {/if}
@@ -1,29 +1,29 @@
1
- <script lang="ts" module>
2
- import type {HtmlIngredientProps} from '../types.js';
3
-
4
- export interface AngleSliderThumbProps
5
- extends HtmlIngredientProps<'div', HTMLDivElement> {}
6
- </script>
7
-
8
- <script lang="ts">
9
- import {mergeProps} from '@zag-js/svelte';
10
- import {getAngleSliderContext} from './angle-slider-context.svelte.js';
11
-
12
- let {
13
- ref = $bindable(null),
14
- asChild,
15
- children,
16
- ...props
17
- }: AngleSliderThumbProps = $props();
18
-
19
- let angleSlider = getAngleSliderContext();
20
- let mergedProps = $derived(mergeProps(angleSlider.getThumbProps(), props));
21
- </script>
22
-
23
- {#if asChild}
24
- {@render asChild(mergedProps)}
25
- {:else}
26
- <div {...mergedProps}>
27
- {@render children?.()}
28
- </div>
29
- {/if}
1
+ <script lang="ts" module>
2
+ import type {HtmlIngredientProps} from '../types.js';
3
+
4
+ export interface AngleSliderThumbProps
5
+ extends HtmlIngredientProps<'div', HTMLDivElement> {}
6
+ </script>
7
+
8
+ <script lang="ts">
9
+ import {mergeProps} from '@zag-js/svelte';
10
+ import {getAngleSliderContext} from './angle-slider-context.svelte.js';
11
+
12
+ let {
13
+ ref = $bindable(null),
14
+ asChild,
15
+ children,
16
+ ...props
17
+ }: AngleSliderThumbProps = $props();
18
+
19
+ let angleSlider = getAngleSliderContext();
20
+ let mergedProps = $derived(mergeProps(angleSlider.getThumbProps(), props));
21
+ </script>
22
+
23
+ {#if asChild}
24
+ {@render asChild(mergedProps)}
25
+ {:else}
26
+ <div {...mergedProps}>
27
+ {@render children?.()}
28
+ </div>
29
+ {/if}
@@ -1,35 +1,35 @@
1
- <script lang="ts" module>
2
- import type {HtmlIngredientProps} from '../types.js';
3
-
4
- export interface AngleSliderValueTextProps
5
- extends HtmlIngredientProps<'span', HTMLSpanElement> {}
6
- </script>
7
-
8
- <script lang="ts">
9
- import {mergeProps} from '@zag-js/svelte';
10
- import {getAngleSliderContext} from './angle-slider-context.svelte.js';
11
-
12
- let {
13
- ref = $bindable(null),
14
- asChild,
15
- children,
16
- ...props
17
- }: AngleSliderValueTextProps = $props();
18
-
19
- let angleSlider = getAngleSliderContext();
20
- let mergedProps = $derived(
21
- mergeProps(angleSlider.getValueTextProps(), props),
22
- );
23
- </script>
24
-
25
- {#if asChild}
26
- {@render asChild(mergedProps)}
27
- {:else}
28
- <span {...mergedProps}>
29
- {#if children}
30
- {@render children()}
31
- {:else}
32
- {angleSlider.valueAsDegree}
33
- {/if}
34
- </span>
35
- {/if}
1
+ <script lang="ts" module>
2
+ import type {HtmlIngredientProps} from '../types.js';
3
+
4
+ export interface AngleSliderValueTextProps
5
+ extends HtmlIngredientProps<'span', HTMLSpanElement> {}
6
+ </script>
7
+
8
+ <script lang="ts">
9
+ import {mergeProps} from '@zag-js/svelte';
10
+ import {getAngleSliderContext} from './angle-slider-context.svelte.js';
11
+
12
+ let {
13
+ ref = $bindable(null),
14
+ asChild,
15
+ children,
16
+ ...props
17
+ }: AngleSliderValueTextProps = $props();
18
+
19
+ let angleSlider = getAngleSliderContext();
20
+ let mergedProps = $derived(
21
+ mergeProps(angleSlider.getValueTextProps(), props),
22
+ );
23
+ </script>
24
+
25
+ {#if asChild}
26
+ {@render asChild(mergedProps)}
27
+ {:else}
28
+ <span {...mergedProps}>
29
+ {#if children}
30
+ {@render children()}
31
+ {:else}
32
+ {angleSlider.valueAsDegree}
33
+ {/if}
34
+ </span>
35
+ {/if}
@@ -1,30 +1,29 @@
1
- <script lang="ts" module>
2
- import type {HtmlIngredientProps} from '../types.js';
3
-
4
- export interface AvatarFallbackProps
5
- extends HtmlIngredientProps<'span', HTMLSpanElement> {}
6
- </script>
7
-
8
- <script lang="ts">
9
- import {mergeProps} from '@zag-js/svelte';
10
- import {getAvatarContext} from './avatar-context.svelte.js';
11
-
12
- let {
13
- ref = $bindable(null),
14
- asChild,
15
- children,
16
- ...props
17
- }: AvatarFallbackProps = $props();
18
-
19
- let avatar = getAvatarContext();
20
-
21
- let mergedProps = $derived(mergeProps(avatar.getFallbackProps(), props));
22
- </script>
23
-
24
- {#if asChild}
25
- {@render asChild(mergedProps)}
26
- {:else}
27
- <span bind:this={ref} {...mergedProps}>
28
- {@render children?.()}
29
- </span>
30
- {/if}
1
+ <script lang="ts" module>
2
+ import type {HtmlIngredientProps} from '../types.js';
3
+
4
+ export interface AvatarFallbackProps
5
+ extends HtmlIngredientProps<'span', HTMLSpanElement> {}
6
+ </script>
7
+
8
+ <script lang="ts">
9
+ import {mergeProps} from '@zag-js/svelte';
10
+ import {getAvatarContext} from './avatar-context.svelte.js';
11
+
12
+ let {
13
+ ref = $bindable(null),
14
+ asChild,
15
+ children,
16
+ ...props
17
+ }: AvatarFallbackProps = $props();
18
+
19
+ let avatar = getAvatarContext();
20
+ let mergedProps = $derived(mergeProps(avatar.getFallbackProps(), props));
21
+ </script>
22
+
23
+ {#if asChild}
24
+ {@render asChild(mergedProps)}
25
+ {:else}
26
+ <span bind:this={ref} {...mergedProps}>
27
+ {@render children?.()}
28
+ </span>
29
+ {/if}
@@ -1,23 +1,22 @@
1
- <script lang="ts" module>
2
- import type {HtmlIngredientProps} from '../types.js';
3
-
4
- export interface AvatarImageProps
5
- extends HtmlIngredientProps<'img', HTMLImageElement> {}
6
- </script>
7
-
8
- <script lang="ts">
9
- import {mergeProps} from '@zag-js/svelte';
10
- import {getAvatarContext} from './avatar-context.svelte.js';
11
-
12
- let {ref = $bindable(null), asChild, ...props}: AvatarImageProps = $props();
13
-
14
- let avatar = getAvatarContext();
15
-
16
- let mergedProps = $derived(mergeProps(avatar.getImageProps(), props));
17
- </script>
18
-
19
- {#if asChild}
20
- {@render asChild(mergedProps)}
21
- {:else}
22
- <img bind:this={ref} {...mergedProps} />
23
- {/if}
1
+ <script lang="ts" module>
2
+ import type {HtmlIngredientProps} from '../types.js';
3
+
4
+ export interface AvatarImageProps
5
+ extends HtmlIngredientProps<'img', HTMLImageElement> {}
6
+ </script>
7
+
8
+ <script lang="ts">
9
+ import {mergeProps} from '@zag-js/svelte';
10
+ import {getAvatarContext} from './avatar-context.svelte.js';
11
+
12
+ let {ref = $bindable(null), asChild, ...props}: AvatarImageProps = $props();
13
+
14
+ let avatar = getAvatarContext();
15
+ let mergedProps = $derived(mergeProps(avatar.getImageProps(), props));
16
+ </script>
17
+
18
+ {#if asChild}
19
+ {@render asChild(mergedProps)}
20
+ {:else}
21
+ <img bind:this={ref} {...mergedProps} />
22
+ {/if}
@@ -1,45 +1,44 @@
1
- <script lang="ts" module>
2
- import type {Assign, HtmlIngredientProps} from '../types.js';
3
- import {
4
- type CreateAvatarProps,
5
- type CreateAvatarReturn,
6
- } from './create-avatar.svelte.js';
7
-
8
- export interface AvatarProps
9
- extends Assign<
10
- HtmlIngredientProps<'div', HTMLDivElement, CreateAvatarReturn>,
11
- CreateAvatarProps
12
- > {}
13
- </script>
14
-
15
- <script lang="ts">
16
- import {mergeProps, reflect} from '@zag-js/svelte';
17
- import {createSplitProps} from '../create-split-props.js';
18
- import {setAvatarContext} from './avatar-context.svelte.js';
19
- import {createAvatar} from './create-avatar.svelte.js';
20
-
21
- let {
22
- ref = $bindable(null),
23
- asChild,
24
- children,
25
- ...props
26
- }: AvatarProps = $props();
27
-
28
- let [createAvatarProps, localProps] = $derived(
29
- createSplitProps<CreateAvatarProps>(['id', 'ids', 'onStatusChange'])(props),
30
- );
31
-
32
- let avatar = createAvatar(reflect(() => createAvatarProps));
33
-
34
- let mergedProps = $derived(mergeProps(avatar.getRootProps(), localProps));
35
-
36
- setAvatarContext(avatar);
37
- </script>
38
-
39
- {#if asChild}
40
- {@render asChild(mergedProps, avatar)}
41
- {:else}
42
- <div bind:this={ref} {...mergedProps}>
43
- {@render children?.(avatar)}
44
- </div>
45
- {/if}
1
+ <script lang="ts" module>
2
+ import type {Assign, HtmlIngredientProps} from '../types.js';
3
+ import {
4
+ type CreateAvatarProps,
5
+ type CreateAvatarReturn,
6
+ } from './create-avatar.svelte.js';
7
+
8
+ export interface AvatarProps
9
+ extends Assign<
10
+ HtmlIngredientProps<'div', HTMLDivElement, CreateAvatarReturn>,
11
+ CreateAvatarProps
12
+ > {}
13
+ </script>
14
+
15
+ <script lang="ts">
16
+ import {mergeProps, reflect} from '@zag-js/svelte';
17
+ import {createSplitProps} from '../create-split-props.js';
18
+ import {setAvatarContext} from './avatar-context.svelte.js';
19
+ import {createAvatar} from './create-avatar.svelte.js';
20
+
21
+ let {
22
+ ref = $bindable(null),
23
+ asChild,
24
+ children,
25
+ ...props
26
+ }: AvatarProps = $props();
27
+
28
+ let [createAvatarProps, localProps] = $derived(
29
+ createSplitProps<CreateAvatarProps>(['id', 'ids', 'onStatusChange'])(props),
30
+ );
31
+
32
+ let avatar = createAvatar(reflect(() => createAvatarProps));
33
+ let mergedProps = $derived(mergeProps(avatar.getRootProps(), localProps));
34
+
35
+ setAvatarContext(avatar);
36
+ </script>
37
+
38
+ {#if asChild}
39
+ {@render asChild(mergedProps, avatar)}
40
+ {:else}
41
+ <div bind:this={ref} {...mergedProps}>
42
+ {@render children?.(avatar)}
43
+ </div>
44
+ {/if}
@@ -1,30 +1,29 @@
1
- <script lang="ts" module>
2
- import type {HtmlIngredientProps} from '../types.js';
3
-
4
- export interface BreadcrumbsItemProps
5
- extends HtmlIngredientProps<'li', HTMLLIElement> {}
6
- </script>
7
-
8
- <script lang="ts">
9
- import {mergeProps} from '@zag-js/svelte';
10
- import {createBreadcrumbs} from './create-breadcrumbs.js';
11
-
12
- let {
13
- ref = $bindable(null),
14
- asChild,
15
- children,
16
- ...props
17
- }: BreadcrumbsItemProps = $props();
18
-
19
- let breadcrumbs = createBreadcrumbs();
20
-
21
- let attrs = $derived(mergeProps(breadcrumbs.getItemProps(), props));
22
- </script>
23
-
24
- {#if asChild}
25
- {@render asChild(attrs)}
26
- {:else}
27
- <li bind:this={ref} {...attrs}>
28
- {@render children?.()}
29
- </li>
30
- {/if}
1
+ <script lang="ts" module>
2
+ import type {HtmlIngredientProps} from '../types.js';
3
+
4
+ export interface BreadcrumbsItemProps
5
+ extends HtmlIngredientProps<'li', HTMLLIElement> {}
6
+ </script>
7
+
8
+ <script lang="ts">
9
+ import {mergeProps} from '@zag-js/svelte';
10
+ import {createBreadcrumbs} from './create-breadcrumbs.js';
11
+
12
+ let {
13
+ ref = $bindable(null),
14
+ asChild,
15
+ children,
16
+ ...props
17
+ }: BreadcrumbsItemProps = $props();
18
+
19
+ let breadcrumbs = createBreadcrumbs();
20
+ let mergedProps = $derived(mergeProps(breadcrumbs.getItemProps(), props));
21
+ </script>
22
+
23
+ {#if asChild}
24
+ {@render asChild(mergedProps)}
25
+ {:else}
26
+ <li bind:this={ref} {...mergedProps}>
27
+ {@render children?.()}
28
+ </li>
29
+ {/if}
@@ -1,38 +1,37 @@
1
- <script lang="ts" module>
2
- import type {Assign, HtmlIngredientProps} from '../types.js';
3
- import type {LinkProps} from './create-breadcrumbs.js';
4
-
5
- export interface BreadcrumbsLinkProps
6
- extends Assign<HtmlIngredientProps<'a', HTMLAnchorElement>, LinkProps> {}
7
- </script>
8
-
9
- <script lang="ts">
10
- import {mergeProps} from '@zag-js/svelte';
11
- import {createSplitProps} from '../create-split-props.js';
12
- import {getBreadcrumbsContext} from './breadcrumbs-context.svelte.js';
13
-
14
- let {
15
- ref = $bindable(null),
16
- asChild,
17
- children,
18
- ...props
19
- }: BreadcrumbsLinkProps = $props();
20
-
21
- let [linkProps, localProps] = $derived(
22
- createSplitProps<LinkProps>(['href', 'current'])(props),
23
- );
24
-
25
- let breadcrumbs = getBreadcrumbsContext();
26
-
27
- let attrs = $derived(
28
- mergeProps(breadcrumbs.getLinkProps(linkProps), localProps),
29
- );
30
- </script>
31
-
32
- {#if asChild}
33
- {@render asChild(attrs)}
34
- {:else}
35
- <a bind:this={ref} {...attrs}>
36
- {@render children?.()}
37
- </a>
38
- {/if}
1
+ <script lang="ts" module>
2
+ import type {Assign, HtmlIngredientProps} from '../types.js';
3
+ import type {LinkProps} from './create-breadcrumbs.js';
4
+
5
+ export interface BreadcrumbsLinkProps
6
+ extends Assign<HtmlIngredientProps<'a', HTMLAnchorElement>, LinkProps> {}
7
+ </script>
8
+
9
+ <script lang="ts">
10
+ import {mergeProps} from '@zag-js/svelte';
11
+ import {createSplitProps} from '../create-split-props.js';
12
+ import {getBreadcrumbsContext} from './breadcrumbs-context.svelte.js';
13
+
14
+ let {
15
+ ref = $bindable(null),
16
+ asChild,
17
+ children,
18
+ ...props
19
+ }: BreadcrumbsLinkProps = $props();
20
+
21
+ let [linkProps, localProps] = $derived(
22
+ createSplitProps<LinkProps>(['href', 'current'])(props),
23
+ );
24
+
25
+ let breadcrumbs = getBreadcrumbsContext();
26
+ let mergedProps = $derived(
27
+ mergeProps(breadcrumbs.getLinkProps(linkProps), localProps),
28
+ );
29
+ </script>
30
+
31
+ {#if asChild}
32
+ {@render asChild(mergedProps)}
33
+ {:else}
34
+ <a bind:this={ref} {...mergedProps}>
35
+ {@render children?.()}
36
+ </a>
37
+ {/if}