prime-ui-kit 0.15.0 → 0.17.0

This diff represents the content of publicly available package versions that have been released to one of the supported registries. The information contained in this diff is provided for informational purposes only and reflects changes between package versions as they appear in their respective public registries.
Files changed (1190) hide show
  1. package/README.md +79 -74
  2. package/dist/chunks/{chunk-Q3BFRQHZ.js → chunk-2ODXLPW3.js} +169 -10
  3. package/dist/chunks/{chunk-XJAVS6FH.js → chunk-7WWZYGRC.js} +5482 -4179
  4. package/dist/chunks/{chunk-THFZIHKU.js → chunk-A4WE3UNC.js} +28219 -27605
  5. package/dist/chunks/{chunk-6TI4DSM5.js → chunk-PRP4B6OG.js} +1 -1
  6. package/dist/chunks/{chunk-2IKH55MI.js → chunk-SVFWPLNW.js} +215 -154
  7. package/dist/color-picker.d.ts +1 -1
  8. package/dist/color-picker.js +3 -3
  9. package/dist/components/accordion/Accordion.d.ts +52 -5
  10. package/dist/components/avatar/Avatar.d.ts +31 -8
  11. package/dist/components/badge/Badge.d.ts +93 -25
  12. package/dist/components/banner/Banner.d.ts +17 -10
  13. package/dist/components/breadcrumb/Breadcrumb.d.ts +18 -5
  14. package/dist/components/button/Button.d.ts +102 -43
  15. package/dist/components/button-group/ButtonGroup.d.ts +32 -8
  16. package/dist/components/card/Card.d.ts +15 -9
  17. package/dist/components/chart-frame/ChartFrame.d.ts +58 -51
  18. package/dist/components/chat/Chat.d.ts +77 -38
  19. package/dist/components/chat/ChatPinned.d.ts +20 -8
  20. package/dist/components/chat/ChatRows.d.ts +8 -1
  21. package/dist/components/chat/MessageList.d.ts +14 -19
  22. package/dist/components/chat/chatContext.d.ts +3 -3
  23. package/dist/components/chat/messageFlow.d.ts +1 -1
  24. package/dist/components/chat-list/ChatList.d.ts +88 -34
  25. package/dist/components/checkbox/Checkbox.d.ts +61 -12
  26. package/dist/components/code-block/CodeBlock.d.ts +11 -5
  27. package/dist/components/color-field/ColorField.d.ts +54 -14
  28. package/dist/components/color-picker/ColorPicker.d.ts +81 -30
  29. package/dist/components/color-picker/ColorPresets.d.ts +68 -13
  30. package/dist/components/color-swatches/ColorSwatches.d.ts +90 -18
  31. package/dist/components/command-menu/CommandMenu.d.ts +86 -27
  32. package/dist/components/composer/Composer.d.ts +82 -41
  33. package/dist/components/composer/useRecorder.d.ts +0 -2
  34. package/dist/components/confirm-dialog/ConfirmDialog.d.ts +40 -16
  35. package/dist/components/crossfade/Crossfade.d.ts +5 -8
  36. package/dist/components/data-table/ColumnsMenu.d.ts +6 -2
  37. package/dist/components/data-table/DataTable.d.ts +157 -58
  38. package/dist/components/data-table/Footer.d.ts +2 -4
  39. package/dist/components/data-table/Row.d.ts +1 -1
  40. package/dist/components/data-table/StateRows.d.ts +2 -2
  41. package/dist/components/data-table/reorder.d.ts +10 -10
  42. package/dist/components/data-table/types.d.ts +5 -0
  43. package/dist/components/data-table/useInfiniteRows.d.ts +3 -3
  44. package/dist/components/datepicker/Datepicker.d.ts +61 -12
  45. package/dist/components/datepicker/DatepickerPanel.d.ts +76 -16
  46. package/dist/components/datepicker/panelLayout.d.ts +6 -11
  47. package/dist/components/description-list/DescriptionList.d.ts +40 -11
  48. package/dist/components/digit-input/DigitInput.d.ts +50 -19
  49. package/dist/components/divider/Divider.d.ts +15 -5
  50. package/dist/components/dnd/Dnd.d.ts +152 -41
  51. package/dist/components/dnd/geometry.d.ts +0 -8
  52. package/dist/components/dnd/labels.d.ts +1 -1
  53. package/dist/components/dnd/useDropTarget.d.ts +0 -2
  54. package/dist/components/dnd/useSortableList.d.ts +6 -1
  55. package/dist/components/drawer/Drawer.d.ts +39 -18
  56. package/dist/components/dropdown/Dropdown.d.ts +90 -19
  57. package/dist/components/empty-page/EmptyPage.d.ts +14 -15
  58. package/dist/components/example-frame/ExampleFrame.d.ts +38 -8
  59. package/dist/components/field-list/FieldList.d.ts +57 -19
  60. package/dist/components/fieldset/Fieldset.d.ts +12 -7
  61. package/dist/components/file-upload/FileUpload.d.ts +119 -42
  62. package/dist/components/gallery/Gallery.d.ts +44 -16
  63. package/dist/components/gallery/layout.d.ts +4 -1
  64. package/dist/components/gantt/Gantt.d.ts +69 -34
  65. package/dist/components/gantt/GanttRow.d.ts +2 -2
  66. package/dist/components/hint/Hint.d.ts +10 -4
  67. package/dist/components/index.d.ts +18 -21
  68. package/dist/components/input/Input.d.ts +78 -25
  69. package/dist/components/kanban/Kanban.d.ts +64 -36
  70. package/dist/components/kbd/Kbd.d.ts +3 -1
  71. package/dist/components/label/Label.d.ts +33 -4
  72. package/dist/components/link-button/LinkButton.d.ts +40 -10
  73. package/dist/components/list/List.d.ts +48 -26
  74. package/dist/components/login-form/LoginForm.d.ts +66 -7
  75. package/dist/components/media-viewer/MediaViewer.d.ts +46 -18
  76. package/dist/components/media-viewer/physics.d.ts +0 -2
  77. package/dist/components/media-viewer/viewerEngine.d.ts +0 -1
  78. package/dist/components/message/Message.d.ts +27 -16
  79. package/dist/components/message/MessageCards.d.ts +49 -10
  80. package/dist/components/message/MessageFile.d.ts +19 -5
  81. package/dist/components/message/MessageParts.d.ts +44 -18
  82. package/dist/components/message/MessageReactionBar.d.ts +3 -1
  83. package/dist/components/message/MessageTyping.d.ts +10 -6
  84. package/dist/components/message/bubbleMorph.d.ts +2 -0
  85. package/dist/components/modal/Modal.d.ts +6 -6
  86. package/dist/components/native-select/NativeSelect.d.ts +22 -7
  87. package/dist/components/notification/Notification.d.ts +35 -11
  88. package/dist/components/notification/NotificationStore.d.ts +12 -3
  89. package/dist/components/pagination/Pagination.d.ts +29 -6
  90. package/dist/components/popover/Popover.d.ts +54 -31
  91. package/dist/components/progress-bar/ProgressBar.d.ts +37 -12
  92. package/dist/components/progress-circle/ProgressCircle.d.ts +32 -13
  93. package/dist/components/radio/Radio.d.ts +58 -15
  94. package/dist/components/scroll-container/ScrollContainer.d.ts +28 -14
  95. package/dist/components/scroll-container/useScrollEdges.d.ts +1 -24
  96. package/dist/components/segmented-control/SegmentedControl.d.ts +73 -15
  97. package/dist/components/select/Select.d.ts +104 -30
  98. package/dist/components/select/SelectItem.d.ts +35 -8
  99. package/dist/components/select/selectContext.d.ts +7 -19
  100. package/dist/components/sheet/Sheet.d.ts +32 -15
  101. package/dist/components/skeleton/Skeleton.d.ts +9 -3
  102. package/dist/components/slider/Slider.d.ts +55 -15
  103. package/dist/components/smart-filter/SmartFilter.d.ts +39 -13
  104. package/dist/components/sparkline/Sparkline.d.ts +42 -19
  105. package/dist/components/spinner/Spinner.d.ts +11 -5
  106. package/dist/components/stepper/Stepper.d.ts +41 -19
  107. package/dist/components/switch/Switch.d.ts +37 -12
  108. package/dist/components/tabs/Tabs.d.ts +61 -18
  109. package/dist/components/tag-select/TagSelect.d.ts +74 -20
  110. package/dist/components/textarea/Textarea.d.ts +52 -25
  111. package/dist/components/thumbnail/Thumbnail.d.ts +50 -20
  112. package/dist/components/timeline/Timeline.d.ts +85 -66
  113. package/dist/components/tooltip/Tooltip.d.ts +47 -17
  114. package/dist/components/typography/Typography.d.ts +32 -6
  115. package/dist/components/video-note/VideoNote.d.ts +7 -1
  116. package/dist/{internal → components/visually-hidden}/VisuallyHidden.d.ts +5 -5
  117. package/dist/components/voice-player/VoicePlayer.d.ts +16 -3
  118. package/dist/hooks/breakpoints.d.ts +10 -0
  119. package/dist/hooks/floatingPosition.d.ts +42 -0
  120. package/dist/hooks/useDraft.d.ts +12 -0
  121. package/dist/hooks/useEdgeOverflow.d.ts +5 -3
  122. package/dist/hooks/useElementSize.d.ts +31 -0
  123. package/dist/hooks/useEnterConfirm.d.ts +2 -1
  124. package/dist/hooks/useImageStatus.d.ts +12 -5
  125. package/dist/hooks/useLoadMore.d.ts +28 -0
  126. package/dist/hooks/useMediaQuery.d.ts +1 -3
  127. package/dist/hooks/useMergedRefs.d.ts +10 -4
  128. package/dist/hooks/useModalLayer.d.ts +13 -7
  129. package/dist/hooks/usePosition.d.ts +4 -42
  130. package/dist/hooks/usePresence.d.ts +4 -7
  131. package/dist/hooks/useScrollRegion.d.ts +28 -0
  132. package/dist/hooks/useStableValue.d.ts +6 -0
  133. package/dist/hooks/useSwipeDismiss.d.ts +38 -17
  134. package/dist/hooks/useVirtualRows.d.ts +9 -3
  135. package/dist/icon-set.js +2 -2
  136. package/dist/icons/Icon.d.ts +1 -1
  137. package/dist/icons/glyph.d.ts +9 -2
  138. package/dist/index.css +1 -1
  139. package/dist/index.js +15 -9
  140. package/dist/internal/AnchorRectContext.d.ts +2 -1
  141. package/dist/internal/ChartTooltip.d.ts +1 -1
  142. package/dist/internal/CheckMark.d.ts +2 -2
  143. package/dist/internal/ChoiceField.d.ts +29 -10
  144. package/dist/internal/ControlSizeContext.d.ts +16 -0
  145. package/dist/internal/Disclosure.d.ts +38 -9
  146. package/dist/internal/FieldAction.d.ts +20 -12
  147. package/dist/internal/FieldCommit.d.ts +8 -11
  148. package/dist/internal/FieldFrame.d.ts +100 -21
  149. package/dist/internal/MenuGroup.d.ts +3 -1
  150. package/dist/internal/MorphText.d.ts +2 -1
  151. package/dist/internal/ProgressLegend.d.ts +3 -2
  152. package/dist/internal/RegionSwap.d.ts +41 -0
  153. package/dist/internal/RollingNumber.d.ts +10 -1
  154. package/dist/internal/RowAction.d.ts +26 -0
  155. package/dist/internal/SwitcherScroller.d.ts +11 -0
  156. package/dist/internal/attachmentTile.d.ts +1 -1
  157. package/dist/internal/audio.d.ts +13 -0
  158. package/dist/internal/barPlan.d.ts +44 -0
  159. package/dist/{components/badge/tier.d.ts → internal/chipTier.d.ts} +7 -5
  160. package/dist/internal/context.d.ts +10 -1
  161. package/dist/internal/controlValue.d.ts +7 -0
  162. package/dist/internal/edgeAutoScroll.d.ts +43 -25
  163. package/dist/internal/fieldCell.d.ts +4 -3
  164. package/dist/internal/fieldClasses.d.ts +15 -2
  165. package/dist/internal/fileSize.d.ts +5 -1
  166. package/dist/internal/formatClock.d.ts +2 -0
  167. package/dist/internal/formatNumber.d.ts +6 -0
  168. package/dist/internal/glyphSwap.d.ts +5 -9
  169. package/dist/internal/hasContent.d.ts +6 -0
  170. package/dist/internal/highlightTsx.d.ts +12 -0
  171. package/dist/internal/iconBox.d.ts +6 -0
  172. package/dist/internal/iconLayout.d.ts +2 -1
  173. package/dist/internal/imageSlot.d.ts +6 -1
  174. package/dist/internal/interactiveElement.d.ts +41 -0
  175. package/dist/internal/labels.d.ts +6 -0
  176. package/dist/internal/leaveInPlace.d.ts +6 -5
  177. package/dist/internal/listPresence.d.ts +32 -0
  178. package/dist/internal/listbox.d.ts +71 -31
  179. package/dist/internal/longPress.d.ts +42 -0
  180. package/dist/internal/mediaDisk.d.ts +7 -4
  181. package/dist/internal/mediaPlayer.d.ts +91 -27
  182. package/dist/internal/mediaSession.d.ts +0 -6
  183. package/dist/internal/messageList.d.ts +4 -3
  184. package/dist/internal/motionTiming.d.ts +34 -0
  185. package/dist/internal/namedRole.d.ts +13 -0
  186. package/dist/internal/nodeText.d.ts +6 -0
  187. package/dist/{components/modal → internal/overlay}/DialogGuard.d.ts +3 -5
  188. package/dist/{components/modal → internal/overlay}/DialogParts.d.ts +86 -89
  189. package/dist/internal/overlay/FloatingPanel.d.ts +27 -5
  190. package/dist/internal/overlay/ModalDialog.d.ts +59 -0
  191. package/dist/internal/overlay/focus.d.ts +31 -6
  192. package/dist/internal/overlay/layerStack.d.ts +8 -5
  193. package/dist/internal/overlay/useAnchorName.d.ts +14 -0
  194. package/dist/internal/overlay/useContainScroll.d.ts +7 -0
  195. package/dist/internal/overlay/useFloatingLayer.d.ts +43 -14
  196. package/dist/internal/overlay/useOpenState.d.ts +22 -0
  197. package/dist/internal/partPresence.d.ts +31 -0
  198. package/dist/internal/parts.d.ts +39 -0
  199. package/dist/internal/progressSegments.d.ts +52 -12
  200. package/dist/internal/richText.d.ts +6 -34
  201. package/dist/internal/ring.d.ts +18 -8
  202. package/dist/internal/rovingFocus.d.ts +10 -5
  203. package/dist/{components/data-table/rowEvents.d.ts → internal/rowLink.d.ts} +0 -5
  204. package/dist/internal/scrollAncestors.d.ts +14 -0
  205. package/dist/internal/selectionIndicator.d.ts +27 -0
  206. package/dist/internal/slot.d.ts +23 -5
  207. package/dist/internal/states.d.ts +61 -0
  208. package/dist/internal/sticky.d.ts +5 -1
  209. package/dist/internal/swallowNextClick.d.ts +9 -0
  210. package/dist/internal/swatch.d.ts +59 -15
  211. package/dist/internal/textFormatting.d.ts +2 -1
  212. package/dist/internal/textFormattingToolbar.d.ts +3 -2
  213. package/dist/internal/tokenDefaults.d.ts +21 -0
  214. package/dist/internal/touchTarget.d.ts +5 -0
  215. package/dist/internal/transcript.d.ts +19 -18
  216. package/dist/internal/transfer.d.ts +22 -8
  217. package/dist/internal/transferDisk.d.ts +2 -3
  218. package/dist/internal/useFlipList.d.ts +44 -0
  219. package/dist/internal/useNearView.d.ts +4 -3
  220. package/dist/internal/usePendingChanges.d.ts +23 -0
  221. package/dist/internal/useRangeSelection.d.ts +2 -1
  222. package/dist/layout/app-shell/AppShell.d.ts +63 -18
  223. package/dist/layout/bottom-nav/BottomNav.d.ts +58 -22
  224. package/dist/layout/index.d.ts +4 -4
  225. package/dist/layout/page/Page.d.ts +263 -0
  226. package/dist/layout/sidebar/Sidebar.d.ts +232 -101
  227. package/dist/skill/SKILL.md +16 -16
  228. package/dist/skill/anti-slop.md +204 -27
  229. package/dist/skill/api-contract.md +115 -35
  230. package/dist/skill/cheatsheet.md +60 -55
  231. package/dist/skill/checklist.md +61 -89
  232. package/dist/skill/choosing.md +26 -27
  233. package/dist/skill/components.md +50 -50
  234. package/dist/skill/composition.md +220 -185
  235. package/dist/skill/foundations.md +39 -32
  236. package/dist/skill/layouts.md +82 -143
  237. package/dist/skill/motion.md +26 -31
  238. package/dist/skill/reference/components/accordion/COMPONENT.md +16 -9
  239. package/dist/skill/reference/components/accordion/examples/overview.tsx +2 -2
  240. package/dist/skill/reference/components/accordion/examples/sizes.tsx +6 -8
  241. package/dist/skill/reference/components/accordion/examples/states.tsx +27 -24
  242. package/dist/skill/reference/components/accordion/examples/variants.tsx +6 -8
  243. package/dist/skill/reference/components/accordion/examples/with-icon.tsx +22 -19
  244. package/dist/skill/reference/components/avatar/COMPONENT.md +24 -17
  245. package/dist/skill/reference/components/avatar/examples/examples.module.css +1 -4
  246. package/dist/skill/reference/components/avatar/examples/overview.tsx +3 -3
  247. package/dist/skill/reference/components/avatar/examples/presence.tsx +4 -4
  248. package/dist/skill/reference/components/avatar/examples/src-from-state.tsx +3 -3
  249. package/dist/skill/reference/components/avatar/examples/states.tsx +4 -4
  250. package/dist/skill/reference/components/avatar/examples/team-group.tsx +3 -3
  251. package/dist/skill/reference/components/badge/COMPONENT.md +66 -34
  252. package/dist/skill/reference/components/badge/examples/controlled.tsx +32 -0
  253. package/dist/skill/reference/components/badge/examples/examples.module.css +2 -2
  254. package/dist/skill/reference/components/badge/examples/filter-values.tsx +4 -6
  255. package/dist/skill/reference/components/badge/examples/in-controls.tsx +1 -1
  256. package/dist/skill/reference/components/badge/examples/overview.tsx +6 -5
  257. package/dist/skill/reference/components/badge/examples/square.tsx +21 -0
  258. package/dist/skill/reference/components/badge/examples/states.tsx +4 -4
  259. package/dist/skill/reference/components/badge/examples/with-icon.tsx +10 -1
  260. package/dist/skill/reference/components/banner/COMPONENT.md +13 -9
  261. package/dist/skill/reference/components/banner/examples/dismissible.tsx +3 -19
  262. package/dist/skill/reference/components/banner/examples/examples.module.css +6 -1
  263. package/dist/skill/reference/components/banner/examples/overview.tsx +1 -1
  264. package/dist/skill/reference/components/banner/examples/page-strip.tsx +24 -22
  265. package/dist/skill/reference/components/breadcrumb/COMPONENT.md +23 -16
  266. package/dist/skill/reference/components/breadcrumb/examples/examples.module.css +1 -1
  267. package/dist/skill/reference/components/breadcrumb/examples/overflow.tsx +1 -1
  268. package/dist/skill/reference/components/breadcrumb/examples/sizes.tsx +6 -8
  269. package/dist/skill/reference/components/breadcrumb/examples/with-icon.tsx +15 -8
  270. package/dist/skill/reference/components/button/COMPONENT.md +67 -30
  271. package/dist/skill/reference/components/button/examples/align.tsx +25 -0
  272. package/dist/skill/reference/components/button/examples/controlled.tsx +21 -0
  273. package/dist/skill/reference/components/button/examples/density.tsx +45 -0
  274. package/dist/skill/reference/components/button/examples/examples.module.css +14 -25
  275. package/dist/skill/reference/components/button/examples/hold-to-confirm.tsx +1 -1
  276. package/dist/skill/reference/components/button/examples/label-morph.tsx +1 -1
  277. package/dist/skill/reference/components/button/examples/on-colored-host.tsx +19 -19
  278. package/dist/skill/reference/components/button/examples/over-media.tsx +7 -1
  279. package/dist/skill/reference/components/button/examples/toggle.tsx +2 -10
  280. package/dist/skill/reference/components/button-group/COMPONENT.md +21 -15
  281. package/dist/skill/reference/components/button-group/examples/controlled.tsx +1 -1
  282. package/dist/skill/reference/components/card/COMPONENT.md +21 -10
  283. package/dist/skill/reference/components/card/examples/content-templates.tsx +8 -2
  284. package/dist/skill/reference/components/card/examples/examples.module.css +4 -16
  285. package/dist/skill/reference/components/card/examples/overview.tsx +11 -11
  286. package/dist/skill/reference/components/card/examples/screen.module.css +1 -1
  287. package/dist/skill/reference/components/card/examples/screen.tsx +185 -198
  288. package/dist/skill/reference/components/card/examples/variants.tsx +74 -47
  289. package/dist/skill/reference/components/chart-frame/COMPONENT.md +24 -28
  290. package/dist/skill/reference/components/chart-frame/examples/controlled.tsx +9 -7
  291. package/dist/skill/reference/components/chart-frame/examples/fill-height.tsx +13 -15
  292. package/dist/skill/reference/components/chart-frame/examples/narrow.tsx +24 -5
  293. package/dist/skill/reference/components/chart-frame/examples/overview.tsx +5 -2
  294. package/dist/skill/reference/components/chart-frame/examples/states.tsx +72 -64
  295. package/dist/skill/reference/components/chart-frame/examples/tooltip.tsx +27 -26
  296. package/dist/skill/reference/components/chat/COMPONENT.md +39 -26
  297. package/dist/skill/reference/components/chat/examples/group-chat.tsx +2 -2
  298. package/dist/skill/reference/components/chat/examples/overview.tsx +119 -130
  299. package/dist/skill/reference/components/chat/examples/reactions.tsx +18 -23
  300. package/dist/skill/reference/components/chat/examples/screen.module.css +1 -1
  301. package/dist/skill/reference/components/chat/examples/screen.tsx +212 -242
  302. package/dist/skill/reference/components/chat/examples/states.tsx +23 -22
  303. package/dist/skill/reference/components/chat-list/COMPONENT.md +11 -6
  304. package/dist/skill/reference/components/chat-list/examples/controlled.tsx +2 -2
  305. package/dist/skill/reference/components/chat-list/examples/examples.module.css +8 -8
  306. package/dist/skill/reference/components/chat-list/examples/live.tsx +29 -22
  307. package/dist/skill/reference/components/chat-list/examples/sizes.tsx +6 -8
  308. package/dist/skill/reference/components/chat-list/examples/states.tsx +42 -38
  309. package/dist/skill/reference/components/checkbox/COMPONENT.md +27 -14
  310. package/dist/skill/reference/components/checkbox/examples/controlled.tsx +18 -16
  311. package/dist/skill/reference/components/checkbox/examples/examples.module.css +15 -56
  312. package/dist/skill/reference/components/checkbox/examples/in-form.tsx +16 -16
  313. package/dist/skill/reference/components/checkbox/examples/indicator.tsx +19 -64
  314. package/dist/skill/reference/components/checkbox/examples/overview.tsx +1 -1
  315. package/dist/skill/reference/components/checkbox/examples/states.tsx +1 -1
  316. package/dist/skill/reference/components/checkbox/examples/without-label.tsx +1 -1
  317. package/dist/skill/reference/components/code-block/COMPONENT.md +16 -12
  318. package/dist/skill/reference/components/code-block/examples/color-scheme.tsx +2 -4
  319. package/dist/skill/reference/components/code-block/examples/examples.module.css +1 -9
  320. package/dist/skill/reference/components/code-block/examples/narrow.tsx +1 -1
  321. package/dist/skill/reference/components/color-field/COMPONENT.md +15 -9
  322. package/dist/skill/reference/components/color-field/examples/examples.module.css +4 -5
  323. package/dist/skill/reference/components/color-field/examples/in-form.tsx +15 -13
  324. package/dist/skill/reference/components/color-field/examples/sizes.tsx +5 -1
  325. package/dist/skill/reference/components/color-field/examples/states.tsx +15 -3
  326. package/dist/skill/reference/components/color-picker/COMPONENT.md +69 -22
  327. package/dist/skill/reference/components/color-picker/examples/controlled.tsx +16 -5
  328. package/dist/skill/reference/components/color-picker/examples/examples.module.css +8 -12
  329. package/dist/skill/reference/components/color-picker/examples/in-form.tsx +24 -22
  330. package/dist/skill/reference/components/color-picker/examples/overview.tsx +6 -11
  331. package/dist/skill/reference/components/color-picker/examples/panel.tsx +1 -1
  332. package/dist/skill/reference/components/color-picker/examples/sizes.tsx +10 -16
  333. package/dist/skill/reference/components/color-picker/examples/states.tsx +28 -23
  334. package/dist/skill/reference/components/color-swatches/COMPONENT.md +22 -8
  335. package/dist/skill/reference/components/color-swatches/examples/examples.module.css +3 -4
  336. package/dist/skill/reference/components/color-swatches/examples/in-form.tsx +19 -17
  337. package/dist/skill/reference/components/color-swatches/examples/palette.tsx +24 -0
  338. package/dist/skill/reference/components/color-swatches/examples/wrapping.tsx +17 -2
  339. package/dist/skill/reference/components/command-menu/COMPONENT.md +60 -20
  340. package/dist/skill/reference/components/command-menu/examples/sizes.tsx +20 -15
  341. package/dist/skill/reference/components/command-menu/examples/states.tsx +46 -24
  342. package/dist/skill/reference/components/composer/COMPONENT.md +42 -24
  343. package/dist/skill/reference/components/composer/examples/examples.module.css +0 -9
  344. package/dist/skill/reference/components/composer/examples/narrow.tsx +1 -1
  345. package/dist/skill/reference/components/composer/examples/reply-edit.tsx +3 -3
  346. package/dist/skill/reference/components/composer/examples/sizes.tsx +3 -5
  347. package/dist/skill/reference/components/composer/examples/states.tsx +4 -6
  348. package/dist/skill/reference/components/confirm-dialog/COMPONENT.md +26 -13
  349. package/dist/skill/reference/components/confirm-dialog/examples/dismiss.tsx +27 -0
  350. package/dist/skill/reference/components/confirm-dialog/examples/failure.tsx +9 -16
  351. package/dist/skill/reference/components/crossfade/COMPONENT.md +13 -7
  352. package/dist/skill/reference/components/crossfade/examples/examples.module.css +1 -40
  353. package/dist/skill/reference/components/crossfade/examples/fill.tsx +16 -19
  354. package/dist/skill/reference/components/crossfade/examples/overview.tsx +14 -16
  355. package/dist/skill/reference/components/crossfade/examples/record-switch.tsx +6 -11
  356. package/dist/skill/reference/components/crossfade/examples/screen.module.css +1 -24
  357. package/dist/skill/reference/components/crossfade/examples/screen.tsx +108 -124
  358. package/dist/skill/reference/components/data-table/COMPONENT.md +36 -26
  359. package/dist/skill/reference/components/data-table/examples/controlled.tsx +14 -2
  360. package/dist/skill/reference/components/data-table/examples/examples.module.css +10 -9
  361. package/dist/skill/reference/components/data-table/examples/narrow.tsx +5 -1
  362. package/dist/skill/reference/components/data-table/examples/row-link.tsx +2 -1
  363. package/dist/skill/reference/components/data-table/examples/screen.module.css +2 -2
  364. package/dist/skill/reference/components/data-table/examples/screen.tsx +53 -62
  365. package/dist/skill/reference/components/data-table/examples/server.tsx +6 -2
  366. package/dist/skill/reference/components/data-table/examples/sizes.tsx +17 -17
  367. package/dist/skill/reference/components/data-table/examples/states.tsx +37 -29
  368. package/dist/skill/reference/components/datepicker/COMPONENT.md +53 -22
  369. package/dist/skill/reference/components/datepicker/examples/dismiss.tsx +15 -0
  370. package/dist/skill/reference/components/datepicker/examples/examples.module.css +9 -2
  371. package/dist/skill/reference/components/datepicker/examples/in-form.tsx +33 -25
  372. package/dist/skill/reference/components/datepicker/examples/inline-panel.tsx +3 -1
  373. package/dist/skill/reference/components/datepicker/examples/sizes.tsx +2 -2
  374. package/dist/skill/reference/components/datepicker/examples/states.tsx +2 -2
  375. package/dist/skill/reference/components/datepicker/examples/validation.tsx +3 -3
  376. package/dist/skill/reference/components/description-list/COMPONENT.md +24 -9
  377. package/dist/skill/reference/components/description-list/examples/examples.module.css +4 -24
  378. package/dist/skill/reference/components/description-list/examples/narrow.tsx +1 -1
  379. package/dist/skill/reference/components/description-list/examples/screen.module.css +0 -18
  380. package/dist/skill/reference/components/description-list/examples/screen.tsx +119 -134
  381. package/dist/skill/reference/components/description-list/examples/sizes.tsx +2 -4
  382. package/dist/skill/reference/components/description-list/examples/structure.tsx +6 -7
  383. package/dist/skill/reference/components/description-list/examples/totals.tsx +40 -0
  384. package/dist/skill/reference/components/digit-input/COMPONENT.md +12 -6
  385. package/dist/skill/reference/components/digit-input/examples/examples.module.css +2 -2
  386. package/dist/skill/reference/components/digit-input/examples/grouped.tsx +4 -4
  387. package/dist/skill/reference/components/digit-input/examples/in-form.tsx +1 -1
  388. package/dist/skill/reference/components/digit-input/examples/sizes.tsx +5 -3
  389. package/dist/skill/reference/components/digit-input/examples/states.tsx +14 -6
  390. package/dist/skill/reference/components/digit-input/examples/validation.tsx +1 -1
  391. package/dist/skill/reference/components/divider/COMPONENT.md +28 -14
  392. package/dist/skill/reference/components/divider/examples/align.tsx +2 -4
  393. package/dist/skill/reference/components/divider/examples/examples.module.css +16 -17
  394. package/dist/skill/reference/components/divider/examples/or-separator.tsx +3 -5
  395. package/dist/skill/reference/components/divider/examples/overview.tsx +18 -16
  396. package/dist/skill/reference/components/divider/examples/vertical.tsx +25 -8
  397. package/dist/skill/reference/components/divider/examples/with-icon.tsx +1 -1
  398. package/dist/skill/reference/components/dnd/COMPONENT.md +52 -34
  399. package/dist/skill/reference/components/dnd/examples/drop-zones.tsx +1 -1
  400. package/dist/skill/reference/components/dnd/examples/examples.module.css +7 -7
  401. package/dist/skill/reference/components/dnd/examples/states.tsx +41 -35
  402. package/dist/skill/reference/components/drawer/COMPONENT.md +38 -15
  403. package/dist/skill/reference/components/drawer/examples/guard.tsx +1 -3
  404. package/dist/skill/reference/components/drawer/examples/header-actions.tsx +1 -1
  405. package/dist/skill/reference/components/drawer/examples/in-form.tsx +31 -31
  406. package/dist/skill/reference/components/drawer/examples/placement.tsx +1 -1
  407. package/dist/skill/reference/components/drawer/examples/screen.tsx +137 -160
  408. package/dist/skill/reference/components/drawer/examples/sizes.tsx +32 -27
  409. package/dist/skill/reference/components/dropdown/COMPONENT.md +59 -24
  410. package/dist/skill/reference/components/dropdown/examples/context-menu.tsx +75 -0
  411. package/dist/skill/reference/components/dropdown/examples/examples.module.css +1 -1
  412. package/dist/skill/reference/components/dropdown/examples/sizes.tsx +39 -34
  413. package/dist/skill/reference/components/dropdown/examples/states.tsx +37 -29
  414. package/dist/skill/reference/components/empty-page/COMPONENT.md +20 -9
  415. package/dist/skill/reference/components/empty-page/examples/compact.tsx +28 -18
  416. package/dist/skill/reference/components/empty-page/examples/examples.module.css +0 -43
  417. package/dist/skill/reference/components/empty-page/examples/narrow.tsx +3 -3
  418. package/dist/skill/reference/components/empty-page/examples/region-error.tsx +6 -11
  419. package/dist/skill/reference/components/empty-page/examples/sizes.tsx +13 -13
  420. package/dist/skill/reference/components/empty-page/examples/variants.tsx +34 -30
  421. package/dist/skill/reference/components/example-frame/COMPONENT.md +23 -11
  422. package/dist/skill/reference/components/example-frame/examples/controlled.tsx +3 -3
  423. package/dist/skill/reference/components/field-list/COMPONENT.md +14 -8
  424. package/dist/skill/reference/components/field-list/examples/screen.module.css +1 -1
  425. package/dist/skill/reference/components/field-list/examples/screen.tsx +19 -19
  426. package/dist/skill/reference/components/field-list/examples/sizes.tsx +32 -26
  427. package/dist/skill/reference/components/field-list/examples/states.tsx +37 -31
  428. package/dist/skill/reference/components/fieldset/COMPONENT.md +11 -6
  429. package/dist/skill/reference/components/fieldset/examples/examples.module.css +1 -1
  430. package/dist/skill/reference/components/fieldset/examples/states.tsx +1 -1
  431. package/dist/skill/reference/components/file-upload/COMPONENT.md +68 -30
  432. package/dist/skill/reference/components/file-upload/examples/avatar-upload.tsx +5 -5
  433. package/dist/skill/reference/components/file-upload/examples/custom-body.tsx +12 -7
  434. package/dist/skill/reference/components/file-upload/examples/examples.module.css +4 -4
  435. package/dist/skill/reference/components/file-upload/examples/narrow.tsx +1 -1
  436. package/dist/skill/reference/components/file-upload/examples/row-parts.tsx +4 -4
  437. package/dist/skill/reference/components/file-upload/examples/screen.module.css +4 -4
  438. package/dist/skill/reference/components/file-upload/examples/screen.tsx +70 -84
  439. package/dist/skill/reference/components/file-upload/examples/sizes.tsx +1 -3
  440. package/dist/skill/reference/components/file-upload/examples/states.tsx +1 -3
  441. package/dist/skill/reference/components/file-upload/examples/variants.tsx +13 -7
  442. package/dist/skill/reference/components/gallery/COMPONENT.md +17 -7
  443. package/dist/skill/reference/components/gallery/examples/album-sizes.tsx +52 -0
  444. package/dist/skill/reference/components/gallery/examples/controlled.tsx +40 -0
  445. package/dist/skill/reference/components/gallery/examples/examples.module.css +1 -1
  446. package/dist/skill/reference/components/gallery/examples/overview.tsx +15 -43
  447. package/dist/skill/reference/components/gallery/examples/transfer.tsx +22 -13
  448. package/dist/skill/reference/components/gantt/COMPONENT.md +21 -15
  449. package/dist/skill/reference/components/gantt/examples/examples.module.css +0 -16
  450. package/dist/skill/reference/components/gantt/examples/occupancy.tsx +2 -2
  451. package/dist/skill/reference/components/gantt/examples/screen.module.css +1 -1
  452. package/dist/skill/reference/components/gantt/examples/screen.tsx +56 -74
  453. package/dist/skill/reference/components/gantt/examples/sizes.tsx +16 -16
  454. package/dist/skill/reference/components/gantt/examples/states.tsx +34 -30
  455. package/dist/skill/reference/components/gantt/examples/variants.tsx +27 -25
  456. package/dist/skill/reference/components/hint/COMPONENT.md +24 -14
  457. package/dist/skill/reference/components/hint/examples/examples.module.css +10 -1
  458. package/dist/skill/reference/components/hint/examples/hint-or-error.tsx +2 -2
  459. package/dist/skill/reference/components/hint/examples/overview.tsx +10 -11
  460. package/dist/skill/reference/components/hint/examples/sizes.tsx +1 -1
  461. package/dist/skill/reference/components/input/COMPONENT.md +10 -6
  462. package/dist/skill/reference/components/input/examples/affixes.tsx +2 -2
  463. package/dist/skill/reference/components/input/examples/examples.module.css +1 -1
  464. package/dist/skill/reference/components/input/examples/sizes.tsx +9 -5
  465. package/dist/skill/reference/components/input/examples/states.tsx +39 -23
  466. package/dist/skill/reference/components/input/examples/with-icon.tsx +24 -16
  467. package/dist/skill/reference/components/kanban/COMPONENT.md +30 -24
  468. package/dist/skill/reference/components/kanban/examples/columns.tsx +14 -19
  469. package/dist/skill/reference/components/kanban/examples/item-link.tsx +2 -2
  470. package/dist/skill/reference/components/kanban/examples/limits.tsx +1 -1
  471. package/dist/skill/reference/components/kanban/examples/narrow.tsx +1 -1
  472. package/dist/skill/reference/components/kanban/examples/screen.module.css +2 -4
  473. package/dist/skill/reference/components/kanban/examples/screen.tsx +55 -68
  474. package/dist/skill/reference/components/kanban/examples/states.tsx +37 -58
  475. package/dist/skill/reference/components/kanban/examples/variants.tsx +0 -3
  476. package/dist/skill/reference/components/kbd/COMPONENT.md +11 -7
  477. package/dist/skill/reference/components/kbd/examples/examples.module.css +1 -20
  478. package/dist/skill/reference/components/kbd/examples/in-controls.tsx +2 -2
  479. package/dist/skill/reference/components/kbd/examples/shortcut-list.tsx +14 -26
  480. package/dist/skill/reference/components/label/COMPONENT.md +26 -11
  481. package/dist/skill/reference/components/label/examples/examples.module.css +12 -9
  482. package/dist/skill/reference/components/label/examples/overview.tsx +6 -10
  483. package/dist/skill/reference/components/label/examples/structure.tsx +2 -2
  484. package/dist/skill/reference/components/link-button/COMPONENT.md +33 -20
  485. package/dist/skill/reference/components/link-button/examples/as-child.tsx +1 -1
  486. package/dist/skill/reference/components/link-button/examples/external-link.tsx +1 -1
  487. package/dist/skill/reference/components/link-button/examples/overview.tsx +4 -2
  488. package/dist/skill/reference/components/link-button/examples/variants.tsx +2 -2
  489. package/dist/skill/reference/components/list/COMPONENT.md +24 -16
  490. package/dist/skill/reference/components/list/examples/examples.module.css +0 -8
  491. package/dist/skill/reference/components/list/examples/overflow.tsx +1 -1
  492. package/dist/skill/reference/components/list/examples/overview.tsx +31 -30
  493. package/dist/skill/reference/components/list/examples/sizes.tsx +23 -23
  494. package/dist/skill/reference/components/list/examples/states.tsx +38 -21
  495. package/dist/skill/reference/components/list/examples/with-icon.tsx +16 -14
  496. package/dist/skill/reference/components/login-form/COMPONENT.md +69 -16
  497. package/dist/skill/reference/components/login-form/examples/narrow.tsx +1 -1
  498. package/dist/skill/reference/components/login-form/examples/register.tsx +1 -1
  499. package/dist/skill/reference/components/media-viewer/COMPONENT.md +12 -8
  500. package/dist/skill/reference/components/media-viewer/examples/controlled.tsx +16 -16
  501. package/dist/skill/reference/components/media-viewer/examples/examples.module.css +3 -5
  502. package/dist/skill/reference/components/media-viewer/examples/video.tsx +1 -1
  503. package/dist/skill/reference/components/message/COMPONENT.md +102 -46
  504. package/dist/skill/reference/components/message/examples/typing.tsx +5 -5
  505. package/dist/skill/reference/components/modal/COMPONENT.md +71 -37
  506. package/dist/skill/reference/components/modal/examples/dismiss.tsx +35 -27
  507. package/dist/skill/reference/components/modal/examples/enter-key.tsx +22 -25
  508. package/dist/skill/reference/components/modal/examples/examples.module.css +0 -7
  509. package/dist/skill/reference/components/modal/examples/guard.tsx +2 -4
  510. package/dist/skill/reference/components/modal/examples/in-form.tsx +28 -28
  511. package/dist/skill/reference/components/modal/examples/long-content.tsx +6 -4
  512. package/dist/skill/reference/components/modal/examples/sizes.tsx +36 -31
  513. package/dist/skill/reference/components/modal/examples/structure.tsx +1 -1
  514. package/dist/skill/reference/components/native-select/COMPONENT.md +7 -3
  515. package/dist/skill/reference/components/native-select/examples/examples.module.css +3 -3
  516. package/dist/skill/reference/components/native-select/examples/in-form.tsx +28 -29
  517. package/dist/skill/reference/components/native-select/examples/sizes.tsx +2 -2
  518. package/dist/skill/reference/components/native-select/examples/states.tsx +2 -2
  519. package/dist/skill/reference/components/notification/COMPONENT.md +36 -31
  520. package/dist/skill/reference/components/notification/examples/examples.module.css +1 -2
  521. package/dist/skill/reference/components/notification/examples/in-form.tsx +28 -20
  522. package/dist/skill/reference/components/notification/examples/sizes.tsx +16 -12
  523. package/dist/skill/reference/components/notification/examples/undo.tsx +7 -15
  524. package/dist/skill/reference/components/pagination/COMPONENT.md +29 -18
  525. package/dist/skill/reference/components/pagination/examples/controlled.tsx +2 -1
  526. package/dist/skill/reference/components/pagination/examples/narrow.tsx +5 -5
  527. package/dist/skill/reference/components/popover/COMPONENT.md +44 -20
  528. package/dist/skill/reference/components/popover/examples/controlled-open.tsx +6 -4
  529. package/dist/skill/reference/components/popover/examples/dismiss.tsx +37 -28
  530. package/dist/skill/reference/components/popover/examples/examples.module.css +2 -2
  531. package/dist/skill/reference/components/popover/examples/sizes.tsx +32 -27
  532. package/dist/skill/reference/components/popover/examples/width.tsx +57 -0
  533. package/dist/skill/reference/components/progress-bar/COMPONENT.md +21 -29
  534. package/dist/skill/reference/components/progress-bar/examples/examples.module.css +1 -1
  535. package/dist/skill/reference/components/progress-circle/COMPONENT.md +21 -29
  536. package/dist/skill/reference/components/progress-circle/examples/examples.module.css +1 -1
  537. package/dist/skill/reference/components/progress-circle/examples/on-color.tsx +16 -0
  538. package/dist/skill/reference/components/progress-circle/examples/variants.tsx +1 -0
  539. package/dist/skill/reference/components/radio/COMPONENT.md +13 -4
  540. package/dist/skill/reference/components/radio/examples/examples.module.css +1 -1
  541. package/dist/skill/reference/components/scroll-container/COMPONENT.md +18 -12
  542. package/dist/skill/reference/components/scroll-container/examples/auto-scroll.tsx +8 -4
  543. package/dist/skill/reference/components/scroll-container/examples/edges.tsx +4 -4
  544. package/dist/skill/reference/components/scroll-container/examples/examples.module.css +7 -51
  545. package/dist/skill/reference/components/scroll-container/examples/load-more.tsx +4 -4
  546. package/dist/skill/reference/components/scroll-container/examples/lock.tsx +4 -4
  547. package/dist/skill/reference/components/scroll-container/examples/log.tsx +97 -0
  548. package/dist/skill/reference/components/scroll-container/examples/overscroll.tsx +4 -4
  549. package/dist/skill/reference/components/scroll-container/examples/overview.tsx +5 -5
  550. package/dist/skill/reference/components/scroll-container/examples/scrollbar.tsx +4 -4
  551. package/dist/skill/reference/components/scroll-container/examples/snap.tsx +2 -2
  552. package/dist/skill/reference/components/scroll-container/examples/variants.tsx +1 -0
  553. package/dist/skill/reference/components/segmented-control/COMPONENT.md +24 -12
  554. package/dist/skill/reference/components/segmented-control/examples/controlled.tsx +2 -4
  555. package/dist/skill/reference/components/segmented-control/examples/examples.module.css +0 -8
  556. package/dist/skill/reference/components/segmented-control/examples/scroll.tsx +1 -1
  557. package/dist/skill/reference/components/select/COMPONENT.md +33 -9
  558. package/dist/skill/reference/components/select/examples/dismiss.tsx +26 -0
  559. package/dist/skill/reference/components/select/examples/examples.module.css +1 -1
  560. package/dist/skill/reference/components/select/examples/server-search.tsx +6 -2
  561. package/dist/skill/reference/components/select/examples/sizes.tsx +2 -2
  562. package/dist/skill/reference/components/select/examples/states.tsx +2 -2
  563. package/dist/skill/reference/components/select/examples/with-icon.tsx +20 -18
  564. package/dist/skill/reference/components/sheet/COMPONENT.md +44 -21
  565. package/dist/skill/reference/components/sheet/examples/header-actions.tsx +23 -4
  566. package/dist/skill/reference/components/sheet/examples/overview.tsx +25 -10
  567. package/dist/skill/reference/components/skeleton/COMPONENT.md +8 -4
  568. package/dist/skill/reference/components/skeleton/examples/examples.module.css +1 -13
  569. package/dist/skill/reference/components/skeleton/examples/with-crossfade.tsx +7 -7
  570. package/dist/skill/reference/components/slider/COMPONENT.md +13 -8
  571. package/dist/skill/reference/components/slider/examples/examples.module.css +6 -7
  572. package/dist/skill/reference/components/slider/examples/hint-and-error.tsx +3 -5
  573. package/dist/skill/reference/components/slider/examples/in-form.tsx +21 -19
  574. package/dist/skill/reference/components/slider/examples/states.tsx +14 -10
  575. package/dist/skill/reference/components/smart-filter/COMPONENT.md +42 -22
  576. package/dist/skill/reference/components/smart-filter/examples/examples.module.css +3 -21
  577. package/dist/skill/reference/components/smart-filter/examples/many-values.tsx +12 -8
  578. package/dist/skill/reference/components/smart-filter/examples/ranges.tsx +2 -1
  579. package/dist/skill/reference/components/smart-filter/examples/sizes.tsx +9 -7
  580. package/dist/skill/reference/components/sparkline/COMPONENT.md +8 -3
  581. package/dist/skill/reference/components/sparkline/examples/curve.tsx +16 -11
  582. package/dist/skill/reference/components/sparkline/examples/examples.module.css +1 -1
  583. package/dist/skill/reference/components/sparkline/examples/signed-bars.tsx +2 -2
  584. package/dist/skill/reference/components/sparkline/examples/states.tsx +14 -10
  585. package/dist/skill/reference/components/spinner/COMPONENT.md +15 -9
  586. package/dist/skill/reference/components/spinner/examples/examples.module.css +2 -14
  587. package/dist/skill/reference/components/spinner/examples/overview.tsx +1 -1
  588. package/dist/skill/reference/components/stepper/COMPONENT.md +50 -41
  589. package/dist/skill/reference/components/stepper/examples/examples.module.css +1 -6
  590. package/dist/skill/reference/components/stepper/examples/narrow.tsx +1 -1
  591. package/dist/skill/reference/components/stepper/examples/sizes.tsx +6 -8
  592. package/dist/skill/reference/components/stepper/examples/states.tsx +44 -43
  593. package/dist/skill/reference/components/stepper/examples/with-icon.tsx +19 -17
  594. package/dist/skill/reference/components/switch/COMPONENT.md +22 -9
  595. package/dist/skill/reference/components/switch/examples/examples.module.css +2 -2
  596. package/dist/skill/reference/components/switch/examples/states.tsx +3 -3
  597. package/dist/skill/reference/components/tabs/COMPONENT.md +21 -16
  598. package/dist/skill/reference/components/tabs/examples/in-drawer.tsx +1 -1
  599. package/dist/skill/reference/components/tabs/examples/sizes.tsx +5 -10
  600. package/dist/skill/reference/components/tabs/examples/variants.tsx +19 -23
  601. package/dist/skill/reference/components/tag-select/COMPONENT.md +19 -6
  602. package/dist/skill/reference/components/tag-select/examples/creatable.tsx +2 -2
  603. package/dist/skill/reference/components/tag-select/examples/dismiss.tsx +23 -0
  604. package/dist/skill/reference/components/tag-select/examples/examples.module.css +3 -3
  605. package/dist/skill/reference/components/tag-select/examples/in-form.tsx +31 -32
  606. package/dist/skill/reference/components/tag-select/examples/sizes.tsx +2 -2
  607. package/dist/skill/reference/components/tag-select/examples/states.tsx +2 -2
  608. package/dist/skill/reference/components/textarea/COMPONENT.md +10 -6
  609. package/dist/skill/reference/components/textarea/examples/examples.module.css +3 -10
  610. package/dist/skill/reference/components/textarea/examples/in-form.tsx +3 -3
  611. package/dist/skill/reference/components/textarea/examples/sizes.tsx +10 -7
  612. package/dist/skill/reference/components/textarea/examples/states.tsx +29 -13
  613. package/dist/skill/reference/components/textarea/examples/validation.tsx +45 -36
  614. package/dist/skill/reference/components/thumbnail/COMPONENT.md +17 -13
  615. package/dist/skill/reference/components/thumbnail/examples/examples.module.css +1 -1
  616. package/dist/skill/reference/components/thumbnail/examples/states.tsx +1 -1
  617. package/dist/skill/reference/components/thumbnail/examples/variants.tsx +12 -1
  618. package/dist/skill/reference/components/timeline/COMPONENT.md +51 -35
  619. package/dist/skill/reference/components/timeline/examples/links.tsx +14 -14
  620. package/dist/skill/reference/components/timeline/examples/narrow.tsx +6 -6
  621. package/dist/skill/reference/components/timeline/examples/overview.tsx +6 -6
  622. package/dist/skill/reference/components/timeline/examples/sizes.tsx +28 -23
  623. package/dist/skill/reference/components/timeline/examples/structure.tsx +30 -30
  624. package/dist/skill/reference/components/timeline/examples/variants.tsx +40 -28
  625. package/dist/skill/reference/components/tooltip/COMPONENT.md +10 -6
  626. package/dist/skill/reference/components/tooltip/examples/examples.module.css +1 -5
  627. package/dist/skill/reference/components/tooltip/examples/non-interactive-trigger.tsx +1 -1
  628. package/dist/skill/reference/components/tooltip/examples/sizes.tsx +17 -10
  629. package/dist/skill/reference/components/typography/COMPONENT.md +18 -3
  630. package/dist/skill/reference/components/typography/examples/examples.module.css +3 -6
  631. package/dist/skill/reference/components/typography/examples/numeric.tsx +16 -0
  632. package/dist/skill/reference/components/video-note/COMPONENT.md +11 -7
  633. package/dist/skill/reference/components/visually-hidden/COMPONENT.md +8 -4
  634. package/dist/skill/reference/components/visually-hidden/examples/assertive.tsx +1 -1
  635. package/dist/skill/reference/components/visually-hidden/examples/overview.tsx +17 -7
  636. package/dist/skill/reference/components/voice-player/COMPONENT.md +15 -7
  637. package/dist/skill/reference/foundation.md +568 -0
  638. package/dist/skill/reference/layout/app-shell/COMPONENT.md +53 -36
  639. package/dist/skill/reference/layout/app-shell/examples/examples.module.css +2 -22
  640. package/dist/skill/reference/layout/app-shell/examples/footer.tsx +10 -10
  641. package/dist/skill/reference/layout/app-shell/examples/overview.tsx +21 -25
  642. package/dist/skill/reference/layout/app-shell/examples/screen.module.css +2 -2
  643. package/dist/skill/reference/layout/app-shell/examples/screen.tsx +48 -47
  644. package/dist/skill/reference/layout/app-shell/examples/template.tsx +13 -17
  645. package/dist/skill/reference/layout/bottom-nav/COMPONENT.md +30 -20
  646. package/dist/skill/reference/layout/bottom-nav/examples/examples.module.css +2 -7
  647. package/dist/skill/reference/layout/bottom-nav/examples/floating-action.tsx +10 -19
  648. package/dist/skill/reference/layout/bottom-nav/examples/floating.tsx +10 -19
  649. package/dist/skill/reference/layout/bottom-nav/examples/in-app-shell.tsx +11 -19
  650. package/dist/skill/reference/layout/bottom-nav/examples/router.tsx +6 -5
  651. package/dist/skill/reference/layout/page/COMPONENT.md +353 -0
  652. package/dist/skill/reference/layout/page/examples/actions-collapse.tsx +45 -0
  653. package/dist/skill/reference/layout/page/examples/collapse.tsx +68 -0
  654. package/dist/skill/reference/{components/page-content → layout/page}/examples/examples.module.css +32 -16
  655. package/{src/components/page-content → dist/skill/reference/layout/page}/examples/grid.tsx +18 -16
  656. package/dist/skill/reference/layout/page/examples/list-detail.tsx +112 -0
  657. package/dist/skill/reference/layout/page/examples/narrow.tsx +75 -0
  658. package/dist/skill/reference/layout/page/examples/overview.tsx +57 -0
  659. package/{src/components/page-content → dist/skill/reference/layout/page}/examples/screen.module.css +1 -1
  660. package/{src/components/page-content → dist/skill/reference/layout/page}/examples/screen.tsx +29 -19
  661. package/{src/components/page-content → dist/skill/reference/layout/page}/examples/sections.tsx +17 -24
  662. package/dist/skill/reference/layout/page/examples/structure.tsx +41 -0
  663. package/dist/skill/reference/{components/page-toolbar/examples/narrow.tsx → layout/page/examples/tools.tsx} +38 -35
  664. package/dist/skill/reference/layout/page/examples/top-bar.tsx +85 -0
  665. package/dist/skill/reference/{components/page-content → layout/page}/examples/variants.tsx +13 -13
  666. package/dist/skill/reference/layout/sidebar/COMPONENT.md +51 -40
  667. package/dist/skill/reference/layout/sidebar/examples/account.tsx +1 -3
  668. package/dist/skill/reference/layout/sidebar/examples/brand-header.tsx +1 -3
  669. package/dist/skill/reference/layout/sidebar/examples/collapsible-groups.tsx +1 -3
  670. package/dist/skill/reference/layout/sidebar/examples/controlled-open.tsx +1 -3
  671. package/dist/skill/reference/layout/sidebar/examples/controlled.tsx +1 -3
  672. package/dist/skill/reference/layout/sidebar/examples/custom-part.tsx +1 -3
  673. package/dist/skill/reference/layout/sidebar/examples/dismiss.tsx +50 -0
  674. package/dist/skill/reference/layout/sidebar/examples/examples.module.css +7 -32
  675. package/dist/skill/reference/layout/sidebar/examples/narrow.tsx +47 -42
  676. package/dist/skill/reference/layout/sidebar/examples/nested-items.tsx +1 -3
  677. package/dist/skill/reference/layout/sidebar/examples/overview.tsx +1 -3
  678. package/dist/skill/reference/layout/sidebar/examples/persist.tsx +1 -3
  679. package/dist/skill/reference/layout/sidebar/examples/router.tsx +12 -13
  680. package/dist/skill/reference/layout/sidebar/examples/sizes.tsx +6 -6
  681. package/dist/skill/responsive.md +116 -105
  682. package/dist/skill/ux.md +21 -9
  683. package/dist/theme/applyTheme.d.ts +7 -6
  684. package/dist/tokens/hues.d.ts +8 -0
  685. package/dist/tokens/layers.d.ts +5 -16
  686. package/dist/tokens/offGrid.d.ts +7 -0
  687. package/dist/tokens/primitives.d.ts +34 -9
  688. package/dist/tokens/semantic.d.ts +208 -51
  689. package/dist/tokens/themes/dark.d.ts +39 -33
  690. package/package.json +5 -3
  691. package/src/components/accordion/COMPONENT.md +16 -9
  692. package/src/components/accordion/examples/overview.tsx +2 -2
  693. package/src/components/accordion/examples/sizes.tsx +6 -8
  694. package/src/components/accordion/examples/states.tsx +27 -24
  695. package/src/components/accordion/examples/variants.tsx +6 -8
  696. package/src/components/accordion/examples/with-icon.tsx +22 -19
  697. package/src/components/avatar/COMPONENT.md +24 -17
  698. package/src/components/avatar/examples/examples.module.css +1 -4
  699. package/src/components/avatar/examples/overview.tsx +3 -3
  700. package/src/components/avatar/examples/presence.tsx +4 -4
  701. package/src/components/avatar/examples/src-from-state.tsx +3 -3
  702. package/src/components/avatar/examples/states.tsx +4 -4
  703. package/src/components/avatar/examples/team-group.tsx +3 -3
  704. package/src/components/badge/COMPONENT.md +66 -34
  705. package/src/components/badge/examples/controlled.tsx +32 -0
  706. package/src/components/badge/examples/examples.module.css +2 -2
  707. package/src/components/badge/examples/filter-values.tsx +4 -6
  708. package/src/components/badge/examples/in-controls.tsx +1 -1
  709. package/src/components/badge/examples/overview.tsx +6 -5
  710. package/src/components/badge/examples/square.tsx +21 -0
  711. package/src/components/badge/examples/states.tsx +4 -4
  712. package/src/components/badge/examples/with-icon.tsx +10 -1
  713. package/src/components/banner/COMPONENT.md +13 -9
  714. package/src/components/banner/examples/dismissible.tsx +3 -19
  715. package/src/components/banner/examples/examples.module.css +6 -1
  716. package/src/components/banner/examples/overview.tsx +1 -1
  717. package/src/components/banner/examples/page-strip.tsx +24 -22
  718. package/src/components/breadcrumb/COMPONENT.md +23 -16
  719. package/src/components/breadcrumb/examples/examples.module.css +1 -1
  720. package/src/components/breadcrumb/examples/overflow.tsx +1 -1
  721. package/src/components/breadcrumb/examples/sizes.tsx +6 -8
  722. package/src/components/breadcrumb/examples/with-icon.tsx +15 -8
  723. package/src/components/button/COMPONENT.md +67 -30
  724. package/src/components/button/examples/align.tsx +25 -0
  725. package/src/components/button/examples/controlled.tsx +21 -0
  726. package/src/components/button/examples/density.tsx +45 -0
  727. package/src/components/button/examples/examples.module.css +14 -25
  728. package/src/components/button/examples/hold-to-confirm.tsx +1 -1
  729. package/src/components/button/examples/label-morph.tsx +1 -1
  730. package/src/components/button/examples/on-colored-host.tsx +19 -19
  731. package/src/components/button/examples/over-media.tsx +7 -1
  732. package/src/components/button/examples/toggle.tsx +2 -10
  733. package/src/components/button-group/COMPONENT.md +21 -15
  734. package/src/components/button-group/examples/controlled.tsx +1 -1
  735. package/src/components/card/COMPONENT.md +21 -10
  736. package/src/components/card/examples/content-templates.tsx +8 -2
  737. package/src/components/card/examples/examples.module.css +4 -16
  738. package/src/components/card/examples/overview.tsx +11 -11
  739. package/src/components/card/examples/screen.module.css +1 -1
  740. package/src/components/card/examples/screen.tsx +185 -198
  741. package/src/components/card/examples/variants.tsx +74 -47
  742. package/src/components/chart-frame/COMPONENT.md +24 -28
  743. package/src/components/chart-frame/examples/controlled.tsx +9 -7
  744. package/src/components/chart-frame/examples/fill-height.tsx +13 -15
  745. package/src/components/chart-frame/examples/narrow.tsx +24 -5
  746. package/src/components/chart-frame/examples/overview.tsx +5 -2
  747. package/src/components/chart-frame/examples/states.tsx +72 -64
  748. package/src/components/chart-frame/examples/tooltip.tsx +27 -26
  749. package/src/components/chat/COMPONENT.md +39 -26
  750. package/src/components/chat/examples/group-chat.tsx +2 -2
  751. package/src/components/chat/examples/overview.tsx +119 -130
  752. package/src/components/chat/examples/reactions.tsx +18 -23
  753. package/src/components/chat/examples/screen.module.css +1 -1
  754. package/src/components/chat/examples/screen.tsx +212 -242
  755. package/src/components/chat/examples/states.tsx +23 -22
  756. package/src/components/chat-list/COMPONENT.md +11 -6
  757. package/src/components/chat-list/examples/controlled.tsx +2 -2
  758. package/src/components/chat-list/examples/examples.module.css +8 -8
  759. package/src/components/chat-list/examples/live.tsx +29 -22
  760. package/src/components/chat-list/examples/sizes.tsx +6 -8
  761. package/src/components/chat-list/examples/states.tsx +42 -38
  762. package/src/components/checkbox/COMPONENT.md +27 -14
  763. package/src/components/checkbox/examples/controlled.tsx +18 -16
  764. package/src/components/checkbox/examples/examples.module.css +15 -56
  765. package/src/components/checkbox/examples/in-form.tsx +16 -16
  766. package/src/components/checkbox/examples/indicator.tsx +19 -64
  767. package/src/components/checkbox/examples/overview.tsx +1 -1
  768. package/src/components/checkbox/examples/states.tsx +1 -1
  769. package/src/components/checkbox/examples/without-label.tsx +1 -1
  770. package/src/components/code-block/COMPONENT.md +16 -12
  771. package/src/components/code-block/examples/color-scheme.tsx +2 -4
  772. package/src/components/code-block/examples/examples.module.css +1 -9
  773. package/src/components/code-block/examples/narrow.tsx +1 -1
  774. package/src/components/color-field/COMPONENT.md +15 -9
  775. package/src/components/color-field/examples/examples.module.css +4 -5
  776. package/src/components/color-field/examples/in-form.tsx +15 -13
  777. package/src/components/color-field/examples/sizes.tsx +5 -1
  778. package/src/components/color-field/examples/states.tsx +15 -3
  779. package/src/components/color-picker/COMPONENT.md +69 -22
  780. package/src/components/color-picker/examples/controlled.tsx +16 -5
  781. package/src/components/color-picker/examples/examples.module.css +8 -12
  782. package/src/components/color-picker/examples/in-form.tsx +24 -22
  783. package/src/components/color-picker/examples/overview.tsx +6 -11
  784. package/src/components/color-picker/examples/panel.tsx +1 -1
  785. package/src/components/color-picker/examples/sizes.tsx +10 -16
  786. package/src/components/color-picker/examples/states.tsx +28 -23
  787. package/src/components/color-swatches/COMPONENT.md +22 -8
  788. package/src/components/color-swatches/examples/examples.module.css +3 -4
  789. package/src/components/color-swatches/examples/in-form.tsx +19 -17
  790. package/src/components/color-swatches/examples/palette.tsx +24 -0
  791. package/src/components/color-swatches/examples/wrapping.tsx +17 -2
  792. package/src/components/command-menu/COMPONENT.md +60 -20
  793. package/src/components/command-menu/examples/sizes.tsx +20 -15
  794. package/src/components/command-menu/examples/states.tsx +46 -24
  795. package/src/components/composer/COMPONENT.md +42 -24
  796. package/src/components/composer/examples/examples.module.css +0 -9
  797. package/src/components/composer/examples/narrow.tsx +1 -1
  798. package/src/components/composer/examples/reply-edit.tsx +3 -3
  799. package/src/components/composer/examples/sizes.tsx +3 -5
  800. package/src/components/composer/examples/states.tsx +4 -6
  801. package/src/components/confirm-dialog/COMPONENT.md +26 -13
  802. package/src/components/confirm-dialog/examples/dismiss.tsx +27 -0
  803. package/src/components/confirm-dialog/examples/failure.tsx +9 -16
  804. package/src/components/crossfade/COMPONENT.md +13 -7
  805. package/src/components/crossfade/examples/examples.module.css +1 -40
  806. package/src/components/crossfade/examples/fill.tsx +16 -19
  807. package/src/components/crossfade/examples/overview.tsx +14 -16
  808. package/src/components/crossfade/examples/record-switch.tsx +6 -11
  809. package/src/components/crossfade/examples/screen.module.css +1 -24
  810. package/src/components/crossfade/examples/screen.tsx +108 -124
  811. package/src/components/data-table/COMPONENT.md +36 -26
  812. package/src/components/data-table/examples/controlled.tsx +14 -2
  813. package/src/components/data-table/examples/examples.module.css +10 -9
  814. package/src/components/data-table/examples/narrow.tsx +5 -1
  815. package/src/components/data-table/examples/row-link.tsx +2 -1
  816. package/src/components/data-table/examples/screen.module.css +2 -2
  817. package/src/components/data-table/examples/screen.tsx +53 -62
  818. package/src/components/data-table/examples/server.tsx +6 -2
  819. package/src/components/data-table/examples/sizes.tsx +17 -17
  820. package/src/components/data-table/examples/states.tsx +37 -29
  821. package/src/components/datepicker/COMPONENT.md +53 -22
  822. package/src/components/datepicker/examples/dismiss.tsx +15 -0
  823. package/src/components/datepicker/examples/examples.module.css +9 -2
  824. package/src/components/datepicker/examples/in-form.tsx +33 -25
  825. package/src/components/datepicker/examples/inline-panel.tsx +3 -1
  826. package/src/components/datepicker/examples/sizes.tsx +2 -2
  827. package/src/components/datepicker/examples/states.tsx +2 -2
  828. package/src/components/datepicker/examples/validation.tsx +3 -3
  829. package/src/components/description-list/COMPONENT.md +24 -9
  830. package/src/components/description-list/examples/examples.module.css +4 -24
  831. package/src/components/description-list/examples/narrow.tsx +1 -1
  832. package/src/components/description-list/examples/screen.module.css +0 -18
  833. package/src/components/description-list/examples/screen.tsx +119 -134
  834. package/src/components/description-list/examples/sizes.tsx +2 -4
  835. package/src/components/description-list/examples/structure.tsx +6 -7
  836. package/src/components/description-list/examples/totals.tsx +40 -0
  837. package/src/components/digit-input/COMPONENT.md +12 -6
  838. package/src/components/digit-input/examples/examples.module.css +2 -2
  839. package/src/components/digit-input/examples/grouped.tsx +4 -4
  840. package/src/components/digit-input/examples/in-form.tsx +1 -1
  841. package/src/components/digit-input/examples/sizes.tsx +5 -3
  842. package/src/components/digit-input/examples/states.tsx +14 -6
  843. package/src/components/digit-input/examples/validation.tsx +1 -1
  844. package/src/components/divider/COMPONENT.md +28 -14
  845. package/src/components/divider/examples/align.tsx +2 -4
  846. package/src/components/divider/examples/examples.module.css +16 -17
  847. package/src/components/divider/examples/or-separator.tsx +3 -5
  848. package/src/components/divider/examples/overview.tsx +18 -16
  849. package/src/components/divider/examples/vertical.tsx +25 -8
  850. package/src/components/divider/examples/with-icon.tsx +1 -1
  851. package/src/components/dnd/COMPONENT.md +52 -34
  852. package/src/components/dnd/examples/drop-zones.tsx +1 -1
  853. package/src/components/dnd/examples/examples.module.css +7 -7
  854. package/src/components/dnd/examples/states.tsx +41 -35
  855. package/src/components/drawer/COMPONENT.md +38 -15
  856. package/src/components/drawer/examples/guard.tsx +1 -3
  857. package/src/components/drawer/examples/header-actions.tsx +1 -1
  858. package/src/components/drawer/examples/in-form.tsx +31 -31
  859. package/src/components/drawer/examples/placement.tsx +1 -1
  860. package/src/components/drawer/examples/screen.tsx +137 -160
  861. package/src/components/drawer/examples/sizes.tsx +32 -27
  862. package/src/components/dropdown/COMPONENT.md +59 -24
  863. package/src/components/dropdown/examples/context-menu.tsx +75 -0
  864. package/src/components/dropdown/examples/examples.module.css +1 -1
  865. package/src/components/dropdown/examples/sizes.tsx +39 -34
  866. package/src/components/dropdown/examples/states.tsx +37 -29
  867. package/src/components/empty-page/COMPONENT.md +20 -9
  868. package/src/components/empty-page/examples/compact.tsx +28 -18
  869. package/src/components/empty-page/examples/examples.module.css +0 -43
  870. package/src/components/empty-page/examples/narrow.tsx +3 -3
  871. package/src/components/empty-page/examples/region-error.tsx +6 -11
  872. package/src/components/empty-page/examples/sizes.tsx +13 -13
  873. package/src/components/empty-page/examples/variants.tsx +34 -30
  874. package/src/components/example-frame/COMPONENT.md +23 -11
  875. package/src/components/example-frame/examples/controlled.tsx +3 -3
  876. package/src/components/field-list/COMPONENT.md +14 -8
  877. package/src/components/field-list/examples/screen.module.css +1 -1
  878. package/src/components/field-list/examples/screen.tsx +19 -19
  879. package/src/components/field-list/examples/sizes.tsx +32 -26
  880. package/src/components/field-list/examples/states.tsx +37 -31
  881. package/src/components/fieldset/COMPONENT.md +11 -6
  882. package/src/components/fieldset/examples/examples.module.css +1 -1
  883. package/src/components/fieldset/examples/states.tsx +1 -1
  884. package/src/components/file-upload/COMPONENT.md +68 -30
  885. package/src/components/file-upload/examples/avatar-upload.tsx +5 -5
  886. package/src/components/file-upload/examples/custom-body.tsx +12 -7
  887. package/src/components/file-upload/examples/examples.module.css +4 -4
  888. package/src/components/file-upload/examples/narrow.tsx +1 -1
  889. package/src/components/file-upload/examples/row-parts.tsx +4 -4
  890. package/src/components/file-upload/examples/screen.module.css +4 -4
  891. package/src/components/file-upload/examples/screen.tsx +70 -84
  892. package/src/components/file-upload/examples/sizes.tsx +1 -3
  893. package/src/components/file-upload/examples/states.tsx +1 -3
  894. package/src/components/file-upload/examples/variants.tsx +13 -7
  895. package/src/components/gallery/COMPONENT.md +17 -7
  896. package/src/components/gallery/examples/album-sizes.tsx +52 -0
  897. package/src/components/gallery/examples/controlled.tsx +40 -0
  898. package/src/components/gallery/examples/examples.module.css +1 -1
  899. package/src/components/gallery/examples/overview.tsx +15 -43
  900. package/src/components/gallery/examples/transfer.tsx +22 -13
  901. package/src/components/gantt/COMPONENT.md +21 -15
  902. package/src/components/gantt/examples/examples.module.css +0 -16
  903. package/src/components/gantt/examples/occupancy.tsx +2 -2
  904. package/src/components/gantt/examples/screen.module.css +1 -1
  905. package/src/components/gantt/examples/screen.tsx +56 -74
  906. package/src/components/gantt/examples/sizes.tsx +16 -16
  907. package/src/components/gantt/examples/states.tsx +34 -30
  908. package/src/components/gantt/examples/variants.tsx +27 -25
  909. package/src/components/hint/COMPONENT.md +24 -14
  910. package/src/components/hint/examples/examples.module.css +10 -1
  911. package/src/components/hint/examples/hint-or-error.tsx +2 -2
  912. package/src/components/hint/examples/overview.tsx +10 -11
  913. package/src/components/hint/examples/sizes.tsx +1 -1
  914. package/src/components/input/COMPONENT.md +10 -6
  915. package/src/components/input/examples/affixes.tsx +2 -2
  916. package/src/components/input/examples/examples.module.css +1 -1
  917. package/src/components/input/examples/sizes.tsx +9 -5
  918. package/src/components/input/examples/states.tsx +39 -23
  919. package/src/components/input/examples/with-icon.tsx +24 -16
  920. package/src/components/kanban/COMPONENT.md +30 -24
  921. package/src/components/kanban/examples/columns.tsx +14 -19
  922. package/src/components/kanban/examples/item-link.tsx +2 -2
  923. package/src/components/kanban/examples/limits.tsx +1 -1
  924. package/src/components/kanban/examples/narrow.tsx +1 -1
  925. package/src/components/kanban/examples/screen.module.css +2 -4
  926. package/src/components/kanban/examples/screen.tsx +55 -68
  927. package/src/components/kanban/examples/states.tsx +37 -58
  928. package/src/components/kanban/examples/variants.tsx +0 -3
  929. package/src/components/kbd/COMPONENT.md +11 -7
  930. package/src/components/kbd/examples/examples.module.css +1 -20
  931. package/src/components/kbd/examples/in-controls.tsx +2 -2
  932. package/src/components/kbd/examples/shortcut-list.tsx +14 -26
  933. package/src/components/label/COMPONENT.md +26 -11
  934. package/src/components/label/examples/examples.module.css +12 -9
  935. package/src/components/label/examples/overview.tsx +6 -10
  936. package/src/components/label/examples/structure.tsx +2 -2
  937. package/src/components/link-button/COMPONENT.md +33 -20
  938. package/src/components/link-button/examples/as-child.tsx +1 -1
  939. package/src/components/link-button/examples/external-link.tsx +1 -1
  940. package/src/components/link-button/examples/overview.tsx +4 -2
  941. package/src/components/link-button/examples/variants.tsx +2 -2
  942. package/src/components/list/COMPONENT.md +24 -16
  943. package/src/components/list/examples/examples.module.css +0 -8
  944. package/src/components/list/examples/overflow.tsx +1 -1
  945. package/src/components/list/examples/overview.tsx +31 -30
  946. package/src/components/list/examples/sizes.tsx +23 -23
  947. package/src/components/list/examples/states.tsx +38 -21
  948. package/src/components/list/examples/with-icon.tsx +16 -14
  949. package/src/components/login-form/COMPONENT.md +69 -16
  950. package/src/components/login-form/examples/narrow.tsx +1 -1
  951. package/src/components/login-form/examples/register.tsx +1 -1
  952. package/src/components/media-viewer/COMPONENT.md +12 -8
  953. package/src/components/media-viewer/examples/controlled.tsx +16 -16
  954. package/src/components/media-viewer/examples/examples.module.css +3 -5
  955. package/src/components/media-viewer/examples/video.tsx +1 -1
  956. package/src/components/message/COMPONENT.md +102 -46
  957. package/src/components/message/examples/typing.tsx +5 -5
  958. package/src/components/modal/COMPONENT.md +71 -37
  959. package/src/components/modal/examples/dismiss.tsx +35 -27
  960. package/src/components/modal/examples/enter-key.tsx +22 -25
  961. package/src/components/modal/examples/examples.module.css +0 -7
  962. package/src/components/modal/examples/guard.tsx +2 -4
  963. package/src/components/modal/examples/in-form.tsx +28 -28
  964. package/src/components/modal/examples/long-content.tsx +6 -4
  965. package/src/components/modal/examples/sizes.tsx +36 -31
  966. package/src/components/modal/examples/structure.tsx +1 -1
  967. package/src/components/native-select/COMPONENT.md +7 -3
  968. package/src/components/native-select/examples/examples.module.css +3 -3
  969. package/src/components/native-select/examples/in-form.tsx +28 -29
  970. package/src/components/native-select/examples/sizes.tsx +2 -2
  971. package/src/components/native-select/examples/states.tsx +2 -2
  972. package/src/components/notification/COMPONENT.md +36 -31
  973. package/src/components/notification/examples/examples.module.css +1 -2
  974. package/src/components/notification/examples/in-form.tsx +28 -20
  975. package/src/components/notification/examples/sizes.tsx +16 -12
  976. package/src/components/notification/examples/undo.tsx +7 -15
  977. package/src/components/pagination/COMPONENT.md +29 -18
  978. package/src/components/pagination/examples/controlled.tsx +2 -1
  979. package/src/components/pagination/examples/narrow.tsx +5 -5
  980. package/src/components/popover/COMPONENT.md +44 -20
  981. package/src/components/popover/examples/controlled-open.tsx +6 -4
  982. package/src/components/popover/examples/dismiss.tsx +37 -28
  983. package/src/components/popover/examples/examples.module.css +2 -2
  984. package/src/components/popover/examples/sizes.tsx +32 -27
  985. package/src/components/popover/examples/width.tsx +57 -0
  986. package/src/components/progress-bar/COMPONENT.md +21 -29
  987. package/src/components/progress-bar/examples/examples.module.css +1 -1
  988. package/src/components/progress-circle/COMPONENT.md +21 -29
  989. package/src/components/progress-circle/examples/examples.module.css +1 -1
  990. package/src/components/progress-circle/examples/on-color.tsx +16 -0
  991. package/src/components/progress-circle/examples/variants.tsx +1 -0
  992. package/src/components/radio/COMPONENT.md +13 -4
  993. package/src/components/radio/examples/examples.module.css +1 -1
  994. package/src/components/scroll-container/COMPONENT.md +18 -12
  995. package/src/components/scroll-container/examples/auto-scroll.tsx +8 -4
  996. package/src/components/scroll-container/examples/edges.tsx +4 -4
  997. package/src/components/scroll-container/examples/examples.module.css +7 -51
  998. package/src/components/scroll-container/examples/load-more.tsx +4 -4
  999. package/src/components/scroll-container/examples/lock.tsx +4 -4
  1000. package/src/components/scroll-container/examples/log.tsx +97 -0
  1001. package/src/components/scroll-container/examples/overscroll.tsx +4 -4
  1002. package/src/components/scroll-container/examples/overview.tsx +5 -5
  1003. package/src/components/scroll-container/examples/scrollbar.tsx +4 -4
  1004. package/src/components/scroll-container/examples/snap.tsx +2 -2
  1005. package/src/components/scroll-container/examples/variants.tsx +1 -0
  1006. package/src/components/segmented-control/COMPONENT.md +24 -12
  1007. package/src/components/segmented-control/examples/controlled.tsx +2 -4
  1008. package/src/components/segmented-control/examples/examples.module.css +0 -8
  1009. package/src/components/segmented-control/examples/scroll.tsx +1 -1
  1010. package/src/components/select/COMPONENT.md +33 -9
  1011. package/src/components/select/examples/dismiss.tsx +26 -0
  1012. package/src/components/select/examples/examples.module.css +1 -1
  1013. package/src/components/select/examples/server-search.tsx +6 -2
  1014. package/src/components/select/examples/sizes.tsx +2 -2
  1015. package/src/components/select/examples/states.tsx +2 -2
  1016. package/src/components/select/examples/with-icon.tsx +20 -18
  1017. package/src/components/sheet/COMPONENT.md +44 -21
  1018. package/src/components/sheet/examples/header-actions.tsx +23 -4
  1019. package/src/components/sheet/examples/overview.tsx +25 -10
  1020. package/src/components/skeleton/COMPONENT.md +8 -4
  1021. package/src/components/skeleton/examples/examples.module.css +1 -13
  1022. package/src/components/skeleton/examples/with-crossfade.tsx +7 -7
  1023. package/src/components/slider/COMPONENT.md +13 -8
  1024. package/src/components/slider/examples/examples.module.css +6 -7
  1025. package/src/components/slider/examples/hint-and-error.tsx +3 -5
  1026. package/src/components/slider/examples/in-form.tsx +21 -19
  1027. package/src/components/slider/examples/states.tsx +14 -10
  1028. package/src/components/smart-filter/COMPONENT.md +42 -22
  1029. package/src/components/smart-filter/examples/examples.module.css +3 -21
  1030. package/src/components/smart-filter/examples/many-values.tsx +12 -8
  1031. package/src/components/smart-filter/examples/ranges.tsx +2 -1
  1032. package/src/components/smart-filter/examples/sizes.tsx +9 -7
  1033. package/src/components/sparkline/COMPONENT.md +8 -3
  1034. package/src/components/sparkline/examples/curve.tsx +16 -11
  1035. package/src/components/sparkline/examples/examples.module.css +1 -1
  1036. package/src/components/sparkline/examples/signed-bars.tsx +2 -2
  1037. package/src/components/sparkline/examples/states.tsx +14 -10
  1038. package/src/components/spinner/COMPONENT.md +15 -9
  1039. package/src/components/spinner/examples/examples.module.css +2 -14
  1040. package/src/components/spinner/examples/overview.tsx +1 -1
  1041. package/src/components/stepper/COMPONENT.md +50 -41
  1042. package/src/components/stepper/examples/examples.module.css +1 -6
  1043. package/src/components/stepper/examples/narrow.tsx +1 -1
  1044. package/src/components/stepper/examples/sizes.tsx +6 -8
  1045. package/src/components/stepper/examples/states.tsx +44 -43
  1046. package/src/components/stepper/examples/with-icon.tsx +19 -17
  1047. package/src/components/switch/COMPONENT.md +22 -9
  1048. package/src/components/switch/examples/examples.module.css +2 -2
  1049. package/src/components/switch/examples/states.tsx +3 -3
  1050. package/src/components/tabs/COMPONENT.md +21 -16
  1051. package/src/components/tabs/examples/in-drawer.tsx +1 -1
  1052. package/src/components/tabs/examples/sizes.tsx +5 -10
  1053. package/src/components/tabs/examples/variants.tsx +19 -23
  1054. package/src/components/tag-select/COMPONENT.md +19 -6
  1055. package/src/components/tag-select/examples/creatable.tsx +2 -2
  1056. package/src/components/tag-select/examples/dismiss.tsx +23 -0
  1057. package/src/components/tag-select/examples/examples.module.css +3 -3
  1058. package/src/components/tag-select/examples/in-form.tsx +31 -32
  1059. package/src/components/tag-select/examples/sizes.tsx +2 -2
  1060. package/src/components/tag-select/examples/states.tsx +2 -2
  1061. package/src/components/textarea/COMPONENT.md +10 -6
  1062. package/src/components/textarea/examples/examples.module.css +3 -10
  1063. package/src/components/textarea/examples/in-form.tsx +3 -3
  1064. package/src/components/textarea/examples/sizes.tsx +10 -7
  1065. package/src/components/textarea/examples/states.tsx +29 -13
  1066. package/src/components/textarea/examples/validation.tsx +45 -36
  1067. package/src/components/thumbnail/COMPONENT.md +17 -13
  1068. package/src/components/thumbnail/examples/examples.module.css +1 -1
  1069. package/src/components/thumbnail/examples/states.tsx +1 -1
  1070. package/src/components/thumbnail/examples/variants.tsx +12 -1
  1071. package/src/components/timeline/COMPONENT.md +51 -35
  1072. package/src/components/timeline/examples/links.tsx +14 -14
  1073. package/src/components/timeline/examples/narrow.tsx +6 -6
  1074. package/src/components/timeline/examples/overview.tsx +6 -6
  1075. package/src/components/timeline/examples/sizes.tsx +28 -23
  1076. package/src/components/timeline/examples/structure.tsx +30 -30
  1077. package/src/components/timeline/examples/variants.tsx +40 -28
  1078. package/src/components/tooltip/COMPONENT.md +10 -6
  1079. package/src/components/tooltip/examples/examples.module.css +1 -5
  1080. package/src/components/tooltip/examples/non-interactive-trigger.tsx +1 -1
  1081. package/src/components/tooltip/examples/sizes.tsx +17 -10
  1082. package/src/components/typography/COMPONENT.md +18 -3
  1083. package/src/components/typography/examples/examples.module.css +3 -6
  1084. package/src/components/typography/examples/numeric.tsx +16 -0
  1085. package/src/components/video-note/COMPONENT.md +11 -7
  1086. package/src/components/visually-hidden/COMPONENT.md +8 -4
  1087. package/src/components/visually-hidden/examples/assertive.tsx +1 -1
  1088. package/src/components/visually-hidden/examples/overview.tsx +17 -7
  1089. package/src/components/voice-player/COMPONENT.md +15 -7
  1090. package/src/layout/app-shell/COMPONENT.md +53 -36
  1091. package/src/layout/app-shell/examples/examples.module.css +2 -22
  1092. package/src/layout/app-shell/examples/footer.tsx +10 -10
  1093. package/src/layout/app-shell/examples/overview.tsx +21 -25
  1094. package/src/layout/app-shell/examples/screen.module.css +2 -2
  1095. package/src/layout/app-shell/examples/screen.tsx +48 -47
  1096. package/src/layout/app-shell/examples/template.tsx +13 -17
  1097. package/src/layout/bottom-nav/COMPONENT.md +30 -20
  1098. package/src/layout/bottom-nav/examples/examples.module.css +2 -7
  1099. package/src/layout/bottom-nav/examples/floating-action.tsx +10 -19
  1100. package/src/layout/bottom-nav/examples/floating.tsx +10 -19
  1101. package/src/layout/bottom-nav/examples/in-app-shell.tsx +11 -19
  1102. package/src/layout/bottom-nav/examples/router.tsx +6 -5
  1103. package/src/layout/page/COMPONENT.md +353 -0
  1104. package/src/layout/page/examples/actions-collapse.tsx +45 -0
  1105. package/src/layout/page/examples/collapse.tsx +68 -0
  1106. package/src/{components/page-content → layout/page}/examples/examples.module.css +32 -16
  1107. package/{dist/skill/reference/components/page-content → src/layout/page}/examples/grid.tsx +18 -16
  1108. package/src/layout/page/examples/list-detail.tsx +112 -0
  1109. package/src/layout/page/examples/narrow.tsx +75 -0
  1110. package/src/layout/page/examples/overview.tsx +57 -0
  1111. package/{dist/skill/reference/components/page-content → src/layout/page}/examples/screen.module.css +1 -1
  1112. package/{dist/skill/reference/components/page-content → src/layout/page}/examples/screen.tsx +29 -19
  1113. package/{dist/skill/reference/components/page-content → src/layout/page}/examples/sections.tsx +17 -24
  1114. package/src/layout/page/examples/structure.tsx +41 -0
  1115. package/src/{components/page-toolbar/examples/narrow.tsx → layout/page/examples/tools.tsx} +38 -35
  1116. package/src/layout/page/examples/top-bar.tsx +85 -0
  1117. package/src/{components/page-content → layout/page}/examples/variants.tsx +13 -13
  1118. package/src/layout/sidebar/COMPONENT.md +51 -40
  1119. package/src/layout/sidebar/examples/account.tsx +1 -3
  1120. package/src/layout/sidebar/examples/brand-header.tsx +1 -3
  1121. package/src/layout/sidebar/examples/collapsible-groups.tsx +1 -3
  1122. package/src/layout/sidebar/examples/controlled-open.tsx +1 -3
  1123. package/src/layout/sidebar/examples/controlled.tsx +1 -3
  1124. package/src/layout/sidebar/examples/custom-part.tsx +1 -3
  1125. package/src/layout/sidebar/examples/dismiss.tsx +50 -0
  1126. package/src/layout/sidebar/examples/examples.module.css +7 -32
  1127. package/src/layout/sidebar/examples/narrow.tsx +47 -42
  1128. package/src/layout/sidebar/examples/nested-items.tsx +1 -3
  1129. package/src/layout/sidebar/examples/overview.tsx +1 -3
  1130. package/src/layout/sidebar/examples/persist.tsx +1 -3
  1131. package/src/layout/sidebar/examples/router.tsx +12 -13
  1132. package/src/layout/sidebar/examples/sizes.tsx +6 -6
  1133. package/src/styles/controls.css +2 -2
  1134. package/src/styles/fonts.css +22 -0
  1135. package/src/styles/globals.css +89 -12
  1136. package/src/styles/theme-dark.css +25 -24
  1137. package/src/styles/theme-light.css +70 -23
  1138. package/src/styles/tokens.css +17 -5
  1139. package/dist/components/dnd/useFlipList.d.ts +0 -17
  1140. package/dist/components/gantt/useEdgeAutoScroll.d.ts +0 -12
  1141. package/dist/components/modal/ModalDialog.d.ts +0 -46
  1142. package/dist/components/page-content/PageContent.d.ts +0 -173
  1143. package/dist/components/page-toolbar/PageToolbar.d.ts +0 -54
  1144. package/dist/hooks/useStateSwap.d.ts +0 -8
  1145. package/dist/internal/highlightTsxHtml.d.ts +0 -2
  1146. package/dist/internal/layoutPxFromPrimitives.d.ts +0 -6
  1147. package/dist/internal/mergeRefs.d.ts +0 -6
  1148. package/dist/layout/app-header/AppHeader.d.ts +0 -109
  1149. package/dist/skill/reference/components/drawer/examples/examples.module.css +0 -8
  1150. package/dist/skill/reference/components/page-content/COMPONENT.md +0 -272
  1151. package/dist/skill/reference/components/page-content/examples/list-detail.tsx +0 -106
  1152. package/dist/skill/reference/components/page-content/examples/narrow.tsx +0 -25
  1153. package/dist/skill/reference/components/page-content/examples/overview.tsx +0 -41
  1154. package/dist/skill/reference/components/page-toolbar/COMPONENT.md +0 -143
  1155. package/dist/skill/reference/components/page-toolbar/examples/examples.module.css +0 -16
  1156. package/dist/skill/reference/components/page-toolbar/examples/overview.tsx +0 -113
  1157. package/dist/skill/reference/components/page-toolbar/examples/save-changes.tsx +0 -40
  1158. package/dist/skill/reference/components/page-toolbar/examples/without-search.tsx +0 -60
  1159. package/dist/skill/reference/components/popover/examples/match-trigger-width.tsx +0 -23
  1160. package/dist/skill/reference/components/scroll-container/examples/chat.tsx +0 -101
  1161. package/dist/skill/reference/components/spinner/examples/loading-region.tsx +0 -22
  1162. package/dist/skill/reference/layout/app-header/COMPONENT.md +0 -186
  1163. package/dist/skill/reference/layout/app-header/examples/breadcrumbs.tsx +0 -37
  1164. package/dist/skill/reference/layout/app-header/examples/examples.module.css +0 -47
  1165. package/dist/skill/reference/layout/app-header/examples/in-app-shell.tsx +0 -69
  1166. package/dist/skill/reference/layout/app-header/examples/narrow.tsx +0 -28
  1167. package/dist/skill/reference/layout/app-header/examples/overview.tsx +0 -34
  1168. package/dist/skill/reference/layout/app-header/examples/page-title.tsx +0 -78
  1169. package/dist/skill/reference/layout/app-shell/examples/contained.tsx +0 -30
  1170. package/src/components/drawer/examples/examples.module.css +0 -8
  1171. package/src/components/page-content/COMPONENT.md +0 -272
  1172. package/src/components/page-content/examples/list-detail.tsx +0 -106
  1173. package/src/components/page-content/examples/narrow.tsx +0 -25
  1174. package/src/components/page-content/examples/overview.tsx +0 -41
  1175. package/src/components/page-toolbar/COMPONENT.md +0 -143
  1176. package/src/components/page-toolbar/examples/examples.module.css +0 -16
  1177. package/src/components/page-toolbar/examples/overview.tsx +0 -113
  1178. package/src/components/page-toolbar/examples/save-changes.tsx +0 -40
  1179. package/src/components/page-toolbar/examples/without-search.tsx +0 -60
  1180. package/src/components/popover/examples/match-trigger-width.tsx +0 -23
  1181. package/src/components/scroll-container/examples/chat.tsx +0 -101
  1182. package/src/components/spinner/examples/loading-region.tsx +0 -22
  1183. package/src/layout/app-header/COMPONENT.md +0 -186
  1184. package/src/layout/app-header/examples/breadcrumbs.tsx +0 -37
  1185. package/src/layout/app-header/examples/examples.module.css +0 -47
  1186. package/src/layout/app-header/examples/in-app-shell.tsx +0 -69
  1187. package/src/layout/app-header/examples/narrow.tsx +0 -28
  1188. package/src/layout/app-header/examples/overview.tsx +0 -34
  1189. package/src/layout/app-header/examples/page-title.tsx +0 -78
  1190. package/src/layout/app-shell/examples/contained.tsx +0 -30
