prime-ui-kit 0.9.0 → 0.9.1

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 (942) hide show
  1. package/README.md +41 -41
  2. package/dist/chunks/chunk-DB2Y3XXA.js +12437 -0
  3. package/dist/chunks/chunk-KCQFOORX.js +379 -0
  4. package/dist/chunks/chunk-NHOWNIAR.js +3239 -0
  5. package/dist/color-picker.d.ts +7 -0
  6. package/dist/color-picker.js +9 -0
  7. package/dist/components/accordion/Accordion.d.ts +44 -32
  8. package/dist/components/avatar/Avatar.d.ts +36 -53
  9. package/dist/components/badge/Badge.d.ts +50 -13
  10. package/dist/components/badge/edgeIcons.d.ts +13 -0
  11. package/dist/components/badge/tier.d.ts +0 -1
  12. package/dist/components/banner/Banner.d.ts +29 -60
  13. package/dist/components/breadcrumb/Breadcrumb.d.ts +11 -23
  14. package/dist/components/button/Button.d.ts +22 -36
  15. package/dist/components/button-group/ButtonGroup.d.ts +17 -17
  16. package/dist/components/card/Card.d.ts +75 -202
  17. package/dist/components/checkbox/Checkbox.d.ts +37 -38
  18. package/dist/components/code-block/CodeBlock.d.ts +5 -13
  19. package/dist/components/color-picker/ColorPicker.d.ts +76 -52
  20. package/dist/components/color-picker/ColorPresets.d.ts +18 -30
  21. package/dist/components/color-swatches/ColorSwatches.d.ts +40 -0
  22. package/dist/components/command-menu/CommandMenu.d.ts +138 -78
  23. package/dist/components/crossfade/Crossfade.d.ts +14 -0
  24. package/dist/components/data-table/DataTable.d.ts +30 -81
  25. package/dist/components/data-table/Footer.d.ts +16 -0
  26. package/dist/components/data-table/Head.d.ts +21 -0
  27. package/dist/components/data-table/Row.d.ts +56 -0
  28. package/dist/components/data-table/StateRows.d.ts +18 -0
  29. package/dist/components/data-table/rows.d.ts +60 -0
  30. package/dist/components/data-table/types.d.ts +35 -0
  31. package/dist/components/data-table/useColumnHover.d.ts +9 -0
  32. package/dist/components/data-table/useFrozenColumns.d.ts +16 -0
  33. package/dist/components/data-table/useInfiniteRows.d.ts +24 -0
  34. package/dist/components/data-table/useRowSelection.d.ts +35 -0
  35. package/dist/components/datepicker/Datepicker.d.ts +9 -126
  36. package/dist/components/datepicker/DatepickerPanel.d.ts +113 -0
  37. package/dist/components/datepicker/datepickerModel.d.ts +16 -22
  38. package/dist/components/datepicker/panelLayout.d.ts +50 -0
  39. package/dist/components/digit-input/DigitInput.d.ts +24 -19
  40. package/dist/components/divider/Divider.d.ts +7 -15
  41. package/dist/components/dnd/Dnd.d.ts +135 -0
  42. package/dist/components/dnd/DragOverlay.d.ts +6 -0
  43. package/dist/components/dnd/autoScroll.d.ts +5 -0
  44. package/dist/components/dnd/context.d.ts +5 -0
  45. package/dist/components/dnd/dragSession.d.ts +93 -0
  46. package/dist/components/dnd/geometry.d.ts +30 -0
  47. package/dist/components/dnd/labels.d.ts +18 -0
  48. package/dist/components/dnd/store.d.ts +9 -0
  49. package/dist/components/dnd/useDragSource.d.ts +36 -0
  50. package/dist/components/dnd/useDropTarget.d.ts +39 -0
  51. package/dist/components/dnd/useFlipList.d.ts +11 -0
  52. package/dist/components/dnd/useSortableList.d.ts +62 -0
  53. package/dist/components/drawer/Drawer.d.ts +8 -19
  54. package/dist/components/dropdown/Dropdown.d.ts +63 -86
  55. package/dist/components/empty-page/EmptyPage.d.ts +48 -48
  56. package/dist/components/example-frame/ExampleFrame.d.ts +20 -27
  57. package/dist/components/file-upload/FileUpload.d.ts +79 -134
  58. package/dist/components/hint/Hint.d.ts +10 -11
  59. package/dist/components/index.d.ts +54 -42
  60. package/dist/components/input/Input.d.ts +35 -37
  61. package/dist/components/kbd/Kbd.d.ts +6 -12
  62. package/dist/components/label/Label.d.ts +18 -15
  63. package/dist/components/link-button/LinkButton.d.ts +14 -15
  64. package/dist/components/login-form/LoginForm.d.ts +115 -0
  65. package/dist/components/modal/DialogParts.d.ts +57 -16
  66. package/dist/components/modal/Modal.d.ts +7 -21
  67. package/dist/components/native-select/NativeSelect.d.ts +28 -0
  68. package/dist/components/notification/Notification.d.ts +50 -16
  69. package/dist/components/notification/NotificationStore.d.ts +2 -6
  70. package/dist/components/page-content/PageContent.d.ts +43 -52
  71. package/dist/components/pagination/Pagination.d.ts +11 -23
  72. package/dist/components/popover/Popover.d.ts +62 -26
  73. package/dist/components/progress-bar/ProgressBar.d.ts +17 -13
  74. package/dist/components/progress-circle/ProgressCircle.d.ts +14 -15
  75. package/dist/components/radio/Radio.d.ts +46 -54
  76. package/dist/components/scroll-container/ScrollContainer.d.ts +10 -13
  77. package/dist/components/segmented-control/SegmentedControl.d.ts +15 -27
  78. package/dist/components/select/Select.d.ts +54 -135
  79. package/dist/components/select/SelectItem.d.ts +68 -0
  80. package/dist/components/select/selectContext.d.ts +61 -0
  81. package/dist/components/skeleton/Skeleton.d.ts +22 -0
  82. package/dist/components/slider/Slider.d.ts +24 -16
  83. package/dist/components/smart-filter/SmartFilter.d.ts +105 -0
  84. package/dist/components/smart-filter/model.d.ts +33 -0
  85. package/dist/components/spinner/Spinner.d.ts +22 -0
  86. package/dist/components/stepper/Stepper.d.ts +32 -42
  87. package/dist/components/switch/Switch.d.ts +19 -37
  88. package/dist/components/tabs/Tabs.d.ts +62 -38
  89. package/dist/components/tag-select/TagOptionMenu.d.ts +29 -0
  90. package/dist/components/tag-select/TagSelect.d.ts +15 -16
  91. package/dist/components/tag-select/useChipOverflow.d.ts +19 -0
  92. package/dist/components/textarea/Textarea.d.ts +16 -31
  93. package/dist/components/thumbnail/Thumbnail.d.ts +41 -0
  94. package/dist/components/timeline/Timeline.d.ts +46 -61
  95. package/dist/components/tooltip/Tooltip.d.ts +21 -17
  96. package/dist/components/typography/Typography.d.ts +5 -21
  97. package/dist/hooks/useControllableState.d.ts +0 -1
  98. package/dist/hooks/useEnterConfirm.d.ts +15 -0
  99. package/dist/hooks/useImageStatus.d.ts +19 -0
  100. package/dist/hooks/useInertSiblings.d.ts +9 -0
  101. package/dist/hooks/useMergedRefs.d.ts +6 -2
  102. package/dist/hooks/useModalLayer.d.ts +22 -0
  103. package/dist/hooks/usePosition.d.ts +46 -40
  104. package/dist/hooks/usePresence.d.ts +0 -1
  105. package/dist/hooks/useScrollLock.d.ts +3 -5
  106. package/dist/hooks/useStateSwap.d.ts +8 -0
  107. package/dist/icons/Icon.d.ts +24 -7
  108. package/dist/icons/index.d.ts +2 -44
  109. package/dist/icons/registry.d.ts +85 -0
  110. package/dist/index.css +5990 -6891
  111. package/dist/index.d.ts +0 -1
  112. package/dist/index.js +98 -13830
  113. package/dist/internal/AnchorRectContext.d.ts +12 -0
  114. package/dist/internal/ChoiceField.d.ts +34 -0
  115. package/dist/internal/ControlSizeContext.d.ts +6 -2
  116. package/dist/internal/FieldFrame.d.ts +47 -8
  117. package/dist/internal/HighlightMatch.d.ts +13 -0
  118. package/dist/internal/MenuGroup.d.ts +8 -0
  119. package/dist/internal/Portal.d.ts +0 -1
  120. package/dist/internal/VisuallyHidden.d.ts +11 -0
  121. package/dist/internal/context.d.ts +0 -1
  122. package/dist/internal/cx.d.ts +0 -1
  123. package/dist/internal/data-attributes.d.ts +0 -1
  124. package/dist/internal/fieldClasses.d.ts +9 -0
  125. package/dist/internal/formatLabel.d.ts +6 -0
  126. package/dist/internal/highlightTsxHtml.d.ts +1 -2
  127. package/dist/internal/iconBox.d.ts +9 -0
  128. package/dist/internal/iconLayout.d.ts +15 -0
  129. package/dist/internal/imageSlot.d.ts +29 -0
  130. package/dist/internal/layoutPxFromPrimitives.d.ts +2 -3
  131. package/dist/internal/listbox.d.ts +40 -0
  132. package/dist/internal/mergeRefs.d.ts +4 -2
  133. package/dist/internal/overlay/FloatingPanel.d.ts +34 -0
  134. package/dist/internal/overlay/focus.d.ts +14 -0
  135. package/dist/internal/overlay/layerStack.d.ts +41 -0
  136. package/dist/internal/overlay/useFloatingLayer.d.ts +60 -0
  137. package/dist/internal/polymorphic.d.ts +9 -0
  138. package/dist/internal/progressSegments.d.ts +63 -0
  139. package/dist/internal/rovingFocus.d.ts +18 -0
  140. package/dist/internal/scrollAncestors.d.ts +1 -2
  141. package/dist/internal/slot.d.ts +11 -5
  142. package/dist/internal/states.d.ts +3 -2
  143. package/dist/internal/swatch.d.ts +56 -0
  144. package/dist/layout/app-shell/AppShell.d.ts +41 -21
  145. package/dist/layout/index.d.ts +1 -2
  146. package/dist/layout/sidebar/Sidebar.d.ts +206 -35
  147. package/dist/theme/applyTheme.d.ts +0 -1
  148. package/dist/tokens/naming.d.ts +6 -0
  149. package/dist/tokens/primitives.d.ts +22 -80
  150. package/dist/tokens/semantic.d.ts +66 -25
  151. package/dist/tokens/themes/dark.d.ts +3 -1
  152. package/package.json +29 -24
  153. package/src/components/accordion/COMPONENT.md +90 -100
  154. package/src/components/accordion/examples/collapsible.tsx +27 -0
  155. package/src/components/accordion/examples/controlled.tsx +36 -0
  156. package/src/components/accordion/examples/examples.module.css +6 -39
  157. package/src/components/accordion/examples/multiple.tsx +31 -0
  158. package/src/components/accordion/examples/overview.tsx +39 -0
  159. package/src/components/accordion/examples/sizes.tsx +14 -25
  160. package/src/components/accordion/examples/states.tsx +23 -48
  161. package/src/components/accordion/examples/variants.tsx +35 -0
  162. package/src/components/accordion/examples/with-icon.tsx +47 -0
  163. package/src/components/avatar/COMPONENT.md +88 -153
  164. package/src/components/avatar/examples/examples.module.css +6 -44
  165. package/src/components/avatar/examples/overview.tsx +18 -0
  166. package/src/components/avatar/examples/presence.tsx +20 -17
  167. package/src/components/avatar/examples/sizes.tsx +8 -10
  168. package/src/components/avatar/examples/src-from-state.tsx +4 -5
  169. package/src/components/avatar/examples/states.tsx +17 -27
  170. package/src/components/avatar/examples/team-group.tsx +21 -0
  171. package/src/components/avatar/examples/variants.tsx +40 -0
  172. package/src/components/badge/COMPONENT.md +113 -122
  173. package/src/components/{tag → badge}/examples/applied-filters.tsx +10 -11
  174. package/src/components/badge/examples/examples.module.css +14 -59
  175. package/src/components/badge/examples/filter-values.tsx +39 -0
  176. package/src/components/badge/examples/in-controls.tsx +14 -26
  177. package/src/components/badge/examples/overview.tsx +13 -0
  178. package/src/components/badge/examples/sizes.tsx +8 -10
  179. package/src/components/badge/examples/states.tsx +35 -29
  180. package/src/components/badge/examples/variants.tsx +27 -36
  181. package/src/components/badge/examples/with-icon.tsx +50 -0
  182. package/src/components/banner/COMPONENT.md +88 -93
  183. package/src/components/banner/examples/dismissible.tsx +38 -0
  184. package/src/components/banner/examples/examples.module.css +6 -22
  185. package/src/components/banner/examples/narrow.tsx +23 -0
  186. package/src/components/banner/examples/overview.tsx +18 -0
  187. package/src/components/banner/examples/page-strip.tsx +53 -0
  188. package/src/components/banner/examples/sizes.tsx +22 -21
  189. package/src/components/banner/examples/structure.tsx +45 -0
  190. package/src/components/banner/examples/variants.tsx +28 -55
  191. package/src/components/breadcrumb/COMPONENT.md +55 -59
  192. package/src/components/breadcrumb/examples/ellipsis.tsx +12 -0
  193. package/src/components/breadcrumb/examples/examples.module.css +3 -52
  194. package/src/components/breadcrumb/examples/overflow.tsx +26 -0
  195. package/src/components/breadcrumb/examples/overview.tsx +12 -0
  196. package/src/components/breadcrumb/examples/sizes.tsx +11 -14
  197. package/src/components/breadcrumb/examples/with-icon.tsx +14 -0
  198. package/src/components/button/COMPONENT.md +65 -66
  199. package/src/components/button/examples/as-child.tsx +8 -32
  200. package/src/components/button/examples/examples.module.css +18 -76
  201. package/src/components/button/examples/in-form.tsx +20 -14
  202. package/src/components/button/examples/on-colored-host.tsx +29 -0
  203. package/src/components/button/examples/overview.tsx +13 -0
  204. package/src/components/button/examples/sizes.tsx +7 -9
  205. package/src/components/button/examples/states.tsx +18 -28
  206. package/src/components/button/examples/variants.tsx +31 -0
  207. package/src/components/button/examples/with-icon.tsx +35 -23
  208. package/src/components/button-group/COMPONENT.md +64 -55
  209. package/src/components/button-group/examples/controlled.tsx +3 -3
  210. package/src/components/button-group/examples/examples.module.css +4 -39
  211. package/src/components/button-group/examples/full-width.tsx +10 -14
  212. package/src/components/button-group/examples/in-form.tsx +3 -3
  213. package/src/components/button-group/examples/orientation.tsx +6 -8
  214. package/src/components/button-group/examples/overview.tsx +12 -0
  215. package/src/components/button-group/examples/sizes.tsx +8 -10
  216. package/src/components/button-group/examples/states.tsx +28 -7
  217. package/src/components/button-group/examples/with-icon.tsx +45 -0
  218. package/src/components/card/COMPONENT.md +99 -298
  219. package/src/components/card/examples/{content.tsx → content-templates.tsx} +23 -29
  220. package/src/components/card/examples/examples.module.css +0 -8
  221. package/src/components/card/examples/flat.tsx +9 -14
  222. package/src/components/card/examples/kpi-media.tsx +42 -0
  223. package/src/components/card/examples/narrow.tsx +47 -0
  224. package/src/components/card/examples/{settings.tsx → overview.tsx} +7 -8
  225. package/src/components/card/examples/panel-chart.tsx +26 -34
  226. package/src/components/card/examples/{metrics.tsx → variants.tsx} +12 -18
  227. package/src/components/checkbox/COMPONENT.md +92 -96
  228. package/src/components/checkbox/examples/controlled.tsx +41 -0
  229. package/src/components/checkbox/examples/examples.module.css +45 -43
  230. package/src/components/checkbox/examples/in-form.tsx +34 -0
  231. package/src/components/checkbox/examples/indicator.tsx +54 -0
  232. package/src/components/checkbox/examples/overview.tsx +10 -0
  233. package/src/components/checkbox/examples/sizes.tsx +5 -10
  234. package/src/components/checkbox/examples/states.tsx +42 -23
  235. package/src/components/checkbox/examples/without-label.tsx +3 -7
  236. package/src/components/code-block/COMPONENT.md +55 -57
  237. package/src/components/code-block/examples/color-scheme.tsx +4 -15
  238. package/src/components/code-block/examples/examples.module.css +9 -40
  239. package/src/components/code-block/examples/{long-lines.tsx → narrow.tsx} +3 -4
  240. package/src/components/code-block/examples/overview.tsx +19 -0
  241. package/src/components/code-block/examples/variants.tsx +12 -21
  242. package/src/components/color-picker/COMPONENT.md +196 -165
  243. package/src/components/color-picker/examples/controlled.tsx +37 -0
  244. package/src/components/color-picker/examples/examples.module.css +19 -88
  245. package/src/components/color-picker/examples/formats.tsx +13 -18
  246. package/src/components/color-picker/examples/in-form.tsx +44 -0
  247. package/src/components/color-picker/examples/overview.tsx +37 -0
  248. package/src/components/color-picker/examples/panel.tsx +12 -13
  249. package/src/components/color-picker/examples/presets-sizes.tsx +15 -20
  250. package/src/components/color-picker/examples/presets.tsx +33 -0
  251. package/src/components/color-picker/examples/sizes.tsx +26 -0
  252. package/src/components/color-picker/examples/states.tsx +4 -14
  253. package/src/components/color-picker/examples/validation.tsx +18 -0
  254. package/src/components/color-swatches/COMPONENT.md +145 -0
  255. package/src/components/color-swatches/examples/controlled.tsx +22 -0
  256. package/src/components/color-swatches/examples/examples.module.css +19 -0
  257. package/src/components/color-swatches/examples/in-form.tsx +35 -0
  258. package/src/components/color-swatches/examples/overview.tsx +6 -0
  259. package/src/components/color-swatches/examples/sizes.tsx +19 -0
  260. package/src/components/color-swatches/examples/states.tsx +20 -0
  261. package/src/components/color-swatches/examples/wrapping.tsx +12 -0
  262. package/src/components/command-menu/COMPONENT.md +117 -180
  263. package/src/components/command-menu/examples/controlled-open.tsx +29 -0
  264. package/src/components/command-menu/examples/controlled.tsx +19 -26
  265. package/src/components/command-menu/examples/dismiss.tsx +39 -0
  266. package/src/components/command-menu/examples/overview.tsx +61 -0
  267. package/src/components/command-menu/examples/sizes.tsx +30 -51
  268. package/src/components/command-menu/examples/states.tsx +6 -16
  269. package/src/components/command-menu/examples/structure.tsx +54 -0
  270. package/src/components/crossfade/COMPONENT.md +104 -0
  271. package/src/components/crossfade/examples/examples.module.css +65 -0
  272. package/src/components/crossfade/examples/overview.tsx +102 -0
  273. package/src/components/crossfade/examples/record-switch.tsx +67 -0
  274. package/src/components/data-table/COMPONENT.md +171 -185
  275. package/src/components/data-table/examples/appearance.tsx +31 -34
  276. package/src/components/data-table/examples/content-width.tsx +46 -26
  277. package/src/components/data-table/examples/controlled.tsx +56 -0
  278. package/src/components/data-table/examples/detail-panel.tsx +23 -28
  279. package/src/components/data-table/examples/examples.module.css +20 -91
  280. package/src/components/data-table/examples/infinite-scroll.tsx +17 -18
  281. package/src/components/data-table/examples/narrow.tsx +28 -38
  282. package/src/components/data-table/examples/nested-rows.tsx +32 -54
  283. package/src/components/data-table/examples/numeric.tsx +10 -19
  284. package/src/components/data-table/examples/overview.tsx +54 -0
  285. package/src/components/data-table/examples/selection.tsx +11 -15
  286. package/src/components/data-table/examples/sizes.tsx +22 -33
  287. package/src/components/data-table/examples/states.tsx +23 -24
  288. package/src/components/data-table/examples/sticky.tsx +17 -24
  289. package/src/components/data-table/examples/toolbar.tsx +21 -23
  290. package/src/components/datepicker/COMPONENT.md +152 -164
  291. package/src/components/datepicker/examples/controlled-open.tsx +32 -0
  292. package/src/components/datepicker/examples/controlled.tsx +39 -0
  293. package/src/components/datepicker/examples/examples.module.css +9 -23
  294. package/src/components/datepicker/examples/in-form.tsx +32 -45
  295. package/src/components/datepicker/examples/inline-panel.tsx +3 -3
  296. package/src/components/datepicker/examples/narrow.tsx +1 -1
  297. package/src/components/datepicker/examples/overview.tsx +6 -0
  298. package/src/components/datepicker/examples/range-presets.tsx +6 -5
  299. package/src/components/datepicker/examples/sizes.tsx +7 -10
  300. package/src/components/datepicker/examples/states.tsx +9 -30
  301. package/src/components/datepicker/examples/validation.tsx +26 -0
  302. package/src/components/datepicker/examples/yearless.tsx +9 -8
  303. package/src/components/digit-input/COMPONENT.md +91 -53
  304. package/src/components/digit-input/examples/controlled.tsx +6 -15
  305. package/src/components/digit-input/examples/examples.module.css +9 -42
  306. package/src/components/digit-input/examples/full-width.tsx +13 -0
  307. package/src/components/digit-input/examples/grouped.tsx +11 -0
  308. package/src/components/digit-input/examples/in-form.tsx +35 -0
  309. package/src/components/digit-input/examples/on-complete.tsx +20 -0
  310. package/src/components/digit-input/examples/overview.tsx +6 -0
  311. package/src/components/digit-input/examples/sizes.tsx +5 -17
  312. package/src/components/digit-input/examples/states.tsx +6 -50
  313. package/src/components/digit-input/examples/validation.tsx +17 -0
  314. package/src/components/divider/COMPONENT.md +61 -52
  315. package/src/components/divider/examples/align.tsx +14 -0
  316. package/src/components/divider/examples/examples.module.css +6 -20
  317. package/src/components/divider/examples/or-separator.tsx +19 -0
  318. package/src/components/divider/examples/overview.tsx +30 -0
  319. package/src/components/divider/examples/sizes.tsx +11 -10
  320. package/src/components/divider/examples/vertical.tsx +21 -0
  321. package/src/components/divider/examples/with-icon.tsx +26 -0
  322. package/src/components/dnd/COMPONENT.md +197 -0
  323. package/src/components/dnd/examples/board.tsx +83 -0
  324. package/src/components/dnd/examples/drop-zones.tsx +82 -0
  325. package/src/components/dnd/examples/examples.module.css +89 -0
  326. package/src/components/dnd/examples/handle.tsx +53 -0
  327. package/src/components/dnd/examples/narrow.tsx +42 -0
  328. package/src/components/dnd/examples/overview.tsx +45 -0
  329. package/src/components/drawer/COMPONENT.md +103 -102
  330. package/src/components/drawer/examples/controlled-open.tsx +33 -0
  331. package/src/components/drawer/examples/dismiss.tsx +55 -0
  332. package/src/components/drawer/examples/examples.module.css +3 -24
  333. package/src/components/drawer/examples/in-form.tsx +82 -0
  334. package/src/components/drawer/examples/long-content.tsx +40 -0
  335. package/src/components/drawer/examples/overview.tsx +48 -0
  336. package/src/components/drawer/examples/{variants-sides.tsx → placement.tsx} +10 -13
  337. package/src/components/drawer/examples/sizes.tsx +9 -15
  338. package/src/components/drawer/examples/structure.tsx +35 -0
  339. package/src/components/dropdown/COMPONENT.md +109 -152
  340. package/src/components/dropdown/examples/controlled-open.tsx +32 -0
  341. package/src/components/dropdown/examples/dismiss.tsx +17 -0
  342. package/src/components/dropdown/examples/examples.module.css +11 -45
  343. package/src/components/dropdown/examples/long-list.tsx +42 -0
  344. package/src/components/dropdown/examples/{full-width.tsx → match-trigger-width.tsx} +5 -4
  345. package/src/components/dropdown/examples/overview.tsx +41 -0
  346. package/src/components/dropdown/examples/placement.tsx +16 -13
  347. package/src/components/dropdown/examples/sizes.tsx +18 -15
  348. package/src/components/dropdown/examples/states.tsx +21 -29
  349. package/src/components/dropdown/examples/structure.tsx +56 -0
  350. package/src/components/empty-page/COMPONENT.md +71 -75
  351. package/src/components/empty-page/examples/compact.tsx +23 -0
  352. package/src/components/empty-page/examples/data-region.tsx +8 -11
  353. package/src/components/empty-page/examples/examples.module.css +22 -25
  354. package/src/components/empty-page/examples/icon-tones.tsx +5 -6
  355. package/src/components/empty-page/examples/narrow.tsx +26 -0
  356. package/src/components/empty-page/examples/{no-results.tsx → overview.tsx} +4 -5
  357. package/src/components/empty-page/examples/sizes.tsx +14 -20
  358. package/src/components/example-frame/COMPONENT.md +64 -66
  359. package/src/components/example-frame/examples/controlled.tsx +42 -0
  360. package/src/components/example-frame/examples/overview.tsx +16 -0
  361. package/src/components/file-upload/COMPONENT.md +128 -186
  362. package/src/components/file-upload/examples/avatar-upload.tsx +7 -12
  363. package/src/components/file-upload/examples/custom-body.tsx +44 -0
  364. package/src/components/file-upload/examples/examples.module.css +46 -64
  365. package/src/components/file-upload/examples/in-form.tsx +76 -0
  366. package/src/components/file-upload/examples/narrow.tsx +17 -0
  367. package/src/components/file-upload/examples/overview.tsx +52 -0
  368. package/src/components/file-upload/examples/sizes.tsx +16 -37
  369. package/src/components/file-upload/examples/states.tsx +6 -98
  370. package/src/components/file-upload/examples/upload-progress.tsx +39 -0
  371. package/src/components/file-upload/examples/validation.tsx +19 -0
  372. package/src/components/file-upload/examples/variants.tsx +5 -18
  373. package/src/components/hint/COMPONENT.md +42 -48
  374. package/src/components/hint/examples/examples.module.css +3 -45
  375. package/src/components/hint/examples/hint-or-error.tsx +5 -5
  376. package/src/components/hint/examples/overview.tsx +34 -0
  377. package/src/components/hint/examples/sizes.tsx +8 -10
  378. package/src/components/hint/examples/states.tsx +21 -14
  379. package/src/components/hint/examples/with-icon.tsx +31 -0
  380. package/src/components/input/COMPONENT.md +70 -88
  381. package/src/components/input/examples/affixes.tsx +22 -0
  382. package/src/components/input/examples/controlled.tsx +9 -10
  383. package/src/components/input/examples/examples.module.css +3 -116
  384. package/src/components/input/examples/in-form.tsx +35 -14
  385. package/src/components/input/examples/overview.tsx +12 -0
  386. package/src/components/input/examples/sizes.tsx +6 -11
  387. package/src/components/input/examples/states.tsx +6 -23
  388. package/src/components/input/examples/validation.tsx +35 -0
  389. package/src/components/input/examples/with-icon.tsx +25 -0
  390. package/src/components/input/examples/{search-without-focus-ring.tsx → without-focus-ring.tsx} +5 -5
  391. package/src/components/kbd/COMPONENT.md +50 -65
  392. package/src/components/kbd/examples/examples.module.css +11 -41
  393. package/src/components/kbd/examples/in-controls.tsx +25 -31
  394. package/src/components/kbd/examples/overview.tsx +24 -0
  395. package/src/components/kbd/examples/shortcut-list.tsx +12 -12
  396. package/src/components/kbd/examples/sizes.tsx +8 -13
  397. package/src/components/label/COMPONENT.md +45 -44
  398. package/src/components/label/examples/examples.module.css +8 -29
  399. package/src/components/label/examples/overview.tsx +17 -0
  400. package/src/components/label/examples/sizes.tsx +9 -13
  401. package/src/components/label/examples/states.tsx +17 -14
  402. package/src/components/label/examples/structure.tsx +32 -0
  403. package/src/components/label/examples/with-icon.tsx +25 -17
  404. package/src/components/link-button/COMPONENT.md +56 -39
  405. package/src/components/link-button/examples/as-child.tsx +18 -0
  406. package/src/components/link-button/examples/external-link.tsx +6 -6
  407. package/src/components/link-button/examples/overview.tsx +11 -0
  408. package/src/components/link-button/examples/sizes.tsx +9 -11
  409. package/src/components/link-button/examples/states.tsx +25 -12
  410. package/src/components/link-button/examples/variants.tsx +21 -0
  411. package/src/components/link-button/examples/with-icon.tsx +21 -13
  412. package/src/components/login-form/COMPONENT.md +162 -0
  413. package/src/components/login-form/examples/examples.module.css +39 -0
  414. package/src/components/login-form/examples/forgot-password.tsx +39 -0
  415. package/src/components/login-form/examples/narrow.tsx +32 -0
  416. package/src/components/login-form/examples/overview.tsx +58 -0
  417. package/src/components/login-form/examples/register.tsx +85 -0
  418. package/src/components/login-form/examples/reset-password.tsx +60 -0
  419. package/src/components/login-form/examples/sizes.tsx +38 -0
  420. package/src/components/login-form/examples/states.tsx +75 -0
  421. package/src/components/login-form/examples/structure.tsx +28 -0
  422. package/src/components/login-form/examples/verification-code.tsx +57 -0
  423. package/src/components/modal/COMPONENT.md +64 -84
  424. package/src/components/modal/examples/{controlled.tsx → controlled-open.tsx} +6 -12
  425. package/src/components/modal/examples/custom-container.tsx +29 -0
  426. package/src/components/modal/examples/dismiss.tsx +54 -0
  427. package/src/components/modal/examples/examples.module.css +4 -20
  428. package/src/components/modal/examples/in-form.tsx +78 -0
  429. package/src/components/modal/examples/long-content.tsx +52 -0
  430. package/src/components/modal/examples/overview.tsx +35 -0
  431. package/src/components/modal/examples/sizes.tsx +7 -9
  432. package/src/components/modal/examples/structure.tsx +53 -0
  433. package/src/components/native-select/COMPONENT.md +132 -0
  434. package/src/components/native-select/examples/controlled.tsx +26 -0
  435. package/src/components/native-select/examples/examples.module.css +14 -0
  436. package/src/components/native-select/examples/in-form.tsx +43 -0
  437. package/src/components/native-select/examples/option-groups.tsx +17 -0
  438. package/src/components/native-select/examples/overview.tsx +16 -0
  439. package/src/components/native-select/examples/sizes.tsx +18 -0
  440. package/src/components/native-select/examples/states.tsx +21 -0
  441. package/src/components/native-select/examples/validation.tsx +26 -0
  442. package/src/components/notification/COMPONENT.md +107 -121
  443. package/src/components/notification/examples/dismiss.tsx +50 -0
  444. package/src/components/notification/examples/examples.module.css +10 -23
  445. package/src/components/notification/examples/in-form.tsx +64 -0
  446. package/src/components/notification/examples/overview.tsx +24 -0
  447. package/src/components/notification/examples/placement.tsx +66 -0
  448. package/src/components/notification/examples/sizes.tsx +11 -18
  449. package/src/components/notification/examples/stacking.tsx +45 -0
  450. package/src/components/notification/examples/structure.tsx +20 -0
  451. package/src/components/notification/examples/tones.tsx +14 -26
  452. package/src/components/page-content/COMPONENT.md +49 -74
  453. package/src/components/page-content/examples/examples.module.css +4 -8
  454. package/src/components/page-content/examples/narrow.tsx +25 -0
  455. package/src/components/page-content/examples/overview.tsx +41 -0
  456. package/src/components/page-content/examples/variants.tsx +39 -0
  457. package/src/components/pagination/COMPONENT.md +73 -64
  458. package/src/components/pagination/examples/controlled.tsx +51 -0
  459. package/src/components/pagination/examples/examples.module.css +6 -55
  460. package/src/components/pagination/examples/narrow.tsx +25 -0
  461. package/src/components/pagination/examples/overflow.tsx +23 -0
  462. package/src/components/pagination/examples/overview.tsx +6 -0
  463. package/src/components/pagination/examples/sizes.tsx +10 -18
  464. package/src/components/popover/COMPONENT.md +88 -99
  465. package/src/components/popover/examples/controlled-open.tsx +32 -0
  466. package/src/components/popover/examples/dismiss.tsx +49 -0
  467. package/src/components/popover/examples/examples.module.css +21 -41
  468. package/src/components/popover/examples/flush.tsx +47 -0
  469. package/src/components/popover/examples/in-form.tsx +54 -0
  470. package/src/components/popover/examples/{full-width.tsx → match-trigger-width.tsx} +7 -7
  471. package/src/components/popover/examples/overview.tsx +43 -0
  472. package/src/components/popover/examples/placement.tsx +17 -15
  473. package/src/components/popover/examples/sizes.tsx +12 -9
  474. package/src/components/popover/examples/structure.tsx +50 -0
  475. package/src/components/progress-bar/COMPONENT.md +102 -61
  476. package/src/components/progress-bar/examples/custom-max.tsx +12 -0
  477. package/src/components/progress-bar/examples/examples.module.css +4 -34
  478. package/src/components/progress-bar/examples/overview.tsx +12 -0
  479. package/src/components/progress-bar/examples/segments.tsx +32 -0
  480. package/src/components/progress-bar/examples/sizes.tsx +11 -8
  481. package/src/components/progress-bar/examples/variants.tsx +34 -0
  482. package/src/components/progress-circle/COMPONENT.md +101 -60
  483. package/src/components/progress-circle/examples/examples.module.css +2 -39
  484. package/src/components/progress-circle/examples/inner-content.tsx +35 -0
  485. package/src/components/progress-circle/examples/overview.tsx +10 -0
  486. package/src/components/progress-circle/examples/segments.tsx +64 -0
  487. package/src/components/progress-circle/examples/sizes.tsx +10 -12
  488. package/src/components/progress-circle/examples/variants.tsx +28 -0
  489. package/src/components/radio/COMPONENT.md +93 -114
  490. package/src/components/radio/examples/controlled.tsx +30 -0
  491. package/src/components/radio/examples/group.tsx +23 -0
  492. package/src/components/radio/examples/orientation.tsx +34 -0
  493. package/src/components/radio/examples/overview.tsx +18 -0
  494. package/src/components/radio/examples/sizes.tsx +7 -12
  495. package/src/components/radio/examples/states.tsx +42 -30
  496. package/src/components/scroll-container/COMPONENT.md +56 -28
  497. package/src/components/scroll-container/examples/edge-fade.tsx +53 -0
  498. package/src/components/scroll-container/examples/examples.module.css +7 -7
  499. package/src/components/scroll-container/examples/overscroll.tsx +27 -0
  500. package/src/components/scroll-container/examples/overview.tsx +27 -0
  501. package/src/components/scroll-container/examples/variants.tsx +54 -0
  502. package/src/components/segmented-control/COMPONENT.md +91 -105
  503. package/src/components/segmented-control/examples/colors.tsx +8 -13
  504. package/src/components/segmented-control/examples/controlled.tsx +10 -6
  505. package/src/components/segmented-control/examples/examples.module.css +2 -88
  506. package/src/components/segmented-control/examples/full-width.tsx +7 -44
  507. package/src/components/segmented-control/examples/overview.tsx +12 -0
  508. package/src/components/segmented-control/examples/scroll.tsx +16 -0
  509. package/src/components/segmented-control/examples/sizes.tsx +8 -20
  510. package/src/components/segmented-control/examples/states.tsx +28 -34
  511. package/src/components/segmented-control/examples/two-line.tsx +17 -104
  512. package/src/components/segmented-control/examples/with-icon.tsx +52 -0
  513. package/src/components/select/COMPONENT.md +154 -208
  514. package/src/components/select/examples/clearable.tsx +23 -0
  515. package/src/components/select/examples/controlled-open.tsx +30 -0
  516. package/src/components/select/examples/controlled.tsx +17 -10
  517. package/src/components/select/examples/examples.module.css +18 -38
  518. package/src/components/select/examples/in-form.tsx +59 -70
  519. package/src/components/select/examples/multiple.tsx +21 -33
  520. package/src/components/select/examples/overview.tsx +17 -0
  521. package/src/components/select/examples/rich-options.tsx +43 -69
  522. package/src/components/select/examples/searchable.tsx +42 -0
  523. package/src/components/select/examples/sizes.tsx +13 -17
  524. package/src/components/select/examples/states.tsx +34 -48
  525. package/src/components/select/examples/validation.tsx +41 -0
  526. package/src/components/select/examples/with-icon.tsx +35 -0
  527. package/src/components/skeleton/COMPONENT.md +104 -0
  528. package/src/components/skeleton/examples/examples.module.css +89 -0
  529. package/src/components/skeleton/examples/form.tsx +20 -0
  530. package/src/components/skeleton/examples/overview.tsx +21 -0
  531. package/src/components/skeleton/examples/sizes.tsx +24 -0
  532. package/src/components/skeleton/examples/with-crossfade.tsx +68 -0
  533. package/src/components/slider/COMPONENT.md +105 -68
  534. package/src/components/slider/examples/controlled.tsx +26 -30
  535. package/src/components/slider/examples/examples.module.css +8 -32
  536. package/src/components/slider/examples/hint-and-error.tsx +33 -0
  537. package/src/components/slider/examples/overview.tsx +6 -0
  538. package/src/components/slider/examples/range-step.tsx +7 -17
  539. package/src/components/slider/examples/sizes.tsx +8 -6
  540. package/src/components/slider/examples/states.tsx +11 -8
  541. package/src/components/slider/examples/value-format.tsx +13 -25
  542. package/src/components/slider/examples/variants.tsx +23 -0
  543. package/src/components/smart-filter/COMPONENT.md +182 -0
  544. package/src/components/smart-filter/examples/controlled.tsx +48 -0
  545. package/src/components/smart-filter/examples/examples.module.css +56 -0
  546. package/src/components/smart-filter/examples/many-values.tsx +53 -0
  547. package/src/components/smart-filter/examples/narrow.tsx +38 -0
  548. package/src/components/smart-filter/examples/overview.tsx +109 -0
  549. package/src/components/smart-filter/examples/sizes.tsx +33 -0
  550. package/src/components/spinner/COMPONENT.md +112 -0
  551. package/src/components/spinner/examples/examples.module.css +20 -0
  552. package/src/components/spinner/examples/loading-region.tsx +22 -0
  553. package/src/components/spinner/examples/overview.tsx +15 -0
  554. package/src/components/spinner/examples/sizes.tsx +19 -0
  555. package/src/components/spinner/examples/variants.tsx +19 -0
  556. package/src/components/stepper/COMPONENT.md +83 -78
  557. package/src/components/stepper/examples/controlled.tsx +46 -0
  558. package/src/components/stepper/examples/examples.module.css +9 -40
  559. package/src/components/stepper/examples/narrow.tsx +11 -19
  560. package/src/components/stepper/examples/orientation.tsx +21 -59
  561. package/src/components/stepper/examples/overview.tsx +28 -0
  562. package/src/components/stepper/examples/sizes.tsx +19 -28
  563. package/src/components/stepper/examples/states.tsx +20 -21
  564. package/src/components/stepper/examples/with-icon.tsx +29 -0
  565. package/src/components/switch/COMPONENT.md +75 -94
  566. package/src/components/switch/examples/controlled.tsx +8 -6
  567. package/src/components/switch/examples/examples.module.css +13 -45
  568. package/src/components/switch/examples/in-form.tsx +20 -24
  569. package/src/components/switch/examples/overview.tsx +10 -0
  570. package/src/components/switch/examples/settings-row.tsx +14 -22
  571. package/src/components/switch/examples/sizes.tsx +5 -10
  572. package/src/components/switch/examples/states.tsx +37 -25
  573. package/src/components/tabs/COMPONENT.md +153 -86
  574. package/src/components/tabs/examples/closable.tsx +48 -0
  575. package/src/components/tabs/examples/controlled.tsx +14 -20
  576. package/src/components/tabs/examples/examples.module.css +13 -93
  577. package/src/components/tabs/examples/orientation.tsx +40 -0
  578. package/src/components/tabs/examples/overflow.tsx +60 -0
  579. package/src/components/tabs/examples/overview.tsx +30 -0
  580. package/src/components/tabs/examples/sizes.tsx +19 -19
  581. package/src/components/tabs/examples/states.tsx +20 -55
  582. package/src/components/tabs/examples/two-line.tsx +22 -29
  583. package/src/components/tabs/examples/variants.tsx +40 -0
  584. package/src/components/tabs/examples/with-icon.tsx +44 -0
  585. package/src/components/tag-select/COMPONENT.md +119 -122
  586. package/src/components/tag-select/examples/controlled-open.tsx +29 -0
  587. package/src/components/tag-select/examples/controlled.tsx +26 -0
  588. package/src/components/tag-select/examples/creatable.tsx +28 -0
  589. package/src/components/tag-select/examples/examples.module.css +3 -22
  590. package/src/components/tag-select/examples/in-form.tsx +44 -41
  591. package/src/components/tag-select/examples/manage-tags.tsx +20 -39
  592. package/src/components/tag-select/examples/many-tags.tsx +20 -0
  593. package/src/components/tag-select/examples/overview.tsx +21 -0
  594. package/src/components/tag-select/examples/sizes.tsx +7 -10
  595. package/src/components/tag-select/examples/states.tsx +11 -36
  596. package/src/components/tag-select/examples/validation.tsx +35 -0
  597. package/src/components/textarea/COMPONENT.md +50 -50
  598. package/src/components/textarea/examples/auto-resize.tsx +21 -0
  599. package/src/components/textarea/examples/controlled.tsx +12 -16
  600. package/src/components/textarea/examples/examples.module.css +15 -48
  601. package/src/components/textarea/examples/in-form.tsx +52 -48
  602. package/src/components/textarea/examples/overview.tsx +12 -0
  603. package/src/components/textarea/examples/sizes.tsx +6 -7
  604. package/src/components/textarea/examples/states.tsx +9 -13
  605. package/src/components/textarea/examples/validation.tsx +34 -0
  606. package/src/components/textarea/examples/without-focus-ring.tsx +12 -0
  607. package/src/components/thumbnail/COMPONENT.md +150 -0
  608. package/src/components/thumbnail/examples/examples.module.css +45 -0
  609. package/src/components/thumbnail/examples/full-width.tsx +48 -0
  610. package/src/components/thumbnail/examples/overview.tsx +31 -0
  611. package/src/components/thumbnail/examples/ratios.tsx +25 -0
  612. package/src/components/thumbnail/examples/ring.tsx +29 -0
  613. package/src/components/thumbnail/examples/sizes.tsx +23 -0
  614. package/src/components/thumbnail/examples/states.tsx +38 -0
  615. package/src/components/thumbnail/examples/variants.tsx +28 -0
  616. package/src/components/timeline/COMPONENT.md +92 -203
  617. package/src/components/timeline/examples/examples.module.css +5 -20
  618. package/src/components/timeline/examples/links.tsx +28 -0
  619. package/src/components/timeline/examples/narrow.tsx +30 -38
  620. package/src/components/timeline/examples/{activity-feed.tsx → overview.tsx} +9 -17
  621. package/src/components/timeline/examples/sizes.tsx +22 -28
  622. package/src/components/timeline/examples/{service-history.tsx → structure.tsx} +10 -8
  623. package/src/components/timeline/examples/{colors-and-tones.tsx → variants.tsx} +11 -16
  624. package/src/components/tooltip/COMPONENT.md +74 -62
  625. package/src/components/tooltip/examples/{controlled.tsx → controlled-open.tsx} +5 -7
  626. package/src/components/tooltip/examples/delay.tsx +19 -28
  627. package/src/components/tooltip/examples/disabled-trigger.tsx +18 -0
  628. package/src/components/tooltip/examples/examples.module.css +3 -33
  629. package/src/components/tooltip/examples/long-content.tsx +12 -15
  630. package/src/components/tooltip/examples/overview.tsx +17 -0
  631. package/src/components/tooltip/examples/placement.tsx +30 -0
  632. package/src/components/tooltip/examples/sizes.tsx +12 -15
  633. package/src/components/tooltip/examples/toolbar.tsx +35 -0
  634. package/src/components/typography/COMPONENT.md +68 -99
  635. package/src/components/typography/examples/article.tsx +23 -36
  636. package/src/components/typography/examples/examples.module.css +20 -54
  637. package/src/components/typography/examples/inline-emphasis.tsx +20 -0
  638. package/src/components/typography/examples/overview.tsx +20 -0
  639. package/src/components/typography/examples/semantic-tag.tsx +17 -0
  640. package/src/components/typography/examples/truncate.tsx +7 -7
  641. package/src/components/typography/examples/variants.tsx +43 -42
  642. package/src/components/typography/examples/weights.tsx +31 -0
  643. package/src/layout/app-shell/COMPONENT.md +48 -54
  644. package/src/layout/app-shell/examples/contained.tsx +5 -5
  645. package/src/layout/app-shell/examples/examples.module.css +9 -0
  646. package/src/layout/app-shell/examples/overview.tsx +72 -0
  647. package/src/layout/app-shell/examples/template.tsx +54 -0
  648. package/src/layout/sidebar/COMPONENT.md +302 -110
  649. package/src/layout/sidebar/examples/account.tsx +88 -0
  650. package/src/layout/sidebar/examples/brand-header.tsx +45 -0
  651. package/src/layout/sidebar/examples/collapsible-groups.tsx +77 -0
  652. package/src/layout/sidebar/examples/controlled-open.tsx +55 -0
  653. package/src/layout/sidebar/examples/controlled.tsx +68 -0
  654. package/src/layout/sidebar/examples/examples.module.css +17 -3
  655. package/src/layout/sidebar/examples/nested-items.tsx +74 -0
  656. package/src/layout/sidebar/examples/overview.tsx +126 -0
  657. package/src/layout/sidebar/examples/router.tsx +19 -13
  658. package/src/layout/sidebar/examples/sizes.tsx +17 -12
  659. package/src/layout/sidebar/examples/structure.tsx +81 -0
  660. package/src/styles/fonts.css +4 -0
  661. package/src/styles/globals.css +18 -29
  662. package/src/styles/reset.css +2 -0
  663. package/src/styles/theme-dark.css +3 -0
  664. package/src/styles/theme-light.css +34 -23
  665. package/src/styles/tokens.css +9 -77
  666. package/dist/components/accordion/Accordion.d.ts.map +0 -1
  667. package/dist/components/avatar/Avatar.d.ts.map +0 -1
  668. package/dist/components/badge/Badge.d.ts.map +0 -1
  669. package/dist/components/badge/tier.d.ts.map +0 -1
  670. package/dist/components/banner/Banner.d.ts.map +0 -1
  671. package/dist/components/breadcrumb/Breadcrumb.d.ts.map +0 -1
  672. package/dist/components/button/Button.d.ts.map +0 -1
  673. package/dist/components/button-group/ButtonGroup.d.ts.map +0 -1
  674. package/dist/components/card/Card.d.ts.map +0 -1
  675. package/dist/components/checkbox/Checkbox.d.ts.map +0 -1
  676. package/dist/components/code-block/CodeBlock.d.ts.map +0 -1
  677. package/dist/components/color-picker/ColorPicker.d.ts.map +0 -1
  678. package/dist/components/color-picker/ColorPresets.d.ts.map +0 -1
  679. package/dist/components/command-menu/CommandMenu.d.ts.map +0 -1
  680. package/dist/components/data-table/DataTable.d.ts.map +0 -1
  681. package/dist/components/datepicker/Datepicker.d.ts.map +0 -1
  682. package/dist/components/datepicker/datepickerModel.d.ts.map +0 -1
  683. package/dist/components/digit-input/DigitInput.d.ts.map +0 -1
  684. package/dist/components/divider/Divider.d.ts.map +0 -1
  685. package/dist/components/drawer/Drawer.d.ts.map +0 -1
  686. package/dist/components/dropdown/Dropdown.d.ts.map +0 -1
  687. package/dist/components/dropdown/dropdownGeometry.d.ts +0 -10
  688. package/dist/components/dropdown/dropdownGeometry.d.ts.map +0 -1
  689. package/dist/components/dropdown/menuKeyboard.d.ts +0 -4
  690. package/dist/components/dropdown/menuKeyboard.d.ts.map +0 -1
  691. package/dist/components/dropdown/useDropdownPosition.d.ts +0 -18
  692. package/dist/components/dropdown/useDropdownPosition.d.ts.map +0 -1
  693. package/dist/components/empty-page/EmptyPage.d.ts.map +0 -1
  694. package/dist/components/example-frame/ExampleFrame.d.ts.map +0 -1
  695. package/dist/components/file-upload/FileUpload.d.ts.map +0 -1
  696. package/dist/components/hint/Hint.d.ts.map +0 -1
  697. package/dist/components/index.css +0 -11181
  698. package/dist/components/index.css.map +0 -7
  699. package/dist/components/index.d.ts.map +0 -1
  700. package/dist/components/index.js +0 -13833
  701. package/dist/components/index.js.map +0 -7
  702. package/dist/components/input/Input.d.ts.map +0 -1
  703. package/dist/components/kbd/Kbd.d.ts.map +0 -1
  704. package/dist/components/label/Label.d.ts.map +0 -1
  705. package/dist/components/link-button/LinkButton.d.ts.map +0 -1
  706. package/dist/components/modal/DialogParts.d.ts.map +0 -1
  707. package/dist/components/modal/Modal.d.ts.map +0 -1
  708. package/dist/components/modal/useInertSiblings.d.ts +0 -7
  709. package/dist/components/modal/useInertSiblings.d.ts.map +0 -1
  710. package/dist/components/notification/Notification.d.ts.map +0 -1
  711. package/dist/components/notification/NotificationStore.d.ts.map +0 -1
  712. package/dist/components/page-content/PageContent.d.ts.map +0 -1
  713. package/dist/components/pagination/Pagination.d.ts.map +0 -1
  714. package/dist/components/popover/Popover.d.ts.map +0 -1
  715. package/dist/components/popover/popoverGeometry.d.ts +0 -6
  716. package/dist/components/popover/popoverGeometry.d.ts.map +0 -1
  717. package/dist/components/popover/usePopoverPosition.d.ts +0 -18
  718. package/dist/components/popover/usePopoverPosition.d.ts.map +0 -1
  719. package/dist/components/progress-bar/ProgressBar.d.ts.map +0 -1
  720. package/dist/components/progress-circle/ProgressCircle.d.ts.map +0 -1
  721. package/dist/components/radio/Radio.d.ts.map +0 -1
  722. package/dist/components/scroll-container/ScrollContainer.d.ts.map +0 -1
  723. package/dist/components/segmented-control/SegmentedControl.d.ts.map +0 -1
  724. package/dist/components/segmented-progress-bar/SegmentedProgressBar.d.ts +0 -29
  725. package/dist/components/segmented-progress-bar/SegmentedProgressBar.d.ts.map +0 -1
  726. package/dist/components/select/Select.d.ts.map +0 -1
  727. package/dist/components/select/selectIcons.d.ts +0 -15
  728. package/dist/components/select/selectIcons.d.ts.map +0 -1
  729. package/dist/components/select/selectListbox.d.ts +0 -13
  730. package/dist/components/select/selectListbox.d.ts.map +0 -1
  731. package/dist/components/slider/Slider.d.ts.map +0 -1
  732. package/dist/components/stepper/Stepper.d.ts.map +0 -1
  733. package/dist/components/switch/Switch.d.ts.map +0 -1
  734. package/dist/components/tabs/Tabs.d.ts.map +0 -1
  735. package/dist/components/tag/Tag.d.ts +0 -47
  736. package/dist/components/tag/Tag.d.ts.map +0 -1
  737. package/dist/components/tag-select/TagSelect.d.ts.map +0 -1
  738. package/dist/components/textarea/Textarea.d.ts.map +0 -1
  739. package/dist/components/timeline/Timeline.d.ts.map +0 -1
  740. package/dist/components/tooltip/Tooltip.d.ts.map +0 -1
  741. package/dist/components/typography/Typography.d.ts.map +0 -1
  742. package/dist/hooks/useControllableState.d.ts.map +0 -1
  743. package/dist/hooks/useEscapeKey.d.ts +0 -7
  744. package/dist/hooks/useEscapeKey.d.ts.map +0 -1
  745. package/dist/hooks/useFieldIds.d.ts +0 -17
  746. package/dist/hooks/useFieldIds.d.ts.map +0 -1
  747. package/dist/hooks/useFocusTrap.d.ts +0 -20
  748. package/dist/hooks/useFocusTrap.d.ts.map +0 -1
  749. package/dist/hooks/useMergedRefs.d.ts.map +0 -1
  750. package/dist/hooks/useModalKeyboard.d.ts +0 -14
  751. package/dist/hooks/useModalKeyboard.d.ts.map +0 -1
  752. package/dist/hooks/useOutsideClick.d.ts +0 -26
  753. package/dist/hooks/useOutsideClick.d.ts.map +0 -1
  754. package/dist/hooks/useOverlayModal.d.ts +0 -7
  755. package/dist/hooks/useOverlayModal.d.ts.map +0 -1
  756. package/dist/hooks/usePosition.d.ts.map +0 -1
  757. package/dist/hooks/usePresence.d.ts.map +0 -1
  758. package/dist/hooks/useResponsiveMonths.d.ts +0 -18
  759. package/dist/hooks/useResponsiveMonths.d.ts.map +0 -1
  760. package/dist/hooks/useScrollLock.d.ts.map +0 -1
  761. package/dist/icons/Icon.d.ts.map +0 -1
  762. package/dist/icons/index.d.ts.map +0 -1
  763. package/dist/index.css.map +0 -7
  764. package/dist/index.d.ts.map +0 -1
  765. package/dist/index.js.map +0 -7
  766. package/dist/internal/ControlSizeContext.d.ts.map +0 -1
  767. package/dist/internal/DividerContentContext.d.ts +0 -4
  768. package/dist/internal/DividerContentContext.d.ts.map +0 -1
  769. package/dist/internal/FieldFrame.d.ts.map +0 -1
  770. package/dist/internal/OverlayPortalLayerContext.d.ts +0 -13
  771. package/dist/internal/OverlayPortalLayerContext.d.ts.map +0 -1
  772. package/dist/internal/Portal.d.ts.map +0 -1
  773. package/dist/internal/context.d.ts.map +0 -1
  774. package/dist/internal/cx.d.ts.map +0 -1
  775. package/dist/internal/data-attributes.d.ts.map +0 -1
  776. package/dist/internal/highlightTsxHtml.d.ts.map +0 -1
  777. package/dist/internal/layoutPxFromPrimitives.d.ts.map +0 -1
  778. package/dist/internal/mergeRefs.d.ts.map +0 -1
  779. package/dist/internal/runtimeUnits.d.ts +0 -3
  780. package/dist/internal/runtimeUnits.d.ts.map +0 -1
  781. package/dist/internal/scrollAncestors.d.ts.map +0 -1
  782. package/dist/internal/slot.d.ts.map +0 -1
  783. package/dist/internal/states.d.ts.map +0 -1
  784. package/dist/internal/useFieldDescriptions.d.ts +0 -18
  785. package/dist/internal/useFieldDescriptions.d.ts.map +0 -1
  786. package/dist/layout/app-shell/AppShell.d.ts.map +0 -1
  787. package/dist/layout/index.d.ts.map +0 -1
  788. package/dist/layout/sidebar/Sidebar.d.ts.map +0 -1
  789. package/dist/theme/applyTheme.d.ts.map +0 -1
  790. package/dist/tokens/primitives.d.ts.map +0 -1
  791. package/dist/tokens/semantic.d.ts.map +0 -1
  792. package/dist/tokens/themes/dark.d.ts.map +0 -1
  793. package/dist/tokens/themes/light.d.ts +0 -3
  794. package/dist/tokens/themes/light.d.ts.map +0 -1
  795. package/src/components/accordion/examples/checkout.tsx +0 -73
  796. package/src/components/accordion/examples/layouts.tsx +0 -58
  797. package/src/components/avatar/examples/colors.tsx +0 -29
  798. package/src/components/avatar/examples/group.tsx +0 -35
  799. package/src/components/avatar/examples/team-card.tsx +0 -70
  800. package/src/components/badge/examples/icons.tsx +0 -37
  801. package/src/components/badge/examples/order-list.tsx +0 -48
  802. package/src/components/badge/examples/palette.tsx +0 -44
  803. package/src/components/badge/examples/surfaces.tsx +0 -21
  804. package/src/components/banner/examples/dismiss.tsx +0 -48
  805. package/src/components/banner/examples/placement.tsx +0 -92
  806. package/src/components/breadcrumb/examples/collapse.tsx +0 -56
  807. package/src/components/breadcrumb/examples/page-header.tsx +0 -31
  808. package/src/components/button/examples/composition.tsx +0 -46
  809. package/src/components/button/examples/controlled.tsx +0 -18
  810. package/src/components/button/examples/full-width.tsx +0 -15
  811. package/src/components/button/examples/icon-only.tsx +0 -42
  812. package/src/components/button/examples/surfaces.tsx +0 -18
  813. package/src/components/button/examples/variants-tones.tsx +0 -39
  814. package/src/components/button-group/examples/composition.tsx +0 -99
  815. package/src/components/card/examples/mini-media.tsx +0 -55
  816. package/src/components/card/examples/responsive.tsx +0 -72
  817. package/src/components/checkbox/examples/hint-error.tsx +0 -22
  818. package/src/components/checkbox/examples/select-all.tsx +0 -40
  819. package/src/components/checkbox/examples/settings-card.tsx +0 -76
  820. package/src/components/code-block/examples/api-docs.tsx +0 -31
  821. package/src/components/code-block/examples/controlled.tsx +0 -38
  822. package/src/components/code-block/examples/surfaces.tsx +0 -7
  823. package/src/components/color-picker/examples/brand-color.tsx +0 -73
  824. package/src/components/color-picker/examples/hex-input-sizes.tsx +0 -54
  825. package/src/components/color-picker/examples/presets-quick.tsx +0 -57
  826. package/src/components/color-picker/examples/presets-tags.tsx +0 -52
  827. package/src/components/command-menu/examples/composition.tsx +0 -91
  828. package/src/components/command-menu/examples/examples.module.css +0 -9
  829. package/src/components/command-menu/examples/keyboard-search.tsx +0 -94
  830. package/src/components/data-table/examples/dashboard.tsx +0 -205
  831. package/src/components/data-table/examples/sorting-pagination.tsx +0 -66
  832. package/src/components/datepicker/examples/badge.tsx +0 -19
  833. package/src/components/datepicker/examples/single.tsx +0 -16
  834. package/src/components/digit-input/examples/length-and-complete.tsx +0 -30
  835. package/src/components/digit-input/examples/surfaces.tsx +0 -6
  836. package/src/components/digit-input/examples/verification-step.tsx +0 -62
  837. package/src/components/divider/examples/composition.tsx +0 -49
  838. package/src/components/divider/examples/variants.tsx +0 -62
  839. package/src/components/drawer/examples/composition.tsx +0 -94
  840. package/src/components/drawer/examples/controlled.tsx +0 -42
  841. package/src/components/drawer/examples/features.tsx +0 -48
  842. package/src/components/drawer/examples/states.tsx +0 -54
  843. package/src/components/dropdown/examples/as-child.tsx +0 -23
  844. package/src/components/dropdown/examples/composition.tsx +0 -91
  845. package/src/components/dropdown/examples/controlled.tsx +0 -32
  846. package/src/components/dropdown/examples/row-actions.tsx +0 -56
  847. package/src/components/dropdown/examples/variants.tsx +0 -52
  848. package/src/components/example-frame/examples/basic.tsx +0 -18
  849. package/src/components/file-upload/examples/file-list.tsx +0 -67
  850. package/src/components/file-upload/examples/in-card.tsx +0 -84
  851. package/src/components/hint/examples/field-states.tsx +0 -60
  852. package/src/components/hint/examples/in-form.tsx +0 -45
  853. package/src/components/input/examples/anatomy.tsx +0 -70
  854. package/src/components/input/examples/control-alignment.tsx +0 -57
  855. package/src/components/input/examples/full-width.tsx +0 -23
  856. package/src/components/input/examples/icons-and-affixes.tsx +0 -32
  857. package/src/components/input/examples/reserved-support-row.tsx +0 -33
  858. package/src/components/input/examples/surfaces.tsx +0 -12
  859. package/src/components/input/examples/with-badge.tsx +0 -40
  860. package/src/components/kbd/examples/modifier-keys.tsx +0 -24
  861. package/src/components/label/examples/in-form.tsx +0 -39
  862. package/src/components/label/examples/markers.tsx +0 -27
  863. package/src/components/link-button/examples/composition.tsx +0 -30
  864. package/src/components/link-button/examples/examples.module.css +0 -46
  865. package/src/components/link-button/examples/tones.tsx +0 -15
  866. package/src/components/modal/examples/composition.tsx +0 -87
  867. package/src/components/modal/examples/features.tsx +0 -68
  868. package/src/components/modal/examples/link.tsx +0 -79
  869. package/src/components/modal/examples/states.tsx +0 -73
  870. package/src/components/notification/examples/features.tsx +0 -42
  871. package/src/components/notification/examples/live.tsx +0 -128
  872. package/src/components/notification/examples/save-form.tsx +0 -59
  873. package/src/components/page-content/examples/readable.tsx +0 -24
  874. package/src/components/page-content/examples/settings-page.tsx +0 -49
  875. package/src/components/page-content/examples/widths.tsx +0 -39
  876. package/src/components/pagination/examples/compact.tsx +0 -36
  877. package/src/components/pagination/examples/list-footer.tsx +0 -50
  878. package/src/components/pagination/examples/states.tsx +0 -44
  879. package/src/components/popover/examples/as-child.tsx +0 -29
  880. package/src/components/popover/examples/composition.tsx +0 -45
  881. package/src/components/popover/examples/controlled.tsx +0 -39
  882. package/src/components/popover/examples/features.tsx +0 -56
  883. package/src/components/popover/examples/inset-variants.tsx +0 -58
  884. package/src/components/popover/examples/states.tsx +0 -48
  885. package/src/components/progress-bar/examples/file-upload.tsx +0 -52
  886. package/src/components/progress-bar/examples/values-and-tones.tsx +0 -17
  887. package/src/components/progress-circle/examples/goals-card.tsx +0 -37
  888. package/src/components/progress-circle/examples/values-and-tones.tsx +0 -56
  889. package/src/components/radio/examples/examples.module.css +0 -43
  890. package/src/components/radio/examples/hint-error.tsx +0 -28
  891. package/src/components/radio/examples/horizontal.tsx +0 -33
  892. package/src/components/radio/examples/plan-picker.tsx +0 -55
  893. package/src/components/scroll-container/examples/both-axes.tsx +0 -57
  894. package/src/components/scroll-container/examples/list.tsx +0 -44
  895. package/src/components/segmented-control/examples/item-content.tsx +0 -78
  896. package/src/components/segmented-control/examples/surfaces.tsx +0 -82
  897. package/src/components/segmented-control/examples/toolbar.tsx +0 -56
  898. package/src/components/segmented-progress-bar/COMPONENT.md +0 -128
  899. package/src/components/segmented-progress-bar/examples/examples.module.css +0 -68
  900. package/src/components/segmented-progress-bar/examples/segment-gap.tsx +0 -24
  901. package/src/components/segmented-progress-bar/examples/sizes.tsx +0 -31
  902. package/src/components/segmented-progress-bar/examples/storage-distribution.tsx +0 -41
  903. package/src/components/select/examples/native.tsx +0 -21
  904. package/src/components/select/examples/search-groups.tsx +0 -61
  905. package/src/components/select/examples/with-badge.tsx +0 -47
  906. package/src/components/slider/examples/basic.tsx +0 -6
  907. package/src/components/slider/examples/display-settings.tsx +0 -41
  908. package/src/components/stepper/examples/wizard.tsx +0 -62
  909. package/src/components/switch/examples/notification-settings.tsx +0 -37
  910. package/src/components/switch/examples/on-off.tsx +0 -15
  911. package/src/components/switch/examples/validation.tsx +0 -19
  912. package/src/components/tabs/examples/horizontal.tsx +0 -30
  913. package/src/components/tabs/examples/vertical.tsx +0 -101
  914. package/src/components/tag/COMPONENT.md +0 -179
  915. package/src/components/tag/examples/colors.tsx +0 -49
  916. package/src/components/tag/examples/examples.module.css +0 -47
  917. package/src/components/tag/examples/sizes.tsx +0 -23
  918. package/src/components/tag/examples/states.tsx +0 -19
  919. package/src/components/tag/examples/surfaces.tsx +0 -16
  920. package/src/components/tag/examples/with-icon.tsx +0 -29
  921. package/src/components/textarea/examples/height-and-limits.tsx +0 -45
  922. package/src/components/textarea/examples/hint-and-error.tsx +0 -21
  923. package/src/components/textarea/examples/reserved-support-row.tsx +0 -37
  924. package/src/components/textarea/examples/surfaces.tsx +0 -11
  925. package/src/components/textarea/examples/with-label.tsx +0 -22
  926. package/src/components/timeline/examples/hover-highlight.tsx +0 -48
  927. package/src/components/timeline/examples/in-card.tsx +0 -48
  928. package/src/components/timeline/examples/selectable.tsx +0 -58
  929. package/src/components/tooltip/examples/composition.tsx +0 -37
  930. package/src/components/tooltip/examples/side.tsx +0 -29
  931. package/src/components/tooltip/examples/states.tsx +0 -45
  932. package/src/components/typography/examples/as-prop.tsx +0 -25
  933. package/src/components/typography/examples/composition.tsx +0 -23
  934. package/src/components/typography/examples/full-width.tsx +0 -29
  935. package/src/components/typography/examples/reading-and-form.tsx +0 -35
  936. package/src/components/typography/examples/states.tsx +0 -23
  937. package/src/components/typography/examples/tones.tsx +0 -34
  938. package/src/components/typography/examples/variant-catalog.tsx +0 -41
  939. package/src/layout/app-shell/examples/with-sidebar.tsx +0 -63
  940. package/src/layout/sidebar/examples/modes.tsx +0 -55
  941. package/src/layout/sidebar/examples/responsive.tsx +0 -44
  942. package/src/layout/sidebar/examples/states.tsx +0 -34
