@nadicodeai/ui 12.1.102 → 12.1.103
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/dist/components/accordion.d.ts +38 -12
- package/dist/components/accordion.d.ts.map +1 -1
- package/dist/components/accordion.js +36 -15
- package/dist/components/account-menu.js +2 -2
- package/dist/components/action-menu.d.ts +20 -19
- package/dist/components/action-menu.d.ts.map +1 -1
- package/dist/components/action-menu.js +22 -15
- package/dist/components/action-status.d.ts +14 -10
- package/dist/components/action-status.d.ts.map +1 -1
- package/dist/components/action-status.js +14 -10
- package/dist/components/activity-calendar.d.ts +3 -1
- package/dist/components/activity-calendar.d.ts.map +1 -1
- package/dist/components/activity-calendar.js +16 -2
- package/dist/components/activity-feed.d.ts +2 -2
- package/dist/components/activity-feed.d.ts.map +1 -1
- package/dist/components/activity-feed.js +14 -5
- package/dist/components/agent-card.d.ts +11 -5
- package/dist/components/agent-card.d.ts.map +1 -1
- package/dist/components/agent-card.js +13 -7
- package/dist/components/agent-list-row.js +1 -1
- package/dist/components/agent-orb-appearance.d.ts +7 -1
- package/dist/components/agent-orb-appearance.d.ts.map +1 -1
- package/dist/components/agent-orb-appearance.js +26 -0
- package/dist/components/agent-profile.d.ts +8 -7
- package/dist/components/agent-profile.d.ts.map +1 -1
- package/dist/components/agent-profile.js +6 -6
- package/dist/components/alert-dialog.d.ts +25 -16
- package/dist/components/alert-dialog.d.ts.map +1 -1
- package/dist/components/alert-dialog.js +30 -18
- package/dist/components/alert.d.ts +1 -1
- package/dist/components/avatar.d.ts +83 -17
- package/dist/components/avatar.d.ts.map +1 -1
- package/dist/components/avatar.js +89 -23
- package/dist/components/badge.d.ts +59 -8
- package/dist/components/badge.d.ts.map +1 -1
- package/dist/components/badge.js +57 -14
- package/dist/components/breadcrumb.d.ts +18 -7
- package/dist/components/breadcrumb.d.ts.map +1 -1
- package/dist/components/breadcrumb.js +37 -13
- package/dist/components/button-group.d.ts +12 -15
- package/dist/components/button-group.d.ts.map +1 -1
- package/dist/components/button-group.js +13 -17
- package/dist/components/button.d.ts +126 -23
- package/dist/components/button.d.ts.map +1 -1
- package/dist/components/button.js +164 -39
- package/dist/components/calendar.d.ts +26 -15
- package/dist/components/calendar.d.ts.map +1 -1
- package/dist/components/calendar.js +60 -46
- package/dist/components/card-row.d.ts +13 -5
- package/dist/components/card-row.d.ts.map +1 -1
- package/dist/components/card-row.js +24 -10
- package/dist/components/card.d.ts +6 -12
- package/dist/components/card.d.ts.map +1 -1
- package/dist/components/card.js +11 -16
- package/dist/components/carousel.d.ts +3 -3
- package/dist/components/carousel.d.ts.map +1 -1
- package/dist/components/carousel.js +7 -7
- package/dist/components/catalog-drawer.d.ts +7 -7
- package/dist/components/catalog-drawer.d.ts.map +1 -1
- package/dist/components/catalog-drawer.js +6 -6
- package/dist/components/chart-area-stacked.d.ts +1 -1
- package/dist/components/chart-area-stacked.d.ts.map +1 -1
- package/dist/components/chart-area-stacked.js +4 -4
- package/dist/components/chart-axis.d.ts +14 -1
- package/dist/components/chart-axis.d.ts.map +1 -1
- package/dist/components/chart-axis.js +11 -1
- package/dist/components/chart-bar-horizontal.d.ts +2 -2
- package/dist/components/chart-bar-horizontal.d.ts.map +1 -1
- package/dist/components/chart-bar-horizontal.js +14 -5
- package/dist/components/chart-bar-multiple.d.ts +1 -1
- package/dist/components/chart-bar-multiple.d.ts.map +1 -1
- package/dist/components/chart-bar-multiple.js +3 -3
- package/dist/components/chart-bar-stacked.d.ts +1 -1
- package/dist/components/chart-bar-stacked.d.ts.map +1 -1
- package/dist/components/chart-bar-stacked.js +3 -3
- package/dist/components/chart-card.d.ts +17 -6
- package/dist/components/chart-card.d.ts.map +1 -1
- package/dist/components/chart-card.js +11 -4
- package/dist/components/chart-date-range-control.d.ts +18 -9
- package/dist/components/chart-date-range-control.d.ts.map +1 -1
- package/dist/components/chart-date-range-control.js +43 -47
- package/dist/components/chart-sparkline.d.ts +4 -3
- package/dist/components/chart-sparkline.d.ts.map +1 -1
- package/dist/components/chart-sparkline.js +6 -5
- package/dist/components/check-counts.d.ts +44 -0
- package/dist/components/check-counts.d.ts.map +1 -0
- package/dist/components/check-counts.js +51 -0
- package/dist/components/checkbox.d.ts +39 -11
- package/dist/components/checkbox.d.ts.map +1 -1
- package/dist/components/checkbox.js +38 -11
- package/dist/components/choicebox.d.ts +96 -0
- package/dist/components/choicebox.d.ts.map +1 -0
- package/dist/components/choicebox.js +113 -0
- package/dist/components/clearable-input.d.ts +57 -0
- package/dist/components/clearable-input.d.ts.map +1 -0
- package/dist/components/clearable-input.js +58 -0
- package/dist/components/code-block.d.ts +77 -17
- package/dist/components/code-block.d.ts.map +1 -1
- package/dist/components/code-block.js +85 -15
- package/dist/components/collapsible.d.ts +27 -10
- package/dist/components/collapsible.d.ts.map +1 -1
- package/dist/components/collapsible.js +24 -9
- package/dist/components/collection-filters.d.ts +3 -1
- package/dist/components/collection-filters.d.ts.map +1 -1
- package/dist/components/collection-filters.js +7 -9
- package/dist/components/collection-page.d.ts +31 -10
- package/dist/components/collection-page.d.ts.map +1 -1
- package/dist/components/collection-page.js +14 -13
- package/dist/components/collection-search.d.ts +32 -10
- package/dist/components/collection-search.d.ts.map +1 -1
- package/dist/components/collection-search.js +24 -13
- package/dist/components/collection-sort.d.ts.map +1 -1
- package/dist/components/collection-sort.js +2 -2
- package/dist/components/collection-toolbar.d.ts +5 -2
- package/dist/components/collection-toolbar.d.ts.map +1 -1
- package/dist/components/collection-toolbar.js +7 -4
- package/dist/components/combobox.d.ts +97 -22
- package/dist/components/combobox.d.ts.map +1 -1
- package/dist/components/combobox.js +80 -28
- package/dist/components/command.d.ts +34 -21
- package/dist/components/command.d.ts.map +1 -1
- package/dist/components/command.js +33 -25
- package/dist/components/confirm-dialog.d.ts +23 -6
- package/dist/components/confirm-dialog.d.ts.map +1 -1
- package/dist/components/confirm-dialog.js +32 -13
- package/dist/components/context-menu.d.ts +14 -10
- package/dist/components/context-menu.d.ts.map +1 -1
- package/dist/components/context-menu.js +17 -12
- package/dist/components/copy-button.d.ts +5 -2
- package/dist/components/copy-button.d.ts.map +1 -1
- package/dist/components/copy-button.js +16 -8
- package/dist/components/data-table.d.ts +120 -54
- package/dist/components/data-table.d.ts.map +1 -1
- package/dist/components/data-table.js +163 -92
- package/dist/components/desktop-shell.d.ts +4 -2
- package/dist/components/desktop-shell.d.ts.map +1 -1
- package/dist/components/desktop-shell.js +3 -3
- package/dist/components/dialog.d.ts +63 -24
- package/dist/components/dialog.d.ts.map +1 -1
- package/dist/components/dialog.js +52 -31
- package/dist/components/disclosure-row.d.ts +1 -2
- package/dist/components/disclosure-row.d.ts.map +1 -1
- package/dist/components/disclosure-row.js +1 -2
- package/dist/components/disclosure.d.ts +1 -1
- package/dist/components/disclosure.js +1 -1
- package/dist/components/drawer.d.ts +33 -12
- package/dist/components/drawer.d.ts.map +1 -1
- package/dist/components/drawer.js +47 -35
- package/dist/components/dropdown-menu.d.ts +59 -14
- package/dist/components/dropdown-menu.d.ts.map +1 -1
- package/dist/components/dropdown-menu.js +58 -26
- package/dist/components/empty-state.d.ts +35 -12
- package/dist/components/empty-state.d.ts.map +1 -1
- package/dist/components/empty-state.js +35 -17
- package/dist/components/entry-scene.d.ts +4 -4
- package/dist/components/entry-scene.d.ts.map +1 -1
- package/dist/components/entry-scene.js +2 -2
- package/dist/components/field.d.ts +44 -14
- package/dist/components/field.d.ts.map +1 -1
- package/dist/components/field.js +49 -20
- package/dist/components/file-diff.d.ts.map +1 -1
- package/dist/components/file-diff.js +3 -4
- package/dist/components/form-dialog.d.ts +7 -7
- package/dist/components/form-dialog.d.ts.map +1 -1
- package/dist/components/form-dialog.js +13 -11
- package/dist/components/form-drawer.d.ts +10 -7
- package/dist/components/form-drawer.d.ts.map +1 -1
- package/dist/components/form-drawer.js +11 -10
- package/dist/components/gauge.d.ts +64 -0
- package/dist/components/gauge.d.ts.map +1 -0
- package/dist/components/gauge.js +73 -0
- package/dist/components/hover-card.d.ts +72 -14
- package/dist/components/hover-card.d.ts.map +1 -1
- package/dist/components/hover-card.js +51 -17
- package/dist/components/identity-mark.d.ts +8 -1
- package/dist/components/identity-mark.d.ts.map +1 -1
- package/dist/components/identity-mark.js +31 -5
- package/dist/components/input-group.d.ts +44 -21
- package/dist/components/input-group.d.ts.map +1 -1
- package/dist/components/input-group.js +74 -27
- package/dist/components/input.d.ts +64 -12
- package/dist/components/input.d.ts.map +1 -1
- package/dist/components/input.js +51 -15
- package/dist/components/item.d.ts +37 -15
- package/dist/components/item.d.ts.map +1 -1
- package/dist/components/item.js +41 -22
- package/dist/components/kbd.d.ts +49 -13
- package/dist/components/kbd.d.ts.map +1 -1
- package/dist/components/kbd.js +115 -16
- package/dist/components/kpi-card.d.ts +12 -4
- package/dist/components/kpi-card.d.ts.map +1 -1
- package/dist/components/kpi-card.js +13 -4
- package/dist/components/label.d.ts +17 -10
- package/dist/components/label.d.ts.map +1 -1
- package/dist/components/label.js +18 -11
- package/dist/components/library-shelf.d.ts +6 -6
- package/dist/components/library-shelf.d.ts.map +1 -1
- package/dist/components/library-shelf.js +5 -5
- package/dist/components/load-more-button.d.ts +35 -0
- package/dist/components/load-more-button.d.ts.map +1 -0
- package/dist/components/load-more-button.js +26 -0
- package/dist/components/message-notice.d.ts +8 -13
- package/dist/components/message-notice.d.ts.map +1 -1
- package/dist/components/message-notice.js +25 -22
- package/dist/components/middle-truncate.d.ts +33 -0
- package/dist/components/middle-truncate.d.ts.map +1 -0
- package/dist/components/middle-truncate.js +72 -0
- package/dist/components/multi-select.d.ts +94 -0
- package/dist/components/multi-select.d.ts.map +1 -0
- package/dist/components/multi-select.js +132 -0
- package/dist/components/native-select.d.ts +37 -13
- package/dist/components/native-select.d.ts.map +1 -1
- package/dist/components/native-select.js +27 -11
- package/dist/components/notice-banner.d.ts +17 -10
- package/dist/components/notice-banner.d.ts.map +1 -1
- package/dist/components/notice-banner.js +12 -11
- package/dist/components/numbered-steps.d.ts +10 -4
- package/dist/components/numbered-steps.d.ts.map +1 -1
- package/dist/components/numbered-steps.js +9 -7
- package/dist/components/object-page.d.ts +40 -14
- package/dist/components/object-page.d.ts.map +1 -1
- package/dist/components/object-page.js +12 -10
- package/dist/components/object-workspace.d.ts +29 -10
- package/dist/components/object-workspace.d.ts.map +1 -1
- package/dist/components/object-workspace.js +18 -8
- package/dist/components/overview-page.d.ts +2 -2
- package/dist/components/overview-page.d.ts.map +1 -1
- package/dist/components/overview-page.js +8 -7
- package/dist/components/page-actions.d.ts +28 -8
- package/dist/components/page-actions.d.ts.map +1 -1
- package/dist/components/page-actions.js +22 -25
- package/dist/components/page-header.d.ts +11 -4
- package/dist/components/page-header.d.ts.map +1 -1
- package/dist/components/page-header.js +10 -5
- package/dist/components/pending-label.d.ts +6 -5
- package/dist/components/pending-label.d.ts.map +1 -1
- package/dist/components/pending-label.js +14 -6
- package/dist/components/picture-label.d.ts +2 -2
- package/dist/components/picture-label.d.ts.map +1 -1
- package/dist/components/picture-label.js +3 -3
- package/dist/components/portal-sidebar-frame.d.ts +9 -21
- package/dist/components/portal-sidebar-frame.d.ts.map +1 -1
- package/dist/components/portal-sidebar-frame.js +13 -27
- package/dist/components/progress-checklist.d.ts +46 -0
- package/dist/components/progress-checklist.d.ts.map +1 -0
- package/dist/components/progress-checklist.js +46 -0
- package/dist/components/progress.d.ts +48 -8
- package/dist/components/progress.d.ts.map +1 -1
- package/dist/components/progress.js +92 -16
- package/dist/components/prose.d.ts +19 -0
- package/dist/components/prose.d.ts.map +1 -0
- package/dist/components/prose.js +29 -0
- package/dist/components/radio-group.d.ts +51 -12
- package/dist/components/radio-group.d.ts.map +1 -1
- package/dist/components/radio-group.js +42 -12
- package/dist/components/reading-column.js +1 -1
- package/dist/components/record-identity.d.ts +6 -5
- package/dist/components/record-identity.d.ts.map +1 -1
- package/dist/components/record-identity.js +12 -3
- package/dist/components/record-list.d.ts +117 -27
- package/dist/components/record-list.d.ts.map +1 -1
- package/dist/components/record-list.js +185 -55
- package/dist/components/record-time.d.ts +20 -7
- package/dist/components/record-time.d.ts.map +1 -1
- package/dist/components/record-time.js +38 -19
- package/dist/components/resizable.d.ts +7 -5
- package/dist/components/resizable.d.ts.map +1 -1
- package/dist/components/resizable.js +6 -6
- package/dist/components/scope-switcher.d.ts +2 -0
- package/dist/components/scope-switcher.d.ts.map +1 -1
- package/dist/components/scope-switcher.js +2 -2
- package/dist/components/scroll-area.d.ts +47 -11
- package/dist/components/scroll-area.d.ts.map +1 -1
- package/dist/components/scroll-area.js +72 -14
- package/dist/components/segmented-control.d.ts +82 -0
- package/dist/components/segmented-control.d.ts.map +1 -0
- package/dist/components/segmented-control.js +90 -0
- package/dist/components/select.d.ts +55 -15
- package/dist/components/select.d.ts.map +1 -1
- package/dist/components/select.js +62 -19
- package/dist/components/separator.d.ts +12 -5
- package/dist/components/separator.d.ts.map +1 -1
- package/dist/components/separator.js +11 -6
- package/dist/components/settings-facts.d.ts +34 -14
- package/dist/components/settings-facts.d.ts.map +1 -1
- package/dist/components/settings-facts.js +21 -12
- package/dist/components/settings-page.d.ts +4 -4
- package/dist/components/settings-page.js +5 -5
- package/dist/components/settings-section.d.ts +160 -34
- package/dist/components/settings-section.d.ts.map +1 -1
- package/dist/components/settings-section.js +92 -39
- package/dist/components/sheet.d.ts +47 -16
- package/dist/components/sheet.d.ts.map +1 -1
- package/dist/components/sheet.js +40 -19
- package/dist/components/sidebar-sections.d.ts +16 -12
- package/dist/components/sidebar-sections.d.ts.map +1 -1
- package/dist/components/sidebar-sections.js +30 -15
- package/dist/components/sidebar.d.ts +117 -21
- package/dist/components/sidebar.d.ts.map +1 -1
- package/dist/components/sidebar.js +180 -55
- package/dist/components/skeleton.d.ts +54 -8
- package/dist/components/skeleton.d.ts.map +1 -1
- package/dist/components/skeleton.js +44 -9
- package/dist/components/slider.d.ts +53 -11
- package/dist/components/slider.d.ts.map +1 -1
- package/dist/components/slider.js +71 -17
- package/dist/components/snippet.d.ts +57 -0
- package/dist/components/snippet.d.ts.map +1 -0
- package/dist/components/snippet.js +60 -0
- package/dist/components/sonner.d.ts +13 -14
- package/dist/components/sonner.d.ts.map +1 -1
- package/dist/components/sonner.js +25 -22
- package/dist/components/status-badge.d.ts +37 -11
- package/dist/components/status-badge.d.ts.map +1 -1
- package/dist/components/status-badge.js +63 -15
- package/dist/components/status-dot.d.ts +42 -11
- package/dist/components/status-dot.d.ts.map +1 -1
- package/dist/components/status-dot.js +40 -11
- package/dist/components/switch.d.ts +43 -12
- package/dist/components/switch.d.ts.map +1 -1
- package/dist/components/switch.js +42 -12
- package/dist/components/table-card.d.ts +21 -12
- package/dist/components/table-card.d.ts.map +1 -1
- package/dist/components/table-card.js +17 -9
- package/dist/components/table-layouts.d.ts +40 -8
- package/dist/components/table-layouts.d.ts.map +1 -1
- package/dist/components/table-layouts.js +52 -8
- package/dist/components/table-value.d.ts +4 -3
- package/dist/components/table-value.d.ts.map +1 -1
- package/dist/components/table-value.js +6 -5
- package/dist/components/table.d.ts +62 -25
- package/dist/components/table.d.ts.map +1 -1
- package/dist/components/table.js +62 -26
- package/dist/components/tabs.d.ts +86 -17
- package/dist/components/tabs.d.ts.map +1 -1
- package/dist/components/tabs.js +93 -22
- package/dist/components/text-link.d.ts +4 -1
- package/dist/components/text-link.d.ts.map +1 -1
- package/dist/components/text-link.js +4 -1
- package/dist/components/text-with-copy-button.d.ts +30 -0
- package/dist/components/text-with-copy-button.d.ts.map +1 -0
- package/dist/components/text-with-copy-button.js +32 -0
- package/dist/components/textarea.d.ts +40 -10
- package/dist/components/textarea.d.ts.map +1 -1
- package/dist/components/textarea.js +50 -11
- package/dist/components/theme-mode-switcher.d.ts +18 -1
- package/dist/components/theme-mode-switcher.d.ts.map +1 -1
- package/dist/components/theme-mode-switcher.js +20 -2
- package/dist/components/toggle-group.d.ts +28 -8
- package/dist/components/toggle-group.d.ts.map +1 -1
- package/dist/components/toggle-group.js +12 -6
- package/dist/components/toggle.d.ts +6 -3
- package/dist/components/toggle.d.ts.map +1 -1
- package/dist/components/toggle.js +10 -7
- package/dist/components/tooltip.d.ts +43 -12
- package/dist/components/tooltip.d.ts.map +1 -1
- package/dist/components/tooltip.js +45 -16
- package/dist/components/trend-badge.js +1 -1
- package/dist/components/update-card.js +1 -1
- package/dist/eslint/index.js +82 -0
- package/dist/eslint/rules/badge-is-static-label.js +93 -0
- package/dist/eslint/rules/button-icon-slot.js +102 -0
- package/dist/eslint/rules/button-link-for-navigation.js +146 -0
- package/dist/eslint/rules/button-no-aria-label-with-text.js +75 -0
- package/dist/eslint/rules/button-type-roles-only-in-buttons.js +83 -0
- package/dist/eslint/rules/choice-control-has-a-name.js +98 -0
- package/dist/eslint/rules/choice-group-in-fieldset.js +86 -0
- package/dist/eslint/rules/command-shortcut-single-owner.js +118 -0
- package/dist/eslint/rules/confirm-dialog-words.js +63 -0
- package/dist/eslint/rules/data-table-one-unsized-column.js +96 -0
- package/dist/eslint/rules/destructive-action-placement.js +69 -0
- package/dist/eslint/rules/disabled-choice-says-why.js +71 -0
- package/dist/eslint/rules/ellipsis-opens-a-dialog.js +110 -0
- package/dist/eslint/rules/input-group-owners.js +155 -0
- package/dist/eslint/rules/kbd-children-no-modifier-text.js +128 -0
- package/dist/eslint/rules/literal-text.js +41 -0
- package/dist/eslint/rules/middle-truncate-placement.js +69 -0
- package/dist/eslint/rules/no-bare-button-label.js +55 -0
- package/dist/eslint/rules/no-control-in-read-only-surface.js +106 -0
- package/dist/eslint/rules/no-hand-built-busy.js +104 -0
- package/dist/eslint/rules/no-hand-built-theme-picker.js +144 -0
- package/dist/eslint/rules/no-hand-built-tile.js +41 -0
- package/dist/eslint/rules/no-hand-formatted-date.js +87 -0
- package/dist/eslint/rules/no-hand-stacked-avatars.js +67 -0
- package/dist/eslint/rules/no-nested-collapse.js +60 -0
- package/dist/eslint/rules/no-search-in-form.js +47 -0
- package/dist/eslint/rules/no-shadcn-appearance-override.js +2 -16
- package/dist/eslint/rules/no-shell-prompt-in-snippet.js +74 -0
- package/dist/eslint/rules/no-stock-error-words.js +56 -0
- package/dist/eslint/rules/no-tooltip-around-labelled-field.js +72 -0
- package/dist/eslint/rules/no-weight-class-on-strong-in-type-role.js +57 -0
- package/dist/eslint/rules/one-submenu-level.js +43 -0
- package/dist/eslint/rules/one-toast-per-flow.js +91 -0
- package/dist/eslint/rules/option-count.js +167 -0
- package/dist/eslint/rules/page-command-link-not-render.js +43 -0
- package/dist/eslint/rules/progress-needs-name.js +57 -0
- package/dist/eslint/rules/settings-limit-in-footer.js +94 -0
- package/dist/eslint/rules/skeleton-in-region.js +80 -0
- package/dist/eslint/rules/sortable-heading-uses-sort.js +79 -0
- package/dist/eslint/rules/table-cell-inset-owner.js +107 -0
- package/dist/eslint/rules/tabs-selection-is-controlled.js +47 -0
- package/dist/eslint/rules/tooltip-only-arrow.js +38 -0
- package/dist/eslint/rules/tooltip-trigger-accessible-name.js +114 -0
- package/dist/eslint/strict-design-system.js +21 -7
- package/dist/index.d.ts +13 -13
- package/dist/index.d.ts.map +1 -1
- package/dist/index.js +12 -13
- package/dist/internal/assistant-ui/attachment.d.ts.map +1 -1
- package/dist/internal/assistant-ui/attachment.js +2 -2
- package/dist/internal/assistant-ui/reasoning.d.ts +1 -1
- package/dist/internal/assistant-ui/reasoning.d.ts.map +1 -1
- package/dist/internal/assistant-ui/tool-fallback.js +1 -1
- package/dist/internal/assistant-ui/tool-group.d.ts +1 -1
- package/dist/internal/assistant-ui/tool-group.d.ts.map +1 -1
- package/dist/internal/assistant-ui/tooltip-icon-button.d.ts +2 -3
- package/dist/internal/assistant-ui/tooltip-icon-button.d.ts.map +1 -1
- package/dist/internal/assistant-ui/tooltip-icon-button.js +1 -1
- package/dist/internal/catalog-list.js +2 -2
- package/dist/internal/collection-note.d.ts +23 -0
- package/dist/internal/collection-note.d.ts.map +1 -0
- package/dist/internal/collection-note.js +17 -0
- package/dist/internal/collection-rail.d.ts +57 -0
- package/dist/internal/collection-rail.d.ts.map +1 -0
- package/dist/internal/collection-rail.js +33 -0
- package/dist/internal/company-logo.d.ts +18 -0
- package/dist/internal/company-logo.d.ts.map +1 -0
- package/dist/internal/company-logo.js +14 -0
- package/dist/internal/control-name.d.ts +12 -0
- package/dist/internal/control-name.d.ts.map +1 -0
- package/dist/internal/control-name.js +1 -0
- package/dist/internal/diff-line.d.ts +9 -0
- package/dist/internal/diff-line.d.ts.map +1 -0
- package/dist/internal/diff-line.js +8 -0
- package/dist/internal/empty.d.ts +8 -4
- package/dist/internal/empty.d.ts.map +1 -1
- package/dist/internal/empty.js +14 -8
- package/dist/internal/field-frame.d.ts +33 -0
- package/dist/internal/field-frame.d.ts.map +1 -0
- package/dist/internal/field-frame.js +20 -0
- package/dist/internal/final-focus.d.ts +8 -0
- package/dist/internal/final-focus.d.ts.map +1 -0
- package/dist/internal/final-focus.js +10 -0
- package/dist/internal/footer-strip.d.ts.map +1 -1
- package/dist/internal/footer-strip.js +3 -1
- package/dist/internal/form-submit.d.ts +9 -5
- package/dist/internal/form-submit.d.ts.map +1 -1
- package/dist/internal/form-submit.js +31 -2
- package/dist/internal/input-box.d.ts +26 -0
- package/dist/internal/input-box.d.ts.map +1 -0
- package/dist/internal/input-box.js +59 -0
- package/dist/internal/menu-surface.d.ts +10 -3
- package/dist/internal/menu-surface.d.ts.map +1 -1
- package/dist/internal/menu-surface.js +10 -3
- package/dist/internal/notice.d.ts +25 -0
- package/dist/internal/notice.d.ts.map +1 -0
- package/dist/internal/notice.js +33 -0
- package/dist/internal/overlay-stem.d.ts +5 -0
- package/dist/internal/overlay-stem.d.ts.map +1 -0
- package/dist/internal/overlay-stem.js +7 -0
- package/dist/internal/phone-sheet.d.ts +4 -0
- package/dist/internal/phone-sheet.d.ts.map +1 -0
- package/dist/internal/phone-sheet.js +2 -0
- package/dist/internal/present-content.d.ts +3 -0
- package/dist/internal/present-content.d.ts.map +1 -0
- package/dist/internal/present-content.js +1 -0
- package/dist/internal/record-menu-items.d.ts +4 -3
- package/dist/internal/record-menu-items.d.ts.map +1 -1
- package/dist/internal/record-menu-items.js +21 -6
- package/dist/internal/settings-save.d.ts +9 -2
- package/dist/internal/settings-save.d.ts.map +1 -1
- package/dist/internal/settings-save.js +9 -6
- package/dist/internal/table-compact-line.d.ts +38 -0
- package/dist/internal/table-compact-line.d.ts.map +1 -0
- package/dist/internal/table-compact-line.js +35 -0
- package/dist/internal/title-when-cut.d.ts +8 -0
- package/dist/internal/title-when-cut.d.ts.map +1 -0
- package/dist/internal/title-when-cut.js +22 -0
- package/dist/internal/unsaved-guard.d.ts +18 -0
- package/dist/internal/unsaved-guard.d.ts.map +1 -0
- package/dist/internal/unsaved-guard.js +31 -0
- package/dist/lib/merge-tokens.generated.js +2 -2
- package/dist/showcase/foundations.d.ts.map +1 -1
- package/dist/showcase/foundations.js +10 -2
- package/dist/showcase/specimens/actions.d.ts +2 -0
- package/dist/showcase/specimens/actions.d.ts.map +1 -1
- package/dist/showcase/specimens/actions.js +30 -5
- package/dist/showcase/specimens/charts.d.ts.map +1 -1
- package/dist/showcase/specimens/charts.js +22 -13
- package/dist/showcase/specimens/choices.d.ts +14 -3
- package/dist/showcase/specimens/choices.d.ts.map +1 -1
- package/dist/showcase/specimens/choices.js +93 -13
- package/dist/showcase/specimens/compositions.d.ts.map +1 -1
- package/dist/showcase/specimens/compositions.js +136 -23
- package/dist/showcase/specimens/data.d.ts +12 -7
- package/dist/showcase/specimens/data.d.ts.map +1 -1
- package/dist/showcase/specimens/data.js +139 -35
- package/dist/showcase/specimens/feedback.d.ts +2 -0
- package/dist/showcase/specimens/feedback.d.ts.map +1 -1
- package/dist/showcase/specimens/feedback.js +39 -15
- package/dist/showcase/specimens/index.d.ts +20 -12
- package/dist/showcase/specimens/index.d.ts.map +1 -1
- package/dist/showcase/specimens/inputs.d.ts +4 -2
- package/dist/showcase/specimens/inputs.d.ts.map +1 -1
- package/dist/showcase/specimens/inputs.js +62 -19
- package/dist/showcase/specimens/menus.d.ts +0 -1
- package/dist/showcase/specimens/menus.d.ts.map +1 -1
- package/dist/showcase/specimens/menus.js +47 -17
- package/dist/showcase/specimens/navigation.d.ts +6 -4
- package/dist/showcase/specimens/navigation.d.ts.map +1 -1
- package/dist/showcase/specimens/navigation.js +61 -32
- package/dist/showcase/specimens/other.d.ts +1 -3
- package/dist/showcase/specimens/other.d.ts.map +1 -1
- package/dist/showcase/specimens/other.js +17 -13
- package/dist/showcase/specimens/status.d.ts +4 -1
- package/dist/showcase/specimens/status.d.ts.map +1 -1
- package/dist/showcase/specimens/status.js +64 -11
- package/dist/showcase/usage.generated.d.ts +1 -1
- package/dist/showcase/usage.generated.d.ts.map +1 -1
- package/dist/showcase/usage.generated.js +632 -544
- package/dist/standalone/index.js +1 -1
- package/dist/styles/components.css +13 -13
- package/dist/styles/globals.css +25 -0
- package/package.json +2 -3
- package/dist/components/approval-row.d.ts +0 -34
- package/dist/components/approval-row.d.ts.map +0 -1
- package/dist/components/approval-row.js +0 -27
- package/dist/components/channel-view.d.ts +0 -112
- package/dist/components/channel-view.d.ts.map +0 -1
- package/dist/components/channel-view.js +0 -84
- package/dist/components/dashboard-shell.d.ts +0 -51
- package/dist/components/dashboard-shell.d.ts.map +0 -1
- package/dist/components/dashboard-shell.js +0 -89
- package/dist/components/direction.d.ts +0 -2
- package/dist/components/direction.d.ts.map +0 -1
- package/dist/components/direction.js +0 -1
- package/dist/components/expandable-block.d.ts +0 -20
- package/dist/components/expandable-block.d.ts.map +0 -1
- package/dist/components/expandable-block.js +0 -32
- package/dist/components/form.d.ts +0 -42
- package/dist/components/form.d.ts.map +0 -1
- package/dist/components/form.js +0 -91
- package/dist/components/label-system.d.ts +0 -17
- package/dist/components/label-system.d.ts.map +0 -1
- package/dist/components/label-system.js +0 -21
- package/dist/components/memory-item.d.ts +0 -21
- package/dist/components/memory-item.d.ts.map +0 -1
- package/dist/components/memory-item.js +0 -18
- package/dist/components/menubar.d.ts +0 -43
- package/dist/components/menubar.d.ts.map +0 -1
- package/dist/components/menubar.js +0 -69
- package/dist/components/navigation-menu.d.ts +0 -26
- package/dist/components/navigation-menu.d.ts.map +0 -1
- package/dist/components/navigation-menu.js +0 -45
- package/dist/components/pagination.d.ts +0 -33
- package/dist/components/pagination.d.ts.map +0 -1
- package/dist/components/pagination.js +0 -41
- package/dist/components/plugin-slot-boundary.d.ts +0 -42
- package/dist/components/plugin-slot-boundary.d.ts.map +0 -1
- package/dist/components/plugin-slot-boundary.js +0 -41
- package/dist/components/status-row.d.ts +0 -32
- package/dist/components/status-row.d.ts.map +0 -1
- package/dist/components/status-row.js +0 -35
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"table-value.d.ts","sourceRoot":"","sources":["../../src/components/table-value.tsx"],"names":[],"mappings":"AAAA,OAAO,KAAK,EAAE,YAAY,EAAE,MAAM,OAAO,CAAC;AAK1C,KAAK,YAAY,GAAG,MAAM,GAAG,MAAM,GAAG,YAAY,CAAC;AAEnD,MAAM,MAAM,eAAe,GACvB;IACE,KAAK,CAAC,EAAE,MAAM,CAAC;IACf,KAAK,EAAE,YAAY,GAAG,IAAI,GAAG,SAAS,CAAC;IACvC,2FAA2F;IAC3F,YAAY,EAAE,MAAM,CAAC;IACrB,qGAAqG;IACrG,UAAU,CAAC,EAAE,MAAM,CAAC;CACrB,GACD;IACE,KAAK,EAAE,QAAQ,CAAC;IAChB,qEAAqE;IACrE,WAAW,EAAE,MAAM,CAAC;CACrB,GACD;IAAE,KAAK,EAAE,SAAS,CAAA;CAAE,CAAC;AAEzB
|
|
1
|
+
{"version":3,"file":"table-value.d.ts","sourceRoot":"","sources":["../../src/components/table-value.tsx"],"names":[],"mappings":"AAAA,OAAO,KAAK,EAAE,YAAY,EAAE,MAAM,OAAO,CAAC;AAK1C,KAAK,YAAY,GAAG,MAAM,GAAG,MAAM,GAAG,YAAY,CAAC;AAEnD,MAAM,MAAM,eAAe,GACvB;IACE,KAAK,CAAC,EAAE,MAAM,CAAC;IACf,KAAK,EAAE,YAAY,GAAG,IAAI,GAAG,SAAS,CAAC;IACvC,2FAA2F;IAC3F,YAAY,EAAE,MAAM,CAAC;IACrB,qGAAqG;IACrG,UAAU,CAAC,EAAE,MAAM,CAAC;CACrB,GACD;IACE,KAAK,EAAE,QAAQ,CAAC;IAChB,qEAAqE;IACrE,WAAW,EAAE,MAAM,CAAC;CACrB,GACD;IAAE,KAAK,EAAE,SAAS,CAAA;CAAE,CAAC;AAEzB;;;;;;;;;;GAUG;AACH,wBAAgB,UAAU,CAAC,KAAK,EAAE,eAAe,iDAwChD"}
|
|
@@ -7,16 +7,17 @@ import { Skeleton } from "./skeleton.js";
|
|
|
7
7
|
* @family Data
|
|
8
8
|
* @when Every cell of a `DataTable` whose reading can be missing, zero, out of date, unreadable or still loading.
|
|
9
9
|
* @instead A whole table that failed to read is `EmptyState kind="failed"`; a figure on its own is a `KpiCard`.
|
|
10
|
-
* @behaviour
|
|
11
|
-
*
|
|
12
|
-
* @
|
|
10
|
+
* @behaviour “Render `—` in cells where a value is unknown or not applicable. Don’t substitute `N/A`, `null`, or an empty string.” (https://vercel.com/geist/table)
|
|
11
|
+
* Ours: five states that never collapse into a dash: unknown (a muted dash), zero (the figure "0"), stale (the reading, then the stale word), failed (the error mark and its words, in the error colour) and loading (a still 64 × 12 placeholder). A real value, `0` included, is shown as it is.
|
|
12
|
+
* @words Ours: `missingLabel` says what the absence means ("Not reported", never "N/A" or "None"); `staleLabel` is one word ("Stale"); `failedLabel` says the read failed ("Couldn't read").
|
|
13
|
+
* @access The dash is hidden and `missingLabel` is read in its place; the error mark is hidden beside its words; the placeholder is decorative, and its cell is `aria-busy` while it loads.
|
|
13
14
|
*/
|
|
14
15
|
export function TableValue(props) {
|
|
15
16
|
if (props.state === "loading") {
|
|
16
|
-
return _jsx(
|
|
17
|
+
return (_jsx("span", { "aria-busy": "true", className: "inline-flex", children: _jsx(Skeleton, { height: 12, width: 64 }) }));
|
|
17
18
|
}
|
|
18
19
|
if (props.state === "failed") {
|
|
19
|
-
return (_jsxs("span", { "data-slot": "table-failed-value", className: "inline-flex items-center gap-1 text-caption text-
|
|
20
|
+
return (_jsxs("span", { "data-slot": "table-failed-value", className: "inline-flex items-center gap-1 text-caption text-destructive-soft-foreground", children: [_jsx(CircleAlert, { "aria-hidden": "true", className: "size-3 shrink-0", strokeWidth: 1.25 }), props.failedLabel] }));
|
|
20
21
|
}
|
|
21
22
|
const { value, missingLabel, staleLabel } = props;
|
|
22
23
|
if (value === null || value === undefined || value === "") {
|
|
@@ -1,33 +1,75 @@
|
|
|
1
1
|
import * as React from "react";
|
|
2
|
+
import type { AccessibleName } from "./button.js";
|
|
3
|
+
import { type TableDetailFact } from "../internal/table-compact-line.js";
|
|
2
4
|
import { tableCompactLayouts, type TableCompactLayout } from "./table-layouts.js";
|
|
5
|
+
/** A table is named for assistive technology, or it is a decorative placeholder and hidden from it. */
|
|
6
|
+
type TableName = AccessibleName | {
|
|
7
|
+
"aria-hidden": true;
|
|
8
|
+
};
|
|
3
9
|
/**
|
|
4
|
-
* The native table
|
|
10
|
+
* The native table every comparison is drawn with: a head row, figure rows of one line, and cells
|
|
11
|
+
* padded the same at every width.
|
|
5
12
|
*
|
|
6
13
|
* @family Data
|
|
7
|
-
* @when
|
|
8
|
-
* table of records is `DataTable`, which draws this one.
|
|
9
|
-
* @instead
|
|
10
|
-
* `
|
|
11
|
-
*
|
|
12
|
-
*
|
|
13
|
-
* row
|
|
14
|
-
*
|
|
15
|
-
*
|
|
16
|
-
*
|
|
17
|
-
* `
|
|
14
|
+
* @when “Use `<Table>` for tabular data where rows share the same shape and at least one column is sortable or comparable across rows.” (https://vercel.com/geist/table)
|
|
15
|
+
* Ours: a fixed table a composition draws itself: a summary inside a card, a list of plan limits, figures compared down a column. A table of records is `DataTable`, which draws this one.
|
|
16
|
+
* @instead “For a row of descriptive content paired with a single action (membership row, integration row), use `Entity` instead.” (https://vercel.com/geist/table)
|
|
17
|
+
* “For a key/value metadata block on a detail page, use `Description`, not a two-column table.” (https://vercel.com/geist/table)
|
|
18
|
+
* “When the underlying list is empty (filter cleared, never created), render `Empty State` outside the table rather than an empty `<Table.Body>`.” (https://vercel.com/geist/table)
|
|
19
|
+
* Ours: Geist's `Entity` is `Item`, or `RecordList` when the row names a record; its `Description` is `ObjectFacts`; its `Empty State` is `EmptyState`. Records with sorting, paging and an empty state are `DataTable`.
|
|
20
|
+
* @behaviour A head row whose labels fill 36 px, with 12 px of room and then a 1 px rule under them, so the first row starts at the rule like every other; body
|
|
21
|
+
* rows 40 px, with no rule between them unless the body is `bordered`, which draws it straight
|
|
22
|
+
* across the row, under the corners. The first and last cell of a row take a 6 px corner, so a stripe
|
|
23
|
+
* or a highlight reads as a rounded bar. The last column, its heading and its cells, aligns to the
|
|
24
|
+
* trailing edge. `striped`, `bordered` and `interactive` belong to `TableBody`: stripes fill the odd
|
|
25
|
+
* rows with `muted` (a selected row there takes `accent`), `bordered` draws a rule between rows (not
|
|
26
|
+
* after the last) and no frame, and an interactive row takes `accent` on hover, on focus within and
|
|
27
|
+
* while its menu is open, over a stripe; a row that opens nothing is not `interactive`. Headers and
|
|
28
|
+
* footers never highlight and carry no fill; a footer has a rule above it and ink, medium text. A
|
|
29
|
+
* column's width is a `TableCol` in a `TableColgroup`. `density="comfortable"` is the entity row of a
|
|
30
|
+
* record that names itself. On a card narrower than its `compactDetails` layout a row never scrolls
|
|
31
|
+
* sideways: its secondary columns leave the row and their values stand in the `TableDetailRow` under
|
|
32
|
+
* it, one muted line joined by a middle dot that ends in an ellipsis, their labels read by assistive
|
|
33
|
+
* technology only, as Vercel's lists read on a phone; a `Tag` there reads as its plain text, and a
|
|
34
|
+
* fact that `wraps` lets the line wrap whole instead of ending in an ellipsis. An entity row
|
|
35
|
+
* (`density="comfortable"`) keeps its record on one 72 px row instead: its facts join the line
|
|
36
|
+
* under the name that `RecordIdentity` draws (`TableCompactLine`), so the row is the name over one line. Colour is neutral throughout: headings and cells share
|
|
37
|
+
* the body grey and a heading differs by weight, the footer is ink, and the hue of a state lives in
|
|
38
|
+
* the `StatusBadge` of a cell, never in the row.
|
|
39
|
+
* “Sortable column headers are buttons. The visible label stays Title Case; the sort-direction arrow is decorative and the button announces the next sort state to assistive tech.” (https://vercel.com/geist/table)
|
|
40
|
+
* Ours: no heading sorts the rows; the order is the page's, through a `CollectionSort` above the list.
|
|
41
|
+
* “Apply `tabular-nums` (or Geist Mono) to numeric columns so digits align across rows for comparison.” (https://vercel.com/geist/table)
|
|
42
|
+
* Ours: `DataTable` sets it on a numeric column; in a `Table` a figure's cell takes `tabular-nums`.
|
|
43
|
+
* @words “Column headers (`<Table.Head>`) are Title Case nouns or noun phrases: `Last Used`, `Requests (7d)`, `Created`, `Status`. Never sentences.” (https://vercel.com/geist/table)
|
|
44
|
+
* “Render `—` in cells where a value is unknown or not applicable. Don’t substitute `N/A`, `null`, or an empty string.” (https://vercel.com/geist/table)
|
|
45
|
+
* “Use the canonical short relative-time form in cells (`2m ago`, `5h ago`); switch to `Mar 14, 2026` past 7 days. See `Relative Time Card`.” (https://vercel.com/geist/table)
|
|
46
|
+
* Ours: headings are sentence case nouns with their unit, *Cost (€)*, *Tokens*, where Geist writes Title Case. Italian headings run a third longer and never wrap. A missing value is `TableValue`'s dash, read as its `missingLabel`. The table is always named: its `aria-label` says what it lists (*Usage by Agent*).
|
|
47
|
+
* @access A native `table` named by `aria-label` or `aria-labelledby`, which the types require, or
|
|
48
|
+
* `aria-hidden` when it is only the placeholder of a loading view; `th scope="col"`, with
|
|
49
|
+
* `aria-sort` on the column the rows are ordered by.
|
|
18
50
|
*/
|
|
19
|
-
declare function Table({ className, compactDetails, density,
|
|
51
|
+
declare function Table({ className, compactDetails, density, ...props }: React.ComponentProps<"table"> & TableName & {
|
|
20
52
|
compactDetails?: TableCompactLayout;
|
|
21
53
|
density?: "default" | "comfortable";
|
|
22
|
-
variant?: "default" | "striped" | "bordered";
|
|
23
|
-
interactive?: boolean;
|
|
24
54
|
}): React.JSX.Element;
|
|
55
|
+
declare function TableColgroup(props: React.ComponentProps<"colgroup">): React.JSX.Element;
|
|
56
|
+
declare function TableCol(props: React.ComponentProps<"col">): React.JSX.Element;
|
|
25
57
|
declare function TableHeader({ className, ...props }: React.ComponentProps<"thead">): React.JSX.Element;
|
|
26
|
-
declare function TableBody({ className, ...props }: React.ComponentProps<"tbody">
|
|
27
|
-
|
|
58
|
+
declare function TableBody({ className, striped, bordered, interactive, ...props }: React.ComponentProps<"tbody"> & {
|
|
59
|
+
/** The odd rows take the `muted` fill, and a selected row `accent`. */
|
|
60
|
+
striped?: boolean;
|
|
61
|
+
/** A rule is drawn between rows, and none after the last; the rows' corners stay square so the rule meets the edge. */
|
|
62
|
+
bordered?: boolean;
|
|
63
|
+
/** A row takes `accent` on hover, on focus within and while its menu is open. */
|
|
64
|
+
interactive?: boolean;
|
|
65
|
+
}): React.JSX.Element;
|
|
66
|
+
declare function TableRecordGroup({ className, interactive, ...props }: React.ComponentProps<"tbody"> & {
|
|
67
|
+
/** The record takes `accent` on hover, on focus within and while its menu is open. */
|
|
68
|
+
interactive?: boolean;
|
|
69
|
+
}): React.JSX.Element;
|
|
28
70
|
declare function TableFooter({ className, ...props }: React.ComponentProps<"tfoot">): React.JSX.Element;
|
|
29
71
|
declare function TableRow({ className, detailLayout, ...props }: React.ComponentProps<"tr"> & {
|
|
30
|
-
/** The compact layout of the `TableDetailRow` that follows this row
|
|
72
|
+
/** The compact layout of the `TableDetailRow` that follows this row: below its width this row closes up onto that line. */
|
|
31
73
|
detailLayout?: TableCompactLayout;
|
|
32
74
|
}): React.JSX.Element;
|
|
33
75
|
declare function TableHead({ className, ...props }: React.ComponentProps<"th">): React.JSX.Element;
|
|
@@ -35,13 +77,8 @@ declare function TableCell({ className, ...props }: React.ComponentProps<"td">):
|
|
|
35
77
|
declare function TableDetailRow({ colSpan, facts, layout, }: {
|
|
36
78
|
colSpan: number;
|
|
37
79
|
layout?: TableCompactLayout;
|
|
38
|
-
facts: readonly
|
|
39
|
-
id: string;
|
|
40
|
-
label: React.ReactNode;
|
|
41
|
-
value: React.ReactNode;
|
|
42
|
-
numeric?: boolean;
|
|
43
|
-
}[];
|
|
80
|
+
facts: readonly TableDetailFact[];
|
|
44
81
|
}): React.JSX.Element;
|
|
45
82
|
declare function TableCaption({ className, ...props }: React.ComponentProps<"caption">): React.JSX.Element;
|
|
46
|
-
export { Table, TableHeader, TableBody, TableRecordGroup, TableFooter, TableHead, TableRow, TableCell, TableCaption, TableDetailRow, tableCompactLayouts, type TableCompactLayout, };
|
|
83
|
+
export { Table, TableColgroup, TableCol, TableHeader, TableBody, TableRecordGroup, TableFooter, TableHead, TableRow, TableCell, TableCaption, TableDetailRow, tableCompactLayouts, type TableCompactLayout, };
|
|
47
84
|
//# sourceMappingURL=table.d.ts.map
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"table.d.ts","sourceRoot":"","sources":["../../src/components/table.tsx"],"names":[],"mappings":"AAEA,OAAO,KAAK,KAAK,MAAM,OAAO,CAAC;AAI/B,OAAO,EAAE,mBAAmB,EAAE,KAAK,kBAAkB,EAAE,MAAM,4BAA4B,CAAC;
|
|
1
|
+
{"version":3,"file":"table.d.ts","sourceRoot":"","sources":["../../src/components/table.tsx"],"names":[],"mappings":"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"}
|
package/dist/components/table.js
CHANGED
|
@@ -1,51 +1,87 @@
|
|
|
1
1
|
"use client";
|
|
2
|
-
import { jsx as _jsx
|
|
2
|
+
import { jsx as _jsx } from "react/jsx-runtime";
|
|
3
3
|
import { cn } from "../lib/utils.js";
|
|
4
|
+
import { DetailFacts } from "../internal/table-compact-line.js";
|
|
4
5
|
import { tableCompactLayouts } from "./table-layouts.js";
|
|
6
|
+
import { titleWhenCut } from "../internal/title-when-cut.js";
|
|
5
7
|
/**
|
|
6
|
-
* The native table
|
|
8
|
+
* The native table every comparison is drawn with: a head row, figure rows of one line, and cells
|
|
9
|
+
* padded the same at every width.
|
|
7
10
|
*
|
|
8
11
|
* @family Data
|
|
9
|
-
* @when
|
|
10
|
-
* table of records is `DataTable`, which draws this one.
|
|
11
|
-
* @instead
|
|
12
|
-
* `
|
|
13
|
-
*
|
|
14
|
-
*
|
|
15
|
-
* row
|
|
16
|
-
*
|
|
17
|
-
*
|
|
18
|
-
*
|
|
19
|
-
* `
|
|
12
|
+
* @when “Use `<Table>` for tabular data where rows share the same shape and at least one column is sortable or comparable across rows.” (https://vercel.com/geist/table)
|
|
13
|
+
* Ours: a fixed table a composition draws itself: a summary inside a card, a list of plan limits, figures compared down a column. A table of records is `DataTable`, which draws this one.
|
|
14
|
+
* @instead “For a row of descriptive content paired with a single action (membership row, integration row), use `Entity` instead.” (https://vercel.com/geist/table)
|
|
15
|
+
* “For a key/value metadata block on a detail page, use `Description`, not a two-column table.” (https://vercel.com/geist/table)
|
|
16
|
+
* “When the underlying list is empty (filter cleared, never created), render `Empty State` outside the table rather than an empty `<Table.Body>`.” (https://vercel.com/geist/table)
|
|
17
|
+
* Ours: Geist's `Entity` is `Item`, or `RecordList` when the row names a record; its `Description` is `ObjectFacts`; its `Empty State` is `EmptyState`. Records with sorting, paging and an empty state are `DataTable`.
|
|
18
|
+
* @behaviour A head row whose labels fill 36 px, with 12 px of room and then a 1 px rule under them, so the first row starts at the rule like every other; body
|
|
19
|
+
* rows 40 px, with no rule between them unless the body is `bordered`, which draws it straight
|
|
20
|
+
* across the row, under the corners. The first and last cell of a row take a 6 px corner, so a stripe
|
|
21
|
+
* or a highlight reads as a rounded bar. The last column, its heading and its cells, aligns to the
|
|
22
|
+
* trailing edge. `striped`, `bordered` and `interactive` belong to `TableBody`: stripes fill the odd
|
|
23
|
+
* rows with `muted` (a selected row there takes `accent`), `bordered` draws a rule between rows (not
|
|
24
|
+
* after the last) and no frame, and an interactive row takes `accent` on hover, on focus within and
|
|
25
|
+
* while its menu is open, over a stripe; a row that opens nothing is not `interactive`. Headers and
|
|
26
|
+
* footers never highlight and carry no fill; a footer has a rule above it and ink, medium text. A
|
|
27
|
+
* column's width is a `TableCol` in a `TableColgroup`. `density="comfortable"` is the entity row of a
|
|
28
|
+
* record that names itself. On a card narrower than its `compactDetails` layout a row never scrolls
|
|
29
|
+
* sideways: its secondary columns leave the row and their values stand in the `TableDetailRow` under
|
|
30
|
+
* it, one muted line joined by a middle dot that ends in an ellipsis, their labels read by assistive
|
|
31
|
+
* technology only, as Vercel's lists read on a phone; a `Tag` there reads as its plain text, and a
|
|
32
|
+
* fact that `wraps` lets the line wrap whole instead of ending in an ellipsis. An entity row
|
|
33
|
+
* (`density="comfortable"`) keeps its record on one 72 px row instead: its facts join the line
|
|
34
|
+
* under the name that `RecordIdentity` draws (`TableCompactLine`), so the row is the name over one line. Colour is neutral throughout: headings and cells share
|
|
35
|
+
* the body grey and a heading differs by weight, the footer is ink, and the hue of a state lives in
|
|
36
|
+
* the `StatusBadge` of a cell, never in the row.
|
|
37
|
+
* “Sortable column headers are buttons. The visible label stays Title Case; the sort-direction arrow is decorative and the button announces the next sort state to assistive tech.” (https://vercel.com/geist/table)
|
|
38
|
+
* Ours: no heading sorts the rows; the order is the page's, through a `CollectionSort` above the list.
|
|
39
|
+
* “Apply `tabular-nums` (or Geist Mono) to numeric columns so digits align across rows for comparison.” (https://vercel.com/geist/table)
|
|
40
|
+
* Ours: `DataTable` sets it on a numeric column; in a `Table` a figure's cell takes `tabular-nums`.
|
|
41
|
+
* @words “Column headers (`<Table.Head>`) are Title Case nouns or noun phrases: `Last Used`, `Requests (7d)`, `Created`, `Status`. Never sentences.” (https://vercel.com/geist/table)
|
|
42
|
+
* “Render `—` in cells where a value is unknown or not applicable. Don’t substitute `N/A`, `null`, or an empty string.” (https://vercel.com/geist/table)
|
|
43
|
+
* “Use the canonical short relative-time form in cells (`2m ago`, `5h ago`); switch to `Mar 14, 2026` past 7 days. See `Relative Time Card`.” (https://vercel.com/geist/table)
|
|
44
|
+
* Ours: headings are sentence case nouns with their unit, *Cost (€)*, *Tokens*, where Geist writes Title Case. Italian headings run a third longer and never wrap. A missing value is `TableValue`'s dash, read as its `missingLabel`. The table is always named: its `aria-label` says what it lists (*Usage by Agent*).
|
|
45
|
+
* @access A native `table` named by `aria-label` or `aria-labelledby`, which the types require, or
|
|
46
|
+
* `aria-hidden` when it is only the placeholder of a loading view; `th scope="col"`, with
|
|
47
|
+
* `aria-sort` on the column the rows are ordered by.
|
|
20
48
|
*/
|
|
21
|
-
function Table({ className, compactDetails, density = "default",
|
|
22
|
-
return (_jsx("div", { "data-slot": "table-container", className: cn("relative w-full overflow-x-auto", compactDetails && "@container/table"
|
|
49
|
+
function Table({ className, compactDetails, density = "default", ...props }) {
|
|
50
|
+
return (_jsx("div", { "data-slot": "table-container", className: cn("relative w-full overflow-x-auto", compactDetails && "@container/table"), children: _jsx("table", { "data-slot": "table", "data-compact-details": compactDetails, "data-density": density, className: cn("group/table w-full border-separate border-spacing-0 caption-bottom text-sm text-muted-foreground", className, compactDetails && tableCompactLayouts[compactDetails].table), ...props }) }));
|
|
51
|
+
}
|
|
52
|
+
function TableColgroup(props) {
|
|
53
|
+
return _jsx("colgroup", { "data-slot": "table-colgroup", ...props });
|
|
54
|
+
}
|
|
55
|
+
function TableCol(props) {
|
|
56
|
+
return _jsx("col", { "data-slot": "table-col", ...props });
|
|
23
57
|
}
|
|
24
58
|
function TableHeader({ className, ...props }) {
|
|
25
|
-
return (_jsx("thead", { "data-slot": "table-header", className: cn("
|
|
59
|
+
return (_jsx("thead", { "data-slot": "table-header", className: cn("[&_th]:h-12 [&_th]:pb-3", className), ...props }));
|
|
26
60
|
}
|
|
27
|
-
|
|
28
|
-
|
|
61
|
+
const ROUNDED_OUTER_CELLS = "[&>tr>td:first-child]:rounded-l-sm [&>tr>td:last-child]:rounded-r-sm";
|
|
62
|
+
function TableBody({ className, striped = false, bordered = false, interactive = false, ...props }) {
|
|
63
|
+
return (_jsx("tbody", { "data-slot": "table-body", "data-striped": striped, "data-bordered": bordered, "data-interactive": interactive, className: cn("[&_tr]:h-10 group-data-[density=comfortable]/table:[&_tr]:h-18 [&_tr:last-child>td]:border-b-0 [&_tr:last-child>td]:after:hidden", !bordered && ROUNDED_OUTER_CELLS, className), ...props }));
|
|
29
64
|
}
|
|
30
|
-
function TableRecordGroup({ className, ...props }) {
|
|
31
|
-
return (_jsx("tbody", { "data-
|
|
65
|
+
function TableRecordGroup({ className, interactive = false, ...props }) {
|
|
66
|
+
return (_jsx("tbody", { "data-bordered": true, "data-interactive": interactive, className: cn("[&_tr]:h-10 group-data-[density=comfortable]/table:[&_tr]:h-18 data-[interactive=true]:[&:hover>tr>td]:bg-accent [&:has(:focus-visible)>tr>td]:bg-accent [&:has([aria-expanded=true])>tr>td]:bg-accent [&:has(>tr[data-state=selected])>tr>td]:bg-muted [&:last-of-type>tr>td]:border-b-0 [&:last-of-type>tr>td]:after:hidden", className), ...props, "data-slot": "table-record-group" }));
|
|
32
67
|
}
|
|
33
68
|
function TableFooter({ className, ...props }) {
|
|
34
|
-
return (_jsx("tfoot", { "data-slot": "table-footer", className: cn("
|
|
69
|
+
return (_jsx("tfoot", { "data-slot": "table-footer", className: cn("font-medium text-foreground [&>tr:first-child>td]:border-t [&>tr:first-child>td]:border-border", className), ...props }));
|
|
35
70
|
}
|
|
36
71
|
function TableRow({ className, detailLayout, ...props }) {
|
|
37
|
-
return (_jsx("tr", { "data-slot": "table-row", className: cn("border-b border-border transition-colors
|
|
72
|
+
return (_jsx("tr", { "data-slot": "table-row", className: cn("in-data-[bordered=true]:[&>td]:relative in-data-[bordered=true]:[&>td]:border-b in-data-[bordered=true]:[&>td]:after:absolute in-data-[bordered=true]:[&>td]:after:inset-x-0 in-data-[bordered=true]:[&>td]:after:bottom-0 in-data-[bordered=true]:[&>td]:after:h-px in-data-[bordered=true]:[&>td]:after:bg-border [&>th]:border-b [&>td]:border-transparent [&>th]:border-border [&>td]:transition-colors in-data-[striped=true]:[&:where(:nth-child(odd))]:[&>td]:bg-muted in-data-[interactive=true]:hover:[&>td]:bg-accent in-[tbody]:has-[:focus-visible]:[&>td]:bg-accent in-[tbody]:has-aria-expanded:[&>td]:bg-accent data-[state=selected]:[&>td]:bg-muted in-data-[striped=true]:data-[state=selected]:[&>td]:bg-accent", detailLayout && tableCompactLayouts[detailLayout].row, className), ...props }));
|
|
38
73
|
}
|
|
39
74
|
function TableHead({ className, ...props }) {
|
|
40
|
-
return (_jsx("th", { "data-slot": "table-head", className: cn("h-9 px-2 text-left align-middle text-sm font-medium whitespace-nowrap text-
|
|
75
|
+
return (_jsx("th", { "data-slot": "table-head", className: cn("h-9 px-2 text-left align-middle text-sm font-medium whitespace-nowrap last:text-right [&:has([role=checkbox])]:pr-0", className), ...props }));
|
|
41
76
|
}
|
|
42
77
|
function TableCell({ className, ...props }) {
|
|
43
|
-
return (_jsx("td", { "data-slot": "table-cell", className: cn("px-2 py-2.5 group-data-[density=comfortable]/table:py-
|
|
78
|
+
return (_jsx("td", { "data-slot": "table-cell", className: cn("px-2 py-2.5 group-data-[density=comfortable]/table:py-4 group-data-[density=default]/table:[&:has(button)]:py-0.5 align-middle whitespace-nowrap last:text-right [&:has([role=checkbox])]:pr-0", className), ...props }));
|
|
44
79
|
}
|
|
45
80
|
function TableDetailRow({ colSpan, facts, layout = "standard", }) {
|
|
46
|
-
|
|
81
|
+
const wraps = facts.some((fact) => fact.wraps);
|
|
82
|
+
return (_jsx(TableRow, { "data-slot": "table-detail-row", className: cn("h-auto!", tableCompactLayouts[layout].details), children: _jsx(TableCell, { colSpan: colSpan, className: "pt-0! pb-3! whitespace-normal text-muted-foreground last:text-left", children: _jsx("div", { className: cn("relative min-w-0 in-[[data-slot=table-record-group]:has([data-slot=record-identity])]:pl-12 [&_[data-slot=tag]]:contents [&>span>:is(div,p,.block,.grid,.flex)]:inline", wraps ? "break-words" : "w-0 min-w-full truncate"), "data-slot": "table-detail-line", onFocus: wraps ? undefined : titleWhenCut, onPointerEnter: wraps ? undefined : titleWhenCut, children: _jsx(DetailFacts, { facts: facts }) }) }) }));
|
|
47
83
|
}
|
|
48
84
|
function TableCaption({ className, ...props }) {
|
|
49
85
|
return (_jsx("caption", { "data-slot": "table-caption", className: cn("mt-4 text-sm text-muted-foreground", className), ...props }));
|
|
50
86
|
}
|
|
51
|
-
export { Table, TableHeader, TableBody, TableRecordGroup, TableFooter, TableHead, TableRow, TableCell, TableCaption, TableDetailRow, tableCompactLayouts, };
|
|
87
|
+
export { Table, TableColgroup, TableCol, TableHeader, TableBody, TableRecordGroup, TableFooter, TableHead, TableRow, TableCell, TableCaption, TableDetailRow, tableCompactLayouts, };
|
|
@@ -2,25 +2,67 @@ import * as React from "react";
|
|
|
2
2
|
import { Tabs as TabsPrimitive } from "@base-ui/react/tabs";
|
|
3
3
|
import { useRender } from "@base-ui/react/use-render";
|
|
4
4
|
import { type VariantProps } from "class-variance-authority";
|
|
5
|
+
type TabGroupName = {
|
|
6
|
+
"aria-label": string;
|
|
7
|
+
"aria-labelledby"?: string | undefined;
|
|
8
|
+
} | {
|
|
9
|
+
"aria-labelledby": string;
|
|
10
|
+
"aria-label"?: string | undefined;
|
|
11
|
+
};
|
|
12
|
+
type TabDisabling = {
|
|
13
|
+
disabled?: false | undefined;
|
|
14
|
+
disabledReason?: undefined;
|
|
15
|
+
} | {
|
|
16
|
+
disabled: true;
|
|
17
|
+
/** Why the tab is unavailable, such as "Only owners see billing". */
|
|
18
|
+
disabledReason: string;
|
|
19
|
+
};
|
|
20
|
+
type TabsTriggerProps = Omit<TabsPrimitive.Tab.Props, "disabled"> & TabDisabling;
|
|
21
|
+
type TabsProps = Omit<TabsPrimitive.Root.Props, "value" | "defaultValue" | "onValueChange"> & {
|
|
22
|
+
/** The chosen tab's value; the page owns it, and it never lacks one. */
|
|
23
|
+
value: string;
|
|
24
|
+
onValueChange: (value: string, eventDetails: TabsPrimitive.Root.ChangeEventDetails) => void;
|
|
25
|
+
};
|
|
5
26
|
/**
|
|
6
27
|
* Panels of one surface that switch in place.
|
|
7
28
|
*
|
|
8
29
|
* @family Navigation
|
|
9
|
-
* @when
|
|
10
|
-
*
|
|
11
|
-
*
|
|
12
|
-
* @
|
|
13
|
-
*
|
|
14
|
-
*
|
|
15
|
-
*
|
|
16
|
-
*
|
|
30
|
+
* @when "Use Tabs to switch between sibling views inside a single page (`Overview`, `Logs`, `Settings`)." (https://vercel.com/geist/tabs)
|
|
31
|
+
* "Cap a Tabs row at 5–7 entries on desktop and 3–4 on mobile. Past that, consolidate or move secondary views behind a `Menu`." (https://vercel.com/geist/tabs)
|
|
32
|
+
* Ours: the cap is 7 on a desktop and 4 on a phone.
|
|
33
|
+
* @instead "For navigation between unrelated pages, use a sub-menu, not Tabs." (https://vercel.com/geist/tabs) "Tabs imply the views share scope, URL parent, and data model." (https://vercel.com/geist/tabs)
|
|
34
|
+
* Ours: views with their own URL are `TabsNav`. A choice that changes a value is a `RadioGroup` or
|
|
35
|
+
* `ToggleGroup`. A stable destination belongs in the `Sidebar`.
|
|
36
|
+
* @behaviour "Selecting a tab is instant; don’t trigger network confirmation or toast on tab change." (https://vercel.com/geist/tabs)
|
|
37
|
+
* "Reflect the active tab in the URL (query param or path) so deep-links and refresh restore state." (https://vercel.com/geist/tabs)
|
|
38
|
+
* "Disable individual tabs only for permission or empty-state reasons; pair the disabled tab with a `tooltip` that names the constraint." (https://vercel.com/geist/tabs)
|
|
39
|
+
* Ours: the `tooltip` is `disabledReason`, shown on hover and focus and kept as the tab's
|
|
40
|
+
* description. One treatment among siblings, chosen through `variant`, never a page border: `line`
|
|
41
|
+
* (50 px, a 2 px ink underline over the row's 1 px rule) for a page's collections, `default` (a
|
|
42
|
+
* 32 px pill on the selection fill) for an object's sections. The page owns the chosen tab: `value`
|
|
43
|
+
* and `onValueChange` are required. There is no sliding underline. Colour is neutral only: the
|
|
44
|
+
* chosen tab is ink, the rest are muted until hover, and a disabled tab is never dimmed: in `line`
|
|
45
|
+
* it reads as an unchosen one, in `default` it sits on the selection fill with muted text, both
|
|
46
|
+
* with a not-allowed cursor.
|
|
47
|
+
* @words "`tabs[].title` is Title Case, 1–2 words, and names the destination noun (`Overview`, `Logs`, `Settings`). Verbs belong on buttons; `View Logs` is wrong on a tab." (https://vercel.com/geist/tabs)
|
|
48
|
+
* "`tabs[].tooltip` is sentence case and explains the constraint (`Only visible to project owners.`), not the tab’s purpose." (https://vercel.com/geist/tabs)
|
|
49
|
+
* "Don’t append a count to the title (`Logs (12)`); use a badge slot instead and drop the badge at zero." (https://vercel.com/geist/tabs)
|
|
50
|
+
* Ours: the title is sentence case (*Overview*, *Installations*), not Title Case. There is no badge
|
|
51
|
+
* slot: a count belongs to the list's footer. A reason is *Only owners see billing*. Italian
|
|
52
|
+
* (*Installazioni*) scrolls, never wraps or truncates.
|
|
53
|
+
* @access "Keep Left/Right arrows moving focus across tabs and Enter/Space activating; don’t hijack with global shortcuts." (https://vercel.com/geist/tabs)
|
|
54
|
+
* "Label the tablist with `aria-label` when no visible heading sits above it (`aria-label="Sections"`)." (https://vercel.com/geist/tabs)
|
|
55
|
+
* "Maintain a visible focus ring on the active tab; don’t suppress focus styles for visual polish." (https://vercel.com/geist/tabs)
|
|
56
|
+
* Ours: the arrow keys move with one tab stop. `tablist`, `tab`, `tabpanel` with `aria-selected`.
|
|
57
|
+
* The row is named by `aria-label` or `aria-labelledby`, which the type requires; a disabled tab is
|
|
58
|
+
* `aria-disabled`.
|
|
17
59
|
*/
|
|
18
|
-
declare function Tabs({ className, orientation, ...props }:
|
|
60
|
+
declare function Tabs({ className, orientation, ...props }: TabsProps): React.JSX.Element;
|
|
19
61
|
declare const tabsListVariants: (props?: ({
|
|
20
62
|
variant?: "line" | "default" | null | undefined;
|
|
21
63
|
} & import("class-variance-authority/types").ClassProp) | undefined) => string;
|
|
22
|
-
declare function TabsList({ className, variant, ...props }: TabsPrimitive.List.Props & VariantProps<typeof tabsListVariants>): React.JSX.Element;
|
|
23
|
-
declare function TabsTrigger({ className, ...props }:
|
|
64
|
+
declare function TabsList({ className, variant, ...props }: Omit<TabsPrimitive.List.Props, "aria-label" | "aria-labelledby"> & VariantProps<typeof tabsListVariants> & TabGroupName): React.JSX.Element;
|
|
65
|
+
declare function TabsTrigger({ className, disabled, disabledReason, "aria-describedby": describedBy, ...props }: TabsTriggerProps): React.JSX.Element;
|
|
24
66
|
declare function TabsContent({ className, ...props }: TabsPrimitive.Panel.Props): React.JSX.Element;
|
|
25
67
|
/**
|
|
26
68
|
* Sibling views of one object, each with its own URL, under the top bar.
|
|
@@ -30,15 +72,42 @@ declare function TabsContent({ className, ...props }: TabsPrimitive.Panel.Props)
|
|
|
30
72
|
* sections), with `TabsLink` for each.
|
|
31
73
|
* @instead Panels that switch in place are `Tabs`. A stable destination belongs in the `Sidebar`.
|
|
32
74
|
* An object's ancestry is the `Breadcrumb`.
|
|
33
|
-
* @behaviour
|
|
34
|
-
*
|
|
35
|
-
*
|
|
36
|
-
*
|
|
37
|
-
*
|
|
75
|
+
* @behaviour "Reflect the active tab in the URL (query param or path) so deep-links and refresh restore state." (https://vercel.com/geist/tabs)
|
|
76
|
+
* Ours: each view is its own URL, so a link carries it. Overflow scrolls sideways and brings the
|
|
77
|
+
* current link into view, and the row fades out over 32 px at each end where links stand beyond it. The current link takes the selection fill, or in `line` an ink underline
|
|
78
|
+
* over the row's 1 px rule; the other links are muted until hover, with no hue. Sizes and spacing
|
|
79
|
+
* follow `Tabs`. The sub-pages of one object stand as the filled-pill row in a `band` under the top
|
|
80
|
+
* bar, as Vercel draws a deployment's tabs: the band is this component's, with `above` for the
|
|
81
|
+
* object's identity, so no page draws the border, the fill or the gutters around the row. The band
|
|
82
|
+
* keeps the page's own column and gutter, and the first link's words start at the page title's edge,
|
|
83
|
+
* its fill reaching into the gutter as Vercel's tabs do. The
|
|
84
|
+
* `line` row has its own rule and takes no band.
|
|
85
|
+
* @words "`tabs[].title` is Title Case, 1–2 words, and names the destination noun (`Overview`, `Logs`, `Settings`). Verbs belong on buttons; `View Logs` is wrong on a tab." (https://vercel.com/geist/tabs)
|
|
86
|
+
* "Don’t append a count to the title (`Logs (12)`); use a badge slot instead and drop the badge at zero." (https://vercel.com/geist/tabs)
|
|
87
|
+
* Ours: the title is sentence case (*Overview*, *Installations*), not Title Case. There is no badge
|
|
88
|
+
* slot: a count belongs to the list's footer. Italian scrolls, never wraps or truncates.
|
|
89
|
+
* @access "Label the tablist with `aria-label` when no visible heading sits above it (`aria-label="Sections"`)." (https://vercel.com/geist/tabs)
|
|
90
|
+
* "Maintain a visible focus ring on the active tab; don’t suppress focus styles for visual polish." (https://vercel.com/geist/tabs)
|
|
91
|
+
* Ours: a `nav` of links named by `aria-label` or `aria-labelledby`, which the type requires, with
|
|
92
|
+
* `aria-current="page"` on the current one.
|
|
38
93
|
*/
|
|
39
|
-
declare function TabsNav({ className, children, variant, ...props }: React.ComponentProps<"nav"> &
|
|
94
|
+
declare function TabsNav({ className, children, variant, band, above, ...props }: Omit<React.ComponentProps<"nav">, "aria-label" | "aria-labelledby"> & TabGroupName & ({
|
|
95
|
+
variant?: "default" | "line" | null;
|
|
96
|
+
band?: false;
|
|
97
|
+
above?: never;
|
|
98
|
+
} | {
|
|
99
|
+
variant?: "default" | null;
|
|
100
|
+
/**
|
|
101
|
+
* The row stands in a full-width band under the top bar: a 1 px rule below, the page's
|
|
102
|
+
* background, the page's gutters, and the reading column centred inside.
|
|
103
|
+
*/
|
|
104
|
+
band: true;
|
|
105
|
+
/** The object's identity, in the band's column above the row. */
|
|
106
|
+
above?: React.ReactNode;
|
|
107
|
+
})): React.JSX.Element;
|
|
40
108
|
declare function TabsLink({ current, className, render, ...props }: useRender.ComponentProps<"a"> & {
|
|
41
109
|
current?: boolean;
|
|
42
110
|
}): React.JSX.Element;
|
|
43
111
|
export { Tabs, TabsList, TabsTrigger, TabsContent, TabsNav, TabsLink, tabsListVariants };
|
|
112
|
+
export type { TabsProps };
|
|
44
113
|
//# sourceMappingURL=tabs.d.ts.map
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"tabs.d.ts","sourceRoot":"","sources":["../../src/components/tabs.tsx"],"names":[],"mappings":"AAEA,OAAO,KAAK,KAAK,MAAM,OAAO,CAAC;AAC/B,OAAO,EAAE,IAAI,IAAI,aAAa,EAAE,MAAM,qBAAqB,CAAC;AAE5D,OAAO,EAAE,SAAS,EAAE,MAAM,2BAA2B,CAAC;AACtD,OAAO,EAAO,KAAK,YAAY,EAAE,MAAM,0BAA0B,CAAC;
|
|
1
|
+
{"version":3,"file":"tabs.d.ts","sourceRoot":"","sources":["../../src/components/tabs.tsx"],"names":[],"mappings":"AAEA,OAAO,KAAK,KAAK,MAAM,OAAO,CAAC;AAC/B,OAAO,EAAE,IAAI,IAAI,aAAa,EAAE,MAAM,qBAAqB,CAAC;AAE5D,OAAO,EAAE,SAAS,EAAE,MAAM,2BAA2B,CAAC;AACtD,OAAO,EAAO,KAAK,YAAY,EAAE,MAAM,0BAA0B,CAAC;AAKlE,KAAK,YAAY,GACb;IAAE,YAAY,EAAE,MAAM,CAAC;IAAC,iBAAiB,CAAC,EAAE,MAAM,GAAG,SAAS,CAAA;CAAE,GAChE;IAAE,iBAAiB,EAAE,MAAM,CAAC;IAAC,YAAY,CAAC,EAAE,MAAM,GAAG,SAAS,CAAA;CAAE,CAAC;AAErE,KAAK,YAAY,GACb;IAAE,QAAQ,CAAC,EAAE,KAAK,GAAG,SAAS,CAAC;IAAC,cAAc,CAAC,EAAE,SAAS,CAAA;CAAE,GAC5D;IACE,QAAQ,EAAE,IAAI,CAAC;IACf,qEAAqE;IACrE,cAAc,EAAE,MAAM,CAAC;CACxB,CAAC;AAEN,KAAK,gBAAgB,GAAG,IAAI,CAAC,aAAa,CAAC,GAAG,CAAC,KAAK,EAAE,UAAU,CAAC,GAAG,YAAY,CAAC;AAEjF,KAAK,SAAS,GAAG,IAAI,CAAC,aAAa,CAAC,IAAI,CAAC,KAAK,EAAE,OAAO,GAAG,cAAc,GAAG,eAAe,CAAC,GAAG;IAC5F,wEAAwE;IACxE,KAAK,EAAE,MAAM,CAAC;IACd,aAAa,EAAE,CAAC,KAAK,EAAE,MAAM,EAAE,YAAY,EAAE,aAAa,CAAC,IAAI,CAAC,kBAAkB,KAAK,IAAI,CAAC;CAC7F,CAAC;AAEF;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;GAiCG;AACH,iBAAS,IAAI,CAAC,EAAE,SAAS,EAAE,WAA0B,EAAE,GAAG,KAAK,EAAE,EAAE,SAAS,qBAU3E;AAED,QAAA,MAAM,gBAAgB;;8EAarB,CAAC;AAEF,iBAAS,QAAQ,CAAC,EAChB,SAAS,EACT,OAAmB,EACnB,GAAG,KAAK,EACT,EAAE,IAAI,CAAC,aAAa,CAAC,IAAI,CAAC,KAAK,EAAE,YAAY,GAAG,iBAAiB,CAAC,GACjE,YAAY,CAAC,OAAO,gBAAgB,CAAC,GACrC,YAAY,qBASb;AAKD,iBAAS,WAAW,CAAC,EACnB,SAAS,EACT,QAAQ,EACR,cAAc,EACd,kBAAkB,EAAE,WAAW,EAC/B,GAAG,KAAK,EACT,EAAE,gBAAgB,qBAkClB;AAED,iBAAS,WAAW,CAAC,EAAE,SAAS,EAAE,GAAG,KAAK,EAAE,EAAE,aAAa,CAAC,KAAK,CAAC,KAAK,qBAQtE;AAkBD;;;;;;;;;;;;;;;;;;;;;;;;;;GA0BG;AACH,iBAAS,OAAO,CAAC,EACf,SAAS,EACT,QAAQ,EACR,OAAmB,EACnB,IAAY,EACZ,KAAK,EACL,GAAG,KAAK,EACT,EAAE,IAAI,CAAC,KAAK,CAAC,cAAc,CAAC,KAAK,CAAC,EAAE,YAAY,GAAG,iBAAiB,CAAC,GACpE,YAAY,GACZ,CACI;IACE,OAAO,CAAC,EAAE,SAAS,GAAG,MAAM,GAAG,IAAI,CAAC;IACpC,IAAI,CAAC,EAAE,KAAK,CAAC;IACb,KAAK,CAAC,EAAE,KAAK,CAAC;CACf,GACD;IACE,OAAO,CAAC,EAAE,SAAS,GAAG,IAAI,CAAC;IAC3B;;;OAGG;IACH,IAAI,EAAE,IAAI,CAAC;IACX,iEAAiE;IACjE,KAAK,CAAC,EAAE,KAAK,CAAC,SAAS,CAAC;CACzB,CACJ,qBAqDF;AAED,iBAAS,QAAQ,CAAC,EAChB,OAAe,EACf,SAAS,EACT,MAAM,EACN,GAAG,KAAK,EACT,EAAE,SAAS,CAAC,cAAc,CAAC,GAAG,CAAC,GAAG;IAAE,OAAO,CAAC,EAAE,OAAO,CAAA;CAAE,qBAqBvD;AAED,OAAO,EAAE,IAAI,EAAE,QAAQ,EAAE,WAAW,EAAE,WAAW,EAAE,OAAO,EAAE,QAAQ,EAAE,gBAAgB,EAAE,CAAC;AACzF,YAAY,EAAE,SAAS,EAAE,CAAC"}
|