@tenerife.music/ui 1.0.8 → 1.0.13
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 +12 -8
- package/dist/{tokens/colors.d.ts → colors-CVA7_16U.d.cts} +21 -19
- package/dist/colors-CVA7_16U.d.ts +289 -0
- package/dist/index-BgXvioll.d.cts +6845 -0
- package/dist/index-Bv4wWj9I.d.ts +6845 -0
- package/dist/index.cjs +16385 -2
- package/dist/index.d.cts +4020 -0
- package/dist/index.d.ts +4020 -39
- package/dist/index.mjs +14502 -6425
- package/dist/preset.cjs +1264 -2
- package/dist/preset.d.cts +21 -0
- package/dist/preset.d.ts +3 -1
- package/dist/preset.mjs +1165 -95
- package/dist/styles.cjs +2 -2
- package/dist/styles.css +87 -1
- package/dist/styles.d.cts +2 -0
- package/dist/styles.d.ts +2 -0
- package/dist/styles.mjs +1 -1
- package/dist/theme/index.cjs +2634 -2
- package/dist/theme/index.d.cts +453 -0
- package/dist/theme/index.d.ts +453 -8
- package/dist/theme/index.mjs +1601 -576
- package/dist/tokens/index.cjs +6203 -5
- package/dist/tokens/index.d.cts +2 -0
- package/dist/tokens/index.d.ts +2 -9
- package/dist/tokens/index.mjs +2601 -155
- package/package.json +10 -9
- package/dist/animation/index.d.ts +0 -8
- package/dist/animation/presets.d.ts +0 -301
- package/dist/animation/tas.d.ts +0 -24
- package/dist/animation/types.d.ts +0 -67
- package/dist/animation/useInView.d.ts +0 -36
- package/dist/animation/utils.d.ts +0 -6
- package/dist/brand-C5R2semX.js +0 -45
- package/dist/brand-DQb18Frh.cjs +0 -2
- package/dist/components/SectionBuilder.d.ts +0 -36
- package/dist/components/SectionBuilder.presets.d.ts +0 -228
- package/dist/components/SectionBuilder.types.d.ts +0 -326
- package/dist/components/admin/Dashboard.d.ts +0 -8
- package/dist/components/admin/UserManagement.d.ts +0 -8
- package/dist/components/auth/LoginForm.d.ts +0 -11
- package/dist/components/auth/ProfileCard.d.ts +0 -9
- package/dist/components/auth/RegisterForm.d.ts +0 -13
- package/dist/components/cards/ArtistCard/ArtistCard.d.ts +0 -22
- package/dist/components/cards/ArtistCard/ArtistCard.types.d.ts +0 -46
- package/dist/components/cards/ArtistCard/ArtistCard.variants.d.ts +0 -83
- package/dist/components/cards/ArtistCard/index.d.ts +0 -8
- package/dist/components/cards/CardBase/CardBase.d.ts +0 -45
- package/dist/components/cards/CardBase/CardBase.types.d.ts +0 -70
- package/dist/components/cards/CardBase/CardBase.variants.d.ts +0 -38
- package/dist/components/cards/CardBase/index.d.ts +0 -8
- package/dist/components/cards/CategoryCard/CategoryCard.d.ts +0 -18
- package/dist/components/cards/CategoryCard/CategoryCard.types.d.ts +0 -38
- package/dist/components/cards/CategoryCard/CategoryCard.variants.d.ts +0 -21
- package/dist/components/cards/CategoryCard/index.d.ts +0 -7
- package/dist/components/cards/EventCard/EventCard.d.ts +0 -19
- package/dist/components/cards/EventCard/EventCard.types.d.ts +0 -47
- package/dist/components/cards/EventCard/EventCard.variants.d.ts +0 -70
- package/dist/components/cards/EventCard/index.d.ts +0 -7
- package/dist/components/cards/PromoCard/PromoCard.d.ts +0 -20
- package/dist/components/cards/PromoCard/PromoCard.types.d.ts +0 -42
- package/dist/components/cards/PromoCard/PromoCard.variants.d.ts +0 -35
- package/dist/components/cards/PromoCard/index.d.ts +0 -7
- package/dist/components/cards/TicketCard/TicketCard.d.ts +0 -19
- package/dist/components/cards/TicketCard/TicketCard.types.d.ts +0 -55
- package/dist/components/cards/TicketCard/TicketCard.variants.d.ts +0 -71
- package/dist/components/cards/TicketCard/index.d.ts +0 -7
- package/dist/components/cards/VenueCard/VenueCard.d.ts +0 -21
- package/dist/components/cards/VenueCard/VenueCard.types.d.ts +0 -46
- package/dist/components/cards/VenueCard/VenueCard.variants.d.ts +0 -60
- package/dist/components/cards/VenueCard/index.d.ts +0 -8
- package/dist/components/cards/index.d.ts +0 -19
- package/dist/components/checkbox/Checkbox.d.ts +0 -22
- package/dist/components/checkbox/Checkbox.types.d.ts +0 -68
- package/dist/components/checkbox/checkbox-variants.d.ts +0 -13
- package/dist/components/checkbox/index.d.ts +0 -3
- package/dist/components/containers/Card.d.ts +0 -75
- package/dist/components/containers/Section.d.ts +0 -31
- package/dist/components/containers/Surface.d.ts +0 -28
- package/dist/components/containers/index.d.ts +0 -9
- package/dist/components/controls/LanguageSelector.d.ts +0 -17
- package/dist/components/data/List.d.ts +0 -12
- package/dist/components/data/Table.d.ts +0 -14
- package/dist/components/data/Timeline.d.ts +0 -13
- package/dist/components/data/data-list/DataList.d.ts +0 -29
- package/dist/components/data/data-list/DataList.types.d.ts +0 -43
- package/dist/components/data/data-list/DataListItem.d.ts +0 -20
- package/dist/components/data/data-list/DataListLabel.d.ts +0 -19
- package/dist/components/data/data-list/DataListValue.d.ts +0 -18
- package/dist/components/data/data-list/index.d.ts +0 -10
- package/dist/components/data/empty-state/EmptyState.d.ts +0 -31
- package/dist/components/data/empty-state/EmptyState.types.d.ts +0 -51
- package/dist/components/data/empty-state/EmptyStateAction.d.ts +0 -17
- package/dist/components/data/empty-state/EmptyStateDescription.d.ts +0 -17
- package/dist/components/data/empty-state/EmptyStateIcon.d.ts +0 -22
- package/dist/components/data/empty-state/EmptyStateTitle.d.ts +0 -17
- package/dist/components/data/empty-state/index.d.ts +0 -10
- package/dist/components/data/index.d.ts +0 -9
- package/dist/components/data/skeleton/Skeleton.d.ts +0 -24
- package/dist/components/data/skeleton/Skeleton.types.d.ts +0 -12
- package/dist/components/data/skeleton/index.d.ts +0 -6
- package/dist/components/data/table/Table.d.ts +0 -33
- package/dist/components/data/table/Table.types.d.ts +0 -264
- package/dist/components/data/table/TableBody.d.ts +0 -13
- package/dist/components/data/table/TableCell.d.ts +0 -13
- package/dist/components/data/table/TableEmpty.d.ts +0 -13
- package/dist/components/data/table/TableExpandableContent.d.ts +0 -14
- package/dist/components/data/table/TableHead.d.ts +0 -13
- package/dist/components/data/table/TableHeader.d.ts +0 -13
- package/dist/components/data/table/TableLoadingState.d.ts +0 -13
- package/dist/components/data/table/TableRow.d.ts +0 -13
- package/dist/components/data/table/TableSortIcon.d.ts +0 -14
- package/dist/components/data/table/index.d.ts +0 -17
- package/dist/components/drawer/Drawer.d.ts +0 -41
- package/dist/components/drawer/Drawer.types.d.ts +0 -75
- package/dist/components/drawer/drawer-variants.d.ts +0 -17
- package/dist/components/drawer/index.d.ts +0 -8
- package/dist/components/dropdown/Dropdown.d.ts +0 -38
- package/dist/components/dropdown/Dropdown.types.d.ts +0 -82
- package/dist/components/dropdown/dropdown-variants.d.ts +0 -33
- package/dist/components/feedback/ConsentBanner.d.ts +0 -8
- package/dist/components/feedback/Progress.d.ts +0 -8
- package/dist/components/feedback/Skeleton.d.ts +0 -6
- package/dist/components/filters/DateRangePicker.d.ts +0 -21
- package/dist/components/filters/FilterBar.d.ts +0 -55
- package/dist/components/filters/FilterSelect.d.ts +0 -23
- package/dist/components/filters/PriceRangeSlider.d.ts +0 -27
- package/dist/components/filters/SearchFilters.d.ts +0 -32
- package/dist/components/filters/SearchInput.d.ts +0 -16
- package/dist/components/filters/types.d.ts +0 -48
- package/dist/components/icon/Icon.d.ts +0 -32
- package/dist/components/icon/Icon.types.d.ts +0 -7
- package/dist/components/icon/index.d.ts +0 -4
- package/dist/components/icons/TrendingIcon.d.ts +0 -6
- package/dist/components/image/Image.d.ts +0 -48
- package/dist/components/input/Input.d.ts +0 -20
- package/dist/components/input/Input.types.d.ts +0 -38
- package/dist/components/input/index.d.ts +0 -3
- package/dist/components/input/input-variants.d.ts +0 -14
- package/dist/components/input/legacy/input.d.ts +0 -11
- package/dist/components/layout/Box.d.ts +0 -111
- package/dist/components/layout/Column.d.ts +0 -6
- package/dist/components/layout/Container.d.ts +0 -31
- package/dist/components/layout/Flex.d.ts +0 -50
- package/dist/components/layout/Footer.d.ts +0 -9
- package/dist/components/layout/Grid.d.ts +0 -60
- package/dist/components/layout/ModeHero.d.ts +0 -10
- package/dist/components/layout/Navbar.d.ts +0 -9
- package/dist/components/layout/Row.d.ts +0 -28
- package/dist/components/layout/Section.d.ts +0 -10
- package/dist/components/layout/Stack.d.ts +0 -38
- package/dist/components/layout/Surface.d.ts +0 -21
- package/dist/components/layout/index.d.ts +0 -22
- package/dist/components/layout/layout.types.d.ts +0 -107
- package/dist/components/menus/DropdownMenu.d.ts +0 -27
- package/dist/components/menus/NavigationMenu.d.ts +0 -12
- package/dist/components/menus/Tabs.d.ts +0 -7
- package/dist/components/menus/context-menu/ContextMenuContent.d.ts +0 -22
- package/dist/components/menus/context-menu/ContextMenuGroup.d.ts +0 -14
- package/dist/components/menus/context-menu/ContextMenuItem.d.ts +0 -14
- package/dist/components/menus/context-menu/ContextMenuLabel.d.ts +0 -14
- package/dist/components/menus/context-menu/ContextMenuRoot.d.ts +0 -47
- package/dist/components/menus/context-menu/ContextMenuSeparator.d.ts +0 -14
- package/dist/components/menus/context-menu/ContextMenuTrigger.d.ts +0 -16
- package/dist/components/menus/context-menu/index.d.ts +0 -12
- package/dist/components/menus/dropdown/DropdownMenuCheckItem.d.ts +0 -18
- package/dist/components/menus/dropdown/DropdownMenuContent.d.ts +0 -15
- package/dist/components/menus/dropdown/DropdownMenuGroup.d.ts +0 -12
- package/dist/components/menus/dropdown/DropdownMenuItem.d.ts +0 -30
- package/dist/components/menus/dropdown/DropdownMenuLabel.d.ts +0 -17
- package/dist/components/menus/dropdown/DropdownMenuRadioGroup.d.ts +0 -24
- package/dist/components/menus/dropdown/DropdownMenuRadioItem.d.ts +0 -18
- package/dist/components/menus/dropdown/DropdownMenuRoot.d.ts +0 -33
- package/dist/components/menus/dropdown/DropdownMenuSeparator.d.ts +0 -13
- package/dist/components/menus/dropdown/DropdownMenuSub.d.ts +0 -10
- package/dist/components/menus/dropdown/DropdownMenuSubContent.d.ts +0 -13
- package/dist/components/menus/dropdown/DropdownMenuSubTrigger.d.ts +0 -13
- package/dist/components/menus/dropdown/DropdownMenuTrigger.d.ts +0 -14
- package/dist/components/menus/dropdown/index.d.ts +0 -18
- package/dist/components/menus/hover-card/HoverCardContent.d.ts +0 -14
- package/dist/components/menus/hover-card/HoverCardRoot.d.ts +0 -20
- package/dist/components/menus/hover-card/HoverCardTrigger.d.ts +0 -13
- package/dist/components/menus/hover-card/index.d.ts +0 -8
- package/dist/components/menus/index.d.ts +0 -9
- package/dist/components/menus/popover/PopoverArrow.d.ts +0 -17
- package/dist/components/menus/popover/PopoverContent.d.ts +0 -24
- package/dist/components/menus/popover/PopoverRoot.d.ts +0 -43
- package/dist/components/menus/popover/PopoverTrigger.d.ts +0 -17
- package/dist/components/menus/popover/index.d.ts +0 -9
- package/dist/components/modal/Modal.d.ts +0 -70
- package/dist/components/modal/modal-variants.d.ts +0 -26
- package/dist/components/modals/ConfirmDialog.d.ts +0 -27
- package/dist/components/modals/CustomDialog.d.ts +0 -10
- package/dist/components/modals/Modal.d.ts +0 -19
- package/dist/components/modals/ModalProvider.d.ts +0 -16
- package/dist/components/modals/SimpleModal.d.ts +0 -11
- package/dist/components/navigation/Breadcrumbs.d.ts +0 -12
- package/dist/components/navigation/Pagination.d.ts +0 -10
- package/dist/components/navigation/breadcrumbs/Breadcrumbs.d.ts +0 -52
- package/dist/components/navigation/breadcrumbs/index.d.ts +0 -5
- package/dist/components/navigation/index.d.ts +0 -10
- package/dist/components/navigation/pagination/Pagination.d.ts +0 -60
- package/dist/components/navigation/pagination/index.d.ts +0 -5
- package/dist/components/navigation/segmented-control/SegmentedControl.d.ts +0 -43
- package/dist/components/navigation/segmented-control/index.d.ts +0 -5
- package/dist/components/navigation/stepper/Stepper.d.ts +0 -129
- package/dist/components/navigation/stepper/index.d.ts +0 -5
- package/dist/components/navigation/tabs/Tabs.d.ts +0 -73
- package/dist/components/navigation/tabs/index.d.ts +0 -5
- package/dist/components/notifications/NotificationCenter.DismissAll.d.ts +0 -21
- package/dist/components/notifications/NotificationCenter.GroupHeader.d.ts +0 -23
- package/dist/components/notifications/NotificationCenter.Item.d.ts +0 -24
- package/dist/components/notifications/NotificationCenter.List.d.ts +0 -22
- package/dist/components/notifications/NotificationCenter.Panel.d.ts +0 -32
- package/dist/components/notifications/NotificationCenter.Provider.d.ts +0 -31
- package/dist/components/notifications/NotificationCenter.Trigger.d.ts +0 -15
- package/dist/components/notifications/NotificationCenter.d.ts +0 -27
- package/dist/components/notifications/NotificationCenter.types.d.ts +0 -89
- package/dist/components/notifications/index.d.ts +0 -23
- package/dist/components/notifications/useNotificationCenter.d.ts +0 -47
- package/dist/components/overlays/Backdrop.d.ts +0 -24
- package/dist/components/overlays/Dialog.d.ts +0 -66
- package/dist/components/overlays/Modal.d.ts +0 -60
- package/dist/components/overlays/OverlayPortal.d.ts +0 -22
- package/dist/components/overlays/Popover.d.ts +0 -30
- package/dist/components/overlays/Portal.d.ts +0 -29
- package/dist/components/overlays/Toast.d.ts +0 -36
- package/dist/components/overlays/ToastProvider.d.ts +0 -58
- package/dist/components/overlays/ToastViewport.d.ts +0 -27
- package/dist/components/overlays/Tooltip.d.ts +0 -28
- package/dist/components/overlays/index.d.ts +0 -13
- package/dist/components/overlays/utils/FocusLock.d.ts +0 -30
- package/dist/components/overlays/utils/ScrollLock.d.ts +0 -11
- package/dist/components/overlays/utils/positioning.d.ts +0 -68
- package/dist/components/primitives/Badge.d.ts +0 -9
- package/dist/components/primitives/Button.d.ts +0 -1
- package/dist/components/primitives/Card.d.ts +0 -1
- package/dist/components/primitives/Divider.d.ts +0 -7
- package/dist/components/primitives/Input.d.ts +0 -4
- package/dist/components/primitives/Label.d.ts +0 -1
- package/dist/components/primitives/Link.d.ts +0 -13
- package/dist/components/primitives/ThemeSwitch.d.ts +0 -9
- package/dist/components/radio/Radio.d.ts +0 -23
- package/dist/components/radio/Radio.types.d.ts +0 -63
- package/dist/components/radio/RadioGroup.d.ts +0 -20
- package/dist/components/radio/RadioGroup.types.d.ts +0 -61
- package/dist/components/radio/index.d.ts +0 -5
- package/dist/components/radio/radio-variants.d.ts +0 -13
- package/dist/components/search/SearchBar.d.ts +0 -10
- package/dist/components/sections/ArticlesSection.d.ts +0 -25
- package/dist/components/sections/CTASection.d.ts +0 -37
- package/dist/components/sections/FeatureSection.d.ts +0 -33
- package/dist/components/sections/HeroSection.d.ts +0 -27
- package/dist/components/sections/TrendingSection.d.ts +0 -28
- package/dist/components/select/Select.d.ts +0 -38
- package/dist/components/select/Select.types.d.ts +0 -107
- package/dist/components/select/index.d.ts +0 -5
- package/dist/components/select/legacy/select.d.ts +0 -11
- package/dist/components/select/select-variants.d.ts +0 -32
- package/dist/components/skeletons/EventCardSkeleton.d.ts +0 -6
- package/dist/components/skeletons/VenueCardSkeleton.d.ts +0 -6
- package/dist/components/switch/Switch.d.ts +0 -24
- package/dist/components/switch/Switch.types.d.ts +0 -53
- package/dist/components/switch/index.d.ts +0 -3
- package/dist/components/switch/switch-variants.d.ts +0 -34
- package/dist/components/textarea/Textarea.d.ts +0 -21
- package/dist/components/textarea/Textarea.types.d.ts +0 -40
- package/dist/components/textarea/index.d.ts +0 -3
- package/dist/components/textarea/legacy/textarea.d.ts +0 -11
- package/dist/components/textarea/textarea-variants.d.ts +0 -14
- package/dist/components/toasts/Toast.d.ts +0 -12
- package/dist/components/toasts/ToastProvider.d.ts +0 -26
- package/dist/components/ui/alert.d.ts +0 -9
- package/dist/components/ui/body.d.ts +0 -12
- package/dist/components/ui/button.d.ts +0 -13
- package/dist/components/ui/caption.d.ts +0 -11
- package/dist/components/ui/card.d.ts +0 -8
- package/dist/components/ui/code.d.ts +0 -11
- package/dist/components/ui/dialog.d.ts +0 -19
- package/dist/components/ui/display.d.ts +0 -12
- package/dist/components/ui/field.d.ts +0 -45
- package/dist/components/ui/heading.d.ts +0 -12
- package/dist/components/ui/label.d.ts +0 -12
- package/dist/components/ui/lead.d.ts +0 -11
- package/dist/components/ui/text.d.ts +0 -18
- package/dist/components/ui/toast.d.ts +0 -15
- package/dist/components/ui/toaster.d.ts +0 -1
- package/dist/components/ui/tooltip.d.ts +0 -7
- package/dist/dark-Cvoy1uFT.js +0 -30
- package/dist/dark-OOhiqt1q.cjs +0 -2
- package/dist/default-BKgH1D9-.js +0 -8
- package/dist/default-Ddg7Haf2.cjs +0 -2
- package/dist/hooks/use-toast.d.ts +0 -44
- package/dist/hooks/useDebounce.d.ts +0 -19
- package/dist/hooks/useModal.d.ts +0 -19
- package/dist/hooks/useToast.d.ts +0 -26
- package/dist/icons/IconArrowRight.d.ts +0 -6
- package/dist/icons/IconCalendar.d.ts +0 -6
- package/dist/icons/IconCheck.d.ts +0 -6
- package/dist/icons/IconChevronDown.d.ts +0 -6
- package/dist/icons/IconChevronRight.d.ts +0 -6
- package/dist/icons/IconClose.d.ts +0 -6
- package/dist/icons/IconError.d.ts +0 -6
- package/dist/icons/IconInfo.d.ts +0 -6
- package/dist/icons/IconLocation.d.ts +0 -6
- package/dist/icons/IconMenu.d.ts +0 -6
- package/dist/icons/IconSearch.d.ts +0 -6
- package/dist/icons/IconSuccess.d.ts +0 -6
- package/dist/icons/IconWarning.d.ts +0 -6
- package/dist/icons/icon.types.d.ts +0 -25
- package/dist/icons/index.d.ts +0 -34
- package/dist/lib/a11y.d.ts +0 -15
- package/dist/lib/responsive-props.d.ts +0 -63
- package/dist/lib/utils.d.ts +0 -8
- package/dist/motion-CzQhSEqk.js +0 -738
- package/dist/motion-DJx1TbXJ.cjs +0 -2
- package/dist/theme/ThemeProvider.d.ts +0 -55
- package/dist/theme/applyMode.d.ts +0 -42
- package/dist/theme/colors.d.ts +0 -6
- package/dist/theme/loader.d.ts +0 -63
- package/dist/theme/motion/gestures.d.ts +0 -76
- package/dist/theme/motion/useReducedMotion.d.ts +0 -11
- package/dist/theme/motion.d.ts +0 -127
- package/dist/theme/registry.d.ts +0 -70
- package/dist/theme/schema.d.ts +0 -124
- package/dist/theme/spacing.d.ts +0 -34
- package/dist/theme/typography.d.ts +0 -45
- package/dist/themes/brand.d.ts +0 -6
- package/dist/themes/brand_engine.d.ts +0 -108
- package/dist/themes/dark.d.ts +0 -6
- package/dist/themes/default.d.ts +0 -6
- package/dist/themes/index.d.ts +0 -24
- package/dist/themes/minimal.d.ts +0 -6
- package/dist/themes/neon.d.ts +0 -6
- package/dist/themes/types.d.ts +0 -278
- package/dist/tokens/components/alert.d.ts +0 -74
- package/dist/tokens/components/button.d.ts +0 -130
- package/dist/tokens/components/card.d.ts +0 -91
- package/dist/tokens/components/checkbox.d.ts +0 -161
- package/dist/tokens/components/data.d.ts +0 -227
- package/dist/tokens/components/domain.d.ts +0 -379
- package/dist/tokens/components/dropdown.d.ts +0 -146
- package/dist/tokens/components/icon.d.ts +0 -57
- package/dist/tokens/components/index.d.ts +0 -31
- package/dist/tokens/components/input.d.ts +0 -284
- package/dist/tokens/components/menu.d.ts +0 -114
- package/dist/tokens/components/motion.d.ts +0 -103
- package/dist/tokens/components/navigation.d.ts +0 -181
- package/dist/tokens/components/notifications.d.ts +0 -159
- package/dist/tokens/components/overlay.d.ts +0 -227
- package/dist/tokens/components/popover.d.ts +0 -84
- package/dist/tokens/components/radio.d.ts +0 -149
- package/dist/tokens/components/section.d.ts +0 -41
- package/dist/tokens/components/surface.d.ts +0 -94
- package/dist/tokens/components/switch.d.ts +0 -208
- package/dist/tokens/components/text.d.ts +0 -68
- package/dist/tokens/components/toast.d.ts +0 -146
- package/dist/tokens/components/tooltip.d.ts +0 -52
- package/dist/tokens/css-variables.d.ts +0 -251
- package/dist/tokens/motion/v2.d.ts +0 -342
- package/dist/tokens/motion.d.ts +0 -485
- package/dist/tokens/opacity.d.ts +0 -22
- package/dist/tokens/radius.d.ts +0 -161
- package/dist/tokens/shadows.d.ts +0 -230
- package/dist/tokens/spacing.d.ts +0 -238
- package/dist/tokens/theme.d.ts +0 -119
- package/dist/tokens/typography.d.ts +0 -460
- package/dist/typography-C-Nb4y0o.cjs +0 -2
- package/dist/typography-DHym9KAP.js +0 -1196
package/dist/index.d.ts
CHANGED
|
@@ -1,39 +1,4020 @@
|
|
|
1
|
-
|
|
2
|
-
export { ICON_TOKENS,
|
|
3
|
-
export {
|
|
4
|
-
|
|
5
|
-
|
|
6
|
-
|
|
7
|
-
|
|
8
|
-
|
|
9
|
-
|
|
10
|
-
|
|
11
|
-
|
|
12
|
-
|
|
13
|
-
|
|
14
|
-
|
|
15
|
-
|
|
16
|
-
|
|
17
|
-
|
|
18
|
-
|
|
19
|
-
|
|
20
|
-
|
|
21
|
-
|
|
22
|
-
|
|
23
|
-
|
|
24
|
-
|
|
25
|
-
|
|
26
|
-
|
|
27
|
-
|
|
28
|
-
|
|
29
|
-
|
|
30
|
-
|
|
31
|
-
|
|
32
|
-
|
|
33
|
-
|
|
34
|
-
|
|
35
|
-
|
|
36
|
-
|
|
37
|
-
|
|
38
|
-
|
|
39
|
-
|
|
1
|
+
import { R as ResponsiveSelectSize, S as SelectVariantToken, a as ResponsiveSelectWidth, b as ResponsiveSideOffset, c as ResponsiveAlignOffset, d as SelectSizeToken, e as SelectStateToken, f as SelectWidthToken, g as ResponsiveModalSize, h as ResponsiveModalWidth, i as ResponsiveModalHeight, j as ResponsiveSpace, k as RadiusToken, l as SurfaceToken, M as ModalFooterAlignToken, m as ResponsiveRadius$1, n as ShadowToken, o as ResponsiveColor$1, p as Responsive, q as ResponsiveContainerMaxWidth, r as ResponsiveFlexBasis, s as ResponsiveDelay, t as ResponsiveContextMenuSize, u as ResponsiveContextMenuWidth, C as ContextMenuItemToneToken, v as ResponsiveTabsSize, T as TabsVariantToken, w as TabsToneToken, x as ResponsiveAnimationPreset } from './index-Bv4wWj9I.js';
|
|
2
|
+
export { A as ALERT_TOKENS, y as AlertVariant, bB as Animation, z as BUTTON_TOKENS, c2 as BorderRadius, B as Breakpoint, D as ButtonFontSize, E as ButtonHeight, F as ButtonPaddingHorizontal, G as ButtonPaddingVertical, H as ButtonShadow, I as CARD_TOKENS, P as CHECKBOX_TOKENS, cz as CanonicalFontSize, cA as CanonicalFontWeight, cB as CanonicalLetterSpacing, cC as CanonicalLineHeight, cD as CanonicalTextColor, J as CardPadding, K as CardRadius, L as CardShadow, N as CardSize, O as CardSpacingVertical, Q as CheckboxSize, U as CheckboxState, V as CheckboxVariant, c8 as ColoredShadow, c3 as ComponentRadius, cm as ComponentSpacing, cn as ContainerSpacing, W as DATA_TOKENS, Z as DOMAIN_TOKENS, a7 as DROPDOWN_TOKENS, X as DataListLabelWidth, Y as DataListRowPadding, _ as DomainCardBadge, $ as DomainCardImage, a0 as DomainCardLayout, a1 as DomainCardMetadata, a2 as DomainCardMotion, a3 as DomainCardPriceCapacity, a4 as DomainCardSkeleton, a5 as DomainCardSkeletonContentWidth, a6 as DomainCardSurface, a8 as DropdownItemSize, a9 as DropdownMenuSize, aa as DropdownTriggerSize, ab as DropdownVariant, bC as Duration, bD as Easing, c9 as ElevationShadow, ac as EmptyStateIconSize, ca as FocusRing, cE as FontFamily, cF as FontSize, cG as FontWeight, cb as GlowEffect, co as GridSpacing, bt as ICON_TOKENS, ad as INPUT_TOKENS, bu as IconColor, bv as IconSize, bw as IconStroke, ae as InputFontSize, af as InputHeight, ag as InputPaddingHorizontal, ah as InputPaddingVertical, ai as InputRadius, aj as InputSize, bE as Keyframe, cH as LetterSpacing, cI as LineHeight, ak as MENU_TOKENS, ax as MOTION_TOKENS, al as MenuContentMinWidth, am as MenuContentPadding, an as MenuContentRadius, ao as MenuContentShadow, ap as MenuIndicatorOffset, aq as MenuIndicatorSize, ar as MenuItemGap, as as MenuItemHeight, at as MenuItemPadding, au as MenuItemRadius, av as MenuLabelPadding, aw as MenuSeparatorMargin, ay as MotionAnimation, az as MotionDuration, aA as MotionEasing, aB as MotionTransition, aC as MotionTransitionPreset, bF as MotionV2CombinedType, bG as MotionV2Duration, bH as MotionV2Easing, bI as MotionV2SlideDirection, bJ as MotionV2Transition, aD as NAVIGATION_TOKENS, aK as NOTIFICATION_TOKENS, aE as NavigationItemPadding, aF as NavigationListGap, aG as NavigationRadius, aH as NavigationShadow, aI as NavigationSize, aJ as NavigationState, aL as NotificationPanelWidth, aM as NotificationTokenVariant, aN as OVERLAY_TOKENS, aO as OverlayBackdropVariant, aP as OverlayModalSize, aQ as POPOVER_TOKENS, aR as PopoverArrowOffset, aS as PopoverArrowSize, aT as PopoverContentPadding, aU as PopoverContentRadius, aV as PopoverContentShadow, aW as PopoverContentWidth, aX as RADIO_TOKENS, aY as RadioSize, aZ as RadioState, a_ as RadioVariant, a$ as SECTION_TOKENS, b5 as SURFACE_TOKENS, ba as SWITCH_TOKENS, b0 as SectionGap, b1 as SectionPadding, cp as SectionSpacing, cq as SemanticSpacing, b2 as SkeletonAnimation, b3 as SkeletonBackground, b4 as SkeletonVariant, cr as Spacing, bK as Spring, cs as StackSpacing, b6 as SurfacePadding, b7 as SurfaceRadius, b8 as SurfaceShadow, b9 as SurfaceVariant, bb as SwitchSize, bc as SwitchState, bd as SwitchVariant, bj as TEXT_TOKENS, bo as TOAST_TOKENS, bq as TOOLTIP_TOKENS, be as TableCellPadding, bf as TableGap, bg as TableHeaderPadding, bh as TableRowHeight, bi as TableShadow, bk as TextFontSize, bl as TextFontWeight, bm as TextLetterSpacing, bn as TextLineHeight, cJ as TextStyle, bp as ToastVariant, br as TooltipContentRadius, bs as TooltipContentShadow, bL as Transition, cy as UI_COLORS, cc as accentColoredShadows, bx as allCSSVariables, by as allCSSVariablesCSS, bM as animations, c4 as borderRadius, c5 as componentRadius, cd as componentShadowMapping, bN as durations, bO as easings, ce as elevationShadows, cf as focusRings, cK as fontFamily, cL as fontSize, cM as fontSizeWithMd, cN as fontWeight, bz as generateCSSVariablesCSS, cg as glowEffects, bP as keyframes, ct as layoutSpacing, cO as letterSpacing, cP as lineHeight, bQ as motionCSSVariables, bS as motionV2CSSVariables, bR as motionV2Combined, bT as motionV2Durations, bU as motionV2Easings, bV as motionV2Fade, bW as motionV2Scale, bX as motionV2Slide, bY as motionV2TailwindConfig, bZ as motionV2Transitions, ch as primaryColoredShadows, c6 as radiusCSSVariables, b_ as reducedMotion, cu as semanticSpacing, ci as shadowBase, cj as shadowCSSVariables, ck as shadowOpacity, cv as spacing, cw as spacingCSSVariables, b$ as springs, c0 as tailwindMotionConfig, c7 as tailwindRadiusConfig, cl as tailwindShadowConfig, cx as tailwindSpacingConfig, cQ as tailwindTypographyConfig, cR as textStyles, bA as tokenSystemSummary, c1 as transitions, cS as typographyCSSVariables } from './index-Bv4wWj9I.js';
|
|
3
|
+
export { B as BaseColorTokens, b as ChartColors, C as ColorScale, c as ColorTokens, M as Mode, a as SemanticColors, S as SurfaceColors, T as TextColors, e as accentColors, f as baseColors, g as chartColors, h as colorCSSVariables, d as cssVariableColorTokens, p as primaryColors, s as secondaryColors, i as semanticColors, j as surfaceColors, t as tailwindThemeColors, k as textColors } from './colors-CVA7_16U.js';
|
|
4
|
+
import * as class_variance_authority_types from 'class-variance-authority/types';
|
|
5
|
+
import { VariantProps } from 'class-variance-authority';
|
|
6
|
+
import * as React$1 from 'react';
|
|
7
|
+
import { ReactNode } from 'react';
|
|
8
|
+
import * as SelectPrimitive from '@radix-ui/react-select';
|
|
9
|
+
import * as DialogPrimitive from '@radix-ui/react-dialog';
|
|
10
|
+
import * as LabelPrimitive from '@radix-ui/react-label';
|
|
11
|
+
import * as ToastPrimitives from '@radix-ui/react-toast';
|
|
12
|
+
import * as react_jsx_runtime from 'react/jsx-runtime';
|
|
13
|
+
import { Placement } from '@floating-ui/react-dom';
|
|
14
|
+
import * as ContextMenuPrimitive from '@radix-ui/react-context-menu';
|
|
15
|
+
import * as TabsPrimitive from '@radix-ui/react-tabs';
|
|
16
|
+
|
|
17
|
+
declare const buttonVariants: (props?: ({
|
|
18
|
+
variant?: "primary" | "secondary" | "accent" | "destructive" | "outline" | "ghost" | null | undefined;
|
|
19
|
+
size?: "sm" | "md" | "lg" | "icon" | null | undefined;
|
|
20
|
+
} & class_variance_authority_types.ClassProp) | undefined) => string;
|
|
21
|
+
interface ButtonProps extends React$1.ButtonHTMLAttributes<HTMLButtonElement>, VariantProps<typeof buttonVariants> {
|
|
22
|
+
asChild?: boolean;
|
|
23
|
+
leftIcon?: React$1.ReactNode;
|
|
24
|
+
rightIcon?: React$1.ReactNode;
|
|
25
|
+
}
|
|
26
|
+
declare const Button: React$1.ForwardRefExoticComponent<ButtonProps & React$1.RefAttributes<HTMLButtonElement>>;
|
|
27
|
+
|
|
28
|
+
declare const textVariants: (props?: ({
|
|
29
|
+
size?: "sm" | "md" | "lg" | "xl" | "xs" | null | undefined;
|
|
30
|
+
weight?: "normal" | "medium" | "semibold" | "bold" | null | undefined;
|
|
31
|
+
muted?: boolean | null | undefined;
|
|
32
|
+
variant?: "primary" | "secondary" | "muted" | "accent" | "destructive" | "outline" | "ghost" | "link" | null | undefined;
|
|
33
|
+
} & class_variance_authority_types.ClassProp) | undefined) => string;
|
|
34
|
+
interface TextProps extends React$1.HTMLAttributes<HTMLSpanElement>, VariantProps<typeof textVariants> {
|
|
35
|
+
/**
|
|
36
|
+
* @deprecated Use muted prop or semantic text colors instead
|
|
37
|
+
*/
|
|
38
|
+
variant?: "primary" | "secondary" | "accent" | "outline" | "ghost" | "link" | "destructive" | "muted";
|
|
39
|
+
}
|
|
40
|
+
declare const Text: React$1.ForwardRefExoticComponent<TextProps & React$1.RefAttributes<HTMLSpanElement>>;
|
|
41
|
+
type TextSize = VariantProps<typeof textVariants>["size"];
|
|
42
|
+
type TextWeight = VariantProps<typeof textVariants>["weight"];
|
|
43
|
+
|
|
44
|
+
declare const alertVariants: (props?: ({
|
|
45
|
+
variant?: "primary" | "secondary" | "accent" | "destructive" | "default" | "success" | "warning" | "danger" | "info" | null | undefined;
|
|
46
|
+
} & class_variance_authority_types.ClassProp) | undefined) => string;
|
|
47
|
+
interface AlertProps extends React$1.HTMLAttributes<HTMLDivElement>, VariantProps<typeof alertVariants> {
|
|
48
|
+
}
|
|
49
|
+
declare const Alert: React$1.ForwardRefExoticComponent<AlertProps & React$1.RefAttributes<HTMLDivElement>>;
|
|
50
|
+
|
|
51
|
+
declare const bodyVariants: (props?: ({
|
|
52
|
+
size?: "md" | "lg" | null | undefined;
|
|
53
|
+
weight?: "normal" | "medium" | "semibold" | "bold" | null | undefined;
|
|
54
|
+
muted?: boolean | null | undefined;
|
|
55
|
+
} & class_variance_authority_types.ClassProp) | undefined) => string;
|
|
56
|
+
interface BodyProps extends React$1.HTMLAttributes<HTMLParagraphElement>, VariantProps<typeof bodyVariants> {
|
|
57
|
+
as?: "p" | "span" | "div";
|
|
58
|
+
}
|
|
59
|
+
declare const Body: React$1.ForwardRefExoticComponent<BodyProps & React$1.RefAttributes<HTMLElement>>;
|
|
60
|
+
|
|
61
|
+
declare const captionVariants: (props?: ({
|
|
62
|
+
weight?: "normal" | "medium" | null | undefined;
|
|
63
|
+
muted?: boolean | null | undefined;
|
|
64
|
+
} & class_variance_authority_types.ClassProp) | undefined) => string;
|
|
65
|
+
interface CaptionProps extends React$1.HTMLAttributes<HTMLSpanElement>, VariantProps<typeof captionVariants> {
|
|
66
|
+
as?: "span" | "p" | "div";
|
|
67
|
+
}
|
|
68
|
+
declare const Caption: React$1.ForwardRefExoticComponent<CaptionProps & React$1.RefAttributes<HTMLElement>>;
|
|
69
|
+
|
|
70
|
+
declare const codeVariants: (props?: ({
|
|
71
|
+
variant?: "inline" | "block" | null | undefined;
|
|
72
|
+
muted?: boolean | null | undefined;
|
|
73
|
+
} & class_variance_authority_types.ClassProp) | undefined) => string;
|
|
74
|
+
interface CodeProps extends React$1.HTMLAttributes<HTMLElement>, VariantProps<typeof codeVariants> {
|
|
75
|
+
as?: "code" | "pre";
|
|
76
|
+
}
|
|
77
|
+
declare const Code: React$1.ForwardRefExoticComponent<CodeProps & React$1.RefAttributes<HTMLElement>>;
|
|
78
|
+
|
|
79
|
+
declare const displayVariants: (props?: ({
|
|
80
|
+
size?: "xl" | "2xl" | "3xl" | "4xl" | null | undefined;
|
|
81
|
+
weight?: "normal" | "medium" | "semibold" | "bold" | null | undefined;
|
|
82
|
+
muted?: boolean | null | undefined;
|
|
83
|
+
} & class_variance_authority_types.ClassProp) | undefined) => string;
|
|
84
|
+
interface DisplayProps extends React$1.HTMLAttributes<HTMLHeadingElement>, VariantProps<typeof displayVariants> {
|
|
85
|
+
as?: "h1" | "h2" | "div";
|
|
86
|
+
}
|
|
87
|
+
declare const Display: React$1.ForwardRefExoticComponent<DisplayProps & React$1.RefAttributes<HTMLElement>>;
|
|
88
|
+
|
|
89
|
+
declare const headingVariants: (props?: ({
|
|
90
|
+
level?: 1 | 2 | 4 | 6 | 3 | 5 | null | undefined;
|
|
91
|
+
weight?: "normal" | "medium" | "semibold" | "bold" | null | undefined;
|
|
92
|
+
muted?: boolean | null | undefined;
|
|
93
|
+
} & class_variance_authority_types.ClassProp) | undefined) => string;
|
|
94
|
+
interface HeadingProps extends React$1.HTMLAttributes<HTMLHeadingElement>, VariantProps<typeof headingVariants> {
|
|
95
|
+
as?: "h1" | "h2" | "h3" | "h4" | "h5" | "h6";
|
|
96
|
+
}
|
|
97
|
+
declare const Heading: React$1.ForwardRefExoticComponent<HeadingProps & React$1.RefAttributes<HTMLHeadingElement>>;
|
|
98
|
+
|
|
99
|
+
declare const leadVariants: (props?: ({
|
|
100
|
+
size?: "lg" | "xl" | null | undefined;
|
|
101
|
+
muted?: boolean | null | undefined;
|
|
102
|
+
} & class_variance_authority_types.ClassProp) | undefined) => string;
|
|
103
|
+
interface LeadProps extends React$1.HTMLAttributes<HTMLParagraphElement>, VariantProps<typeof leadVariants> {
|
|
104
|
+
as?: "p" | "span" | "div";
|
|
105
|
+
}
|
|
106
|
+
declare const Lead: React$1.ForwardRefExoticComponent<LeadProps & React$1.RefAttributes<HTMLElement>>;
|
|
107
|
+
|
|
108
|
+
interface SelectRootProps extends React$1.ComponentPropsWithoutRef<typeof SelectPrimitive.Root> {
|
|
109
|
+
}
|
|
110
|
+
/**
|
|
111
|
+
* Select Root component
|
|
112
|
+
* Radix Root is a context provider, not a DOM element, so it doesn't accept refs
|
|
113
|
+
*/
|
|
114
|
+
declare const SelectRoot: React$1.FC<SelectRootProps>;
|
|
115
|
+
interface SelectTriggerProps extends Omit<React$1.ComponentPropsWithoutRef<typeof SelectPrimitive.Trigger>, "size" | "variant" | "width"> {
|
|
116
|
+
/**
|
|
117
|
+
* Size variant - token-based
|
|
118
|
+
*/
|
|
119
|
+
size?: ResponsiveSelectSize;
|
|
120
|
+
/**
|
|
121
|
+
* Visual variant - token-based
|
|
122
|
+
*/
|
|
123
|
+
variant?: SelectVariantToken;
|
|
124
|
+
/**
|
|
125
|
+
* Width - token-based
|
|
126
|
+
*/
|
|
127
|
+
width?: ResponsiveSelectWidth;
|
|
128
|
+
}
|
|
129
|
+
declare const SelectTrigger: React$1.ForwardRefExoticComponent<SelectTriggerProps & React$1.RefAttributes<HTMLButtonElement>>;
|
|
130
|
+
interface SelectValueProps extends React$1.ComponentPropsWithoutRef<typeof SelectPrimitive.Value> {
|
|
131
|
+
}
|
|
132
|
+
declare const SelectValue: React$1.ForwardRefExoticComponent<SelectValueProps & React$1.RefAttributes<HTMLSpanElement>>;
|
|
133
|
+
interface SelectIconProps extends React$1.ComponentPropsWithoutRef<typeof SelectPrimitive.Icon> {
|
|
134
|
+
}
|
|
135
|
+
declare const SelectIcon: React$1.ForwardRefExoticComponent<SelectIconProps & React$1.RefAttributes<HTMLSpanElement>>;
|
|
136
|
+
interface SelectContentProps extends Omit<React$1.ComponentPropsWithoutRef<typeof SelectPrimitive.Content>, "size" | "sideOffset" | "alignOffset"> {
|
|
137
|
+
/**
|
|
138
|
+
* Size variant - token-based
|
|
139
|
+
*/
|
|
140
|
+
size?: ResponsiveSelectSize;
|
|
141
|
+
/**
|
|
142
|
+
* Side offset - token-based
|
|
143
|
+
*/
|
|
144
|
+
sideOffset?: ResponsiveSideOffset;
|
|
145
|
+
/**
|
|
146
|
+
* Alignment offset - token-based
|
|
147
|
+
*/
|
|
148
|
+
alignOffset?: ResponsiveAlignOffset;
|
|
149
|
+
}
|
|
150
|
+
declare const SelectContent: React$1.ForwardRefExoticComponent<SelectContentProps & React$1.RefAttributes<HTMLDivElement>>;
|
|
151
|
+
interface SelectViewportProps extends React$1.ComponentPropsWithoutRef<typeof SelectPrimitive.Viewport> {
|
|
152
|
+
}
|
|
153
|
+
declare const SelectViewport: React$1.ForwardRefExoticComponent<SelectViewportProps & React$1.RefAttributes<HTMLDivElement>>;
|
|
154
|
+
interface SelectItemProps extends React$1.ComponentPropsWithoutRef<typeof SelectPrimitive.Item> {
|
|
155
|
+
/**
|
|
156
|
+
* Size variant - token-based
|
|
157
|
+
*/
|
|
158
|
+
size?: ResponsiveSelectSize;
|
|
159
|
+
}
|
|
160
|
+
declare const SelectItem: React$1.ForwardRefExoticComponent<SelectItemProps & React$1.RefAttributes<HTMLDivElement>>;
|
|
161
|
+
interface SelectItemTextProps extends React$1.ComponentPropsWithoutRef<typeof SelectPrimitive.ItemText> {
|
|
162
|
+
}
|
|
163
|
+
declare const SelectItemText: React$1.ForwardRefExoticComponent<SelectItemTextProps & React$1.RefAttributes<HTMLSpanElement>>;
|
|
164
|
+
interface SelectItemIndicatorProps extends React$1.ComponentPropsWithoutRef<typeof SelectPrimitive.ItemIndicator> {
|
|
165
|
+
}
|
|
166
|
+
declare const SelectItemIndicator: React$1.ForwardRefExoticComponent<SelectItemIndicatorProps & React$1.RefAttributes<HTMLSpanElement>>;
|
|
167
|
+
interface SelectSeparatorProps extends React$1.ComponentPropsWithoutRef<typeof SelectPrimitive.Separator> {
|
|
168
|
+
/**
|
|
169
|
+
* Size variant - token-based
|
|
170
|
+
*/
|
|
171
|
+
size?: ResponsiveSelectSize;
|
|
172
|
+
}
|
|
173
|
+
declare const SelectSeparator: React$1.ForwardRefExoticComponent<SelectSeparatorProps & React$1.RefAttributes<HTMLDivElement>>;
|
|
174
|
+
interface SelectGroupProps extends React$1.ComponentPropsWithoutRef<typeof SelectPrimitive.Group> {
|
|
175
|
+
}
|
|
176
|
+
declare const SelectGroup: React$1.ForwardRefExoticComponent<SelectGroupProps & React$1.RefAttributes<HTMLDivElement>>;
|
|
177
|
+
interface SelectLabelProps extends React$1.ComponentPropsWithoutRef<typeof SelectPrimitive.Label> {
|
|
178
|
+
/**
|
|
179
|
+
* Size variant - token-based
|
|
180
|
+
*/
|
|
181
|
+
size?: ResponsiveSelectSize;
|
|
182
|
+
}
|
|
183
|
+
declare const SelectLabel: React$1.ForwardRefExoticComponent<SelectLabelProps & React$1.RefAttributes<HTMLDivElement>>;
|
|
184
|
+
|
|
185
|
+
declare const Select: {
|
|
186
|
+
Root: React$1.FC<SelectRootProps>;
|
|
187
|
+
Trigger: React$1.ForwardRefExoticComponent<SelectTriggerProps & React$1.RefAttributes<HTMLButtonElement>>;
|
|
188
|
+
Value: React$1.ForwardRefExoticComponent<SelectValueProps & React$1.RefAttributes<HTMLSpanElement>>;
|
|
189
|
+
Icon: React$1.ForwardRefExoticComponent<SelectIconProps & React$1.RefAttributes<HTMLSpanElement>>;
|
|
190
|
+
Content: React$1.ForwardRefExoticComponent<SelectContentProps & React$1.RefAttributes<HTMLDivElement>>;
|
|
191
|
+
Viewport: React$1.ForwardRefExoticComponent<SelectViewportProps & React$1.RefAttributes<HTMLDivElement>>;
|
|
192
|
+
Item: React$1.ForwardRefExoticComponent<SelectItemProps & React$1.RefAttributes<HTMLDivElement>>;
|
|
193
|
+
ItemText: React$1.ForwardRefExoticComponent<SelectItemTextProps & React$1.RefAttributes<HTMLSpanElement>>;
|
|
194
|
+
ItemIndicator: React$1.ForwardRefExoticComponent<SelectItemIndicatorProps & React$1.RefAttributes<HTMLSpanElement>>;
|
|
195
|
+
Separator: React$1.ForwardRefExoticComponent<SelectSeparatorProps & React$1.RefAttributes<HTMLDivElement>>;
|
|
196
|
+
Group: React$1.ForwardRefExoticComponent<SelectGroupProps & React$1.RefAttributes<HTMLDivElement>>;
|
|
197
|
+
Label: React$1.ForwardRefExoticComponent<SelectLabelProps & React$1.RefAttributes<HTMLDivElement>>;
|
|
198
|
+
};
|
|
199
|
+
|
|
200
|
+
/**
|
|
201
|
+
* Select size token type
|
|
202
|
+
*/
|
|
203
|
+
type SelectSize = SelectSizeToken;
|
|
204
|
+
/**
|
|
205
|
+
* Select variant token type
|
|
206
|
+
*/
|
|
207
|
+
type SelectVariant = SelectVariantToken;
|
|
208
|
+
/**
|
|
209
|
+
* Select width token type
|
|
210
|
+
*/
|
|
211
|
+
type SelectWidth = SelectWidthToken;
|
|
212
|
+
/**
|
|
213
|
+
* Select state token type
|
|
214
|
+
*/
|
|
215
|
+
type SelectState = SelectStateToken;
|
|
216
|
+
|
|
217
|
+
/**
|
|
218
|
+
* Modal Component
|
|
219
|
+
*
|
|
220
|
+
* Radix-based modal component with token-driven styling.
|
|
221
|
+
* All behavior (focus trap, keyboard navigation, a11y, portal) is handled by Radix Dialog.
|
|
222
|
+
* Tenerife UI provides visual styling through tokens only.
|
|
223
|
+
*/
|
|
224
|
+
|
|
225
|
+
interface ModalRootProps extends React$1.ComponentPropsWithoutRef<typeof DialogPrimitive.Root> {
|
|
226
|
+
}
|
|
227
|
+
/**
|
|
228
|
+
* Modal Root component
|
|
229
|
+
* Radix Root is a context provider, not a DOM element, so it doesn't accept refs
|
|
230
|
+
*/
|
|
231
|
+
declare const ModalRoot: React$1.FC<ModalRootProps>;
|
|
232
|
+
interface ModalTriggerProps extends React$1.ComponentPropsWithoutRef<typeof DialogPrimitive.Trigger> {
|
|
233
|
+
}
|
|
234
|
+
/**
|
|
235
|
+
* Modal Trigger component
|
|
236
|
+
* Wrapper around Radix Dialog Trigger
|
|
237
|
+
*/
|
|
238
|
+
declare const ModalTrigger: React$1.ForwardRefExoticComponent<ModalTriggerProps & React$1.RefAttributes<HTMLButtonElement>>;
|
|
239
|
+
interface ModalOverlayProps extends React$1.ComponentPropsWithoutRef<typeof DialogPrimitive.Overlay> {
|
|
240
|
+
}
|
|
241
|
+
/**
|
|
242
|
+
* Modal Overlay component
|
|
243
|
+
* Wrapper around Radix Dialog Overlay with token-based styling
|
|
244
|
+
*/
|
|
245
|
+
declare const ModalOverlay: React$1.ForwardRefExoticComponent<ModalOverlayProps & React$1.RefAttributes<HTMLDivElement>>;
|
|
246
|
+
interface ModalContentProps extends Omit<React$1.ComponentPropsWithoutRef<typeof DialogPrimitive.Content>, "size" | "width" | "height" | "padding" | "radius" | "surface"> {
|
|
247
|
+
/**
|
|
248
|
+
* Size variant - token-based
|
|
249
|
+
*
|
|
250
|
+
* **Precedence Rule:** The `size` prop applies a preset configuration (width, height, padding, radius, shadow).
|
|
251
|
+
* Individual override props (`width`, `height`, `padding`, `radius`) take precedence over the size preset.
|
|
252
|
+
*
|
|
253
|
+
* **Example:**
|
|
254
|
+
* - `size="md"` → applies md preset (max-w-md, p-lg, rounded-lg, etc.)
|
|
255
|
+
* - `size="md" width="lg"` → md preset applied, but width overridden to lg (max-w-lg)
|
|
256
|
+
* - `width="lg"` (no size) → only width applied, other defaults used
|
|
257
|
+
*
|
|
258
|
+
* @default "md"
|
|
259
|
+
*/
|
|
260
|
+
size?: ResponsiveModalSize;
|
|
261
|
+
/**
|
|
262
|
+
* Width - token-based
|
|
263
|
+
*
|
|
264
|
+
* **Precedence:** Overrides the width from the `size` preset if provided.
|
|
265
|
+
* If `size` is not provided, only this width is applied.
|
|
266
|
+
*
|
|
267
|
+
* @example
|
|
268
|
+
* ```tsx
|
|
269
|
+
* <Modal.Content size="md" width="lg" />
|
|
270
|
+
* // Applies md preset, but width is overridden to lg
|
|
271
|
+
* ```
|
|
272
|
+
*/
|
|
273
|
+
width?: ResponsiveModalWidth;
|
|
274
|
+
/**
|
|
275
|
+
* Height - token-based
|
|
276
|
+
*
|
|
277
|
+
* **Precedence:** Overrides the height from the `size` preset if provided.
|
|
278
|
+
* If `size` is not provided, only this height is applied.
|
|
279
|
+
*/
|
|
280
|
+
height?: ResponsiveModalHeight;
|
|
281
|
+
/**
|
|
282
|
+
* Padding - token-based
|
|
283
|
+
*
|
|
284
|
+
* **Precedence:** Overrides the padding from the `size` preset if provided.
|
|
285
|
+
* If `size` is not provided, only this padding is applied.
|
|
286
|
+
*/
|
|
287
|
+
padding?: ResponsiveSpace;
|
|
288
|
+
/**
|
|
289
|
+
* Border radius - token-based
|
|
290
|
+
*
|
|
291
|
+
* **Precedence:** Overrides the radius from the `size` preset if provided.
|
|
292
|
+
* If `size` is not provided, only this radius is applied.
|
|
293
|
+
*/
|
|
294
|
+
radius?: RadiusToken;
|
|
295
|
+
/**
|
|
296
|
+
* Surface variant - token-based
|
|
297
|
+
*
|
|
298
|
+
* Applies surface styling (background, shadow) independent of size preset.
|
|
299
|
+
*
|
|
300
|
+
* @example
|
|
301
|
+
* ```tsx
|
|
302
|
+
* <Modal.Content size="md" surface="raised" />
|
|
303
|
+
* // Applies md preset + raised surface styling
|
|
304
|
+
* ```
|
|
305
|
+
*/
|
|
306
|
+
surface?: SurfaceToken;
|
|
307
|
+
}
|
|
308
|
+
/**
|
|
309
|
+
* Modal Content component
|
|
310
|
+
* Wrapper around Radix Dialog Content with token-based styling.
|
|
311
|
+
*
|
|
312
|
+
* **Prop Precedence:**
|
|
313
|
+
* 1. `size` prop applies a preset configuration (width, height, padding, radius, shadow)
|
|
314
|
+
* 2. Individual override props (`width`, `height`, `padding`, `radius`) take precedence over size preset
|
|
315
|
+
* 3. `surface` is applied independently and does not conflict with size preset
|
|
316
|
+
*
|
|
317
|
+
* **Usage:**
|
|
318
|
+
* ```tsx
|
|
319
|
+
* // Use size preset only
|
|
320
|
+
* <Modal.Content size="md" />
|
|
321
|
+
*
|
|
322
|
+
* // Override specific properties from preset
|
|
323
|
+
* <Modal.Content size="md" width="lg" padding="xl" />
|
|
324
|
+
*
|
|
325
|
+
* // Use individual props without preset
|
|
326
|
+
* <Modal.Content width="lg" padding="md" />
|
|
327
|
+
* ```
|
|
328
|
+
*/
|
|
329
|
+
declare const ModalContent: React$1.ForwardRefExoticComponent<ModalContentProps & React$1.RefAttributes<HTMLDivElement>>;
|
|
330
|
+
interface ModalHeaderProps extends React$1.HTMLAttributes<HTMLDivElement> {
|
|
331
|
+
/**
|
|
332
|
+
* Gap between header items - token-based
|
|
333
|
+
*/
|
|
334
|
+
gap?: ResponsiveSpace;
|
|
335
|
+
}
|
|
336
|
+
/**
|
|
337
|
+
* Modal Header component
|
|
338
|
+
* Presentational wrapper for modal header content
|
|
339
|
+
*/
|
|
340
|
+
declare const ModalHeader: React$1.ForwardRefExoticComponent<ModalHeaderProps & React$1.RefAttributes<HTMLDivElement>>;
|
|
341
|
+
interface ModalTitleProps extends React$1.ComponentPropsWithoutRef<typeof DialogPrimitive.Title> {
|
|
342
|
+
}
|
|
343
|
+
/**
|
|
344
|
+
* Modal Title component
|
|
345
|
+
* Wrapper around Radix Dialog Title with token-based typography
|
|
346
|
+
*/
|
|
347
|
+
declare const ModalTitle: React$1.ForwardRefExoticComponent<ModalTitleProps & React$1.RefAttributes<HTMLHeadingElement>>;
|
|
348
|
+
interface ModalDescriptionProps extends React$1.ComponentPropsWithoutRef<typeof DialogPrimitive.Description> {
|
|
349
|
+
}
|
|
350
|
+
/**
|
|
351
|
+
* Modal Description component
|
|
352
|
+
* Wrapper around Radix Dialog Description with token-based typography
|
|
353
|
+
*/
|
|
354
|
+
declare const ModalDescription: React$1.ForwardRefExoticComponent<ModalDescriptionProps & React$1.RefAttributes<HTMLParagraphElement>>;
|
|
355
|
+
interface ModalFooterProps extends React$1.HTMLAttributes<HTMLDivElement> {
|
|
356
|
+
/**
|
|
357
|
+
* Gap between footer items - token-based
|
|
358
|
+
*/
|
|
359
|
+
gap?: ResponsiveSpace;
|
|
360
|
+
/**
|
|
361
|
+
* Footer alignment - token-based
|
|
362
|
+
*/
|
|
363
|
+
align?: ModalFooterAlignToken;
|
|
364
|
+
}
|
|
365
|
+
/**
|
|
366
|
+
* Modal Footer component
|
|
367
|
+
* Presentational wrapper for modal footer content
|
|
368
|
+
*/
|
|
369
|
+
declare const ModalFooter: React$1.ForwardRefExoticComponent<ModalFooterProps & React$1.RefAttributes<HTMLDivElement>>;
|
|
370
|
+
interface ModalCloseProps extends React$1.ComponentPropsWithoutRef<typeof DialogPrimitive.Close> {
|
|
371
|
+
}
|
|
372
|
+
/**
|
|
373
|
+
* Modal Close component
|
|
374
|
+
* Wrapper around Radix Dialog Close with token-based styling
|
|
375
|
+
*/
|
|
376
|
+
declare const ModalClose: React$1.ForwardRefExoticComponent<ModalCloseProps & React$1.RefAttributes<HTMLButtonElement>>;
|
|
377
|
+
|
|
378
|
+
/**
|
|
379
|
+
* Modal Component
|
|
380
|
+
*
|
|
381
|
+
* Radix Dialog-based modal component with token-driven styling.
|
|
382
|
+
*
|
|
383
|
+
* **Usage:**
|
|
384
|
+
* ```tsx
|
|
385
|
+
* <Modal.Root open={open} onOpenChange={setOpen}>
|
|
386
|
+
* <Modal.Trigger>Open</Modal.Trigger>
|
|
387
|
+
* <Modal.Content>
|
|
388
|
+
* <Modal.Header>
|
|
389
|
+
* <Modal.Title>Title</Modal.Title>
|
|
390
|
+
* <Modal.Description>Description</Modal.Description>
|
|
391
|
+
* </Modal.Header>
|
|
392
|
+
* <div>Content</div>
|
|
393
|
+
* <Modal.Footer>
|
|
394
|
+
* <Modal.Close>Close</Modal.Close>
|
|
395
|
+
* </Modal.Footer>
|
|
396
|
+
* <Modal.Close />
|
|
397
|
+
* </Modal.Content>
|
|
398
|
+
* </Modal.Root>
|
|
399
|
+
* ```
|
|
400
|
+
*
|
|
401
|
+
* **Note:** Modal.Portal and Modal.Overlay are internal and should not be used directly.
|
|
402
|
+
* ModalContent automatically handles portal and overlay rendering.
|
|
403
|
+
*/
|
|
404
|
+
declare const Modal: {
|
|
405
|
+
Root: React$1.FC<ModalRootProps>;
|
|
406
|
+
Trigger: React$1.ForwardRefExoticComponent<ModalTriggerProps & React$1.RefAttributes<HTMLButtonElement>>;
|
|
407
|
+
Overlay: React$1.ForwardRefExoticComponent<ModalOverlayProps & React$1.RefAttributes<HTMLDivElement>>;
|
|
408
|
+
Content: React$1.ForwardRefExoticComponent<ModalContentProps & React$1.RefAttributes<HTMLDivElement>>;
|
|
409
|
+
Header: React$1.ForwardRefExoticComponent<ModalHeaderProps & React$1.RefAttributes<HTMLDivElement>>;
|
|
410
|
+
Title: React$1.ForwardRefExoticComponent<ModalTitleProps & React$1.RefAttributes<HTMLHeadingElement>>;
|
|
411
|
+
Description: React$1.ForwardRefExoticComponent<ModalDescriptionProps & React$1.RefAttributes<HTMLParagraphElement>>;
|
|
412
|
+
Footer: React$1.ForwardRefExoticComponent<ModalFooterProps & React$1.RefAttributes<HTMLDivElement>>;
|
|
413
|
+
Close: React$1.ForwardRefExoticComponent<ModalCloseProps & React$1.RefAttributes<HTMLButtonElement>>;
|
|
414
|
+
};
|
|
415
|
+
|
|
416
|
+
/**
|
|
417
|
+
* Checkbox Variants
|
|
418
|
+
*
|
|
419
|
+
* CVA-based variant system for Checkbox component.
|
|
420
|
+
* Supports variants (primary, secondary, outline, ghost, destructive),
|
|
421
|
+
* sizes (xs, sm, md, lg, xl), and states (default, checked, disabled, error, indeterminate).
|
|
422
|
+
* All styling uses token-based values with CSS variable references.
|
|
423
|
+
*/
|
|
424
|
+
declare const checkboxVariants: (props?: ({
|
|
425
|
+
variant?: "primary" | "secondary" | "destructive" | "outline" | "ghost" | null | undefined;
|
|
426
|
+
size?: "sm" | "md" | "lg" | "xl" | "xs" | null | undefined;
|
|
427
|
+
state?: "default" | "disabled" | "error" | "checked" | "indeterminate" | null | undefined;
|
|
428
|
+
} & class_variance_authority_types.ClassProp) | undefined) => string;
|
|
429
|
+
|
|
430
|
+
/**
|
|
431
|
+
* Checkbox Component Props
|
|
432
|
+
*
|
|
433
|
+
* Extends native button HTML attributes with variant props, checked state, and accessibility props.
|
|
434
|
+
* Uses button role="checkbox" pattern for full keyboard accessibility.
|
|
435
|
+
*/
|
|
436
|
+
interface CheckboxProps extends Omit<React$1.ButtonHTMLAttributes<HTMLButtonElement>, "size" | "onChange">, VariantProps<typeof checkboxVariants> {
|
|
437
|
+
/**
|
|
438
|
+
* Checkbox variant style
|
|
439
|
+
* @default "outline"
|
|
440
|
+
*/
|
|
441
|
+
variant?: "primary" | "secondary" | "outline" | "ghost" | "destructive";
|
|
442
|
+
/**
|
|
443
|
+
* Checkbox size
|
|
444
|
+
* @default "md"
|
|
445
|
+
*/
|
|
446
|
+
size?: "xs" | "sm" | "md" | "lg" | "xl";
|
|
447
|
+
/**
|
|
448
|
+
* Checkbox state
|
|
449
|
+
* @default "default"
|
|
450
|
+
*/
|
|
451
|
+
state?: "default" | "checked" | "indeterminate" | "error" | "disabled";
|
|
452
|
+
/**
|
|
453
|
+
* Whether checkbox is checked (controlled)
|
|
454
|
+
*/
|
|
455
|
+
checked?: boolean;
|
|
456
|
+
/**
|
|
457
|
+
* Whether checkbox is in indeterminate state
|
|
458
|
+
* When true, overrides checked state visually
|
|
459
|
+
*/
|
|
460
|
+
indeterminate?: boolean;
|
|
461
|
+
/**
|
|
462
|
+
* Whether checkbox is disabled
|
|
463
|
+
*/
|
|
464
|
+
disabled?: boolean;
|
|
465
|
+
/**
|
|
466
|
+
* Callback fired when checked state changes
|
|
467
|
+
*/
|
|
468
|
+
onCheckedChange?: (checked: boolean) => void;
|
|
469
|
+
/**
|
|
470
|
+
* Custom icon to display when checked
|
|
471
|
+
* Defaults to IconCheck from icon system
|
|
472
|
+
*/
|
|
473
|
+
icon?: React$1.ReactNode;
|
|
474
|
+
/**
|
|
475
|
+
* Custom icon to display when indeterminate
|
|
476
|
+
* Defaults to horizontal line indicator
|
|
477
|
+
*/
|
|
478
|
+
indeterminateIcon?: React$1.ReactNode;
|
|
479
|
+
/**
|
|
480
|
+
* ARIA label for the checkbox
|
|
481
|
+
* Required if no visible label is present
|
|
482
|
+
*/
|
|
483
|
+
"aria-label"?: string;
|
|
484
|
+
/**
|
|
485
|
+
* ARIA labelledby reference
|
|
486
|
+
* Points to the ID of the element that labels this checkbox
|
|
487
|
+
*/
|
|
488
|
+
"aria-labelledby"?: string;
|
|
489
|
+
/**
|
|
490
|
+
* ARIA describedby reference
|
|
491
|
+
* Points to the ID of the element that describes this checkbox
|
|
492
|
+
*/
|
|
493
|
+
"aria-describedby"?: string;
|
|
494
|
+
}
|
|
495
|
+
|
|
496
|
+
/**
|
|
497
|
+
* Checkbox Component
|
|
498
|
+
*
|
|
499
|
+
* A fully accessible, theme-aware checkbox component with variant support,
|
|
500
|
+
* keyboard navigation, and comprehensive state management.
|
|
501
|
+
* Uses button role="checkbox" pattern for full accessibility.
|
|
502
|
+
*
|
|
503
|
+
* @example
|
|
504
|
+
* ```tsx
|
|
505
|
+
* <Checkbox
|
|
506
|
+
* variant="outline"
|
|
507
|
+
* size="md"
|
|
508
|
+
* checked={isChecked}
|
|
509
|
+
* onCheckedChange={setIsChecked}
|
|
510
|
+
* aria-label="Accept terms"
|
|
511
|
+
* />
|
|
512
|
+
* ```
|
|
513
|
+
*/
|
|
514
|
+
declare const Checkbox: React$1.ForwardRefExoticComponent<CheckboxProps & React$1.RefAttributes<HTMLButtonElement>>;
|
|
515
|
+
|
|
516
|
+
/**
|
|
517
|
+
* Input Variants
|
|
518
|
+
*
|
|
519
|
+
* CVA-based variant system for Input component.
|
|
520
|
+
* Supports variants (primary, secondary, outline, ghost, destructive),
|
|
521
|
+
* sizes (xs, sm, md, lg, xl), and states (default, disabled, error, success).
|
|
522
|
+
* All styling uses token-based values with CSS variable references.
|
|
523
|
+
*/
|
|
524
|
+
declare const inputVariants: (props?: ({
|
|
525
|
+
variant?: "primary" | "secondary" | "destructive" | "outline" | "ghost" | null | undefined;
|
|
526
|
+
size?: "sm" | "md" | "lg" | "xl" | "xs" | null | undefined;
|
|
527
|
+
state?: "default" | "disabled" | "success" | "error" | null | undefined;
|
|
528
|
+
fullWidth?: boolean | null | undefined;
|
|
529
|
+
} & class_variance_authority_types.ClassProp) | undefined) => string;
|
|
530
|
+
|
|
531
|
+
/**
|
|
532
|
+
* Input Component Props
|
|
533
|
+
*
|
|
534
|
+
* Extends native input HTML attributes with variant props, icon slots, and accessibility props.
|
|
535
|
+
*/
|
|
536
|
+
interface InputProps extends Omit<React$1.InputHTMLAttributes<HTMLInputElement>, "size">, VariantProps<typeof inputVariants> {
|
|
537
|
+
/**
|
|
538
|
+
* Input variant style
|
|
539
|
+
* @default "outline"
|
|
540
|
+
*/
|
|
541
|
+
variant?: "primary" | "secondary" | "outline" | "ghost" | "destructive";
|
|
542
|
+
/**
|
|
543
|
+
* Input size
|
|
544
|
+
* @default "md"
|
|
545
|
+
*/
|
|
546
|
+
size?: "xs" | "sm" | "md" | "lg" | "xl";
|
|
547
|
+
/**
|
|
548
|
+
* Input state
|
|
549
|
+
* @default "default"
|
|
550
|
+
*/
|
|
551
|
+
state?: "default" | "disabled" | "error" | "success";
|
|
552
|
+
/**
|
|
553
|
+
* Whether input should take full width
|
|
554
|
+
* @default true
|
|
555
|
+
*/
|
|
556
|
+
fullWidth?: boolean;
|
|
557
|
+
/**
|
|
558
|
+
* Icon to display on the left side of the input
|
|
559
|
+
*/
|
|
560
|
+
iconLeft?: React$1.ReactNode;
|
|
561
|
+
/**
|
|
562
|
+
* Icon to display on the right side of the input
|
|
563
|
+
*/
|
|
564
|
+
iconRight?: React$1.ReactNode;
|
|
565
|
+
}
|
|
566
|
+
|
|
567
|
+
/**
|
|
568
|
+
* Input Component
|
|
569
|
+
*
|
|
570
|
+
* A fully accessible, theme-aware input component with variant support,
|
|
571
|
+
* icon slots, and comprehensive state management.
|
|
572
|
+
*
|
|
573
|
+
* @example
|
|
574
|
+
* ```tsx
|
|
575
|
+
* <Input
|
|
576
|
+
* variant="outline"
|
|
577
|
+
* size="md"
|
|
578
|
+
* placeholder="Enter text..."
|
|
579
|
+
* iconLeft={<Icon name="search" />}
|
|
580
|
+
* />
|
|
581
|
+
* ```
|
|
582
|
+
*/
|
|
583
|
+
declare const Input: React$1.ForwardRefExoticComponent<InputProps & React$1.RefAttributes<HTMLInputElement>>;
|
|
584
|
+
|
|
585
|
+
/**
|
|
586
|
+
* Radio Variants
|
|
587
|
+
*
|
|
588
|
+
* CVA-based variant system for Radio component.
|
|
589
|
+
* Supports variants (primary, secondary, outline, ghost, destructive),
|
|
590
|
+
* sizes (xs, sm, md, lg, xl), and states (default, checked, disabled, error).
|
|
591
|
+
* All styling uses token-based values with CSS variable references.
|
|
592
|
+
*/
|
|
593
|
+
declare const radioVariants: (props?: ({
|
|
594
|
+
variant?: "primary" | "secondary" | "destructive" | "outline" | "ghost" | null | undefined;
|
|
595
|
+
size?: "sm" | "md" | "lg" | "xl" | "xs" | null | undefined;
|
|
596
|
+
state?: "default" | "disabled" | "error" | "checked" | null | undefined;
|
|
597
|
+
} & class_variance_authority_types.ClassProp) | undefined) => string;
|
|
598
|
+
|
|
599
|
+
/**
|
|
600
|
+
* Radio Component Props
|
|
601
|
+
*
|
|
602
|
+
* Extends native button HTML attributes with variant props, checked state, and accessibility props.
|
|
603
|
+
* Uses button role="radio" pattern for full keyboard accessibility.
|
|
604
|
+
*/
|
|
605
|
+
interface RadioProps extends Omit<React$1.ButtonHTMLAttributes<HTMLButtonElement>, "size" | "onChange">, VariantProps<typeof radioVariants> {
|
|
606
|
+
/**
|
|
607
|
+
* Radio variant style
|
|
608
|
+
* @default "outline"
|
|
609
|
+
*/
|
|
610
|
+
variant?: "primary" | "secondary" | "outline" | "ghost" | "destructive";
|
|
611
|
+
/**
|
|
612
|
+
* Radio size
|
|
613
|
+
* @default "md"
|
|
614
|
+
*/
|
|
615
|
+
size?: "xs" | "sm" | "md" | "lg" | "xl";
|
|
616
|
+
/**
|
|
617
|
+
* Radio state
|
|
618
|
+
* @default "default"
|
|
619
|
+
*/
|
|
620
|
+
state?: "default" | "checked" | "disabled" | "error";
|
|
621
|
+
/**
|
|
622
|
+
* Whether radio is checked (controlled)
|
|
623
|
+
*/
|
|
624
|
+
checked?: boolean;
|
|
625
|
+
/**
|
|
626
|
+
* Whether radio is disabled
|
|
627
|
+
*/
|
|
628
|
+
disabled?: boolean;
|
|
629
|
+
/**
|
|
630
|
+
* Value of this radio button
|
|
631
|
+
* Required when used within RadioGroup
|
|
632
|
+
*/
|
|
633
|
+
value?: string;
|
|
634
|
+
/**
|
|
635
|
+
* Callback fired when radio is selected
|
|
636
|
+
*/
|
|
637
|
+
onCheckedChange?: (checked: boolean) => void;
|
|
638
|
+
/**
|
|
639
|
+
* Custom icon to display when checked
|
|
640
|
+
* Defaults to filled circle dot
|
|
641
|
+
*/
|
|
642
|
+
icon?: React$1.ReactNode;
|
|
643
|
+
/**
|
|
644
|
+
* ARIA label for the radio
|
|
645
|
+
* Required if no visible label is present
|
|
646
|
+
*/
|
|
647
|
+
"aria-label"?: string;
|
|
648
|
+
/**
|
|
649
|
+
* ARIA labelledby reference
|
|
650
|
+
* Points to the ID of the element that labels this radio
|
|
651
|
+
*/
|
|
652
|
+
"aria-labelledby"?: string;
|
|
653
|
+
/**
|
|
654
|
+
* ARIA describedby reference
|
|
655
|
+
* Points to the ID of the element that describes this radio
|
|
656
|
+
*/
|
|
657
|
+
"aria-describedby"?: string;
|
|
658
|
+
}
|
|
659
|
+
|
|
660
|
+
/**
|
|
661
|
+
* Radio Component
|
|
662
|
+
*
|
|
663
|
+
* A fully accessible, theme-aware radio button component with variant support,
|
|
664
|
+
* keyboard navigation, and comprehensive state management.
|
|
665
|
+
* Uses button role="radio" pattern for full accessibility.
|
|
666
|
+
* Can be used standalone or within RadioGroup for group behavior.
|
|
667
|
+
*
|
|
668
|
+
* @example
|
|
669
|
+
* ```tsx
|
|
670
|
+
* <RadioGroup value={value} onValueChange={setValue}>
|
|
671
|
+
* <Radio value="option1" aria-label="Option 1" />
|
|
672
|
+
* <Radio value="option2" aria-label="Option 2" />
|
|
673
|
+
* </RadioGroup>
|
|
674
|
+
* ```
|
|
675
|
+
*/
|
|
676
|
+
|
|
677
|
+
/**
|
|
678
|
+
* Radio component
|
|
679
|
+
*/
|
|
680
|
+
declare const Radio: React$1.ForwardRefExoticComponent<RadioProps & React$1.RefAttributes<HTMLButtonElement>>;
|
|
681
|
+
|
|
682
|
+
/**
|
|
683
|
+
* RadioGroup Component Props
|
|
684
|
+
*
|
|
685
|
+
* Container component for Radio buttons with keyboard navigation and state management.
|
|
686
|
+
*/
|
|
687
|
+
interface RadioGroupProps extends React$1.HTMLAttributes<HTMLDivElement> {
|
|
688
|
+
/**
|
|
689
|
+
* Controlled value
|
|
690
|
+
*/
|
|
691
|
+
value?: string;
|
|
692
|
+
/**
|
|
693
|
+
* Default value for uncontrolled usage
|
|
694
|
+
*/
|
|
695
|
+
defaultValue?: string;
|
|
696
|
+
/**
|
|
697
|
+
* Callback when value changes
|
|
698
|
+
*/
|
|
699
|
+
onValueChange?: (value: string) => void;
|
|
700
|
+
/**
|
|
701
|
+
* Name attribute for the radio group
|
|
702
|
+
*/
|
|
703
|
+
name?: string;
|
|
704
|
+
/**
|
|
705
|
+
* Orientation of the radio group
|
|
706
|
+
* @default "vertical"
|
|
707
|
+
*/
|
|
708
|
+
orientation?: "horizontal" | "vertical";
|
|
709
|
+
/**
|
|
710
|
+
* Size for all radios in the group
|
|
711
|
+
* Can be overridden by individual Radio components
|
|
712
|
+
*/
|
|
713
|
+
size?: "xs" | "sm" | "md" | "lg" | "xl";
|
|
714
|
+
}
|
|
715
|
+
|
|
716
|
+
/**
|
|
717
|
+
* RadioGroup Component
|
|
718
|
+
*
|
|
719
|
+
* Container component for Radio buttons with keyboard navigation and state management.
|
|
720
|
+
* Supports horizontal and vertical orientations, controlled/uncontrolled modes,
|
|
721
|
+
* and full keyboard accessibility with ArrowUp/ArrowDown navigation.
|
|
722
|
+
*/
|
|
723
|
+
|
|
724
|
+
/**
|
|
725
|
+
* RadioGroup - Container component that manages state and keyboard navigation
|
|
726
|
+
*/
|
|
727
|
+
declare const RadioGroup: React$1.ForwardRefExoticComponent<RadioGroupProps & React$1.RefAttributes<HTMLDivElement>>;
|
|
728
|
+
|
|
729
|
+
/**
|
|
730
|
+
* Textarea Variants
|
|
731
|
+
*
|
|
732
|
+
* CVA-based variant system for Textarea component.
|
|
733
|
+
* Supports variants (primary, secondary, outline, ghost, destructive),
|
|
734
|
+
* sizes (xs, sm, md, lg, xl), and states (default, disabled, error, success).
|
|
735
|
+
* All styling uses token-based values with CSS variable references.
|
|
736
|
+
*/
|
|
737
|
+
declare const textareaVariants: (props?: ({
|
|
738
|
+
variant?: "primary" | "secondary" | "destructive" | "outline" | "ghost" | null | undefined;
|
|
739
|
+
size?: "sm" | "md" | "lg" | "xl" | "xs" | null | undefined;
|
|
740
|
+
state?: "default" | "disabled" | "success" | "error" | null | undefined;
|
|
741
|
+
fullWidth?: boolean | null | undefined;
|
|
742
|
+
} & class_variance_authority_types.ClassProp) | undefined) => string;
|
|
743
|
+
|
|
744
|
+
/**
|
|
745
|
+
* Textarea Component Props
|
|
746
|
+
*
|
|
747
|
+
* Extends native textarea HTML attributes with variant props, character counter, and accessibility props.
|
|
748
|
+
*/
|
|
749
|
+
interface TextareaProps extends React$1.TextareaHTMLAttributes<HTMLTextAreaElement>, VariantProps<typeof textareaVariants> {
|
|
750
|
+
/**
|
|
751
|
+
* Textarea variant style
|
|
752
|
+
* @default "outline"
|
|
753
|
+
*/
|
|
754
|
+
variant?: "primary" | "secondary" | "outline" | "ghost" | "destructive";
|
|
755
|
+
/**
|
|
756
|
+
* Textarea size
|
|
757
|
+
* @default "md"
|
|
758
|
+
*/
|
|
759
|
+
size?: "xs" | "sm" | "md" | "lg" | "xl";
|
|
760
|
+
/**
|
|
761
|
+
* Textarea state
|
|
762
|
+
* @default "default"
|
|
763
|
+
*/
|
|
764
|
+
state?: "default" | "disabled" | "error" | "success";
|
|
765
|
+
/**
|
|
766
|
+
* Whether textarea should take full width
|
|
767
|
+
* @default true
|
|
768
|
+
*/
|
|
769
|
+
fullWidth?: boolean;
|
|
770
|
+
/**
|
|
771
|
+
* Maximum character length (for character counter)
|
|
772
|
+
*/
|
|
773
|
+
maxLength?: number;
|
|
774
|
+
/**
|
|
775
|
+
* Show character counter
|
|
776
|
+
* Only displays when both showCharacterCount and maxLength are provided
|
|
777
|
+
* @default false
|
|
778
|
+
*/
|
|
779
|
+
showCharacterCount?: boolean;
|
|
780
|
+
}
|
|
781
|
+
|
|
782
|
+
/**
|
|
783
|
+
* Textarea Component
|
|
784
|
+
*
|
|
785
|
+
* A fully accessible, theme-aware textarea component with variant support,
|
|
786
|
+
* character counter, and comprehensive state management.
|
|
787
|
+
*
|
|
788
|
+
* @example
|
|
789
|
+
* ```tsx
|
|
790
|
+
* <Textarea
|
|
791
|
+
* variant="outline"
|
|
792
|
+
* size="md"
|
|
793
|
+
* placeholder="Enter text..."
|
|
794
|
+
* showCharacterCount
|
|
795
|
+
* maxLength={200}
|
|
796
|
+
* />
|
|
797
|
+
* ```
|
|
798
|
+
*/
|
|
799
|
+
declare const Textarea: React$1.ForwardRefExoticComponent<TextareaProps & React$1.RefAttributes<HTMLTextAreaElement>>;
|
|
800
|
+
|
|
801
|
+
declare const labelVariants: (props?: class_variance_authority_types.ClassProp | undefined) => string;
|
|
802
|
+
interface LabelProps extends React$1.ComponentPropsWithoutRef<typeof LabelPrimitive.Root>, VariantProps<typeof labelVariants> {
|
|
803
|
+
/**
|
|
804
|
+
* Whether the field is required (shows asterisk)
|
|
805
|
+
*/
|
|
806
|
+
required?: boolean;
|
|
807
|
+
}
|
|
808
|
+
declare const Label: React$1.ForwardRefExoticComponent<LabelProps & React$1.RefAttributes<HTMLLabelElement>>;
|
|
809
|
+
|
|
810
|
+
/**
|
|
811
|
+
* Field Container Component
|
|
812
|
+
* Provides spacing between field elements using Stack
|
|
813
|
+
*/
|
|
814
|
+
interface FieldProps extends React$1.HTMLAttributes<HTMLDivElement> {
|
|
815
|
+
}
|
|
816
|
+
declare const Field: React$1.ForwardRefExoticComponent<FieldProps & React$1.RefAttributes<HTMLDivElement>>;
|
|
817
|
+
/**
|
|
818
|
+
* Field Label Component
|
|
819
|
+
* Wraps Label component with proper styling
|
|
820
|
+
*/
|
|
821
|
+
interface FieldLabelProps extends React$1.ComponentProps<typeof Label> {
|
|
822
|
+
}
|
|
823
|
+
declare const FieldLabel: React$1.ForwardRefExoticComponent<Omit<FieldLabelProps, "ref"> & React$1.RefAttributes<HTMLLabelElement>>;
|
|
824
|
+
/**
|
|
825
|
+
* Field Control Component
|
|
826
|
+
* Wrapper for input/textarea/select controls
|
|
827
|
+
*/
|
|
828
|
+
interface FieldControlProps extends React$1.HTMLAttributes<HTMLDivElement> {
|
|
829
|
+
}
|
|
830
|
+
declare const FieldControl: React$1.ForwardRefExoticComponent<FieldControlProps & React$1.RefAttributes<HTMLDivElement>>;
|
|
831
|
+
/**
|
|
832
|
+
* Field Description Component
|
|
833
|
+
* Helper text displayed below the control
|
|
834
|
+
*/
|
|
835
|
+
interface FieldDescriptionProps extends React$1.ComponentProps<typeof Text> {
|
|
836
|
+
}
|
|
837
|
+
declare const FieldDescription: React$1.ForwardRefExoticComponent<Omit<FieldDescriptionProps, "ref"> & React$1.RefAttributes<HTMLSpanElement>>;
|
|
838
|
+
/**
|
|
839
|
+
* Field Error Component
|
|
840
|
+
* Error message displayed below the control
|
|
841
|
+
*/
|
|
842
|
+
interface FieldErrorProps extends React$1.ComponentProps<typeof Text> {
|
|
843
|
+
}
|
|
844
|
+
declare const FieldError: React$1.ForwardRefExoticComponent<Omit<FieldErrorProps, "ref"> & React$1.RefAttributes<HTMLSpanElement>>;
|
|
845
|
+
declare const FieldRoot: typeof Field & {
|
|
846
|
+
Label: typeof FieldLabel;
|
|
847
|
+
Control: typeof FieldControl;
|
|
848
|
+
Description: typeof FieldDescription;
|
|
849
|
+
Error: typeof FieldError;
|
|
850
|
+
};
|
|
851
|
+
|
|
852
|
+
/**
|
|
853
|
+
* Layout Primitives Shared Types
|
|
854
|
+
*
|
|
855
|
+
* Common types used across Box, Flex, Grid, and Stack components.
|
|
856
|
+
*/
|
|
857
|
+
|
|
858
|
+
/**
|
|
859
|
+
* Alignment values for flexbox/grid
|
|
860
|
+
*/
|
|
861
|
+
type AlignmentValue = "start" | "end" | "center" | "baseline" | "stretch";
|
|
862
|
+
/**
|
|
863
|
+
* Justify content values for flexbox/grid
|
|
864
|
+
*/
|
|
865
|
+
type JustifyValue = "start" | "end" | "center" | "between" | "around" | "evenly";
|
|
866
|
+
/**
|
|
867
|
+
* Flex direction values
|
|
868
|
+
*/
|
|
869
|
+
type FlexDirectionValue = "row" | "column" | "row-reverse" | "column-reverse";
|
|
870
|
+
/**
|
|
871
|
+
* Flex wrap values
|
|
872
|
+
*/
|
|
873
|
+
type FlexWrapValue = "nowrap" | "wrap" | "wrap-reverse";
|
|
874
|
+
/**
|
|
875
|
+
* Grid column values
|
|
876
|
+
*/
|
|
877
|
+
type ColumnValue = 1 | 2 | 3 | 4 | 5 | 6 | 12 | "none";
|
|
878
|
+
/**
|
|
879
|
+
* Grid row values
|
|
880
|
+
*/
|
|
881
|
+
type RowValue = 1 | 2 | 3 | 4 | 5 | 6 | "none";
|
|
882
|
+
/**
|
|
883
|
+
* Grid flow values
|
|
884
|
+
*/
|
|
885
|
+
type FlowValue = "row" | "col" | "dense" | "row-dense" | "col-dense";
|
|
886
|
+
/**
|
|
887
|
+
* Shadow token values
|
|
888
|
+
*/
|
|
889
|
+
type ShadowValue = ShadowToken;
|
|
890
|
+
/**
|
|
891
|
+
* Display type values
|
|
892
|
+
*/
|
|
893
|
+
type DisplayValue = "block" | "inline" | "inline-block" | "flex" | "grid" | "inline-flex" | "inline-grid" | "none";
|
|
894
|
+
/**
|
|
895
|
+
* Responsive spacing prop type
|
|
896
|
+
*/
|
|
897
|
+
type ResponsiveSpacing = ResponsiveSpace;
|
|
898
|
+
/**
|
|
899
|
+
* Responsive radius prop type
|
|
900
|
+
*/
|
|
901
|
+
type ResponsiveRadius = ResponsiveRadius$1;
|
|
902
|
+
/**
|
|
903
|
+
* Responsive color prop type
|
|
904
|
+
*/
|
|
905
|
+
type ResponsiveColor = ResponsiveColor$1;
|
|
906
|
+
/**
|
|
907
|
+
* Responsive alignment prop type
|
|
908
|
+
*/
|
|
909
|
+
type ResponsiveAlignment = Responsive<AlignmentValue>;
|
|
910
|
+
/**
|
|
911
|
+
* Responsive justify prop type
|
|
912
|
+
*/
|
|
913
|
+
type ResponsiveJustify = Responsive<JustifyValue>;
|
|
914
|
+
/**
|
|
915
|
+
* Responsive direction prop type
|
|
916
|
+
*/
|
|
917
|
+
type ResponsiveFlexDirection = Responsive<FlexDirectionValue>;
|
|
918
|
+
/**
|
|
919
|
+
* Responsive wrap prop type
|
|
920
|
+
*/
|
|
921
|
+
type ResponsiveFlexWrap = Responsive<FlexWrapValue>;
|
|
922
|
+
/**
|
|
923
|
+
* Responsive column prop type
|
|
924
|
+
*/
|
|
925
|
+
type ResponsiveColumns = Responsive<ColumnValue>;
|
|
926
|
+
/**
|
|
927
|
+
* Responsive row prop type
|
|
928
|
+
*/
|
|
929
|
+
type ResponsiveRows = Responsive<RowValue>;
|
|
930
|
+
/**
|
|
931
|
+
* Responsive flow prop type
|
|
932
|
+
*/
|
|
933
|
+
type ResponsiveFlow = Responsive<FlowValue>;
|
|
934
|
+
/**
|
|
935
|
+
* Surface variant values
|
|
936
|
+
*/
|
|
937
|
+
type SurfaceVariant = "flat" | "raised" | "sunken";
|
|
938
|
+
|
|
939
|
+
/**
|
|
940
|
+
* Box Primitive Component
|
|
941
|
+
*
|
|
942
|
+
* Token-driven base container component with support for padding, margin,
|
|
943
|
+
* display, flex, grid, radius, and shadow. All styling uses token-based
|
|
944
|
+
* Tailwind classes only (no raw numeric values).
|
|
945
|
+
*/
|
|
946
|
+
|
|
947
|
+
/**
|
|
948
|
+
* Box component props
|
|
949
|
+
*/
|
|
950
|
+
interface BoxProps extends React$1.HTMLAttributes<HTMLDivElement> {
|
|
951
|
+
/**
|
|
952
|
+
* Render as different HTML element
|
|
953
|
+
*/
|
|
954
|
+
as?: keyof React$1.JSX.IntrinsicElements;
|
|
955
|
+
/**
|
|
956
|
+
* Padding (all sides) - token-based (xs, sm, md, lg, xl, 2xl, 3xl, 4xl, 5xl)
|
|
957
|
+
*/
|
|
958
|
+
p?: ResponsiveSpacing;
|
|
959
|
+
/**
|
|
960
|
+
* Padding horizontal (left + right)
|
|
961
|
+
*/
|
|
962
|
+
px?: ResponsiveSpacing;
|
|
963
|
+
/**
|
|
964
|
+
* Padding vertical (top + bottom)
|
|
965
|
+
*/
|
|
966
|
+
py?: ResponsiveSpacing;
|
|
967
|
+
/**
|
|
968
|
+
* Padding top
|
|
969
|
+
*/
|
|
970
|
+
pt?: ResponsiveSpacing;
|
|
971
|
+
/**
|
|
972
|
+
* Padding right
|
|
973
|
+
*/
|
|
974
|
+
pr?: ResponsiveSpacing;
|
|
975
|
+
/**
|
|
976
|
+
* Padding bottom
|
|
977
|
+
*/
|
|
978
|
+
pb?: ResponsiveSpacing;
|
|
979
|
+
/**
|
|
980
|
+
* Padding left
|
|
981
|
+
*/
|
|
982
|
+
pl?: ResponsiveSpacing;
|
|
983
|
+
/**
|
|
984
|
+
* Margin (all sides) - token-based
|
|
985
|
+
*/
|
|
986
|
+
m?: ResponsiveSpacing;
|
|
987
|
+
/**
|
|
988
|
+
* Margin horizontal (left + right)
|
|
989
|
+
*/
|
|
990
|
+
mx?: ResponsiveSpacing;
|
|
991
|
+
/**
|
|
992
|
+
* Margin vertical (top + bottom)
|
|
993
|
+
*/
|
|
994
|
+
my?: ResponsiveSpacing;
|
|
995
|
+
/**
|
|
996
|
+
* Margin top
|
|
997
|
+
*/
|
|
998
|
+
mt?: ResponsiveSpacing;
|
|
999
|
+
/**
|
|
1000
|
+
* Margin right
|
|
1001
|
+
*/
|
|
1002
|
+
mr?: ResponsiveSpacing;
|
|
1003
|
+
/**
|
|
1004
|
+
* Margin bottom
|
|
1005
|
+
*/
|
|
1006
|
+
mb?: ResponsiveSpacing;
|
|
1007
|
+
/**
|
|
1008
|
+
* Margin left
|
|
1009
|
+
*/
|
|
1010
|
+
ml?: ResponsiveSpacing;
|
|
1011
|
+
/**
|
|
1012
|
+
* Display type
|
|
1013
|
+
*/
|
|
1014
|
+
display?: DisplayValue;
|
|
1015
|
+
/**
|
|
1016
|
+
* Flex direction (when display is flex)
|
|
1017
|
+
*/
|
|
1018
|
+
flexDirection?: FlexDirectionValue;
|
|
1019
|
+
/**
|
|
1020
|
+
* Border radius - token-based (none, xs, sm, md, lg, xl, 2xl, 3xl, full)
|
|
1021
|
+
*/
|
|
1022
|
+
radius?: ResponsiveRadius;
|
|
1023
|
+
/**
|
|
1024
|
+
* Shadow - token-based (none, xs, sm, md, lg, xl, 2xl)
|
|
1025
|
+
*/
|
|
1026
|
+
shadow?: ShadowValue;
|
|
1027
|
+
/**
|
|
1028
|
+
* Background color - token-based
|
|
1029
|
+
*/
|
|
1030
|
+
bg?: ResponsiveColor;
|
|
1031
|
+
/**
|
|
1032
|
+
* Gap (for flex/grid layouts) - token-based
|
|
1033
|
+
*/
|
|
1034
|
+
gap?: ResponsiveSpacing;
|
|
1035
|
+
/**
|
|
1036
|
+
* Align items (for flex/grid layouts)
|
|
1037
|
+
*/
|
|
1038
|
+
align?: "start" | "end" | "center" | "baseline" | "stretch";
|
|
1039
|
+
/**
|
|
1040
|
+
* Justify content (for flex/grid layouts)
|
|
1041
|
+
*/
|
|
1042
|
+
justify?: "start" | "end" | "center" | "between" | "around" | "evenly";
|
|
1043
|
+
}
|
|
1044
|
+
/**
|
|
1045
|
+
* Box component
|
|
1046
|
+
*/
|
|
1047
|
+
declare const Box: React$1.ForwardRefExoticComponent<BoxProps & React$1.RefAttributes<HTMLDivElement>>;
|
|
1048
|
+
|
|
1049
|
+
/**
|
|
1050
|
+
* Stack Primitive Component
|
|
1051
|
+
*
|
|
1052
|
+
* Token-driven vertical layout component (flex column). Uses Box internally
|
|
1053
|
+
* with flex display and column direction. All spacing uses token-based values.
|
|
1054
|
+
*/
|
|
1055
|
+
|
|
1056
|
+
interface StackProps extends Omit<BoxProps, "display" | "flexDirection" | "gap"> {
|
|
1057
|
+
/**
|
|
1058
|
+
* Stack direction - vertical (column) or horizontal (row)
|
|
1059
|
+
*/
|
|
1060
|
+
direction?: "vertical" | "horizontal";
|
|
1061
|
+
/**
|
|
1062
|
+
* Spacing between stack items - token-based (xs, sm, md, lg, xl, 2xl, 3xl, 4xl, 5xl)
|
|
1063
|
+
* Alias for gap prop
|
|
1064
|
+
*/
|
|
1065
|
+
spacing?: ResponsiveSpacing;
|
|
1066
|
+
/**
|
|
1067
|
+
* Gap between stack items - token-based (xs, sm, md, lg, xl, 2xl, 3xl, 4xl, 5xl)
|
|
1068
|
+
* Alias for spacing prop
|
|
1069
|
+
*/
|
|
1070
|
+
gap?: ResponsiveSpacing;
|
|
1071
|
+
/**
|
|
1072
|
+
* Align items
|
|
1073
|
+
*/
|
|
1074
|
+
align?: "start" | "end" | "center" | "baseline" | "stretch";
|
|
1075
|
+
/**
|
|
1076
|
+
* Justify content
|
|
1077
|
+
*/
|
|
1078
|
+
justify?: "start" | "end" | "center" | "between" | "around" | "evenly";
|
|
1079
|
+
}
|
|
1080
|
+
/**
|
|
1081
|
+
* Stack component - vertical layout using flex column by default
|
|
1082
|
+
*/
|
|
1083
|
+
declare const Stack: React$1.ForwardRefExoticComponent<StackProps & React$1.RefAttributes<HTMLDivElement>>;
|
|
1084
|
+
|
|
1085
|
+
/**
|
|
1086
|
+
* Column component - alias for Stack (semantic name)
|
|
1087
|
+
*/
|
|
1088
|
+
declare const Column: React$1.ForwardRefExoticComponent<StackProps & React$1.RefAttributes<HTMLDivElement>>;
|
|
1089
|
+
|
|
1090
|
+
/**
|
|
1091
|
+
* Container Layout Primitive Component
|
|
1092
|
+
*
|
|
1093
|
+
* Token-driven container component for constraining content width and centering.
|
|
1094
|
+
* Uses CSS-layer class .tm-container with token-based padding and max-width.
|
|
1095
|
+
*/
|
|
1096
|
+
|
|
1097
|
+
interface ContainerProps extends React$1.HTMLAttributes<HTMLDivElement> {
|
|
1098
|
+
/**
|
|
1099
|
+
* Maximum width of the container
|
|
1100
|
+
* Token-based: accepts container size tokens (sm, md, lg, xl, 2xl, 3xl, 4xl, 5xl, 6xl, 7xl, full) or spacing tokens
|
|
1101
|
+
* @example maxWidth="lg" // 32rem (512px)
|
|
1102
|
+
* @example maxWidth={{ base: "md", lg: "xl" }} // Responsive
|
|
1103
|
+
* @example maxWidth="96" // Uses spacing token
|
|
1104
|
+
*/
|
|
1105
|
+
maxWidth?: ResponsiveContainerMaxWidth;
|
|
1106
|
+
/**
|
|
1107
|
+
* Padding (horizontal) - token-based
|
|
1108
|
+
* Supports: spacing tokens or container spacing tokens (container-xs, container-sm, container-md, etc.)
|
|
1109
|
+
* Default: container-md (24px)
|
|
1110
|
+
*/
|
|
1111
|
+
padding?: ResponsiveSpacing;
|
|
1112
|
+
/**
|
|
1113
|
+
* Center the container horizontally with auto margins
|
|
1114
|
+
* Default: true
|
|
1115
|
+
*/
|
|
1116
|
+
center?: boolean;
|
|
1117
|
+
}
|
|
1118
|
+
/**
|
|
1119
|
+
* Container component - layout primitive for constraining content width
|
|
1120
|
+
*/
|
|
1121
|
+
declare const Container: React$1.ForwardRefExoticComponent<ContainerProps & React$1.RefAttributes<HTMLDivElement>>;
|
|
1122
|
+
|
|
1123
|
+
/**
|
|
1124
|
+
* Flex Primitive Component
|
|
1125
|
+
*
|
|
1126
|
+
* Token-driven flexbox container with full control over direction, wrap,
|
|
1127
|
+
* grow, shrink, basis, alignment, and spacing. Uses Box internally.
|
|
1128
|
+
* All spacing values use tokens only.
|
|
1129
|
+
*/
|
|
1130
|
+
|
|
1131
|
+
interface FlexProps extends Omit<BoxProps, "display" | "flexDirection" | "align" | "justify"> {
|
|
1132
|
+
/**
|
|
1133
|
+
* Flex direction
|
|
1134
|
+
*/
|
|
1135
|
+
direction?: ResponsiveFlexDirection;
|
|
1136
|
+
/**
|
|
1137
|
+
* Flex wrap
|
|
1138
|
+
*/
|
|
1139
|
+
wrap?: ResponsiveFlexWrap;
|
|
1140
|
+
/**
|
|
1141
|
+
* Flex grow (0 or 1, or use Tailwind flex-grow-*)
|
|
1142
|
+
*/
|
|
1143
|
+
grow?: 0 | 1 | boolean;
|
|
1144
|
+
/**
|
|
1145
|
+
* Flex shrink (0 or 1, or use Tailwind flex-shrink-*)
|
|
1146
|
+
*/
|
|
1147
|
+
shrink?: 0 | 1 | boolean;
|
|
1148
|
+
/**
|
|
1149
|
+
* Flex basis - token-based
|
|
1150
|
+
* Accepts spacing tokens (xs, sm, md, lg, etc.) or semantic CSS values (auto, 0, 100%, fit-content, max-content, min-content)
|
|
1151
|
+
* @example basis="md" // Uses spacing token
|
|
1152
|
+
* @example basis="auto" // Semantic CSS value
|
|
1153
|
+
* @example basis={{ base: "sm", md: "lg" }} // Responsive
|
|
1154
|
+
*/
|
|
1155
|
+
basis?: ResponsiveFlexBasis;
|
|
1156
|
+
/**
|
|
1157
|
+
* Align items
|
|
1158
|
+
*/
|
|
1159
|
+
align?: ResponsiveAlignment;
|
|
1160
|
+
/**
|
|
1161
|
+
* Justify content
|
|
1162
|
+
*/
|
|
1163
|
+
justify?: ResponsiveJustify;
|
|
1164
|
+
/**
|
|
1165
|
+
* Gap between flex items - token-based
|
|
1166
|
+
*/
|
|
1167
|
+
gap?: ResponsiveSpacing;
|
|
1168
|
+
}
|
|
1169
|
+
/**
|
|
1170
|
+
* Flex component
|
|
1171
|
+
*/
|
|
1172
|
+
declare const Flex: React$1.ForwardRefExoticComponent<FlexProps & React$1.RefAttributes<HTMLDivElement>>;
|
|
1173
|
+
|
|
1174
|
+
/**
|
|
1175
|
+
* Grid Primitive Component
|
|
1176
|
+
*
|
|
1177
|
+
* Token-driven CSS Grid container with support for columns, rows, gap,
|
|
1178
|
+
* flow, and alignment. Uses Box internally. All spacing values use tokens only.
|
|
1179
|
+
*/
|
|
1180
|
+
|
|
1181
|
+
interface GridProps extends Omit<BoxProps, "display" | "align" | "justify"> {
|
|
1182
|
+
/**
|
|
1183
|
+
* Number of columns (1-6, 12, or none)
|
|
1184
|
+
*/
|
|
1185
|
+
cols?: ResponsiveColumns;
|
|
1186
|
+
/**
|
|
1187
|
+
* Number of columns at sm breakpoint
|
|
1188
|
+
*/
|
|
1189
|
+
sm?: 1 | 2 | 3 | 4 | 5 | 6 | 12 | "none";
|
|
1190
|
+
/**
|
|
1191
|
+
* Number of columns at md breakpoint
|
|
1192
|
+
*/
|
|
1193
|
+
md?: 1 | 2 | 3 | 4 | 5 | 6 | 12 | "none";
|
|
1194
|
+
/**
|
|
1195
|
+
* Number of columns at lg breakpoint
|
|
1196
|
+
*/
|
|
1197
|
+
lg?: 1 | 2 | 3 | 4 | 5 | 6 | 12 | "none";
|
|
1198
|
+
/**
|
|
1199
|
+
* Number of columns at xl breakpoint
|
|
1200
|
+
*/
|
|
1201
|
+
xl?: 1 | 2 | 3 | 4 | 5 | 6 | 12 | "none";
|
|
1202
|
+
/**
|
|
1203
|
+
* Number of columns at 2xl breakpoint
|
|
1204
|
+
*/
|
|
1205
|
+
"2xl"?: 1 | 2 | 3 | 4 | 5 | 6 | 12 | "none";
|
|
1206
|
+
/**
|
|
1207
|
+
* Number of rows (1-6 or none)
|
|
1208
|
+
*/
|
|
1209
|
+
rows?: ResponsiveRows;
|
|
1210
|
+
/**
|
|
1211
|
+
* Gap between grid items - token-based (xs, sm, md, lg, xl, 2xl, 3xl, 4xl, 5xl)
|
|
1212
|
+
*/
|
|
1213
|
+
gap?: ResponsiveSpacing;
|
|
1214
|
+
/**
|
|
1215
|
+
* Grid flow direction
|
|
1216
|
+
*/
|
|
1217
|
+
flow?: ResponsiveFlow;
|
|
1218
|
+
/**
|
|
1219
|
+
* Align items
|
|
1220
|
+
*/
|
|
1221
|
+
align?: ResponsiveAlignment;
|
|
1222
|
+
/**
|
|
1223
|
+
* Justify content
|
|
1224
|
+
*/
|
|
1225
|
+
justify?: ResponsiveJustify;
|
|
1226
|
+
}
|
|
1227
|
+
/**
|
|
1228
|
+
* Grid component
|
|
1229
|
+
*/
|
|
1230
|
+
declare const Grid: React$1.ForwardRefExoticComponent<GridProps & React$1.RefAttributes<HTMLDivElement>>;
|
|
1231
|
+
|
|
1232
|
+
/**
|
|
1233
|
+
* Row Primitive Component
|
|
1234
|
+
*
|
|
1235
|
+
* Token-driven horizontal layout component (flex row). Uses Box internally
|
|
1236
|
+
* with flex display and row direction. All spacing uses token-based values.
|
|
1237
|
+
*/
|
|
1238
|
+
|
|
1239
|
+
interface RowProps extends Omit<BoxProps, "display" | "flexDirection"> {
|
|
1240
|
+
/**
|
|
1241
|
+
* Gap between row items - token-based (xs, sm, md, lg, xl, 2xl, 3xl, 4xl, 5xl)
|
|
1242
|
+
*/
|
|
1243
|
+
gap?: ResponsiveSpacing;
|
|
1244
|
+
/**
|
|
1245
|
+
* Align items
|
|
1246
|
+
*/
|
|
1247
|
+
align?: "start" | "end" | "center" | "baseline" | "stretch";
|
|
1248
|
+
/**
|
|
1249
|
+
* Justify content
|
|
1250
|
+
*/
|
|
1251
|
+
justify?: "start" | "end" | "center" | "between" | "around" | "evenly";
|
|
1252
|
+
}
|
|
1253
|
+
/**
|
|
1254
|
+
* Row component - horizontal layout using flex row
|
|
1255
|
+
*/
|
|
1256
|
+
declare const Row: React$1.ForwardRefExoticComponent<RowProps & React$1.RefAttributes<HTMLDivElement>>;
|
|
1257
|
+
|
|
1258
|
+
declare const surfaceVariants$1: (props?: ({
|
|
1259
|
+
variant?: "flat" | "raised" | "sunken" | null | undefined;
|
|
1260
|
+
} & class_variance_authority_types.ClassProp) | undefined) => string;
|
|
1261
|
+
interface SurfaceProps$1 extends Omit<BoxProps, "bg" | "shadow"> {
|
|
1262
|
+
/**
|
|
1263
|
+
* Surface variant
|
|
1264
|
+
*/
|
|
1265
|
+
variant?: SurfaceVariant;
|
|
1266
|
+
/**
|
|
1267
|
+
* Border radius - token-based
|
|
1268
|
+
*/
|
|
1269
|
+
radius?: BoxProps["radius"];
|
|
1270
|
+
}
|
|
1271
|
+
/**
|
|
1272
|
+
* Surface component - elevation variant component
|
|
1273
|
+
*/
|
|
1274
|
+
declare const Surface$1: React$1.ForwardRefExoticComponent<SurfaceProps$1 & React$1.RefAttributes<HTMLDivElement>>;
|
|
1275
|
+
|
|
1276
|
+
/**
|
|
1277
|
+
* Card Container Component
|
|
1278
|
+
*
|
|
1279
|
+
* Token-driven card component with Header, Body, and Footer subcomponents.
|
|
1280
|
+
* Uses SURFACE_TOKENS + CARD_TOKENS for styling.
|
|
1281
|
+
* All styling uses tokens exclusively (no raw CSS values).
|
|
1282
|
+
*/
|
|
1283
|
+
|
|
1284
|
+
interface CardProps extends Omit<BoxProps, "radius" | "shadow" | "p"> {
|
|
1285
|
+
/**
|
|
1286
|
+
* Card size - maps to CARD_TOKENS.size
|
|
1287
|
+
*/
|
|
1288
|
+
size?: "sm" | "md" | "lg";
|
|
1289
|
+
/**
|
|
1290
|
+
* Border radius - token-based (overrides size default)
|
|
1291
|
+
*/
|
|
1292
|
+
radius?: ResponsiveRadius;
|
|
1293
|
+
/**
|
|
1294
|
+
* Shadow - token-based (overrides size default)
|
|
1295
|
+
*/
|
|
1296
|
+
shadow?: ShadowValue;
|
|
1297
|
+
/**
|
|
1298
|
+
* Padding - token-based (overrides size default)
|
|
1299
|
+
*/
|
|
1300
|
+
p?: ResponsiveSpacing;
|
|
1301
|
+
}
|
|
1302
|
+
/**
|
|
1303
|
+
* Card component - main container
|
|
1304
|
+
*/
|
|
1305
|
+
declare const Card: React$1.ForwardRefExoticComponent<CardProps & React$1.RefAttributes<HTMLDivElement>>;
|
|
1306
|
+
/**
|
|
1307
|
+
* CardHeader component - uses Stack for vertical spacing
|
|
1308
|
+
*/
|
|
1309
|
+
interface CardHeaderProps extends React$1.HTMLAttributes<HTMLDivElement> {
|
|
1310
|
+
/**
|
|
1311
|
+
* Card size - determines padding from CARD_TOKENS
|
|
1312
|
+
*/
|
|
1313
|
+
size?: "sm" | "md" | "lg";
|
|
1314
|
+
/**
|
|
1315
|
+
* Padding - token-based (overrides size default)
|
|
1316
|
+
*/
|
|
1317
|
+
p?: ResponsiveSpacing;
|
|
1318
|
+
}
|
|
1319
|
+
declare const CardHeader: React$1.ForwardRefExoticComponent<CardHeaderProps & React$1.RefAttributes<HTMLDivElement>>;
|
|
1320
|
+
/**
|
|
1321
|
+
* CardBody component - main content area
|
|
1322
|
+
*/
|
|
1323
|
+
interface CardBodyProps extends React$1.HTMLAttributes<HTMLDivElement> {
|
|
1324
|
+
/**
|
|
1325
|
+
* Card size - determines padding from CARD_TOKENS
|
|
1326
|
+
*/
|
|
1327
|
+
size?: "sm" | "md" | "lg";
|
|
1328
|
+
/**
|
|
1329
|
+
* Padding - token-based (overrides size default)
|
|
1330
|
+
*/
|
|
1331
|
+
p?: ResponsiveSpacing;
|
|
1332
|
+
}
|
|
1333
|
+
declare const CardBody: React$1.ForwardRefExoticComponent<CardBodyProps & React$1.RefAttributes<HTMLDivElement>>;
|
|
1334
|
+
/**
|
|
1335
|
+
* CardFooter component - uses Row for horizontal layout
|
|
1336
|
+
*/
|
|
1337
|
+
interface CardFooterProps extends React$1.HTMLAttributes<HTMLDivElement> {
|
|
1338
|
+
/**
|
|
1339
|
+
* Card size - determines padding from CARD_TOKENS
|
|
1340
|
+
*/
|
|
1341
|
+
size?: "sm" | "md" | "lg";
|
|
1342
|
+
/**
|
|
1343
|
+
* Padding - token-based (overrides size default)
|
|
1344
|
+
*/
|
|
1345
|
+
p?: ResponsiveSpacing;
|
|
1346
|
+
}
|
|
1347
|
+
declare const CardFooter: React$1.ForwardRefExoticComponent<CardFooterProps & React$1.RefAttributes<HTMLDivElement>>;
|
|
1348
|
+
|
|
1349
|
+
/**
|
|
1350
|
+
* Section Container Component
|
|
1351
|
+
*
|
|
1352
|
+
* Token-driven section component for page/landing layout composition.
|
|
1353
|
+
* Uses SECTION_TOKENS for padding and spacing.
|
|
1354
|
+
* Uses Stack internally for content block composition.
|
|
1355
|
+
* All styling uses tokens exclusively (no raw CSS values).
|
|
1356
|
+
*/
|
|
1357
|
+
|
|
1358
|
+
interface SectionProps extends Omit<StackProps, "py" | "gap"> {
|
|
1359
|
+
/**
|
|
1360
|
+
* Vertical padding - token-based
|
|
1361
|
+
* Accepts spacing tokens (xs, sm, md, lg, xl, 2xl, etc.) or responsive object
|
|
1362
|
+
* @example padding="md"
|
|
1363
|
+
* @example padding={{ base: "sm", lg: "xl" }}
|
|
1364
|
+
*/
|
|
1365
|
+
padding?: ResponsiveSpacing;
|
|
1366
|
+
/**
|
|
1367
|
+
* Gap spacing for content blocks - token-based
|
|
1368
|
+
* Accepts spacing tokens (xs, sm, md, lg, xl, 2xl, etc.) or responsive object
|
|
1369
|
+
* @example gap="md"
|
|
1370
|
+
* @example gap={{ base: "sm", lg: "xl" }}
|
|
1371
|
+
*/
|
|
1372
|
+
gap?: ResponsiveSpacing;
|
|
1373
|
+
/**
|
|
1374
|
+
* Render as different HTML element
|
|
1375
|
+
*/
|
|
1376
|
+
as?: keyof React$1.JSX.IntrinsicElements;
|
|
1377
|
+
}
|
|
1378
|
+
/**
|
|
1379
|
+
* Section component - page/landing layout container
|
|
1380
|
+
*/
|
|
1381
|
+
declare const Section: React$1.ForwardRefExoticComponent<SectionProps & React$1.RefAttributes<HTMLDivElement>>;
|
|
1382
|
+
|
|
1383
|
+
declare const surfaceVariants: (props?: ({
|
|
1384
|
+
variant?: "flat" | "raised" | "sunken" | "outline" | "subtle" | null | undefined;
|
|
1385
|
+
} & class_variance_authority_types.ClassProp) | undefined) => string;
|
|
1386
|
+
interface SurfaceProps extends Omit<BoxProps, "bg" | "shadow" | "radius" | "p">, VariantProps<typeof surfaceVariants> {
|
|
1387
|
+
/**
|
|
1388
|
+
* Surface variant
|
|
1389
|
+
*/
|
|
1390
|
+
variant?: "flat" | "raised" | "sunken" | "outline" | "subtle";
|
|
1391
|
+
/**
|
|
1392
|
+
* Padding - token-based (sm, md, lg, xl)
|
|
1393
|
+
* Overrides default variant padding
|
|
1394
|
+
*/
|
|
1395
|
+
p?: ResponsiveSpacing;
|
|
1396
|
+
/**
|
|
1397
|
+
* Border radius - token-based (sm, md, lg, xl, 2xl, 3xl, full)
|
|
1398
|
+
* Overrides default variant radius
|
|
1399
|
+
*/
|
|
1400
|
+
radius?: ResponsiveRadius;
|
|
1401
|
+
}
|
|
1402
|
+
/**
|
|
1403
|
+
* Surface component - elevation variant container
|
|
1404
|
+
*/
|
|
1405
|
+
declare const Surface: React$1.ForwardRefExoticComponent<SurfaceProps & React$1.RefAttributes<HTMLDivElement>>;
|
|
1406
|
+
|
|
1407
|
+
/**
|
|
1408
|
+
* Portal Component
|
|
1409
|
+
*
|
|
1410
|
+
* SSR-safe portal component for rendering children outside the DOM hierarchy.
|
|
1411
|
+
* Mounts to document.body by default, with optional custom container support.
|
|
1412
|
+
*/
|
|
1413
|
+
|
|
1414
|
+
interface PortalProps {
|
|
1415
|
+
/**
|
|
1416
|
+
* Children to portal
|
|
1417
|
+
*/
|
|
1418
|
+
children: React$1.ReactNode;
|
|
1419
|
+
/**
|
|
1420
|
+
* Container element to portal into (defaults to document.body)
|
|
1421
|
+
*/
|
|
1422
|
+
container?: Element | null;
|
|
1423
|
+
/**
|
|
1424
|
+
* Additional CSS classes
|
|
1425
|
+
*/
|
|
1426
|
+
className?: string;
|
|
1427
|
+
/**
|
|
1428
|
+
* Additional inline styles
|
|
1429
|
+
*/
|
|
1430
|
+
style?: React$1.CSSProperties;
|
|
1431
|
+
}
|
|
1432
|
+
/**
|
|
1433
|
+
* Portal component - SSR-safe portal rendering
|
|
1434
|
+
*/
|
|
1435
|
+
declare const Portal: React$1.ForwardRefExoticComponent<PortalProps & React$1.RefAttributes<HTMLDivElement>>;
|
|
1436
|
+
|
|
1437
|
+
declare const backdropVariants: (props?: ({
|
|
1438
|
+
variant?: "default" | "transparent" | "blurred" | null | undefined;
|
|
1439
|
+
} & class_variance_authority_types.ClassProp) | undefined) => string;
|
|
1440
|
+
interface BackdropProps extends React$1.HTMLAttributes<HTMLDivElement>, VariantProps<typeof backdropVariants> {
|
|
1441
|
+
/**
|
|
1442
|
+
* Backdrop variant
|
|
1443
|
+
*/
|
|
1444
|
+
variant?: "default" | "blurred" | "transparent";
|
|
1445
|
+
/**
|
|
1446
|
+
* Whether backdrop is visible (for animation)
|
|
1447
|
+
*/
|
|
1448
|
+
isVisible?: boolean;
|
|
1449
|
+
/**
|
|
1450
|
+
* Click handler for backdrop dismiss
|
|
1451
|
+
*/
|
|
1452
|
+
onClick?: (event: React$1.MouseEvent<HTMLDivElement>) => void;
|
|
1453
|
+
}
|
|
1454
|
+
/**
|
|
1455
|
+
* Backdrop component - overlay background
|
|
1456
|
+
*/
|
|
1457
|
+
declare const Backdrop: React$1.ForwardRefExoticComponent<BackdropProps & React$1.RefAttributes<HTMLDivElement>>;
|
|
1458
|
+
|
|
1459
|
+
/**
|
|
1460
|
+
* Dialog Component
|
|
1461
|
+
*
|
|
1462
|
+
* Semantic modal wrapper built on Modal component.
|
|
1463
|
+
* Provides Dialog.Header, Dialog.Title, Dialog.Description, Dialog.Body, Dialog.Footer subcomponents.
|
|
1464
|
+
* Full A11y compliance with aria-labelledby and aria-describedby.
|
|
1465
|
+
*/
|
|
1466
|
+
|
|
1467
|
+
interface DialogProps extends React$1.ComponentPropsWithoutRef<typeof Modal.Root> {
|
|
1468
|
+
/**
|
|
1469
|
+
* ID for the dialog title (for aria-labelledby)
|
|
1470
|
+
*/
|
|
1471
|
+
titleId?: string;
|
|
1472
|
+
/**
|
|
1473
|
+
* ID for the dialog description (for aria-describedby)
|
|
1474
|
+
*/
|
|
1475
|
+
descriptionId?: string;
|
|
1476
|
+
}
|
|
1477
|
+
/**
|
|
1478
|
+
* Dialog Root - Main dialog wrapper
|
|
1479
|
+
*
|
|
1480
|
+
* **Note:** This component is a semantic wrapper over Modal.Root and Modal.Content.
|
|
1481
|
+
* It provides Dialog-specific subcomponents but uses the new Radix-based Modal internally.
|
|
1482
|
+
*/
|
|
1483
|
+
declare const DialogRoot: React$1.FC<DialogProps>;
|
|
1484
|
+
/**
|
|
1485
|
+
* Dialog Header - Header section with spacing
|
|
1486
|
+
*/
|
|
1487
|
+
interface DialogHeaderProps extends React$1.HTMLAttributes<HTMLDivElement> {
|
|
1488
|
+
titleId?: string;
|
|
1489
|
+
descriptionId?: string;
|
|
1490
|
+
}
|
|
1491
|
+
declare const DialogHeader: React$1.ForwardRefExoticComponent<DialogHeaderProps & React$1.RefAttributes<HTMLDivElement>>;
|
|
1492
|
+
/**
|
|
1493
|
+
* Dialog Title - h2 with aria-labelledby
|
|
1494
|
+
*/
|
|
1495
|
+
interface DialogTitleProps extends React$1.HTMLAttributes<HTMLHeadingElement> {
|
|
1496
|
+
titleId?: string;
|
|
1497
|
+
}
|
|
1498
|
+
declare const DialogTitle: React$1.ForwardRefExoticComponent<DialogTitleProps & React$1.RefAttributes<HTMLHeadingElement>>;
|
|
1499
|
+
/**
|
|
1500
|
+
* Dialog Description - p with aria-describedby
|
|
1501
|
+
*/
|
|
1502
|
+
interface DialogDescriptionProps extends React$1.HTMLAttributes<HTMLParagraphElement> {
|
|
1503
|
+
descriptionId?: string;
|
|
1504
|
+
}
|
|
1505
|
+
declare const DialogDescription: React$1.ForwardRefExoticComponent<DialogDescriptionProps & React$1.RefAttributes<HTMLParagraphElement>>;
|
|
1506
|
+
/**
|
|
1507
|
+
* Dialog Body - Main content area
|
|
1508
|
+
*/
|
|
1509
|
+
interface DialogBodyProps extends React$1.HTMLAttributes<HTMLDivElement> {
|
|
1510
|
+
}
|
|
1511
|
+
declare const DialogBody: React$1.ForwardRefExoticComponent<DialogBodyProps & React$1.RefAttributes<HTMLDivElement>>;
|
|
1512
|
+
/**
|
|
1513
|
+
* Dialog Footer - Footer section with Row layout
|
|
1514
|
+
*/
|
|
1515
|
+
interface DialogFooterProps extends React$1.HTMLAttributes<HTMLDivElement> {
|
|
1516
|
+
}
|
|
1517
|
+
declare const DialogFooter: React$1.ForwardRefExoticComponent<DialogFooterProps & React$1.RefAttributes<HTMLDivElement>>;
|
|
1518
|
+
declare const Dialog: React$1.FC<DialogProps> & {
|
|
1519
|
+
Root: React$1.FC<DialogProps>;
|
|
1520
|
+
Header: React$1.ForwardRefExoticComponent<DialogHeaderProps & React$1.RefAttributes<HTMLDivElement>>;
|
|
1521
|
+
Title: React$1.ForwardRefExoticComponent<DialogTitleProps & React$1.RefAttributes<HTMLHeadingElement>>;
|
|
1522
|
+
Description: React$1.ForwardRefExoticComponent<DialogDescriptionProps & React$1.RefAttributes<HTMLParagraphElement>>;
|
|
1523
|
+
Body: React$1.ForwardRefExoticComponent<DialogBodyProps & React$1.RefAttributes<HTMLDivElement>>;
|
|
1524
|
+
Footer: React$1.ForwardRefExoticComponent<DialogFooterProps & React$1.RefAttributes<HTMLDivElement>>;
|
|
1525
|
+
};
|
|
1526
|
+
|
|
1527
|
+
declare const toastVariants: (props?: ({
|
|
1528
|
+
variant?: "default" | "success" | "warning" | "danger" | "info" | null | undefined;
|
|
1529
|
+
} & class_variance_authority_types.ClassProp) | undefined) => string;
|
|
1530
|
+
interface ToastActionData {
|
|
1531
|
+
label: string;
|
|
1532
|
+
onClick: () => void;
|
|
1533
|
+
}
|
|
1534
|
+
interface ToastData {
|
|
1535
|
+
id: string;
|
|
1536
|
+
title?: string;
|
|
1537
|
+
description?: string;
|
|
1538
|
+
variant?: "default" | "success" | "info" | "warning" | "danger";
|
|
1539
|
+
action?: ToastActionData;
|
|
1540
|
+
/**
|
|
1541
|
+
* Toast duration - token-based
|
|
1542
|
+
* Uses motion duration tokens
|
|
1543
|
+
* Passed to Radix Toast.Root duration prop
|
|
1544
|
+
*/
|
|
1545
|
+
duration?: ResponsiveDelay;
|
|
1546
|
+
}
|
|
1547
|
+
interface ToastRootProps extends Omit<React$1.ComponentPropsWithoutRef<typeof ToastPrimitives.Root>, "duration">, VariantProps<typeof toastVariants> {
|
|
1548
|
+
/**
|
|
1549
|
+
* Toast data
|
|
1550
|
+
*/
|
|
1551
|
+
toast: ToastData;
|
|
1552
|
+
}
|
|
1553
|
+
/**
|
|
1554
|
+
* Toast Action component
|
|
1555
|
+
* Wrapper around Radix Toast.Action with token-based styling
|
|
1556
|
+
*/
|
|
1557
|
+
declare const ToastAction: React$1.ForwardRefExoticComponent<Omit<ToastPrimitives.ToastActionProps & React$1.RefAttributes<HTMLButtonElement>, "ref"> & React$1.RefAttributes<HTMLButtonElement>>;
|
|
1558
|
+
/**
|
|
1559
|
+
* Legacy Exports (Backward Compatibility)
|
|
1560
|
+
*
|
|
1561
|
+
* These exports maintain backward compatibility with existing code:
|
|
1562
|
+
*
|
|
1563
|
+
* - Toast: Alias for ToastRoot
|
|
1564
|
+
* Rationale: Previous API used `Toast` as the main component name.
|
|
1565
|
+
* This alias allows existing code to continue working without changes.
|
|
1566
|
+
* Note: This is a simple alias - no legacy behavior is preserved.
|
|
1567
|
+
* The component is fully Radix-based regardless of which name is used.
|
|
1568
|
+
*
|
|
1569
|
+
* - ToastProps: Alias for ToastRootProps
|
|
1570
|
+
* Rationale: Previous API used `ToastProps` as the type name.
|
|
1571
|
+
* This alias maintains type compatibility for existing TypeScript code.
|
|
1572
|
+
*
|
|
1573
|
+
* Migration Path:
|
|
1574
|
+
* - Existing code using `Toast` will continue to work
|
|
1575
|
+
* - New code should use `ToastRoot` for clarity
|
|
1576
|
+
* - These legacy exports may be removed in a future major version
|
|
1577
|
+
*/
|
|
1578
|
+
type ToastProps = ToastRootProps;
|
|
1579
|
+
declare const Toast: React$1.ForwardRefExoticComponent<ToastRootProps & React$1.RefAttributes<HTMLLIElement>>;
|
|
1580
|
+
|
|
1581
|
+
/**
|
|
1582
|
+
* ToastViewport Component
|
|
1583
|
+
*
|
|
1584
|
+
* 🔒 FOUNDATION COMPONENT - ARCHITECTURE LOCKED
|
|
1585
|
+
*
|
|
1586
|
+
* Radix-based toast viewport with token-driven positioning.
|
|
1587
|
+
* Radix Toast.Viewport handles portal rendering internally.
|
|
1588
|
+
* Tenerife UI provides visual styling and positioning through tokens only.
|
|
1589
|
+
*
|
|
1590
|
+
* This component is locked as a foundation component per TUI_ARCHITECTURE_LOCK.md.
|
|
1591
|
+
* DO NOT reimplement portal logic - Radix handles this internally.
|
|
1592
|
+
*/
|
|
1593
|
+
|
|
1594
|
+
type ToastPosition = "top-left" | "top-center" | "top-right" | "bottom-left" | "bottom-center" | "bottom-right";
|
|
1595
|
+
interface ToastViewportProps extends React$1.ComponentPropsWithoutRef<typeof ToastPrimitives.Viewport> {
|
|
1596
|
+
/**
|
|
1597
|
+
* Position of toast viewport
|
|
1598
|
+
*/
|
|
1599
|
+
position?: ToastPosition;
|
|
1600
|
+
}
|
|
1601
|
+
/**
|
|
1602
|
+
* ToastViewport component
|
|
1603
|
+
* Wrapper around Radix Toast.Viewport with token-based positioning.
|
|
1604
|
+
* Radix handles portal rendering internally - no custom Portal needed.
|
|
1605
|
+
*/
|
|
1606
|
+
declare const ToastViewport: React$1.ForwardRefExoticComponent<ToastViewportProps & React$1.RefAttributes<HTMLOListElement>>;
|
|
1607
|
+
|
|
1608
|
+
interface ToastOptions {
|
|
1609
|
+
title?: string;
|
|
1610
|
+
description?: string;
|
|
1611
|
+
variant?: "default" | "success" | "info" | "warning" | "danger";
|
|
1612
|
+
action?: ToastActionData;
|
|
1613
|
+
/**
|
|
1614
|
+
* Toast duration - token-based
|
|
1615
|
+
* Uses motion duration tokens
|
|
1616
|
+
* Passed to Radix Toast.Root duration prop (Radix handles auto-dismiss)
|
|
1617
|
+
*/
|
|
1618
|
+
duration?: ResponsiveDelay;
|
|
1619
|
+
}
|
|
1620
|
+
interface ToastContextType {
|
|
1621
|
+
toast: (options: ToastOptions) => string;
|
|
1622
|
+
dismiss: (id: string) => void;
|
|
1623
|
+
dismissAll: () => void;
|
|
1624
|
+
}
|
|
1625
|
+
interface ToastProviderProps {
|
|
1626
|
+
/**
|
|
1627
|
+
* Children to render
|
|
1628
|
+
*/
|
|
1629
|
+
children: React$1.ReactNode;
|
|
1630
|
+
/**
|
|
1631
|
+
* Position of toast viewport
|
|
1632
|
+
*/
|
|
1633
|
+
position?: ToastPosition;
|
|
1634
|
+
/**
|
|
1635
|
+
* Swipe direction for toast dismissal
|
|
1636
|
+
* Radix handles swipe gestures internally
|
|
1637
|
+
*/
|
|
1638
|
+
swipeDirection?: "up" | "down" | "left" | "right";
|
|
1639
|
+
/**
|
|
1640
|
+
* Default duration for toasts in milliseconds
|
|
1641
|
+
* Radix handles auto-dismiss based on this value
|
|
1642
|
+
*
|
|
1643
|
+
* NOTE: This is a behavioral prop for Radix Toast.Provider API (requires number),
|
|
1644
|
+
* not a visual prop. The eslint rule is disabled for this specific case.
|
|
1645
|
+
*/
|
|
1646
|
+
duration?: number;
|
|
1647
|
+
}
|
|
1648
|
+
/**
|
|
1649
|
+
* ToastProvider component
|
|
1650
|
+
* Wrapper around Radix Toast.Provider with convenience toast() function.
|
|
1651
|
+
* Radix handles all state management, auto-dismiss, and queue management.
|
|
1652
|
+
*/
|
|
1653
|
+
declare function ToastProvider({ children, position, swipeDirection, duration, }: ToastProviderProps): react_jsx_runtime.JSX.Element;
|
|
1654
|
+
/**
|
|
1655
|
+
* Hook to use toast context
|
|
1656
|
+
*/
|
|
1657
|
+
declare function useToast(): ToastContextType;
|
|
1658
|
+
|
|
1659
|
+
/**
|
|
1660
|
+
* NotificationCenter.DismissAll Component
|
|
1661
|
+
*
|
|
1662
|
+
* Button component to clear all notifications.
|
|
1663
|
+
* Located in Panel header.
|
|
1664
|
+
*/
|
|
1665
|
+
|
|
1666
|
+
interface NotificationCenterDismissAllProps extends React$1.ButtonHTMLAttributes<HTMLButtonElement> {
|
|
1667
|
+
/**
|
|
1668
|
+
* Show confirmation before clearing
|
|
1669
|
+
*/
|
|
1670
|
+
confirm?: boolean;
|
|
1671
|
+
/**
|
|
1672
|
+
* Confirmation message
|
|
1673
|
+
*/
|
|
1674
|
+
confirmMessage?: string;
|
|
1675
|
+
}
|
|
1676
|
+
/**
|
|
1677
|
+
* NotificationCenter.DismissAll component - clear all notifications button
|
|
1678
|
+
*/
|
|
1679
|
+
declare const NotificationCenterDismissAll: React$1.ForwardRefExoticComponent<NotificationCenterDismissAllProps & React$1.RefAttributes<HTMLButtonElement>>;
|
|
1680
|
+
|
|
1681
|
+
interface NotificationCenterGroupHeaderProps extends React$1.HTMLAttributes<HTMLDivElement> {
|
|
1682
|
+
/**
|
|
1683
|
+
* Group label text
|
|
1684
|
+
*/
|
|
1685
|
+
label: string;
|
|
1686
|
+
/**
|
|
1687
|
+
* Whether the group is collapsed
|
|
1688
|
+
*/
|
|
1689
|
+
collapsed?: boolean;
|
|
1690
|
+
/**
|
|
1691
|
+
* Callback when collapse/expand is toggled
|
|
1692
|
+
*/
|
|
1693
|
+
onToggleCollapse?: () => void;
|
|
1694
|
+
/**
|
|
1695
|
+
* Show collapse/expand button
|
|
1696
|
+
*/
|
|
1697
|
+
collapsible?: boolean;
|
|
1698
|
+
}
|
|
1699
|
+
/**
|
|
1700
|
+
* NotificationCenter.GroupHeader component - group section header
|
|
1701
|
+
*/
|
|
1702
|
+
declare const NotificationCenterGroupHeader: React$1.ForwardRefExoticComponent<NotificationCenterGroupHeaderProps & React$1.RefAttributes<HTMLDivElement>>;
|
|
1703
|
+
|
|
1704
|
+
/**
|
|
1705
|
+
* Notification Center Types
|
|
1706
|
+
*
|
|
1707
|
+
* Type definitions for Notification Center components.
|
|
1708
|
+
*/
|
|
1709
|
+
|
|
1710
|
+
/**
|
|
1711
|
+
* Notification channel types
|
|
1712
|
+
*/
|
|
1713
|
+
type NotificationChannel = "success" | "error" | "info" | "warning" | "system" | "log";
|
|
1714
|
+
/**
|
|
1715
|
+
* Notification variant (extends toast variants)
|
|
1716
|
+
*/
|
|
1717
|
+
type NotificationVariant = "default" | "success" | "info" | "warning" | "danger" | "system" | "log";
|
|
1718
|
+
/**
|
|
1719
|
+
* Notification data structure
|
|
1720
|
+
*/
|
|
1721
|
+
interface NotificationData {
|
|
1722
|
+
id: string;
|
|
1723
|
+
title?: string;
|
|
1724
|
+
description?: string;
|
|
1725
|
+
variant?: NotificationVariant;
|
|
1726
|
+
channel?: NotificationChannel;
|
|
1727
|
+
action?: ToastActionData;
|
|
1728
|
+
/**
|
|
1729
|
+
* Notification duration - token-based
|
|
1730
|
+
* Uses motion duration tokens
|
|
1731
|
+
*/
|
|
1732
|
+
duration?: ResponsiveDelay;
|
|
1733
|
+
persistent?: boolean;
|
|
1734
|
+
timestamp: number;
|
|
1735
|
+
read?: boolean;
|
|
1736
|
+
}
|
|
1737
|
+
/**
|
|
1738
|
+
* Notification options for creating notifications
|
|
1739
|
+
*/
|
|
1740
|
+
interface NotificationOptions {
|
|
1741
|
+
title?: string;
|
|
1742
|
+
description?: string;
|
|
1743
|
+
variant?: NotificationVariant;
|
|
1744
|
+
channel?: NotificationChannel;
|
|
1745
|
+
action?: ToastActionData;
|
|
1746
|
+
/**
|
|
1747
|
+
* Notification duration - token-based
|
|
1748
|
+
* Uses motion duration tokens
|
|
1749
|
+
*/
|
|
1750
|
+
duration?: ResponsiveDelay;
|
|
1751
|
+
persistent?: boolean;
|
|
1752
|
+
}
|
|
1753
|
+
/**
|
|
1754
|
+
* Group by function type
|
|
1755
|
+
*/
|
|
1756
|
+
type GroupByFunction = (notification: NotificationData) => string;
|
|
1757
|
+
/**
|
|
1758
|
+
* Notification context type
|
|
1759
|
+
*/
|
|
1760
|
+
interface NotificationContextType {
|
|
1761
|
+
/**
|
|
1762
|
+
* Push a new notification
|
|
1763
|
+
*/
|
|
1764
|
+
push: (notification: NotificationOptions) => string;
|
|
1765
|
+
/**
|
|
1766
|
+
* Remove a specific notification by ID
|
|
1767
|
+
*/
|
|
1768
|
+
remove: (id: string) => void;
|
|
1769
|
+
/**
|
|
1770
|
+
* Clear all notifications
|
|
1771
|
+
*/
|
|
1772
|
+
clearAll: () => void;
|
|
1773
|
+
/**
|
|
1774
|
+
* Clear notifications by channel
|
|
1775
|
+
*/
|
|
1776
|
+
clearChannel: (channel: NotificationChannel) => void;
|
|
1777
|
+
/**
|
|
1778
|
+
* Group notifications by function
|
|
1779
|
+
*/
|
|
1780
|
+
groupBy: (fn: GroupByFunction) => Record<string, NotificationData[]>;
|
|
1781
|
+
/**
|
|
1782
|
+
* Get persistent history
|
|
1783
|
+
*/
|
|
1784
|
+
getHistory: () => NotificationData[];
|
|
1785
|
+
/**
|
|
1786
|
+
* Get notifications by channel
|
|
1787
|
+
*/
|
|
1788
|
+
getByChannel: (channel: NotificationChannel) => NotificationData[];
|
|
1789
|
+
/**
|
|
1790
|
+
* Get all notifications
|
|
1791
|
+
*/
|
|
1792
|
+
getAll: () => NotificationData[];
|
|
1793
|
+
/**
|
|
1794
|
+
* Mark notification as read
|
|
1795
|
+
*/
|
|
1796
|
+
markAsRead: (id: string) => void;
|
|
1797
|
+
/**
|
|
1798
|
+
* Mark all as read
|
|
1799
|
+
*/
|
|
1800
|
+
markAllAsRead: () => void;
|
|
1801
|
+
/**
|
|
1802
|
+
* Get unread count
|
|
1803
|
+
*/
|
|
1804
|
+
getUnreadCount: () => number;
|
|
1805
|
+
}
|
|
1806
|
+
|
|
1807
|
+
interface NotificationCenterItemProps extends Omit<React$1.HTMLAttributes<HTMLLIElement>, "onClick"> {
|
|
1808
|
+
/**
|
|
1809
|
+
* Notification data
|
|
1810
|
+
*/
|
|
1811
|
+
notification: NotificationData;
|
|
1812
|
+
/**
|
|
1813
|
+
* Callback when notification is dismissed
|
|
1814
|
+
*/
|
|
1815
|
+
onDismiss?: (id: string) => void;
|
|
1816
|
+
/**
|
|
1817
|
+
* Callback when notification is clicked
|
|
1818
|
+
*/
|
|
1819
|
+
onClick?: (id: string) => void;
|
|
1820
|
+
/**
|
|
1821
|
+
* Show expandable details
|
|
1822
|
+
*/
|
|
1823
|
+
expandable?: boolean;
|
|
1824
|
+
}
|
|
1825
|
+
/**
|
|
1826
|
+
* NotificationCenter.Item component - individual notification item
|
|
1827
|
+
*/
|
|
1828
|
+
declare const NotificationCenterItem: React$1.ForwardRefExoticComponent<NotificationCenterItemProps & React$1.RefAttributes<HTMLLIElement>>;
|
|
1829
|
+
|
|
1830
|
+
/**
|
|
1831
|
+
* NotificationCenter.List Component
|
|
1832
|
+
*
|
|
1833
|
+
* Vertical list container for notifications.
|
|
1834
|
+
* Uses Stack component with token-based spacing.
|
|
1835
|
+
* Provides proper ARIA roles for accessibility.
|
|
1836
|
+
*/
|
|
1837
|
+
|
|
1838
|
+
interface NotificationCenterListProps extends React$1.HTMLAttributes<HTMLUListElement> {
|
|
1839
|
+
/**
|
|
1840
|
+
* Children to render (notification items)
|
|
1841
|
+
*/
|
|
1842
|
+
children: React$1.ReactNode;
|
|
1843
|
+
/**
|
|
1844
|
+
* ARIA label for the list
|
|
1845
|
+
*/
|
|
1846
|
+
"aria-label"?: string;
|
|
1847
|
+
}
|
|
1848
|
+
/**
|
|
1849
|
+
* NotificationCenter.List component - vertical list container
|
|
1850
|
+
*/
|
|
1851
|
+
declare const NotificationCenterList: React$1.ForwardRefExoticComponent<NotificationCenterListProps & React$1.RefAttributes<HTMLUListElement>>;
|
|
1852
|
+
|
|
1853
|
+
interface NotificationCenterTriggerProps extends React$1.ButtonHTMLAttributes<HTMLButtonElement> {
|
|
1854
|
+
/**
|
|
1855
|
+
* Callback when trigger is clicked
|
|
1856
|
+
*/
|
|
1857
|
+
onClick?: () => void;
|
|
1858
|
+
/**
|
|
1859
|
+
* Show unread badge
|
|
1860
|
+
*/
|
|
1861
|
+
showBadge?: boolean;
|
|
1862
|
+
}
|
|
1863
|
+
/**
|
|
1864
|
+
* NotificationCenter.Trigger component - open panel button
|
|
1865
|
+
*/
|
|
1866
|
+
declare const NotificationCenterTrigger: React$1.ForwardRefExoticComponent<NotificationCenterTriggerProps & React$1.RefAttributes<HTMLButtonElement>>;
|
|
1867
|
+
|
|
1868
|
+
interface NotificationCenterPanelProps {
|
|
1869
|
+
/**
|
|
1870
|
+
* Whether panel is open
|
|
1871
|
+
*/
|
|
1872
|
+
isOpen: boolean;
|
|
1873
|
+
/**
|
|
1874
|
+
* Callback when panel should close
|
|
1875
|
+
*/
|
|
1876
|
+
onClose: () => void;
|
|
1877
|
+
/**
|
|
1878
|
+
* Function to group notifications (by date, type, or custom)
|
|
1879
|
+
*/
|
|
1880
|
+
groupBy?: GroupByFunction;
|
|
1881
|
+
/**
|
|
1882
|
+
* Panel width variant
|
|
1883
|
+
*/
|
|
1884
|
+
width?: "sm" | "md" | "lg";
|
|
1885
|
+
/**
|
|
1886
|
+
* Auto-collapse older notifications
|
|
1887
|
+
*/
|
|
1888
|
+
autoCollapse?: boolean;
|
|
1889
|
+
/**
|
|
1890
|
+
* Element to return focus to when panel closes
|
|
1891
|
+
*/
|
|
1892
|
+
returnFocusRef?: React$1.RefObject<HTMLElement>;
|
|
1893
|
+
}
|
|
1894
|
+
/**
|
|
1895
|
+
* NotificationCenter.Panel component - side drawer notification panel
|
|
1896
|
+
*/
|
|
1897
|
+
declare const NotificationCenterPanel: React$1.ForwardRefExoticComponent<NotificationCenterPanelProps & React$1.RefAttributes<HTMLDivElement>>;
|
|
1898
|
+
|
|
1899
|
+
interface NotificationCenterProviderProps {
|
|
1900
|
+
/**
|
|
1901
|
+
* Children to render
|
|
1902
|
+
*/
|
|
1903
|
+
children: React$1.ReactNode;
|
|
1904
|
+
/**
|
|
1905
|
+
* Maximum number of notifications to keep in history
|
|
1906
|
+
*/
|
|
1907
|
+
maxHistory?: number;
|
|
1908
|
+
/**
|
|
1909
|
+
* Enable persistent history (in-memory, can be extended to localStorage)
|
|
1910
|
+
*/
|
|
1911
|
+
persistent?: boolean;
|
|
1912
|
+
}
|
|
1913
|
+
/**
|
|
1914
|
+
* NotificationCenter.Provider component - global notification state management
|
|
1915
|
+
*/
|
|
1916
|
+
declare function NotificationCenterProvider({ children, maxHistory, persistent, }: NotificationCenterProviderProps): react_jsx_runtime.JSX.Element;
|
|
1917
|
+
/**
|
|
1918
|
+
* Hook to use notification center context
|
|
1919
|
+
*/
|
|
1920
|
+
declare function useNotificationCenterContext(): NotificationContextType;
|
|
1921
|
+
|
|
1922
|
+
interface NotificationAPI {
|
|
1923
|
+
/**
|
|
1924
|
+
* Show success notification
|
|
1925
|
+
*/
|
|
1926
|
+
success: (message: string, options?: Omit<NotificationOptions, "variant" | "channel">) => string;
|
|
1927
|
+
/**
|
|
1928
|
+
* Show error notification
|
|
1929
|
+
*/
|
|
1930
|
+
error: (message: string, options?: Omit<NotificationOptions, "variant" | "channel">) => string;
|
|
1931
|
+
/**
|
|
1932
|
+
* Show info notification
|
|
1933
|
+
*/
|
|
1934
|
+
info: (message: string, options?: Omit<NotificationOptions, "variant" | "channel">) => string;
|
|
1935
|
+
/**
|
|
1936
|
+
* Show warning notification
|
|
1937
|
+
*/
|
|
1938
|
+
warning: (message: string, options?: Omit<NotificationOptions, "variant" | "channel">) => string;
|
|
1939
|
+
/**
|
|
1940
|
+
* Show system notification
|
|
1941
|
+
*/
|
|
1942
|
+
system: (message: string, options?: Omit<NotificationOptions, "variant" | "channel">) => string;
|
|
1943
|
+
/**
|
|
1944
|
+
* Show log notification
|
|
1945
|
+
*/
|
|
1946
|
+
log: (message: string, options?: Omit<NotificationOptions, "variant" | "channel">) => string;
|
|
1947
|
+
/**
|
|
1948
|
+
* Push custom notification
|
|
1949
|
+
*/
|
|
1950
|
+
push: (options: NotificationOptions) => string;
|
|
1951
|
+
/**
|
|
1952
|
+
* Remove notification by ID
|
|
1953
|
+
*/
|
|
1954
|
+
remove: (id: string) => void;
|
|
1955
|
+
/**
|
|
1956
|
+
* Clear all notifications
|
|
1957
|
+
*/
|
|
1958
|
+
clearAll: () => void;
|
|
1959
|
+
/**
|
|
1960
|
+
* Clear notifications by channel
|
|
1961
|
+
*/
|
|
1962
|
+
clearChannel: (channel: "success" | "error" | "info" | "warning" | "system" | "log") => void;
|
|
1963
|
+
}
|
|
1964
|
+
/**
|
|
1965
|
+
* useNotificationCenter hook - multi-channel notification API
|
|
1966
|
+
*/
|
|
1967
|
+
declare function useNotificationCenter(): NotificationAPI;
|
|
1968
|
+
|
|
1969
|
+
/**
|
|
1970
|
+
* NotificationCenter compound component
|
|
1971
|
+
*/
|
|
1972
|
+
declare const NotificationCenter: {
|
|
1973
|
+
Provider: typeof NotificationCenterProvider;
|
|
1974
|
+
Panel: React$1.ForwardRefExoticComponent<NotificationCenterPanelProps & React$1.RefAttributes<HTMLDivElement>>;
|
|
1975
|
+
Trigger: React$1.ForwardRefExoticComponent<NotificationCenterTriggerProps & React$1.RefAttributes<HTMLButtonElement>>;
|
|
1976
|
+
List: React$1.ForwardRefExoticComponent<NotificationCenterListProps & React$1.RefAttributes<HTMLUListElement>>;
|
|
1977
|
+
Item: React$1.ForwardRefExoticComponent<NotificationCenterItemProps & React$1.RefAttributes<HTMLLIElement>>;
|
|
1978
|
+
GroupHeader: React$1.ForwardRefExoticComponent<NotificationCenterGroupHeaderProps & React$1.RefAttributes<HTMLDivElement>>;
|
|
1979
|
+
DismissAll: React$1.ForwardRefExoticComponent<NotificationCenterDismissAllProps & React$1.RefAttributes<HTMLButtonElement>>;
|
|
1980
|
+
};
|
|
1981
|
+
|
|
1982
|
+
/**
|
|
1983
|
+
* Popover Arrow Component
|
|
1984
|
+
*
|
|
1985
|
+
* Arrow indicator pointing to the trigger element.
|
|
1986
|
+
* Uses POPOVER_TOKENS for sizing and positioning.
|
|
1987
|
+
*/
|
|
1988
|
+
|
|
1989
|
+
interface PopoverArrowProps extends React$1.HTMLAttributes<HTMLDivElement> {
|
|
1990
|
+
/**
|
|
1991
|
+
* Arrow size
|
|
1992
|
+
*/
|
|
1993
|
+
size?: "sm" | "md";
|
|
1994
|
+
}
|
|
1995
|
+
/**
|
|
1996
|
+
* Popover Arrow component
|
|
1997
|
+
*/
|
|
1998
|
+
declare const PopoverArrow: React$1.ForwardRefExoticComponent<PopoverArrowProps & React$1.RefAttributes<HTMLDivElement>>;
|
|
1999
|
+
|
|
2000
|
+
declare const popoverContentVariants: (props?: ({
|
|
2001
|
+
size?: "sm" | "md" | "lg" | "xs" | null | undefined;
|
|
2002
|
+
} & class_variance_authority_types.ClassProp) | undefined) => string;
|
|
2003
|
+
interface PopoverContentProps extends Omit<React$1.HTMLAttributes<HTMLDivElement>, "onAnimationEnd">, VariantProps<typeof popoverContentVariants> {
|
|
2004
|
+
/**
|
|
2005
|
+
* Placement preference
|
|
2006
|
+
*/
|
|
2007
|
+
placement?: Placement;
|
|
2008
|
+
/**
|
|
2009
|
+
* Offset between trigger and content - token-based
|
|
2010
|
+
* Uses spacing tokens for positioning offsets
|
|
2011
|
+
*/
|
|
2012
|
+
offset?: ResponsiveAlignOffset;
|
|
2013
|
+
/**
|
|
2014
|
+
* Whether to close on outside click
|
|
2015
|
+
*/
|
|
2016
|
+
closeOnInteractOutside?: boolean;
|
|
2017
|
+
}
|
|
2018
|
+
/**
|
|
2019
|
+
* Popover Content component
|
|
2020
|
+
*/
|
|
2021
|
+
declare const PopoverContent: React$1.ForwardRefExoticComponent<PopoverContentProps & React$1.RefAttributes<HTMLDivElement>>;
|
|
2022
|
+
|
|
2023
|
+
interface PopoverRootProps {
|
|
2024
|
+
/**
|
|
2025
|
+
* Whether the popover is open (controlled mode)
|
|
2026
|
+
*/
|
|
2027
|
+
open?: boolean;
|
|
2028
|
+
/**
|
|
2029
|
+
* Callback when open state changes
|
|
2030
|
+
*/
|
|
2031
|
+
onOpenChange?: (open: boolean) => void;
|
|
2032
|
+
/**
|
|
2033
|
+
* Default open state (uncontrolled mode)
|
|
2034
|
+
*/
|
|
2035
|
+
defaultOpen?: boolean;
|
|
2036
|
+
/**
|
|
2037
|
+
* Whether the popover is modal (blocks interaction with other elements)
|
|
2038
|
+
*/
|
|
2039
|
+
modal?: boolean;
|
|
2040
|
+
/**
|
|
2041
|
+
* Children
|
|
2042
|
+
*/
|
|
2043
|
+
children: React$1.ReactNode;
|
|
2044
|
+
}
|
|
2045
|
+
/**
|
|
2046
|
+
* Popover Root component
|
|
2047
|
+
*/
|
|
2048
|
+
declare function PopoverRoot({ open: controlledOpen, onOpenChange, defaultOpen, children, }: PopoverRootProps): react_jsx_runtime.JSX.Element;
|
|
2049
|
+
declare namespace PopoverRoot {
|
|
2050
|
+
var displayName: string;
|
|
2051
|
+
}
|
|
2052
|
+
|
|
2053
|
+
/**
|
|
2054
|
+
* Popover Trigger Component
|
|
2055
|
+
*
|
|
2056
|
+
* Trigger element that opens/closes the popover.
|
|
2057
|
+
* Supports asChild pattern for composition.
|
|
2058
|
+
*/
|
|
2059
|
+
|
|
2060
|
+
interface PopoverTriggerProps extends React$1.HTMLAttributes<HTMLElement> {
|
|
2061
|
+
/**
|
|
2062
|
+
* Render as child element (composition pattern)
|
|
2063
|
+
*/
|
|
2064
|
+
asChild?: boolean;
|
|
2065
|
+
}
|
|
2066
|
+
/**
|
|
2067
|
+
* Popover Trigger component
|
|
2068
|
+
*/
|
|
2069
|
+
declare const PopoverTrigger: React$1.ForwardRefExoticComponent<PopoverTriggerProps & React$1.RefAttributes<HTMLElement>>;
|
|
2070
|
+
|
|
2071
|
+
/**
|
|
2072
|
+
* DropdownMenu Item Component
|
|
2073
|
+
*
|
|
2074
|
+
* Menu item with keyboard navigation support (roving tabindex).
|
|
2075
|
+
* Uses MENU_TOKENS for styling.
|
|
2076
|
+
*/
|
|
2077
|
+
|
|
2078
|
+
interface DropdownMenuItemProps extends Omit<React$1.HTMLAttributes<HTMLDivElement>, "onSelect"> {
|
|
2079
|
+
/**
|
|
2080
|
+
* Whether the item is disabled
|
|
2081
|
+
*/
|
|
2082
|
+
disabled?: boolean;
|
|
2083
|
+
/**
|
|
2084
|
+
* Whether the item is selected
|
|
2085
|
+
*/
|
|
2086
|
+
selected?: boolean;
|
|
2087
|
+
/**
|
|
2088
|
+
* Callback when item is selected
|
|
2089
|
+
* Receives native Event (not SyntheticEvent)
|
|
2090
|
+
*/
|
|
2091
|
+
onSelect?: (event: Event) => void;
|
|
2092
|
+
/**
|
|
2093
|
+
* Whether item has inset padding (for nested items)
|
|
2094
|
+
*/
|
|
2095
|
+
inset?: boolean;
|
|
2096
|
+
}
|
|
2097
|
+
/**
|
|
2098
|
+
* DropdownMenu Item component
|
|
2099
|
+
*/
|
|
2100
|
+
declare const DropdownMenuItem: React$1.ForwardRefExoticComponent<DropdownMenuItemProps & React$1.RefAttributes<HTMLDivElement>>;
|
|
2101
|
+
|
|
2102
|
+
/**
|
|
2103
|
+
* DropdownMenu CheckItem Component
|
|
2104
|
+
*
|
|
2105
|
+
* Menu item with checkbox indicator.
|
|
2106
|
+
* Uses MENU_TOKENS for styling.
|
|
2107
|
+
*/
|
|
2108
|
+
|
|
2109
|
+
interface DropdownMenuCheckItemProps extends Omit<DropdownMenuItemProps, "selected"> {
|
|
2110
|
+
/**
|
|
2111
|
+
* Whether the item is checked
|
|
2112
|
+
*/
|
|
2113
|
+
checked?: boolean;
|
|
2114
|
+
}
|
|
2115
|
+
/**
|
|
2116
|
+
* DropdownMenu CheckItem component
|
|
2117
|
+
*/
|
|
2118
|
+
declare const DropdownMenuCheckItem: React$1.ForwardRefExoticComponent<DropdownMenuCheckItemProps & React$1.RefAttributes<HTMLDivElement>>;
|
|
2119
|
+
|
|
2120
|
+
/**
|
|
2121
|
+
* DropdownMenu Content Component
|
|
2122
|
+
*
|
|
2123
|
+
* Content container for dropdown menu.
|
|
2124
|
+
* Wraps PopoverContent with menu-specific styling and role.
|
|
2125
|
+
* Handles keyboard navigation (Arrow keys, Home/End, Escape).
|
|
2126
|
+
*/
|
|
2127
|
+
|
|
2128
|
+
interface DropdownMenuContentProps extends PopoverContentProps {
|
|
2129
|
+
}
|
|
2130
|
+
/**
|
|
2131
|
+
* DropdownMenu Content component
|
|
2132
|
+
*/
|
|
2133
|
+
declare const DropdownMenuContent: React$1.ForwardRefExoticComponent<DropdownMenuContentProps & React$1.RefAttributes<HTMLDivElement>>;
|
|
2134
|
+
|
|
2135
|
+
/**
|
|
2136
|
+
* DropdownMenu Group Component
|
|
2137
|
+
*
|
|
2138
|
+
* Group container for related menu items.
|
|
2139
|
+
*/
|
|
2140
|
+
|
|
2141
|
+
interface DropdownMenuGroupProps extends React$1.HTMLAttributes<HTMLDivElement> {
|
|
2142
|
+
}
|
|
2143
|
+
/**
|
|
2144
|
+
* DropdownMenu Group component
|
|
2145
|
+
*/
|
|
2146
|
+
declare const DropdownMenuGroup: React$1.ForwardRefExoticComponent<DropdownMenuGroupProps & React$1.RefAttributes<HTMLDivElement>>;
|
|
2147
|
+
|
|
2148
|
+
/**
|
|
2149
|
+
* DropdownMenu Label Component
|
|
2150
|
+
*
|
|
2151
|
+
* Label/section header for menu items.
|
|
2152
|
+
* Uses MENU_TOKENS for styling.
|
|
2153
|
+
*/
|
|
2154
|
+
|
|
2155
|
+
interface DropdownMenuLabelProps extends React$1.HTMLAttributes<HTMLDivElement> {
|
|
2156
|
+
/**
|
|
2157
|
+
* Whether label has inset padding (for nested items)
|
|
2158
|
+
*/
|
|
2159
|
+
inset?: boolean;
|
|
2160
|
+
}
|
|
2161
|
+
/**
|
|
2162
|
+
* DropdownMenu Label component
|
|
2163
|
+
*/
|
|
2164
|
+
declare const DropdownMenuLabel: React$1.ForwardRefExoticComponent<DropdownMenuLabelProps & React$1.RefAttributes<HTMLDivElement>>;
|
|
2165
|
+
|
|
2166
|
+
/**
|
|
2167
|
+
* DropdownMenu RadioGroup Component
|
|
2168
|
+
*
|
|
2169
|
+
* Radio group container for radio menu items.
|
|
2170
|
+
*/
|
|
2171
|
+
|
|
2172
|
+
interface DropdownMenuRadioGroupProps extends React$1.HTMLAttributes<HTMLDivElement> {
|
|
2173
|
+
/**
|
|
2174
|
+
* Selected value
|
|
2175
|
+
*/
|
|
2176
|
+
value?: string;
|
|
2177
|
+
/**
|
|
2178
|
+
* Callback when value changes
|
|
2179
|
+
*/
|
|
2180
|
+
onValueChange?: (value: string) => void;
|
|
2181
|
+
}
|
|
2182
|
+
/**
|
|
2183
|
+
* DropdownMenu RadioGroup component
|
|
2184
|
+
*/
|
|
2185
|
+
declare const DropdownMenuRadioGroup: React$1.ForwardRefExoticComponent<DropdownMenuRadioGroupProps & React$1.RefAttributes<HTMLDivElement>>;
|
|
2186
|
+
|
|
2187
|
+
/**
|
|
2188
|
+
* DropdownMenu RadioItem Component
|
|
2189
|
+
*
|
|
2190
|
+
* Menu item with radio indicator.
|
|
2191
|
+
* Uses MENU_TOKENS for styling.
|
|
2192
|
+
*/
|
|
2193
|
+
|
|
2194
|
+
interface DropdownMenuRadioItemProps extends Omit<DropdownMenuItemProps, "selected"> {
|
|
2195
|
+
/**
|
|
2196
|
+
* Radio item value
|
|
2197
|
+
*/
|
|
2198
|
+
value: string;
|
|
2199
|
+
}
|
|
2200
|
+
/**
|
|
2201
|
+
* DropdownMenu RadioItem component
|
|
2202
|
+
*/
|
|
2203
|
+
declare const DropdownMenuRadioItem: React$1.ForwardRefExoticComponent<DropdownMenuRadioItemProps & React$1.RefAttributes<HTMLDivElement>>;
|
|
2204
|
+
|
|
2205
|
+
interface DropdownMenuRootProps extends PopoverRootProps {
|
|
2206
|
+
}
|
|
2207
|
+
/**
|
|
2208
|
+
* DropdownMenu Root component
|
|
2209
|
+
*/
|
|
2210
|
+
declare function DropdownMenuRoot(props: DropdownMenuRootProps): react_jsx_runtime.JSX.Element;
|
|
2211
|
+
declare namespace DropdownMenuRoot {
|
|
2212
|
+
var displayName: string;
|
|
2213
|
+
}
|
|
2214
|
+
|
|
2215
|
+
/**
|
|
2216
|
+
* DropdownMenu Separator Component
|
|
2217
|
+
*
|
|
2218
|
+
* Visual separator between menu items.
|
|
2219
|
+
* Uses MENU_TOKENS for styling.
|
|
2220
|
+
*/
|
|
2221
|
+
|
|
2222
|
+
interface DropdownMenuSeparatorProps extends React$1.HTMLAttributes<HTMLDivElement> {
|
|
2223
|
+
}
|
|
2224
|
+
/**
|
|
2225
|
+
* DropdownMenu Separator component
|
|
2226
|
+
*/
|
|
2227
|
+
declare const DropdownMenuSeparator: React$1.ForwardRefExoticComponent<DropdownMenuSeparatorProps & React$1.RefAttributes<HTMLDivElement>>;
|
|
2228
|
+
|
|
2229
|
+
interface DropdownMenuSubProps extends PopoverRootProps {
|
|
2230
|
+
}
|
|
2231
|
+
/**
|
|
2232
|
+
* DropdownMenu Sub component
|
|
2233
|
+
*/
|
|
2234
|
+
declare function DropdownMenuSub(props: DropdownMenuSubProps): react_jsx_runtime.JSX.Element;
|
|
2235
|
+
declare namespace DropdownMenuSub {
|
|
2236
|
+
var displayName: string;
|
|
2237
|
+
}
|
|
2238
|
+
|
|
2239
|
+
/**
|
|
2240
|
+
* DropdownMenu SubContent Component
|
|
2241
|
+
*
|
|
2242
|
+
* Content container for submenu.
|
|
2243
|
+
*/
|
|
2244
|
+
|
|
2245
|
+
interface DropdownMenuSubContentProps extends DropdownMenuContentProps {
|
|
2246
|
+
}
|
|
2247
|
+
/**
|
|
2248
|
+
* DropdownMenu SubContent component
|
|
2249
|
+
*/
|
|
2250
|
+
declare const DropdownMenuSubContent: React$1.ForwardRefExoticComponent<DropdownMenuSubContentProps & React$1.RefAttributes<HTMLDivElement>>;
|
|
2251
|
+
|
|
2252
|
+
/**
|
|
2253
|
+
* DropdownMenu SubTrigger Component
|
|
2254
|
+
*
|
|
2255
|
+
* Trigger for submenu items.
|
|
2256
|
+
*/
|
|
2257
|
+
|
|
2258
|
+
interface DropdownMenuSubTriggerProps extends DropdownMenuItemProps {
|
|
2259
|
+
}
|
|
2260
|
+
/**
|
|
2261
|
+
* DropdownMenu SubTrigger component
|
|
2262
|
+
*/
|
|
2263
|
+
declare const DropdownMenuSubTrigger: React$1.ForwardRefExoticComponent<DropdownMenuSubTriggerProps & React$1.RefAttributes<HTMLDivElement>>;
|
|
2264
|
+
|
|
2265
|
+
/**
|
|
2266
|
+
* DropdownMenu Trigger Component
|
|
2267
|
+
*
|
|
2268
|
+
* Trigger element for dropdown menu.
|
|
2269
|
+
* Wraps PopoverTrigger with menu-specific ARIA attributes.
|
|
2270
|
+
*/
|
|
2271
|
+
|
|
2272
|
+
interface DropdownMenuTriggerProps extends PopoverTriggerProps {
|
|
2273
|
+
}
|
|
2274
|
+
/**
|
|
2275
|
+
* DropdownMenu Trigger component
|
|
2276
|
+
*/
|
|
2277
|
+
declare const DropdownMenuTrigger: React$1.ForwardRefExoticComponent<DropdownMenuTriggerProps & React$1.RefAttributes<HTMLElement>>;
|
|
2278
|
+
|
|
2279
|
+
/**
|
|
2280
|
+
* HoverCard Content Component
|
|
2281
|
+
*
|
|
2282
|
+
* Content container for HoverCard.
|
|
2283
|
+
* Wraps PopoverContent with hover-specific behavior.
|
|
2284
|
+
*/
|
|
2285
|
+
|
|
2286
|
+
interface HoverCardContentProps extends PopoverContentProps {
|
|
2287
|
+
}
|
|
2288
|
+
/**
|
|
2289
|
+
* HoverCard Content component
|
|
2290
|
+
*/
|
|
2291
|
+
declare const HoverCardContent: React$1.ForwardRefExoticComponent<HoverCardContentProps & React$1.RefAttributes<HTMLDivElement>>;
|
|
2292
|
+
|
|
2293
|
+
interface HoverCardRootProps extends Omit<PopoverRootProps, "open" | "onOpenChange"> {
|
|
2294
|
+
/**
|
|
2295
|
+
* Delay before opening - token-based
|
|
2296
|
+
* Uses motion duration tokens
|
|
2297
|
+
* @default 0
|
|
2298
|
+
*/
|
|
2299
|
+
openDelay?: ResponsiveDelay;
|
|
2300
|
+
/**
|
|
2301
|
+
* Delay before closing - token-based
|
|
2302
|
+
* Uses motion duration tokens
|
|
2303
|
+
* @default 300
|
|
2304
|
+
*/
|
|
2305
|
+
closeDelay?: ResponsiveDelay;
|
|
2306
|
+
}
|
|
2307
|
+
/**
|
|
2308
|
+
* HoverCard Root component
|
|
2309
|
+
*/
|
|
2310
|
+
declare function HoverCardRoot({ openDelay, closeDelay, defaultOpen, ...props }: HoverCardRootProps): react_jsx_runtime.JSX.Element;
|
|
2311
|
+
declare namespace HoverCardRoot {
|
|
2312
|
+
var displayName: string;
|
|
2313
|
+
}
|
|
2314
|
+
|
|
2315
|
+
/**
|
|
2316
|
+
* HoverCard Trigger Component
|
|
2317
|
+
*
|
|
2318
|
+
* Trigger element that opens HoverCard on hover/focus.
|
|
2319
|
+
*/
|
|
2320
|
+
|
|
2321
|
+
interface HoverCardTriggerProps extends PopoverTriggerProps {
|
|
2322
|
+
}
|
|
2323
|
+
/**
|
|
2324
|
+
* HoverCard Trigger component
|
|
2325
|
+
*/
|
|
2326
|
+
declare const HoverCardTrigger: React$1.ForwardRefExoticComponent<HoverCardTriggerProps & React$1.RefAttributes<HTMLElement>>;
|
|
2327
|
+
|
|
2328
|
+
/**
|
|
2329
|
+
* ============================================================================
|
|
2330
|
+
* 🔒 FOUNDATION LOCK - ContextMenu Component
|
|
2331
|
+
* ============================================================================
|
|
2332
|
+
*
|
|
2333
|
+
* This component is LOCKED as part of the UI Foundation Layer.
|
|
2334
|
+
*
|
|
2335
|
+
* **ARCHITECTURE LOCK DOCUMENTATION:**
|
|
2336
|
+
* See: docs/architecture/TUI_ARCHITECTURE_LOCK.md
|
|
2337
|
+
*
|
|
2338
|
+
* This component must not be modified except for critical bug fixes.
|
|
2339
|
+
* All architectural decisions are final. Museum-grade quality achieved.
|
|
2340
|
+
*
|
|
2341
|
+
* LOCKED STATUS:
|
|
2342
|
+
* - Component: ContextMenu (Radix ContextMenu wrapper)
|
|
2343
|
+
* - Category: Menus (Foundation Layer)
|
|
2344
|
+
* - Lock Date: 2025-12-12
|
|
2345
|
+
* - Status: ✅ LOCKED (FOUNDATION_LOCKED)
|
|
2346
|
+
*
|
|
2347
|
+
* ALLOWED CHANGES (Minimal, approval required):
|
|
2348
|
+
* - Critical bug fixes only (with explicit approval)
|
|
2349
|
+
* - Typing improvements (TypeScript only, no runtime changes)
|
|
2350
|
+
* - Token wiring improvements (connecting existing tokens, no new tokens)
|
|
2351
|
+
* - Stories/tests fixes (test updates only, no component changes)
|
|
2352
|
+
* - Documentation updates (comments, docs only)
|
|
2353
|
+
* - Code comments explaining intentional design decisions
|
|
2354
|
+
*
|
|
2355
|
+
* FORBIDDEN CHANGES (Strictly prohibited):
|
|
2356
|
+
* - ❌ New foundation components or subcomponents
|
|
2357
|
+
* - ❌ Duplicate component implementations
|
|
2358
|
+
* - ❌ Custom behavior that Radix ContextMenu should handle
|
|
2359
|
+
* - ❌ String/number visual props (must use tokens only)
|
|
2360
|
+
* - ❌ Re-implementing focus/keyboard/aria/portal logic
|
|
2361
|
+
* - ❌ Breaking API changes
|
|
2362
|
+
* - ❌ Behavioral rewrites or custom logic additions
|
|
2363
|
+
* - ❌ Token system modifications (additions/removals)
|
|
2364
|
+
* - ❌ Style modifications beyond token wiring
|
|
2365
|
+
* - ❌ New props that change component behavior
|
|
2366
|
+
*
|
|
2367
|
+
* **If you believe changes are necessary, review TUI_ARCHITECTURE_LOCK.md first.**
|
|
2368
|
+
*
|
|
2369
|
+
* ============================================================================
|
|
2370
|
+
*
|
|
2371
|
+
* ContextMenu Component
|
|
2372
|
+
*
|
|
2373
|
+
* Radix-based context menu component with token-driven styling.
|
|
2374
|
+
* All behavior (pointer, keyboard, focus, ARIA, positioning, collision handling)
|
|
2375
|
+
* is handled by Radix ContextMenu. Tenerife UI provides visual styling through
|
|
2376
|
+
* tokens only. This is a strict wrapper pattern - no custom behavior logic.
|
|
2377
|
+
*/
|
|
2378
|
+
|
|
2379
|
+
type ContextMenuRootProps = React$1.ComponentPropsWithoutRef<typeof ContextMenuPrimitive.Root>;
|
|
2380
|
+
/**
|
|
2381
|
+
* ContextMenu Root component
|
|
2382
|
+
* Radix Root is a context provider, not a DOM element, so it doesn't accept refs
|
|
2383
|
+
*/
|
|
2384
|
+
declare const ContextMenuRoot: React$1.FC<ContextMenuRootProps>;
|
|
2385
|
+
interface ContextMenuTriggerProps extends Omit<React$1.ComponentPropsWithoutRef<typeof ContextMenuPrimitive.Trigger>, "children"> {
|
|
2386
|
+
children?: React$1.ReactNode;
|
|
2387
|
+
}
|
|
2388
|
+
/**
|
|
2389
|
+
* ContextMenu Trigger component
|
|
2390
|
+
* Radix handles right-click behavior automatically
|
|
2391
|
+
*/
|
|
2392
|
+
declare const ContextMenuTrigger: React$1.ForwardRefExoticComponent<ContextMenuTriggerProps & React$1.RefAttributes<HTMLSpanElement>>;
|
|
2393
|
+
interface ContextMenuContentProps extends Omit<React$1.ComponentPropsWithoutRef<typeof ContextMenuPrimitive.Content>, "size" | "width" | "padding" | "radius" | "surface"> {
|
|
2394
|
+
/**
|
|
2395
|
+
* Size variant - token-based
|
|
2396
|
+
*/
|
|
2397
|
+
size?: ResponsiveContextMenuSize;
|
|
2398
|
+
/**
|
|
2399
|
+
* Width - token-based
|
|
2400
|
+
*/
|
|
2401
|
+
width?: ResponsiveContextMenuWidth;
|
|
2402
|
+
/**
|
|
2403
|
+
* Padding - token-based
|
|
2404
|
+
*/
|
|
2405
|
+
padding?: ResponsiveSpace;
|
|
2406
|
+
/**
|
|
2407
|
+
* Radius - token-based
|
|
2408
|
+
*/
|
|
2409
|
+
radius?: RadiusToken;
|
|
2410
|
+
/**
|
|
2411
|
+
* Surface variant - token-based
|
|
2412
|
+
*/
|
|
2413
|
+
surface?: SurfaceToken;
|
|
2414
|
+
}
|
|
2415
|
+
/**
|
|
2416
|
+
* ContextMenu Content component
|
|
2417
|
+
* Wrapper around Radix ContextMenu Content with token-based styling.
|
|
2418
|
+
*/
|
|
2419
|
+
declare const ContextMenuContent: React$1.ForwardRefExoticComponent<ContextMenuContentProps & React$1.RefAttributes<HTMLDivElement>>;
|
|
2420
|
+
interface ContextMenuItemProps extends Omit<React$1.ComponentPropsWithoutRef<typeof ContextMenuPrimitive.Item>, "children"> {
|
|
2421
|
+
children?: React$1.ReactNode;
|
|
2422
|
+
/**
|
|
2423
|
+
* Size variant - token-based
|
|
2424
|
+
*
|
|
2425
|
+
* @default Inherited from ContextMenuContent
|
|
2426
|
+
* @note If not specified, the size is automatically inherited from the parent
|
|
2427
|
+
* ContextMenuContent. You can override this by providing an explicit size prop.
|
|
2428
|
+
* This allows you to set size once on Content and have all Items inherit it.
|
|
2429
|
+
*/
|
|
2430
|
+
size?: ResponsiveContextMenuSize;
|
|
2431
|
+
/**
|
|
2432
|
+
* Tone variant - token-based
|
|
2433
|
+
*/
|
|
2434
|
+
tone?: ContextMenuItemToneToken;
|
|
2435
|
+
/**
|
|
2436
|
+
* Gap between item content - token-based
|
|
2437
|
+
*/
|
|
2438
|
+
gap?: ResponsiveSpace;
|
|
2439
|
+
/**
|
|
2440
|
+
* Inset padding for item
|
|
2441
|
+
*/
|
|
2442
|
+
inset?: boolean;
|
|
2443
|
+
}
|
|
2444
|
+
/**
|
|
2445
|
+
* ContextMenu Item component
|
|
2446
|
+
* Wrapper around Radix ContextMenu Item with token-based styling.
|
|
2447
|
+
*/
|
|
2448
|
+
declare const ContextMenuItem: React$1.ForwardRefExoticComponent<ContextMenuItemProps & React$1.RefAttributes<HTMLDivElement>>;
|
|
2449
|
+
interface ContextMenuCheckboxItemProps extends Omit<React$1.ComponentPropsWithoutRef<typeof ContextMenuPrimitive.CheckboxItem>, "children"> {
|
|
2450
|
+
children?: React$1.ReactNode;
|
|
2451
|
+
/**
|
|
2452
|
+
* Size variant - token-based
|
|
2453
|
+
*/
|
|
2454
|
+
size?: ResponsiveContextMenuSize;
|
|
2455
|
+
/**
|
|
2456
|
+
* Tone variant - token-based
|
|
2457
|
+
*/
|
|
2458
|
+
tone?: ContextMenuItemToneToken;
|
|
2459
|
+
/**
|
|
2460
|
+
* Gap between item content - token-based
|
|
2461
|
+
*/
|
|
2462
|
+
gap?: ResponsiveSpace;
|
|
2463
|
+
}
|
|
2464
|
+
/**
|
|
2465
|
+
* ContextMenu CheckboxItem component
|
|
2466
|
+
* Wrapper around Radix ContextMenu CheckboxItem with token-based styling.
|
|
2467
|
+
*/
|
|
2468
|
+
declare const ContextMenuCheckboxItem: React$1.ForwardRefExoticComponent<ContextMenuCheckboxItemProps & React$1.RefAttributes<HTMLDivElement>>;
|
|
2469
|
+
interface ContextMenuRadioGroupProps extends Omit<React$1.ComponentPropsWithoutRef<typeof ContextMenuPrimitive.RadioGroup>, "children"> {
|
|
2470
|
+
children?: React$1.ReactNode;
|
|
2471
|
+
}
|
|
2472
|
+
/**
|
|
2473
|
+
* ContextMenu RadioGroup component
|
|
2474
|
+
* Wrapper around Radix ContextMenu RadioGroup.
|
|
2475
|
+
*/
|
|
2476
|
+
declare const ContextMenuRadioGroup: React$1.ForwardRefExoticComponent<ContextMenuRadioGroupProps & React$1.RefAttributes<HTMLDivElement>>;
|
|
2477
|
+
interface ContextMenuRadioItemProps extends Omit<React$1.ComponentPropsWithoutRef<typeof ContextMenuPrimitive.RadioItem>, "children"> {
|
|
2478
|
+
children?: React$1.ReactNode;
|
|
2479
|
+
/**
|
|
2480
|
+
* Size variant - token-based
|
|
2481
|
+
*/
|
|
2482
|
+
size?: ResponsiveContextMenuSize;
|
|
2483
|
+
/**
|
|
2484
|
+
* Tone variant - token-based
|
|
2485
|
+
*/
|
|
2486
|
+
tone?: ContextMenuItemToneToken;
|
|
2487
|
+
/**
|
|
2488
|
+
* Gap between item content - token-based
|
|
2489
|
+
*/
|
|
2490
|
+
gap?: ResponsiveSpace;
|
|
2491
|
+
}
|
|
2492
|
+
/**
|
|
2493
|
+
* ContextMenu RadioItem component
|
|
2494
|
+
* Wrapper around Radix ContextMenu RadioItem with token-based styling.
|
|
2495
|
+
*/
|
|
2496
|
+
declare const ContextMenuRadioItem: React$1.ForwardRefExoticComponent<ContextMenuRadioItemProps & React$1.RefAttributes<HTMLDivElement>>;
|
|
2497
|
+
interface ContextMenuSeparatorProps extends React$1.ComponentPropsWithoutRef<typeof ContextMenuPrimitive.Separator> {
|
|
2498
|
+
className?: string;
|
|
2499
|
+
}
|
|
2500
|
+
/**
|
|
2501
|
+
* ContextMenu Separator component
|
|
2502
|
+
* Wrapper around Radix ContextMenu Separator with token-based styling.
|
|
2503
|
+
*/
|
|
2504
|
+
declare const ContextMenuSeparator: React$1.ForwardRefExoticComponent<ContextMenuSeparatorProps & React$1.RefAttributes<HTMLDivElement>>;
|
|
2505
|
+
interface ContextMenuLabelProps extends Omit<React$1.ComponentPropsWithoutRef<typeof ContextMenuPrimitive.Label>, "children"> {
|
|
2506
|
+
children?: React$1.ReactNode;
|
|
2507
|
+
/**
|
|
2508
|
+
* Padding - token-based
|
|
2509
|
+
*/
|
|
2510
|
+
padding?: ResponsiveSpace;
|
|
2511
|
+
}
|
|
2512
|
+
/**
|
|
2513
|
+
* ContextMenu Label component
|
|
2514
|
+
* Wrapper around Radix ContextMenu Label with token-based styling.
|
|
2515
|
+
*/
|
|
2516
|
+
declare const ContextMenuLabel: React$1.ForwardRefExoticComponent<ContextMenuLabelProps & React$1.RefAttributes<HTMLDivElement>>;
|
|
2517
|
+
interface ContextMenuSubProps extends React$1.ComponentPropsWithoutRef<typeof ContextMenuPrimitive.Sub> {
|
|
2518
|
+
children?: React$1.ReactNode;
|
|
2519
|
+
}
|
|
2520
|
+
/**
|
|
2521
|
+
* ContextMenu Sub component
|
|
2522
|
+
* Wrapper around Radix ContextMenu Sub.
|
|
2523
|
+
*/
|
|
2524
|
+
declare const ContextMenuSub: React$1.FC<ContextMenuSubProps>;
|
|
2525
|
+
interface ContextMenuSubTriggerProps extends Omit<React$1.ComponentPropsWithoutRef<typeof ContextMenuPrimitive.SubTrigger>, "children"> {
|
|
2526
|
+
children?: React$1.ReactNode;
|
|
2527
|
+
/**
|
|
2528
|
+
* Size variant - token-based
|
|
2529
|
+
*/
|
|
2530
|
+
size?: ResponsiveContextMenuSize;
|
|
2531
|
+
/**
|
|
2532
|
+
* Tone variant - token-based
|
|
2533
|
+
*/
|
|
2534
|
+
tone?: ContextMenuItemToneToken;
|
|
2535
|
+
/**
|
|
2536
|
+
* Gap between item content - token-based
|
|
2537
|
+
*/
|
|
2538
|
+
gap?: ResponsiveSpace;
|
|
2539
|
+
}
|
|
2540
|
+
/**
|
|
2541
|
+
* ContextMenu SubTrigger component
|
|
2542
|
+
* Wrapper around Radix ContextMenu SubTrigger with token-based styling.
|
|
2543
|
+
*/
|
|
2544
|
+
declare const ContextMenuSubTrigger: React$1.ForwardRefExoticComponent<ContextMenuSubTriggerProps & React$1.RefAttributes<HTMLDivElement>>;
|
|
2545
|
+
interface ContextMenuSubContentProps extends Omit<React$1.ComponentPropsWithoutRef<typeof ContextMenuPrimitive.SubContent>, "size" | "width" | "padding" | "radius" | "surface"> {
|
|
2546
|
+
/**
|
|
2547
|
+
* Size variant - token-based
|
|
2548
|
+
*/
|
|
2549
|
+
size?: ResponsiveContextMenuSize;
|
|
2550
|
+
/**
|
|
2551
|
+
* Width - token-based
|
|
2552
|
+
*/
|
|
2553
|
+
width?: ResponsiveContextMenuWidth;
|
|
2554
|
+
/**
|
|
2555
|
+
* Padding - token-based
|
|
2556
|
+
*/
|
|
2557
|
+
padding?: ResponsiveSpace;
|
|
2558
|
+
/**
|
|
2559
|
+
* Radius - token-based
|
|
2560
|
+
*/
|
|
2561
|
+
radius?: RadiusToken;
|
|
2562
|
+
/**
|
|
2563
|
+
* Surface variant - token-based
|
|
2564
|
+
*/
|
|
2565
|
+
surface?: SurfaceToken;
|
|
2566
|
+
}
|
|
2567
|
+
/**
|
|
2568
|
+
* ContextMenu SubContent component
|
|
2569
|
+
* Wrapper around Radix ContextMenu SubContent with token-based styling.
|
|
2570
|
+
*/
|
|
2571
|
+
declare const ContextMenuSubContent: React$1.ForwardRefExoticComponent<ContextMenuSubContentProps & React$1.RefAttributes<HTMLDivElement>>;
|
|
2572
|
+
|
|
2573
|
+
/**
|
|
2574
|
+
* ContextMenu Component
|
|
2575
|
+
*
|
|
2576
|
+
* Radix ContextMenu-based component with token-driven styling.
|
|
2577
|
+
*
|
|
2578
|
+
* **Usage:**
|
|
2579
|
+
* ```tsx
|
|
2580
|
+
* <ContextMenu.Root>
|
|
2581
|
+
* <ContextMenu.Trigger>Right-click me</ContextMenu.Trigger>
|
|
2582
|
+
* <ContextMenu.Content>
|
|
2583
|
+
* <ContextMenu.Item>Item 1</ContextMenu.Item>
|
|
2584
|
+
* <ContextMenu.Item>Item 2</ContextMenu.Item>
|
|
2585
|
+
* <ContextMenu.Separator />
|
|
2586
|
+
* <ContextMenu.Sub>
|
|
2587
|
+
* <ContextMenu.SubTrigger>Submenu</ContextMenu.SubTrigger>
|
|
2588
|
+
* <ContextMenu.SubContent>
|
|
2589
|
+
* <ContextMenu.Item>Sub Item 1</ContextMenu.Item>
|
|
2590
|
+
* </ContextMenu.SubContent>
|
|
2591
|
+
* </ContextMenu.Sub>
|
|
2592
|
+
* </ContextMenu.Content>
|
|
2593
|
+
* </ContextMenu.Root>
|
|
2594
|
+
* ```
|
|
2595
|
+
*/
|
|
2596
|
+
declare const ContextMenu: {
|
|
2597
|
+
Root: React$1.FC<ContextMenuPrimitive.ContextMenuProps>;
|
|
2598
|
+
Trigger: React$1.ForwardRefExoticComponent<ContextMenuTriggerProps & React$1.RefAttributes<HTMLSpanElement>>;
|
|
2599
|
+
Content: React$1.ForwardRefExoticComponent<ContextMenuContentProps & React$1.RefAttributes<HTMLDivElement>>;
|
|
2600
|
+
Item: React$1.ForwardRefExoticComponent<ContextMenuItemProps & React$1.RefAttributes<HTMLDivElement>>;
|
|
2601
|
+
CheckboxItem: React$1.ForwardRefExoticComponent<ContextMenuCheckboxItemProps & React$1.RefAttributes<HTMLDivElement>>;
|
|
2602
|
+
RadioGroup: React$1.ForwardRefExoticComponent<ContextMenuRadioGroupProps & React$1.RefAttributes<HTMLDivElement>>;
|
|
2603
|
+
RadioItem: React$1.ForwardRefExoticComponent<ContextMenuRadioItemProps & React$1.RefAttributes<HTMLDivElement>>;
|
|
2604
|
+
Separator: React$1.ForwardRefExoticComponent<ContextMenuSeparatorProps & React$1.RefAttributes<HTMLDivElement>>;
|
|
2605
|
+
Label: React$1.ForwardRefExoticComponent<ContextMenuLabelProps & React$1.RefAttributes<HTMLDivElement>>;
|
|
2606
|
+
Sub: React$1.FC<ContextMenuSubProps>;
|
|
2607
|
+
SubTrigger: React$1.ForwardRefExoticComponent<ContextMenuSubTriggerProps & React$1.RefAttributes<HTMLDivElement>>;
|
|
2608
|
+
SubContent: React$1.ForwardRefExoticComponent<ContextMenuSubContentProps & React$1.RefAttributes<HTMLDivElement>>;
|
|
2609
|
+
};
|
|
2610
|
+
|
|
2611
|
+
declare const skeletonVariants: (props?: ({
|
|
2612
|
+
variant?: "card" | "text" | "circle" | "inline" | "block" | null | undefined;
|
|
2613
|
+
} & class_variance_authority_types.ClassProp) | undefined) => string;
|
|
2614
|
+
interface SkeletonProps extends React$1.HTMLAttributes<HTMLDivElement>, VariantProps<typeof skeletonVariants> {
|
|
2615
|
+
/**
|
|
2616
|
+
* Whether to hide from screen readers
|
|
2617
|
+
* @default true
|
|
2618
|
+
*/
|
|
2619
|
+
"aria-hidden"?: boolean;
|
|
2620
|
+
}
|
|
2621
|
+
/**
|
|
2622
|
+
* Skeleton component for loading states
|
|
2623
|
+
*
|
|
2624
|
+
* @example
|
|
2625
|
+
* ```tsx
|
|
2626
|
+
* <Skeleton variant="text" />
|
|
2627
|
+
* <Skeleton variant="circle" />
|
|
2628
|
+
* <Skeleton variant="card" />
|
|
2629
|
+
* ```
|
|
2630
|
+
*/
|
|
2631
|
+
declare const Skeleton: React$1.ForwardRefExoticComponent<SkeletonProps & React$1.RefAttributes<HTMLDivElement>>;
|
|
2632
|
+
|
|
2633
|
+
/**
|
|
2634
|
+
* EmptyState Component
|
|
2635
|
+
*
|
|
2636
|
+
* Token-driven empty state component for displaying empty or no-data states.
|
|
2637
|
+
* Uses DATA_TOKENS for all spacing and sizing.
|
|
2638
|
+
* Integrates with Surface and Stack components.
|
|
2639
|
+
*/
|
|
2640
|
+
|
|
2641
|
+
interface EmptyStateProps extends React$1.HTMLAttributes<HTMLDivElement> {
|
|
2642
|
+
/**
|
|
2643
|
+
* Unique ID for accessibility (auto-generated if not provided)
|
|
2644
|
+
*/
|
|
2645
|
+
id?: string;
|
|
2646
|
+
}
|
|
2647
|
+
/**
|
|
2648
|
+
* EmptyState root component
|
|
2649
|
+
*
|
|
2650
|
+
* @example
|
|
2651
|
+
* ```tsx
|
|
2652
|
+
* <EmptyState>
|
|
2653
|
+
* <EmptyState.Icon>📭</EmptyState.Icon>
|
|
2654
|
+
* <EmptyState.Title>No items found</EmptyState.Title>
|
|
2655
|
+
* <EmptyState.Description>Try adjusting your filters</EmptyState.Description>
|
|
2656
|
+
* <EmptyState.Action>
|
|
2657
|
+
* <Button>Create Item</Button>
|
|
2658
|
+
* </EmptyState.Action>
|
|
2659
|
+
* </EmptyState>
|
|
2660
|
+
* ```
|
|
2661
|
+
*/
|
|
2662
|
+
declare const EmptyState: React$1.ForwardRefExoticComponent<EmptyStateProps & React$1.RefAttributes<HTMLDivElement>>;
|
|
2663
|
+
|
|
2664
|
+
/**
|
|
2665
|
+
* EmptyState Action Component
|
|
2666
|
+
*
|
|
2667
|
+
* Action subcomponent for EmptyState (typically contains Button).
|
|
2668
|
+
*/
|
|
2669
|
+
|
|
2670
|
+
interface EmptyStateActionProps extends React$1.HTMLAttributes<HTMLDivElement> {
|
|
2671
|
+
/**
|
|
2672
|
+
* Action button or link (typically Button component)
|
|
2673
|
+
*/
|
|
2674
|
+
children: React$1.ReactNode;
|
|
2675
|
+
}
|
|
2676
|
+
/**
|
|
2677
|
+
* EmptyState Action component
|
|
2678
|
+
*/
|
|
2679
|
+
declare const EmptyStateAction: React$1.ForwardRefExoticComponent<EmptyStateActionProps & React$1.RefAttributes<HTMLDivElement>>;
|
|
2680
|
+
|
|
2681
|
+
/**
|
|
2682
|
+
* EmptyState Description Component
|
|
2683
|
+
*
|
|
2684
|
+
* Description subcomponent for EmptyState.
|
|
2685
|
+
*/
|
|
2686
|
+
|
|
2687
|
+
interface EmptyStateDescriptionProps extends React$1.HTMLAttributes<HTMLParagraphElement> {
|
|
2688
|
+
/**
|
|
2689
|
+
* Description text
|
|
2690
|
+
*/
|
|
2691
|
+
children: React$1.ReactNode;
|
|
2692
|
+
}
|
|
2693
|
+
/**
|
|
2694
|
+
* EmptyState Description component
|
|
2695
|
+
*/
|
|
2696
|
+
declare const EmptyStateDescription: React$1.ForwardRefExoticComponent<EmptyStateDescriptionProps & React$1.RefAttributes<HTMLParagraphElement>>;
|
|
2697
|
+
|
|
2698
|
+
/**
|
|
2699
|
+
* EmptyState Icon Component
|
|
2700
|
+
*
|
|
2701
|
+
* Icon subcomponent for EmptyState.
|
|
2702
|
+
*/
|
|
2703
|
+
|
|
2704
|
+
interface EmptyStateIconProps extends React$1.HTMLAttributes<HTMLDivElement> {
|
|
2705
|
+
/**
|
|
2706
|
+
* Icon content (any ReactNode)
|
|
2707
|
+
*/
|
|
2708
|
+
children: React$1.ReactNode;
|
|
2709
|
+
/**
|
|
2710
|
+
* Icon size
|
|
2711
|
+
* @default "md"
|
|
2712
|
+
*/
|
|
2713
|
+
size?: "sm" | "md" | "lg";
|
|
2714
|
+
}
|
|
2715
|
+
/**
|
|
2716
|
+
* EmptyState Icon component
|
|
2717
|
+
*/
|
|
2718
|
+
declare const EmptyStateIcon: React$1.ForwardRefExoticComponent<EmptyStateIconProps & React$1.RefAttributes<HTMLDivElement>>;
|
|
2719
|
+
|
|
2720
|
+
/**
|
|
2721
|
+
* EmptyState Title Component
|
|
2722
|
+
*
|
|
2723
|
+
* Title subcomponent for EmptyState.
|
|
2724
|
+
*/
|
|
2725
|
+
|
|
2726
|
+
interface EmptyStateTitleProps extends React$1.HTMLAttributes<HTMLHeadingElement> {
|
|
2727
|
+
/**
|
|
2728
|
+
* Title text
|
|
2729
|
+
*/
|
|
2730
|
+
children: React$1.ReactNode;
|
|
2731
|
+
}
|
|
2732
|
+
/**
|
|
2733
|
+
* EmptyState Title component
|
|
2734
|
+
*/
|
|
2735
|
+
declare const EmptyStateTitle: React$1.ForwardRefExoticComponent<EmptyStateTitleProps & React$1.RefAttributes<HTMLHeadingElement>>;
|
|
2736
|
+
|
|
2737
|
+
/**
|
|
2738
|
+
* DataList Root Component
|
|
2739
|
+
*
|
|
2740
|
+
* Mobile-first data list component for displaying key-value pairs.
|
|
2741
|
+
* Uses Stack for vertical layout and DATA_TOKENS for spacing.
|
|
2742
|
+
*/
|
|
2743
|
+
|
|
2744
|
+
interface DataListRootProps extends React$1.HTMLAttributes<HTMLDListElement> {
|
|
2745
|
+
/**
|
|
2746
|
+
* Label width for desktop layout
|
|
2747
|
+
* @default "md"
|
|
2748
|
+
*/
|
|
2749
|
+
labelWidth?: "sm" | "md" | "lg";
|
|
2750
|
+
}
|
|
2751
|
+
/**
|
|
2752
|
+
* DataList Root component
|
|
2753
|
+
*
|
|
2754
|
+
* @example
|
|
2755
|
+
* ```tsx
|
|
2756
|
+
* <DataList.Root>
|
|
2757
|
+
* <DataList.Item>
|
|
2758
|
+
* <DataList.Label>Name</DataList.Label>
|
|
2759
|
+
* <DataList.Value>John Doe</DataList.Value>
|
|
2760
|
+
* </DataList.Item>
|
|
2761
|
+
* </DataList.Root>
|
|
2762
|
+
* ```
|
|
2763
|
+
*/
|
|
2764
|
+
declare const DataListRoot: React$1.ForwardRefExoticComponent<DataListRootProps & React$1.RefAttributes<HTMLDListElement>>;
|
|
2765
|
+
|
|
2766
|
+
/**
|
|
2767
|
+
* DataList Component Types
|
|
2768
|
+
*
|
|
2769
|
+
* TypeScript interfaces and types for DataList component.
|
|
2770
|
+
*/
|
|
2771
|
+
|
|
2772
|
+
/**
|
|
2773
|
+
* DataList Item component props
|
|
2774
|
+
*/
|
|
2775
|
+
interface DataListItemProps$1 extends React.HTMLAttributes<HTMLDivElement> {
|
|
2776
|
+
/**
|
|
2777
|
+
* Row padding - token-based
|
|
2778
|
+
* Accepts spacing tokens (xs, sm, md, lg, xl, etc.) or responsive object
|
|
2779
|
+
* @default "md"
|
|
2780
|
+
* @example padding="sm"
|
|
2781
|
+
* @example padding={{ base: "sm", md: "lg" }}
|
|
2782
|
+
*/
|
|
2783
|
+
padding?: ResponsiveSpacing;
|
|
2784
|
+
}
|
|
2785
|
+
|
|
2786
|
+
/**
|
|
2787
|
+
* DataList Item Component
|
|
2788
|
+
*
|
|
2789
|
+
* Individual item in DataList (contains Label and Value).
|
|
2790
|
+
*/
|
|
2791
|
+
|
|
2792
|
+
interface DataListItemProps extends DataListItemProps$1 {
|
|
2793
|
+
}
|
|
2794
|
+
/**
|
|
2795
|
+
* DataList Item component
|
|
2796
|
+
* Mobile: vertical layout (label above value)
|
|
2797
|
+
* Desktop: horizontal layout (label left, value right)
|
|
2798
|
+
*/
|
|
2799
|
+
declare const DataListItem: React$1.ForwardRefExoticComponent<DataListItemProps & React$1.RefAttributes<HTMLDivElement>>;
|
|
2800
|
+
|
|
2801
|
+
/**
|
|
2802
|
+
* DataList Label Component
|
|
2803
|
+
*
|
|
2804
|
+
* Label subcomponent for DataList items.
|
|
2805
|
+
*/
|
|
2806
|
+
|
|
2807
|
+
interface DataListLabelProps extends React$1.HTMLAttributes<HTMLElement> {
|
|
2808
|
+
/**
|
|
2809
|
+
* Label text
|
|
2810
|
+
*/
|
|
2811
|
+
children: React$1.ReactNode;
|
|
2812
|
+
}
|
|
2813
|
+
/**
|
|
2814
|
+
* DataList Label component
|
|
2815
|
+
* Mobile: full width
|
|
2816
|
+
* Desktop: fixed width (from tokens)
|
|
2817
|
+
*/
|
|
2818
|
+
declare const DataListLabel: React$1.ForwardRefExoticComponent<DataListLabelProps & React$1.RefAttributes<HTMLElement>>;
|
|
2819
|
+
|
|
2820
|
+
/**
|
|
2821
|
+
* DataList Value Component
|
|
2822
|
+
*
|
|
2823
|
+
* Value subcomponent for DataList items.
|
|
2824
|
+
*/
|
|
2825
|
+
|
|
2826
|
+
interface DataListValueProps extends React$1.HTMLAttributes<HTMLElement> {
|
|
2827
|
+
/**
|
|
2828
|
+
* Value content
|
|
2829
|
+
*/
|
|
2830
|
+
children: React$1.ReactNode;
|
|
2831
|
+
}
|
|
2832
|
+
/**
|
|
2833
|
+
* DataList Value component
|
|
2834
|
+
* Flex-grow to fill remaining space on desktop
|
|
2835
|
+
*/
|
|
2836
|
+
declare const DataListValue: React$1.ForwardRefExoticComponent<DataListValueProps & React$1.RefAttributes<HTMLElement>>;
|
|
2837
|
+
|
|
2838
|
+
/**
|
|
2839
|
+
* Table Component Types
|
|
2840
|
+
*
|
|
2841
|
+
* TypeScript interfaces and types for Table component.
|
|
2842
|
+
*/
|
|
2843
|
+
|
|
2844
|
+
/**
|
|
2845
|
+
* Table column definition
|
|
2846
|
+
*/
|
|
2847
|
+
interface TableColumn<T = Record<string, unknown>> {
|
|
2848
|
+
/**
|
|
2849
|
+
* Column key (must match a key in the data object)
|
|
2850
|
+
*/
|
|
2851
|
+
key: keyof T;
|
|
2852
|
+
/**
|
|
2853
|
+
* Column header title
|
|
2854
|
+
*/
|
|
2855
|
+
title: string;
|
|
2856
|
+
/**
|
|
2857
|
+
* Custom render function for cell content
|
|
2858
|
+
*/
|
|
2859
|
+
render?: (value: T[keyof T], item: T, index: number) => ReactNode;
|
|
2860
|
+
/**
|
|
2861
|
+
* Column alignment
|
|
2862
|
+
* @default "left"
|
|
2863
|
+
*/
|
|
2864
|
+
align?: "left" | "center" | "right";
|
|
2865
|
+
/**
|
|
2866
|
+
* Column width (CSS value or Tailwind class)
|
|
2867
|
+
*/
|
|
2868
|
+
width?: string;
|
|
2869
|
+
/**
|
|
2870
|
+
* Whether column is sortable
|
|
2871
|
+
* @default false
|
|
2872
|
+
*/
|
|
2873
|
+
sortable?: boolean;
|
|
2874
|
+
/**
|
|
2875
|
+
* Cell size
|
|
2876
|
+
* @default "md"
|
|
2877
|
+
*/
|
|
2878
|
+
size?: "sm" | "md" | "lg";
|
|
2879
|
+
}
|
|
2880
|
+
/**
|
|
2881
|
+
* Sort direction
|
|
2882
|
+
*/
|
|
2883
|
+
type SortDirection = "asc" | "desc" | null;
|
|
2884
|
+
/**
|
|
2885
|
+
* Sort state
|
|
2886
|
+
*/
|
|
2887
|
+
interface SortState {
|
|
2888
|
+
/**
|
|
2889
|
+
* Column key being sorted
|
|
2890
|
+
*/
|
|
2891
|
+
column: string | null;
|
|
2892
|
+
/**
|
|
2893
|
+
* Sort direction
|
|
2894
|
+
*/
|
|
2895
|
+
direction: SortDirection;
|
|
2896
|
+
}
|
|
2897
|
+
/**
|
|
2898
|
+
* Table context value
|
|
2899
|
+
*/
|
|
2900
|
+
interface TableContextValue {
|
|
2901
|
+
/**
|
|
2902
|
+
* Current sort state
|
|
2903
|
+
*/
|
|
2904
|
+
sortState: SortState;
|
|
2905
|
+
/**
|
|
2906
|
+
* Set sort state
|
|
2907
|
+
*/
|
|
2908
|
+
setSortState: (state: SortState) => void;
|
|
2909
|
+
/**
|
|
2910
|
+
* Expanded rows (for expandable rows)
|
|
2911
|
+
*/
|
|
2912
|
+
expandedRows: Set<string | number>;
|
|
2913
|
+
/**
|
|
2914
|
+
* Toggle row expansion
|
|
2915
|
+
*/
|
|
2916
|
+
toggleRow: (rowKey: string | number) => void;
|
|
2917
|
+
/**
|
|
2918
|
+
* Whether table has expandable rows
|
|
2919
|
+
*/
|
|
2920
|
+
expandable?: boolean;
|
|
2921
|
+
/**
|
|
2922
|
+
* Render function for expandable content
|
|
2923
|
+
*/
|
|
2924
|
+
renderExpandableContent?: (item: unknown, index: number) => ReactNode;
|
|
2925
|
+
}
|
|
2926
|
+
/**
|
|
2927
|
+
* Table Root component props
|
|
2928
|
+
*/
|
|
2929
|
+
interface TableRootProps<T = Record<string, unknown>> extends React.HTMLAttributes<HTMLTableElement> {
|
|
2930
|
+
/**
|
|
2931
|
+
* Table data array
|
|
2932
|
+
*/
|
|
2933
|
+
data: T[];
|
|
2934
|
+
/**
|
|
2935
|
+
* Column definitions
|
|
2936
|
+
*/
|
|
2937
|
+
columns: TableColumn<T>[];
|
|
2938
|
+
/**
|
|
2939
|
+
* Key to use for row identification
|
|
2940
|
+
*/
|
|
2941
|
+
rowKey: keyof T | ((item: T, index: number) => string | number);
|
|
2942
|
+
/**
|
|
2943
|
+
* Whether table supports sorting
|
|
2944
|
+
* @default false
|
|
2945
|
+
*/
|
|
2946
|
+
sortable?: boolean;
|
|
2947
|
+
/**
|
|
2948
|
+
* Whether table supports expandable rows
|
|
2949
|
+
* @default false
|
|
2950
|
+
*/
|
|
2951
|
+
expandable?: boolean;
|
|
2952
|
+
/**
|
|
2953
|
+
* Render function for expandable content
|
|
2954
|
+
*/
|
|
2955
|
+
renderExpandableContent?: (item: T, index: number) => ReactNode;
|
|
2956
|
+
/**
|
|
2957
|
+
* Whether table is in loading state
|
|
2958
|
+
* @default false
|
|
2959
|
+
*/
|
|
2960
|
+
loading?: boolean;
|
|
2961
|
+
/**
|
|
2962
|
+
* Empty state message (shown when data is empty)
|
|
2963
|
+
*/
|
|
2964
|
+
emptyMessage?: string;
|
|
2965
|
+
/**
|
|
2966
|
+
* Whether header is sticky
|
|
2967
|
+
* @default false
|
|
2968
|
+
*/
|
|
2969
|
+
stickyHeader?: boolean;
|
|
2970
|
+
/**
|
|
2971
|
+
* Row size
|
|
2972
|
+
* @default "md"
|
|
2973
|
+
*/
|
|
2974
|
+
rowSize?: "sm" | "md" | "lg";
|
|
2975
|
+
}
|
|
2976
|
+
/**
|
|
2977
|
+
* Table Header component props
|
|
2978
|
+
*/
|
|
2979
|
+
interface TableHeaderProps extends React.HTMLAttributes<HTMLTableSectionElement> {
|
|
2980
|
+
/**
|
|
2981
|
+
* Whether header is sticky
|
|
2982
|
+
* @default false
|
|
2983
|
+
*/
|
|
2984
|
+
sticky?: boolean;
|
|
2985
|
+
}
|
|
2986
|
+
/**
|
|
2987
|
+
* Table Head component props
|
|
2988
|
+
*/
|
|
2989
|
+
interface TableHeadProps extends React.HTMLAttributes<HTMLTableCellElement> {
|
|
2990
|
+
/**
|
|
2991
|
+
* Column alignment
|
|
2992
|
+
* @default "left"
|
|
2993
|
+
*/
|
|
2994
|
+
align?: "left" | "center" | "right";
|
|
2995
|
+
/**
|
|
2996
|
+
* Whether column is sortable
|
|
2997
|
+
* @default false
|
|
2998
|
+
*/
|
|
2999
|
+
sortable?: boolean;
|
|
3000
|
+
/**
|
|
3001
|
+
* Column key (for sorting)
|
|
3002
|
+
*/
|
|
3003
|
+
columnKey?: string;
|
|
3004
|
+
/**
|
|
3005
|
+
* Cell size
|
|
3006
|
+
* @default "md"
|
|
3007
|
+
*/
|
|
3008
|
+
size?: "sm" | "md" | "lg";
|
|
3009
|
+
}
|
|
3010
|
+
/**
|
|
3011
|
+
* Table Body component props
|
|
3012
|
+
*/
|
|
3013
|
+
interface TableBodyProps extends React.HTMLAttributes<HTMLTableSectionElement> {
|
|
3014
|
+
}
|
|
3015
|
+
/**
|
|
3016
|
+
* Table Row component props
|
|
3017
|
+
*/
|
|
3018
|
+
interface TableRowProps extends React.HTMLAttributes<HTMLTableRowElement> {
|
|
3019
|
+
/**
|
|
3020
|
+
* Whether row is selected
|
|
3021
|
+
* @default false
|
|
3022
|
+
*/
|
|
3023
|
+
selected?: boolean;
|
|
3024
|
+
/**
|
|
3025
|
+
* Whether row is expandable
|
|
3026
|
+
* @default false
|
|
3027
|
+
*/
|
|
3028
|
+
expandable?: boolean;
|
|
3029
|
+
/**
|
|
3030
|
+
* Row key (for expansion tracking)
|
|
3031
|
+
*/
|
|
3032
|
+
rowKey?: string | number;
|
|
3033
|
+
/**
|
|
3034
|
+
* Whether row is expanded
|
|
3035
|
+
* @default false
|
|
3036
|
+
*/
|
|
3037
|
+
expanded?: boolean;
|
|
3038
|
+
}
|
|
3039
|
+
/**
|
|
3040
|
+
* Table Cell component props
|
|
3041
|
+
*/
|
|
3042
|
+
interface TableCellProps extends React.HTMLAttributes<HTMLTableCellElement> {
|
|
3043
|
+
/**
|
|
3044
|
+
* Cell alignment
|
|
3045
|
+
* @default "left"
|
|
3046
|
+
*/
|
|
3047
|
+
align?: "left" | "center" | "right";
|
|
3048
|
+
/**
|
|
3049
|
+
* Cell size
|
|
3050
|
+
* @default "md"
|
|
3051
|
+
*/
|
|
3052
|
+
size?: "sm" | "md" | "lg";
|
|
3053
|
+
}
|
|
3054
|
+
/**
|
|
3055
|
+
* Table SortIcon component props
|
|
3056
|
+
*/
|
|
3057
|
+
interface TableSortIconProps extends React.HTMLAttributes<HTMLSpanElement> {
|
|
3058
|
+
/**
|
|
3059
|
+
* Sort direction
|
|
3060
|
+
*/
|
|
3061
|
+
direction: SortDirection;
|
|
3062
|
+
}
|
|
3063
|
+
/**
|
|
3064
|
+
* Table Empty component props
|
|
3065
|
+
*/
|
|
3066
|
+
interface TableEmptyProps extends React.HTMLAttributes<HTMLTableRowElement> {
|
|
3067
|
+
/**
|
|
3068
|
+
* Number of columns to span
|
|
3069
|
+
*/
|
|
3070
|
+
colSpan: number;
|
|
3071
|
+
/**
|
|
3072
|
+
* Empty message
|
|
3073
|
+
*/
|
|
3074
|
+
message?: string;
|
|
3075
|
+
}
|
|
3076
|
+
/**
|
|
3077
|
+
* Table LoadingState component props
|
|
3078
|
+
*/
|
|
3079
|
+
interface TableLoadingStateProps extends React.HTMLAttributes<HTMLTableRowElement> {
|
|
3080
|
+
/**
|
|
3081
|
+
* Number of columns to span
|
|
3082
|
+
*/
|
|
3083
|
+
colSpan: number;
|
|
3084
|
+
/**
|
|
3085
|
+
* Number of skeleton rows to show
|
|
3086
|
+
* @default 5
|
|
3087
|
+
*/
|
|
3088
|
+
rows?: number;
|
|
3089
|
+
}
|
|
3090
|
+
/**
|
|
3091
|
+
* Table ExpandableContent component props
|
|
3092
|
+
*/
|
|
3093
|
+
interface TableExpandableContentProps extends React.HTMLAttributes<HTMLTableCellElement> {
|
|
3094
|
+
/**
|
|
3095
|
+
* Number of columns to span
|
|
3096
|
+
*/
|
|
3097
|
+
colSpan: number;
|
|
3098
|
+
/**
|
|
3099
|
+
* Whether content is expanded
|
|
3100
|
+
*/
|
|
3101
|
+
expanded: boolean;
|
|
3102
|
+
/**
|
|
3103
|
+
* Content to render
|
|
3104
|
+
*/
|
|
3105
|
+
children: ReactNode;
|
|
3106
|
+
}
|
|
3107
|
+
|
|
3108
|
+
declare function useTableContext(): TableContextValue;
|
|
3109
|
+
/**
|
|
3110
|
+
* Table Root component
|
|
3111
|
+
*
|
|
3112
|
+
* @example
|
|
3113
|
+
* ```tsx
|
|
3114
|
+
* <Table.Root
|
|
3115
|
+
* data={users}
|
|
3116
|
+
* columns={columns}
|
|
3117
|
+
* rowKey="id"
|
|
3118
|
+
* sortable
|
|
3119
|
+
* >
|
|
3120
|
+
* <Table.Header>
|
|
3121
|
+
* <Table.Row>
|
|
3122
|
+
* <Table.Head>Name</Table.Head>
|
|
3123
|
+
* </Table.Row>
|
|
3124
|
+
* </Table.Header>
|
|
3125
|
+
* <Table.Body>
|
|
3126
|
+
* {users.map((user) => (
|
|
3127
|
+
* <Table.Row key={user.id}>
|
|
3128
|
+
* <Table.Cell>{user.name}</Table.Cell>
|
|
3129
|
+
* </Table.Row>
|
|
3130
|
+
* ))}
|
|
3131
|
+
* </Table.Body>
|
|
3132
|
+
* </Table.Root>
|
|
3133
|
+
* ```
|
|
3134
|
+
*/
|
|
3135
|
+
declare function TableRoot<T extends Record<string, unknown>>({ data: _data, columns: _columns, rowKey: _rowKey, sortable: _sortable, expandable, renderExpandableContent, loading: _loading, emptyMessage: _emptyMessage, stickyHeader: _stickyHeader, rowSize: _rowSize, className, children, ...props }: TableRootProps<T>): react_jsx_runtime.JSX.Element;
|
|
3136
|
+
declare namespace TableRoot {
|
|
3137
|
+
var displayName: string;
|
|
3138
|
+
}
|
|
3139
|
+
|
|
3140
|
+
/**
|
|
3141
|
+
* Table Body Component
|
|
3142
|
+
*
|
|
3143
|
+
* Body section for table (tbody element).
|
|
3144
|
+
*/
|
|
3145
|
+
|
|
3146
|
+
/**
|
|
3147
|
+
* Table Body component
|
|
3148
|
+
*/
|
|
3149
|
+
declare const TableBody: React$1.ForwardRefExoticComponent<TableBodyProps & React$1.RefAttributes<HTMLTableSectionElement>>;
|
|
3150
|
+
|
|
3151
|
+
/**
|
|
3152
|
+
* Table Cell Component
|
|
3153
|
+
*
|
|
3154
|
+
* Table cell component with alignment and size support.
|
|
3155
|
+
*/
|
|
3156
|
+
|
|
3157
|
+
/**
|
|
3158
|
+
* Table Cell component
|
|
3159
|
+
*/
|
|
3160
|
+
declare const TableCell: React$1.ForwardRefExoticComponent<TableCellProps & React$1.RefAttributes<HTMLTableCellElement>>;
|
|
3161
|
+
|
|
3162
|
+
/**
|
|
3163
|
+
* Table Empty Component
|
|
3164
|
+
*
|
|
3165
|
+
* Empty state row for table (uses EmptyState component).
|
|
3166
|
+
*/
|
|
3167
|
+
|
|
3168
|
+
/**
|
|
3169
|
+
* Table Empty component
|
|
3170
|
+
*/
|
|
3171
|
+
declare const TableEmpty: React$1.ForwardRefExoticComponent<TableEmptyProps & React$1.RefAttributes<HTMLTableRowElement>>;
|
|
3172
|
+
|
|
3173
|
+
/**
|
|
3174
|
+
* Table ExpandableContent Component
|
|
3175
|
+
*
|
|
3176
|
+
* Expandable content cell with CSS height transitions.
|
|
3177
|
+
*/
|
|
3178
|
+
|
|
3179
|
+
/**
|
|
3180
|
+
* Table ExpandableContent component
|
|
3181
|
+
* Uses CSS height transitions (no framer-motion)
|
|
3182
|
+
*/
|
|
3183
|
+
declare const TableExpandableContent: React$1.ForwardRefExoticComponent<TableExpandableContentProps & React$1.RefAttributes<HTMLTableCellElement>>;
|
|
3184
|
+
|
|
3185
|
+
/**
|
|
3186
|
+
* Table Head Component
|
|
3187
|
+
*
|
|
3188
|
+
* Header cell component with sorting support.
|
|
3189
|
+
*/
|
|
3190
|
+
|
|
3191
|
+
/**
|
|
3192
|
+
* Table Head component
|
|
3193
|
+
*/
|
|
3194
|
+
declare const TableHead: React$1.ForwardRefExoticComponent<TableHeadProps & React$1.RefAttributes<HTMLTableCellElement>>;
|
|
3195
|
+
|
|
3196
|
+
/**
|
|
3197
|
+
* Table Header Component
|
|
3198
|
+
*
|
|
3199
|
+
* Header section for table (thead element).
|
|
3200
|
+
*/
|
|
3201
|
+
|
|
3202
|
+
/**
|
|
3203
|
+
* Table Header component
|
|
3204
|
+
*/
|
|
3205
|
+
declare const TableHeader: React$1.ForwardRefExoticComponent<TableHeaderProps & React$1.RefAttributes<HTMLTableSectionElement>>;
|
|
3206
|
+
|
|
3207
|
+
/**
|
|
3208
|
+
* Table LoadingState Component
|
|
3209
|
+
*
|
|
3210
|
+
* Loading state row for table (uses Skeleton component).
|
|
3211
|
+
*/
|
|
3212
|
+
|
|
3213
|
+
/**
|
|
3214
|
+
* Table LoadingState component
|
|
3215
|
+
*/
|
|
3216
|
+
declare const TableLoadingState: React$1.ForwardRefExoticComponent<TableLoadingStateProps & React$1.RefAttributes<HTMLTableRowElement>>;
|
|
3217
|
+
|
|
3218
|
+
/**
|
|
3219
|
+
* Table Row Component
|
|
3220
|
+
*
|
|
3221
|
+
* Table row component with hover and selected states.
|
|
3222
|
+
*/
|
|
3223
|
+
|
|
3224
|
+
/**
|
|
3225
|
+
* Table Row component
|
|
3226
|
+
*/
|
|
3227
|
+
declare const TableRow: React$1.ForwardRefExoticComponent<TableRowProps & React$1.RefAttributes<HTMLTableRowElement>>;
|
|
3228
|
+
|
|
3229
|
+
/**
|
|
3230
|
+
* Table SortIcon Component
|
|
3231
|
+
*
|
|
3232
|
+
* Sort indicator icon with rotation animation.
|
|
3233
|
+
*/
|
|
3234
|
+
|
|
3235
|
+
/**
|
|
3236
|
+
* Table SortIcon component
|
|
3237
|
+
* Uses CSS rotation animation (no framer-motion)
|
|
3238
|
+
*/
|
|
3239
|
+
declare const TableSortIcon: React$1.ForwardRefExoticComponent<TableSortIconProps & React$1.RefAttributes<HTMLSpanElement>>;
|
|
3240
|
+
|
|
3241
|
+
/**
|
|
3242
|
+
* Tabs Component
|
|
3243
|
+
*
|
|
3244
|
+
* Radix-based tabs component with token-driven styling.
|
|
3245
|
+
* All behavior (keyboard navigation, focus management, a11y) is handled by Radix.
|
|
3246
|
+
* Tenerife UI provides visual styling through tokens only.
|
|
3247
|
+
*/
|
|
3248
|
+
|
|
3249
|
+
interface TabsRootProps extends React$1.ComponentPropsWithoutRef<typeof TabsPrimitive.Root> {
|
|
3250
|
+
}
|
|
3251
|
+
interface TabsListProps extends Omit<React$1.ComponentPropsWithoutRef<typeof TabsPrimitive.List>, "size" | "variant"> {
|
|
3252
|
+
/**
|
|
3253
|
+
* Size variant - token-based
|
|
3254
|
+
*/
|
|
3255
|
+
size?: ResponsiveTabsSize;
|
|
3256
|
+
/**
|
|
3257
|
+
* Visual variant - token-based
|
|
3258
|
+
*/
|
|
3259
|
+
variant?: TabsVariantToken;
|
|
3260
|
+
}
|
|
3261
|
+
interface TabsTriggerProps extends Omit<React$1.ComponentPropsWithoutRef<typeof TabsPrimitive.Trigger>, "size" | "variant" | "tone"> {
|
|
3262
|
+
/**
|
|
3263
|
+
* Size variant - token-based (inherited from context if not provided)
|
|
3264
|
+
*/
|
|
3265
|
+
size?: ResponsiveTabsSize;
|
|
3266
|
+
/**
|
|
3267
|
+
* Visual variant - token-based (inherited from context if not provided)
|
|
3268
|
+
*/
|
|
3269
|
+
variant?: TabsVariantToken;
|
|
3270
|
+
/**
|
|
3271
|
+
* Tone - token-based (inherited from context if not provided)
|
|
3272
|
+
*/
|
|
3273
|
+
tone?: TabsToneToken;
|
|
3274
|
+
/**
|
|
3275
|
+
* Leading icon - semantic prop
|
|
3276
|
+
*/
|
|
3277
|
+
leadingIcon?: React$1.ReactNode;
|
|
3278
|
+
/**
|
|
3279
|
+
* Trailing icon - semantic prop
|
|
3280
|
+
*/
|
|
3281
|
+
trailingIcon?: React$1.ReactNode;
|
|
3282
|
+
/**
|
|
3283
|
+
* Icon - semantic prop (for backward compatibility, maps to leadingIcon)
|
|
3284
|
+
*/
|
|
3285
|
+
icon?: React$1.ReactNode;
|
|
3286
|
+
}
|
|
3287
|
+
interface TabsContentProps extends Omit<React$1.ComponentPropsWithoutRef<typeof TabsPrimitive.Content>, "size"> {
|
|
3288
|
+
/**
|
|
3289
|
+
* Size variant - token-based (for padding)
|
|
3290
|
+
*/
|
|
3291
|
+
size?: ResponsiveTabsSize;
|
|
3292
|
+
}
|
|
3293
|
+
declare const Tabs: {
|
|
3294
|
+
Root: React$1.FC<TabsRootProps>;
|
|
3295
|
+
List: React$1.ForwardRefExoticComponent<TabsListProps & React$1.RefAttributes<HTMLDivElement>>;
|
|
3296
|
+
Trigger: React$1.ForwardRefExoticComponent<TabsTriggerProps & React$1.RefAttributes<HTMLButtonElement>>;
|
|
3297
|
+
Content: React$1.ForwardRefExoticComponent<TabsContentProps & React$1.RefAttributes<HTMLDivElement>>;
|
|
3298
|
+
};
|
|
3299
|
+
|
|
3300
|
+
declare const segmentedControlRootVariants: (props?: ({
|
|
3301
|
+
orientation?: "horizontal" | "vertical" | null | undefined;
|
|
3302
|
+
size?: "sm" | "md" | "lg" | null | undefined;
|
|
3303
|
+
} & class_variance_authority_types.ClassProp) | undefined) => string;
|
|
3304
|
+
declare const segmentedControlItemVariants: (props?: ({
|
|
3305
|
+
size?: "sm" | "md" | "lg" | null | undefined;
|
|
3306
|
+
state?: "default" | "selected" | null | undefined;
|
|
3307
|
+
} & class_variance_authority_types.ClassProp) | undefined) => string;
|
|
3308
|
+
interface SegmentedControlRootProps extends Omit<React$1.HTMLAttributes<HTMLDivElement>, "role">, VariantProps<typeof segmentedControlRootVariants> {
|
|
3309
|
+
/**
|
|
3310
|
+
* Controlled value
|
|
3311
|
+
*/
|
|
3312
|
+
value?: string;
|
|
3313
|
+
/**
|
|
3314
|
+
* Default value for uncontrolled usage
|
|
3315
|
+
*/
|
|
3316
|
+
defaultValue?: string;
|
|
3317
|
+
/**
|
|
3318
|
+
* Callback when value changes
|
|
3319
|
+
*/
|
|
3320
|
+
onValueChange?: (value: string) => void;
|
|
3321
|
+
/**
|
|
3322
|
+
* Name for the radio group
|
|
3323
|
+
*/
|
|
3324
|
+
name?: string;
|
|
3325
|
+
}
|
|
3326
|
+
interface SegmentedControlItemProps extends Omit<React$1.ButtonHTMLAttributes<HTMLButtonElement>, "role">, VariantProps<typeof segmentedControlItemVariants> {
|
|
3327
|
+
/**
|
|
3328
|
+
* Value of this item
|
|
3329
|
+
*/
|
|
3330
|
+
value: string;
|
|
3331
|
+
/**
|
|
3332
|
+
* Whether this item is disabled
|
|
3333
|
+
*/
|
|
3334
|
+
disabled?: boolean;
|
|
3335
|
+
}
|
|
3336
|
+
declare const SegmentedControl: React$1.ForwardRefExoticComponent<SegmentedControlRootProps & React$1.RefAttributes<HTMLDivElement>> & {
|
|
3337
|
+
Root: React$1.ForwardRefExoticComponent<SegmentedControlRootProps & React$1.RefAttributes<HTMLDivElement>>;
|
|
3338
|
+
Item: React$1.ForwardRefExoticComponent<SegmentedControlItemProps & React$1.RefAttributes<HTMLButtonElement>>;
|
|
3339
|
+
};
|
|
3340
|
+
|
|
3341
|
+
interface BreadcrumbItem {
|
|
3342
|
+
/**
|
|
3343
|
+
* Label text for the breadcrumb item
|
|
3344
|
+
*/
|
|
3345
|
+
label: string;
|
|
3346
|
+
/**
|
|
3347
|
+
* Optional href for clickable items
|
|
3348
|
+
*/
|
|
3349
|
+
href?: string;
|
|
3350
|
+
/**
|
|
3351
|
+
* Whether this item is disabled
|
|
3352
|
+
*/
|
|
3353
|
+
disabled?: boolean;
|
|
3354
|
+
}
|
|
3355
|
+
interface BreadcrumbsRootProps extends React$1.HTMLAttributes<HTMLElement> {
|
|
3356
|
+
/**
|
|
3357
|
+
* Array of breadcrumb items
|
|
3358
|
+
*/
|
|
3359
|
+
items: BreadcrumbItem[];
|
|
3360
|
+
/**
|
|
3361
|
+
* Custom separator component or string
|
|
3362
|
+
* @default ChevronRight icon
|
|
3363
|
+
*/
|
|
3364
|
+
separator?: React$1.ReactNode;
|
|
3365
|
+
/**
|
|
3366
|
+
* ARIA label for the navigation element
|
|
3367
|
+
* @default "Breadcrumb"
|
|
3368
|
+
*/
|
|
3369
|
+
ariaLabel?: string;
|
|
3370
|
+
}
|
|
3371
|
+
interface BreadcrumbsItemProps extends React$1.HTMLAttributes<HTMLLIElement> {
|
|
3372
|
+
/**
|
|
3373
|
+
* Whether this is the last item (current page)
|
|
3374
|
+
*/
|
|
3375
|
+
isLast?: boolean;
|
|
3376
|
+
/**
|
|
3377
|
+
* Whether this item is disabled
|
|
3378
|
+
*/
|
|
3379
|
+
disabled?: boolean;
|
|
3380
|
+
}
|
|
3381
|
+
interface BreadcrumbsSeparatorProps extends React$1.HTMLAttributes<HTMLSpanElement> {
|
|
3382
|
+
/**
|
|
3383
|
+
* Custom separator content
|
|
3384
|
+
*/
|
|
3385
|
+
children?: React$1.ReactNode;
|
|
3386
|
+
}
|
|
3387
|
+
declare const Breadcrumbs: React$1.ForwardRefExoticComponent<BreadcrumbsRootProps & React$1.RefAttributes<HTMLElement>> & {
|
|
3388
|
+
Root: React$1.ForwardRefExoticComponent<BreadcrumbsRootProps & React$1.RefAttributes<HTMLElement>>;
|
|
3389
|
+
Item: React$1.ForwardRefExoticComponent<BreadcrumbsItemProps & React$1.RefAttributes<HTMLLIElement>>;
|
|
3390
|
+
Separator: React$1.ForwardRefExoticComponent<BreadcrumbsSeparatorProps & React$1.RefAttributes<HTMLSpanElement>>;
|
|
3391
|
+
};
|
|
3392
|
+
|
|
3393
|
+
interface PaginationRootProps extends React$1.HTMLAttributes<HTMLElement> {
|
|
3394
|
+
/**
|
|
3395
|
+
* Current active page (1-indexed)
|
|
3396
|
+
*/
|
|
3397
|
+
currentPage: number;
|
|
3398
|
+
/**
|
|
3399
|
+
* Total number of pages
|
|
3400
|
+
*/
|
|
3401
|
+
totalPages: number;
|
|
3402
|
+
/**
|
|
3403
|
+
* Callback when page changes
|
|
3404
|
+
*/
|
|
3405
|
+
onPageChange: (page: number) => void;
|
|
3406
|
+
/**
|
|
3407
|
+
* Number of pages to show on each side of current page
|
|
3408
|
+
* @default 2
|
|
3409
|
+
*/
|
|
3410
|
+
delta?: number;
|
|
3411
|
+
/**
|
|
3412
|
+
* ARIA label for the navigation element
|
|
3413
|
+
* @default "Pagination"
|
|
3414
|
+
*/
|
|
3415
|
+
ariaLabel?: string;
|
|
3416
|
+
}
|
|
3417
|
+
interface PaginationItemProps extends React$1.ButtonHTMLAttributes<HTMLButtonElement> {
|
|
3418
|
+
/**
|
|
3419
|
+
* Page number (or "..." for ellipsis)
|
|
3420
|
+
*/
|
|
3421
|
+
page: number | "...";
|
|
3422
|
+
/**
|
|
3423
|
+
* Whether this is the current page
|
|
3424
|
+
*/
|
|
3425
|
+
isCurrent?: boolean;
|
|
3426
|
+
/**
|
|
3427
|
+
* Whether this item is disabled
|
|
3428
|
+
*/
|
|
3429
|
+
disabled?: boolean;
|
|
3430
|
+
}
|
|
3431
|
+
interface PaginationPrevProps extends React$1.ButtonHTMLAttributes<HTMLButtonElement> {
|
|
3432
|
+
/**
|
|
3433
|
+
* Whether previous button is disabled
|
|
3434
|
+
*/
|
|
3435
|
+
disabled?: boolean;
|
|
3436
|
+
}
|
|
3437
|
+
interface PaginationNextProps extends React$1.ButtonHTMLAttributes<HTMLButtonElement> {
|
|
3438
|
+
/**
|
|
3439
|
+
* Whether next button is disabled
|
|
3440
|
+
*/
|
|
3441
|
+
disabled?: boolean;
|
|
3442
|
+
}
|
|
3443
|
+
interface PaginationEllipsisProps extends React$1.HTMLAttributes<HTMLSpanElement> {
|
|
3444
|
+
}
|
|
3445
|
+
declare const Pagination: React$1.ForwardRefExoticComponent<PaginationRootProps & React$1.RefAttributes<HTMLElement>> & {
|
|
3446
|
+
Root: React$1.ForwardRefExoticComponent<PaginationRootProps & React$1.RefAttributes<HTMLElement>>;
|
|
3447
|
+
Item: React$1.ForwardRefExoticComponent<PaginationItemProps & React$1.RefAttributes<HTMLButtonElement>>;
|
|
3448
|
+
Prev: React$1.ForwardRefExoticComponent<PaginationPrevProps & React$1.RefAttributes<HTMLButtonElement>>;
|
|
3449
|
+
Next: React$1.ForwardRefExoticComponent<PaginationNextProps & React$1.RefAttributes<HTMLButtonElement>>;
|
|
3450
|
+
Ellipsis: React$1.ForwardRefExoticComponent<PaginationEllipsisProps & React$1.RefAttributes<HTMLSpanElement>>;
|
|
3451
|
+
};
|
|
3452
|
+
|
|
3453
|
+
interface StepperStep {
|
|
3454
|
+
/**
|
|
3455
|
+
* Unique identifier for the step
|
|
3456
|
+
*/
|
|
3457
|
+
id: string;
|
|
3458
|
+
/**
|
|
3459
|
+
* Label text for the step
|
|
3460
|
+
*/
|
|
3461
|
+
label: string;
|
|
3462
|
+
/**
|
|
3463
|
+
* Optional description for the step
|
|
3464
|
+
*/
|
|
3465
|
+
description?: string;
|
|
3466
|
+
/**
|
|
3467
|
+
* Optional icon for the step indicator
|
|
3468
|
+
*/
|
|
3469
|
+
icon?: React$1.ReactNode;
|
|
3470
|
+
/**
|
|
3471
|
+
* Whether this step is disabled
|
|
3472
|
+
*/
|
|
3473
|
+
disabled?: boolean;
|
|
3474
|
+
}
|
|
3475
|
+
interface StepperRootProps extends React$1.HTMLAttributes<HTMLDivElement> {
|
|
3476
|
+
/**
|
|
3477
|
+
* Array of steps
|
|
3478
|
+
*/
|
|
3479
|
+
steps: StepperStep[];
|
|
3480
|
+
/**
|
|
3481
|
+
* Current active step index (0-indexed)
|
|
3482
|
+
*/
|
|
3483
|
+
activeStep: number;
|
|
3484
|
+
/**
|
|
3485
|
+
* Orientation of the stepper
|
|
3486
|
+
* @default "horizontal"
|
|
3487
|
+
*/
|
|
3488
|
+
orientation?: "horizontal" | "vertical";
|
|
3489
|
+
/**
|
|
3490
|
+
* Whether to show step numbers
|
|
3491
|
+
* @default true
|
|
3492
|
+
*/
|
|
3493
|
+
showNumbers?: boolean;
|
|
3494
|
+
}
|
|
3495
|
+
interface StepperItemProps extends React$1.HTMLAttributes<HTMLDivElement> {
|
|
3496
|
+
/**
|
|
3497
|
+
* Step data
|
|
3498
|
+
*/
|
|
3499
|
+
step: StepperStep;
|
|
3500
|
+
/**
|
|
3501
|
+
* Step index (0-indexed)
|
|
3502
|
+
*/
|
|
3503
|
+
index: number;
|
|
3504
|
+
/**
|
|
3505
|
+
* Whether this is the active step
|
|
3506
|
+
*/
|
|
3507
|
+
isActive: boolean;
|
|
3508
|
+
/**
|
|
3509
|
+
* Whether this step is completed
|
|
3510
|
+
*/
|
|
3511
|
+
isCompleted: boolean;
|
|
3512
|
+
/**
|
|
3513
|
+
* Whether to show step number
|
|
3514
|
+
*/
|
|
3515
|
+
showNumber?: boolean;
|
|
3516
|
+
}
|
|
3517
|
+
interface StepperIndicatorProps extends React$1.HTMLAttributes<HTMLDivElement> {
|
|
3518
|
+
/**
|
|
3519
|
+
* Step index
|
|
3520
|
+
*/
|
|
3521
|
+
index: number;
|
|
3522
|
+
/**
|
|
3523
|
+
* Whether this is the active step
|
|
3524
|
+
*/
|
|
3525
|
+
isActive: boolean;
|
|
3526
|
+
/**
|
|
3527
|
+
* Whether this step is completed
|
|
3528
|
+
*/
|
|
3529
|
+
isCompleted: boolean;
|
|
3530
|
+
/**
|
|
3531
|
+
* Whether this step is disabled
|
|
3532
|
+
*/
|
|
3533
|
+
disabled?: boolean;
|
|
3534
|
+
/**
|
|
3535
|
+
* Custom icon
|
|
3536
|
+
*/
|
|
3537
|
+
icon?: React$1.ReactNode;
|
|
3538
|
+
/**
|
|
3539
|
+
* Whether to show step number
|
|
3540
|
+
*/
|
|
3541
|
+
showNumber?: boolean;
|
|
3542
|
+
}
|
|
3543
|
+
interface StepperLabelProps extends React$1.HTMLAttributes<HTMLDivElement> {
|
|
3544
|
+
/**
|
|
3545
|
+
* Step label text
|
|
3546
|
+
*/
|
|
3547
|
+
label: string;
|
|
3548
|
+
/**
|
|
3549
|
+
* Optional description
|
|
3550
|
+
*/
|
|
3551
|
+
description?: string;
|
|
3552
|
+
/**
|
|
3553
|
+
* Whether this is the active step
|
|
3554
|
+
*/
|
|
3555
|
+
isActive: boolean;
|
|
3556
|
+
}
|
|
3557
|
+
interface StepperContentProps extends React$1.HTMLAttributes<HTMLDivElement> {
|
|
3558
|
+
/**
|
|
3559
|
+
* Step index this content belongs to
|
|
3560
|
+
*/
|
|
3561
|
+
stepIndex: number;
|
|
3562
|
+
/**
|
|
3563
|
+
* Whether this content should be visible
|
|
3564
|
+
*/
|
|
3565
|
+
isActive: boolean;
|
|
3566
|
+
}
|
|
3567
|
+
/**
|
|
3568
|
+
* Stepper.Item - Individual step container
|
|
3569
|
+
*/
|
|
3570
|
+
interface StepperItemPropsInternal extends StepperItemProps {
|
|
3571
|
+
orientation?: "horizontal" | "vertical";
|
|
3572
|
+
}
|
|
3573
|
+
declare const Stepper: React$1.ForwardRefExoticComponent<StepperRootProps & React$1.RefAttributes<HTMLDivElement>> & {
|
|
3574
|
+
Root: React$1.ForwardRefExoticComponent<StepperRootProps & React$1.RefAttributes<HTMLDivElement>>;
|
|
3575
|
+
Item: React$1.ForwardRefExoticComponent<StepperItemPropsInternal & React$1.RefAttributes<HTMLDivElement>>;
|
|
3576
|
+
Indicator: React$1.ForwardRefExoticComponent<StepperIndicatorProps & React$1.RefAttributes<HTMLDivElement>>;
|
|
3577
|
+
Label: React$1.ForwardRefExoticComponent<StepperLabelProps & React$1.RefAttributes<HTMLDivElement>>;
|
|
3578
|
+
Content: React$1.ForwardRefExoticComponent<StepperContentProps & React$1.RefAttributes<HTMLDivElement>>;
|
|
3579
|
+
};
|
|
3580
|
+
|
|
3581
|
+
/**
|
|
3582
|
+
* Icon Props Interface
|
|
3583
|
+
*
|
|
3584
|
+
* Shared props interface for all icon components.
|
|
3585
|
+
* Ensures consistent API across all icons in the registry.
|
|
3586
|
+
*/
|
|
3587
|
+
|
|
3588
|
+
/**
|
|
3589
|
+
* Base props for all icon components
|
|
3590
|
+
*/
|
|
3591
|
+
interface IconProps$1 extends React$1.SVGProps<SVGSVGElement> {
|
|
3592
|
+
/**
|
|
3593
|
+
* Additional CSS classes
|
|
3594
|
+
*/
|
|
3595
|
+
className?: string;
|
|
3596
|
+
/**
|
|
3597
|
+
* Hide icon from screen readers
|
|
3598
|
+
* @default true
|
|
3599
|
+
*/
|
|
3600
|
+
"aria-hidden"?: boolean;
|
|
3601
|
+
/**
|
|
3602
|
+
* Accessible label for the icon
|
|
3603
|
+
*/
|
|
3604
|
+
"aria-label"?: string;
|
|
3605
|
+
}
|
|
3606
|
+
|
|
3607
|
+
/**
|
|
3608
|
+
* Arrow right icon component
|
|
3609
|
+
*/
|
|
3610
|
+
declare const IconArrowRight: React$1.FC<IconProps$1>;
|
|
3611
|
+
|
|
3612
|
+
/**
|
|
3613
|
+
* Calendar icon component
|
|
3614
|
+
*/
|
|
3615
|
+
declare const IconCalendar: React$1.FC<IconProps$1>;
|
|
3616
|
+
|
|
3617
|
+
/**
|
|
3618
|
+
* Check icon component (checkmark)
|
|
3619
|
+
*/
|
|
3620
|
+
declare const IconCheck: React$1.FC<IconProps$1>;
|
|
3621
|
+
|
|
3622
|
+
/**
|
|
3623
|
+
* Chevron down icon component
|
|
3624
|
+
*/
|
|
3625
|
+
declare const IconChevronDown: React$1.FC<IconProps$1>;
|
|
3626
|
+
|
|
3627
|
+
/**
|
|
3628
|
+
* Chevron right icon component
|
|
3629
|
+
*/
|
|
3630
|
+
declare const IconChevronRight: React$1.FC<IconProps$1>;
|
|
3631
|
+
|
|
3632
|
+
/**
|
|
3633
|
+
* Close icon component (X)
|
|
3634
|
+
*/
|
|
3635
|
+
declare const IconClose: React$1.FC<IconProps$1>;
|
|
3636
|
+
|
|
3637
|
+
/**
|
|
3638
|
+
* Error icon component (X in circle - used as fallback)
|
|
3639
|
+
*/
|
|
3640
|
+
declare const IconError: React$1.FC<IconProps$1>;
|
|
3641
|
+
|
|
3642
|
+
/**
|
|
3643
|
+
* Info icon component (information circle)
|
|
3644
|
+
*/
|
|
3645
|
+
declare const IconInfo: React$1.FC<IconProps$1>;
|
|
3646
|
+
|
|
3647
|
+
/**
|
|
3648
|
+
* Location icon component
|
|
3649
|
+
*/
|
|
3650
|
+
declare const IconLocation: React$1.FC<IconProps$1>;
|
|
3651
|
+
|
|
3652
|
+
/**
|
|
3653
|
+
* Menu icon component (hamburger menu)
|
|
3654
|
+
*/
|
|
3655
|
+
declare const IconMenu: React$1.FC<IconProps$1>;
|
|
3656
|
+
|
|
3657
|
+
/**
|
|
3658
|
+
* Search icon component
|
|
3659
|
+
*/
|
|
3660
|
+
declare const IconSearch: React$1.FC<IconProps$1>;
|
|
3661
|
+
|
|
3662
|
+
/**
|
|
3663
|
+
* Success icon component (checkmark in circle)
|
|
3664
|
+
*/
|
|
3665
|
+
declare const IconSuccess: React$1.FC<IconProps$1>;
|
|
3666
|
+
|
|
3667
|
+
/**
|
|
3668
|
+
* Warning icon component (warning triangle)
|
|
3669
|
+
*/
|
|
3670
|
+
declare const IconWarning: React$1.FC<IconProps$1>;
|
|
3671
|
+
|
|
3672
|
+
/**
|
|
3673
|
+
* Icon Registry
|
|
3674
|
+
*
|
|
3675
|
+
* Central registry for all icon components.
|
|
3676
|
+
* Supports tree-shaking through individual named exports.
|
|
3677
|
+
*/
|
|
3678
|
+
|
|
3679
|
+
/**
|
|
3680
|
+
* Icons map for registry lookup
|
|
3681
|
+
* Used by Icon component to resolve icon by name
|
|
3682
|
+
*/
|
|
3683
|
+
declare const ICONS_MAP: Record<string, React$1.FC<IconProps$1>>;
|
|
3684
|
+
/**
|
|
3685
|
+
* Icon name type - union of all available icon names
|
|
3686
|
+
*/
|
|
3687
|
+
type IconName = keyof typeof ICONS_MAP;
|
|
3688
|
+
|
|
3689
|
+
declare const iconVariants: (props?: ({
|
|
3690
|
+
size?: "sm" | "md" | "lg" | "xl" | null | undefined;
|
|
3691
|
+
color?: "muted" | "default" | "success" | "warning" | "danger" | "info" | null | undefined;
|
|
3692
|
+
stroke?: "normal" | "bold" | "thin" | null | undefined;
|
|
3693
|
+
} & class_variance_authority_types.ClassProp) | undefined) => string;
|
|
3694
|
+
interface IconProps extends Omit<React$1.SVGProps<SVGSVGElement>, "color" | "stroke">, VariantProps<typeof iconVariants> {
|
|
3695
|
+
/**
|
|
3696
|
+
* Icon name from registry
|
|
3697
|
+
*/
|
|
3698
|
+
name: IconName;
|
|
3699
|
+
/**
|
|
3700
|
+
* Render as child element (composition pattern)
|
|
3701
|
+
* Uses Radix UI Slot for composition
|
|
3702
|
+
*/
|
|
3703
|
+
asChild?: boolean;
|
|
3704
|
+
}
|
|
3705
|
+
/**
|
|
3706
|
+
* Icon component
|
|
3707
|
+
*
|
|
3708
|
+
* Unified icon component with token-driven sizing, colors, and stroke.
|
|
3709
|
+
* Supports SSR-safe rendering and tree-shakeable icon registry.
|
|
3710
|
+
*
|
|
3711
|
+
* @example
|
|
3712
|
+
* ```tsx
|
|
3713
|
+
* <Icon name="search" size="md" color="default" />
|
|
3714
|
+
* ```
|
|
3715
|
+
*/
|
|
3716
|
+
declare const Icon: React$1.ForwardRefExoticComponent<Omit<IconProps, "ref"> & React$1.RefAttributes<SVGSVGElement>>;
|
|
3717
|
+
|
|
3718
|
+
/**
|
|
3719
|
+
* Tenerife Animation System Types
|
|
3720
|
+
*
|
|
3721
|
+
* Type definitions for TAS animation system
|
|
3722
|
+
*/
|
|
3723
|
+
|
|
3724
|
+
/**
|
|
3725
|
+
* Animation props for layout primitives
|
|
3726
|
+
* Returns CSS class names for Motion Tokens V2 animations
|
|
3727
|
+
*/
|
|
3728
|
+
interface AnimationProps {
|
|
3729
|
+
/**
|
|
3730
|
+
* CSS class name for the animation
|
|
3731
|
+
* Maps to tm-motion-* utility classes
|
|
3732
|
+
*/
|
|
3733
|
+
className?: string;
|
|
3734
|
+
}
|
|
3735
|
+
/**
|
|
3736
|
+
* Component animation configuration
|
|
3737
|
+
* Allows components to accept animation presets as props
|
|
3738
|
+
*/
|
|
3739
|
+
interface ComponentAnimationConfig {
|
|
3740
|
+
/**
|
|
3741
|
+
* Animation preset for initial mount/entrance - token-based
|
|
3742
|
+
* Uses predefined animation preset tokens
|
|
3743
|
+
*/
|
|
3744
|
+
animation?: ResponsiveAnimationPreset | string;
|
|
3745
|
+
/**
|
|
3746
|
+
* Animation preset for hover state
|
|
3747
|
+
* Can be a preset name string or CSS class name
|
|
3748
|
+
*/
|
|
3749
|
+
hoverAnimation?: "hoverLift" | "hoverScale" | "tapScale" | string;
|
|
3750
|
+
/**
|
|
3751
|
+
* Custom animation class name (overrides preset names)
|
|
3752
|
+
*/
|
|
3753
|
+
animationProps?: AnimationProps;
|
|
3754
|
+
}
|
|
3755
|
+
|
|
3756
|
+
/**
|
|
3757
|
+
* ArtistCard Size Variant
|
|
3758
|
+
*/
|
|
3759
|
+
type ArtistCardSize = "default" | "compact";
|
|
3760
|
+
/**
|
|
3761
|
+
* ArtistCard Style Variant
|
|
3762
|
+
*/
|
|
3763
|
+
type ArtistCardVariant = "default" | "featured";
|
|
3764
|
+
/**
|
|
3765
|
+
* Props for ArtistCard component.
|
|
3766
|
+
* All props are flat and domain-agnostic. Consumer should provide pre-localized strings.
|
|
3767
|
+
*/
|
|
3768
|
+
interface ArtistCardProps extends React$1.HTMLAttributes<HTMLDivElement> {
|
|
3769
|
+
/** Artist name (pre-localized string, required) */
|
|
3770
|
+
name: string;
|
|
3771
|
+
/** Artist description (pre-localized string, optional) */
|
|
3772
|
+
description?: string;
|
|
3773
|
+
/** Genres as comma-separated string (e.g., "Jazz, Blues, Rock", optional) */
|
|
3774
|
+
genres?: string;
|
|
3775
|
+
/** Follower count for popularity metric (optional) */
|
|
3776
|
+
followers?: number;
|
|
3777
|
+
/** Plays/listens count for popularity metric (optional) */
|
|
3778
|
+
plays?: number;
|
|
3779
|
+
/** Image URL (optional) */
|
|
3780
|
+
imageUrl?: string;
|
|
3781
|
+
/** Link URL for artist details page (optional) */
|
|
3782
|
+
href?: string;
|
|
3783
|
+
/** Whether this is a featured artist */
|
|
3784
|
+
featured?: boolean;
|
|
3785
|
+
/** Show image section */
|
|
3786
|
+
showImage?: boolean;
|
|
3787
|
+
/** Badge text for featured artists (optional) */
|
|
3788
|
+
popularBadgeText?: string;
|
|
3789
|
+
/** Label for followers count (required) */
|
|
3790
|
+
followersLabel: string;
|
|
3791
|
+
/** Label for plays count (required) */
|
|
3792
|
+
playsLabel: string;
|
|
3793
|
+
/** Size variant - controls padding and gap */
|
|
3794
|
+
size?: ArtistCardSize;
|
|
3795
|
+
/** Style variant - controls visual appearance */
|
|
3796
|
+
variant?: ArtistCardVariant;
|
|
3797
|
+
/** Animation configuration for entrance and hover animations */
|
|
3798
|
+
animation?: ComponentAnimationConfig;
|
|
3799
|
+
}
|
|
3800
|
+
|
|
3801
|
+
/**
|
|
3802
|
+
* ArtistCard Component
|
|
3803
|
+
*
|
|
3804
|
+
* Domain-specific card component for displaying artist information.
|
|
3805
|
+
* Uses CardBase for layout and DOMAIN_TOKENS for all styling.
|
|
3806
|
+
* Supports size variants (default, compact) and style variants (default, featured).
|
|
3807
|
+
*
|
|
3808
|
+
* @example
|
|
3809
|
+
* ```tsx
|
|
3810
|
+
* <ArtistCard
|
|
3811
|
+
* name="Artist Name"
|
|
3812
|
+
* genres="Jazz, Blues"
|
|
3813
|
+
* followers={1200}
|
|
3814
|
+
* plays={50000}
|
|
3815
|
+
* followersLabel="followers"
|
|
3816
|
+
* playsLabel="plays"
|
|
3817
|
+
* />
|
|
3818
|
+
* ```
|
|
3819
|
+
*/
|
|
3820
|
+
declare const ArtistCard: React$1.ForwardRefExoticComponent<ArtistCardProps & React$1.RefAttributes<HTMLDivElement>>;
|
|
3821
|
+
|
|
3822
|
+
/**
|
|
3823
|
+
* EventCard Size Variant
|
|
3824
|
+
*/
|
|
3825
|
+
type EventCardSize = "default" | "compact";
|
|
3826
|
+
/**
|
|
3827
|
+
* EventCard Style Variant
|
|
3828
|
+
*/
|
|
3829
|
+
type EventCardVariant = "default" | "featured";
|
|
3830
|
+
/**
|
|
3831
|
+
* Props for EventCard component.
|
|
3832
|
+
* All props are flat and domain-agnostic. Consumer should provide pre-localized strings.
|
|
3833
|
+
*/
|
|
3834
|
+
interface EventCardProps {
|
|
3835
|
+
/** Event title (pre-localized string) */
|
|
3836
|
+
title: string;
|
|
3837
|
+
/** Event description (pre-localized string, optional) */
|
|
3838
|
+
description?: string;
|
|
3839
|
+
/** Event date/time display string (pre-formatted, optional) */
|
|
3840
|
+
date?: string;
|
|
3841
|
+
/** Venue name (pre-localized string, optional) */
|
|
3842
|
+
venueName?: string;
|
|
3843
|
+
/** Price display string with currency (e.g., "€20 - €50", optional) */
|
|
3844
|
+
price?: string;
|
|
3845
|
+
/** Image URL (optional) */
|
|
3846
|
+
imageUrl?: string;
|
|
3847
|
+
/** Link URL for event details page (optional) */
|
|
3848
|
+
href?: string;
|
|
3849
|
+
/** External ticket purchase URL (optional) */
|
|
3850
|
+
ticketUrl?: string;
|
|
3851
|
+
/** Whether this is a featured event */
|
|
3852
|
+
featured?: boolean;
|
|
3853
|
+
/** Show image section */
|
|
3854
|
+
showImage?: boolean;
|
|
3855
|
+
/** Label for "Get Tickets" button (required) */
|
|
3856
|
+
getTicketsLabel: string;
|
|
3857
|
+
/** Badge text for featured events (optional) */
|
|
3858
|
+
featuredBadgeText?: string;
|
|
3859
|
+
/** Size variant - controls padding and spacing */
|
|
3860
|
+
size?: EventCardSize;
|
|
3861
|
+
/** Style variant - controls visual appearance */
|
|
3862
|
+
variant?: EventCardVariant;
|
|
3863
|
+
/** Additional CSS classes */
|
|
3864
|
+
className?: string;
|
|
3865
|
+
/** Animation configuration for entrance and hover animations */
|
|
3866
|
+
animation?: ComponentAnimationConfig;
|
|
3867
|
+
}
|
|
3868
|
+
|
|
3869
|
+
/**
|
|
3870
|
+
* EventCard Component
|
|
3871
|
+
*
|
|
3872
|
+
* Domain-specific card component for displaying event information.
|
|
3873
|
+
* Uses CardBase for layout and DOMAIN_TOKENS for all styling.
|
|
3874
|
+
*
|
|
3875
|
+
* @example
|
|
3876
|
+
* ```tsx
|
|
3877
|
+
* <EventCard
|
|
3878
|
+
* title="Concert"
|
|
3879
|
+
* date="2024-01-01"
|
|
3880
|
+
* venueName="Venue"
|
|
3881
|
+
* getTicketsLabel="Get Tickets"
|
|
3882
|
+
* />
|
|
3883
|
+
* ```
|
|
3884
|
+
*/
|
|
3885
|
+
declare const EventCard: React$1.ForwardRefExoticComponent<EventCardProps & React$1.RefAttributes<HTMLDivElement>>;
|
|
3886
|
+
|
|
3887
|
+
/**
|
|
3888
|
+
* PromoCard Size Variant
|
|
3889
|
+
*/
|
|
3890
|
+
type PromoCardSize = "default" | "compact";
|
|
3891
|
+
/**
|
|
3892
|
+
* PromoCard Style Variant
|
|
3893
|
+
*/
|
|
3894
|
+
type PromoCardVariant = "default" | "featured";
|
|
3895
|
+
/**
|
|
3896
|
+
* Props for PromoCard component.
|
|
3897
|
+
* All props are flat and domain-agnostic. Consumer should provide pre-localized strings.
|
|
3898
|
+
*/
|
|
3899
|
+
interface PromoCardProps extends React$1.HTMLAttributes<HTMLDivElement> {
|
|
3900
|
+
/** Promo title (pre-localized string, required) */
|
|
3901
|
+
title: string;
|
|
3902
|
+
/** Promo description (pre-localized string, optional) */
|
|
3903
|
+
description?: string;
|
|
3904
|
+
/** Image URL (optional) */
|
|
3905
|
+
imageUrl?: string;
|
|
3906
|
+
/** Link URL for promo details page (optional) */
|
|
3907
|
+
href?: string;
|
|
3908
|
+
/** CTA button URL (optional) */
|
|
3909
|
+
ctaUrl?: string;
|
|
3910
|
+
/** Label for CTA button (required) */
|
|
3911
|
+
ctaLabel: string;
|
|
3912
|
+
/** Whether this is a featured promo */
|
|
3913
|
+
featured?: boolean;
|
|
3914
|
+
/** Badge text for featured promos (optional) */
|
|
3915
|
+
featuredBadgeText?: string;
|
|
3916
|
+
/** Show image section */
|
|
3917
|
+
showImage?: boolean;
|
|
3918
|
+
/** Size variant - controls padding and spacing */
|
|
3919
|
+
size?: PromoCardSize;
|
|
3920
|
+
/** Style variant - controls visual appearance */
|
|
3921
|
+
variant?: PromoCardVariant;
|
|
3922
|
+
/** Additional CSS classes */
|
|
3923
|
+
className?: string;
|
|
3924
|
+
/** Animation configuration for entrance and hover animations */
|
|
3925
|
+
animation?: ComponentAnimationConfig;
|
|
3926
|
+
}
|
|
3927
|
+
|
|
3928
|
+
/**
|
|
3929
|
+
* PromoCard Component
|
|
3930
|
+
*
|
|
3931
|
+
* Domain-specific card component for displaying promotional content.
|
|
3932
|
+
* Uses CardBase for layout and DOMAIN_TOKENS for all styling.
|
|
3933
|
+
* CTA button uses BUTTON_TOKENS for styling.
|
|
3934
|
+
*
|
|
3935
|
+
* @example
|
|
3936
|
+
* ```tsx
|
|
3937
|
+
* <PromoCard
|
|
3938
|
+
* title="Special Offer"
|
|
3939
|
+
* description="Get 20% off on all tickets"
|
|
3940
|
+
* ctaLabel="Learn More"
|
|
3941
|
+
* ctaUrl="/promo"
|
|
3942
|
+
* />
|
|
3943
|
+
* ```
|
|
3944
|
+
*/
|
|
3945
|
+
declare const PromoCard: React$1.ForwardRefExoticComponent<PromoCardProps & React$1.RefAttributes<HTMLDivElement>>;
|
|
3946
|
+
|
|
3947
|
+
/**
|
|
3948
|
+
* TicketCard Size Variant
|
|
3949
|
+
*/
|
|
3950
|
+
type TicketCardSize = "default" | "compact";
|
|
3951
|
+
/**
|
|
3952
|
+
* TicketCard Style Variant
|
|
3953
|
+
*/
|
|
3954
|
+
type TicketCardVariant = "default" | "featured";
|
|
3955
|
+
/**
|
|
3956
|
+
* Ticket Availability Status
|
|
3957
|
+
*/
|
|
3958
|
+
type TicketAvailability = "available" | "sold_out" | "available_soon";
|
|
3959
|
+
/**
|
|
3960
|
+
* Props for TicketCard component.
|
|
3961
|
+
* All props are flat and domain-agnostic. Consumer should provide pre-localized strings.
|
|
3962
|
+
*/
|
|
3963
|
+
interface TicketCardProps {
|
|
3964
|
+
/** Ticket type/name (pre-localized string) */
|
|
3965
|
+
title: string;
|
|
3966
|
+
/** Ticket description (pre-localized string, optional) */
|
|
3967
|
+
description?: string;
|
|
3968
|
+
/** Price display string with currency (e.g., "€20", optional) */
|
|
3969
|
+
price?: string;
|
|
3970
|
+
/** Capacity display string (e.g., "50 tickets", optional) */
|
|
3971
|
+
capacity?: string;
|
|
3972
|
+
/** Availability status */
|
|
3973
|
+
availability?: TicketAvailability;
|
|
3974
|
+
/** Image URL (optional) */
|
|
3975
|
+
imageUrl?: string;
|
|
3976
|
+
/** Link URL for ticket details (optional) */
|
|
3977
|
+
href?: string;
|
|
3978
|
+
/** Purchase action URL (optional) */
|
|
3979
|
+
purchaseUrl?: string;
|
|
3980
|
+
/** Label for purchase button (required) */
|
|
3981
|
+
purchaseLabel: string;
|
|
3982
|
+
/** VIP badge text (optional) */
|
|
3983
|
+
vipBadgeText?: string;
|
|
3984
|
+
/** Discount badge text (optional) */
|
|
3985
|
+
discountBadgeText?: string;
|
|
3986
|
+
/** Whether this is a featured ticket */
|
|
3987
|
+
featured?: boolean;
|
|
3988
|
+
/** Badge text for featured tickets (optional) */
|
|
3989
|
+
featuredBadgeText?: string;
|
|
3990
|
+
/** Show image section */
|
|
3991
|
+
showImage?: boolean;
|
|
3992
|
+
/** Size variant - controls padding and spacing */
|
|
3993
|
+
size?: TicketCardSize;
|
|
3994
|
+
/** Style variant - controls visual appearance */
|
|
3995
|
+
variant?: TicketCardVariant;
|
|
3996
|
+
/** Additional CSS classes */
|
|
3997
|
+
className?: string;
|
|
3998
|
+
/** Animation configuration for entrance and hover animations */
|
|
3999
|
+
animation?: ComponentAnimationConfig;
|
|
4000
|
+
}
|
|
4001
|
+
|
|
4002
|
+
/**
|
|
4003
|
+
* TicketCard Component
|
|
4004
|
+
*
|
|
4005
|
+
* Domain-specific card component for displaying ticket information.
|
|
4006
|
+
* Uses CardBase for layout and DOMAIN_TOKENS for all styling.
|
|
4007
|
+
*
|
|
4008
|
+
* @example
|
|
4009
|
+
* ```tsx
|
|
4010
|
+
* <TicketCard
|
|
4011
|
+
* title="VIP Ticket"
|
|
4012
|
+
* price="€50"
|
|
4013
|
+
* capacity="10 tickets left"
|
|
4014
|
+
* purchaseLabel="Buy Now"
|
|
4015
|
+
* />
|
|
4016
|
+
* ```
|
|
4017
|
+
*/
|
|
4018
|
+
declare const TicketCard: React$1.ForwardRefExoticComponent<TicketCardProps & React$1.RefAttributes<HTMLDivElement>>;
|
|
4019
|
+
|
|
4020
|
+
export { Alert, type AlertProps, ArtistCard, type ArtistCardProps, type ArtistCardSize, type ArtistCardVariant, Backdrop, type BackdropProps, Body, type BodyProps, Box, type BoxProps, type BreadcrumbItem, Breadcrumbs, type BreadcrumbsItemProps, type BreadcrumbsRootProps, type BreadcrumbsSeparatorProps, Button, type ButtonProps, Caption, type CaptionProps, Card, CardBody, type CardBodyProps, CardFooter, type CardFooterProps, CardHeader, type CardHeaderProps, type CardProps, Checkbox, type CheckboxProps, Code, type CodeProps, Column, type StackProps as ColumnProps, Container, type ContainerProps, Surface as ContainerSurface, type SurfaceProps as ContainerSurfaceProps, ContextMenu, ContextMenuCheckboxItem, type ContextMenuCheckboxItemProps, ContextMenuContent, type ContextMenuContentProps, ContextMenuItem, type ContextMenuItemProps, ContextMenuLabel, type ContextMenuLabelProps, ContextMenuRadioGroup, type ContextMenuRadioGroupProps, ContextMenuRadioItem, type ContextMenuRadioItemProps, ContextMenuRoot, type ContextMenuRootProps, ContextMenuSeparator, type ContextMenuSeparatorProps, ContextMenuSub, ContextMenuSubContent, type ContextMenuSubContentProps, type ContextMenuSubProps, ContextMenuSubTrigger, type ContextMenuSubTriggerProps, ContextMenuTrigger, type ContextMenuTriggerProps, DataListRoot as DataList, DataListItem, type DataListItemProps, DataListLabel, type DataListLabelProps, DataListRoot, type DataListRootProps, DataListValue, type DataListValueProps, Dialog, DialogBody, type DialogBodyProps, DialogDescription, type DialogDescriptionProps, DialogFooter, type DialogFooterProps, DialogHeader, type DialogHeaderProps, type DialogProps, DialogRoot, DialogTitle, type DialogTitleProps, Display, type DisplayProps, DropdownMenuCheckItem, type DropdownMenuCheckItemProps, DropdownMenuContent, type DropdownMenuContentProps, DropdownMenuGroup, type DropdownMenuGroupProps, DropdownMenuItem, type DropdownMenuItemProps, DropdownMenuLabel, type DropdownMenuLabelProps, DropdownMenuRadioGroup, type DropdownMenuRadioGroupProps, DropdownMenuRadioItem, type DropdownMenuRadioItemProps, DropdownMenuRoot, type DropdownMenuRootProps, DropdownMenuSeparator, type DropdownMenuSeparatorProps, DropdownMenuSub, DropdownMenuSubContent, type DropdownMenuSubContentProps, type DropdownMenuSubProps, DropdownMenuSubTrigger, type DropdownMenuSubTriggerProps, DropdownMenuTrigger, type DropdownMenuTriggerProps, EmptyState, EmptyStateAction, type EmptyStateActionProps, EmptyStateDescription, type EmptyStateDescriptionProps, EmptyStateIcon, type EmptyStateIconProps, type EmptyStateProps, EmptyStateTitle, type EmptyStateTitleProps, EventCard, type EventCardProps, type EventCardSize, type EventCardVariant, FieldRoot as Field, type FieldControlProps, type FieldDescriptionProps, type FieldErrorProps, type FieldLabelProps, type FieldProps, Flex, type FlexProps, Grid, type GridProps, type GroupByFunction, Heading, type HeadingProps, HoverCardContent, type HoverCardContentProps, HoverCardRoot, type HoverCardRootProps, HoverCardTrigger, type HoverCardTriggerProps, ICONS_MAP, Icon, IconArrowRight, IconCalendar, IconCheck, IconChevronDown, IconChevronRight, IconClose, type IconProps$1 as IconComponentProps, IconError, IconInfo, IconLocation, IconMenu, type IconName, type IconProps, IconSearch, IconSuccess, IconWarning, Input, type InputProps, Label, type LabelProps, Lead, type LeadProps, Modal, ModalClose, type ModalCloseProps, ModalContent, type ModalContentProps, ModalDescription, type ModalDescriptionProps, ModalFooter, type ModalFooterProps, ModalHeader, type ModalHeaderProps, ModalOverlay, type ModalOverlayProps, ModalRoot, type ModalRootProps, ModalTitle, type ModalTitleProps, ModalTrigger, type ModalTriggerProps, NotificationCenter, NotificationCenterDismissAll, type NotificationCenterDismissAllProps, NotificationCenterGroupHeader, type NotificationCenterGroupHeaderProps, NotificationCenterItem, type NotificationCenterItemProps, NotificationCenterList, type NotificationCenterListProps, NotificationCenterPanel, type NotificationCenterPanelProps, NotificationCenterProvider, type NotificationCenterProviderProps, NotificationCenterTrigger, type NotificationCenterTriggerProps, type NotificationChannel, type NotificationContextType, type NotificationData, type NotificationOptions, type NotificationVariant, Pagination, type PaginationEllipsisProps, type PaginationItemProps, type PaginationNextProps, type PaginationPrevProps, type PaginationRootProps, PopoverArrow, type PopoverArrowProps, PopoverContent, type PopoverContentProps, PopoverRoot, type PopoverRootProps, PopoverTrigger, type PopoverTriggerProps, Portal, type PortalProps, PromoCard, type PromoCardProps, type PromoCardSize, type PromoCardVariant, Radio, RadioGroup, type RadioGroupProps, type RadioProps, Responsive, Row, type RowProps, Section, type SectionProps, SegmentedControl, type SegmentedControlItemProps, type SegmentedControlRootProps, Select, SelectContent, type SelectContentProps, SelectGroup, type SelectGroupProps, SelectIcon, type SelectIconProps, SelectItem, SelectItemIndicator, type SelectItemIndicatorProps, type SelectItemProps, SelectItemText, type SelectItemTextProps, SelectLabel, type SelectLabelProps, SelectRoot, type SelectRootProps, SelectSeparator, type SelectSeparatorProps, type SelectSize, type SelectState, SelectTrigger, type SelectTriggerProps, SelectValue, type SelectValueProps, type SelectVariant, SelectViewport, type SelectViewportProps, type SelectWidth, Skeleton, type SkeletonProps, type SortDirection, type SortState, Stack, type StackProps, Stepper, type StepperContentProps, type StepperIndicatorProps, type StepperItemProps, type StepperLabelProps, type StepperRootProps, type StepperStep, Surface$1 as Surface, type SurfaceProps$1 as SurfaceProps, TableRoot as Table, TableBody, type TableBodyProps, TableCell, type TableCellProps, type TableColumn, type TableContextValue, TableEmpty, type TableEmptyProps, TableExpandableContent, type TableExpandableContentProps, TableHead, type TableHeadProps, TableHeader, type TableHeaderProps, TableLoadingState, type TableLoadingStateProps, TableRoot, type TableRootProps, TableRow, type TableRowProps, TableSortIcon, type TableSortIconProps, Tabs, type TabsContentProps, type TabsListProps, type TabsRootProps, type TabsTriggerProps, Text, type TextProps, type TextSize, type TextWeight, Textarea, type TextareaProps, type TicketAvailability, TicketCard, type TicketCardProps, type TicketCardSize, type TicketCardVariant, Toast, ToastAction, type ToastData, type ToastOptions, type ToastPosition, type ToastProps, ToastProvider, type ToastProviderProps, ToastViewport, type ToastViewportProps, alertVariants, bodyVariants, buttonVariants, captionVariants, checkboxVariants, codeVariants, surfaceVariants as containerSurfaceVariants, displayVariants, headingVariants, iconVariants, inputVariants, labelVariants, leadVariants, popoverContentVariants, radioVariants, segmentedControlItemVariants, segmentedControlRootVariants, skeletonVariants, surfaceVariants$1 as surfaceVariants, textVariants, textareaVariants, useNotificationCenter, useNotificationCenterContext, useTableContext, useToast };
|