prime-ui-kit 0.15.0 → 0.16.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.
- package/README.md +72 -63
- package/dist/chunks/{chunk-XJAVS6FH.js → chunk-4PSQ64S4.js} +3094 -1750
- package/dist/chunks/{chunk-THFZIHKU.js → chunk-6TPHKCUJ.js} +9392 -9225
- package/dist/chunks/{chunk-6TI4DSM5.js → chunk-A7OQWH6R.js} +1 -1
- package/dist/chunks/{chunk-2IKH55MI.js → chunk-HDBQICPW.js} +170 -138
- package/dist/chunks/{chunk-Q3BFRQHZ.js → chunk-U3Q2I3MY.js} +169 -10
- package/dist/color-picker.js +3 -3
- package/dist/components/accordion/Accordion.d.ts +52 -5
- package/dist/components/avatar/Avatar.d.ts +31 -8
- package/dist/components/badge/Badge.d.ts +93 -25
- package/dist/components/banner/Banner.d.ts +17 -10
- package/dist/components/breadcrumb/Breadcrumb.d.ts +18 -5
- package/dist/components/button/Button.d.ts +102 -43
- package/dist/components/button-group/ButtonGroup.d.ts +32 -8
- package/dist/components/card/Card.d.ts +15 -9
- package/dist/components/chart-frame/ChartFrame.d.ts +58 -51
- package/dist/components/chat/Chat.d.ts +77 -38
- package/dist/components/chat/ChatPinned.d.ts +20 -8
- package/dist/components/chat/ChatRows.d.ts +3 -0
- package/dist/components/chat/MessageList.d.ts +14 -19
- package/dist/components/chat/chatContext.d.ts +3 -3
- package/dist/components/chat/messageFlow.d.ts +1 -1
- package/dist/components/chat-list/ChatList.d.ts +88 -34
- package/dist/components/checkbox/Checkbox.d.ts +61 -12
- package/dist/components/code-block/CodeBlock.d.ts +11 -5
- package/dist/components/color-field/ColorField.d.ts +54 -14
- package/dist/components/color-picker/ColorPicker.d.ts +64 -30
- package/dist/components/color-picker/ColorPresets.d.ts +68 -13
- package/dist/components/color-swatches/ColorSwatches.d.ts +90 -18
- package/dist/components/command-menu/CommandMenu.d.ts +86 -27
- package/dist/components/composer/Composer.d.ts +82 -41
- package/dist/components/composer/useRecorder.d.ts +0 -2
- package/dist/components/confirm-dialog/ConfirmDialog.d.ts +40 -16
- package/dist/components/crossfade/Crossfade.d.ts +5 -8
- package/dist/components/data-table/ColumnsMenu.d.ts +6 -2
- package/dist/components/data-table/DataTable.d.ts +157 -58
- package/dist/components/data-table/Footer.d.ts +2 -4
- package/dist/components/data-table/Row.d.ts +1 -1
- package/dist/components/data-table/StateRows.d.ts +2 -2
- package/dist/components/data-table/reorder.d.ts +10 -10
- package/dist/components/data-table/types.d.ts +5 -0
- package/dist/components/data-table/useInfiniteRows.d.ts +3 -3
- package/dist/components/datepicker/Datepicker.d.ts +61 -12
- package/dist/components/datepicker/DatepickerPanel.d.ts +76 -16
- package/dist/components/datepicker/panelLayout.d.ts +6 -11
- package/dist/components/description-list/DescriptionList.d.ts +40 -11
- package/dist/components/digit-input/DigitInput.d.ts +50 -19
- package/dist/components/divider/Divider.d.ts +15 -5
- package/dist/components/dnd/Dnd.d.ts +152 -41
- package/dist/components/dnd/geometry.d.ts +0 -8
- package/dist/components/dnd/labels.d.ts +1 -1
- package/dist/components/dnd/useDropTarget.d.ts +0 -2
- package/dist/components/dnd/useSortableList.d.ts +6 -1
- package/dist/components/drawer/Drawer.d.ts +39 -18
- package/dist/components/dropdown/Dropdown.d.ts +90 -19
- package/dist/components/empty-page/EmptyPage.d.ts +14 -15
- package/dist/components/example-frame/ExampleFrame.d.ts +38 -8
- package/dist/components/field-list/FieldList.d.ts +57 -19
- package/dist/components/fieldset/Fieldset.d.ts +12 -7
- package/dist/components/file-upload/FileUpload.d.ts +119 -42
- package/dist/components/gallery/Gallery.d.ts +44 -16
- package/dist/components/gallery/layout.d.ts +4 -1
- package/dist/components/gantt/Gantt.d.ts +69 -34
- package/dist/components/gantt/GanttRow.d.ts +2 -2
- package/dist/components/hint/Hint.d.ts +10 -4
- package/dist/components/index.d.ts +19 -18
- package/dist/components/input/Input.d.ts +78 -25
- package/dist/components/kanban/Kanban.d.ts +64 -36
- package/dist/components/kbd/Kbd.d.ts +3 -1
- package/dist/components/label/Label.d.ts +33 -4
- package/dist/components/link-button/LinkButton.d.ts +40 -10
- package/dist/components/list/List.d.ts +48 -26
- package/dist/components/login-form/LoginForm.d.ts +66 -7
- package/dist/components/media-viewer/MediaViewer.d.ts +46 -18
- package/dist/components/media-viewer/physics.d.ts +0 -2
- package/dist/components/media-viewer/viewerEngine.d.ts +0 -1
- package/dist/components/message/Message.d.ts +27 -16
- package/dist/components/message/MessageCards.d.ts +49 -10
- package/dist/components/message/MessageFile.d.ts +19 -5
- package/dist/components/message/MessageParts.d.ts +44 -18
- package/dist/components/message/MessageReactionBar.d.ts +3 -1
- package/dist/components/message/MessageTyping.d.ts +10 -6
- package/dist/components/message/bubbleMorph.d.ts +2 -0
- package/dist/components/modal/Modal.d.ts +6 -6
- package/dist/components/native-select/NativeSelect.d.ts +22 -7
- package/dist/components/notification/Notification.d.ts +35 -11
- package/dist/components/notification/NotificationStore.d.ts +12 -3
- package/dist/components/page-content/PageContent.d.ts +56 -37
- package/dist/components/page-toolbar/PageToolbar.d.ts +7 -6
- package/dist/components/pagination/Pagination.d.ts +25 -6
- package/dist/components/popover/Popover.d.ts +54 -31
- package/dist/components/progress-bar/ProgressBar.d.ts +37 -12
- package/dist/components/progress-circle/ProgressCircle.d.ts +32 -13
- package/dist/components/radio/Radio.d.ts +58 -15
- package/dist/components/scroll-container/ScrollContainer.d.ts +28 -14
- package/dist/components/scroll-container/useScrollEdges.d.ts +1 -24
- package/dist/components/segmented-control/SegmentedControl.d.ts +73 -15
- package/dist/components/select/Select.d.ts +104 -30
- package/dist/components/select/SelectItem.d.ts +35 -8
- package/dist/components/select/selectContext.d.ts +7 -19
- package/dist/components/sheet/Sheet.d.ts +32 -15
- package/dist/components/skeleton/Skeleton.d.ts +9 -3
- package/dist/components/slider/Slider.d.ts +55 -15
- package/dist/components/smart-filter/SmartFilter.d.ts +39 -12
- package/dist/components/sparkline/Sparkline.d.ts +42 -19
- package/dist/components/spinner/Spinner.d.ts +11 -5
- package/dist/components/stepper/Stepper.d.ts +41 -19
- package/dist/components/switch/Switch.d.ts +37 -12
- package/dist/components/tabs/Tabs.d.ts +61 -18
- package/dist/components/tag-select/TagSelect.d.ts +74 -20
- package/dist/components/textarea/Textarea.d.ts +52 -25
- package/dist/components/thumbnail/Thumbnail.d.ts +50 -20
- package/dist/components/timeline/Timeline.d.ts +85 -66
- package/dist/components/tooltip/Tooltip.d.ts +47 -17
- package/dist/components/typography/Typography.d.ts +32 -6
- package/dist/components/video-note/VideoNote.d.ts +7 -1
- package/dist/{internal → components/visually-hidden}/VisuallyHidden.d.ts +5 -5
- package/dist/components/voice-player/VoicePlayer.d.ts +16 -3
- package/dist/hooks/breakpoints.d.ts +10 -0
- package/dist/hooks/floatingPosition.d.ts +42 -0
- package/dist/hooks/useDraft.d.ts +12 -0
- package/dist/hooks/useEdgeOverflow.d.ts +5 -3
- package/dist/hooks/useElementSize.d.ts +31 -0
- package/dist/hooks/useEnterConfirm.d.ts +2 -1
- package/dist/hooks/useImageStatus.d.ts +12 -5
- package/dist/hooks/useLoadMore.d.ts +28 -0
- package/dist/hooks/useMediaQuery.d.ts +1 -3
- package/dist/hooks/useMergedRefs.d.ts +10 -4
- package/dist/hooks/useModalLayer.d.ts +13 -7
- package/dist/hooks/usePosition.d.ts +4 -42
- package/dist/hooks/usePresence.d.ts +4 -7
- package/dist/hooks/useScrollRegion.d.ts +28 -0
- package/dist/hooks/useStableValue.d.ts +6 -0
- package/dist/hooks/useSwipeDismiss.d.ts +38 -17
- package/dist/hooks/useVirtualRows.d.ts +9 -3
- package/dist/icon-set.js +2 -2
- package/dist/icons/Icon.d.ts +1 -1
- package/dist/icons/glyph.d.ts +9 -2
- package/dist/index.css +1 -1
- package/dist/index.js +13 -3
- package/dist/internal/AnchorRectContext.d.ts +2 -1
- package/dist/internal/ChartTooltip.d.ts +1 -1
- package/dist/internal/CheckMark.d.ts +2 -2
- package/dist/internal/ChoiceField.d.ts +29 -10
- package/dist/internal/ControlSizeContext.d.ts +16 -0
- package/dist/internal/Disclosure.d.ts +38 -9
- package/dist/internal/FieldAction.d.ts +20 -12
- package/dist/internal/FieldCommit.d.ts +8 -11
- package/dist/internal/FieldFrame.d.ts +100 -21
- package/dist/internal/MenuGroup.d.ts +3 -1
- package/dist/internal/MorphText.d.ts +2 -1
- package/dist/internal/ProgressLegend.d.ts +3 -2
- package/dist/internal/RegionSwap.d.ts +41 -0
- package/dist/internal/RollingNumber.d.ts +10 -1
- package/dist/internal/RowAction.d.ts +26 -0
- package/dist/internal/SwitcherScroller.d.ts +11 -0
- package/dist/internal/attachmentTile.d.ts +1 -1
- package/dist/internal/audio.d.ts +13 -0
- package/dist/{components/badge/tier.d.ts → internal/chipTier.d.ts} +7 -5
- package/dist/internal/context.d.ts +10 -1
- package/dist/internal/controlValue.d.ts +7 -0
- package/dist/internal/edgeAutoScroll.d.ts +43 -25
- package/dist/internal/fieldCell.d.ts +4 -3
- package/dist/internal/fieldClasses.d.ts +15 -2
- package/dist/internal/fileSize.d.ts +5 -1
- package/dist/internal/formatClock.d.ts +2 -0
- package/dist/internal/formatNumber.d.ts +6 -0
- package/dist/internal/glyphSwap.d.ts +5 -9
- package/dist/internal/hasContent.d.ts +6 -0
- package/dist/internal/highlightTsx.d.ts +12 -0
- package/dist/internal/iconBox.d.ts +6 -0
- package/dist/internal/iconLayout.d.ts +2 -1
- package/dist/internal/imageSlot.d.ts +6 -1
- package/dist/internal/interactiveElement.d.ts +41 -0
- package/dist/internal/labels.d.ts +6 -0
- package/dist/internal/leaveInPlace.d.ts +6 -5
- package/dist/internal/listPresence.d.ts +32 -0
- package/dist/internal/listbox.d.ts +71 -31
- package/dist/internal/longPress.d.ts +42 -0
- package/dist/internal/mediaDisk.d.ts +7 -4
- package/dist/internal/mediaPlayer.d.ts +91 -27
- package/dist/internal/mediaSession.d.ts +0 -6
- package/dist/internal/messageList.d.ts +4 -3
- package/dist/internal/motionTiming.d.ts +34 -0
- package/dist/internal/namedRole.d.ts +13 -0
- package/dist/internal/nodeText.d.ts +6 -0
- package/dist/{components/modal → internal/overlay}/DialogGuard.d.ts +3 -5
- package/dist/{components/modal → internal/overlay}/DialogParts.d.ts +86 -89
- package/dist/internal/overlay/FloatingPanel.d.ts +27 -5
- package/dist/internal/overlay/ModalDialog.d.ts +59 -0
- package/dist/internal/overlay/focus.d.ts +29 -5
- package/dist/internal/overlay/layerStack.d.ts +8 -5
- package/dist/internal/overlay/useAnchorName.d.ts +14 -0
- package/dist/internal/overlay/useContainScroll.d.ts +7 -0
- package/dist/internal/overlay/useFloatingLayer.d.ts +43 -14
- package/dist/internal/overlay/useOpenState.d.ts +22 -0
- package/dist/internal/partPresence.d.ts +31 -0
- package/dist/internal/parts.d.ts +39 -0
- package/dist/internal/progressSegments.d.ts +52 -12
- package/dist/internal/richText.d.ts +6 -34
- package/dist/internal/ring.d.ts +18 -8
- package/dist/internal/rovingFocus.d.ts +10 -5
- package/dist/{components/data-table/rowEvents.d.ts → internal/rowLink.d.ts} +0 -5
- package/dist/internal/scrollAncestors.d.ts +14 -0
- package/dist/internal/selectionIndicator.d.ts +27 -0
- package/dist/internal/slot.d.ts +53 -5
- package/dist/internal/states.d.ts +61 -0
- package/dist/internal/sticky.d.ts +5 -1
- package/dist/internal/swallowNextClick.d.ts +9 -0
- package/dist/internal/swatch.d.ts +59 -15
- package/dist/internal/textFormatting.d.ts +2 -1
- package/dist/internal/textFormattingToolbar.d.ts +3 -2
- package/dist/internal/tokenDefaults.d.ts +21 -0
- package/dist/internal/touchTarget.d.ts +5 -0
- package/dist/internal/transcript.d.ts +19 -18
- package/dist/internal/transfer.d.ts +22 -8
- package/dist/internal/transferDisk.d.ts +2 -3
- package/dist/internal/useFlipList.d.ts +44 -0
- package/dist/internal/useNearView.d.ts +4 -3
- package/dist/internal/usePendingChanges.d.ts +23 -0
- package/dist/internal/useRangeSelection.d.ts +2 -1
- package/dist/layout/app-header/AppHeader.d.ts +29 -20
- package/dist/layout/app-shell/AppShell.d.ts +72 -8
- package/dist/layout/bottom-nav/BottomNav.d.ts +58 -22
- package/dist/layout/index.d.ts +2 -2
- package/dist/layout/sidebar/Sidebar.d.ts +232 -101
- package/dist/skill/SKILL.md +10 -10
- package/dist/skill/anti-slop.md +105 -24
- package/dist/skill/api-contract.md +115 -35
- package/dist/skill/cheatsheet.md +37 -37
- package/dist/skill/checklist.md +57 -89
- package/dist/skill/choosing.md +23 -25
- package/dist/skill/components.md +50 -48
- package/dist/skill/composition.md +68 -58
- package/dist/skill/foundations.md +31 -24
- package/dist/skill/layouts.md +81 -83
- package/dist/skill/motion.md +26 -31
- package/dist/skill/reference/components/accordion/COMPONENT.md +16 -9
- package/dist/skill/reference/components/accordion/examples/overview.tsx +2 -2
- package/dist/skill/reference/components/accordion/examples/sizes.tsx +6 -8
- package/dist/skill/reference/components/accordion/examples/states.tsx +27 -24
- package/dist/skill/reference/components/accordion/examples/variants.tsx +6 -8
- package/dist/skill/reference/components/accordion/examples/with-icon.tsx +22 -19
- package/dist/skill/reference/components/avatar/COMPONENT.md +23 -16
- package/dist/skill/reference/components/avatar/examples/examples.module.css +1 -4
- package/dist/skill/reference/components/avatar/examples/overview.tsx +3 -3
- package/dist/skill/reference/components/avatar/examples/presence.tsx +4 -4
- package/dist/skill/reference/components/avatar/examples/src-from-state.tsx +3 -3
- package/dist/skill/reference/components/avatar/examples/states.tsx +4 -4
- package/dist/skill/reference/components/avatar/examples/team-group.tsx +2 -2
- package/dist/skill/reference/components/badge/COMPONENT.md +66 -34
- package/dist/skill/reference/components/badge/examples/controlled.tsx +32 -0
- package/dist/skill/reference/components/badge/examples/examples.module.css +2 -2
- package/dist/skill/reference/components/badge/examples/filter-values.tsx +4 -6
- package/dist/skill/reference/components/badge/examples/in-controls.tsx +1 -1
- package/dist/skill/reference/components/badge/examples/overview.tsx +6 -5
- package/dist/skill/reference/components/badge/examples/square.tsx +21 -0
- package/dist/skill/reference/components/badge/examples/states.tsx +4 -4
- package/dist/skill/reference/components/badge/examples/with-icon.tsx +10 -1
- package/dist/skill/reference/components/banner/COMPONENT.md +9 -5
- package/dist/skill/reference/components/banner/examples/dismissible.tsx +3 -19
- package/dist/skill/reference/components/banner/examples/overview.tsx +1 -1
- package/dist/skill/reference/components/breadcrumb/COMPONENT.md +17 -11
- package/dist/skill/reference/components/breadcrumb/examples/examples.module.css +1 -1
- package/dist/skill/reference/components/breadcrumb/examples/overflow.tsx +1 -1
- package/dist/skill/reference/components/breadcrumb/examples/sizes.tsx +6 -8
- package/dist/skill/reference/components/breadcrumb/examples/with-icon.tsx +15 -8
- package/dist/skill/reference/components/button/COMPONENT.md +66 -30
- package/dist/skill/reference/components/button/examples/align.tsx +25 -0
- package/dist/skill/reference/components/button/examples/controlled.tsx +21 -0
- package/dist/skill/reference/components/button/examples/density.tsx +45 -0
- package/dist/skill/reference/components/button/examples/examples.module.css +14 -25
- package/dist/skill/reference/components/button/examples/label-morph.tsx +1 -1
- package/dist/skill/reference/components/button/examples/on-colored-host.tsx +19 -19
- package/dist/skill/reference/components/button/examples/over-media.tsx +7 -1
- package/dist/skill/reference/components/button/examples/toggle.tsx +2 -10
- package/dist/skill/reference/components/button-group/COMPONENT.md +21 -15
- package/dist/skill/reference/components/button-group/examples/controlled.tsx +1 -1
- package/dist/skill/reference/components/card/COMPONENT.md +16 -5
- package/dist/skill/reference/components/card/examples/content-templates.tsx +8 -2
- package/dist/skill/reference/components/card/examples/examples.module.css +4 -16
- package/dist/skill/reference/components/card/examples/overview.tsx +11 -11
- package/dist/skill/reference/components/card/examples/screen.tsx +9 -8
- package/dist/skill/reference/components/card/examples/variants.tsx +74 -47
- package/dist/skill/reference/components/chart-frame/COMPONENT.md +24 -28
- package/dist/skill/reference/components/chart-frame/examples/controlled.tsx +9 -7
- package/dist/skill/reference/components/chart-frame/examples/fill-height.tsx +4 -6
- package/dist/skill/reference/components/chart-frame/examples/narrow.tsx +24 -5
- package/dist/skill/reference/components/chart-frame/examples/overview.tsx +5 -2
- package/dist/skill/reference/components/chart-frame/examples/states.tsx +72 -64
- package/dist/skill/reference/components/chart-frame/examples/tooltip.tsx +27 -26
- package/dist/skill/reference/components/chat/COMPONENT.md +35 -22
- package/dist/skill/reference/components/chat/examples/group-chat.tsx +2 -2
- package/dist/skill/reference/components/chat/examples/overview.tsx +119 -130
- package/dist/skill/reference/components/chat/examples/reactions.tsx +18 -23
- package/dist/skill/reference/components/chat/examples/screen.tsx +108 -131
- package/dist/skill/reference/components/chat/examples/states.tsx +23 -22
- package/dist/skill/reference/components/chat-list/COMPONENT.md +10 -5
- package/dist/skill/reference/components/chat-list/examples/examples.module.css +0 -8
- package/dist/skill/reference/components/chat-list/examples/live.tsx +29 -22
- package/dist/skill/reference/components/chat-list/examples/sizes.tsx +6 -8
- package/dist/skill/reference/components/chat-list/examples/states.tsx +42 -38
- package/dist/skill/reference/components/checkbox/COMPONENT.md +27 -14
- package/dist/skill/reference/components/checkbox/examples/controlled.tsx +18 -16
- package/dist/skill/reference/components/checkbox/examples/examples.module.css +14 -56
- package/dist/skill/reference/components/checkbox/examples/in-form.tsx +16 -16
- package/dist/skill/reference/components/checkbox/examples/indicator.tsx +19 -64
- package/dist/skill/reference/components/checkbox/examples/overview.tsx +1 -1
- package/dist/skill/reference/components/checkbox/examples/states.tsx +1 -1
- package/dist/skill/reference/components/checkbox/examples/without-label.tsx +1 -1
- package/dist/skill/reference/components/code-block/COMPONENT.md +16 -12
- package/dist/skill/reference/components/code-block/examples/examples.module.css +5 -2
- package/dist/skill/reference/components/code-block/examples/narrow.tsx +1 -1
- package/dist/skill/reference/components/color-field/COMPONENT.md +15 -9
- package/dist/skill/reference/components/color-field/examples/examples.module.css +4 -5
- package/dist/skill/reference/components/color-field/examples/in-form.tsx +15 -13
- package/dist/skill/reference/components/color-field/examples/sizes.tsx +5 -1
- package/dist/skill/reference/components/color-field/examples/states.tsx +15 -3
- package/dist/skill/reference/components/color-picker/COMPONENT.md +55 -19
- package/dist/skill/reference/components/color-picker/examples/controlled.tsx +16 -5
- package/dist/skill/reference/components/color-picker/examples/examples.module.css +6 -7
- package/dist/skill/reference/components/color-picker/examples/in-form.tsx +24 -22
- package/dist/skill/reference/components/color-picker/examples/overview.tsx +1 -1
- package/dist/skill/reference/components/color-picker/examples/panel.tsx +1 -1
- package/dist/skill/reference/components/color-picker/examples/sizes.tsx +9 -11
- package/dist/skill/reference/components/color-picker/examples/states.tsx +28 -23
- package/dist/skill/reference/components/color-swatches/COMPONENT.md +22 -8
- package/dist/skill/reference/components/color-swatches/examples/examples.module.css +3 -4
- package/dist/skill/reference/components/color-swatches/examples/in-form.tsx +19 -17
- package/dist/skill/reference/components/color-swatches/examples/palette.tsx +24 -0
- package/dist/skill/reference/components/color-swatches/examples/wrapping.tsx +17 -2
- package/dist/skill/reference/components/command-menu/COMPONENT.md +60 -20
- package/dist/skill/reference/components/command-menu/examples/sizes.tsx +20 -15
- package/dist/skill/reference/components/command-menu/examples/states.tsx +46 -24
- package/dist/skill/reference/components/composer/COMPONENT.md +42 -24
- package/dist/skill/reference/components/composer/examples/examples.module.css +0 -9
- package/dist/skill/reference/components/composer/examples/narrow.tsx +1 -1
- package/dist/skill/reference/components/composer/examples/reply-edit.tsx +3 -3
- package/dist/skill/reference/components/composer/examples/sizes.tsx +3 -5
- package/dist/skill/reference/components/composer/examples/states.tsx +4 -6
- package/dist/skill/reference/components/confirm-dialog/COMPONENT.md +26 -13
- package/dist/skill/reference/components/confirm-dialog/examples/dismiss.tsx +27 -0
- package/dist/skill/reference/components/confirm-dialog/examples/failure.tsx +9 -16
- package/dist/skill/reference/components/crossfade/COMPONENT.md +11 -5
- package/dist/skill/reference/components/crossfade/examples/examples.module.css +1 -40
- package/dist/skill/reference/components/crossfade/examples/fill.tsx +16 -19
- package/dist/skill/reference/components/crossfade/examples/overview.tsx +14 -16
- package/dist/skill/reference/components/crossfade/examples/record-switch.tsx +6 -11
- package/dist/skill/reference/components/crossfade/examples/screen.module.css +1 -24
- package/dist/skill/reference/components/crossfade/examples/screen.tsx +14 -25
- package/dist/skill/reference/components/data-table/COMPONENT.md +31 -21
- package/dist/skill/reference/components/data-table/examples/controlled.tsx +14 -2
- package/dist/skill/reference/components/data-table/examples/examples.module.css +1 -9
- package/dist/skill/reference/components/data-table/examples/narrow.tsx +5 -1
- package/dist/skill/reference/components/data-table/examples/row-link.tsx +2 -1
- package/dist/skill/reference/components/data-table/examples/screen.module.css +2 -2
- package/dist/skill/reference/components/data-table/examples/screen.tsx +11 -10
- package/dist/skill/reference/components/data-table/examples/sizes.tsx +17 -17
- package/dist/skill/reference/components/data-table/examples/states.tsx +37 -29
- package/dist/skill/reference/components/datepicker/COMPONENT.md +53 -22
- package/dist/skill/reference/components/datepicker/examples/dismiss.tsx +15 -0
- package/dist/skill/reference/components/datepicker/examples/examples.module.css +3 -2
- package/dist/skill/reference/components/datepicker/examples/in-form.tsx +33 -25
- package/dist/skill/reference/components/datepicker/examples/sizes.tsx +2 -2
- package/dist/skill/reference/components/datepicker/examples/states.tsx +2 -2
- package/dist/skill/reference/components/datepicker/examples/validation.tsx +3 -3
- package/dist/skill/reference/components/description-list/COMPONENT.md +24 -9
- package/dist/skill/reference/components/description-list/examples/examples.module.css +4 -24
- package/dist/skill/reference/components/description-list/examples/narrow.tsx +1 -1
- package/dist/skill/reference/components/description-list/examples/screen.module.css +0 -18
- package/dist/skill/reference/components/description-list/examples/screen.tsx +19 -27
- package/dist/skill/reference/components/description-list/examples/sizes.tsx +2 -4
- package/dist/skill/reference/components/description-list/examples/structure.tsx +6 -7
- package/dist/skill/reference/components/description-list/examples/totals.tsx +40 -0
- package/dist/skill/reference/components/digit-input/COMPONENT.md +12 -6
- package/dist/skill/reference/components/digit-input/examples/examples.module.css +2 -2
- package/dist/skill/reference/components/digit-input/examples/in-form.tsx +1 -1
- package/dist/skill/reference/components/digit-input/examples/sizes.tsx +5 -3
- package/dist/skill/reference/components/digit-input/examples/states.tsx +14 -6
- package/dist/skill/reference/components/divider/COMPONENT.md +26 -12
- package/dist/skill/reference/components/divider/examples/align.tsx +2 -4
- package/dist/skill/reference/components/divider/examples/examples.module.css +13 -17
- package/dist/skill/reference/components/divider/examples/or-separator.tsx +3 -5
- package/dist/skill/reference/components/divider/examples/overview.tsx +18 -16
- package/dist/skill/reference/components/divider/examples/vertical.tsx +5 -1
- package/dist/skill/reference/components/divider/examples/with-icon.tsx +1 -1
- package/dist/skill/reference/components/dnd/COMPONENT.md +52 -34
- package/dist/skill/reference/components/dnd/examples/drop-zones.tsx +1 -1
- package/dist/skill/reference/components/dnd/examples/examples.module.css +4 -6
- package/dist/skill/reference/components/dnd/examples/states.tsx +41 -35
- package/dist/skill/reference/components/drawer/COMPONENT.md +37 -14
- package/dist/skill/reference/components/drawer/examples/guard.tsx +1 -3
- package/dist/skill/reference/components/drawer/examples/header-actions.tsx +1 -1
- package/dist/skill/reference/components/drawer/examples/in-form.tsx +31 -31
- package/dist/skill/reference/components/drawer/examples/placement.tsx +31 -26
- package/dist/skill/reference/components/drawer/examples/sizes.tsx +32 -27
- package/dist/skill/reference/components/dropdown/COMPONENT.md +58 -23
- package/dist/skill/reference/components/dropdown/examples/context-menu.tsx +75 -0
- package/dist/skill/reference/components/dropdown/examples/examples.module.css +1 -1
- package/dist/skill/reference/components/dropdown/examples/sizes.tsx +39 -34
- package/dist/skill/reference/components/dropdown/examples/states.tsx +37 -29
- package/dist/skill/reference/components/empty-page/COMPONENT.md +20 -9
- package/dist/skill/reference/components/empty-page/examples/compact.tsx +28 -18
- package/dist/skill/reference/components/empty-page/examples/examples.module.css +0 -43
- package/dist/skill/reference/components/empty-page/examples/narrow.tsx +3 -3
- package/dist/skill/reference/components/empty-page/examples/region-error.tsx +6 -11
- package/dist/skill/reference/components/empty-page/examples/sizes.tsx +13 -13
- package/dist/skill/reference/components/empty-page/examples/variants.tsx +34 -30
- package/dist/skill/reference/components/example-frame/COMPONENT.md +21 -9
- package/dist/skill/reference/components/example-frame/examples/controlled.tsx +3 -3
- package/dist/skill/reference/components/field-list/COMPONENT.md +14 -8
- package/dist/skill/reference/components/field-list/examples/sizes.tsx +32 -26
- package/dist/skill/reference/components/field-list/examples/states.tsx +37 -31
- package/dist/skill/reference/components/fieldset/COMPONENT.md +10 -5
- package/dist/skill/reference/components/fieldset/examples/examples.module.css +1 -1
- package/dist/skill/reference/components/file-upload/COMPONENT.md +67 -29
- package/dist/skill/reference/components/file-upload/examples/avatar-upload.tsx +5 -5
- package/dist/skill/reference/components/file-upload/examples/custom-body.tsx +12 -7
- package/dist/skill/reference/components/file-upload/examples/examples.module.css +4 -4
- package/dist/skill/reference/components/file-upload/examples/narrow.tsx +1 -1
- package/dist/skill/reference/components/file-upload/examples/row-parts.tsx +4 -4
- package/dist/skill/reference/components/file-upload/examples/screen.module.css +2 -2
- package/dist/skill/reference/components/file-upload/examples/screen.tsx +6 -4
- package/dist/skill/reference/components/file-upload/examples/sizes.tsx +1 -3
- package/dist/skill/reference/components/file-upload/examples/states.tsx +1 -3
- package/dist/skill/reference/components/file-upload/examples/variants.tsx +13 -7
- package/dist/skill/reference/components/gallery/COMPONENT.md +16 -7
- package/dist/skill/reference/components/gallery/examples/album-sizes.tsx +52 -0
- package/dist/skill/reference/components/gallery/examples/controlled.tsx +40 -0
- package/dist/skill/reference/components/gallery/examples/examples.module.css +1 -1
- package/dist/skill/reference/components/gallery/examples/overview.tsx +15 -43
- package/dist/skill/reference/components/gallery/examples/transfer.tsx +22 -13
- package/dist/skill/reference/components/gantt/COMPONENT.md +21 -15
- package/dist/skill/reference/components/gantt/examples/examples.module.css +0 -16
- package/dist/skill/reference/components/gantt/examples/occupancy.tsx +2 -2
- package/dist/skill/reference/components/gantt/examples/screen.tsx +2 -2
- package/dist/skill/reference/components/gantt/examples/sizes.tsx +16 -16
- package/dist/skill/reference/components/gantt/examples/states.tsx +34 -30
- package/dist/skill/reference/components/gantt/examples/variants.tsx +27 -25
- package/dist/skill/reference/components/hint/COMPONENT.md +24 -14
- package/dist/skill/reference/components/hint/examples/examples.module.css +1 -1
- package/dist/skill/reference/components/hint/examples/hint-or-error.tsx +2 -2
- package/dist/skill/reference/components/hint/examples/overview.tsx +9 -10
- package/dist/skill/reference/components/hint/examples/sizes.tsx +1 -1
- package/dist/skill/reference/components/input/COMPONENT.md +10 -6
- package/dist/skill/reference/components/input/examples/affixes.tsx +2 -2
- package/dist/skill/reference/components/input/examples/examples.module.css +1 -1
- package/dist/skill/reference/components/input/examples/sizes.tsx +9 -5
- package/dist/skill/reference/components/input/examples/states.tsx +39 -23
- package/dist/skill/reference/components/input/examples/with-icon.tsx +24 -16
- package/dist/skill/reference/components/kanban/COMPONENT.md +30 -24
- package/dist/skill/reference/components/kanban/examples/columns.tsx +14 -19
- package/dist/skill/reference/components/kanban/examples/item-link.tsx +2 -2
- package/dist/skill/reference/components/kanban/examples/limits.tsx +1 -1
- package/dist/skill/reference/components/kanban/examples/narrow.tsx +1 -1
- package/dist/skill/reference/components/kanban/examples/screen.module.css +1 -3
- package/dist/skill/reference/components/kanban/examples/screen.tsx +6 -4
- package/dist/skill/reference/components/kanban/examples/states.tsx +37 -58
- package/dist/skill/reference/components/kanban/examples/variants.tsx +0 -3
- package/dist/skill/reference/components/kbd/COMPONENT.md +10 -6
- package/dist/skill/reference/components/kbd/examples/examples.module.css +1 -20
- package/dist/skill/reference/components/kbd/examples/in-controls.tsx +2 -2
- package/dist/skill/reference/components/kbd/examples/shortcut-list.tsx +14 -26
- package/dist/skill/reference/components/label/COMPONENT.md +26 -11
- package/dist/skill/reference/components/label/examples/examples.module.css +3 -11
- package/dist/skill/reference/components/label/examples/overview.tsx +5 -9
- package/dist/skill/reference/components/label/examples/structure.tsx +2 -2
- package/dist/skill/reference/components/link-button/COMPONENT.md +33 -20
- package/dist/skill/reference/components/link-button/examples/as-child.tsx +1 -1
- package/dist/skill/reference/components/link-button/examples/external-link.tsx +1 -1
- package/dist/skill/reference/components/link-button/examples/overview.tsx +4 -2
- package/dist/skill/reference/components/link-button/examples/variants.tsx +2 -2
- package/dist/skill/reference/components/list/COMPONENT.md +24 -16
- package/dist/skill/reference/components/list/examples/examples.module.css +0 -8
- package/dist/skill/reference/components/list/examples/overflow.tsx +1 -1
- package/dist/skill/reference/components/list/examples/overview.tsx +31 -30
- package/dist/skill/reference/components/list/examples/sizes.tsx +23 -23
- package/dist/skill/reference/components/list/examples/states.tsx +38 -21
- package/dist/skill/reference/components/list/examples/with-icon.tsx +16 -14
- package/dist/skill/reference/components/login-form/COMPONENT.md +69 -16
- package/dist/skill/reference/components/login-form/examples/narrow.tsx +1 -1
- package/dist/skill/reference/components/login-form/examples/register.tsx +1 -1
- package/dist/skill/reference/components/media-viewer/COMPONENT.md +12 -8
- package/dist/skill/reference/components/media-viewer/examples/examples.module.css +2 -2
- package/dist/skill/reference/components/media-viewer/examples/video.tsx +1 -1
- package/dist/skill/reference/components/message/COMPONENT.md +102 -46
- package/dist/skill/reference/components/message/examples/typing.tsx +5 -5
- package/dist/skill/reference/components/modal/COMPONENT.md +71 -37
- package/dist/skill/reference/components/modal/examples/dismiss.tsx +35 -27
- package/dist/skill/reference/components/modal/examples/enter-key.tsx +22 -25
- package/dist/skill/reference/components/modal/examples/examples.module.css +0 -7
- package/dist/skill/reference/components/modal/examples/guard.tsx +2 -4
- package/dist/skill/reference/components/modal/examples/in-form.tsx +28 -28
- package/dist/skill/reference/components/modal/examples/long-content.tsx +6 -4
- package/dist/skill/reference/components/modal/examples/sizes.tsx +36 -31
- package/dist/skill/reference/components/modal/examples/structure.tsx +1 -1
- package/dist/skill/reference/components/native-select/COMPONENT.md +7 -3
- package/dist/skill/reference/components/native-select/examples/examples.module.css +3 -3
- package/dist/skill/reference/components/native-select/examples/in-form.tsx +28 -29
- package/dist/skill/reference/components/native-select/examples/sizes.tsx +2 -2
- package/dist/skill/reference/components/native-select/examples/states.tsx +2 -2
- package/dist/skill/reference/components/notification/COMPONENT.md +36 -31
- package/dist/skill/reference/components/notification/examples/examples.module.css +1 -2
- package/dist/skill/reference/components/notification/examples/in-form.tsx +28 -20
- package/dist/skill/reference/components/notification/examples/sizes.tsx +16 -12
- package/dist/skill/reference/components/notification/examples/undo.tsx +7 -15
- package/dist/skill/reference/components/page-content/COMPONENT.md +21 -29
- package/dist/skill/reference/components/page-content/examples/examples.module.css +3 -16
- package/dist/skill/reference/components/page-content/examples/grid.tsx +3 -1
- package/dist/skill/reference/components/page-content/examples/list-detail.tsx +55 -49
- package/dist/skill/reference/components/page-content/examples/narrow.tsx +1 -1
- package/dist/skill/reference/components/page-content/examples/overview.tsx +2 -2
- package/dist/skill/reference/components/page-content/examples/variants.tsx +7 -7
- package/dist/skill/reference/components/page-toolbar/COMPONENT.md +10 -6
- package/dist/skill/reference/components/page-toolbar/examples/overview.tsx +1 -1
- package/dist/skill/reference/components/page-toolbar/examples/save-changes.tsx +25 -22
- package/dist/skill/reference/components/pagination/COMPONENT.md +20 -17
- package/dist/skill/reference/components/pagination/examples/narrow.tsx +5 -5
- package/dist/skill/reference/components/popover/COMPONENT.md +43 -20
- package/dist/skill/reference/components/popover/examples/controlled-open.tsx +6 -4
- package/dist/skill/reference/components/popover/examples/dismiss.tsx +37 -28
- package/dist/skill/reference/components/popover/examples/examples.module.css +2 -2
- package/dist/skill/reference/components/popover/examples/sizes.tsx +32 -27
- package/dist/skill/reference/components/popover/examples/width.tsx +45 -0
- package/dist/skill/reference/components/progress-bar/COMPONENT.md +21 -29
- package/dist/skill/reference/components/progress-bar/examples/examples.module.css +1 -1
- package/dist/skill/reference/components/progress-circle/COMPONENT.md +21 -29
- package/dist/skill/reference/components/progress-circle/examples/examples.module.css +1 -1
- package/dist/skill/reference/components/progress-circle/examples/on-color.tsx +16 -0
- package/dist/skill/reference/components/progress-circle/examples/variants.tsx +1 -0
- package/dist/skill/reference/components/radio/COMPONENT.md +13 -4
- package/dist/skill/reference/components/radio/examples/examples.module.css +1 -1
- package/dist/skill/reference/components/scroll-container/COMPONENT.md +18 -12
- package/dist/skill/reference/components/scroll-container/examples/auto-scroll.tsx +8 -4
- package/dist/skill/reference/components/scroll-container/examples/edges.tsx +4 -4
- package/dist/skill/reference/components/scroll-container/examples/examples.module.css +7 -51
- package/dist/skill/reference/components/scroll-container/examples/load-more.tsx +4 -4
- package/dist/skill/reference/components/scroll-container/examples/lock.tsx +4 -4
- package/dist/skill/reference/components/scroll-container/examples/log.tsx +97 -0
- package/dist/skill/reference/components/scroll-container/examples/overscroll.tsx +4 -4
- package/dist/skill/reference/components/scroll-container/examples/overview.tsx +5 -5
- package/dist/skill/reference/components/scroll-container/examples/scrollbar.tsx +4 -4
- package/dist/skill/reference/components/scroll-container/examples/snap.tsx +2 -2
- package/dist/skill/reference/components/scroll-container/examples/variants.tsx +1 -0
- package/dist/skill/reference/components/segmented-control/COMPONENT.md +24 -12
- package/dist/skill/reference/components/segmented-control/examples/controlled.tsx +2 -4
- package/dist/skill/reference/components/segmented-control/examples/examples.module.css +0 -8
- package/dist/skill/reference/components/segmented-control/examples/scroll.tsx +1 -1
- package/dist/skill/reference/components/select/COMPONENT.md +33 -9
- package/dist/skill/reference/components/select/examples/dismiss.tsx +26 -0
- package/dist/skill/reference/components/select/examples/examples.module.css +1 -1
- package/dist/skill/reference/components/select/examples/server-search.tsx +6 -2
- package/dist/skill/reference/components/select/examples/sizes.tsx +2 -2
- package/dist/skill/reference/components/select/examples/states.tsx +2 -2
- package/dist/skill/reference/components/select/examples/with-icon.tsx +20 -18
- package/dist/skill/reference/components/sheet/COMPONENT.md +44 -21
- package/dist/skill/reference/components/sheet/examples/header-actions.tsx +23 -4
- package/dist/skill/reference/components/sheet/examples/overview.tsx +25 -10
- package/dist/skill/reference/components/skeleton/COMPONENT.md +8 -4
- package/dist/skill/reference/components/skeleton/examples/examples.module.css +1 -13
- package/dist/skill/reference/components/skeleton/examples/with-crossfade.tsx +7 -7
- package/dist/skill/reference/components/slider/COMPONENT.md +10 -5
- package/dist/skill/reference/components/slider/examples/examples.module.css +6 -7
- package/dist/skill/reference/components/slider/examples/hint-and-error.tsx +3 -5
- package/dist/skill/reference/components/slider/examples/in-form.tsx +21 -19
- package/dist/skill/reference/components/smart-filter/COMPONENT.md +32 -12
- package/dist/skill/reference/components/smart-filter/examples/examples.module.css +0 -21
- package/dist/skill/reference/components/smart-filter/examples/ranges.tsx +2 -1
- package/dist/skill/reference/components/smart-filter/examples/sizes.tsx +2 -4
- package/dist/skill/reference/components/sparkline/COMPONENT.md +7 -3
- package/dist/skill/reference/components/sparkline/examples/examples.module.css +1 -1
- package/dist/skill/reference/components/sparkline/examples/signed-bars.tsx +2 -2
- package/dist/skill/reference/components/spinner/COMPONENT.md +15 -9
- package/dist/skill/reference/components/spinner/examples/examples.module.css +2 -14
- package/dist/skill/reference/components/spinner/examples/overview.tsx +1 -1
- package/dist/skill/reference/components/stepper/COMPONENT.md +50 -41
- package/dist/skill/reference/components/stepper/examples/examples.module.css +1 -6
- package/dist/skill/reference/components/stepper/examples/narrow.tsx +1 -1
- package/dist/skill/reference/components/stepper/examples/sizes.tsx +6 -8
- package/dist/skill/reference/components/stepper/examples/states.tsx +44 -43
- package/dist/skill/reference/components/stepper/examples/with-icon.tsx +19 -17
- package/dist/skill/reference/components/switch/COMPONENT.md +21 -8
- package/dist/skill/reference/components/switch/examples/examples.module.css +2 -2
- package/dist/skill/reference/components/switch/examples/states.tsx +3 -3
- package/dist/skill/reference/components/tabs/COMPONENT.md +21 -16
- package/dist/skill/reference/components/tabs/examples/in-drawer.tsx +1 -1
- package/dist/skill/reference/components/tabs/examples/sizes.tsx +5 -10
- package/dist/skill/reference/components/tabs/examples/variants.tsx +19 -23
- package/dist/skill/reference/components/tag-select/COMPONENT.md +19 -6
- package/dist/skill/reference/components/tag-select/examples/creatable.tsx +2 -2
- package/dist/skill/reference/components/tag-select/examples/dismiss.tsx +23 -0
- package/dist/skill/reference/components/tag-select/examples/examples.module.css +3 -3
- package/dist/skill/reference/components/tag-select/examples/in-form.tsx +31 -32
- package/dist/skill/reference/components/tag-select/examples/sizes.tsx +2 -2
- package/dist/skill/reference/components/tag-select/examples/states.tsx +2 -2
- package/dist/skill/reference/components/textarea/COMPONENT.md +10 -6
- package/dist/skill/reference/components/textarea/examples/examples.module.css +3 -10
- package/dist/skill/reference/components/textarea/examples/in-form.tsx +3 -3
- package/dist/skill/reference/components/textarea/examples/sizes.tsx +10 -7
- package/dist/skill/reference/components/textarea/examples/states.tsx +29 -13
- package/dist/skill/reference/components/textarea/examples/validation.tsx +45 -36
- package/dist/skill/reference/components/thumbnail/COMPONENT.md +17 -13
- package/dist/skill/reference/components/thumbnail/examples/examples.module.css +1 -1
- package/dist/skill/reference/components/thumbnail/examples/states.tsx +1 -1
- package/dist/skill/reference/components/thumbnail/examples/variants.tsx +12 -1
- package/dist/skill/reference/components/timeline/COMPONENT.md +51 -35
- package/dist/skill/reference/components/timeline/examples/links.tsx +14 -14
- package/dist/skill/reference/components/timeline/examples/narrow.tsx +6 -6
- package/dist/skill/reference/components/timeline/examples/overview.tsx +6 -6
- package/dist/skill/reference/components/timeline/examples/sizes.tsx +28 -23
- package/dist/skill/reference/components/timeline/examples/structure.tsx +30 -30
- package/dist/skill/reference/components/timeline/examples/variants.tsx +40 -28
- package/dist/skill/reference/components/tooltip/COMPONENT.md +10 -6
- package/dist/skill/reference/components/tooltip/examples/examples.module.css +1 -5
- package/dist/skill/reference/components/tooltip/examples/non-interactive-trigger.tsx +1 -1
- package/dist/skill/reference/components/tooltip/examples/sizes.tsx +17 -10
- package/dist/skill/reference/components/typography/COMPONENT.md +17 -2
- package/dist/skill/reference/components/typography/examples/examples.module.css +3 -6
- package/dist/skill/reference/components/typography/examples/numeric.tsx +16 -0
- package/dist/skill/reference/components/video-note/COMPONENT.md +11 -7
- package/dist/skill/reference/components/visually-hidden/COMPONENT.md +8 -4
- package/dist/skill/reference/components/visually-hidden/examples/assertive.tsx +1 -1
- package/dist/skill/reference/components/visually-hidden/examples/overview.tsx +17 -7
- package/dist/skill/reference/components/voice-player/COMPONENT.md +15 -7
- package/dist/skill/reference/foundation.md +564 -0
- package/dist/skill/reference/layout/app-header/COMPONENT.md +27 -26
- package/dist/skill/reference/layout/app-header/examples/examples.module.css +4 -23
- package/dist/skill/reference/layout/app-header/examples/in-app-shell.tsx +3 -5
- package/dist/skill/reference/layout/app-header/examples/narrow.tsx +58 -20
- package/dist/skill/reference/layout/app-shell/COMPONENT.md +40 -10
- package/dist/skill/reference/layout/app-shell/examples/examples.module.css +2 -22
- package/dist/skill/reference/layout/app-shell/examples/footer.tsx +2 -2
- package/dist/skill/reference/layout/app-shell/examples/overview.tsx +3 -5
- package/dist/skill/reference/layout/app-shell/examples/screen.tsx +27 -21
- package/dist/skill/reference/layout/app-shell/examples/template.tsx +3 -3
- package/dist/skill/reference/layout/bottom-nav/COMPONENT.md +27 -17
- package/dist/skill/reference/layout/bottom-nav/examples/examples.module.css +2 -7
- package/dist/skill/reference/layout/bottom-nav/examples/floating-action.tsx +2 -2
- package/dist/skill/reference/layout/bottom-nav/examples/floating.tsx +2 -2
- package/dist/skill/reference/layout/bottom-nav/examples/in-app-shell.tsx +2 -2
- package/dist/skill/reference/layout/bottom-nav/examples/router.tsx +6 -5
- package/dist/skill/reference/layout/sidebar/COMPONENT.md +50 -40
- package/dist/skill/reference/layout/sidebar/examples/account.tsx +1 -3
- package/dist/skill/reference/layout/sidebar/examples/brand-header.tsx +1 -3
- package/dist/skill/reference/layout/sidebar/examples/collapsible-groups.tsx +1 -3
- package/dist/skill/reference/layout/sidebar/examples/controlled-open.tsx +1 -3
- package/dist/skill/reference/layout/sidebar/examples/controlled.tsx +1 -3
- package/dist/skill/reference/layout/sidebar/examples/custom-part.tsx +1 -3
- package/dist/skill/reference/layout/sidebar/examples/dismiss.tsx +47 -0
- package/dist/skill/reference/layout/sidebar/examples/examples.module.css +7 -32
- package/dist/skill/reference/layout/sidebar/examples/narrow.tsx +44 -42
- package/dist/skill/reference/layout/sidebar/examples/nested-items.tsx +1 -3
- package/dist/skill/reference/layout/sidebar/examples/overview.tsx +1 -3
- package/dist/skill/reference/layout/sidebar/examples/persist.tsx +1 -3
- package/dist/skill/reference/layout/sidebar/examples/router.tsx +12 -13
- package/dist/skill/reference/layout/sidebar/examples/sizes.tsx +6 -6
- package/dist/skill/responsive.md +48 -51
- package/dist/skill/ux.md +21 -9
- package/dist/theme/applyTheme.d.ts +7 -6
- package/dist/tokens/hues.d.ts +8 -0
- package/dist/tokens/layers.d.ts +3 -16
- package/dist/tokens/offGrid.d.ts +7 -0
- package/dist/tokens/primitives.d.ts +22 -7
- package/dist/tokens/semantic.d.ts +201 -51
- package/dist/tokens/themes/dark.d.ts +32 -31
- package/package.json +5 -3
- package/src/components/accordion/COMPONENT.md +16 -9
- package/src/components/accordion/examples/overview.tsx +2 -2
- package/src/components/accordion/examples/sizes.tsx +6 -8
- package/src/components/accordion/examples/states.tsx +27 -24
- package/src/components/accordion/examples/variants.tsx +6 -8
- package/src/components/accordion/examples/with-icon.tsx +22 -19
- package/src/components/avatar/COMPONENT.md +23 -16
- package/src/components/avatar/examples/examples.module.css +1 -4
- package/src/components/avatar/examples/overview.tsx +3 -3
- package/src/components/avatar/examples/presence.tsx +4 -4
- package/src/components/avatar/examples/src-from-state.tsx +3 -3
- package/src/components/avatar/examples/states.tsx +4 -4
- package/src/components/avatar/examples/team-group.tsx +2 -2
- package/src/components/badge/COMPONENT.md +66 -34
- package/src/components/badge/examples/controlled.tsx +32 -0
- package/src/components/badge/examples/examples.module.css +2 -2
- package/src/components/badge/examples/filter-values.tsx +4 -6
- package/src/components/badge/examples/in-controls.tsx +1 -1
- package/src/components/badge/examples/overview.tsx +6 -5
- package/src/components/badge/examples/square.tsx +21 -0
- package/src/components/badge/examples/states.tsx +4 -4
- package/src/components/badge/examples/with-icon.tsx +10 -1
- package/src/components/banner/COMPONENT.md +9 -5
- package/src/components/banner/examples/dismissible.tsx +3 -19
- package/src/components/banner/examples/overview.tsx +1 -1
- package/src/components/breadcrumb/COMPONENT.md +17 -11
- package/src/components/breadcrumb/examples/examples.module.css +1 -1
- package/src/components/breadcrumb/examples/overflow.tsx +1 -1
- package/src/components/breadcrumb/examples/sizes.tsx +6 -8
- package/src/components/breadcrumb/examples/with-icon.tsx +15 -8
- package/src/components/button/COMPONENT.md +66 -30
- package/src/components/button/examples/align.tsx +25 -0
- package/src/components/button/examples/controlled.tsx +21 -0
- package/src/components/button/examples/density.tsx +45 -0
- package/src/components/button/examples/examples.module.css +14 -25
- package/src/components/button/examples/label-morph.tsx +1 -1
- package/src/components/button/examples/on-colored-host.tsx +19 -19
- package/src/components/button/examples/over-media.tsx +7 -1
- package/src/components/button/examples/toggle.tsx +2 -10
- package/src/components/button-group/COMPONENT.md +21 -15
- package/src/components/button-group/examples/controlled.tsx +1 -1
- package/src/components/card/COMPONENT.md +16 -5
- package/src/components/card/examples/content-templates.tsx +8 -2
- package/src/components/card/examples/examples.module.css +4 -16
- package/src/components/card/examples/overview.tsx +11 -11
- package/src/components/card/examples/screen.tsx +9 -8
- package/src/components/card/examples/variants.tsx +74 -47
- package/src/components/chart-frame/COMPONENT.md +24 -28
- package/src/components/chart-frame/examples/controlled.tsx +9 -7
- package/src/components/chart-frame/examples/fill-height.tsx +4 -6
- package/src/components/chart-frame/examples/narrow.tsx +24 -5
- package/src/components/chart-frame/examples/overview.tsx +5 -2
- package/src/components/chart-frame/examples/states.tsx +72 -64
- package/src/components/chart-frame/examples/tooltip.tsx +27 -26
- package/src/components/chat/COMPONENT.md +35 -22
- package/src/components/chat/examples/group-chat.tsx +2 -2
- package/src/components/chat/examples/overview.tsx +119 -130
- package/src/components/chat/examples/reactions.tsx +18 -23
- package/src/components/chat/examples/screen.tsx +108 -131
- package/src/components/chat/examples/states.tsx +23 -22
- package/src/components/chat-list/COMPONENT.md +10 -5
- package/src/components/chat-list/examples/examples.module.css +0 -8
- package/src/components/chat-list/examples/live.tsx +29 -22
- package/src/components/chat-list/examples/sizes.tsx +6 -8
- package/src/components/chat-list/examples/states.tsx +42 -38
- package/src/components/checkbox/COMPONENT.md +27 -14
- package/src/components/checkbox/examples/controlled.tsx +18 -16
- package/src/components/checkbox/examples/examples.module.css +14 -56
- package/src/components/checkbox/examples/in-form.tsx +16 -16
- package/src/components/checkbox/examples/indicator.tsx +19 -64
- package/src/components/checkbox/examples/overview.tsx +1 -1
- package/src/components/checkbox/examples/states.tsx +1 -1
- package/src/components/checkbox/examples/without-label.tsx +1 -1
- package/src/components/code-block/COMPONENT.md +16 -12
- package/src/components/code-block/examples/examples.module.css +5 -2
- package/src/components/code-block/examples/narrow.tsx +1 -1
- package/src/components/color-field/COMPONENT.md +15 -9
- package/src/components/color-field/examples/examples.module.css +4 -5
- package/src/components/color-field/examples/in-form.tsx +15 -13
- package/src/components/color-field/examples/sizes.tsx +5 -1
- package/src/components/color-field/examples/states.tsx +15 -3
- package/src/components/color-picker/COMPONENT.md +55 -19
- package/src/components/color-picker/examples/controlled.tsx +16 -5
- package/src/components/color-picker/examples/examples.module.css +6 -7
- package/src/components/color-picker/examples/in-form.tsx +24 -22
- package/src/components/color-picker/examples/overview.tsx +1 -1
- package/src/components/color-picker/examples/panel.tsx +1 -1
- package/src/components/color-picker/examples/sizes.tsx +9 -11
- package/src/components/color-picker/examples/states.tsx +28 -23
- package/src/components/color-swatches/COMPONENT.md +22 -8
- package/src/components/color-swatches/examples/examples.module.css +3 -4
- package/src/components/color-swatches/examples/in-form.tsx +19 -17
- package/src/components/color-swatches/examples/palette.tsx +24 -0
- package/src/components/color-swatches/examples/wrapping.tsx +17 -2
- package/src/components/command-menu/COMPONENT.md +60 -20
- package/src/components/command-menu/examples/sizes.tsx +20 -15
- package/src/components/command-menu/examples/states.tsx +46 -24
- package/src/components/composer/COMPONENT.md +42 -24
- package/src/components/composer/examples/examples.module.css +0 -9
- package/src/components/composer/examples/narrow.tsx +1 -1
- package/src/components/composer/examples/reply-edit.tsx +3 -3
- package/src/components/composer/examples/sizes.tsx +3 -5
- package/src/components/composer/examples/states.tsx +4 -6
- package/src/components/confirm-dialog/COMPONENT.md +26 -13
- package/src/components/confirm-dialog/examples/dismiss.tsx +27 -0
- package/src/components/confirm-dialog/examples/failure.tsx +9 -16
- package/src/components/crossfade/COMPONENT.md +11 -5
- package/src/components/crossfade/examples/examples.module.css +1 -40
- package/src/components/crossfade/examples/fill.tsx +16 -19
- package/src/components/crossfade/examples/overview.tsx +14 -16
- package/src/components/crossfade/examples/record-switch.tsx +6 -11
- package/src/components/crossfade/examples/screen.module.css +1 -24
- package/src/components/crossfade/examples/screen.tsx +14 -25
- package/src/components/data-table/COMPONENT.md +31 -21
- package/src/components/data-table/examples/controlled.tsx +14 -2
- package/src/components/data-table/examples/examples.module.css +1 -9
- package/src/components/data-table/examples/narrow.tsx +5 -1
- package/src/components/data-table/examples/row-link.tsx +2 -1
- package/src/components/data-table/examples/screen.module.css +2 -2
- package/src/components/data-table/examples/screen.tsx +11 -10
- package/src/components/data-table/examples/sizes.tsx +17 -17
- package/src/components/data-table/examples/states.tsx +37 -29
- package/src/components/datepicker/COMPONENT.md +53 -22
- package/src/components/datepicker/examples/dismiss.tsx +15 -0
- package/src/components/datepicker/examples/examples.module.css +3 -2
- package/src/components/datepicker/examples/in-form.tsx +33 -25
- package/src/components/datepicker/examples/sizes.tsx +2 -2
- package/src/components/datepicker/examples/states.tsx +2 -2
- package/src/components/datepicker/examples/validation.tsx +3 -3
- package/src/components/description-list/COMPONENT.md +24 -9
- package/src/components/description-list/examples/examples.module.css +4 -24
- package/src/components/description-list/examples/narrow.tsx +1 -1
- package/src/components/description-list/examples/screen.module.css +0 -18
- package/src/components/description-list/examples/screen.tsx +19 -27
- package/src/components/description-list/examples/sizes.tsx +2 -4
- package/src/components/description-list/examples/structure.tsx +6 -7
- package/src/components/description-list/examples/totals.tsx +40 -0
- package/src/components/digit-input/COMPONENT.md +12 -6
- package/src/components/digit-input/examples/examples.module.css +2 -2
- package/src/components/digit-input/examples/in-form.tsx +1 -1
- package/src/components/digit-input/examples/sizes.tsx +5 -3
- package/src/components/digit-input/examples/states.tsx +14 -6
- package/src/components/divider/COMPONENT.md +26 -12
- package/src/components/divider/examples/align.tsx +2 -4
- package/src/components/divider/examples/examples.module.css +13 -17
- package/src/components/divider/examples/or-separator.tsx +3 -5
- package/src/components/divider/examples/overview.tsx +18 -16
- package/src/components/divider/examples/vertical.tsx +5 -1
- package/src/components/divider/examples/with-icon.tsx +1 -1
- package/src/components/dnd/COMPONENT.md +52 -34
- package/src/components/dnd/examples/drop-zones.tsx +1 -1
- package/src/components/dnd/examples/examples.module.css +4 -6
- package/src/components/dnd/examples/states.tsx +41 -35
- package/src/components/drawer/COMPONENT.md +37 -14
- package/src/components/drawer/examples/guard.tsx +1 -3
- package/src/components/drawer/examples/header-actions.tsx +1 -1
- package/src/components/drawer/examples/in-form.tsx +31 -31
- package/src/components/drawer/examples/placement.tsx +31 -26
- package/src/components/drawer/examples/sizes.tsx +32 -27
- package/src/components/dropdown/COMPONENT.md +58 -23
- package/src/components/dropdown/examples/context-menu.tsx +75 -0
- package/src/components/dropdown/examples/examples.module.css +1 -1
- package/src/components/dropdown/examples/sizes.tsx +39 -34
- package/src/components/dropdown/examples/states.tsx +37 -29
- package/src/components/empty-page/COMPONENT.md +20 -9
- package/src/components/empty-page/examples/compact.tsx +28 -18
- package/src/components/empty-page/examples/examples.module.css +0 -43
- package/src/components/empty-page/examples/narrow.tsx +3 -3
- package/src/components/empty-page/examples/region-error.tsx +6 -11
- package/src/components/empty-page/examples/sizes.tsx +13 -13
- package/src/components/empty-page/examples/variants.tsx +34 -30
- package/src/components/example-frame/COMPONENT.md +21 -9
- package/src/components/example-frame/examples/controlled.tsx +3 -3
- package/src/components/field-list/COMPONENT.md +14 -8
- package/src/components/field-list/examples/sizes.tsx +32 -26
- package/src/components/field-list/examples/states.tsx +37 -31
- package/src/components/fieldset/COMPONENT.md +10 -5
- package/src/components/fieldset/examples/examples.module.css +1 -1
- package/src/components/file-upload/COMPONENT.md +67 -29
- package/src/components/file-upload/examples/avatar-upload.tsx +5 -5
- package/src/components/file-upload/examples/custom-body.tsx +12 -7
- package/src/components/file-upload/examples/examples.module.css +4 -4
- package/src/components/file-upload/examples/narrow.tsx +1 -1
- package/src/components/file-upload/examples/row-parts.tsx +4 -4
- package/src/components/file-upload/examples/screen.module.css +2 -2
- package/src/components/file-upload/examples/screen.tsx +6 -4
- package/src/components/file-upload/examples/sizes.tsx +1 -3
- package/src/components/file-upload/examples/states.tsx +1 -3
- package/src/components/file-upload/examples/variants.tsx +13 -7
- package/src/components/gallery/COMPONENT.md +16 -7
- package/src/components/gallery/examples/album-sizes.tsx +52 -0
- package/src/components/gallery/examples/controlled.tsx +40 -0
- package/src/components/gallery/examples/examples.module.css +1 -1
- package/src/components/gallery/examples/overview.tsx +15 -43
- package/src/components/gallery/examples/transfer.tsx +22 -13
- package/src/components/gantt/COMPONENT.md +21 -15
- package/src/components/gantt/examples/examples.module.css +0 -16
- package/src/components/gantt/examples/occupancy.tsx +2 -2
- package/src/components/gantt/examples/screen.tsx +2 -2
- package/src/components/gantt/examples/sizes.tsx +16 -16
- package/src/components/gantt/examples/states.tsx +34 -30
- package/src/components/gantt/examples/variants.tsx +27 -25
- package/src/components/hint/COMPONENT.md +24 -14
- package/src/components/hint/examples/examples.module.css +1 -1
- package/src/components/hint/examples/hint-or-error.tsx +2 -2
- package/src/components/hint/examples/overview.tsx +9 -10
- package/src/components/hint/examples/sizes.tsx +1 -1
- package/src/components/input/COMPONENT.md +10 -6
- package/src/components/input/examples/affixes.tsx +2 -2
- package/src/components/input/examples/examples.module.css +1 -1
- package/src/components/input/examples/sizes.tsx +9 -5
- package/src/components/input/examples/states.tsx +39 -23
- package/src/components/input/examples/with-icon.tsx +24 -16
- package/src/components/kanban/COMPONENT.md +30 -24
- package/src/components/kanban/examples/columns.tsx +14 -19
- package/src/components/kanban/examples/item-link.tsx +2 -2
- package/src/components/kanban/examples/limits.tsx +1 -1
- package/src/components/kanban/examples/narrow.tsx +1 -1
- package/src/components/kanban/examples/screen.module.css +1 -3
- package/src/components/kanban/examples/screen.tsx +6 -4
- package/src/components/kanban/examples/states.tsx +37 -58
- package/src/components/kanban/examples/variants.tsx +0 -3
- package/src/components/kbd/COMPONENT.md +10 -6
- package/src/components/kbd/examples/examples.module.css +1 -20
- package/src/components/kbd/examples/in-controls.tsx +2 -2
- package/src/components/kbd/examples/shortcut-list.tsx +14 -26
- package/src/components/label/COMPONENT.md +26 -11
- package/src/components/label/examples/examples.module.css +3 -11
- package/src/components/label/examples/overview.tsx +5 -9
- package/src/components/label/examples/structure.tsx +2 -2
- package/src/components/link-button/COMPONENT.md +33 -20
- package/src/components/link-button/examples/as-child.tsx +1 -1
- package/src/components/link-button/examples/external-link.tsx +1 -1
- package/src/components/link-button/examples/overview.tsx +4 -2
- package/src/components/link-button/examples/variants.tsx +2 -2
- package/src/components/list/COMPONENT.md +24 -16
- package/src/components/list/examples/examples.module.css +0 -8
- package/src/components/list/examples/overflow.tsx +1 -1
- package/src/components/list/examples/overview.tsx +31 -30
- package/src/components/list/examples/sizes.tsx +23 -23
- package/src/components/list/examples/states.tsx +38 -21
- package/src/components/list/examples/with-icon.tsx +16 -14
- package/src/components/login-form/COMPONENT.md +69 -16
- package/src/components/login-form/examples/narrow.tsx +1 -1
- package/src/components/login-form/examples/register.tsx +1 -1
- package/src/components/media-viewer/COMPONENT.md +12 -8
- package/src/components/media-viewer/examples/examples.module.css +2 -2
- package/src/components/media-viewer/examples/video.tsx +1 -1
- package/src/components/message/COMPONENT.md +102 -46
- package/src/components/message/examples/typing.tsx +5 -5
- package/src/components/modal/COMPONENT.md +71 -37
- package/src/components/modal/examples/dismiss.tsx +35 -27
- package/src/components/modal/examples/enter-key.tsx +22 -25
- package/src/components/modal/examples/examples.module.css +0 -7
- package/src/components/modal/examples/guard.tsx +2 -4
- package/src/components/modal/examples/in-form.tsx +28 -28
- package/src/components/modal/examples/long-content.tsx +6 -4
- package/src/components/modal/examples/sizes.tsx +36 -31
- package/src/components/modal/examples/structure.tsx +1 -1
- package/src/components/native-select/COMPONENT.md +7 -3
- package/src/components/native-select/examples/examples.module.css +3 -3
- package/src/components/native-select/examples/in-form.tsx +28 -29
- package/src/components/native-select/examples/sizes.tsx +2 -2
- package/src/components/native-select/examples/states.tsx +2 -2
- package/src/components/notification/COMPONENT.md +36 -31
- package/src/components/notification/examples/examples.module.css +1 -2
- package/src/components/notification/examples/in-form.tsx +28 -20
- package/src/components/notification/examples/sizes.tsx +16 -12
- package/src/components/notification/examples/undo.tsx +7 -15
- package/src/components/page-content/COMPONENT.md +21 -29
- package/src/components/page-content/examples/examples.module.css +3 -16
- package/src/components/page-content/examples/grid.tsx +3 -1
- package/src/components/page-content/examples/list-detail.tsx +55 -49
- package/src/components/page-content/examples/narrow.tsx +1 -1
- package/src/components/page-content/examples/overview.tsx +2 -2
- package/src/components/page-content/examples/variants.tsx +7 -7
- package/src/components/page-toolbar/COMPONENT.md +10 -6
- package/src/components/page-toolbar/examples/overview.tsx +1 -1
- package/src/components/page-toolbar/examples/save-changes.tsx +25 -22
- package/src/components/pagination/COMPONENT.md +20 -17
- package/src/components/pagination/examples/narrow.tsx +5 -5
- package/src/components/popover/COMPONENT.md +43 -20
- package/src/components/popover/examples/controlled-open.tsx +6 -4
- package/src/components/popover/examples/dismiss.tsx +37 -28
- package/src/components/popover/examples/examples.module.css +2 -2
- package/src/components/popover/examples/sizes.tsx +32 -27
- package/src/components/popover/examples/width.tsx +45 -0
- package/src/components/progress-bar/COMPONENT.md +21 -29
- package/src/components/progress-bar/examples/examples.module.css +1 -1
- package/src/components/progress-circle/COMPONENT.md +21 -29
- package/src/components/progress-circle/examples/examples.module.css +1 -1
- package/src/components/progress-circle/examples/on-color.tsx +16 -0
- package/src/components/progress-circle/examples/variants.tsx +1 -0
- package/src/components/radio/COMPONENT.md +13 -4
- package/src/components/radio/examples/examples.module.css +1 -1
- package/src/components/scroll-container/COMPONENT.md +18 -12
- package/src/components/scroll-container/examples/auto-scroll.tsx +8 -4
- package/src/components/scroll-container/examples/edges.tsx +4 -4
- package/src/components/scroll-container/examples/examples.module.css +7 -51
- package/src/components/scroll-container/examples/load-more.tsx +4 -4
- package/src/components/scroll-container/examples/lock.tsx +4 -4
- package/src/components/scroll-container/examples/log.tsx +97 -0
- package/src/components/scroll-container/examples/overscroll.tsx +4 -4
- package/src/components/scroll-container/examples/overview.tsx +5 -5
- package/src/components/scroll-container/examples/scrollbar.tsx +4 -4
- package/src/components/scroll-container/examples/snap.tsx +2 -2
- package/src/components/scroll-container/examples/variants.tsx +1 -0
- package/src/components/segmented-control/COMPONENT.md +24 -12
- package/src/components/segmented-control/examples/controlled.tsx +2 -4
- package/src/components/segmented-control/examples/examples.module.css +0 -8
- package/src/components/segmented-control/examples/scroll.tsx +1 -1
- package/src/components/select/COMPONENT.md +33 -9
- package/src/components/select/examples/dismiss.tsx +26 -0
- package/src/components/select/examples/examples.module.css +1 -1
- package/src/components/select/examples/server-search.tsx +6 -2
- package/src/components/select/examples/sizes.tsx +2 -2
- package/src/components/select/examples/states.tsx +2 -2
- package/src/components/select/examples/with-icon.tsx +20 -18
- package/src/components/sheet/COMPONENT.md +44 -21
- package/src/components/sheet/examples/header-actions.tsx +23 -4
- package/src/components/sheet/examples/overview.tsx +25 -10
- package/src/components/skeleton/COMPONENT.md +8 -4
- package/src/components/skeleton/examples/examples.module.css +1 -13
- package/src/components/skeleton/examples/with-crossfade.tsx +7 -7
- package/src/components/slider/COMPONENT.md +10 -5
- package/src/components/slider/examples/examples.module.css +6 -7
- package/src/components/slider/examples/hint-and-error.tsx +3 -5
- package/src/components/slider/examples/in-form.tsx +21 -19
- package/src/components/smart-filter/COMPONENT.md +32 -12
- package/src/components/smart-filter/examples/examples.module.css +0 -21
- package/src/components/smart-filter/examples/ranges.tsx +2 -1
- package/src/components/smart-filter/examples/sizes.tsx +2 -4
- package/src/components/sparkline/COMPONENT.md +7 -3
- package/src/components/sparkline/examples/examples.module.css +1 -1
- package/src/components/sparkline/examples/signed-bars.tsx +2 -2
- package/src/components/spinner/COMPONENT.md +15 -9
- package/src/components/spinner/examples/examples.module.css +2 -14
- package/src/components/spinner/examples/overview.tsx +1 -1
- package/src/components/stepper/COMPONENT.md +50 -41
- package/src/components/stepper/examples/examples.module.css +1 -6
- package/src/components/stepper/examples/narrow.tsx +1 -1
- package/src/components/stepper/examples/sizes.tsx +6 -8
- package/src/components/stepper/examples/states.tsx +44 -43
- package/src/components/stepper/examples/with-icon.tsx +19 -17
- package/src/components/switch/COMPONENT.md +21 -8
- package/src/components/switch/examples/examples.module.css +2 -2
- package/src/components/switch/examples/states.tsx +3 -3
- package/src/components/tabs/COMPONENT.md +21 -16
- package/src/components/tabs/examples/in-drawer.tsx +1 -1
- package/src/components/tabs/examples/sizes.tsx +5 -10
- package/src/components/tabs/examples/variants.tsx +19 -23
- package/src/components/tag-select/COMPONENT.md +19 -6
- package/src/components/tag-select/examples/creatable.tsx +2 -2
- package/src/components/tag-select/examples/dismiss.tsx +23 -0
- package/src/components/tag-select/examples/examples.module.css +3 -3
- package/src/components/tag-select/examples/in-form.tsx +31 -32
- package/src/components/tag-select/examples/sizes.tsx +2 -2
- package/src/components/tag-select/examples/states.tsx +2 -2
- package/src/components/textarea/COMPONENT.md +10 -6
- package/src/components/textarea/examples/examples.module.css +3 -10
- package/src/components/textarea/examples/in-form.tsx +3 -3
- package/src/components/textarea/examples/sizes.tsx +10 -7
- package/src/components/textarea/examples/states.tsx +29 -13
- package/src/components/textarea/examples/validation.tsx +45 -36
- package/src/components/thumbnail/COMPONENT.md +17 -13
- package/src/components/thumbnail/examples/examples.module.css +1 -1
- package/src/components/thumbnail/examples/states.tsx +1 -1
- package/src/components/thumbnail/examples/variants.tsx +12 -1
- package/src/components/timeline/COMPONENT.md +51 -35
- package/src/components/timeline/examples/links.tsx +14 -14
- package/src/components/timeline/examples/narrow.tsx +6 -6
- package/src/components/timeline/examples/overview.tsx +6 -6
- package/src/components/timeline/examples/sizes.tsx +28 -23
- package/src/components/timeline/examples/structure.tsx +30 -30
- package/src/components/timeline/examples/variants.tsx +40 -28
- package/src/components/tooltip/COMPONENT.md +10 -6
- package/src/components/tooltip/examples/examples.module.css +1 -5
- package/src/components/tooltip/examples/non-interactive-trigger.tsx +1 -1
- package/src/components/tooltip/examples/sizes.tsx +17 -10
- package/src/components/typography/COMPONENT.md +17 -2
- package/src/components/typography/examples/examples.module.css +3 -6
- package/src/components/typography/examples/numeric.tsx +16 -0
- package/src/components/video-note/COMPONENT.md +11 -7
- package/src/components/visually-hidden/COMPONENT.md +8 -4
- package/src/components/visually-hidden/examples/assertive.tsx +1 -1
- package/src/components/visually-hidden/examples/overview.tsx +17 -7
- package/src/components/voice-player/COMPONENT.md +15 -7
- package/src/layout/app-header/COMPONENT.md +27 -26
- package/src/layout/app-header/examples/examples.module.css +4 -23
- package/src/layout/app-header/examples/in-app-shell.tsx +3 -5
- package/src/layout/app-header/examples/narrow.tsx +58 -20
- package/src/layout/app-shell/COMPONENT.md +40 -10
- package/src/layout/app-shell/examples/examples.module.css +2 -22
- package/src/layout/app-shell/examples/footer.tsx +2 -2
- package/src/layout/app-shell/examples/overview.tsx +3 -5
- package/src/layout/app-shell/examples/screen.tsx +27 -21
- package/src/layout/app-shell/examples/template.tsx +3 -3
- package/src/layout/bottom-nav/COMPONENT.md +27 -17
- package/src/layout/bottom-nav/examples/examples.module.css +2 -7
- package/src/layout/bottom-nav/examples/floating-action.tsx +2 -2
- package/src/layout/bottom-nav/examples/floating.tsx +2 -2
- package/src/layout/bottom-nav/examples/in-app-shell.tsx +2 -2
- package/src/layout/bottom-nav/examples/router.tsx +6 -5
- package/src/layout/sidebar/COMPONENT.md +50 -40
- package/src/layout/sidebar/examples/account.tsx +1 -3
- package/src/layout/sidebar/examples/brand-header.tsx +1 -3
- package/src/layout/sidebar/examples/collapsible-groups.tsx +1 -3
- package/src/layout/sidebar/examples/controlled-open.tsx +1 -3
- package/src/layout/sidebar/examples/controlled.tsx +1 -3
- package/src/layout/sidebar/examples/custom-part.tsx +1 -3
- package/src/layout/sidebar/examples/dismiss.tsx +47 -0
- package/src/layout/sidebar/examples/examples.module.css +7 -32
- package/src/layout/sidebar/examples/narrow.tsx +44 -42
- package/src/layout/sidebar/examples/nested-items.tsx +1 -3
- package/src/layout/sidebar/examples/overview.tsx +1 -3
- package/src/layout/sidebar/examples/persist.tsx +1 -3
- package/src/layout/sidebar/examples/router.tsx +12 -13
- package/src/layout/sidebar/examples/sizes.tsx +6 -6
- package/src/styles/controls.css +2 -2
- package/src/styles/fonts.css +22 -0
- package/src/styles/globals.css +89 -12
- package/src/styles/theme-dark.css +13 -14
- package/src/styles/theme-light.css +67 -23
- package/src/styles/tokens.css +14 -4
- package/dist/components/dnd/useFlipList.d.ts +0 -17
- package/dist/components/gantt/useEdgeAutoScroll.d.ts +0 -12
- package/dist/components/modal/ModalDialog.d.ts +0 -46
- package/dist/hooks/useStateSwap.d.ts +0 -8
- package/dist/internal/highlightTsxHtml.d.ts +0 -2
- package/dist/internal/layoutPxFromPrimitives.d.ts +0 -6
- package/dist/internal/mergeRefs.d.ts +0 -6
- package/dist/skill/reference/components/drawer/examples/examples.module.css +0 -8
- package/dist/skill/reference/components/popover/examples/match-trigger-width.tsx +0 -23
- package/dist/skill/reference/components/scroll-container/examples/chat.tsx +0 -101
- package/dist/skill/reference/components/spinner/examples/loading-region.tsx +0 -22
- package/src/components/drawer/examples/examples.module.css +0 -8
- package/src/components/popover/examples/match-trigger-width.tsx +0 -23
- package/src/components/scroll-container/examples/chat.tsx +0 -101
- package/src/components/spinner/examples/loading-region.tsx +0 -22
|
@@ -10,6 +10,9 @@ export declare namespace SelectItemIcon {
|
|
|
10
10
|
var displayName: string;
|
|
11
11
|
}
|
|
12
12
|
export type SelectItemTextProps = SpanProps & {
|
|
13
|
+
/**
|
|
14
|
+
* The text.
|
|
15
|
+
*/
|
|
13
16
|
children: React.ReactNode;
|
|
14
17
|
};
|
|
15
18
|
/** Title of a rich option; its text is the option label (trigger, typeahead, search). */
|
|
@@ -18,6 +21,9 @@ export declare namespace SelectItemText {
|
|
|
18
21
|
var displayName: string;
|
|
19
22
|
}
|
|
20
23
|
export type SelectItemDescriptionProps = SpanProps & {
|
|
24
|
+
/**
|
|
25
|
+
* The text.
|
|
26
|
+
*/
|
|
21
27
|
children: React.ReactNode;
|
|
22
28
|
};
|
|
23
29
|
/** Muted second line under `Select.ItemText`; searchable. Makes the row two-line. */
|
|
@@ -26,6 +32,9 @@ export declare namespace SelectItemDescription {
|
|
|
26
32
|
var displayName: string;
|
|
27
33
|
}
|
|
28
34
|
export type SelectItemMetaProps = SpanProps & {
|
|
35
|
+
/**
|
|
36
|
+
* The text.
|
|
37
|
+
*/
|
|
29
38
|
children: React.ReactNode;
|
|
30
39
|
};
|
|
31
40
|
/** Trailing meta of an option (price, count): muted, tabular, before the check. */
|
|
@@ -53,28 +62,46 @@ export declare function splitItemChildren(children: React.ReactNode): ItemParts;
|
|
|
53
62
|
* `size`, decorative (the text names the option).
|
|
54
63
|
*/
|
|
55
64
|
export declare function sizeMedia(leading: React.ReactNode[], size: ControlSize): React.ReactNode[];
|
|
56
|
-
export type SelectItemProps = {
|
|
65
|
+
export type SelectItemProps = Omit<React.HTMLAttributes<HTMLDivElement>, "role" | "id" | "children"> & {
|
|
66
|
+
/**
|
|
67
|
+
* Value of the option.
|
|
68
|
+
*/
|
|
57
69
|
value: string;
|
|
58
|
-
/**
|
|
70
|
+
/**
|
|
71
|
+
* Text in the trigger and for typeahead; defaults to `Select.ItemText`, then the plain text.
|
|
72
|
+
*/
|
|
59
73
|
label?: string;
|
|
60
|
-
/**
|
|
74
|
+
/**
|
|
75
|
+
* Extra words for the search.
|
|
76
|
+
*/
|
|
61
77
|
keywords?: string;
|
|
78
|
+
/**
|
|
79
|
+
* Muted, skipped by the keyboard, not selectable.
|
|
80
|
+
*/
|
|
62
81
|
disabled?: boolean;
|
|
63
|
-
|
|
82
|
+
/**
|
|
83
|
+
* Text, or `Select.ItemIcon`, `Avatar.Root`, `Thumbnail.Root`, `Select.ItemText`, `Select.ItemDescription`, `Select.ItemMeta`, `Badge.Root` as direct children.
|
|
84
|
+
*/
|
|
64
85
|
children: React.ReactNode;
|
|
65
86
|
ref?: React.Ref<HTMLDivElement>;
|
|
66
87
|
};
|
|
67
|
-
export declare function SelectItem({ value, label, keywords, disabled, className, children, ref, }: SelectItemProps): import("react/jsx-runtime").JSX.Element | null;
|
|
88
|
+
export declare function SelectItem({ value, label, keywords, disabled, className, children, onClick, onMouseMove, ref, ...rest }: SelectItemProps): import("react/jsx-runtime").JSX.Element | null;
|
|
68
89
|
export declare namespace SelectItem {
|
|
69
90
|
var displayName: string;
|
|
70
91
|
}
|
|
71
92
|
export declare const isActionValue: (value: string) => boolean;
|
|
72
93
|
export type SelectActionProps = Omit<React.HTMLAttributes<HTMLDivElement>, "onSelect" | "role" | "id" | "children"> & {
|
|
73
|
-
/**
|
|
94
|
+
/**
|
|
95
|
+
* Runs the action: a click, or Enter / Space while it is highlighted; the list then closes and the value stays.
|
|
96
|
+
*/
|
|
74
97
|
onSelect: () => void;
|
|
75
|
-
/**
|
|
98
|
+
/**
|
|
99
|
+
* Muted, skipped by the keyboard, not runnable.
|
|
100
|
+
*/
|
|
76
101
|
disabled?: boolean;
|
|
77
|
-
/**
|
|
102
|
+
/**
|
|
103
|
+
* The action text; an optional `Select.ItemIcon` in front.
|
|
104
|
+
*/
|
|
78
105
|
children: React.ReactNode;
|
|
79
106
|
ref?: React.Ref<HTMLDivElement>;
|
|
80
107
|
};
|
|
@@ -1,5 +1,5 @@
|
|
|
1
1
|
import type * as React from "react";
|
|
2
|
-
import {
|
|
2
|
+
import type { ListboxRegistry, Store } from "../../internal/listbox";
|
|
3
3
|
import type { ControlSize } from "../../internal/states";
|
|
4
4
|
export type SelectLabels = {
|
|
5
5
|
/** Placeholder and accessible name of the search field (`Select.Content searchable`). */
|
|
@@ -20,32 +20,18 @@ export type SelectLabels = {
|
|
|
20
20
|
changeFailed: string;
|
|
21
21
|
};
|
|
22
22
|
export declare const normalize: (text: string) => string;
|
|
23
|
-
/**
|
|
24
|
-
* The items of a Select: their labels (shown in the trigger; kept after an item unmounts, so the
|
|
25
|
-
* label does not flicker while the list moves between the closed registry and the open panel)
|
|
26
|
-
* and the mounted ones with their search text (the empty state). `version` changes on every
|
|
27
|
-
* (un)registration.
|
|
28
|
-
*/
|
|
29
|
-
export type ItemRegistry = {
|
|
30
|
-
version: Store<number>;
|
|
31
|
-
labelOf: (value: string) => string;
|
|
32
|
-
/** Registers a mounted item; returns the unregistration. */
|
|
33
|
-
register: (value: string, label: string, haystack: string) => () => void;
|
|
34
|
-
/** Some mounted item matches the normalized query. */
|
|
35
|
-
anyMatch: (query: string) => boolean;
|
|
36
|
-
};
|
|
37
|
-
export declare function createItemRegistry(): ItemRegistry;
|
|
38
23
|
export type SelectContextValue = {
|
|
39
24
|
size: ControlSize;
|
|
40
25
|
invalid: boolean;
|
|
41
|
-
focusRing: boolean;
|
|
26
|
+
focusRing: boolean | undefined;
|
|
42
27
|
required: boolean;
|
|
43
28
|
disabled: boolean;
|
|
44
29
|
placeholder: string | undefined;
|
|
45
30
|
multiple: boolean;
|
|
46
31
|
/** Selected values: one or none in single mode. */
|
|
47
32
|
selected: string[];
|
|
48
|
-
|
|
33
|
+
/** The items and actions of the list (`@/internal/listbox`): labels, the query view, Enter. */
|
|
34
|
+
registry: ListboxRegistry;
|
|
49
35
|
pick: (value: string) => void;
|
|
50
36
|
clear: () => void;
|
|
51
37
|
clearable: boolean;
|
|
@@ -61,6 +47,8 @@ export type SelectContextValue = {
|
|
|
61
47
|
filter: boolean;
|
|
62
48
|
isOpen: boolean;
|
|
63
49
|
setOpen: (open: boolean) => void;
|
|
50
|
+
closeOnEscape: boolean;
|
|
51
|
+
closeOnOutsideClick: boolean;
|
|
64
52
|
/** The highlighted option; items subscribe to their own slice of it. */
|
|
65
53
|
highlight: Store<string | undefined>;
|
|
66
54
|
query: string;
|
|
@@ -71,4 +59,4 @@ export type SelectContextValue = {
|
|
|
71
59
|
triggerRef: React.RefObject<HTMLButtonElement | null>;
|
|
72
60
|
labels: SelectLabels;
|
|
73
61
|
};
|
|
74
|
-
export declare const SelectProvider: React.Provider<SelectContextValue | null>, useSelectContext: () => SelectContextValue;
|
|
62
|
+
export declare const SelectProvider: React.Provider<SelectContextValue | null>, useSelectContext: (part?: string) => SelectContextValue;
|
|
@@ -1,34 +1,51 @@
|
|
|
1
|
-
import * as React from "react";
|
|
2
|
-
import { DialogGuard } from "
|
|
3
|
-
import { DialogActions, DialogBody, DialogClose, DialogDescription,
|
|
4
|
-
export type { DialogGuardProps as SheetGuardProps } from "
|
|
5
|
-
export type { DialogActionsProps as SheetActionsProps, DialogBodyProps as SheetBodyProps, DialogCloseProps as SheetCloseProps, DialogDescriptionProps as SheetDescriptionProps, DialogFooterProps as SheetFooterProps, DialogHeaderProps as SheetHeaderProps, DialogIconProps as SheetIconProps, DialogMetaProps as SheetMetaProps, DialogTitleProps as SheetTitleProps, DialogTriggerProps as SheetTriggerProps, } from "
|
|
6
|
-
export type SheetLabels =
|
|
7
|
-
/** `aria-label` of the header close button. */
|
|
8
|
-
close: string;
|
|
9
|
-
};
|
|
1
|
+
import type * as React from "react";
|
|
2
|
+
import { DialogGuard } from "../../internal/overlay/DialogGuard";
|
|
3
|
+
import { DialogActions, DialogBody, DialogClose, DialogDescription, DialogFooter, DialogHeader, DialogIcon, type DialogLabels, DialogMeta, DialogTitle, DialogTrigger } from "../../internal/overlay/DialogParts";
|
|
4
|
+
export type { DialogGuardProps as SheetGuardProps } from "../../internal/overlay/DialogGuard";
|
|
5
|
+
export type { DialogActionsProps as SheetActionsProps, DialogBodyProps as SheetBodyProps, DialogCloseProps as SheetCloseProps, DialogDescriptionProps as SheetDescriptionProps, DialogFooterProps as SheetFooterProps, DialogHeaderProps as SheetHeaderProps, DialogIconProps as SheetIconProps, DialogMetaProps as SheetMetaProps, DialogTitleProps as SheetTitleProps, DialogTriggerProps as SheetTriggerProps, } from "../../internal/overlay/DialogParts";
|
|
6
|
+
export type SheetLabels = DialogLabels;
|
|
10
7
|
export type SheetRootProps = {
|
|
8
|
+
/**
|
|
9
|
+
* Controlled visibility; together with `onOpenChange`.
|
|
10
|
+
*/
|
|
11
11
|
open?: boolean;
|
|
12
|
+
/**
|
|
13
|
+
* Initial visibility, uncontrolled.
|
|
14
|
+
*/
|
|
12
15
|
defaultOpen?: boolean;
|
|
16
|
+
/**
|
|
17
|
+
* Called on every open and close: trigger, close button, `Close`, Escape, scrim click, code. A `Guard` holds the dismisses (not code).
|
|
18
|
+
*/
|
|
13
19
|
onOpenChange?: (open: boolean) => void;
|
|
14
|
-
/**
|
|
20
|
+
/**
|
|
21
|
+
* Escape closes the dialog.
|
|
22
|
+
*/
|
|
15
23
|
closeOnEscape?: boolean;
|
|
16
|
-
/**
|
|
24
|
+
/**
|
|
25
|
+
* A click on the scrim (and a swipe down, which draws the grab handle) closes the dialog. A destructive action is confirmed in a ConfirmDialog; unsaved changes are held by `Guard`.
|
|
26
|
+
*/
|
|
17
27
|
closeOnOutsideClick?: boolean;
|
|
28
|
+
/**
|
|
29
|
+
* Built-in strings, see Labels.
|
|
30
|
+
*/
|
|
18
31
|
labels?: Partial<SheetLabels>;
|
|
32
|
+
/**
|
|
33
|
+
* Trigger and Content.
|
|
34
|
+
*/
|
|
19
35
|
children?: React.ReactNode;
|
|
20
36
|
};
|
|
21
|
-
declare function SheetRoot({
|
|
37
|
+
declare function SheetRoot({ children, ...options }: SheetRootProps): import("react/jsx-runtime").JSX.Element;
|
|
22
38
|
declare namespace SheetRoot {
|
|
23
39
|
var displayName: string;
|
|
24
40
|
}
|
|
25
41
|
export type SheetContentProps = React.HTMLAttributes<HTMLDivElement> & {
|
|
26
|
-
/**
|
|
42
|
+
/**
|
|
43
|
+
* Class on the scrim.
|
|
44
|
+
*/
|
|
27
45
|
overlayClassName?: string;
|
|
28
|
-
/** The `role="dialog"` panel. */
|
|
29
46
|
ref?: React.Ref<HTMLDivElement>;
|
|
30
47
|
};
|
|
31
|
-
declare function SheetContent(
|
|
48
|
+
declare function SheetContent(props: SheetContentProps): import("react/jsx-runtime").JSX.Element;
|
|
32
49
|
declare namespace SheetContent {
|
|
33
50
|
var displayName: string;
|
|
34
51
|
}
|
|
@@ -7,11 +7,17 @@ import type { ControlSize } from "../../internal/states";
|
|
|
7
7
|
*/
|
|
8
8
|
export type SkeletonShape = "text" | "control" | "circle" | "block";
|
|
9
9
|
export type SkeletonProps = Omit<React.HTMLAttributes<HTMLSpanElement>, "children"> & {
|
|
10
|
-
/**
|
|
10
|
+
/**
|
|
11
|
+
* `text` — lines of the tier's text; `control` — a field or button of the tier; `circle` — an avatar of the tier; `block` — a box that fills its container (image, chart, card).
|
|
12
|
+
*/
|
|
11
13
|
shape?: SkeletonShape;
|
|
12
|
-
/**
|
|
14
|
+
/**
|
|
15
|
+
* Tier of the text line (control text size and line height), the control height or the avatar size.
|
|
16
|
+
*/
|
|
13
17
|
size?: ControlSize;
|
|
14
|
-
/**
|
|
18
|
+
/**
|
|
19
|
+
* `text` only: number of lines; the last of several is 60% wide.
|
|
20
|
+
*/
|
|
15
21
|
lines?: number;
|
|
16
22
|
ref?: React.Ref<HTMLSpanElement>;
|
|
17
23
|
};
|
|
@@ -4,43 +4,83 @@ export type SliderLabels = {
|
|
|
4
4
|
/** Muted marker after the label when `optional`. */
|
|
5
5
|
optional: string;
|
|
6
6
|
};
|
|
7
|
-
export
|
|
7
|
+
export declare const SLIDER_LABELS: SliderLabels;
|
|
8
|
+
export type SliderProps = FieldRootDomProps & FieldFrameProps & {
|
|
9
|
+
/**
|
|
10
|
+
* Controlled value; clamped to `min`…`max`.
|
|
11
|
+
*/
|
|
8
12
|
value?: number;
|
|
13
|
+
/**
|
|
14
|
+
* Initial value when uncontrolled.
|
|
15
|
+
*/
|
|
9
16
|
defaultValue?: number;
|
|
17
|
+
/**
|
|
18
|
+
* Called with the new number while dragging and on every key step.
|
|
19
|
+
*/
|
|
10
20
|
onValueChange?: (value: number) => void;
|
|
11
21
|
/**
|
|
12
|
-
* The value the person settled on
|
|
13
|
-
* key moved it, and only if the value differs from the last commit. Save here instead of on
|
|
14
|
-
* every `onValueChange` step. Return the save's promise: the thumb dims (`aria-busy`) until it
|
|
15
|
-
* settles; reject — the value glides back to the last saved one.
|
|
22
|
+
* The value the person settled on, once after a drag or a key step. Save here, not in `onValueChange`. Return the save's promise: the thumb dims until it settles; on reject the value goes back.
|
|
16
23
|
*/
|
|
17
24
|
onCommit?: (value: number) => void | Promise<void>;
|
|
18
|
-
/**
|
|
25
|
+
/**
|
|
26
|
+
* Name of the range input, submitted with a form.
|
|
27
|
+
*/
|
|
19
28
|
name?: string;
|
|
29
|
+
/**
|
|
30
|
+
* Lower bound.
|
|
31
|
+
*/
|
|
20
32
|
min?: number;
|
|
33
|
+
/**
|
|
34
|
+
* Upper bound.
|
|
35
|
+
*/
|
|
21
36
|
max?: number;
|
|
37
|
+
/**
|
|
38
|
+
* Step of the keyboard and of the snapping; fractions allowed.
|
|
39
|
+
*/
|
|
22
40
|
step?: number;
|
|
41
|
+
/**
|
|
42
|
+
* Muted track and thumb, dimmed label and value, no interaction.
|
|
43
|
+
*/
|
|
23
44
|
disabled?: boolean;
|
|
24
|
-
/**
|
|
45
|
+
/**
|
|
46
|
+
* `aria-invalid` on the range input and a danger focus ring on the thumb. A non-empty `error` implies it.
|
|
47
|
+
*/
|
|
25
48
|
invalid?: boolean;
|
|
26
|
-
/**
|
|
49
|
+
/**
|
|
50
|
+
* Shows the current value at the end of the label row (tabular numbers, `aria-hidden` — the input announces it).
|
|
51
|
+
*/
|
|
27
52
|
showValue?: boolean;
|
|
28
|
-
/**
|
|
53
|
+
/**
|
|
54
|
+
* Formats the shown value and `aria-valuetext` (units, currency).
|
|
55
|
+
*/
|
|
29
56
|
formatValue?: (value: number) => string;
|
|
30
|
-
/**
|
|
57
|
+
/**
|
|
58
|
+
* Tier of the track thickness T (thumb 4.5T × 3T), the label, the value and the hint. Without it the tier of its host (a form, a panel), else `m`.
|
|
59
|
+
*/
|
|
31
60
|
size?: ControlSize;
|
|
32
|
-
/**
|
|
61
|
+
/**
|
|
62
|
+
* Color of the filled part of the track.
|
|
63
|
+
*/
|
|
33
64
|
tone?: Tone;
|
|
34
65
|
/**
|
|
35
|
-
* `vertical` — the track stands upright, minimum at the bottom
|
|
36
|
-
* (a level beside a button). Default `horizontal`.
|
|
66
|
+
* `vertical` — the track stands upright, minimum at the bottom: a level beside a button, a mixer column.
|
|
37
67
|
*/
|
|
38
68
|
orientation?: "horizontal" | "vertical";
|
|
39
|
-
/**
|
|
69
|
+
/**
|
|
70
|
+
* Id of the range input (generated when omitted); hint id is `<id>-hint`, error id is `<id>-error`.
|
|
71
|
+
*/
|
|
40
72
|
id?: string;
|
|
41
|
-
/**
|
|
73
|
+
/**
|
|
74
|
+
* Accessible name when there is no visible `label`.
|
|
75
|
+
*/
|
|
42
76
|
"aria-label"?: string;
|
|
77
|
+
/**
|
|
78
|
+
* Merged before the hint / error ids on the range input.
|
|
79
|
+
*/
|
|
43
80
|
"aria-describedby"?: string;
|
|
81
|
+
/**
|
|
82
|
+
* Built-in strings, see Labels.
|
|
83
|
+
*/
|
|
44
84
|
labels?: Partial<SliderLabels>;
|
|
45
85
|
};
|
|
46
86
|
/**
|
|
@@ -1,5 +1,5 @@
|
|
|
1
1
|
import * as React from "react";
|
|
2
|
-
import type
|
|
2
|
+
import { type ControlSize } from "../../internal/states";
|
|
3
3
|
import { type SmartFilterValue } from "./model";
|
|
4
4
|
export type { SmartFilterFieldValue, SmartFilterMode, SmartFilterRange, SmartFilterSelection, SmartFilterValue, } from "./model";
|
|
5
5
|
export { isSmartFilterRange, matchesSmartFilter, resolveSmartFilterValues } from "./model";
|
|
@@ -96,34 +96,61 @@ export type SmartFilterLabels = {
|
|
|
96
96
|
/** Chip value of a range with only the upper bound. */
|
|
97
97
|
rangeTo: string;
|
|
98
98
|
};
|
|
99
|
-
export
|
|
100
|
-
|
|
99
|
+
export declare const SMART_FILTER_LABELS: SmartFilterLabels;
|
|
100
|
+
export type SmartFilterRootProps = Omit<React.HTMLAttributes<HTMLDivElement>, "children" | "defaultValue" | "onChange"> & {
|
|
101
|
+
/**
|
|
102
|
+
* Fields of this screen, in display order; empty — only the search. Pass a stable reference.
|
|
103
|
+
*/
|
|
101
104
|
fields: readonly SmartFilterField[];
|
|
102
|
-
/**
|
|
105
|
+
/**
|
|
106
|
+
* Value per field key, controlled: `{ include, exclude }` for an options field, `{ from, to }` (numbers or dates, `null` — open) for a range field.
|
|
107
|
+
*/
|
|
103
108
|
value?: SmartFilterValue;
|
|
109
|
+
/**
|
|
110
|
+
* Initial selection, uncontrolled.
|
|
111
|
+
*/
|
|
104
112
|
defaultValue?: SmartFilterValue;
|
|
113
|
+
/**
|
|
114
|
+
* The whole next value; keys of fields this root does not show are kept.
|
|
115
|
+
*/
|
|
105
116
|
onValueChange?: (value: SmartFilterValue) => void;
|
|
106
|
-
/**
|
|
117
|
+
/**
|
|
118
|
+
* Search text, controlled.
|
|
119
|
+
*/
|
|
107
120
|
search?: string;
|
|
121
|
+
/**
|
|
122
|
+
* Initial search text, uncontrolled.
|
|
123
|
+
*/
|
|
108
124
|
defaultSearch?: string;
|
|
125
|
+
/**
|
|
126
|
+
* Every keystroke; debounce in the owner when it asks a server.
|
|
127
|
+
*/
|
|
109
128
|
onSearchChange?: (search: string) => void;
|
|
129
|
+
/**
|
|
130
|
+
* Tier of the filter button, the search, the tags and the panel. Without it the tier of its host, else `m`.
|
|
131
|
+
*/
|
|
110
132
|
size?: ControlSize;
|
|
111
|
-
/**
|
|
133
|
+
/**
|
|
134
|
+
* Values of one field shown before «Ещё N» (not while searching).
|
|
135
|
+
*/
|
|
112
136
|
collapsedLimit?: number;
|
|
137
|
+
/**
|
|
138
|
+
* Built-in strings, see Labels.
|
|
139
|
+
*/
|
|
113
140
|
labels?: Partial<SmartFilterLabels>;
|
|
114
|
-
|
|
115
|
-
|
|
141
|
+
/**
|
|
142
|
+
* `SmartFilter.Toolbar` and `SmartFilter.Chips`, anywhere inside.
|
|
143
|
+
*/
|
|
116
144
|
children: React.ReactNode;
|
|
117
145
|
ref?: React.Ref<HTMLDivElement>;
|
|
118
146
|
};
|
|
119
|
-
declare function SmartFilterRoot({ fields, value, defaultValue, onValueChange, search, defaultSearch, onSearchChange, size, collapsedLimit, labels, className, children, ref, }: SmartFilterRootProps):
|
|
147
|
+
declare function SmartFilterRoot({ fields, value, defaultValue, onValueChange, search, defaultSearch, onSearchChange, size: sizeProp, collapsedLimit, labels, className, children, ref, ...rest }: SmartFilterRootProps): React.ReactElement<unknown, string | React.JSXElementConstructor<any>>;
|
|
120
148
|
declare namespace SmartFilterRoot {
|
|
121
149
|
var displayName: string;
|
|
122
150
|
}
|
|
123
151
|
export type SmartFilterToolbarProps = Omit<React.HTMLAttributes<HTMLDivElement>, "children"> & {
|
|
124
152
|
/**
|
|
125
|
-
* The search input
|
|
126
|
-
* text search lives elsewhere or does not exist.
|
|
153
|
+
* The search input. `false` — the filter button alone; the panel opens at its own width (24rem at most) and lists every field.
|
|
127
154
|
*/
|
|
128
155
|
searchable?: boolean;
|
|
129
156
|
ref?: React.Ref<HTMLDivElement>;
|
|
@@ -136,7 +163,7 @@ export type SmartFilterChipsProps = Omit<React.HTMLAttributes<HTMLDivElement>, "
|
|
|
136
163
|
ref?: React.Ref<HTMLDivElement>;
|
|
137
164
|
};
|
|
138
165
|
/** The applied filters as removable tags, with "add" and "clear all". Renders nothing without filters. */
|
|
139
|
-
declare function SmartFilterChips({ className, ...rest }: SmartFilterChipsProps): import("react/jsx-runtime").JSX.Element | null;
|
|
166
|
+
declare function SmartFilterChips({ className, ref, ...rest }: SmartFilterChipsProps): import("react/jsx-runtime").JSX.Element | null;
|
|
140
167
|
declare namespace SmartFilterChips {
|
|
141
168
|
var displayName: string;
|
|
142
169
|
}
|
|
@@ -38,55 +38,78 @@ export type SparklineSummary = "latest" | "sum" | "average";
|
|
|
38
38
|
* the height of an `xs` control, for a table cell or a list row.
|
|
39
39
|
*/
|
|
40
40
|
export type SparklineLayout = "default" | "compact";
|
|
41
|
+
export declare const SPARKLINE_LABELS: SparklineLabels;
|
|
41
42
|
type SparklineRest = {
|
|
42
|
-
/**
|
|
43
|
+
/**
|
|
44
|
+
* What the headline shows at rest: `latest` — the latest point (or `highlight`), for a level (MRR, conversion); `sum` — the period total, for a flow (revenue per day); `average` — the period mean.
|
|
45
|
+
*/
|
|
43
46
|
summary?: "latest";
|
|
44
47
|
/**
|
|
45
|
-
* Index of the point at rest (the current month): the headline
|
|
46
|
-
* and `bars` draw the other bars quieter. Default: the latest point with a value.
|
|
48
|
+
* Index of the point at rest with `summary="latest"` (the current month): the headline returns to it; `bars` draw the other bars quieter. Not allowed with `sum` / `average`.
|
|
47
49
|
*/
|
|
48
50
|
highlight?: number;
|
|
49
51
|
} | {
|
|
52
|
+
/**
|
|
53
|
+
* What the headline shows at rest: `latest` — the latest point (or `highlight`), for a level (MRR, conversion); `sum` — the period total, for a flow (revenue per day); `average` — the period mean.
|
|
54
|
+
*/
|
|
50
55
|
summary: "sum" | "average";
|
|
51
|
-
/**
|
|
56
|
+
/**
|
|
57
|
+
* Index of the point at rest with `summary="latest"` (the current month): the headline returns to it; `bars` draw the other bars quieter. Not allowed with `sum` / `average`.
|
|
58
|
+
*/
|
|
52
59
|
highlight?: never;
|
|
53
60
|
};
|
|
54
61
|
export type SparklineProps = Omit<React.HTMLAttributes<HTMLDivElement>, "children"> & SparklineRest & {
|
|
55
|
-
/**
|
|
62
|
+
/**
|
|
63
|
+
* Points oldest first, `{ label, value }`; `label` names the point («8 окт»), `value: null` is a point with no data — the line breaks, the bar is absent. A new array cross-fades the chart in.
|
|
64
|
+
*/
|
|
56
65
|
data: SparklinePoint[];
|
|
57
66
|
/**
|
|
58
|
-
* Visible title above the value and the accessible name of the chart; with `layout="compact"`
|
|
59
|
-
* only the accessible name.
|
|
67
|
+
* Visible title above the value and the accessible name of the chart; with `layout="compact"` only the accessible name.
|
|
60
68
|
*/
|
|
61
69
|
label: string;
|
|
62
|
-
/**
|
|
70
|
+
/**
|
|
71
|
+
* `area` — a line over an accent gradient that fades to the bottom; `line` — the line alone, for many trends side by side; `bars` — a bar per point standing on a zero line: up when positive, down (danger) when negative.
|
|
72
|
+
*/
|
|
63
73
|
variant?: SparklineVariant;
|
|
64
|
-
/**
|
|
74
|
+
/**
|
|
75
|
+
* Shape of the line (`area`, `line`): `smooth` — a monotone cubic through every point that never overshoots a peak or a trough; `linear` — straight segments; `step` — a level per point, changing halfway between points.
|
|
76
|
+
*/
|
|
65
77
|
curve?: SparklineCurve;
|
|
66
|
-
/**
|
|
78
|
+
/**
|
|
79
|
+
* `default` — the headline over an 80 px plot; `compact` — the plot alone at an `xs` control height with the dot at rest, for a DataTable cell; the scrubbed point shows in the tooltip and `aria-valuetext`.
|
|
80
|
+
*/
|
|
67
81
|
layout?: SparklineLayout;
|
|
68
|
-
/**
|
|
82
|
+
/**
|
|
83
|
+
* What the change badge of a shown point compares it with: `previous` — the point before it; `first` — the first point with a value (the change over the period); `none` — no badge.
|
|
84
|
+
*/
|
|
69
85
|
change?: SparklineChange;
|
|
70
86
|
/**
|
|
71
|
-
* The same summary for the previous period («прошлые 30 дней»): the
|
|
72
|
-
* the headline with it. Without it a `sum` / `average` headline shows no change at rest.
|
|
87
|
+
* The same summary for the previous period («прошлые 30 дней»): the badge at rest compares the headline with it. Without it a `sum` / `average` headline shows no change at rest.
|
|
73
88
|
*/
|
|
74
89
|
compareTo?: number;
|
|
75
90
|
/**
|
|
76
|
-
* The value axis
|
|
77
|
-
* or a meaningful floor. Data outside widens the scale, never gets cut.
|
|
91
|
+
* The value axis reaches down to at least this value: a floor of zero, or one scale for several sparklines (a table column). Data below widens the scale, never gets cut.
|
|
78
92
|
*/
|
|
79
93
|
min?: number;
|
|
94
|
+
/**
|
|
95
|
+
* The value axis reaches up to at least this value; data above widens the scale.
|
|
96
|
+
*/
|
|
80
97
|
max?: number;
|
|
81
|
-
/**
|
|
98
|
+
/**
|
|
99
|
+
* A dashed horizontal line at this value — a plan, a target, an average; the scale holds it and the chart is described by `labels.reference`.
|
|
100
|
+
*/
|
|
82
101
|
reference?: number;
|
|
83
102
|
/**
|
|
84
|
-
* The series is on its way: Skeletons of the
|
|
85
|
-
* the data. The title stays; the root is `aria-busy`.
|
|
103
|
+
* The series is on its way: Skeletons of the date, the value and the plot that cross-fade into the data; the title stays, the root is `aria-busy` and the chart is not focusable yet.
|
|
86
104
|
*/
|
|
87
105
|
loading?: boolean;
|
|
88
|
-
/**
|
|
106
|
+
/**
|
|
107
|
+
* Display of a value in the headline, the tooltip, the reference description and the spoken point («312 400 ₽»).
|
|
108
|
+
*/
|
|
89
109
|
formatValue?: (value: number) => string;
|
|
110
|
+
/**
|
|
111
|
+
* Built-in strings, see Labels.
|
|
112
|
+
*/
|
|
90
113
|
labels?: Partial<SparklineLabels>;
|
|
91
114
|
ref?: React.Ref<HTMLDivElement>;
|
|
92
115
|
};
|
|
@@ -1,23 +1,29 @@
|
|
|
1
|
-
import * as React from "react";
|
|
1
|
+
import type * as React from "react";
|
|
2
2
|
import type { ControlSize, TextTone } from "../../internal/states";
|
|
3
3
|
export type SpinnerLabels = {
|
|
4
4
|
/** Text read by screen readers while the spinner is shown. */
|
|
5
5
|
loading: string;
|
|
6
6
|
};
|
|
7
|
+
export declare const SPINNER_LABELS: SpinnerLabels;
|
|
7
8
|
export type SpinnerProps = Omit<React.HTMLAttributes<HTMLSpanElement>, "children"> & {
|
|
8
9
|
/**
|
|
9
|
-
* Explicit size on the icon scale
|
|
10
|
-
* follows its host like an `Icon`: the host's icon size, else the nearest control tier, else 16.
|
|
10
|
+
* Explicit size on the icon scale: 14 · 16 · 20 · 24 · 32. Without it the spinner follows its host like `Icon`: the host's `--prime-icon-size`, else the nearest control tier, else 16.
|
|
11
11
|
*/
|
|
12
12
|
size?: ControlSize;
|
|
13
|
-
/**
|
|
13
|
+
/**
|
|
14
|
+
* Ring color; `default` inherits `currentColor`.
|
|
15
|
+
*/
|
|
14
16
|
tone?: TextTone;
|
|
17
|
+
/**
|
|
18
|
+
* Built-in strings, see Labels.
|
|
19
|
+
*/
|
|
15
20
|
labels?: Partial<SpinnerLabels>;
|
|
16
21
|
ref?: React.Ref<HTMLSpanElement>;
|
|
17
22
|
};
|
|
18
23
|
/**
|
|
19
24
|
* Indeterminate loading indicator: the kit ring (`internal/ring`) with the share unknown — a quarter
|
|
20
25
|
* arc turning on a faint track, at the line weight. A `role="status"` region with `labels.loading`
|
|
21
|
-
* for screen readers; pass `aria-hidden` when the host already says it is busy.
|
|
26
|
+
* for screen readers; pass `aria-hidden` when the host already says it is busy. It fades itself in
|
|
27
|
+
* (`enterMotion.enterFade`), so a host that shows it conditionally needs no motion of its own.
|
|
22
28
|
*/
|
|
23
29
|
export declare function Spinner({ size: sizeProp, tone, labels: labelsProp, className, ...rest }: SpinnerProps): import("react/jsx-runtime").JSX.Element;
|
|
@@ -1,25 +1,54 @@
|
|
|
1
1
|
import * as React from "react";
|
|
2
2
|
import type { ControlSize } from "../../internal/states";
|
|
3
|
-
/** Item state: derived from the Root `value` (before → `completed`, equal → `
|
|
4
|
-
export type StepperItemStatus = "pending" | "
|
|
3
|
+
/** Item state: derived from the Root `value` (before → `completed`, equal → `current`, after → `pending`) unless set on the item. */
|
|
4
|
+
export type StepperItemStatus = "pending" | "current" | "completed" | "danger";
|
|
5
|
+
export type StepperLabels = {
|
|
6
|
+
/** Spoken after the name of a completed step (the check is only seen). */
|
|
7
|
+
completed: string;
|
|
8
|
+
/** Spoken after the name of a step that needs attention (the colour and the glyph are only seen). */
|
|
9
|
+
danger: string;
|
|
10
|
+
};
|
|
11
|
+
export declare const STEPPER_LABELS: StepperLabels;
|
|
12
|
+
type StepperOrientation = "horizontal" | "vertical";
|
|
5
13
|
export type StepperRootProps = Omit<React.OlHTMLAttributes<HTMLOListElement>, "defaultValue" | "onChange"> & {
|
|
6
|
-
/**
|
|
7
|
-
|
|
8
|
-
|
|
14
|
+
/**
|
|
15
|
+
* Column of rows, or one row with chevrons (steps shrink and wrap their titles) that stacks below a 480px container.
|
|
16
|
+
*/
|
|
17
|
+
orientation?: StepperOrientation;
|
|
18
|
+
/**
|
|
19
|
+
* Current step, 0-based (controlled).
|
|
20
|
+
*/
|
|
9
21
|
value?: number;
|
|
10
|
-
/**
|
|
22
|
+
/**
|
|
23
|
+
* Initial step (uncontrolled).
|
|
24
|
+
*/
|
|
11
25
|
defaultValue?: number;
|
|
12
|
-
/**
|
|
26
|
+
/**
|
|
27
|
+
* Called with the index of the clicked item.
|
|
28
|
+
*/
|
|
13
29
|
onValueChange?: (index: number) => void;
|
|
30
|
+
/**
|
|
31
|
+
* Every vertical row ends with a chevron: each step opens a page or panel. Horizontal steps already have their chevrons.
|
|
32
|
+
*/
|
|
33
|
+
arrows?: boolean;
|
|
34
|
+
/**
|
|
35
|
+
* Indicator 20 · 24 · 28 · 32 · 36, title in the control text of the tier. Without it the tier of its host, else `m`.
|
|
36
|
+
*/
|
|
14
37
|
size?: ControlSize;
|
|
38
|
+
/**
|
|
39
|
+
* Built-in strings, see Labels.
|
|
40
|
+
*/
|
|
41
|
+
labels?: Partial<StepperLabels>;
|
|
15
42
|
ref?: React.Ref<HTMLOListElement>;
|
|
16
43
|
};
|
|
17
|
-
declare function StepperRoot({ orientation, value: valueProp, defaultValue, onValueChange, size, children, className, ...rest }: StepperRootProps): import("react/jsx-runtime").JSX.Element;
|
|
44
|
+
declare function StepperRoot({ orientation, value: valueProp, defaultValue, onValueChange, arrows, size: sizeProp, labels: labelsProp, children, className, ...rest }: StepperRootProps): import("react/jsx-runtime").JSX.Element;
|
|
18
45
|
declare namespace StepperRoot {
|
|
19
46
|
var displayName: string;
|
|
20
47
|
}
|
|
21
48
|
export type StepperItemProps = Omit<React.ButtonHTMLAttributes<HTMLButtonElement>, "type"> & {
|
|
22
|
-
/**
|
|
49
|
+
/**
|
|
50
|
+
* Overrides the status derived from `value` (before → `completed`, equal → `current`, after → `pending`).
|
|
51
|
+
*/
|
|
23
52
|
status?: StepperItemStatus;
|
|
24
53
|
ref?: React.Ref<HTMLButtonElement>;
|
|
25
54
|
};
|
|
@@ -31,7 +60,9 @@ type SpanProps = React.HTMLAttributes<HTMLSpanElement> & {
|
|
|
31
60
|
ref?: React.Ref<HTMLSpanElement>;
|
|
32
61
|
};
|
|
33
62
|
export type StepperIndicatorProps = SpanProps & {
|
|
34
|
-
/**
|
|
63
|
+
/**
|
|
64
|
+
* Replaces the default content, e.g. `<Icon name="status.info" />`.
|
|
65
|
+
*/
|
|
35
66
|
children?: React.ReactNode;
|
|
36
67
|
};
|
|
37
68
|
declare function StepperIndicator({ children, className, ...rest }: StepperIndicatorProps): import("react/jsx-runtime").JSX.Element;
|
|
@@ -54,14 +85,6 @@ declare function StepperDescription({ className, ...rest }: StepperDescriptionPr
|
|
|
54
85
|
declare namespace StepperDescription {
|
|
55
86
|
var displayName: string;
|
|
56
87
|
}
|
|
57
|
-
export type StepperArrowProps = Omit<React.SVGAttributes<SVGSVGElement>, "children" | "color"> & {
|
|
58
|
-
ref?: React.Ref<SVGSVGElement>;
|
|
59
|
-
};
|
|
60
|
-
/** Trailing chevron for vertical items that open a page or panel. */
|
|
61
|
-
declare function StepperArrow({ className, ...rest }: StepperArrowProps): import("react/jsx-runtime").JSX.Element;
|
|
62
|
-
declare namespace StepperArrow {
|
|
63
|
-
var displayName: string;
|
|
64
|
-
}
|
|
65
88
|
export declare const Stepper: {
|
|
66
89
|
Root: typeof StepperRoot;
|
|
67
90
|
Item: typeof StepperItem;
|
|
@@ -69,6 +92,5 @@ export declare const Stepper: {
|
|
|
69
92
|
Content: typeof StepperContent;
|
|
70
93
|
Title: typeof StepperTitle;
|
|
71
94
|
Description: typeof StepperDescription;
|
|
72
|
-
Arrow: typeof StepperArrow;
|
|
73
95
|
};
|
|
74
96
|
export {};
|