@@ -33,7 +33,9 @@ export type KanbanColumnMove = {
33
33
  index: number;
34
34
  };
35
35
  /** What opened a card: a click on it, or Enter / Space on the focused card. */
36
- export type KanbanItemClickEvent = React.MouseEvent<HTMLElement> | React.KeyboardEvent<HTMLElement>;
36
+ export type KanbanItemOpenEvent = React.MouseEvent<HTMLElement> | React.KeyboardEvent<HTMLElement>;
37
+ /** The heading level of the column titles in the page outline. */
38
+ export type KanbanColumnTitleAs = "h2" | "h3" | "h4";
37
39
  /** How columns stand on the board: bare columns of cards, or filled wells. */
38
40
  export type KanbanVariant = "plain" | "line" | "well";
39
41
  /** System strings of the board. `{token}` values are substituted. */
@@ -57,92 +59,118 @@ export type KanbanLabels = {
57
59
  /** Spoken when a column's move is refused (its `onColumnOrderChange` promise rejected): `{column}`. */
58
60
  columnMoveFailed: string;
59
61
  };
60
- export declare const defaultKanbanLabels: KanbanLabels;
62
+ export declare const KANBAN_LABELS: KanbanLabels;
61
63
  export type KanbanRootProps<T> = Omit<React.HTMLAttributes<HTMLDivElement>, "children" | "defaultValue"> & {
62
- /** Every column; `columnOrder` decides their order (array order by default). */
64
+ /**
65
+ * Every column: `{ id, title, description?, color?, limit?, locked? }`, drawn in `columnOrder`. `color` is a `PaletteColor` for the count badge, `limit` a WIP limit, `locked` keeps a system stage in place.
66
+ */
63
67
  columns: readonly KanbanColumn[];
64
- /** Every card the board can show; `value` decides where each one stands. */
68
+ /**
69
+ * Every card the board can show; `value` decides where each one stands.
70
+ */
65
71
  items: readonly T[];
66
- /** Stable unique id of a card. */
72
+ /**
73
+ * Stable unique id of a card, the one used in `value`.
74
+ */
67
75
  getId: (item: T) => string;
68
- /** Spoken by the live region. Defaults to the id. */
76
+ /**
77
+ * Spoken by the live region.
78
+ */
69
79
  getLabel?: (item: T) => string;
70
- /** Card ids per column (controlled). */
80
+ /**
81
+ * Card ids per column (controlled): `{ [columnId]: id[] }`. Ids missing from `items` are skipped.
82
+ */
71
83
  value?: KanbanValue;
72
- /** Initial card ids per column (uncontrolled). */
84
+ /**
85
+ * Initial card ids per column (uncontrolled).
86
+ */
73
87
  defaultValue?: KanbanValue;
74
88
  /**
75
- * A card moved: the new placement first, then what moved. Return a promise to save on a server:
76
- * the card stays in its new place, busy, until it settles; reject — it glides back.
89
+ * A card moved: the new placement, then `{ id, from, to, index }` to save. Return the save's promise: the card waits busy in its new place; a rejection glides it back.
77
90
  */
78
91
  onValueChange?: (value: KanbanValue, move: KanbanMove) => void | Promise<void>;
79
- /** Column ids in their order (controlled). */
92
+ /**
93
+ * Column ids in their order (controlled). Columns it does not name follow in `columns` order.
94
+ */
80
95
  columnOrder?: readonly string[];
81
- /** Initial column ids in their order (uncontrolled). Defaults to the order of `columns`. */
96
+ /**
97
+ * Initial column ids in their order (uncontrolled).
98
+ */
82
99
  defaultColumnOrder?: readonly string[];
83
100
  /**
84
- * A column moved: the new order first, then what moved. Return a promise to save on a server:
85
- * the column stays in its new place, busy, until it settles; reject — it glides back.
101
+ * A column moved: the new order, then `{ id, index }` to save. Return the save's promise: the column waits busy in its new place; a rejection glides it back.
86
102
  */
87
103
  onColumnOrderChange?: (order: readonly string[], move: KanbanColumnMove) => void | Promise<void>;
88
- /** A grip in every column header moves the column by pointer, touch and keyboard. */
104
+ /**
105
+ * A grip (`Dnd.Handle`) at the end of every column header moves the column by pointer, touch hold and Alt + ← / →; the cards travel with it.
106
+ */
89
107
  reorderableColumns?: boolean;
90
- /** Renders one card; return a `Kanban.Item`. */
108
+ /**
109
+ * Renders one card; return a `Kanban.Item`.
110
+ */
91
111
  renderItem: (item: T) => React.ReactNode;
92
112
  /**
93
- * The card is a link: a real `<a>` named by `getLabel` covers the card and is its tab stop, so a
94
- * click, ⌘/Ctrl-click, a middle click and «open in new tab» work anywhere on it. A drag never
95
- * follows it; Alt + arrows still move the card from it.
113
+ * The card is a link: a real `<a>` named by `getLabel` covers it and is its tab stop — a click, ⌘/Ctrl-click, a middle click, a new tab. A press on it still drags the card; a drag never follows it.
96
114
  */
97
115
  getItemHref?: (item: T) => string;
98
116
  /**
99
- * Opens a card in place: a click on it (never on a control inside it, never after a drag) or
100
- * Enter / Space on the focused card. With `getItemHref` it gets the plain clicks only — call
101
- * `event.preventDefault()` there to route in the app instead of loading the page.
117
+ * Opens a card in place (a Drawer): a click, Enter or Space; never from a control inside it or after a drag. With `getItemHref` it gets plain clicks: `event.preventDefault()` routes in the app.
118
+ */
119
+ onItemOpen?: (item: T, event: KanbanItemOpenEvent) => void;
120
+ /**
121
+ * Heading level of the column titles in the page outline; the look does not change.
122
+ */
123
+ columnTitleAs?: KanbanColumnTitleAs;
124
+ /**
125
+ * Trailing actions of a column header (add a card, a menu); kit controls inside take the `s` tier.
102
126
  */
103
- onItemClick?: (item: T, event: KanbanItemClickEvent) => void;
104
- /** Renders the trailing actions of a column header (add a card, a menu). */
105
127
  renderColumnActions?: (column: KanbanColumn) => React.ReactNode;
106
128
  /**
107
- * Renders the meta line under a column's title (a stage's figures: «12 сделок · 4,8 млн ₽»).
108
- * It describes the column's list, like `description`.
129
+ * The meta line under a column's title and description: the stage's figures («12 сделок · 4,8 млн ₽»). Like `description`, it describes the column's list.
109
130
  */
110
131
  renderColumnMeta?: (column: KanbanColumn) => React.ReactNode;
111
132
  /**
112
- * Refuses a card in a column (a workflow rule): `false`, or a string that says why — spoken and
113
- * shown under the carried card. The column turns `danger` before the release.
133
+ * A workflow rule: refuses card `id` in column `columnId` — `false`, or a string that says why (spoken and shown under the carried card). The column turns `danger` before the release.
114
134
  */
115
135
  canDrop?: (id: string, columnId: string) => boolean | string;
116
136
  /**
117
- * `plain`: no wells, the cards stand on the host under a filled header plate; `line`: no wells, a
118
- * bare header over a faint line; `well`: every column is a filled well.
137
+ * No wells: `plain` — a filled header plate over the cards, `line` — a bare header over a faint line; cards stand on the host. `well`: every column is a filled well holding its cards (bounded queues).
119
138
  */
120
139
  variant?: KanbanVariant;
121
- /** Columns show skeleton cards; the cards cross-fade in when it turns off. */
140
+ /**
141
+ * Columns show skeleton cards in the card geometry; the cards cross-fade in when it turns off.
142
+ */
122
143
  loading?: boolean;
123
- /** No drag, no keyboard moves. */
144
+ /**
145
+ * Read-only board: no drag, no keyboard moves, no column grips; `onItemOpen` and `getItemHref` still open cards.
146
+ */
124
147
  disabled?: boolean;
148
+ /**
149
+ * Built-in strings, see Labels.
150
+ */
125
151
  labels?: Partial<KanbanLabels>;
126
152
  ref?: React.Ref<HTMLDivElement>;
127
153
  };