@@ -0,0 +1,3239 @@
1
+ // src/internal/ControlSizeContext.tsx
2
+ import * as React from "react";
3
+ import { jsx } from "react/jsx-runtime";
4
+ var ControlSizeContext = React.createContext(null);
5
+ ControlSizeContext.displayName = "ControlSizeContext";
6
+ function ControlSizeProvider({ value, children }) {
7
+ return /* @__PURE__ */ jsx(ControlSizeContext.Provider, { value, children });
8
+ }
9
+ ControlSizeProvider.displayName = "ControlSizeProvider";
10
+ function useOptionalControlSize() {
11
+ return React.useContext(ControlSizeContext) ?? void 0;
12
+ }
13
+ function useControlSize(sizeProp) {
14
+ const host = React.useContext(ControlSizeContext);
15
+ return sizeProp ?? host ?? "m";
16
+ }
17
+
18
+ // src/components/scroll-container/ScrollContainer.tsx
19
+ import * as React3 from "react";
20
+
21
+ // src/hooks/useMergedRefs.ts
22
+ import * as React2 from "react";
23
+
24
+ // src/internal/mergeRefs.ts
25
+ function mergeRefs(...refs) {
26
+ return (value) => {
27
+ for (const ref of refs) {
28
+ if (ref == null) continue;
29
+ if (typeof ref === "function") {
30
+ ref(value);
31
+ } else {
32
+ ref.current = value;
33
+ }
34
+ }
35
+ };
36
+ }
37
+
38
+ // src/hooks/useMergedRefs.ts
39
+ function useMergedRefs(...refs) {
40
+ return React2.useMemo(() => mergeRefs(...refs), refs);
41
+ }
42
+
43
+ // src/internal/cx.ts
44
+ function cx(...classNames) {
45
+ return classNames.filter(Boolean).join(" ");
46
+ }
47
+
48
+ // src/internal/data-attributes.ts
49
+ function toDataAttributes(input) {
50
+ const result = {};
51
+ for (const [key, value] of Object.entries(input)) {
52
+ if (value === void 0) {
53
+ continue;
54
+ }
55
+ const attributeName = `data-${key}`;
56
+ result[attributeName] = typeof value === "boolean" ? String(value) : `${value}`;
57
+ }
58
+ return result;
59
+ }
60
+
61
+ // src/components/scroll-container/ScrollContainer.module.css
62
+ var ScrollContainer_default = {
63
+ root: "ScrollContainer_root",
64
+ vertical: "ScrollContainer_vertical",
65
+ horizontal: "ScrollContainer_horizontal",
66
+ both: "ScrollContainer_both",
67
+ overscrollContain: "ScrollContainer_overscrollContain",
68
+ overscrollNone: "ScrollContainer_overscrollNone",
69
+ scrollbarHidden: "ScrollContainer_scrollbarHidden"
70
+ };
71
+
72
+ // src/components/scroll-container/ScrollContainer.tsx
73
+ import { jsx as jsx2 } from "react/jsx-runtime";
74
+ var axisClass = {
75
+ vertical: ScrollContainer_default.vertical,
76
+ horizontal: ScrollContainer_default.horizontal,
77
+ both: ScrollContainer_default.both
78
+ };
79
+ function useEdgeOverflow(ref, enabled, horizontal) {
80
+ const [overflow, setOverflow] = React3.useState({ start: false, end: false });
81
+ React3.useLayoutEffect(() => {
82
+ const node = ref.current;
83
+ if (!enabled || !node) return;
84
+ const update = () => {
85
+ const position = horizontal ? Math.abs(node.scrollLeft) : node.scrollTop;
86
+ const max = horizontal ? node.scrollWidth - node.clientWidth : node.scrollHeight - node.clientHeight;
87
+ const start = position > 1;
88
+ const end = max - position > 1;
89
+ setOverflow((prev) => prev.start === start && prev.end === end ? prev : { start, end });
90
+ };
91
+ let frame = 0;
92
+ const schedule = () => {
93
+ if (frame) return;
94
+ frame = requestAnimationFrame(() => {
95
+ frame = 0;
96
+ update();
97
+ });
98
+ };
99
+ update();
100
+ node.addEventListener("scroll", schedule, { passive: true });
101
+ const resize = typeof ResizeObserver === "undefined" ? null : new ResizeObserver(schedule);
102
+ const observeChildren = () => {
103
+ for (const child of Array.from(node.children)) resize?.observe(child);
104
+ };
105
+ resize?.observe(node);
106
+ observeChildren();
107
+ const mutation = new MutationObserver(() => {
108
+ observeChildren();
109
+ schedule();
110
+ });
111
+ mutation.observe(node, { childList: true });
112
+ return () => {
113
+ cancelAnimationFrame(frame);
114
+ node.removeEventListener("scroll", schedule);
115
+ resize?.disconnect();
116
+ mutation.disconnect();
117
+ };
118
+ }, [ref, enabled, horizontal]);
119
+ return enabled ? overflow : { start: false, end: false };
120
+ }
121
+ function ScrollContainer({
122
+ as: Component = "div",
123
+ axis = "vertical",
124
+ overscrollBehavior = "contain",
125
+ fade = false,
126
+ scrollbar = "thin",
127
+ className,
128
+ ref,
129
+ ...rest
130
+ }) {
131
+ const innerRef = React3.useRef(null);
132
+ const mergedRef = useMergedRefs(innerRef, ref);
133
+ const horizontal = axis === "horizontal";
134
+ const overflow = useEdgeOverflow(innerRef, fade, horizontal);
135
+ return /* @__PURE__ */ jsx2(
136
+ Component,
137
+ {
138
+ ref: mergedRef,
139
+ className: cx(
140
+ ScrollContainer_default.root,
141
+ axisClass[axis],
142
+ overscrollBehavior === "contain" && ScrollContainer_default.overscrollContain,
143
+ overscrollBehavior === "none" && ScrollContainer_default.overscrollNone,
144
+ scrollbar === "hidden" && ScrollContainer_default.scrollbarHidden,
145
+ className
146
+ ),
147
+ ...toDataAttributes({
148
+ fade: fade ? horizontal ? "horizontal" : "vertical" : void 0,
149
+ "overflow-start": overflow.start || void 0,
150
+ "overflow-end": overflow.end || void 0
151
+ }),
152
+ ...rest
153
+ }
154
+ );
155
+ }
156
+
157
+ // src/internal/iconBox.module.css
158
+ var iconBox_default = {
159
+ box: "iconBox_box",
160
+ xs: "iconBox_xs",
161
+ s: "iconBox_s",
162
+ m: "iconBox_m",
163
+ l: "iconBox_l",
164
+ xl: "iconBox_xl",
165
+ inherit: "iconBox_inherit"
166
+ };
167
+
168
+ // src/internal/iconBox.ts
169
+ function iconBoxClass(size, tier) {
170
+ return cx(iconBox_default.box, iconBox_default[size ?? tier ?? "m"], size === void 0 && iconBox_default.inherit);
171
+ }
172
+
173
+ // src/internal/textTone.module.css
174
+ var textTone_default = {
175
+ tone: "textTone_tone"
176
+ };
177
+
178
+ // src/icons/Icon.module.css
179
+ var Icon_default = {
180
+ root: "Icon_root"
181
+ };
182
+
183
+ // src/icons/registry.ts
184
+ import {
185
+ Activity,
186
+ AlertTriangle,
187
+ ArrowDown,
188
+ ArrowUp,
189
+ ArrowUpDown,
190
+ Bell,
191
+ Bold,
192
+ BookOpen,
193
+ Calendar,
194
+ ChartColumn,
195
+ Check,
196
+ CheckCircle2,
197
+ ChevronDown,
198
+ ChevronLeft,
199
+ ChevronRight,
200
+ ChevronsLeft,
201
+ ChevronsUpDown,
202
+ ChevronUp,
203
+ Circle,
204
+ CloudOff,
205
+ CloudUpload,
206
+ Code2,
207
+ Copy,
208
+ Download,
209
+ ExternalLink,
210
+ Eye,
211
+ EyeOff,
212
+ FileText,
213
+ GripVertical,
214
+ HardDrive,
215
+ House,
216
+ Image,
217
+ Inbox,
218
+ Info,
219
+ Italic,
220
+ KeyRound,
221
+ LayoutDashboard,
222
+ LayoutGrid,
223
+ Link2,
224
+ List,
225
+ ListFilter,
226
+ ListTodo,
227
+ Lock,
228
+ LogIn,
229
+ LogOut,
230
+ Mail,
231
+ MailCheck,
232
+ Menu,
233
+ MessageSquare,
234
+ Minus,
235
+ Monitor,
236
+ Moon,
237
+ MoreHorizontal,
238
+ Package,
239
+ PanelLeftClose,
240
+ PanelLeftOpen,
241
+ Pipette,
242
+ Plus,
243
+ Receipt,
244
+ RefreshCw,
245
+ Rocket,
246
+ Search,
247
+ Send,
248
+ Settings,
249
+ ShoppingCart,
250
+ Smartphone,
251
+ Sun,
252
+ Tablet,
253
+ Trash2,
254
+ Truck,
255
+ Underline,
256
+ UserRound,
257
+ Users,
258
+ Wallet,
259
+ X,
260
+ XCircle
261
+ } from "lucide-react";
262
+ var iconRegistry = {
263
+ "nav.chevronDown": ChevronDown,
264
+ "nav.chevronLeft": ChevronLeft,
265
+ "nav.chevronRight": ChevronRight,
266
+ "nav.chevronUp": ChevronUp,
267
+ "nav.chevronsLeft": ChevronsLeft,
268
+ "nav.chevronsUpDown": ChevronsUpDown,
269
+ "nav.dashboard": LayoutDashboard,
270
+ "nav.home": House,
271
+ "nav.itemDot": Circle,
272
+ "nav.layoutGrid": LayoutGrid,
273
+ "nav.menu": Menu,
274
+ "nav.sidebarCollapse": PanelLeftClose,
275
+ "nav.sidebarExpand": PanelLeftOpen,
276
+ "action.add": Plus,
277
+ "action.check": Check,
278
+ "action.close": X,
279
+ "action.copy": Copy,
280
+ "action.delete": Trash2,
281
+ "action.download": Download,
282
+ "action.drag": GripVertical,
283
+ "action.externalLink": ExternalLink,
284
+ "action.eyedropper": Pipette,
285
+ "action.filter": ListFilter,
286
+ "action.login": LogIn,
287
+ "action.logout": LogOut,
288
+ "action.more": MoreHorizontal,
289
+ "action.refresh": RefreshCw,
290
+ "action.remove": Minus,
291
+ "action.search": Search,
292
+ "action.send": Send,
293
+ "action.settings": Settings,
294
+ "action.upload": CloudUpload,
295
+ "field.calendar": Calendar,
296
+ "field.email": Mail,
297
+ "field.password.show": Eye,
298
+ "field.password.hide": EyeOff,
299
+ "format.bold": Bold,
300
+ "format.italic": Italic,
301
+ "format.link": Link2,
302
+ "format.list": List,
303
+ "format.underline": Underline,
304
+ "object.activity": Activity,
305
+ "object.bell": Bell,
306
+ "object.book": BookOpen,
307
+ "object.cart": ShoppingCart,
308
+ "object.chart": ChartColumn,
309
+ "object.document": FileText,
310
+ "object.image": Image,
311
+ "object.inbox": Inbox,
312
+ "object.key": KeyRound,
313
+ "object.message": MessageSquare,
314
+ "object.package": Package,
315
+ "object.receipt": Receipt,
316
+ "object.rocket": Rocket,
317
+ "object.storage": HardDrive,
318
+ "object.tasks": ListTodo,
319
+ "object.truck": Truck,
320
+ "object.user": UserRound,
321
+ "object.users": Users,
322
+ "object.wallet": Wallet,
323
+ "sort.ascending": ArrowUp,
324
+ "sort.descending": ArrowDown,
325
+ "sort.none": ArrowUpDown,
326
+ "status.danger": XCircle,
327
+ "status.emailSent": MailCheck,
328
+ "status.info": Info,
329
+ "status.locked": Lock,
330
+ "status.offline": CloudOff,
331
+ "status.success": CheckCircle2,
332
+ "status.warning": AlertTriangle,
333
+ "theme.dark": Moon,
334
+ "theme.light": Sun,
335
+ "view.code": Code2,
336
+ "view.preview": Eye,
337
+ "viewport.desktop": Monitor,
338
+ "viewport.mobile": Smartphone,
339
+ "viewport.tablet": Tablet
340
+ };
341
+
342
+ // src/icons/Icon.tsx
343
+ import { jsx as jsx3 } from "react/jsx-runtime";
344
+ function IconSvg({
345
+ glyph: GlyphSvg,
346
+ className,
347
+ size,
348
+ tone = "default",
349
+ strokeWidth = 1.75,
350
+ ...rest
351
+ }) {
352
+ const tier = useOptionalControlSize();
353
+ return /* @__PURE__ */ jsx3(
354
+ GlyphSvg,
355
+ {
356
+ className: cx(Icon_default.root, iconBoxClass(size, tier), textTone_default.tone, className),
357
+ "data-tone": tone === "default" ? void 0 : tone,
358
+ strokeWidth,
359
+ "aria-hidden": "true",
360
+ ...rest
361
+ }
362
+ );
363
+ }
364
+ function Icon({ name, ...rest }) {
365
+ return /* @__PURE__ */ jsx3(IconSvg, { glyph: iconRegistry[name], ...rest });
366
+ }
367
+ function createIcon(glyph) {
368
+ function DomainIcon(props) {
369
+ return /* @__PURE__ */ jsx3(IconSvg, { glyph, ...props });
370
+ }
371
+ DomainIcon.displayName = `Icon(${glyph.displayName ?? "Glyph"})`;
372
+ return DomainIcon;
373
+ }
374
+
375
+ // src/components/spinner/Spinner.tsx
376
+ import * as React4 from "react";
377
+
378
+ // src/internal/VisuallyHidden.module.css
379
+ var VisuallyHidden_default = {
380
+ root: "VisuallyHidden_root"
381
+ };
382
+
383
+ // src/internal/VisuallyHidden.tsx
384
+ import { jsx as jsx4 } from "react/jsx-runtime";
385
+ var visuallyHiddenClass = VisuallyHidden_default.root;
386
+ function VisuallyHidden({ className, ...rest }) {
387
+ return /* @__PURE__ */ jsx4("span", { className: cx(VisuallyHidden_default.root, className), ...rest });
388
+ }
389
+
390
+ // src/components/spinner/Spinner.module.css
391
+ var Spinner_default = {
392
+ root: "Spinner_root",
393
+ ring: "Spinner_ring",
394
+ primeSpinnerTurn: "Spinner_primeSpinnerTurn"
395
+ };
396
+
397
+ // src/components/spinner/Spinner.tsx
398
+ import { jsx as jsx5, jsxs } from "react/jsx-runtime";
399
+ var SPINNER_LABELS = {
400
+ loading: "\u0417\u0430\u0433\u0440\u0443\u0437\u043A\u0430"
401
+ };
402
+ function Spinner({
403
+ size: sizeProp,
404
+ tone = "default",
405
+ labels: labelsProp,
406
+ className,
407
+ ...rest
408
+ }) {
409
+ const controlSize = useOptionalControlSize();
410
+ const labels = React4.useMemo(() => ({ ...SPINNER_LABELS, ...labelsProp }), [labelsProp]);
411
+ const size = sizeProp ?? controlSize ?? "m";
412
+ return /* @__PURE__ */ jsxs(
413
+ "span",
414
+ {
415
+ role: "status",
416
+ className: cx(Spinner_default.root, iconBoxClass(sizeProp, controlSize), textTone_default.tone, className),
417
+ ...toDataAttributes({ size, tone: tone === "default" ? void 0 : tone }),
418
+ ...rest,
419
+ children: [
420
+ /* @__PURE__ */ jsx5("span", { className: Spinner_default.ring, "aria-hidden": "true" }),
421
+ /* @__PURE__ */ jsx5(VisuallyHidden, { children: labels.loading })
422
+ ]
423
+ }
424
+ );
425
+ }
426
+
427
+ // src/internal/fieldSurface.module.css
428
+ var fieldSurface_default = {
429
+ surface: "fieldSurface_surface"
430
+ };
431
+
432
+ // src/internal/fieldTier.module.css
433
+ var fieldTier_default = {
434
+ tier: "fieldTier_tier"
435
+ };
436
+
437
+ // src/internal/fieldTrigger.module.css
438
+ var fieldTrigger_default = {
439
+ trigger: "fieldTrigger_trigger"
440
+ };
441
+
442
+ // src/internal/fieldClasses.ts
443
+ var fieldSurfaceClass = fieldSurface_default.surface;
444
+ var fieldTierClass = fieldTier_default.tier;
445
+ var fieldTriggerClass = `${fieldTier_default.tier} ${fieldSurface_default.surface} ${fieldTrigger_default.trigger}`;
446
+
447
+ // src/internal/iconLayout.ts
448
+ import * as React5 from "react";
449
+ function iconLayout(children, iconType) {
450
+ const content = React5.Children.toArray(children).filter(
451
+ (child) => !(typeof child === "string" && child.trim() === "")
452
+ );
453
+ const isIcon = (child) => React5.isValidElement(child) && child.type === iconType;
454
+ const iconOnly = content.length > 0 && content.every(isIcon);
455
+ return {
456
+ iconOnly,
457
+ leadingIcon: !iconOnly && content.length > 0 && isIcon(content[0]),
458
+ trailingIcon: !iconOnly && content.length > 0 && isIcon(content[content.length - 1])
459
+ };
460
+ }
461
+
462
+ // src/internal/slot.tsx
463
+ import * as React6 from "react";
464
+ import { Fragment, jsx as jsx6 } from "react/jsx-runtime";
465
+ var isPrevented = (event) => typeof event === "object" && event !== null && event.defaultPrevented === true;
466
+ function mergeProps(slotProps, childProps) {
467
+ const merged = { ...slotProps };
468
+ for (const key of Object.keys(childProps)) {
469
+ const slotValue = slotProps[key];
470
+ const childValue = childProps[key];
471
+ if (key === "ref") continue;
472
+ if (key === "className") {
473
+ if (typeof childValue === "function" && typeof slotValue === "string") {
474
+ const slotClass = slotValue;
475
+ merged[key] = (...args) => {
476
+ const resolved = childValue(...args);
477
+ return [slotClass, resolved].filter(Boolean).join(" ") || void 0;
478
+ };
479
+ } else {
480
+ const parts = [slotValue, childValue].filter(Boolean);
481
+ merged[key] = parts.length > 0 ? parts.join(" ") : void 0;
482
+ }
483
+ } else if (key === "style") {
484
+ merged[key] = slotValue != null && childValue != null ? { ...slotValue, ...childValue } : childValue ?? slotValue;
485
+ } else if (key === "aria-describedby" && slotValue && childValue) {
486
+ merged[key] = `${childValue} ${slotValue}`;
487
+ } else if (key.startsWith("on") && typeof slotValue === "function" && typeof childValue === "function") {
488
+ merged[key] = (...args) => {
489
+ childValue(...args);
490
+ if (!isPrevented(args[0])) slotValue(...args);
491
+ };
492
+ } else if (childValue !== void 0) {
493
+ merged[key] = childValue;
494
+ }
495
+ }
496
+ return merged;
497
+ }
498
+ function blockDisabledClick(event) {
499
+ event.preventDefault();
500
+ event.stopPropagation();
501
+ }
502
+ function Slot({ children, ref, ...slotProps }) {
503
+ const child = React6.isValidElement(children) ? children : null;
504
+ const childRef = child?.props.ref ?? void 0;
505
+ const composedRef = useMergedRefs(ref, childRef);
506
+ if (!child) return /* @__PURE__ */ jsx6(Fragment, { children });
507
+ const merged = mergeProps(slotProps, child.props);
508
+ const disabled = slotProps["aria-disabled"] === true || slotProps["aria-disabled"] === "true";
509
+ if (disabled) merged.onClickCapture = blockDisabledClick;
510
+ return React6.cloneElement(child, { ...merged, ref: composedRef });
511
+ }
512
+ Slot.displayName = "Slot";
513
+
514
+ // src/components/button/Button.module.css
515
+ var Button_default = {
516
+ root: "Button_root",
517
+ icon: "Button_icon",
518
+ spinner: "Button_spinner"
519
+ };
520
+
521
+ // src/components/button/Button.tsx
522
+ import { jsx as jsx7, jsxs as jsxs2 } from "react/jsx-runtime";
523
+ function ButtonRoot({
524
+ children,
525
+ className,
526
+ variant = "solid",
527
+ tone = "accent",
528
+ size: sizeProp,
529
+ fullWidth,
530
+ type = "button",
531
+ loading = false,
532
+ disabled,
533
+ asChild = false,
534
+ onClick: onClick2,
535
+ ref,
536
+ ...rest
537
+ }) {
538
+ const size = useControlSize(sizeProp);
539
+ const isDisabled = disabled || loading;
540
+ const layout = iconLayout(children, ButtonIcon);
541
+ const dataAttrs = toDataAttributes({
542
+ variant,
543
+ tone,
544
+ size,
545
+ // `disabled` only: a loading button is busy, not unavailable, and keeps its colors.
546
+ disabled: disabled || void 0,
547
+ loading,
548
+ "full-width": fullWidth,
549
+ "icon-only": layout.iconOnly || void 0,
550
+ "leading-icon": layout.leadingIcon || void 0,
551
+ "trailing-icon": layout.trailingIcon || void 0,
552
+ // Without a leading icon the spinner is centered over the hidden label: width stays put.
553
+ "loading-overlay": loading && !asChild && !layout.leadingIcon && !layout.iconOnly || void 0
554
+ });
555
+ const classes = cx(fieldTierClass, Button_default.root, className);
556
+ if (asChild) {
557
+ return /* @__PURE__ */ jsx7(ControlSizeProvider, { value: size, children: /* @__PURE__ */ jsx7(
558
+ Slot,
559
+ {
560
+ ...rest,
561
+ ref,
562
+ className: classes,
563
+ "aria-disabled": isDisabled || void 0,
564
+ "aria-busy": loading || void 0,
565
+ onClick: isDisabled ? (event) => event.preventDefault() : onClick2,
566
+ ...dataAttrs,
567
+ children
568
+ }
569
+ ) });
570
+ }
571
+ return /* @__PURE__ */ jsx7(
572
+ "button",
573
+ {
574
+ ...rest,
575
+ ref,
576
+ type,
577
+ className: classes,
578
+ disabled: isDisabled,
579
+ "aria-busy": loading || void 0,
580
+ onClick: onClick2,
581
+ ...dataAttrs,
582
+ children: /* @__PURE__ */ jsxs2(ControlSizeProvider, { value: size, children: [
583
+ loading ? /* @__PURE__ */ jsx7(Spinner, { className: Button_default.spinner, "aria-hidden": "true" }) : null,
584
+ children
585
+ ] })
586
+ }
587
+ );
588
+ }
589
+ ButtonRoot.displayName = "Button.Root";
590
+ function ButtonIcon({ children, className, ...rest }) {
591
+ return /* @__PURE__ */ jsx7("span", { className: cx(Button_default.icon, className), "aria-hidden": "true", ...rest, children });
592
+ }
593
+ ButtonIcon.displayName = "Button.Icon";
594
+ var Button = { Root: ButtonRoot, Icon: ButtonIcon };
595
+
596
+ // src/internal/states.ts
597
+ var controlSizes = ["xs", "s", "m", "l", "xl"];
598
+ function stepDown(size, n = 1) {
599
+ return controlSizes[Math.max(0, controlSizes.indexOf(size) - n)] ?? "xs";
600
+ }
601
+ var variants = ["solid", "soft", "outline", "ghost"];
602
+ var tones = ["neutral", "accent", "success", "warning", "danger", "info"];
603
+ var paletteColors = [
604
+ "gray",
605
+ "blue",
606
+ "green",
607
+ "orange",
608
+ "red",
609
+ "yellow",
610
+ "purple",
611
+ "sky",
612
+ "pink",
613
+ "teal"
614
+ ];
615
+ var dataStates = [
616
+ "open",
617
+ "closed",
618
+ "checked",
619
+ "unchecked",
620
+ "indeterminate",
621
+ "active",
622
+ "inactive"
623
+ ];
624
+ var textTones = [
625
+ "default",
626
+ "secondary",
627
+ "muted",
628
+ "accent",
629
+ "success",
630
+ "warning",
631
+ "danger"
632
+ ];
633
+
634
+ // src/internal/enterMotion.module.css
635
+ var enterMotion_default = {
636
+ enter: "enterMotion_enter",
637
+ primeEnter: "enterMotion_primeEnter",
638
+ enterBase: "enterMotion_enterBase",
639
+ enterBaseChildren: "enterMotion_enterBaseChildren"
640
+ };
641
+
642
+ // src/components/hint/Hint.module.css
643
+ var Hint_default = {
644
+ root: "Hint_root",
645
+ icon: "Hint_icon"
646
+ };
647
+
648
+ // src/components/hint/Hint.tsx
649
+ import { jsx as jsx8 } from "react/jsx-runtime";
650
+ function HintRoot({ className, size = "m", invalid, disabled, children, ...rest }) {
651
+ return /* @__PURE__ */ jsx8(ControlSizeProvider, { value: size, children: /* @__PURE__ */ jsx8(
652
+ "p",
653
+ {
654
+ ...rest,
655
+ className: cx(Hint_default.root, invalid && enterMotion_default.enter, className),
656
+ ...toDataAttributes({
657
+ size,
658
+ invalid: invalid || void 0,
659
+ disabled: disabled || void 0
660
+ }),
661
+ children
662
+ }
663
+ ) });
664
+ }
665
+ HintRoot.displayName = "Hint.Root";
666
+ function HintIcon({ className, ...rest }) {
667
+ return /* @__PURE__ */ jsx8("span", { "aria-hidden": "true", className: cx(Hint_default.icon, className), ...rest });
668
+ }
669
+ HintIcon.displayName = "Hint.Icon";
670
+ var Hint = { Root: HintRoot, Icon: HintIcon };
671
+
672
+ // src/components/label/Label.module.css
673
+ var Label_default = {
674
+ root: "Label_root",
675
+ icon: "Label_icon",
676
+ asterisk: "Label_asterisk",
677
+ description: "Label_description",
678
+ optional: "Label_optional"
679
+ };
680
+
681
+ // src/components/label/Label.tsx
682
+ import { jsx as jsx9, jsxs as jsxs3 } from "react/jsx-runtime";
683
+ var LABEL_LABELS = { optional: "\u043D\u0435\u043E\u0431\u044F\u0437\u0430\u0442\u0435\u043B\u044C\u043D\u043E" };
684
+ function LabelRoot({
685
+ className,
686
+ disabled,
687
+ children,
688
+ size: sizeProp,
689
+ required,
690
+ optional,
691
+ labels,
692
+ ref,
693
+ ...rest
694
+ }) {
695
+ const size = useControlSize(sizeProp);
696
+ return (
697
+ // biome-ignore lint/a11y/noLabelWithoutControl: field label primitive; association via htmlFor or wrapping control is caller responsibility
698
+ /* @__PURE__ */ jsx9(
699
+ "label",
700
+ {
701
+ ref,
702
+ className: cx(Label_default.root, className),
703
+ "aria-disabled": disabled || void 0,
704
+ ...rest,
705
+ ...toDataAttributes({ disabled: disabled || void 0, size }),
706
+ children: /* @__PURE__ */ jsxs3(ControlSizeProvider, { value: size, children: [
707
+ children,
708
+ required ? /* @__PURE__ */ jsx9("span", { className: Label_default.asterisk, "aria-hidden": "true", children: "*" }) : null,
709
+ optional ? /* @__PURE__ */ jsx9("span", { className: Label_default.optional, children: labels?.optional ?? LABEL_LABELS.optional }) : null
710
+ ] })
711
+ }
712
+ )
713
+ );
714
+ }
715
+ LabelRoot.displayName = "Label.Root";
716
+ function LabelIcon({ className, ...rest }) {
717
+ return /* @__PURE__ */ jsx9("span", { className: cx(Label_default.icon, className), "aria-hidden": "true", ...rest });
718
+ }
719
+ LabelIcon.displayName = "Label.Icon";
720
+ function LabelDescription({ className, ...rest }) {
721
+ return /* @__PURE__ */ jsx9("span", { className: cx(Label_default.description, className), ...rest });
722
+ }
723
+ LabelDescription.displayName = "Label.Description";
724
+ var Label = {
725
+ Root: LabelRoot,
726
+ Icon: LabelIcon,
727
+ Description: LabelDescription
728
+ };
729
+
730
+ // src/components/checkbox/Checkbox.tsx
731
+ import * as React9 from "react";
732
+
733
+ // src/hooks/useControllableState.ts
734
+ import * as React7 from "react";
735
+ function useControllableState({
736
+ value,
737
+ defaultValue,
738
+ onChange
739
+ }) {
740
+ const [internalValue, setInternalValue] = React7.useState(defaultValue);
741
+ const isControlled = value !== void 0;
742
+ const currentValue = isControlled ? value : internalValue;
743
+ const currentValueRef = React7.useRef(currentValue);
744
+ currentValueRef.current = currentValue;
745
+ const setValue = React7.useCallback(
746
+ (nextValue) => {
747
+ const previousValue = currentValueRef.current;
748
+ const computedValue = typeof nextValue === "function" ? nextValue(previousValue) : nextValue;
749
+ if (Object.is(previousValue, computedValue)) {
750
+ return;
751
+ }
752
+ currentValueRef.current = computedValue;
753
+ if (!isControlled) {
754
+ setInternalValue(computedValue);
755
+ }
756
+ onChange?.(computedValue);
757
+ },
758
+ [isControlled, onChange]
759
+ );
760
+ return [currentValue, setValue];
761
+ }
762
+
763
+ // src/internal/ChoiceField.module.css
764
+ var ChoiceField_default = {
765
+ tier: "ChoiceField_tier",
766
+ field: "ChoiceField_field",
767
+ row: "ChoiceField_row",
768
+ controlCell: "ChoiceField_controlCell",
769
+ input: "ChoiceField_input",
770
+ text: "ChoiceField_text",
771
+ support: "ChoiceField_support",
772
+ visual: "ChoiceField_visual"
773
+ };
774
+
775
+ // src/internal/ChoiceField.tsx
776
+ import { jsx as jsx10, jsxs as jsxs4 } from "react/jsx-runtime";
777
+ var choiceInputClass = ChoiceField_default.input;
778
+ var choiceVisualClass = ChoiceField_default.visual;
779
+ var choiceTierClass = ChoiceField_default.tier;
780
+ function ChoiceField({
781
+ ids,
782
+ size,
783
+ state,
784
+ disabled,
785
+ readOnly = false,
786
+ hint,
787
+ error,
788
+ control,
789
+ className,
790
+ children
791
+ }) {
792
+ return /* @__PURE__ */ jsx10(ControlSizeProvider, { value: size, children: /* @__PURE__ */ jsxs4(
793
+ "div",
794
+ {
795
+ className: cx(ChoiceField_default.tier, ChoiceField_default.field, className),
796
+ ...toDataAttributes({
797
+ size,
798
+ state,
799
+ invalid: ids.invalid || void 0,
800
+ disabled: disabled || void 0,
801
+ readonly: readOnly || void 0
802
+ }),
803
+ children: [
804
+ /* @__PURE__ */ jsxs4("label", { htmlFor: ids.controlId, className: ChoiceField_default.row, children: [
805
+ /* @__PURE__ */ jsx10("span", { className: ChoiceField_default.controlCell, children: control }),
806
+ children
807
+ ] }),
808
+ ids.showError ? /* @__PURE__ */ jsx10(Hint.Root, { id: ids.errorId, size, invalid: true, className: ChoiceField_default.support, children: error }) : ids.showHint ? /* @__PURE__ */ jsx10(Hint.Root, { id: ids.hintId, size, disabled, className: ChoiceField_default.support, children: hint }) : null
809
+ ]
810
+ }
811
+ ) });
812
+ }
813
+ function ChoiceLabel({ className, ...rest }) {
814
+ return /* @__PURE__ */ jsx10("span", { className: cx(ChoiceField_default.text, className), ...rest });
815
+ }
816
+
817
+ // src/internal/FieldFrame.tsx
818
+ import * as React8 from "react";
819
+
820
+ // src/internal/formatLabel.ts
821
+ function formatLabel(template, values) {
822
+ return template.replace(
823
+ /\{(\w+)\}/g,
824
+ (_, name) => Object.hasOwn(values, name) ? String(values[name] ?? "") : ""
825
+ ).trim();
826
+ }
827
+
828
+ // src/internal/FieldFrame.module.css
829
+ var FieldFrame_default = {
830
+ root: "FieldFrame_root",
831
+ label: "FieldFrame_label",
832
+ labelRow: "FieldFrame_labelRow",
833
+ labelEnd: "FieldFrame_labelEnd",
834
+ body: "FieldFrame_body",
835
+ supportText: "FieldFrame_supportText",
836
+ support: "FieldFrame_support",
837
+ counter: "FieldFrame_counter"
838
+ };
839
+
840
+ // src/internal/FieldFrame.tsx
841
+ import { jsx as jsx11, jsxs as jsxs5 } from "react/jsx-runtime";
842
+ function hasContent(node) {
843
+ return node != null && node !== false && node !== "";
844
+ }
845
+ function useFieldFrame(explicitId, {
846
+ label,
847
+ hint,
848
+ error,
849
+ invalid
850
+ }, ariaDescribedBy) {
851
+ const generated = React8.useId();
852
+ const controlId = explicitId ?? generated;
853
+ const labelId = `${controlId}-label`;
854
+ const hintId = `${controlId}-hint`;
855
+ const errorId = `${controlId}-error`;
856
+ const showError = hasContent(error);
857
+ const showHint = !showError && hasContent(hint);
858
+ const describedBy = [ariaDescribedBy, showHint ? hintId : void 0, showError ? errorId : void 0].filter(Boolean).join(" ") || void 0;
859
+ return {
860
+ controlId,
861
+ labelId,
862
+ hintId,
863
+ errorId,
864
+ describedBy,
865
+ labelledBy: hasContent(label) ? labelId : void 0,
866
+ showHint,
867
+ showError,
868
+ invalid: Boolean(invalid) || showError
869
+ };
870
+ }
871
+ function FieldFrame({
872
+ size,
873
+ ids,
874
+ label,
875
+ required,
876
+ optional,
877
+ hint,
878
+ error,
879
+ disabled,
880
+ optionalLabel,
881
+ group = false,
882
+ labelEnd,
883
+ counter,
884
+ reserveSupportRow = false,
885
+ className,
886
+ children,
887
+ ...rest
888
+ }) {
889
+ const { showError, showHint } = ids;
890
+ const showSupport = showError || showHint || counter != null || reserveSupportRow;
891
+ const labelNode = hasContent(label) ? /* @__PURE__ */ jsx11(
892
+ Label.Root,
893
+ {
894
+ id: ids.labelId,
895
+ htmlFor: group ? void 0 : ids.controlId,
896
+ size,
897
+ required,
898
+ optional,
899
+ disabled,
900
+ labels: { optional: optionalLabel },
901
+ className: FieldFrame_default.label,
902
+ children: label
903
+ }
904
+ ) : null;
905
+ return /* @__PURE__ */ jsxs5(
906
+ "div",
907
+ {
908
+ ...rest,
909
+ className: cx(FieldFrame_default.root, className),
910
+ ...toDataAttributes({
911
+ size,
912
+ invalid: ids.invalid || void 0,
913
+ disabled: disabled || void 0
914
+ }),
915
+ children: [
916
+ labelEnd != null ? /* @__PURE__ */ jsxs5("div", { className: FieldFrame_default.labelRow, children: [
917
+ labelNode,
918
+ /* @__PURE__ */ jsx11("span", { className: FieldFrame_default.labelEnd, children: labelEnd })
919
+ ] }) : labelNode,
920
+ /* @__PURE__ */ jsxs5("div", { className: FieldFrame_default.body, children: [
921
+ children,
922
+ showSupport ? /* @__PURE__ */ jsxs5(
923
+ "div",
924
+ {
925
+ className: FieldFrame_default.support,
926
+ ...toDataAttributes({ size, reserve: reserveSupportRow || void 0 }),
927
+ children: [
928
+ showError ? /* @__PURE__ */ jsx11(Hint.Root, { id: ids.errorId, size, invalid: true, className: FieldFrame_default.supportText, children: error }) : showHint ? /* @__PURE__ */ jsx11(
929
+ Hint.Root,
930
+ {
931
+ id: ids.hintId,
932
+ size,
933
+ disabled,
934
+ className: FieldFrame_default.supportText,
935
+ children: hint
936
+ }
937
+ ) : /* @__PURE__ */ jsx11("span", { className: FieldFrame_default.supportText }),
938
+ counter
939
+ ]
940
+ }
941
+ ) : null
942
+ ] })
943
+ ]
944
+ }
945
+ );
946
+ }
947
+ function FieldCounter({ current, max, size, label, className, ...rest }) {
948
+ return /* @__PURE__ */ jsxs5(
949
+ "span",
950
+ {
951
+ ...rest,
952
+ className: cx(FieldFrame_default.counter, className),
953
+ "data-size": size,
954
+ "data-invalid": current > max || void 0,
955
+ "aria-live": "polite",
956
+ children: [
957
+ /* @__PURE__ */ jsxs5("span", { "aria-hidden": "true", children: [
958
+ current,
959
+ "/",
960
+ max
961
+ ] }),
962
+ /* @__PURE__ */ jsx11(VisuallyHidden, { children: formatLabel(label, { current, max }) })
963
+ ]
964
+ }
965
+ );
966
+ }
967
+
968
+ // src/components/checkbox/Checkbox.module.css
969
+ var Checkbox_default = {
970
+ root: "Checkbox_root",
971
+ indicator: "Checkbox_indicator",
972
+ control: "Checkbox_control",
973
+ svg: "Checkbox_svg",
974
+ checkPath: "Checkbox_checkPath",
975
+ indeterminateLine: "Checkbox_indeterminateLine"
976
+ };
977
+
978
+ // src/components/checkbox/Checkbox.tsx
979
+ import { Fragment as Fragment2, jsx as jsx12, jsxs as jsxs6 } from "react/jsx-runtime";
980
+ function CheckboxMark() {
981
+ return /* @__PURE__ */ jsxs6("svg", { viewBox: "0 0 24 24", className: Checkbox_default.svg, "aria-hidden": "true", focusable: "false", children: [
982
+ /* @__PURE__ */ jsx12("path", { d: "M5.5 12.5l4.25 4.25L18.5 8", pathLength: 1, className: Checkbox_default.checkPath }),
983
+ /* @__PURE__ */ jsx12("path", { d: "M7 12h10", pathLength: 1, className: Checkbox_default.indeterminateLine })
984
+ ] });
985
+ }
986
+ function CheckboxRoot({
987
+ id,
988
+ checked: checkedProp,
989
+ defaultChecked = false,
990
+ onCheckedChange,
991
+ indeterminate = false,
992
+ invalid,
993
+ hint,
994
+ error,
995
+ size: sizeProp,
996
+ disabled = false,
997
+ readOnly = false,
998
+ className,
999
+ "aria-describedby": ariaDescribedBy,
1000
+ children,
1001
+ ref,
1002
+ ...inputRest
1003
+ }) {
1004
+ const size = useControlSize(sizeProp);
1005
+ const ids = useFieldFrame(id, { hint, error, invalid }, ariaDescribedBy);
1006
+ const [checked, setChecked] = useControllableState({
1007
+ value: checkedProp,
1008
+ defaultValue: defaultChecked,
1009
+ onChange: onCheckedChange
1010
+ });
1011
+ const internalRef = React9.useRef(null);
1012
+ const mergedRef = useMergedRefs(internalRef, ref);
1013
+ React9.useEffect(() => {
1014
+ if (internalRef.current) internalRef.current.indeterminate = indeterminate;
1015
+ }, [indeterminate]);
1016
+ return /* @__PURE__ */ jsx12(
1017
+ ChoiceField,
1018
+ {
1019
+ ids,
1020
+ size,
1021
+ state: indeterminate ? "indeterminate" : checked ? "checked" : "unchecked",
1022
+ disabled,
1023
+ readOnly,
1024
+ hint,
1025
+ error,
1026
+ className: cx(Checkbox_default.root, className),
1027
+ control: /* @__PURE__ */ jsxs6(Fragment2, { children: [
1028
+ /* @__PURE__ */ jsx12(
1029
+ "input",
1030
+ {
1031
+ ...inputRest,
1032
+ ref: mergedRef,
1033
+ id: ids.controlId,
1034
+ type: "checkbox",
1035
+ className: choiceInputClass,
1036
+ disabled,
1037
+ checked,
1038
+ onChange: (event) => {
1039
+ if (!readOnly) setChecked(event.target.checked);
1040
+ },
1041
+ "aria-invalid": ids.invalid || void 0,
1042
+ "aria-readonly": readOnly || void 0,
1043
+ "aria-describedby": ids.describedBy
1044
+ }
1045
+ ),
1046
+ /* @__PURE__ */ jsx12("span", { className: cx(choiceVisualClass, Checkbox_default.control), "aria-hidden": "true", children: /* @__PURE__ */ jsx12(CheckboxMark, {}) })
1047
+ ] }),
1048
+ children
1049
+ }
1050
+ );
1051
+ }
1052
+ CheckboxRoot.displayName = "Checkbox.Root";
1053
+ function CheckboxLabel(props) {
1054
+ return /* @__PURE__ */ jsx12(ChoiceLabel, { ...props });
1055
+ }
1056
+ CheckboxLabel.displayName = "Checkbox.Label";
1057
+ function CheckboxIndicator({
1058
+ checked = false,
1059
+ indeterminate = false,
1060
+ disabled = false,
1061
+ size: sizeProp,
1062
+ className,
1063
+ ...rest
1064
+ }) {
1065
+ const size = useControlSize(sizeProp);
1066
+ return /* @__PURE__ */ jsx12(
1067
+ "span",
1068
+ {
1069
+ "aria-hidden": "true",
1070
+ className: cx(
1071
+ choiceTierClass,
1072
+ choiceVisualClass,
1073
+ Checkbox_default.control,
1074
+ Checkbox_default.indicator,
1075
+ className
1076
+ ),
1077
+ ...toDataAttributes({
1078
+ size,
1079
+ state: indeterminate ? "indeterminate" : checked ? "checked" : "unchecked",
1080
+ disabled: disabled || void 0
1081
+ }),
1082
+ ...rest,
1083
+ children: /* @__PURE__ */ jsx12(CheckboxMark, {})
1084
+ }
1085
+ );
1086
+ }
1087
+ CheckboxIndicator.displayName = "Checkbox.Indicator";
1088
+ var Checkbox = {
1089
+ Root: CheckboxRoot,
1090
+ Label: CheckboxLabel,
1091
+ Indicator: CheckboxIndicator
1092
+ };
1093
+
1094
+ // src/internal/swatch.tsx
1095
+ import * as React10 from "react";
1096
+
1097
+ // src/internal/swatch.module.css
1098
+ var swatch_default = {
1099
+ fill: "swatch_fill",
1100
+ checker: "swatch_checker",
1101
+ tier: "swatch_tier",
1102
+ chip: "swatch_chip",
1103
+ swatch: "swatch_swatch",
1104
+ check: "swatch_check"
1105
+ };
1106
+
1107
+ // src/internal/swatch.tsx
1108
+ import { Fragment as Fragment3, jsx as jsx13, jsxs as jsxs7 } from "react/jsx-runtime";
1109
+ var COLOR_PRESETS = [
1110
+ { value: "#ef4444", label: "\u041A\u0440\u0430\u0441\u043D\u044B\u0439" },
1111
+ { value: "#f97316", label: "\u041E\u0440\u0430\u043D\u0436\u0435\u0432\u044B\u0439" },
1112
+ { value: "#eab308", label: "\u0416\u0451\u043B\u0442\u044B\u0439" },
1113
+ { value: "#22c55e", label: "\u0417\u0435\u043B\u0451\u043D\u044B\u0439" },
1114
+ { value: "#14b8a6", label: "\u0411\u0438\u0440\u044E\u0437\u043E\u0432\u044B\u0439" },
1115
+ { value: "#5068f5", label: "\u0421\u0438\u043D\u0438\u0439" },
1116
+ { value: "#a855f7", label: "\u0424\u0438\u043E\u043B\u0435\u0442\u043E\u0432\u044B\u0439" },
1117
+ { value: "#ec4899", label: "\u0420\u043E\u0437\u043E\u0432\u044B\u0439" },
1118
+ { value: "#b91c1c", label: "\u0422\u0451\u043C\u043D\u043E-\u043A\u0440\u0430\u0441\u043D\u044B\u0439" },
1119
+ { value: "#c2410c", label: "\u0422\u0451\u043C\u043D\u043E-\u043E\u0440\u0430\u043D\u0436\u0435\u0432\u044B\u0439" },
1120
+ { value: "#a16207", label: "\u0413\u043E\u0440\u0447\u0438\u0447\u043D\u044B\u0439" },
1121
+ { value: "#15803d", label: "\u0422\u0451\u043C\u043D\u043E-\u0437\u0435\u043B\u0451\u043D\u044B\u0439" },
1122
+ { value: "#0f766e", label: "\u0422\u0451\u043C\u043D\u043E-\u0431\u0438\u0440\u044E\u0437\u043E\u0432\u044B\u0439" },
1123
+ { value: "#2f4ae0", label: "\u0422\u0451\u043C\u043D\u043E-\u0441\u0438\u043D\u0438\u0439" },
1124
+ { value: "#7e22ce", label: "\u0422\u0451\u043C\u043D\u043E-\u0444\u0438\u043E\u043B\u0435\u0442\u043E\u0432\u044B\u0439" },
1125
+ { value: "#be185d", label: "\u0422\u0451\u043C\u043D\u043E-\u0440\u043E\u0437\u043E\u0432\u044B\u0439" }
1126
+ ];
1127
+ function useSwatchOptions(presets, allowEmpty, emptyLabel) {
1128
+ return React10.useMemo(
1129
+ () => [
1130
+ ...presets.map((preset) => ({ ...preset, contrast: markContrast(preset.value) })),
1131
+ ...allowEmpty ? [{ value: null, label: emptyLabel, contrast: "dark" }] : []
1132
+ ],
1133
+ [presets, allowEmpty, emptyLabel]
1134
+ );
1135
+ }
1136
+ var swatchClass = swatch_default.swatch;
1137
+ var swatchTierClass = swatch_default.tier;
1138
+ function SwatchFill({ value }) {
1139
+ if (value == null) return /* @__PURE__ */ jsx13("span", { "aria-hidden": true, className: swatch_default.checker });
1140
+ return /* @__PURE__ */ jsx13("svg", { className: swatch_default.fill, "aria-hidden": "true", viewBox: "0 0 1 1", preserveAspectRatio: "none", children: /* @__PURE__ */ jsx13("rect", { width: "1", height: "1", fill: value }) });
1141
+ }
1142
+ function SwatchContent({ value, selected }) {
1143
+ return /* @__PURE__ */ jsxs7(Fragment3, { children: [
1144
+ /* @__PURE__ */ jsx13(SwatchFill, { value }),
1145
+ selected ? /* @__PURE__ */ jsx13(Icon, { name: "action.check", strokeWidth: 3, className: swatch_default.check }) : null
1146
+ ] });
1147
+ }
1148
+ function SwatchChip({ value, className, ...rest }) {
1149
+ return /* @__PURE__ */ jsx13("span", { ...rest, "aria-hidden": true, className: cx(swatch_default.chip, className), children: /* @__PURE__ */ jsx13(SwatchFill, { value }) });
1150
+ }
1151
+ function sameColor(a, b) {
1152
+ return (a ?? "").trim().toLowerCase() === (b ?? "").trim().toLowerCase();
1153
+ }
1154
+ function colorToRgb(value) {
1155
+ const input = value.trim().toLowerCase();
1156
+ const hex = /^#([0-9a-f]{3,4}|[0-9a-f]{6}|[0-9a-f]{8})$/.exec(input)?.[1];
1157
+ if (hex) {
1158
+ const full = hex.length <= 4 ? [...hex].map((c) => c + c).join("") : hex;
1159
+ return [0, 2, 4].map((i) => Number.parseInt(full.slice(i, i + 2), 16));
1160
+ }
1161
+ const fn = /^(rgba?|hsla?)\(([^)]+)\)$/.exec(input);
1162
+ if (!fn) return null;
1163
+ const parts = fn[2].split(/[\s,/]+/).filter(Boolean);
1164
+ if (parts.length < 3) return null;
1165
+ const num = (part, scale) => part.endsWith("%") ? Number.parseFloat(part) / 100 * scale : Number.parseFloat(part);
1166
+ if (fn[1].startsWith("rgb")) {
1167
+ const rgb = parts.slice(0, 3).map((part) => num(part, 255));
1168
+ return rgb.every(Number.isFinite) ? rgb : null;
1169
+ }
1170
+ const h = Number.parseFloat(parts[0]);
1171
+ const s = num(parts[1], 1);
1172
+ const l = num(parts[2], 1);
1173
+ if (![h, s, l].every(Number.isFinite)) return null;
1174
+ const a = s * Math.min(l, 1 - l);
1175
+ const channel = (n) => {
1176
+ const k = (n + h / 30) % 12;
1177
+ return 255 * (l - a * Math.max(-1, Math.min(k - 3, 9 - k, 1)));
1178
+ };
1179
+ return [channel(0), channel(8), channel(4)];
1180
+ }
1181
+ function markContrast(value) {
1182
+ const rgb = colorToRgb(value);
1183
+ if (!rgb) return "dark";
1184
+ const lin = (c) => {
1185
+ const s = c / 255;
1186
+ return s <= 0.03928 ? s / 12.92 : ((s + 0.055) / 1.055) ** 2.4;
1187
+ };
1188
+ const l = 0.2126 * lin(rgb[0]) + 0.7152 * lin(rgb[1]) + 0.0722 * lin(rgb[2]);
1189
+ return l > 0.179 ? "dark" : "light";
1190
+ }
1191
+
1192
+ // src/components/color-swatches/ColorSwatches.tsx
1193
+ import * as React11 from "react";
1194
+
1195
+ // src/internal/rovingFocus.ts
1196
+ var PREV = {
1197
+ horizontal: ["ArrowLeft"],
1198
+ vertical: ["ArrowUp"],
1199
+ both: ["ArrowLeft", "ArrowUp"]
1200
+ };
1201
+ var NEXT = {
1202
+ horizontal: ["ArrowRight"],
1203
+ vertical: ["ArrowDown"],
1204
+ both: ["ArrowRight", "ArrowDown"]
1205
+ };
1206
+ function rovingIndex(key, index, count, orientation = "both") {
1207
+ if (count <= 0) return null;
1208
+ if (key === "Home") return 0;
1209
+ if (key === "End") return count - 1;
1210
+ if (NEXT[orientation].includes(key)) return index < 0 ? 0 : (index + 1) % count;
1211
+ if (PREV[orientation].includes(key)) return index < 0 ? count - 1 : (index - 1 + count) % count;
1212
+ return null;
1213
+ }
1214
+ function gridIndex(key, index, count, columns) {
1215
+ if (count <= 0) return null;
1216
+ const from = Math.min(Math.max(index, 0), count - 1);
1217
+ const step = Math.max(1, columns);
1218
+ switch (key) {
1219
+ case "ArrowRight":
1220
+ return Math.min(from + 1, count - 1);
1221
+ case "ArrowLeft":
1222
+ return Math.max(from - 1, 0);
1223
+ case "ArrowDown":
1224
+ return from + step < count ? from + step : from;
1225
+ case "ArrowUp":
1226
+ return from - step >= 0 ? from - step : from;
1227
+ case "Home":
1228
+ return 0;
1229
+ case "End":
1230
+ return count - 1;
1231
+ default:
1232
+ return null;
1233
+ }
1234
+ }
1235
+
1236
+ // src/components/color-swatches/ColorSwatches.module.css
1237
+ var ColorSwatches_default = {
1238
+ grid: "ColorSwatches_grid"
1239
+ };
1240
+
1241
+ // src/components/color-swatches/ColorSwatches.tsx
1242
+ import { jsx as jsx14, jsxs as jsxs8 } from "react/jsx-runtime";
1243
+ var COLOR_SWATCHES_LABELS = {
1244
+ group: "\u0426\u0432\u0435\u0442",
1245
+ empty: "\u0411\u0435\u0437 \u0446\u0432\u0435\u0442\u0430",
1246
+ optional: "\u043D\u0435\u043E\u0431\u044F\u0437\u0430\u0442\u0435\u043B\u044C\u043D\u043E"
1247
+ };
1248
+ function columnsOf(items) {
1249
+ const top = items[0]?.offsetTop;
1250
+ const count = items.findIndex((item) => !item || item.offsetTop !== top);
1251
+ return Math.max(1, count === -1 ? items.length : count);
1252
+ }
1253
+ function ColorSwatches({
1254
+ value: valueProp,
1255
+ defaultValue = null,
1256
+ onValueChange,
1257
+ presets = COLOR_PRESETS,
1258
+ size: sizeProp,
1259
+ disabled = false,
1260
+ invalid,
1261
+ allowEmpty = false,
1262
+ name,
1263
+ id,
1264
+ className,
1265
+ label,
1266
+ required,
1267
+ optional,
1268
+ hint,
1269
+ error,
1270
+ "aria-label": ariaLabel,
1271
+ "aria-labelledby": ariaLabelledBy,
1272
+ "aria-describedby": ariaDescribedBy,
1273
+ labels: labelsProp,
1274
+ ...rest
1275
+ }) {
1276
+ const size = useControlSize(sizeProp);
1277
+ const labels = { ...COLOR_SWATCHES_LABELS, ...labelsProp };
1278
+ const [value, setValue] = useControllableState({
1279
+ value: valueProp,
1280
+ defaultValue,
1281
+ onChange: onValueChange
1282
+ });
1283
+ const ids = useFieldFrame(id, { label, hint, error, invalid }, ariaDescribedBy);
1284
+ const options = useSwatchOptions(presets, allowEmpty, labels.empty);
1285
+ const selectedIndex = options.findIndex((option) => sameColor(option.value, value));
1286
+ const focusIndex = Math.max(0, selectedIndex);
1287
+ const itemRefs = React11.useRef([]);
1288
+ const labelledBy = ariaLabelledBy ?? ids.labelledBy;
1289
+ const onKeyDown2 = (event) => {
1290
+ const current = itemRefs.current.indexOf(document.activeElement);
1291
+ const next = gridIndex(
1292
+ event.key,
1293
+ current === -1 ? focusIndex : current,
1294
+ options.length,
1295
+ columnsOf(itemRefs.current)
1296
+ );
1297
+ if (next === null) return;
1298
+ event.preventDefault();
1299
+ setValue(options[next].value);
1300
+ itemRefs.current[next]?.focus();
1301
+ };
1302
+ return /* @__PURE__ */ jsx14(
1303
+ FieldFrame,
1304
+ {
1305
+ ...rest,
1306
+ size,
1307
+ ids,
1308
+ label,
1309
+ required,
1310
+ optional,
1311
+ hint,
1312
+ error,
1313
+ disabled,
1314
+ optionalLabel: labels.optional,
1315
+ group: true,
1316
+ className,
1317
+ children: /* @__PURE__ */ jsxs8(
1318
+ "div",
1319
+ {
1320
+ id: ids.controlId,
1321
+ role: "radiogroup",
1322
+ "aria-label": labelledBy ? void 0 : ariaLabel ?? labels.group,
1323
+ "aria-labelledby": labelledBy,
1324
+ "aria-describedby": ids.describedBy,
1325
+ "aria-required": required || void 0,
1326
+ "aria-invalid": ids.invalid || void 0,
1327
+ className: cx(swatchTierClass, ColorSwatches_default.grid),
1328
+ ...toDataAttributes({
1329
+ size,
1330
+ invalid: ids.invalid || void 0,
1331
+ disabled: disabled || void 0
1332
+ }),
1333
+ onKeyDown: disabled ? void 0 : onKeyDown2,
1334
+ children: [
1335
+ options.map((option, index) => {
1336
+ const selected = index === selectedIndex;
1337
+ return (
1338
+ // biome-ignore lint/a11y/useSemanticElements: a swatch is a styled button in a roving radiogroup; a native radio cannot carry the color fill and check mark
1339
+ /* @__PURE__ */ jsx14(
1340
+ "button",
1341
+ {
1342
+ ref: (el) => {
1343
+ itemRefs.current[index] = el;
1344
+ },
1345
+ type: "button",
1346
+ role: "radio",
1347
+ "aria-checked": selected,
1348
+ "aria-label": option.label,
1349
+ title: option.label,
1350
+ tabIndex: index === focusIndex ? 0 : -1,
1351
+ disabled,
1352
+ className: swatchClass,
1353
+ ...toDataAttributes({
1354
+ state: selected ? "checked" : "unchecked",
1355
+ contrast: option.contrast
1356
+ }),
1357
+ onClick: () => setValue(option.value),
1358
+ children: /* @__PURE__ */ jsx14(SwatchContent, { value: option.value, selected })
1359
+ },
1360
+ option.value ?? "empty"
1361
+ )
1362
+ );
1363
+ }),
1364
+ name ? /* @__PURE__ */ jsx14("input", { type: "hidden", name, value: value ?? "" }) : null
1365
+ ]
1366
+ }
1367
+ )
1368
+ }
1369
+ );
1370
+ }
1371
+
1372
+ // src/components/empty-page/EmptyPage.module.css
1373
+ var EmptyPage_default = {
1374
+ root: "EmptyPage_root",
1375
+ iconWrap: "EmptyPage_iconWrap",
1376
+ title: "EmptyPage_title",
1377
+ description: "EmptyPage_description",
1378
+ actions: "EmptyPage_actions"
1379
+ };
1380
+
1381
+ // src/components/empty-page/EmptyPage.tsx
1382
+ import { jsx as jsx15 } from "react/jsx-runtime";
1383
+ function EmptyPageRoot({
1384
+ size = "m",
1385
+ layout = "default",
1386
+ className,
1387
+ children,
1388
+ ...rest
1389
+ }) {
1390
+ return /* @__PURE__ */ jsx15(
1391
+ "div",
1392
+ {
1393
+ className: cx(EmptyPage_default.root, layout !== "compact" && enterMotion_default.enterBaseChildren, className),
1394
+ ...rest,
1395
+ ...toDataAttributes({ size, layout: layout === "default" ? void 0 : layout }),
1396
+ children: /* @__PURE__ */ jsx15(ControlSizeProvider, { value: size, children })
1397
+ }
1398
+ );
1399
+ }
1400
+ EmptyPageRoot.displayName = "EmptyPage.Root";
1401
+ function EmptyPageIcon({ tone = "neutral", className, ...rest }) {
1402
+ return /* @__PURE__ */ jsx15("div", { className: cx(EmptyPage_default.iconWrap, className), "data-tone": tone, ...rest });
1403
+ }
1404
+ EmptyPageIcon.displayName = "EmptyPage.Icon";
1405
+ function EmptyPageTitle({ as: Tag = "h2", className, ref, ...rest }) {
1406
+ return /* @__PURE__ */ jsx15(Tag, { ref, className: cx(EmptyPage_default.title, className), ...rest });
1407
+ }
1408
+ EmptyPageTitle.displayName = "EmptyPage.Title";
1409
+ function EmptyPageDescription({ className, ...rest }) {
1410
+ return /* @__PURE__ */ jsx15("p", { className: cx(EmptyPage_default.description, className), ...rest });
1411
+ }
1412
+ EmptyPageDescription.displayName = "EmptyPage.Description";
1413
+ function EmptyPageActions({ className, ...rest }) {
1414
+ return /* @__PURE__ */ jsx15("div", { className: cx(EmptyPage_default.actions, className), ...rest });
1415
+ }
1416
+ EmptyPageActions.displayName = "EmptyPage.Actions";
1417
+ var EmptyPage = {
1418
+ Root: EmptyPageRoot,
1419
+ Icon: EmptyPageIcon,
1420
+ Title: EmptyPageTitle,
1421
+ Description: EmptyPageDescription,
1422
+ Actions: EmptyPageActions
1423
+ };
1424
+
1425
+ // src/components/divider/Divider.module.css
1426
+ var Divider_default = {
1427
+ root: "Divider_root",
1428
+ content: "Divider_content"
1429
+ };
1430
+
1431
+ // src/components/divider/Divider.tsx
1432
+ import { jsx as jsx16 } from "react/jsx-runtime";
1433
+ function Divider({
1434
+ orientation = "horizontal",
1435
+ align = "center",
1436
+ size = "m",
1437
+ children,
1438
+ className,
1439
+ role = "separator",
1440
+ ...rest
1441
+ }) {
1442
+ return /* @__PURE__ */ jsx16(
1443
+ "div",
1444
+ {
1445
+ ...rest,
1446
+ className: cx(Divider_default.root, className),
1447
+ role,
1448
+ ...orientation === "vertical" ? { "aria-orientation": "vertical" } : {},
1449
+ ...toDataAttributes({ orientation, align, size }),
1450
+ children: children != null ? /* @__PURE__ */ jsx16(ControlSizeProvider, { value: size, children: /* @__PURE__ */ jsx16("span", { className: Divider_default.content, children }) }) : null
1451
+ }
1452
+ );
1453
+ }
1454
+
1455
+ // src/components/input/Input.tsx
1456
+ import * as React13 from "react";
1457
+
1458
+ // src/internal/context.ts
1459
+ import * as React12 from "react";
1460
+ function createComponentContext(displayName) {
1461
+ const Ctx = React12.createContext(null);
1462
+ Ctx.displayName = `${displayName}Context`;
1463
+ function useComponentContext() {
1464
+ const value = React12.useContext(Ctx);
1465
+ if (value === null) {
1466
+ throw new Error(
1467
+ `[prime-ui-kit] \`${displayName}\` sub-component must be used inside \`${displayName}.Root\`.`
1468
+ );
1469
+ }
1470
+ return value;
1471
+ }
1472
+ return [Ctx.Provider, useComponentContext];
1473
+ }
1474
+
1475
+ // src/components/input/Input.module.css
1476
+ var Input_default = {
1477
+ root: "Input_root",
1478
+ wrapper: "Input_wrapper",
1479
+ affix: "Input_affix",
1480
+ field: "Input_field",
1481
+ inlineAffix: "Input_inlineAffix",
1482
+ icon: "Input_icon",
1483
+ action: "Input_action"
1484
+ };
1485
+
1486
+ // src/components/input/Input.tsx
1487
+ import { jsx as jsx17 } from "react/jsx-runtime";
1488
+ var INPUT_LABELS = {
1489
+ optional: "\u043D\u0435\u043E\u0431\u044F\u0437\u0430\u0442\u0435\u043B\u044C\u043D\u043E",
1490
+ clear: "\u041E\u0447\u0438\u0441\u0442\u0438\u0442\u044C",
1491
+ counter: "{current} \u0438\u0437 {max} \u0441\u0438\u043C\u0432\u043E\u043B\u043E\u0432"
1492
+ };
1493
+ var [InputProvider, useInputContext] = createComponentContext("Input");
1494
+ function InputRoot({
1495
+ size: sizeProp,
1496
+ invalid,
1497
+ focusRing = true,
1498
+ label,
1499
+ required = false,
1500
+ optional = false,
1501
+ hint,
1502
+ error,
1503
+ counter,
1504
+ reserveSupportRow = false,
1505
+ id,
1506
+ labels: labelsProp,
1507
+ children,
1508
+ className,
1509
+ ...rest
1510
+ }) {
1511
+ const size = useControlSize(sizeProp);
1512
+ const ids = useFieldFrame(id, { label, hint, error, invalid });
1513
+ const labels = React13.useMemo(() => ({ ...INPUT_LABELS, ...labelsProp }), [labelsProp]);
1514
+ const { invalid: isInvalid, controlId: inputId, describedBy } = ids;
1515
+ const inputRef = React13.useRef(null);
1516
+ const contextValue = React13.useMemo(
1517
+ () => ({
1518
+ size,
1519
+ invalid: isInvalid,
1520
+ focusRing,
1521
+ required,
1522
+ inputId,
1523
+ inputRef,
1524
+ describedBy,
1525
+ labels
1526
+ }),
1527
+ [size, isInvalid, focusRing, required, inputId, describedBy, labels]
1528
+ );
1529
+ return /* @__PURE__ */ jsx17(InputProvider, { value: contextValue, children: /* @__PURE__ */ jsx17(ControlSizeProvider, { value: size, children: /* @__PURE__ */ jsx17(
1530
+ FieldFrame,
1531
+ {
1532
+ ...rest,
1533
+ size,
1534
+ ids,
1535
+ label,
1536
+ required,
1537
+ optional,
1538
+ hint,
1539
+ error,
1540
+ counter,
1541
+ reserveSupportRow,
1542
+ optionalLabel: labels.optional,
1543
+ className: cx(fieldTierClass, Input_default.root, className),
1544
+ children
1545
+ }
1546
+ ) }) });
1547
+ }
1548
+ InputRoot.displayName = "Input.Root";
1549
+ function InputWrapper({ children, className, ...rest }) {
1550
+ const { size, invalid, focusRing } = useInputContext();
1551
+ return /* @__PURE__ */ jsx17(
1552
+ "div",
1553
+ {
1554
+ ...rest,
1555
+ className: cx(fieldSurfaceClass, Input_default.wrapper, className),
1556
+ ...toDataAttributes({
1557
+ size,
1558
+ invalid: invalid || void 0,
1559
+ "focus-ring": focusRing ? void 0 : false
1560
+ }),
1561
+ children
1562
+ }
1563
+ );
1564
+ }
1565
+ InputWrapper.displayName = "Input.Wrapper";
1566
+ function InputField({
1567
+ className,
1568
+ "aria-describedby": ariaDescribedBy,
1569
+ required,
1570
+ onChange,
1571
+ onValueChange,
1572
+ ref,
1573
+ ...rest
1574
+ }) {
1575
+ const { inputId, inputRef, invalid, required: requiredCtx, describedBy } = useInputContext();
1576
+ const setRefs = useMergedRefs(inputRef, ref);
1577
+ const resolvedDescribedBy = [ariaDescribedBy, describedBy].filter(Boolean).join(" ") || void 0;
1578
+ return /* @__PURE__ */ jsx17(
1579
+ "input",
1580
+ {
1581
+ ...rest,
1582
+ ref: setRefs,
1583
+ id: inputId,
1584
+ className: cx(Input_default.field, className),
1585
+ "aria-invalid": invalid || void 0,
1586
+ "aria-describedby": resolvedDescribedBy,
1587
+ required: required ?? (requiredCtx || void 0),
1588
+ onChange: (event) => {
1589
+ onChange?.(event);
1590
+ onValueChange?.(event.target.value);
1591
+ }
1592
+ }
1593
+ );
1594
+ }
1595
+ InputField.displayName = "Input.Field";
1596
+ function InputIcon({ side, children, className, ...rest }) {
1597
+ return /* @__PURE__ */ jsx17("span", { ...rest, className: cx(Input_default.icon, className), "data-side": side, "aria-hidden": "true", children });
1598
+ }
1599
+ InputIcon.displayName = "Input.Icon";
1600
+ function InputAffix({ side, children, className, ...rest }) {
1601
+ return /* @__PURE__ */ jsx17("div", { ...rest, className: cx(Input_default.affix, className), "data-side": side, "aria-hidden": "true", children });
1602
+ }
1603
+ InputAffix.displayName = "Input.Affix";
1604
+ function InputInlineAffix({ side, children, className, ...rest }) {
1605
+ return /* @__PURE__ */ jsx17(
1606
+ "span",
1607
+ {
1608
+ ...rest,
1609
+ className: cx(Input_default.inlineAffix, className),
1610
+ "data-side": side,
1611
+ "aria-hidden": "true",
1612
+ children
1613
+ }
1614
+ );
1615
+ }
1616
+ InputInlineAffix.displayName = "Input.InlineAffix";
1617
+ function InputClearButton({ className, onClick: onClick2, ref, ...rest }) {
1618
+ const { inputId, inputRef, labels } = useInputContext();
1619
+ return /* @__PURE__ */ jsx17(
1620
+ "button",
1621
+ {
1622
+ ...rest,
1623
+ ref,
1624
+ type: "button",
1625
+ className: cx(Input_default.action, className),
1626
+ "aria-label": labels.clear,
1627
+ "aria-controls": inputId,
1628
+ onClick: (event) => {
1629
+ onClick2?.(event);
1630
+ if (!event.defaultPrevented) inputRef.current?.focus();
1631
+ },
1632
+ children: /* @__PURE__ */ jsx17(Icon, { name: "action.close" })
1633
+ }
1634
+ );
1635
+ }
1636
+ InputClearButton.displayName = "Input.ClearButton";
1637
+ function InputCounter(props) {
1638
+ const { size, labels } = useInputContext();
1639
+ return /* @__PURE__ */ jsx17(FieldCounter, { ...props, size, label: labels.counter });
1640
+ }
1641
+ InputCounter.displayName = "Input.Counter";
1642
+ var Input = {
1643
+ Root: InputRoot,
1644
+ Wrapper: InputWrapper,
1645
+ Field: InputField,
1646
+ Icon: InputIcon,
1647
+ Affix: InputAffix,
1648
+ InlineAffix: InputInlineAffix,
1649
+ ClearButton: InputClearButton,
1650
+ Counter: InputCounter
1651
+ };
1652
+
1653
+ // src/internal/imageSlot.tsx
1654
+ import * as React15 from "react";
1655
+
1656
+ // src/hooks/useImageStatus.ts
1657
+ import * as React14 from "react";
1658
+ function useImageStatus(report, { onLoad, onError } = {}) {
1659
+ const [status, setStatus] = React14.useState("loading");
1660
+ React14.useLayoutEffect(() => {
1661
+ report("loading");
1662
+ return () => report("idle");
1663
+ }, [report]);
1664
+ const handleLoad = React14.useCallback(
1665
+ (event) => {
1666
+ setStatus("loaded");
1667
+ report("loaded");
1668
+ onLoad?.(event);
1669
+ },
1670
+ [onLoad, report]
1671
+ );
1672
+ const handleError = React14.useCallback(
1673
+ (event) => {
1674
+ setStatus("error");
1675
+ report("error");
1676
+ onError?.(event);
1677
+ },
1678
+ [onError, report]
1679
+ );
1680
+ return { status, onLoad: handleLoad, onError: handleError };
1681
+ }
1682
+
1683
+ // src/internal/imageSlot.tsx
1684
+ import { jsx as jsx18 } from "react/jsx-runtime";
1685
+ function createImageSlot(name, classNames) {
1686
+ const [Provider, useSlotContext] = createComponentContext(name);
1687
+ function ImageSlotProvider({ children }) {
1688
+ const [imageStatus, setImageStatus] = React15.useState("idle");
1689
+ const value = React15.useMemo(() => ({ imageStatus, setImageStatus }), [imageStatus]);
1690
+ return /* @__PURE__ */ jsx18(Provider, { value, children });
1691
+ }
1692
+ function ImageInner({ src, alt = "", className, onLoad, onError, ...rest }) {
1693
+ const { setImageStatus } = useSlotContext();
1694
+ const image = useImageStatus(setImageStatus, { onLoad, onError });
1695
+ return /* @__PURE__ */ jsx18(
1696
+ "img",
1697
+ {
1698
+ src,
1699
+ alt,
1700
+ className: cx(classNames.image, className),
1701
+ onLoad: image.onLoad,
1702
+ onError: image.onError,
1703
+ ...toDataAttributes({ status: image.status }),
1704
+ ...rest
1705
+ }
1706
+ );
1707
+ }
1708
+ function Image2(props) {
1709
+ return /* @__PURE__ */ jsx18(ImageInner, { ...props }, props.src);
1710
+ }
1711
+ Image2.displayName = `${name}.Image`;
1712
+ function Fallback({ className, ...rest }) {
1713
+ const { imageStatus } = useSlotContext();
1714
+ return /* @__PURE__ */ jsx18(
1715
+ "span",
1716
+ {
1717
+ className: cx(classNames.fallback, className),
1718
+ "aria-hidden": imageStatus === "loaded" ? true : void 0,
1719
+ ...rest
1720
+ }
1721
+ );
1722
+ }
1723
+ Fallback.displayName = `${name}.Fallback`;
1724
+ return {
1725
+ ImageSlotProvider,
1726
+ useImageSlot: () => useSlotContext().imageStatus,
1727
+ Image: Image2,
1728
+ Fallback
1729
+ };
1730
+ }
1731
+
1732
+ // src/internal/palette.module.css
1733
+ var palette_default = {
1734
+ hue: "palette_hue"
1735
+ };
1736
+
1737
+ // src/components/thumbnail/Thumbnail.module.css
1738
+ var Thumbnail_default = {
1739
+ root: "Thumbnail_root",
1740
+ image: "Thumbnail_image",
1741
+ fallback: "Thumbnail_fallback"
1742
+ };
1743
+
1744
+ // src/components/thumbnail/Thumbnail.tsx
1745
+ import { jsx as jsx19 } from "react/jsx-runtime";
1746
+ var slot = createImageSlot("Thumbnail", { image: Thumbnail_default.image, fallback: Thumbnail_default.fallback });
1747
+ function ThumbnailRoot({
1748
+ size = "m",
1749
+ ratio = "1:1",
1750
+ color = "gray",
1751
+ variant = "soft",
1752
+ fullWidth = false,
1753
+ ring = false,
1754
+ className,
1755
+ children,
1756
+ ...rest
1757
+ }) {
1758
+ return /* @__PURE__ */ jsx19(slot.ImageSlotProvider, { children: /* @__PURE__ */ jsx19(
1759
+ "div",
1760
+ {
1761
+ className: cx(Thumbnail_default.root, palette_default.hue, className),
1762
+ ...toDataAttributes({
1763
+ size,
1764
+ ratio,
1765
+ color,
1766
+ variant,
1767
+ "full-width": fullWidth || void 0,
1768
+ ring: ring || void 0
1769
+ }),
1770
+ ...rest,
1771
+ children
1772
+ }
1773
+ ) });
1774
+ }
1775
+ ThumbnailRoot.displayName = "Thumbnail.Root";
1776
+ function ThumbnailImage({ fit = "cover", ...rest }) {
1777
+ return /* @__PURE__ */ jsx19(slot.Image, { ...rest, "data-fit": fit });
1778
+ }
1779
+ ThumbnailImage.displayName = "Thumbnail.Image";
1780
+ var ThumbnailFallback = slot.Fallback;
1781
+ var Thumbnail = {
1782
+ Root: ThumbnailRoot,
1783
+ Image: ThumbnailImage,
1784
+ Fallback: ThumbnailFallback
1785
+ };
1786
+
1787
+ // src/components/select/Select.tsx
1788
+ import * as React26 from "react";
1789
+
1790
+ // src/internal/listbox.ts
1791
+ import * as React16 from "react";
1792
+ var optionDomId = (listboxId, value) => `${listboxId}-opt-${value.replace(/\s+/g, "_")}`;
1793
+ function enabledOptions(container) {
1794
+ if (!container) return [];
1795
+ return Array.from(
1796
+ container.querySelectorAll('[role="option"]:not([data-disabled="true"])')
1797
+ );
1798
+ }
1799
+ function createStore(initial) {
1800
+ let value = initial;
1801
+ const listeners = /* @__PURE__ */ new Set();
1802
+ return {
1803
+ get: () => value,
1804
+ set: (next) => {
1805
+ if (Object.is(value, next)) return;
1806
+ value = next;
1807
+ for (const listener of listeners) listener();
1808
+ },
1809
+ subscribe: (listener) => {
1810
+ listeners.add(listener);
1811
+ return () => listeners.delete(listener);
1812
+ }
1813
+ };
1814
+ }
1815
+ function useCreateStore(initial) {
1816
+ return React16.useState(() => createStore(initial))[0];
1817
+ }
1818
+ function useStoreSlice(store, select) {
1819
+ const read = () => select(store.get());
1820
+ return React16.useSyncExternalStore(store.subscribe, read, read);
1821
+ }
1822
+ function handleListboxKeyDown(event, { items, highlight, onSelect }) {
1823
+ if (items.length === 0) return;
1824
+ const highlighted = highlight.get();
1825
+ const current = items.findIndex((item) => item.dataset.value === highlighted);
1826
+ const next = rovingIndex(event.key, current, items.length, "vertical");
1827
+ if (next !== null) {
1828
+ event.preventDefault();
1829
+ const item = items[next];
1830
+ highlight.set(item?.dataset.value);
1831
+ item?.scrollIntoView?.({ block: "nearest" });
1832
+ return;
1833
+ }
1834
+ if (event.key === "Enter" || event.key === " ") {
1835
+ event.preventDefault();
1836
+ if (highlighted === void 0) return;
1837
+ onSelect(highlighted, items[current]?.dataset.label ?? highlighted);
1838
+ }
1839
+ }
1840
+ var TYPEAHEAD_RESET_MS = 500;
1841
+ function useTypeahead() {
1842
+ const state = React16.useRef({ buffer: "", timer: 0 });
1843
+ React16.useEffect(() => () => window.clearTimeout(state.current.timer), []);
1844
+ const isTyping = React16.useCallback(() => state.current.buffer !== "", []);
1845
+ const find = React16.useCallback(
1846
+ (key, items, highlighted) => {
1847
+ const s = state.current;
1848
+ window.clearTimeout(s.timer);
1849
+ s.buffer += key.toLocaleLowerCase();
1850
+ s.timer = window.setTimeout(() => {
1851
+ s.buffer = "";
1852
+ }, TYPEAHEAD_RESET_MS);
1853
+ const start = items.findIndex((item) => item.dataset.value === highlighted);
1854
+ const repeated = [...s.buffer].every((char) => char === s.buffer[0]);
1855
+ const prefix = repeated ? key.toLocaleLowerCase() : s.buffer;
1856
+ const from = repeated ? start + 1 : Math.max(start, 0);
1857
+ return [...items.slice(from), ...items.slice(0, from)].find(
1858
+ (item) => (item.dataset.label ?? "").toLocaleLowerCase().startsWith(prefix)
1859
+ );
1860
+ },
1861
+ []
1862
+ );
1863
+ return { find, isTyping };
1864
+ }
1865
+
1866
+ // src/internal/MenuGroup.tsx
1867
+ import * as React17 from "react";
1868
+
1869
+ // src/internal/menu.module.css
1870
+ var menu_default = {
1871
+ tier: "menu_tier",
1872
+ menu: "menu_menu",
1873
+ item: "menu_item",
1874
+ itemIcon: "menu_itemIcon",
1875
+ shortcut: "menu_shortcut",
1876
+ group: "menu_group",
1877
+ groupLabel: "menu_groupLabel",
1878
+ separator: "menu_separator",
1879
+ searchRow: "menu_searchRow",
1880
+ searchInput: "menu_searchInput"
1881
+ };
1882
+
1883
+ // src/internal/MenuGroup.tsx
1884
+ import { jsx as jsx20, jsxs as jsxs9 } from "react/jsx-runtime";
1885
+ function MenuGroup({ label, className, children, ...rest }) {
1886
+ const labelId = React17.useId();
1887
+ return (
1888
+ // biome-ignore lint/a11y/useSemanticElements: role="group" inside a menu / listbox; <fieldset> is not allowed there
1889
+ /* @__PURE__ */ jsxs9(
1890
+ "div",
1891
+ {
1892
+ ...rest,
1893
+ role: "group",
1894
+ "aria-labelledby": label != null ? labelId : void 0,
1895
+ className: cx(menu_default.group, className),
1896
+ children: [
1897
+ label != null ? /* @__PURE__ */ jsx20("div", { id: labelId, role: "presentation", className: menu_default.groupLabel, children: label }) : null,
1898
+ children
1899
+ ]
1900
+ }
1901
+ )
1902
+ );
1903
+ }
1904
+
1905
+ // src/internal/floatingSurface.module.css
1906
+ var floatingSurface_default = {
1907
+ surface: "floatingSurface_surface",
1908
+ layer: "floatingSurface_layer"
1909
+ };
1910
+
1911
+ // src/internal/overlayMotion.module.css
1912
+ var overlayMotion_default = {
1913
+ dialog: "overlayMotion_dialog",
1914
+ drawer: "overlayMotion_drawer",
1915
+ floating: "overlayMotion_floating",
1916
+ scrim: "overlayMotion_scrim",
1917
+ overlayFadeIn: "overlayMotion_overlayFadeIn",
1918
+ overlayFadeOut: "overlayMotion_overlayFadeOut",
1919
+ overlayDialogIn: "overlayMotion_overlayDialogIn",
1920
+ overlayDialogOut: "overlayMotion_overlayDialogOut",
1921
+ overlaySheetIn: "overlayMotion_overlaySheetIn",
1922
+ overlaySheetOut: "overlayMotion_overlaySheetOut",
1923
+ overlayDrawerIn: "overlayMotion_overlayDrawerIn",
1924
+ overlayDrawerOut: "overlayMotion_overlayDrawerOut",
1925
+ overlayFloatIn: "overlayMotion_overlayFloatIn",
1926
+ overlayFloatOut: "overlayMotion_overlayFloatOut"
1927
+ };
1928
+
1929
+ // src/internal/Portal.tsx
1930
+ import * as React18 from "react";
1931
+ import { createPortal } from "react-dom";
1932
+ function Portal({ children, container }) {
1933
+ const [mounted, setMounted] = React18.useState(false);
1934
+ React18.useLayoutEffect(() => {
1935
+ setMounted(true);
1936
+ return () => setMounted(false);
1937
+ }, []);
1938
+ if (!mounted) return null;
1939
+ return createPortal(children, container ?? document.body);
1940
+ }
1941
+
1942
+ // src/internal/overlay/layerStack.ts
1943
+ import * as React19 from "react";
1944
+
1945
+ // src/internal/overlay/focus.ts
1946
+ var FOCUSABLE = [
1947
+ "a[href]",
1948
+ "button:not([disabled])",
1949
+ 'input:not([disabled]):not([type="hidden"])',
1950
+ "select:not([disabled])",
1951
+ "textarea:not([disabled])",
1952
+ "[tabindex]"
1953
+ ].map((selector) => `${selector}:not([tabindex="-1"])`).join(", ");
1954
+ function getFocusable(container) {
1955
+ return Array.from(container.querySelectorAll(FOCUSABLE)).filter((el) => {
1956
+ if (el.getAttribute("aria-hidden") === "true") return false;
1957
+ const style = window.getComputedStyle(el);
1958
+ return style.display !== "none" && style.visibility !== "hidden";
1959
+ });
1960
+ }
1961
+ function focusInto(container) {
1962
+ if (container.contains(document.activeElement)) return;
1963
+ const target = container.querySelector("[data-autofocus]") ?? getFocusable(container)[0] ?? container;
1964
+ target.focus({ preventScroll: true });
1965
+ }
1966
+ function focusBack(el) {
1967
+ if (el?.isConnected) el.focus({ preventScroll: true });
1968
+ }
1969
+ function activeElement() {
1970
+ if (typeof document === "undefined") return null;
1971
+ const el = document.activeElement;
1972
+ return el instanceof HTMLElement && el !== document.body ? el : null;
1973
+ }
1974
+
1975
+ // src/internal/overlay/layerStack.ts
1976
+ var stack = [];
1977
+ var pendingClick = null;
1978
+ function isAncestor(ancestor, entry) {
1979
+ for (let p = entry.parent; p; p = p.parent) if (p === ancestor) return true;
1980
+ return false;
1981
+ }
1982
+ function contains(entry, target) {
1983
+ return target !== null && entry.refs.some((ref) => ref.current?.contains(target));
1984
+ }
1985
+ function topInteractive() {
1986
+ for (let i = stack.length - 1; i >= 0; i--) {
1987
+ if (stack[i]?.dismiss !== "none") return stack[i];
1988
+ }
1989
+ return void 0;
1990
+ }
1991
+ function trapTab(event) {
1992
+ const active = document.activeElement;
1993
+ for (let i = stack.length - 1; i >= 0; i--) {
1994
+ const entry = stack[i];
1995
+ if (!entry || entry.dismiss === "none") continue;
1996
+ const panel = entry.refs[0]?.current;
1997
+ if (!panel) continue;
1998
+ const inside = panel.contains(active);
1999
+ if (!entry.trap) {
2000
+ if (inside) return;
2001
+ continue;
2002
+ }
2003
+ const focusable = getFocusable(panel);
2004
+ if (focusable.length === 0) {
2005
+ event.preventDefault();
2006
+ panel.focus({ preventScroll: true });
2007
+ return;
2008
+ }
2009
+ const first = focusable[0];
2010
+ const last = focusable[focusable.length - 1];
2011
+ if (event.shiftKey ? !inside || active === first : !inside || active === last) {
2012
+ event.preventDefault();
2013
+ (event.shiftKey ? last : first)?.focus();
2014
+ }
2015
+ return;
2016
+ }
2017
+ }
2018
+ function onKeyDown(event) {
2019
+ if (event.key === "Tab") {
2020
+ trapTab(event);
2021
+ return;
2022
+ }
2023
+ if (event.key !== "Escape" || event.defaultPrevented) return;
2024
+ stack[stack.length - 1]?.onDismiss("escape");
2025
+ }
2026
+ function onPointerDown(event) {
2027
+ pendingClick = null;
2028
+ const top = topInteractive();
2029
+ const target = event.target instanceof Node ? event.target : null;
2030
+ if (!top || !target || contains(top, target)) return;
2031
+ if (top.dismiss === "click") pendingClick = top;
2032
+ else top.onDismiss("outside");
2033
+ }
2034
+ function onClick(event) {
2035
+ const layer = pendingClick;
2036
+ pendingClick = null;
2037
+ const target = event.target instanceof Node ? event.target : null;
2038
+ if (!layer || layer !== topInteractive() || !target || contains(layer, target)) return;
2039
+ layer.onDismiss("scrim");
2040
+ }
2041
+ function listen(on) {
2042
+ if (on) {
2043
+ document.addEventListener("keydown", onKeyDown);
2044
+ document.addEventListener("pointerdown", onPointerDown, true);
2045
+ document.addEventListener("click", onClick, true);
2046
+ } else {
2047
+ document.removeEventListener("keydown", onKeyDown);
2048
+ document.removeEventListener("pointerdown", onPointerDown, true);
2049
+ document.removeEventListener("click", onClick, true);
2050
+ }
2051
+ }
2052
+ function push(entry) {
2053
+ if (stack.length === 0) listen(true);
2054
+ const below = stack.findIndex((other) => isAncestor(entry, other));
2055
+ if (below === -1) stack.push(entry);
2056
+ else stack.splice(below, 0, entry);
2057
+ return () => {
2058
+ const index = stack.indexOf(entry);
2059
+ if (index !== -1) stack.splice(index, 1);
2060
+ if (pendingClick === entry) pendingClick = null;
2061
+ if (stack.length === 0) listen(false);
2062
+ };
2063
+ }
2064
+ var LayerContext = React19.createContext(null);
2065
+ var LayerProvider = LayerContext.Provider;
2066
+ function useLayer(open, options) {
2067
+ const parent = React19.useContext(LayerContext);
2068
+ const [entry] = React19.useState(() => ({ parent, trap: false, ...options }));
2069
+ entry.parent = parent;
2070
+ entry.refs = options.refs;
2071
+ entry.dismiss = options.dismiss;
2072
+ entry.trap = options.trap ?? false;
2073
+ entry.onDismiss = options.onDismiss;
2074
+ React19.useLayoutEffect(() => open ? push(entry) : void 0, [open, entry]);
2075
+ return entry;
2076
+ }
2077
+
2078
+ // src/internal/overlay/FloatingPanel.tsx
2079
+ import { jsx as jsx21 } from "react/jsx-runtime";
2080
+ function FloatingPanel({
2081
+ floating,
2082
+ size,
2083
+ scroll = false,
2084
+ surface = true,
2085
+ className,
2086
+ onKeyDown: onKeyDown2,
2087
+ children,
2088
+ ref,
2089
+ ...rest
2090
+ }) {
2091
+ const panelRef = useMergedRefs(floating.panelRef, ref);
2092
+ if (!floating.mounted) return null;
2093
+ const props = {
2094
+ ...rest,
2095
+ className: cx(
2096
+ surface && floatingSurface_default.surface,
2097
+ floatingSurface_default.layer,
2098
+ overlayMotion_default.floating,
2099
+ className
2100
+ ),
2101
+ "data-state": floating.presence.state,
2102
+ "data-side": floating.side,
2103
+ "data-size": size,
2104
+ onAnimationEnd: floating.presence.onExitEnd,
2105
+ onKeyDown: (event) => {
2106
+ onKeyDown2?.(event);
2107
+ floating.onKeyDown(event);
2108
+ }
2109
+ };
2110
+ return /* @__PURE__ */ jsx21(Portal, { children: /* @__PURE__ */ jsx21(LayerProvider, { value: floating.layer, children: /* @__PURE__ */ jsx21(ControlSizeProvider, { value: size, children: scroll ? /* @__PURE__ */ jsx21(ScrollContainer, { ...props, ref: panelRef, children }) : /* @__PURE__ */ jsx21("div", { ...props, ref: panelRef, children }) }) }) });
2111
+ }
2112
+ function FloatingTrigger({ triggerProps, children, ...forwarded }) {
2113
+ return /* @__PURE__ */ jsx21(Slot, { ...forwarded, children: /* @__PURE__ */ jsx21(Slot, { ...triggerProps, children }) });
2114
+ }
2115
+
2116
+ // src/internal/overlay/useFloatingLayer.ts
2117
+ import * as React23 from "react";
2118
+
2119
+ // src/hooks/usePosition.ts
2120
+ import * as React21 from "react";
2121
+
2122
+ // src/internal/AnchorRectContext.tsx
2123
+ import * as React20 from "react";
2124
+ var AnchorRectContext = React20.createContext(null);
2125
+ var AnchorRectProvider = AnchorRectContext.Provider;
2126
+ function useAnchorRectResolver() {
2127
+ return React20.useContext(AnchorRectContext);
2128
+ }
2129
+
2130
+ // src/internal/layoutPxFromPrimitives.ts
2131
+ var FALLBACK_ROOT_FONT_PX = 16;
2132
+ function getRootFontSizePx() {
2133
+ if (typeof document === "undefined") {
2134
+ return FALLBACK_ROOT_FONT_PX;
2135
+ }
2136
+ const raw = getComputedStyle(document.documentElement).fontSize;
2137
+ const parsed = Number.parseFloat(raw);
2138
+ return Number.isFinite(parsed) && parsed > 0 ? parsed : FALLBACK_ROOT_FONT_PX;
2139
+ }
2140
+
2141
+ // src/internal/scrollAncestors.ts
2142
+ var SCROLLABLE = /^(auto|scroll|overlay)$/;
2143
+ function getScrollContainers(node) {
2144
+ const out = [window];
2145
+ if (!node || typeof window === "undefined") return out;
2146
+ for (let el = node.parentElement; el; el = el.parentElement) {
2147
+ const { overflowX, overflowY } = window.getComputedStyle(el);
2148
+ if (SCROLLABLE.test(overflowY) || SCROLLABLE.test(overflowX)) {
2149
+ out.push(el);
2150
+ }
2151
+ }
2152
+ if (window.visualViewport) out.push(window.visualViewport);
2153
+ return out;
2154
+ }
2155
+
2156
+ // src/hooks/usePosition.ts
2157
+ var FLOAT_MAX_HEIGHT_VAR = "--float-max-h";
2158
+ var FLOAT_MIN_WIDTH_VAR = "--float-min-w";
2159
+ var FLOAT_MAX_WIDTH_VAR = "--float-max-w";
2160
+ var FLOAT_ARROW_VAR = "--float-arrow";
2161
+ var MIN_MENU_ESTIMATE = 176;
2162
+ var FALLBACK_VIEWPORT_PAD_PX = 8;
2163
+ var FALLBACK_PANEL_OFFSET_PX = 4;
2164
+ var MIN_FLOATING_MAX_HEIGHT = 120;
2165
+ var FIRST_PAINT_FLOAT_HEIGHT_GUESS_PX = 280;
2166
+ var OPPOSITE = {
2167
+ top: "bottom",
2168
+ bottom: "top",
2169
+ left: "right",
2170
+ right: "left"
2171
+ };
2172
+ function readCssLengthPx(name, fallbackPx) {
2173
+ if (typeof document === "undefined") return fallbackPx;
2174
+ const raw = getComputedStyle(document.documentElement).getPropertyValue(name).trim();
2175
+ if (!raw) return fallbackPx;
2176
+ const n = Number.parseFloat(raw);
2177
+ if (!Number.isFinite(n)) return fallbackPx;
2178
+ if (raw.endsWith("rem")) return Math.round(n * getRootFontSizePx());
2179
+ if (raw.endsWith("px") || n === 0) return Math.round(n);
2180
+ return fallbackPx;
2181
+ }
2182
+ function getViewportPadPx() {
2183
+ return readCssLengthPx("--prime-space-2", FALLBACK_VIEWPORT_PAD_PX);
2184
+ }
2185
+ var clamp = (value, min, max) => Math.max(min, Math.min(value, Math.max(min, max)));
2186
+ function computeFloatingPosition(anchor, contentW, contentH, vw, vh, opts) {
2187
+ const { align, offset, flip, matchAnchorWidth, arrowInset } = opts;
2188
+ const pad = opts.viewportPad ?? FALLBACK_VIEWPORT_PAD_PX;
2189
+ const room = {
2190
+ top: anchor.top - offset - pad,
2191
+ bottom: vh - anchor.bottom - offset - pad,
2192
+ left: anchor.left - offset - pad,
2193
+ right: vw - anchor.right - offset - pad
2194
+ };
2195
+ const isVertical = (s) => s === "top" || s === "bottom";
2196
+ const mainSize = isVertical(opts.side) ? contentH : contentW;
2197
+ let side = opts.side;
2198
+ if (flip && mainSize > 0 && room[side] < mainSize) {
2199
+ const opposite = OPPOSITE[side];
2200
+ if (room[opposite] >= mainSize || room[opposite] > room[side]) side = opposite;
2201
+ }
2202
+ const vertical = isVertical(side);
2203
+ const viewportMaxWidth = Math.max(0, Math.floor(vw - pad * 2));
2204
+ const maxWidth = vertical ? viewportMaxWidth : Math.max(0, Math.min(viewportMaxWidth, Math.floor(room[side])));
2205
+ const width = Math.min(
2206
+ maxWidth,
2207
+ contentW > 0 ? contentW : matchAnchorWidth ? anchor.width : Math.max(anchor.width, MIN_MENU_ESTIMATE)
2208
+ );
2209
+ let main;
2210
+ if (side === "bottom") main = anchor.bottom + offset;
2211
+ else if (side === "right") main = anchor.right + offset;
2212
+ else if (side === "left") main = Math.max(pad, anchor.left - offset - width);
2213
+ else
2214
+ main = Math.max(
2215
+ pad,
2216
+ anchor.top - offset - (contentH > 0 ? contentH : FIRST_PAINT_FLOAT_HEIGHT_GUESS_PX)
2217
+ );
2218
+ const anchorStart = vertical ? anchor.left : anchor.top;
2219
+ const anchorSize = vertical ? anchor.width : anchor.height;
2220
+ const crossSize = vertical ? width : contentH;
2221
+ const viewport = vertical ? vw : vh;
2222
+ const crossFor = (a) => a === "start" ? anchorStart : a === "end" ? anchorStart + anchorSize - crossSize : anchorStart + anchorSize / 2 - crossSize / 2;
2223
+ const fits = (x) => x >= pad && x + crossSize <= viewport - pad;
2224
+ let cross = crossFor(align);
2225
+ if (flip && !fits(cross)) {
2226
+ const opposite = align === "end" ? "start" : align === "start" ? "end" : align;
2227
+ if (opposite !== align && fits(crossFor(opposite))) cross = crossFor(opposite);
2228
+ }
2229
+ cross = Math.round(clamp(cross, pad, viewport - crossSize - pad));
2230
+ const out = {
2231
+ top: Math.round(vertical ? main : cross),
2232
+ left: Math.round(vertical ? cross : main),
2233
+ side,
2234
+ maxWidth,
2235
+ maxHeight: Math.max(MIN_FLOATING_MAX_HEIGHT, Math.floor(vertical ? room[side] : vh - pad * 2))
2236
+ };
2237
+ if (matchAnchorWidth) out.minWidth = Math.min(anchor.width, maxWidth);
2238
+ if (arrowInset !== void 0) {
2239
+ out.arrow = Math.round(
2240
+ clamp(anchorStart + anchorSize / 2 - cross, arrowInset, crossSize - arrowInset)
2241
+ );
2242
+ }
2243
+ return out;
2244
+ }
2245
+ function usePosition(enabled, anchorRef, layerRef, {
2246
+ side: preferredSide = "bottom",
2247
+ align = "start",
2248
+ matchAnchorWidth = false,
2249
+ offsetToken = "--prime-panel-offset",
2250
+ arrowInset
2251
+ } = {}) {
2252
+ const [attached, setAttached] = React21.useState(false);
2253
+ const [resolvedSide, setResolvedSide] = React21.useState(preferredSide);
2254
+ const resolveAnchorRect = useAnchorRectResolver();
2255
+ const metricsRef = React21.useRef(null);
2256
+ const update = React21.useCallback(
2257
+ (remeasure) => {
2258
+ const anchor = anchorRef.current;
2259
+ const layer = layerRef.current;
2260
+ if (!anchor || !layer) return;
2261
+ if (remeasure || !metricsRef.current) {
2262
+ metricsRef.current = {
2263
+ offset: readCssLengthPx(offsetToken, FALLBACK_PANEL_OFFSET_PX),
2264
+ pad: getViewportPadPx(),
2265
+ arrow: arrowInset?.(layer)
2266
+ };
2267
+ }
2268
+ const { offset, pad, arrow } = metricsRef.current;
2269
+ const rect = anchor.getBoundingClientRect();
2270
+ const pos = computeFloatingPosition(
2271
+ resolveAnchorRect ? resolveAnchorRect(anchor, rect) : rect,
2272
+ layer.offsetWidth,
2273
+ layer.offsetHeight,
2274
+ window.innerWidth,
2275
+ window.innerHeight,
2276
+ {
2277
+ side: preferredSide,
2278
+ align,
2279
+ offset,
2280
+ viewportPad: pad,
2281
+ flip: true,
2282
+ matchAnchorWidth,
2283
+ arrowInset: arrow
2284
+ }
2285
+ );
2286
+ setResolvedSide(pos.side);
2287
+ const set = (name, value) => {
2288
+ if (layer.style.getPropertyValue(name) !== value) layer.style.setProperty(name, value);
2289
+ };
2290
+ const px = (n) => n === void 0 ? "" : `${n}px`;
2291
+ set("position", "fixed");
2292
+ set("top", px(pos.top));
2293
+ set("left", px(pos.left));
2294
+ set(FLOAT_MIN_WIDTH_VAR, px(pos.minWidth));
2295
+ set(FLOAT_MAX_WIDTH_VAR, px(pos.maxWidth));
2296
+ set(FLOAT_MAX_HEIGHT_VAR, px(pos.maxHeight));
2297
+ set(FLOAT_ARROW_VAR, px(pos.arrow));
2298
+ },
2299
+ [
2300
+ anchorRef,
2301
+ layerRef,
2302
+ preferredSide,
2303
+ align,
2304
+ matchAnchorWidth,
2305
+ offsetToken,
2306
+ arrowInset,
2307
+ resolveAnchorRect
2308
+ ]
2309
+ );
2310
+ const updateRef = React21.useRef(update);
2311
+ updateRef.current = update;
2312
+ const attachLayer = React21.useCallback(
2313
+ (node) => {
2314
+ layerRef.current = node;
2315
+ setAttached(node !== null);
2316
+ },
2317
+ [layerRef]
2318
+ );
2319
+ const active = enabled && attached;
2320
+ React21.useLayoutEffect(() => {
2321
+ if (active) update(true);
2322
+ }, [active, update]);
2323
+ React21.useLayoutEffect(() => {
2324
+ if (!active) return;
2325
+ let frame = 0;
2326
+ let remeasure = false;
2327
+ const schedule = (measure) => {
2328
+ remeasure ||= measure;
2329
+ cancelAnimationFrame(frame);
2330
+ frame = requestAnimationFrame(() => {
2331
+ updateRef.current(remeasure);
2332
+ remeasure = false;
2333
+ });
2334
+ };
2335
+ const follow = () => schedule(false);
2336
+ const resize = () => schedule(true);
2337
+ window.addEventListener("resize", resize);
2338
+ const scrollTargets = getScrollContainers(anchorRef.current);
2339
+ for (const target of scrollTargets) {
2340
+ target.addEventListener("scroll", follow, { passive: true });
2341
+ }
2342
+ window.visualViewport?.addEventListener("resize", resize);
2343
+ const observer = typeof ResizeObserver === "undefined" ? null : new ResizeObserver(follow);
2344
+ if (layerRef.current) observer?.observe(layerRef.current);
2345
+ if (anchorRef.current) observer?.observe(anchorRef.current);
2346
+ return () => {
2347
+ cancelAnimationFrame(frame);
2348
+ window.removeEventListener("resize", resize);
2349
+ for (const target of scrollTargets) target.removeEventListener("scroll", follow);
2350
+ window.visualViewport?.removeEventListener("resize", resize);
2351
+ observer?.disconnect();
2352
+ };
2353
+ }, [active, anchorRef, layerRef]);
2354
+ return { side: resolvedSide, attachLayer };
2355
+ }
2356
+
2357
+ // src/hooks/usePresence.ts
2358
+ import * as React22 from "react";
2359
+ var DURATION_FALLBACK_MS = {
2360
+ fast: 230,
2361
+ base: 380,
2362
+ slow: 570
2363
+ };
2364
+ var TIMEOUT_SLACK_MS = 50;
2365
+ function prefersReducedMotion() {
2366
+ return typeof window !== "undefined" && typeof window.matchMedia === "function" && window.matchMedia("(prefers-reduced-motion: reduce)").matches;
2367
+ }
2368
+ function parseDurationMs(raw) {
2369
+ const value = raw.trim();
2370
+ if (value === "") return null;
2371
+ const n = Number.parseFloat(value);
2372
+ if (Number.isNaN(n)) return null;
2373
+ if (value.endsWith("ms")) return n;
2374
+ if (value.endsWith("s")) return n * 1e3;
2375
+ return null;
2376
+ }
2377
+ function motionDurationMs(token) {
2378
+ if (typeof document === "undefined") return DURATION_FALLBACK_MS[token];
2379
+ const raw = getComputedStyle(document.documentElement).getPropertyValue(
2380
+ `--prime-motion-duration-${token}`
2381
+ );
2382
+ return parseDurationMs(raw) ?? DURATION_FALLBACK_MS[token];
2383
+ }
2384
+ function exitTimeoutMs(token) {
2385
+ return motionDurationMs(token) + TIMEOUT_SLACK_MS;
2386
+ }
2387
+ function usePresence(open, options = {}) {
2388
+ const { exitDuration = "base" } = options;
2389
+ const [mounted, setMounted] = React22.useState(open);
2390
+ if (open && !mounted) setMounted(true);
2391
+ if (!open && mounted && prefersReducedMotion()) setMounted(false);
2392
+ const openRef = React22.useRef(open);
2393
+ openRef.current = open;
2394
+ React22.useEffect(() => {
2395
+ if (open || !mounted) return;
2396
+ const id = window.setTimeout(() => setMounted(false), exitTimeoutMs(exitDuration));
2397
+ return () => window.clearTimeout(id);
2398
+ }, [open, mounted, exitDuration]);
2399
+ const onExitEnd = React22.useCallback((event) => {
2400
+ if (event.target !== event.currentTarget) return;
2401
+ if (!openRef.current) setMounted(false);
2402
+ }, []);
2403
+ return { mounted: open || mounted, state: open ? "open" : "closed", onExitEnd };
2404
+ }
2405
+
2406
+ // src/internal/overlay/useFloatingLayer.ts
2407
+ function useFloatingLayer({
2408
+ open,
2409
+ onOpenChange,
2410
+ triggerRef,
2411
+ closeOnEscape = true,
2412
+ closeOnOutsideClick = true,
2413
+ dismiss = "pointerdown",
2414
+ focusOnOpen = false,
2415
+ trap = false,
2416
+ tabExit = "none",
2417
+ exitDuration = "fast",
2418
+ skipExit = false,
2419
+ ...positionOptions
2420
+ }) {
2421
+ const presence = usePresence(open, { exitDuration });
2422
+ const mounted = presence.mounted && (open || !skipExit);
2423
+ const contentRef = React23.useRef(null);
2424
+ const position = usePosition(mounted, triggerRef, contentRef, positionOptions);
2425
+ const [panel, setPanel] = React23.useState(null);
2426
+ const { attachLayer } = position;
2427
+ const panelRef = React23.useCallback(
2428
+ (node) => {
2429
+ attachLayer(node);
2430
+ setPanel(node);
2431
+ },
2432
+ [attachLayer]
2433
+ );
2434
+ const outsideRef = React23.useRef(false);
2435
+ const close = React23.useCallback(() => {
2436
+ outsideRef.current = false;
2437
+ onOpenChange(false);
2438
+ }, [onOpenChange]);
2439
+ const onDismiss = (reason) => {
2440
+ if (reason === "escape") {
2441
+ if (closeOnEscape) close();
2442
+ } else if (closeOnOutsideClick) {
2443
+ outsideRef.current = true;
2444
+ onOpenChange(false);
2445
+ }
2446
+ };
2447
+ const layer = useLayer(open, {
2448
+ refs: [contentRef, triggerRef],
2449
+ dismiss,
2450
+ trap,
2451
+ onDismiss
2452
+ });
2453
+ const passive = dismiss === "none";
2454
+ React23.useEffect(() => {
2455
+ if (!open || !panel || passive) return;
2456
+ outsideRef.current = false;
2457
+ if (focusOnOpen) focusInto(panel);
2458
+ return () => {
2459
+ if (outsideRef.current) return;
2460
+ const active = document.activeElement;
2461
+ if (!active || active === document.body || panel.contains(active)) {
2462
+ focusBack(triggerRef.current);
2463
+ }
2464
+ };
2465
+ }, [open, panel, passive, focusOnOpen, triggerRef]);
2466
+ const onKeyDown2 = (event) => {
2467
+ if (event.key !== "Tab" || event.defaultPrevented || trap || tabExit === "none") return;
2468
+ const node = contentRef.current;
2469
+ if (!node) return;
2470
+ if (tabExit === "edges") {
2471
+ const focusable = getFocusable(node);
2472
+ const active = document.activeElement;
2473
+ const leaving = event.shiftKey ? active === node || active === focusable[0] : focusable.length === 0 || active === focusable[focusable.length - 1];
2474
+ if (!leaving) return;
2475
+ }
2476
+ if (event.shiftKey) event.preventDefault();
2477
+ focusBack(triggerRef.current);
2478
+ close();
2479
+ };
2480
+ return {
2481
+ open,
2482
+ presence,
2483
+ mounted,
2484
+ side: position.side,
2485
+ panelRef,
2486
+ contentRef,
2487
+ layer,
2488
+ close,
2489
+ onKeyDown: onKeyDown2
2490
+ };
2491
+ }
2492
+
2493
+ // src/components/select/Select.module.css
2494
+ var Select_default = {
2495
+ trigger: "Select_trigger",
2496
+ triggerMain: "Select_triggerMain",
2497
+ value: "Select_value",
2498
+ valueBody: "Select_valueBody",
2499
+ triggerIcon: "Select_triggerIcon",
2500
+ chevron: "Select_chevron",
2501
+ clear: "Select_clear",
2502
+ content: "Select_content",
2503
+ listbox: "Select_listbox",
2504
+ search: "Select_search",
2505
+ group: "Select_group",
2506
+ separator: "Select_separator",
2507
+ status: "Select_status",
2508
+ item: "Select_item",
2509
+ itemText: "Select_itemText",
2510
+ itemTitle: "Select_itemTitle",
2511
+ itemDescription: "Select_itemDescription",
2512
+ itemMeta: "Select_itemMeta",
2513
+ media: "Select_media",
2514
+ check: "Select_check"
2515
+ };
2516
+
2517
+ // src/components/select/SelectItem.tsx
2518
+ import * as React25 from "react";
2519
+
2520
+ // src/internal/HighlightMatch.tsx
2521
+ import * as React24 from "react";
2522
+
2523
+ // src/internal/HighlightMatch.module.css
2524
+ var HighlightMatch_default = {
2525
+ match: "HighlightMatch_match"
2526
+ };
2527
+
2528
+ // src/internal/HighlightMatch.tsx
2529
+ import { Fragment as Fragment4, jsx as jsx22, jsxs as jsxs10 } from "react/jsx-runtime";
2530
+ function matchIndex(text, query) {
2531
+ if (!query) return -1;
2532
+ return text.toLowerCase().indexOf(query.toLowerCase());
2533
+ }
2534
+ function HighlightMatch({ text, query }) {
2535
+ const q = query.trim();
2536
+ const at = matchIndex(text, q);
2537
+ if (at < 0) return /* @__PURE__ */ jsx22(Fragment4, { children: text });
2538
+ return /* @__PURE__ */ jsxs10("span", { children: [
2539
+ text.slice(0, at),
2540
+ /* @__PURE__ */ jsx22("mark", { className: HighlightMatch_default.match, children: text.slice(at, at + q.length) }),
2541
+ text.slice(at + q.length)
2542
+ ] });
2543
+ }
2544
+ function highlightChildren(children, query) {
2545
+ if (!query.trim()) return children;
2546
+ return React24.Children.map(
2547
+ children,
2548
+ (child) => typeof child === "string" || typeof child === "number" ? /* @__PURE__ */ jsx22(HighlightMatch, { text: String(child), query }) : child
2549
+ );
2550
+ }
2551
+
2552
+ // src/components/select/selectContext.ts
2553
+ var normalize = (text) => text.trim().toLocaleLowerCase();
2554
+ function createItemRegistry() {
2555
+ const entries = /* @__PURE__ */ new Map();
2556
+ const version = createStore(0);
2557
+ const bump = () => version.set(version.get() + 1);
2558
+ return {
2559
+ version,
2560
+ labelOf: (value) => entries.get(value)?.label ?? value,
2561
+ register: (value, label, haystack) => {
2562
+ const entry = entries.get(value);
2563
+ entries.set(value, { label, haystack, mounted: (entry?.mounted ?? 0) + 1 });
2564
+ bump();
2565
+ return () => {
2566
+ const current = entries.get(value);
2567
+ if (current) current.mounted -= 1;
2568
+ bump();
2569
+ };
2570
+ },
2571
+ anyMatch: (query) => {
2572
+ for (const entry of entries.values()) {
2573
+ if (entry.mounted > 0 && (query === "" || entry.haystack.includes(query))) return true;
2574
+ }
2575
+ return false;
2576
+ }
2577
+ };
2578
+ }
2579
+ var [SelectProvider, useSelectContext] = createComponentContext("Select");
2580
+
2581
+ // src/components/select/SelectItem.tsx
2582
+ import { jsx as jsx23, jsxs as jsxs11 } from "react/jsx-runtime";
2583
+ var MEDIA_SIZE = { xs: "xs", s: "xs", m: "s", l: "s", xl: "m" };
2584
+ function textOf(node) {
2585
+ if (node == null || typeof node === "boolean") return "";
2586
+ if (typeof node === "string" || typeof node === "number") return String(node);
2587
+ if (Array.isArray(node)) return node.map(textOf).join("");
2588
+ if (React25.isValidElement(node))
2589
+ return textOf(node.props.children);
2590
+ return "";
2591
+ }
2592
+ function SelectItemIcon({ className, ...rest }) {
2593
+ return /* @__PURE__ */ jsx23("span", { "aria-hidden": "true", className: cx(menu_default.itemIcon, className), ...rest });
2594
+ }
2595
+ SelectItemIcon.displayName = "Select.ItemIcon";
2596
+ var OptionQueryContext = React25.createContext("");
2597
+ function SelectItemText({ children, className, ...rest }) {
2598
+ const query = React25.useContext(OptionQueryContext);
2599
+ return /* @__PURE__ */ jsx23("span", { ...rest, className: cx(Select_default.itemTitle, className), children: highlightChildren(children, query) });
2600
+ }
2601
+ SelectItemText.displayName = "Select.ItemText";
2602
+ function SelectItemDescription({
2603
+ children,
2604
+ className,
2605
+ ...rest
2606
+ }) {
2607
+ const query = React25.useContext(OptionQueryContext);
2608
+ return /* @__PURE__ */ jsx23("span", { ...rest, className: cx(Select_default.itemDescription, className), children: highlightChildren(children, query) });
2609
+ }
2610
+ SelectItemDescription.displayName = "Select.ItemDescription";
2611
+ function SelectItemMeta({ children, className, ...rest }) {
2612
+ return /* @__PURE__ */ jsx23("span", { ...rest, className: cx(Select_default.itemMeta, className), children });
2613
+ }
2614
+ SelectItemMeta.displayName = "Select.ItemMeta";
2615
+ function splitItemChildren(children) {
2616
+ const parts = {
2617
+ leading: [],
2618
+ body: [],
2619
+ meta: [],
2620
+ rich: false,
2621
+ title: "",
2622
+ description: ""
2623
+ };
2624
+ let plain = "";
2625
+ for (const child of React25.Children.toArray(children)) {
2626
+ if (!React25.isValidElement(child)) {
2627
+ plain += textOf(child);
2628
+ parts.body.push(child);
2629
+ } else if (child.type === React25.Fragment) {
2630
+ const inner = splitItemChildren(child.props.children);
2631
+ parts.leading.push(...inner.leading);
2632
+ parts.body.push(...inner.body);
2633
+ parts.meta.push(...inner.meta);
2634
+ parts.rich ||= inner.rich;
2635
+ parts.title ||= inner.title;
2636
+ parts.description ||= inner.description;
2637
+ plain += inner.title;
2638
+ } else if (child.type === SelectItemIcon) {
2639
+ parts.leading.push(child);
2640
+ } else if (child.type === Thumbnail.Root) {
2641
+ parts.leading.push(child);
2642
+ parts.rich = true;
2643
+ } else if (child.type === SelectItemMeta) {
2644
+ parts.meta.push(child);
2645
+ } else {
2646
+ if (child.type === SelectItemText) parts.title = textOf(child.props.children);
2647
+ if (child.type === SelectItemDescription) {
2648
+ parts.description = textOf(child.props.children);
2649
+ parts.rich = true;
2650
+ }
2651
+ parts.body.push(child);
2652
+ }
2653
+ }
2654
+ parts.title = (parts.title || plain).trim();
2655
+ return parts;
2656
+ }
2657
+ function sizeMedia(leading, size) {
2658
+ return leading.map(
2659
+ (node) => React25.isValidElement(node) && node.type === Thumbnail.Root ? React25.cloneElement(node, {
2660
+ size: node.props.size ?? MEDIA_SIZE[size],
2661
+ className: cx(Select_default.media, node.props.className),
2662
+ "aria-hidden": true
2663
+ }) : node
2664
+ );
2665
+ }
2666
+ function SelectItem({
2667
+ value,
2668
+ label,
2669
+ keywords,
2670
+ disabled,
2671
+ className,
2672
+ children,
2673
+ ref
2674
+ }) {
2675
+ const { multiple, size, selected, highlight, pick, registry, listboxId, query } = useSelectContext();
2676
+ const parts = splitItemChildren(children);
2677
+ const resolvedLabel = label || parts.title || value;
2678
+ const haystack = normalize(`${resolvedLabel} ${parts.description} ${keywords ?? ""}`);
2679
+ const isSelected = selected.includes(value);
2680
+ const isHighlighted = useStoreSlice(highlight, (current) => current === value);
2681
+ React25.useLayoutEffect(
2682
+ () => registry.register(value, resolvedLabel, haystack),
2683
+ [registry, value, resolvedLabel, haystack]
2684
+ );
2685
+ const search = normalize(query);
2686
+ if (search !== "" && !haystack.includes(search)) return null;
2687
+ return (
2688
+ // biome-ignore lint/a11y/useFocusableInteractive: focus stays on the listbox / search (aria-activedescendant)
2689
+ // biome-ignore lint/a11y/useKeyWithClickEvents: the keyboard is handled on the listbox
2690
+ /* @__PURE__ */ jsxs11(
2691
+ "div",
2692
+ {
2693
+ ref,
2694
+ id: optionDomId(listboxId, value),
2695
+ role: "option",
2696
+ "aria-selected": isSelected,
2697
+ "aria-disabled": disabled || void 0,
2698
+ className: cx(menu_default.item, Select_default.item, className),
2699
+ onClick: () => {
2700
+ if (!disabled) pick(value);
2701
+ },
2702
+ onMouseMove: () => {
2703
+ if (!disabled && !isHighlighted) highlight.set(value);
2704
+ },
2705
+ ...toDataAttributes({
2706
+ value,
2707
+ label: resolvedLabel,
2708
+ selected: isSelected,
2709
+ highlighted: isHighlighted,
2710
+ disabled: Boolean(disabled),
2711
+ rich: parts.rich || void 0
2712
+ }),
2713
+ children: [
2714
+ multiple ? /* @__PURE__ */ jsx23(Checkbox.Indicator, { checked: isSelected, disabled, size: stepDown(size) }) : null,
2715
+ sizeMedia(parts.leading, size),
2716
+ /* @__PURE__ */ jsx23("span", { className: Select_default.itemText, children: /* @__PURE__ */ jsx23(OptionQueryContext.Provider, { value: query, children: highlightChildren(parts.body, query) }) }),
2717
+ parts.meta,
2718
+ multiple ? null : /* @__PURE__ */ jsx23("span", { className: Select_default.check, "aria-hidden": "true", children: isSelected ? /* @__PURE__ */ jsx23(Icon, { name: "action.check" }) : null })
2719
+ ]
2720
+ }
2721
+ )
2722
+ );
2723
+ }
2724
+ SelectItem.displayName = "Select.Item";
2725
+
2726
+ // src/components/select/Select.tsx
2727
+ import { jsx as jsx24, jsxs as jsxs12 } from "react/jsx-runtime";
2728
+ var SELECT_LABELS = {
2729
+ search: "\u041F\u043E\u0438\u0441\u043A",
2730
+ empty: "\u041D\u0438\u0447\u0435\u0433\u043E \u043D\u0435 \u043D\u0430\u0439\u0434\u0435\u043D\u043E",
2731
+ emptyHint: "\u041F\u043E\u043F\u0440\u043E\u0431\u0443\u0439\u0442\u0435 \u0438\u0437\u043C\u0435\u043D\u0438\u0442\u044C \u0437\u0430\u043F\u0440\u043E\u0441",
2732
+ loading: "\u0417\u0430\u0433\u0440\u0443\u0437\u043A\u0430\u2026",
2733
+ clear: "\u041E\u0447\u0438\u0441\u0442\u0438\u0442\u044C",
2734
+ optional: "\u043D\u0435\u043E\u0431\u044F\u0437\u0430\u0442\u0435\u043B\u044C\u043D\u043E"
2735
+ };
2736
+ function SelectRoot(props) {
2737
+ const {
2738
+ size = "m",
2739
+ label,
2740
+ required = false,
2741
+ optional,
2742
+ hint,
2743
+ error,
2744
+ invalid,
2745
+ focusRing = true,
2746
+ disabled = false,
2747
+ placeholder,
2748
+ id,
2749
+ open,
2750
+ defaultOpen = false,
2751
+ onOpenChange,
2752
+ clearable = false,
2753
+ loading = false,
2754
+ labels: labelsProp,
2755
+ className,
2756
+ children,
2757
+ multiple: _multiple,
2758
+ value: _value,
2759
+ defaultValue: _defaultValue,
2760
+ onValueChange: _onValueChange,
2761
+ ...rest
2762
+ } = props;
2763
+ const multiple = props.multiple === true;
2764
+ const labels = React26.useMemo(() => ({ ...SELECT_LABELS, ...labelsProp }), [labelsProp]);
2765
+ const ids = useFieldFrame(id, { hint, error, invalid });
2766
+ const [value, setValue] = useControllableState({
2767
+ value: props.value,
2768
+ defaultValue: props.defaultValue ?? (multiple ? [] : void 0),
2769
+ onChange: props.onValueChange
2770
+ });
2771
+ const selected = React26.useMemo(
2772
+ () => Array.isArray(value) ? value : value ? [value] : [],
2773
+ [value]
2774
+ );
2775
+ const [isOpen, setOpen] = useControllableState({
2776
+ value: open,
2777
+ defaultValue: defaultOpen,
2778
+ onChange: onOpenChange
2779
+ });
2780
+ const highlight = useCreateStore(void 0);
2781
+ const [registry] = React26.useState(createItemRegistry);
2782
+ const [query, setQuery] = React26.useState("");
2783
+ const triggerRef = React26.useRef(null);
2784
+ if (!isOpen && query !== "") setQuery("");
2785
+ const pick = React26.useCallback(
2786
+ (optionValue) => {
2787
+ if (multiple) {
2788
+ setValue((prev) => {
2789
+ const list = Array.isArray(prev) ? prev : [];
2790
+ return list.includes(optionValue) ? list.filter((item) => item !== optionValue) : [...list, optionValue];
2791
+ });
2792
+ return;
2793
+ }
2794
+ setValue(optionValue);
2795
+ setOpen(false);
2796
+ },
2797
+ [multiple, setValue, setOpen]
2798
+ );
2799
+ const clear = React26.useCallback(() => setValue(multiple ? [] : ""), [multiple, setValue]);
2800
+ const context = React26.useMemo(
2801
+ () => ({
2802
+ size,
2803
+ invalid: ids.invalid,
2804
+ focusRing,
2805
+ required,
2806
+ disabled,
2807
+ placeholder,
2808
+ multiple,
2809
+ selected,
2810
+ registry,
2811
+ pick,
2812
+ clear,
2813
+ clearable,
2814
+ loading,
2815
+ isOpen,
2816
+ setOpen,
2817
+ highlight,
2818
+ query,
2819
+ setQuery,
2820
+ triggerId: ids.controlId,
2821
+ listboxId: `${ids.controlId}-listbox`,
2822
+ describedBy: ids.describedBy,
2823
+ triggerRef,
2824
+ labels
2825
+ }),
2826
+ [
2827
+ size,
2828
+ ids.invalid,
2829
+ ids.controlId,
2830
+ ids.describedBy,
2831
+ focusRing,
2832
+ required,
2833
+ disabled,
2834
+ placeholder,
2835
+ multiple,
2836
+ selected,
2837
+ registry,
2838
+ pick,
2839
+ clear,
2840
+ clearable,
2841
+ loading,
2842
+ isOpen,
2843
+ setOpen,
2844
+ highlight,
2845
+ query,
2846
+ labels
2847
+ ]
2848
+ );
2849
+ return /* @__PURE__ */ jsx24(
2850
+ FieldFrame,
2851
+ {
2852
+ ...rest,
2853
+ size,
2854
+ ids,
2855
+ label,
2856
+ required,
2857
+ optional,
2858
+ hint,
2859
+ error,
2860
+ disabled,
2861
+ optionalLabel: labels.optional,
2862
+ className,
2863
+ children: /* @__PURE__ */ jsx24(SelectProvider, { value: context, children: /* @__PURE__ */ jsx24(ControlSizeProvider, { value: size, children }) })
2864
+ }
2865
+ );
2866
+ }
2867
+ SelectRoot.displayName = "Select.Root";
2868
+ function SelectTrigger({
2869
+ className,
2870
+ children,
2871
+ onClick: onClick2,
2872
+ onKeyDown: onKeyDown2,
2873
+ "aria-describedby": ariaDescribedBy,
2874
+ ref,
2875
+ ...rest
2876
+ }) {
2877
+ const {
2878
+ isOpen,
2879
+ setOpen,
2880
+ triggerId,
2881
+ listboxId,
2882
+ disabled,
2883
+ size,
2884
+ invalid,
2885
+ focusRing,
2886
+ required,
2887
+ describedBy,
2888
+ triggerRef,
2889
+ loading,
2890
+ clearable,
2891
+ selected,
2892
+ clear,
2893
+ labels
2894
+ } = useSelectContext();
2895
+ const mergedRef = useMergedRefs(triggerRef, ref);
2896
+ const showClear = clearable && selected.length > 0 && !disabled && !loading;
2897
+ return /* @__PURE__ */ jsxs12(
2898
+ "button",
2899
+ {
2900
+ ...rest,
2901
+ ref: mergedRef,
2902
+ id: triggerId,
2903
+ type: "button",
2904
+ role: "combobox",
2905
+ "aria-expanded": isOpen,
2906
+ "aria-haspopup": "listbox",
2907
+ "aria-controls": listboxId,
2908
+ "aria-invalid": invalid || void 0,
2909
+ "aria-required": required || void 0,
2910
+ "aria-describedby": [ariaDescribedBy, describedBy].filter(Boolean).join(" ") || void 0,
2911
+ "aria-busy": loading || void 0,
2912
+ disabled,
2913
+ className: cx(fieldTriggerClass, Select_default.trigger, className),
2914
+ onClick: (event) => {
2915
+ onClick2?.(event);
2916
+ if (!event.defaultPrevented) setOpen(!isOpen);
2917
+ },
2918
+ onKeyDown: (event) => {
2919
+ onKeyDown2?.(event);
2920
+ if (event.defaultPrevented) return;
2921
+ if (["ArrowDown", "ArrowUp", " ", "Enter"].includes(event.key)) {
2922
+ event.preventDefault();
2923
+ if (!isOpen) setOpen(true);
2924
+ } else if (showClear && (event.key === "Delete" || event.key === "Backspace")) {
2925
+ event.preventDefault();
2926
+ clear();
2927
+ }
2928
+ },
2929
+ ...toDataAttributes({
2930
+ state: isOpen ? "open" : "closed",
2931
+ size,
2932
+ invalid: invalid || void 0,
2933
+ loading: loading || void 0,
2934
+ disabled: disabled || void 0,
2935
+ "focus-ring": focusRing ? void 0 : false
2936
+ }),
2937
+ children: [
2938
+ /* @__PURE__ */ jsx24("span", { className: Select_default.triggerMain, children }),
2939
+ showClear ? (
2940
+ // A segment, not a button: interactive content inside a <button> is invalid. The keyboard
2941
+ // clears with Delete / Backspace on the trigger.
2942
+ /* @__PURE__ */ jsx24(
2943
+ "span",
2944
+ {
2945
+ className: Select_default.clear,
2946
+ "aria-hidden": "true",
2947
+ title: labels.clear,
2948
+ "data-select-clear": "",
2949
+ onMouseDown: (event) => event.preventDefault(),
2950
+ onClick: (event) => {
2951
+ event.stopPropagation();
2952
+ clear();
2953
+ },
2954
+ children: /* @__PURE__ */ jsx24(Icon, { name: "action.close" })
2955
+ }
2956
+ )
2957
+ ) : null,
2958
+ /* @__PURE__ */ jsx24("span", { className: Select_default.chevron, "aria-hidden": "true", children: loading ? /* @__PURE__ */ jsx24(Spinner, { "aria-hidden": "true" }) : /* @__PURE__ */ jsx24(Icon, { name: "nav.chevronDown" }) })
2959
+ ]
2960
+ }
2961
+ );
2962
+ }
2963
+ SelectTrigger.displayName = "Select.Trigger";
2964
+ function SelectValue({ renderValue, className, ...rest }) {
2965
+ const { selected, registry, placeholder, multiple, size } = useSelectContext();
2966
+ const text = useStoreSlice(registry.version, () => selected.map(registry.labelOf).join(", "));
2967
+ if (selected.length > 0 && renderValue && !multiple) {
2968
+ const value = selected[0] ?? "";
2969
+ const parts = splitItemChildren(renderValue({ value, label: text }));
2970
+ return /* @__PURE__ */ jsxs12(
2971
+ "span",
2972
+ {
2973
+ ...rest,
2974
+ className: cx(Select_default.value, className),
2975
+ ...toDataAttributes({ rich: parts.rich || void 0 }),
2976
+ children: [
2977
+ sizeMedia(parts.leading, size),
2978
+ /* @__PURE__ */ jsx24("span", { className: Select_default.valueBody, children: parts.body })
2979
+ ]
2980
+ }
2981
+ );
2982
+ }
2983
+ return /* @__PURE__ */ jsx24(
2984
+ "span",
2985
+ {
2986
+ ...rest,
2987
+ className: cx(Select_default.value, className),
2988
+ ...toDataAttributes({ placeholder: selected.length === 0 || void 0 }),
2989
+ children: selected.length > 0 ? text : placeholder
2990
+ }
2991
+ );
2992
+ }
2993
+ SelectValue.displayName = "Select.Value";
2994
+ function SelectTriggerIcon({ className, ...rest }) {
2995
+ return /* @__PURE__ */ jsx24("span", { "aria-hidden": "true", className: cx(Select_default.triggerIcon, className), ...rest });
2996
+ }
2997
+ SelectTriggerIcon.displayName = "Select.TriggerIcon";
2998
+ function SelectContent({ searchable = false, className, children, ...rest }) {
2999
+ const {
3000
+ isOpen,
3001
+ setOpen,
3002
+ pick,
3003
+ triggerId,
3004
+ listboxId,
3005
+ triggerRef,
3006
+ highlight,
3007
+ multiple,
3008
+ size,
3009
+ query,
3010
+ setQuery,
3011
+ loading,
3012
+ labels,
3013
+ registry
3014
+ } = useSelectContext();
3015
+ const listboxRef = React26.useRef(null);
3016
+ const floating = useFloatingLayer({
3017
+ open: isOpen,
3018
+ onOpenChange: setOpen,
3019
+ triggerRef,
3020
+ side: "bottom",
3021
+ align: "start",
3022
+ matchAnchorWidth: true,
3023
+ focusOnOpen: true,
3024
+ tabExit: "always"
3025
+ });
3026
+ const highlighted = useStoreSlice(highlight, (value) => value);
3027
+ const isEmpty = useStoreSlice(registry.version, () => !registry.anyMatch(normalize(query)));
3028
+ const typeahead = useTypeahead();
3029
+ const handleKeyDown = (event) => {
3030
+ const inSearch = event.target instanceof HTMLInputElement;
3031
+ if (inSearch && [" ", "Home", "End"].includes(event.key)) return;
3032
+ const items = enabledOptions(listboxRef.current);
3033
+ const printable = event.key.length === 1 && !event.ctrlKey && !event.metaKey && !event.altKey;
3034
+ if (printable && !inSearch && (event.key !== " " || typeahead.isTyping())) {
3035
+ event.preventDefault();
3036
+ const match = typeahead.find(event.key, items, highlight.get());
3037
+ if (match) {
3038
+ highlight.set(match.dataset.value);
3039
+ match.scrollIntoView?.({ block: "nearest" });
3040
+ }
3041
+ return;
3042
+ }
3043
+ handleListboxKeyDown(event, { items, highlight, onSelect: pick });
3044
+ };
3045
+ if (!floating.mounted) return /* @__PURE__ */ jsx24("div", { hidden: true, children });
3046
+ const activeDescendant = isOpen && highlighted !== void 0 ? optionDomId(listboxId, highlighted) : void 0;
3047
+ return /* @__PURE__ */ jsxs12(
3048
+ FloatingPanel,
3049
+ {
3050
+ ...rest,
3051
+ floating,
3052
+ size,
3053
+ className: cx(menu_default.tier, menu_default.menu, Select_default.content, className),
3054
+ onKeyDown: handleKeyDown,
3055
+ ...toDataAttributes({ searching: query !== "" || void 0 }),
3056
+ children: [
3057
+ searchable ? (
3058
+ // The permanent focus of the panel: no ring, the caret is the indicator (foundation §7).
3059
+ /* @__PURE__ */ jsxs12("div", { className: cx(menu_default.searchRow, Select_default.search), "data-focus-ring": "false", children: [
3060
+ /* @__PURE__ */ jsx24(Icon, { name: "action.search", size: "s" }),
3061
+ /* @__PURE__ */ jsx24(
3062
+ "input",
3063
+ {
3064
+ type: "text",
3065
+ className: menu_default.searchInput,
3066
+ value: query,
3067
+ placeholder: labels.search,
3068
+ "aria-label": labels.search,
3069
+ "aria-controls": listboxId,
3070
+ "aria-activedescendant": activeDescendant,
3071
+ "aria-autocomplete": "list",
3072
+ autoComplete: "off",
3073
+ spellCheck: false,
3074
+ "data-autofocus": "",
3075
+ onChange: (event) => setQuery(event.target.value)
3076
+ }
3077
+ )
3078
+ ] })
3079
+ ) : null,
3080
+ loading ? /* @__PURE__ */ jsxs12("div", { className: Select_default.status, role: "status", children: [
3081
+ /* @__PURE__ */ jsx24(Spinner, { "aria-hidden": "true" }),
3082
+ labels.loading
3083
+ ] }) : null,
3084
+ /* @__PURE__ */ jsx24(
3085
+ ScrollContainer,
3086
+ {
3087
+ ref: listboxRef,
3088
+ id: listboxId,
3089
+ role: "listbox",
3090
+ "aria-multiselectable": multiple || void 0,
3091
+ "aria-labelledby": triggerId,
3092
+ "aria-activedescendant": searchable ? void 0 : activeDescendant,
3093
+ "aria-busy": loading || void 0,
3094
+ tabIndex: -1,
3095
+ "data-autofocus": searchable ? void 0 : "",
3096
+ className: Select_default.listbox,
3097
+ children
3098
+ }
3099
+ ),
3100
+ isEmpty && !loading ? /* @__PURE__ */ jsxs12(EmptyPage.Root, { layout: "compact", role: "status", children: [
3101
+ /* @__PURE__ */ jsx24(EmptyPage.Title, { as: "p", children: labels.empty }),
3102
+ query !== "" && labels.emptyHint ? /* @__PURE__ */ jsx24(EmptyPage.Description, { children: labels.emptyHint }) : null
3103
+ ] }) : null,
3104
+ /* @__PURE__ */ jsx24(HighlightOnOpen, { listboxRef, highlight })
3105
+ ]
3106
+ }
3107
+ );
3108
+ }
3109
+ SelectContent.displayName = "Select.Content";
3110
+ function HighlightOnOpen({
3111
+ listboxRef,
3112
+ highlight
3113
+ }) {
3114
+ const { isOpen, query, selected } = useSelectContext();
3115
+ const selectedRef = React26.useRef(selected);
3116
+ selectedRef.current = selected;
3117
+ React26.useLayoutEffect(() => {
3118
+ if (!isOpen) return;
3119
+ const options = enabledOptions(listboxRef.current);
3120
+ const first = options.find((item) => selectedRef.current.includes(item.dataset.value ?? ""));
3121
+ highlight.set(first?.dataset.value);
3122
+ first?.scrollIntoView?.({ block: "nearest" });
3123
+ return () => highlight.set(void 0);
3124
+ }, [isOpen, listboxRef, highlight]);
3125
+ React26.useLayoutEffect(() => {
3126
+ if (query !== "") highlight.set(enabledOptions(listboxRef.current)[0]?.dataset.value);
3127
+ }, [query, listboxRef, highlight]);
3128
+ return null;
3129
+ }
3130
+ function SelectGroup({ className, ...rest }) {
3131
+ return /* @__PURE__ */ jsx24(MenuGroup, { ...rest, className: cx(Select_default.group, className) });
3132
+ }
3133
+ SelectGroup.displayName = "Select.Group";
3134
+ function SelectSeparator({ className, ...rest }) {
3135
+ return /* @__PURE__ */ jsx24(Divider, { ...rest, className: cx(menu_default.separator, Select_default.separator, className) });
3136
+ }
3137
+ SelectSeparator.displayName = "Select.Separator";
3138
+ var Select = {
3139
+ Root: SelectRoot,
3140
+ Trigger: SelectTrigger,
3141
+ Value: SelectValue,
3142
+ TriggerIcon: SelectTriggerIcon,
3143
+ Content: SelectContent,
3144
+ Item: SelectItem,
3145
+ ItemIcon: SelectItemIcon,
3146
+ ItemText: SelectItemText,
3147
+ ItemDescription: SelectItemDescription,
3148
+ ItemMeta: SelectItemMeta,
3149
+ Group: SelectGroup,
3150
+ Separator: SelectSeparator
3151
+ };
3152
+
3153
+ export {
3154
+ ControlSizeProvider,
3155
+ useOptionalControlSize,
3156
+ useControlSize,
3157
+ useMergedRefs,
3158
+ cx,
3159
+ toDataAttributes,
3160
+ ScrollContainer,
3161
+ createComponentContext,
3162
+ createImageSlot,
3163
+ palette_default,
3164
+ textTone_default,
3165
+ Icon,
3166
+ createIcon,
3167
+ fieldSurfaceClass,
3168
+ fieldTierClass,
3169
+ fieldTriggerClass,
3170
+ iconLayout,
3171
+ Slot,
3172
+ visuallyHiddenClass,
3173
+ VisuallyHidden,
3174
+ Spinner,
3175
+ Button,
3176
+ useControllableState,
3177
+ overlayMotion_default,
3178
+ Portal,
3179
+ focusInto,
3180
+ focusBack,
3181
+ activeElement,
3182
+ LayerProvider,
3183
+ useLayer,
3184
+ FloatingPanel,
3185
+ FloatingTrigger,
3186
+ AnchorRectProvider,
3187
+ readCssLengthPx,
3188
+ getViewportPadPx,
3189
+ prefersReducedMotion,
3190
+ motionDurationMs,
3191
+ exitTimeoutMs,
3192
+ usePresence,
3193
+ useFloatingLayer,
3194
+ rovingIndex,
3195
+ gridIndex,
3196
+ controlSizes,
3197
+ stepDown,
3198
+ variants,
3199
+ tones,
3200
+ paletteColors,
3201
+ dataStates,
3202
+ textTones,
3203
+ enterMotion_default,
3204
+ Hint,
3205
+ choiceInputClass,
3206
+ choiceVisualClass,
3207
+ ChoiceField,
3208
+ ChoiceLabel,
3209
+ Label,
3210
+ formatLabel,
3211
+ useFieldFrame,
3212
+ FieldFrame,
3213
+ FieldCounter,
3214
+ Checkbox,
3215
+ COLOR_PRESETS,
3216
+ useSwatchOptions,
3217
+ swatchClass,
3218
+ swatchTierClass,
3219
+ SwatchFill,
3220
+ SwatchContent,
3221
+ SwatchChip,
3222
+ sameColor,
3223
+ ColorSwatches,
3224
+ EmptyPage,
3225
+ matchIndex,
3226
+ HighlightMatch,
3227
+ highlightChildren,
3228
+ optionDomId,
3229
+ enabledOptions,
3230
+ useCreateStore,
3231
+ useStoreSlice,
3232
+ handleListboxKeyDown,
3233
+ menu_default,
3234
+ MenuGroup,
3235
+ Divider,
3236
+ Input,
3237
+ Thumbnail,
3238
+ Select
3239
+ };