prime-ui-kit 0.9.0 → 0.9.2

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