128
154
  /**
129
155
  * A board of columns: cards move within and between columns by pointer, touch (a hold) and
130
- * keyboard (Alt + arrows, Dnd's linked lists). Mounts its own `Dnd.Root` unless one is already
131
- * above it.
156
+ * keyboard (Alt + arrows, Dnd's linked lists). Its `Dnd.Root` joins a drag session already above
157
+ * it.
132
158
  */
133
159
  declare function KanbanRoot<T>(props: KanbanRootProps<T>): import("react/jsx-runtime").JSX.Element;
134
160
  declare namespace KanbanRoot {
135
161
  var displayName: string;
136
162
  }
137
163
  export type KanbanItemProps = Omit<React.HTMLAttributes<HTMLElement>, "id"> & {
138
- /** This card cannot be dragged or moved. */
164
+ /**
165
+ * This card cannot be dragged or moved.
166
+ */
139
167
  disabled?: boolean;
140
168
  ref?: React.Ref<HTMLElement>;
141
169
  };
142
170
  /**
143
171
  * One card: an `<li>` on a filled surface; drags by the whole card, moves with Alt + arrows. While
144
172
  * the owner saves its move it is busy: dimmed under a spinner, still. With `getItemHref` a link
145
- * covers it; with `onItemClick` a click, Enter or Space opens it.
173
+ * covers it; with `onItemOpen` a click, Enter or Space opens it.
146
174
  */
147
175
  declare function KanbanItem({ disabled, className, children, onClick, onKeyDown, ...rest }: KanbanItemProps): import("react/jsx-runtime").JSX.Element;
148
176
  declare namespace KanbanItem {
@@ -1,7 +1,9 @@
1
1
  import type * as React from "react";
2
2
  import type { ControlSize } from "../../internal/states";
3
3
  export type KbdProps = Omit<React.HTMLAttributes<HTMLElement>, "size"> & {
4
- /** Badge tier; without it the key follows the surrounding control one tier down, else `m`. */
4
+ /**
5
+ * Badge tier, 16 · 20 · 24 · 28 · 32 px high. Without it the key follows the surrounding control one tier down (m → s); outside a control it is `m`.
6
+ */
5
7
  size?: ControlSize;
6
8
  ref?: React.Ref<HTMLElement>;
7
9
  };
@@ -4,21 +4,50 @@ export type LabelLabels = {
4
4
  /** Muted marker after the label text when `optional`. */
5
5
  optional: string;
6
6
  };
7
+ export declare const LABEL_LABELS: LabelLabels;
7
8
  export type LabelRootProps = Omit<React.LabelHTMLAttributes<HTMLLabelElement>, "size"> & {
9
+ /**
10
+ * Disabled color for the text and the markers, `aria-disabled`. A disabled `Fieldset` around the label sets it too.
11
+ */
8
12
  disabled?: boolean;
9
- /** Tier. Default: the tier of the surrounding control (a form, a panel), else `m`. */
13
+ /**
14
+ * Size of the paired field: xs/s 12/16 · m 13/20 · l/xl 14/20, weight 500. Without it the tier of its host, else `m`; the label provides its tier to the icons inside.
15
+ */
10
16
  size?: ControlSize;
11
- /** Appends a red `*` (decorative, `aria-hidden`). Put native `required` on the control itself. */
17
+ /**
18
+ * Appends a red `*` (`aria-hidden`). Put native `required` on the control itself.
19
+ */
12
20
  required?: boolean;
13
- /** Appends the muted optional marker (`labels.optional`). */
21
+ /**
22
+ * Appends the muted optional marker (`labels.optional`).
23
+ */
14
24
  optional?: boolean;
25
+ /**
26
+ * Quieter: secondary text on one line, cut with an ellipsis — a column heading under the group's own label (FieldList).
27
+ */
28
+ secondary?: boolean;
29
+ /**
30
+ * Built-in strings, see Labels.
31
+ */
15
32
  labels?: Partial<LabelLabels>;
16
33
  ref?: React.Ref<HTMLLabelElement>;
17
34
  };
18
- declare function LabelRoot({ className, disabled, children, size: sizeProp, required, optional, labels, ref, ...rest }: LabelRootProps): import("react/jsx-runtime").JSX.Element;
35
+ declare function LabelRoot({ className, disabled: disabledProp, children, size: sizeProp, required, optional, secondary, labels: labelsProp, ref, ...rest }: LabelRootProps): import("react/jsx-runtime").JSX.Element;
19
36
  declare namespace LabelRoot {
20
37
  var displayName: string;
21
38
  }
39
+ /**
40
+ * The marks after a field name: the red `*` of a required field (decorative, `aria-hidden`; the
41
+ * control carries `required`) or the muted optional marker (visible text, part of the name). The
42
+ * one copy of the kit — Label and the choice rows (Checkbox, Switch) draw them. Inside a Label the
43
+ * marks dim with it; elsewhere `disabled` dims them.
44
+ */
45
+ export declare function LabelMarks({ required, optional, optionalLabel, disabled, }: {
46
+ required?: boolean;
47
+ optional?: boolean;
48
+ optionalLabel: string;
49
+ disabled?: boolean;
50
+ }): import("react/jsx-runtime").JSX.Element;
22
51
  export type LabelIconProps = React.HTMLAttributes<HTMLSpanElement> & {
23
52
  ref?: React.Ref<HTMLSpanElement>;
24
53
  };
@@ -1,20 +1,50 @@
1
1
  import type * as React from "react";
2
2
  import type { ControlSize, Tone } from "../../internal/states";
3
- export type LinkButtonProps = React.AnchorHTMLAttributes<HTMLAnchorElement> & {
4
- /** Tier. Default: the tier of the surrounding control or text host, else `m`. */
3
+ type LinkButtonBaseProps = Omit<React.AnchorHTMLAttributes<HTMLAnchorElement>, "href"> & {
4
+ /**
5
+ * Control tier: text 12 · 13 · 14 · 16 · 18, line height and icon size. Without it the tier of its host (a form, a panel, a hint), else `m`.
6
+ */
5
7
  size?: ControlSize;
6
- /** `accent` — a regular link; `neutral` — quiet links in footers, metadata and dense navigation. */
7
- tone?: Extract<Tone, "accent" | "neutral">;
8
- disabled?: boolean;
9
8
  /**
10
- * Merges the link look onto its single child instead of rendering `<a>`: a router link, or a
11
- * `<button type="button">` for an inline action that is not navigation («выберите файл»).
12
- * `disabled` becomes `aria-disabled` and swallows the click.
9
+ * `accent` — a regular link; `neutral` — secondary text for footers and metadata; `muted` — muted text with no underline, for trails such as a breadcrumb.
10
+ */
11
+ tone?: Extract<Tone, "accent" | "neutral"> | "muted";
12
+ /**
13
+ * A link inside running text: it takes the text's type, wraps with it and keeps its underline drawn.
13
14
  */
14
- asChild?: boolean;
15
+ inline?: boolean;
16
+ /**
17
+ * Renders `<a role="link" aria-disabled="true">` without `href`, out of the Tab order, and swallows the click; `id`, `aria-*` and the other native props stay.
18
+ */
19
+ disabled?: boolean;
15
20
  ref?: React.Ref<HTMLAnchorElement>;
16
21
  };
17
- export declare function LinkButton({ size: sizeProp, tone, disabled: disabledProp, asChild, children, className, href, onClick, ref, ...rest }: LinkButtonProps): import("react/jsx-runtime").JSX.Element;
22
+ /** A link has a URL; with `asChild` the child (a router link, a `<button>`) owns its target. */
23
+ export type LinkButtonProps = LinkButtonBaseProps & ({
24
+ /**
25
+ * Merges the link look onto its single child instead of rendering `<a>`: a router link, or a `<button type="button">` for an inline action that is not navigation.
26
+ */
27
+ asChild?: false;
28
+ /**
29
+ * The destination. Required without `asChild`; with `asChild` the child carries its own target.
30
+ */
31
+ href: string;
32
+ } | {
33
+ /**
34
+ * Merges the link look onto its single child instead of rendering `<a>`: a router link, or a `<button type="button">` for an inline action that is not navigation.
35
+ */
36
+ asChild: true;
37
+ /**
38
+ * The destination. Required without `asChild`; with `asChild` the child carries its own target.
39
+ */
40
+ href?: never;
41
+ /**
42
+ * Text and optional `Icon`s before or after it; the text is the accessible name. With `asChild`, the one child element.
43
+ */
44
+ children: React.ReactElement;
45
+ });
46
+ export declare function LinkButton({ size: sizeProp, tone, inline, disabled: disabledProp, asChild, children, className, href, ref, ...rest }: LinkButtonProps): import("react/jsx-runtime").JSX.Element;
18
47
  export declare namespace LinkButton {
19
48
  var displayName: string;
20
49
  }
50
+ export {};
@@ -4,40 +4,47 @@ export type ListLabels = {
4
4
  /** `aria-label` of a row's drag handle (`onReorder`); `{label}` is the row's text. */
5
5
  reorderItem: string;
6
6
  };
7
+ export declare const LIST_LABELS: ListLabels;
7
8
  export type ListRootProps = Omit<React.HTMLAttributes<HTMLUListElement>, "children"> & {
8
- /** Row tier: height, text, icon and avatar size; counts take one tier down. Default `m`. */
9
+ /**
10
+ * Row tier: height, text, icon and avatar size; counts take one tier down. Without it the tier of its host, else `m`.
11
+ */
9
12
  size?: ControlSize;
10
13
  /**
11
- * Rows reorder by a leading handle (drag, a touch hold, Alt + ↑ / ↓): the row `id` now stands
12
- * in front of `beforeId` (`List.Item` `value`s; `null` — last). Apply it with `moveBefore`.
13
- * Return a promise to save on a server: the row stays in its new place with a busy handle, a
14
- * rejection moves it back. Every `List.Item` then needs a `value`.
14
+ * Rows reorder by a leading handle (drag, touch hold, Alt + ↑ / ↓): item `value` `id` goes before `beforeId` (`null` = last). Apply with `moveBefore`; a returned promise keeps the row busy, a rejection moves it back.
15
15
  */
16
16
  onReorder?: (id: string, beforeId: string | null) => void | Promise<void>;
17
- /** Built-in strings. */
17
+ /**
18
+ * Built-in strings, see Labels.
19
+ */
18
20
  labels?: Partial<ListLabels>;
19
- /** `List.Item`s. */
21
+ /**
22
+ * `List.Item`s.
23
+ */
20
24
  children?: React.ReactNode;
21
25
  ref?: React.Ref<HTMLUListElement>;
22
26
  };
23
27
  /**
24
- * A selectable navigation list: the master half of a list + detail screen (conversations, tickets,
25
- * mail, records). Rows are buttons or links; the open record is `current`.
28
+ * A selectable navigation list: the master half of a list + detail screen (tickets, mail,
29
+ * records). Rows are buttons or links; the open record is `current`; rows the data adds or takes
30
+ * out rise in and close up in place.
26
31
  */
27
- declare function ListRoot({ size, onReorder, labels, className, children, ...rest }: ListRootProps): import("react/jsx-runtime").JSX.Element;
32
+ declare function ListRoot({ size: sizeProp, onReorder, labels, className, children, ...rest }: ListRootProps): React.ReactElement<unknown, string | React.JSXElementConstructor<any>>;
28
33
  declare namespace ListRoot {
29
34
  var displayName: string;
30
35
  }
31
36
  export type ListItemIconProps = Omit<React.HTMLAttributes<HTMLSpanElement>, "children"> & {
32
- /** An `Avatar.Root` (sized by the row) or an `Icon`. */
37
+ /**
38
+ * An `Avatar.Root` or an `Icon`.
39
+ */
33
40
  children: React.ReactNode;
34
41
  ref?: React.Ref<HTMLSpanElement>;
35
42
  };
36
43
  /**
37
- * The leading picture of a row: an avatar the slot sizes to the tier, or an icon. After the text
38
- * it is a quiet trailing glyph. Decorative: the text names the row.
44
+ * The leading picture of a row: an avatar of the row tier, or an icon. After the text it is a
45
+ * quiet trailing glyph. Decorative: the text names the row.
39
46
  */
40
- declare function ListItemIcon({ className, ...rest }: ListItemIconProps): import("react/jsx-runtime").JSX.Element;
47
+ declare function ListItemIcon({ className, children, ...rest }: ListItemIconProps): import("react/jsx-runtime").JSX.Element;
41
48
  declare namespace ListItemIcon {
42
49
  var displayName: string;
43
50
  }
@@ -66,11 +73,14 @@ declare namespace ListItemMeta {
66
73
  var displayName: string;
67
74
  }
68
75
  export type ListItemCountProps = Omit<React.HTMLAttributes<HTMLSpanElement>, "children" | "color"> & {
69
- /** Badge hue. Default `gray`; a hue for what needs attention (unread). */
76
+ /**
77
+ * Badge hue; a hue for what needs attention (unread).
78
+ */
70
79
  color?: PaletteColor;
71
- /** The number (or a short status). */
80
+ /**
81
+ * The number or a short status.
82
+ */
72
83
  children: React.ReactNode;
73
- /** The Badge `<span>`. */
74
84
  ref?: React.Ref<HTMLSpanElement>;
75
85
  };
76
86
  /** A count at the end of the row: a soft Badge one tier below the rows. */
@@ -79,32 +89,44 @@ declare namespace ListItemCount {
79
89
  var displayName: string;
80
90
  }
81
91
  type ListItemOwnProps = {
82
- /** Stable id of the row; required in a reorderable list (`List.Root` `onReorder`). */
92
+ /**
93
+ * Stable id of the row; required in a reorderable list (`onReorder` reports it).
94
+ */
83
95
  value?: string;
84
96
  /**
85
- * The open record: the selected fill and `aria-current` — `"true"` on a button, `"page"` on a
86
- * link (`href`, `asChild`). Links rendered by a router may set it themselves.
97
+ * The open record: the selected fill and `aria-current` — `"true"` on a button, `"page"` on a link.
87
98
  */
88
99
  current?: boolean;
100
+ /**
101
+ * Muted and out of the Tab order: a disabled button, or `aria-disabled` and no navigation on a link.
102
+ */
89
103
  disabled?: boolean;
90
- /** Render the single child element (a router link) as the row; its children are the content. */
104
+ /**
105
+ * Renders the single child (a router link) as the row; its children are the content.
106
+ */
91
107
  asChild?: boolean;
92
108
  /**
93
- * Content and parts: `List.ItemIcon`, `List.ItemText`, `List.ItemDescription`, `List.ItemMeta`,
94
- * `List.ItemCount`.
109
+ * `List.ItemIcon`, `List.ItemText`, `List.ItemDescription`, `List.ItemMeta`, `List.ItemCount`; loose text becomes the text line.
95
110
  */
96
111
  children?: React.ReactNode;
97
112
  };
98
113
  export type ListItemProps = ListItemOwnProps & Omit<React.ComponentPropsWithoutRef<"button">, keyof ListItemOwnProps> & {
99
- /** Renders an `<a>` instead of a `<button>`. */
114
+ /**
115
+ * Renders an `<a>` instead of a `<button>`; dropped while `disabled`.
116
+ */
100
117
  href?: string;
118
+ /**
119
+ * Where the `<a>` opens (`href` only).
120
+ */
101
121
  target?: string;
122
+ /**
123
+ * Relationship of the `<a>` (`href` only).
124
+ */
102
125
  rel?: string;
103
- /** The `<button>`, `<a>` or the `asChild` element (not the `<li>`). */
104
126
  ref?: React.Ref<HTMLElement>;
105
127
  };
106
128
  /** A row of the list: an `<li>` holding a full-width button or link. */
107
- declare function ListItem({ value, current, disabled, asChild, href, className, children, onClick, type, ref, ...rest }: ListItemProps): import("react/jsx-runtime").JSX.Element;
129
+ declare function ListItem({ value, current, disabled, asChild, href, className, children, onClick, type, ref, target, rel, ...rest }: ListItemProps): import("react/jsx-runtime").JSX.Element;
108
130
  declare namespace ListItem {
109
131
  var displayName: string;
110
132
  }
@@ -1,25 +1,40 @@
1
- import type * as React from "react";
1
+ import * as React from "react";
2
2
  import type { ControlSize } from "../../internal/states";
3
3
  export type LoginFormRootProps = {
4
- /** Tier of spacing and type; fields and buttons inside without their own `size` take it. Default `m`. */
4
+ /**
5
+ * Tier of padding, gaps and text roles; every field and button inside without its own `size` takes it. Without it the form takes the tier of a sized host (a Modal).
6
+ */
5
7
  size?: ControlSize;
6
8
  /**
7
- * Header layout. `start` (default): the Modal-header layout — a rounded accent tile on the left,
8
- * title over description on its right. `center`: round logo above centered text.
9
+ * `start` — the Modal header layout (rounded accent tile left, title over description right); `center` — a round logo above centered text.
9
10
  */
10
11
  align?: "center" | "start";
11
- /** Removes the card shadow, e.g. inside a modal or on a plain page. No border in either case. */
12
+ /**
13
+ * Removes the card shadow (inside a Modal or on a plain page). No border either way.
14
+ */
12
15
  flat?: boolean;
16
+ /**
17
+ * Class on the card.
18
+ */
13
19
  className?: string;
20
+ /**
21
+ * The parts: Header, Body.
22
+ */
14
23
  children?: React.ReactNode;
15
24
  ref?: React.Ref<HTMLDivElement>;
16
25
  } & React.HTMLAttributes<HTMLDivElement>;
17
- declare function LoginFormRoot({ size, align, flat, className, children, ref, ...rest }: LoginFormRootProps): import("react/jsx-runtime").JSX.Element;
26
+ declare function LoginFormRoot({ size: sizeProp, align, flat, className, children, ref, ...rest }: LoginFormRootProps): import("react/jsx-runtime").JSX.Element;
18
27
  declare namespace LoginFormRoot {
19
28
  var displayName: string;
20
29
  }
21
30
  export type LoginFormHeaderProps = {
31
+ /**
32
+ * Class on the element.
33
+ */
22
34
  className?: string;
35
+ /**
36
+ * Logo, Title, Description.
37
+ */
23
38
  children?: React.ReactNode;
24
39
  ref?: React.Ref<HTMLElement>;
25
40
  } & React.HTMLAttributes<HTMLElement>;
@@ -29,7 +44,13 @@ declare namespace LoginFormHeader {
29
44
  var displayName: string;
30
45
  }
31
46
  export type LoginFormLogoProps = {
47
+ /**
48
+ * Class on the element.
49
+ */
32
50
  className?: string;
51
+ /**
52
+ * The product mark or an `Icon`.
53
+ */
33
54
  children?: React.ReactNode;
34
55
  ref?: React.Ref<HTMLDivElement>;
35
56
  } & React.HTMLAttributes<HTMLDivElement>;
@@ -43,9 +64,17 @@ declare namespace LoginFormLogo {
43
64
  var displayName: string;
44
65
  }
45
66
  export type LoginFormTitleProps = {
46
- /** Heading element. Default `h1`; use `h2` when the form sits inside a page that already has an `h1`. */
67
+ /**
68
+ * Heading level; `h2` when the page already has an `h1`.
69
+ */
47
70
  as?: "h1" | "h2" | "h3";
71
+ /**
72
+ * Class on the element.
73
+ */
48
74
  className?: string;
75
+ /**
76
+ * The heading text.
77
+ */
49
78
  children?: React.ReactNode;
50
79
  ref?: React.Ref<HTMLHeadingElement>;
51
80
  } & Omit<React.HTMLAttributes<HTMLHeadingElement>, "children">;
@@ -54,7 +83,13 @@ declare namespace LoginFormTitle {
54
83
  var displayName: string;
55
84
  }
56
85
  export type LoginFormDescriptionProps = {
86
+ /**
87
+ * Class on the element.
88
+ */
57
89
  className?: string;
90
+ /**
91
+ * The line text.
92
+ */
58
93
  children?: React.ReactNode;
59
94
  ref?: React.Ref<HTMLParagraphElement>;
60
95
  } & Omit<React.HTMLAttributes<HTMLParagraphElement>, "children">;
@@ -63,7 +98,13 @@ declare namespace LoginFormDescription {
63
98
  var displayName: string;
64
99
  }
65
100
  export type LoginFormBodyProps = {
101
+ /**
102
+ * Class on the element.
103
+ */
66
104
  className?: string;
105
+ /**
106
+ * Actions, `Divider`, Form, Footer.
107
+ */
67
108
  children?: React.ReactNode;
68
109
  ref?: React.Ref<HTMLDivElement>;
69
110
  } & React.HTMLAttributes<HTMLDivElement>;
@@ -73,7 +114,13 @@ declare namespace LoginFormBody {
73
114
  var displayName: string;
74
115
  }
75
116
  export type LoginFormFormProps = {
117
+ /**
118
+ * Class on the element.
119
+ */
76
120
  className?: string;
121
+ /**
122
+ * The fields and the Actions.
123
+ */
77
124
  children?: React.ReactNode;
78
125
  ref?: React.Ref<HTMLFormElement>;
79
126
  } & React.FormHTMLAttributes<HTMLFormElement>;
@@ -83,7 +130,13 @@ declare namespace LoginFormForm {
83
130
  var displayName: string;
84
131
  }
85
132
  export type LoginFormActionsProps = {
133
+ /**
134
+ * Class on the element.
135
+ */
86
136
  className?: string;
137
+ /**
138
+ * The buttons.
139
+ */
87
140
  children?: React.ReactNode;
88
141
  ref?: React.Ref<HTMLDivElement>;
89
142
  } & React.HTMLAttributes<HTMLDivElement>;
@@ -96,7 +149,13 @@ declare namespace LoginFormActions {
96
149
  var displayName: string;
97
150
  }
98
151
  export type LoginFormFooterProps = {
152
+ /**
153
+ * Class on the element.
154
+ */
99
155
  className?: string;
156
+ /**
157
+ * The line with a `LinkButton`.
158
+ */
100
159
  children?: React.ReactNode;
101
160
  ref?: React.Ref<HTMLParagraphElement>;
102
161
  } & Omit<React.HTMLAttributes<HTMLParagraphElement>, "children">;