@nadicodeai/ui 12.1.165 → 12.1.167
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/AGENTS.md +8 -9
- package/README.md +2 -17
- package/dist/components/accordion.d.ts.map +1 -1
- package/dist/components/accordion.js +2 -1
- package/dist/components/account-menu.d.ts.map +1 -1
- package/dist/components/account-menu.js +5 -3
- package/dist/components/activity-calendar.d.ts.map +1 -1
- package/dist/components/activity-calendar.js +3 -2
- package/dist/components/agent-card.js +1 -1
- package/dist/components/agent-orb.d.ts.map +1 -1
- package/dist/components/agent-orb.js +1 -0
- package/dist/components/agent-profile.d.ts.map +1 -1
- package/dist/components/agent-profile.js +7 -4
- package/dist/components/alert-dialog.d.ts +1 -1
- package/dist/components/alert-dialog.d.ts.map +1 -1
- package/dist/components/alert-dialog.js +3 -3
- package/dist/components/app-mark.js +1 -1
- package/dist/components/avatar.js +8 -8
- package/dist/components/badge.d.ts +11 -16
- package/dist/components/badge.d.ts.map +1 -1
- package/dist/components/badge.js +7 -43
- package/dist/components/breadcrumb.d.ts.map +1 -1
- package/dist/components/breadcrumb.js +3 -2
- package/dist/components/button.d.ts +5 -21
- package/dist/components/button.d.ts.map +1 -1
- package/dist/components/button.js +6 -76
- package/dist/components/calendar.d.ts +1 -1
- package/dist/components/calendar.d.ts.map +1 -1
- package/dist/components/calendar.js +3 -3
- package/dist/components/card-row.js +1 -1
- package/dist/components/card.d.ts +4 -1
- package/dist/components/card.d.ts.map +1 -1
- package/dist/components/card.js +3 -2
- package/dist/components/catalog-drawer.d.ts.map +1 -1
- package/dist/components/catalog-drawer.js +3 -2
- package/dist/components/chart-axis.d.ts.map +1 -1
- package/dist/components/chart-axis.js +0 -2
- package/dist/components/chart-bar-horizontal.d.ts.map +1 -1
- package/dist/components/chart-bar-horizontal.js +16 -14
- package/dist/components/chart-card.d.ts.map +1 -1
- package/dist/components/chart-card.js +0 -1
- package/dist/components/chart.d.ts.map +1 -1
- package/dist/components/chart.js +18 -32
- package/dist/components/checkbox.d.ts +3 -2
- package/dist/components/checkbox.d.ts.map +1 -1
- package/dist/components/checkbox.js +4 -3
- package/dist/components/choicebox.d.ts +5 -5
- package/dist/components/choicebox.d.ts.map +1 -1
- package/dist/components/choicebox.js +6 -5
- package/dist/components/clearable-input.d.ts.map +1 -1
- package/dist/components/clearable-input.js +2 -2
- package/dist/components/code-block.d.ts.map +1 -1
- package/dist/components/code-block.js +4 -2
- package/dist/components/collapsible.js +1 -1
- package/dist/components/collection-filters.d.ts.map +1 -1
- package/dist/components/collection-filters.js +1 -0
- package/dist/components/collection-page.js +1 -1
- package/dist/components/collection-sort.d.ts.map +1 -1
- package/dist/components/collection-sort.js +1 -4
- package/dist/components/collection-toolbar.js +1 -1
- package/dist/components/combobox.js +4 -4
- package/dist/components/command.d.ts.map +1 -1
- package/dist/components/command.js +1 -1
- package/dist/components/confirm-dialog.js +2 -2
- package/dist/components/context-menu.d.ts +1 -1
- package/dist/components/context-menu.d.ts.map +1 -1
- package/dist/components/copy-button.js +1 -1
- package/dist/components/data-table.d.ts +14 -7
- package/dist/components/data-table.d.ts.map +1 -1
- package/dist/components/data-table.js +24 -15
- package/dist/components/dialog.d.ts +1 -1
- package/dist/components/dialog.d.ts.map +1 -1
- package/dist/components/dialog.js +2 -2
- package/dist/components/drawer.d.ts +4 -4
- package/dist/components/drawer.d.ts.map +1 -1
- package/dist/components/drawer.js +14 -15
- package/dist/components/dropdown-menu.d.ts +1 -1
- package/dist/components/dropdown-menu.d.ts.map +1 -1
- package/dist/components/dropdown-menu.js +9 -5
- package/dist/components/empty-art.js +1 -1
- package/dist/components/empty-state.js +2 -2
- package/dist/components/entry-scene.d.ts.map +1 -1
- package/dist/components/entry-scene.js +2 -3
- package/dist/components/field.js +3 -3
- package/dist/components/file-diff.d.ts.map +1 -1
- package/dist/components/file-diff.js +5 -2
- package/dist/components/footer.d.ts +1 -1
- package/dist/components/footer.d.ts.map +1 -1
- package/dist/components/footer.js +3 -3
- package/dist/components/form-dialog.d.ts.map +1 -1
- package/dist/components/form-dialog.js +2 -1
- package/dist/components/form-drawer.d.ts +7 -9
- package/dist/components/form-drawer.d.ts.map +1 -1
- package/dist/components/form-drawer.js +5 -5
- package/dist/components/form.d.ts +26 -0
- package/dist/components/form.d.ts.map +1 -0
- package/dist/components/form.js +29 -0
- package/dist/components/gauge.js +2 -2
- package/dist/components/heatmap/calendar-heatmap.d.ts.map +1 -1
- package/dist/components/heatmap/calendar-heatmap.js +15 -13
- package/dist/components/hive-scene.d.ts.map +1 -1
- package/dist/components/hive-scene.js +3 -1
- package/dist/components/hover-card.d.ts +1 -1
- package/dist/components/hover-card.d.ts.map +1 -1
- package/dist/components/hover-card.js +1 -1
- package/dist/components/input-group.d.ts +5 -6
- package/dist/components/input-group.d.ts.map +1 -1
- package/dist/components/input-group.js +8 -11
- package/dist/components/input-otp.d.ts.map +1 -1
- package/dist/components/input-otp.js +2 -2
- package/dist/components/item.d.ts +1 -1
- package/dist/components/item.js +2 -2
- package/dist/components/kbd.d.ts +6 -9
- package/dist/components/kbd.d.ts.map +1 -1
- package/dist/components/kbd.js +7 -3
- package/dist/components/message-notice.js +1 -1
- package/dist/components/middle-truncate.d.ts.map +1 -1
- package/dist/components/middle-truncate.js +1 -0
- package/dist/components/model-identity.d.ts +4 -4
- package/dist/components/model-identity.d.ts.map +1 -1
- package/dist/components/model-identity.js +2 -2
- package/dist/components/model-mark.d.ts.map +1 -1
- package/dist/components/model-mark.js +4 -2
- package/dist/components/multi-select.js +2 -2
- package/dist/components/native-select.d.ts.map +1 -1
- package/dist/components/native-select.js +2 -6
- package/dist/components/notice-banner.js +1 -1
- package/dist/components/object-page.js +2 -2
- package/dist/components/object-workspace.d.ts.map +1 -1
- package/dist/components/object-workspace.js +1 -3
- package/dist/components/overview-page.d.ts +1 -1
- package/dist/components/overview-page.d.ts.map +1 -1
- package/dist/components/overview-page.js +2 -1
- package/dist/components/page-actions.d.ts.map +1 -1
- package/dist/components/page-actions.js +9 -4
- package/dist/components/pairing-code.js +1 -1
- package/dist/components/pending-label.d.ts.map +1 -1
- package/dist/components/pending-label.js +0 -1
- package/dist/components/popover.d.ts +1 -1
- package/dist/components/popover.d.ts.map +1 -1
- package/dist/components/portal-sidebar-frame.d.ts.map +1 -1
- package/dist/components/portal-sidebar-frame.js +1 -1
- package/dist/components/product-message.d.ts.map +1 -1
- package/dist/components/product-message.js +1 -0
- package/dist/components/progress-checklist.d.ts.map +1 -1
- package/dist/components/progress-checklist.js +2 -2
- package/dist/components/progress.d.ts.map +1 -1
- package/dist/components/progress.js +5 -4
- package/dist/components/radio-group.js +2 -2
- package/dist/components/reading-column.js +1 -1
- package/dist/components/record-identity.d.ts.map +1 -1
- package/dist/components/record-identity.js +2 -5
- package/dist/components/record-list.d.ts +5 -4
- package/dist/components/record-list.d.ts.map +1 -1
- package/dist/components/record-list.js +31 -17
- package/dist/components/record-sheet.js +1 -1
- package/dist/components/record-time.d.ts.map +1 -1
- package/dist/components/record-time.js +2 -1
- package/dist/components/resizable.d.ts.map +1 -1
- package/dist/components/resizable.js +1 -1
- package/dist/components/row-edit-form.d.ts +2 -1
- package/dist/components/row-edit-form.d.ts.map +1 -1
- package/dist/components/row-edit-form.js +2 -1
- package/dist/components/run-timeline.js +1 -1
- package/dist/components/scope-switcher.js +1 -1
- package/dist/components/segmented-control.js +1 -1
- package/dist/components/select.js +1 -1
- package/dist/components/settings-facts.js +1 -1
- package/dist/components/settings-section.js +1 -1
- package/dist/components/sheet.d.ts +1 -1
- package/dist/components/sheet.d.ts.map +1 -1
- package/dist/components/sheet.js +1 -1
- package/dist/components/sidebar.d.ts +2 -2
- package/dist/components/sidebar.d.ts.map +1 -1
- package/dist/components/sidebar.js +16 -18
- package/dist/components/site-menu.d.ts +28 -0
- package/dist/components/site-menu.d.ts.map +1 -0
- package/dist/components/site-menu.js +23 -0
- package/dist/components/slider.d.ts.map +1 -1
- package/dist/components/slider.js +2 -1
- package/dist/components/snippet.d.ts +2 -0
- package/dist/components/snippet.d.ts.map +1 -1
- package/dist/components/snippet.js +13 -6
- package/dist/components/sonner.d.ts.map +1 -1
- package/dist/components/sonner.js +3 -4
- package/dist/components/status-badge.d.ts +1 -1
- package/dist/components/status-badge.d.ts.map +1 -1
- package/dist/components/switch.js +1 -1
- package/dist/components/table-card.js +1 -1
- package/dist/components/table-layouts.d.ts +24 -9
- package/dist/components/table-layouts.d.ts.map +1 -1
- package/dist/components/table-layouts.js +27 -10
- package/dist/components/table.js +4 -4
- package/dist/components/tabs-nav.d.ts +52 -0
- package/dist/components/tabs-nav.d.ts.map +1 -0
- package/dist/components/tabs-nav.js +95 -0
- package/dist/components/tabs.d.ts +2 -56
- package/dist/components/tabs.d.ts.map +1 -1
- package/dist/components/tabs.js +2 -91
- package/dist/components/text-link.d.ts +1 -2
- package/dist/components/text-link.d.ts.map +1 -1
- package/dist/components/text-link.js +1 -2
- package/dist/components/textarea.d.ts +5 -2
- package/dist/components/textarea.d.ts.map +1 -1
- package/dist/components/textarea.js +12 -4
- package/dist/components/toast.d.ts +2 -0
- package/dist/components/toast.d.ts.map +1 -1
- package/dist/components/toast.js +4 -0
- package/dist/components/toggle-group.d.ts +3 -1
- package/dist/components/toggle-group.d.ts.map +1 -1
- package/dist/components/toggle-group.js +3 -6
- package/dist/components/toggle.js +1 -1
- package/dist/components/tooltip.d.ts +12 -12
- package/dist/components/tooltip.d.ts.map +1 -1
- package/dist/components/tooltip.js +9 -9
- package/dist/components/trend-badge.js +2 -2
- package/dist/components/update-card.js +1 -1
- package/dist/components/usage-meter.d.ts +1 -1
- package/dist/components/usage-meter.d.ts.map +1 -1
- package/dist/components/usage-meter.js +9 -7
- package/dist/components/waiting-line.js +1 -1
- package/dist/index.d.ts +3 -7
- package/dist/index.d.ts.map +1 -1
- package/dist/index.js +3 -7
- package/dist/internal/agent-orb-motion.d.ts +4 -1
- package/dist/internal/agent-orb-motion.d.ts.map +1 -1
- package/dist/internal/agent-orb-motion.js +9 -7
- package/dist/internal/agent-orb.d.ts +4 -1
- package/dist/internal/agent-orb.d.ts.map +1 -1
- package/dist/internal/agent-orb.js +7 -1
- package/dist/internal/assistant-ui/attachment.d.ts.map +1 -1
- package/dist/internal/assistant-ui/attachment.js +15 -15
- package/dist/internal/assistant-ui/follow-up-suggestions.js +1 -1
- package/dist/internal/assistant-ui/markdown-text.js +26 -25
- package/dist/internal/assistant-ui/reasoning.d.ts.map +1 -1
- package/dist/internal/assistant-ui/reasoning.js +13 -16
- package/dist/internal/assistant-ui/thread.d.ts.map +1 -1
- package/dist/internal/assistant-ui/thread.js +22 -16
- package/dist/internal/assistant-ui/tool-fallback.d.ts.map +1 -1
- package/dist/internal/assistant-ui/tool-fallback.js +29 -21
- package/dist/internal/assistant-ui/tool-group.d.ts.map +1 -1
- package/dist/internal/assistant-ui/tool-group.js +6 -7
- package/dist/internal/assistant-ui/tooltip-icon-button.js +1 -1
- package/dist/internal/badge-frame.d.ts +15 -0
- package/dist/internal/badge-frame.d.ts.map +1 -0
- package/dist/internal/badge-frame.js +44 -0
- package/dist/internal/button-classes.d.ts +20 -0
- package/dist/internal/button-classes.d.ts.map +1 -0
- package/dist/internal/button-classes.js +74 -0
- package/dist/internal/catalog-list.d.ts.map +1 -1
- package/dist/internal/catalog-list.js +8 -4
- package/dist/internal/collection-rail.js +3 -3
- package/dist/internal/form-drawer-frame.d.ts +10 -0
- package/dist/internal/form-drawer-frame.d.ts.map +1 -0
- package/dist/internal/form-drawer-frame.js +9 -0
- package/dist/internal/form-submit.d.ts +2 -1
- package/dist/internal/form-submit.d.ts.map +1 -1
- package/dist/internal/settings-save.d.ts.map +1 -1
- package/dist/internal/settings-save.js +4 -2
- package/dist/internal/status-mark.d.ts.map +1 -1
- package/dist/internal/status-mark.js +4 -1
- package/dist/internal/tab-row.d.ts +10 -0
- package/dist/internal/tab-row.d.ts.map +1 -0
- package/dist/internal/tab-row.js +2 -0
- package/dist/internal/table-compact-line.d.ts +1 -1
- package/dist/internal/table-compact-line.d.ts.map +1 -1
- package/dist/internal/table-compact-line.js +1 -1
- package/dist/internal/tooltip-content-frame.d.ts +14 -0
- package/dist/internal/tooltip-content-frame.d.ts.map +1 -0
- package/dist/internal/tooltip-content-frame.js +11 -0
- package/dist/lib/css-variables.d.ts +8 -0
- package/dist/lib/css-variables.d.ts.map +1 -0
- package/dist/lib/css-variables.js +4 -0
- package/dist/lib/merge-tokens.generated.js +1 -1
- package/dist/lib/use-copy-to-clipboard.d.ts.map +1 -1
- package/dist/lib/use-copy-to-clipboard.js +1 -2
- package/dist/showcase/samples.js +1 -1
- package/dist/showcase/specimens/choices.d.ts.map +1 -1
- package/dist/showcase/specimens/choices.js +3 -2
- package/dist/showcase/specimens/compositions.d.ts.map +1 -1
- package/dist/showcase/specimens/compositions.js +7 -5
- package/dist/showcase/specimens/data.d.ts.map +1 -1
- package/dist/showcase/specimens/data.js +1 -1
- package/dist/showcase/specimens/feedback.d.ts.map +1 -1
- package/dist/showcase/specimens/feedback.js +1 -2
- package/dist/showcase/specimens/index.d.ts +2 -0
- package/dist/showcase/specimens/index.d.ts.map +1 -1
- package/dist/showcase/specimens/inputs.d.ts +1 -0
- package/dist/showcase/specimens/inputs.d.ts.map +1 -1
- package/dist/showcase/specimens/inputs.js +5 -2
- package/dist/showcase/specimens/menus.d.ts +1 -0
- package/dist/showcase/specimens/menus.d.ts.map +1 -1
- package/dist/showcase/specimens/menus.js +7 -2
- package/dist/showcase/specimens/navigation.d.ts.map +1 -1
- package/dist/showcase/specimens/navigation.js +6 -5
- package/dist/showcase/specimens/status.d.ts.map +1 -1
- package/dist/showcase/specimens/status.js +4 -4
- 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 +40 -18
- package/dist/standalone/index.js +2 -2
- package/dist/standalone/orb-page.js +10 -8
- package/dist/styles/components.css +14 -1
- package/package.json +32 -33
- package/dist/eslint/index.js +0 -224
- package/dist/eslint/rules/badge-is-static-label.js +0 -93
- package/dist/eslint/rules/button-icon-slot.js +0 -102
- package/dist/eslint/rules/button-link-for-navigation.js +0 -146
- package/dist/eslint/rules/button-no-aria-label-with-text.js +0 -75
- package/dist/eslint/rules/button-type-roles-only-in-buttons.js +0 -83
- package/dist/eslint/rules/choice-control-has-a-name.js +0 -98
- package/dist/eslint/rules/choice-group-in-fieldset.js +0 -86
- package/dist/eslint/rules/command-shortcut-single-owner.js +0 -118
- package/dist/eslint/rules/confirm-dialog-words.js +0 -63
- package/dist/eslint/rules/data-table-one-unsized-column.js +0 -96
- package/dist/eslint/rules/destructive-action-placement.js +0 -69
- package/dist/eslint/rules/disabled-choice-says-why.js +0 -71
- package/dist/eslint/rules/disabled-control-appearance.js +0 -75
- package/dist/eslint/rules/ellipsis-opens-a-dialog.js +0 -110
- package/dist/eslint/rules/empty-state-owner.js +0 -145
- package/dist/eslint/rules/input-group-owners.js +0 -155
- package/dist/eslint/rules/jsx-class-utility.js +0 -200
- package/dist/eslint/rules/kbd-children-no-modifier-text.js +0 -128
- package/dist/eslint/rules/literal-text.js +0 -41
- package/dist/eslint/rules/menu-owner.js +0 -75
- package/dist/eslint/rules/middle-truncate-placement.js +0 -69
- package/dist/eslint/rules/no-app-feature-component.js +0 -100
- package/dist/eslint/rules/no-bare-button-label.js +0 -55
- package/dist/eslint/rules/no-choice-control-wrapper.js +0 -97
- package/dist/eslint/rules/no-comment.js +0 -77
- package/dist/eslint/rules/no-control-in-read-only-surface.js +0 -106
- package/dist/eslint/rules/no-decorative-icon.js +0 -164
- package/dist/eslint/rules/no-deprecated-zod-api.js +0 -215
- package/dist/eslint/rules/no-global-patch.js +0 -115
- package/dist/eslint/rules/no-hand-built-busy.js +0 -104
- package/dist/eslint/rules/no-hand-built-theme-picker.js +0 -144
- package/dist/eslint/rules/no-hand-built-tile.js +0 -41
- package/dist/eslint/rules/no-hand-formatted-date.js +0 -87
- package/dist/eslint/rules/no-hand-stacked-avatars.js +0 -67
- package/dist/eslint/rules/no-nested-collapse.js +0 -60
- package/dist/eslint/rules/no-package-component-redefinition.js +0 -175
- package/dist/eslint/rules/no-search-in-form.js +0 -47
- package/dist/eslint/rules/no-shadcn-appearance-override.js +0 -305
- package/dist/eslint/rules/no-shell-prompt-in-snippet.js +0 -74
- package/dist/eslint/rules/no-stock-error-words.js +0 -56
- package/dist/eslint/rules/no-subject-derived-expectation.js +0 -183
- package/dist/eslint/rules/no-tooltip-around-labelled-field.js +0 -72
- package/dist/eslint/rules/no-weight-class-on-strong-in-type-role.js +0 -57
- package/dist/eslint/rules/no-write-in-subscription.js +0 -140
- package/dist/eslint/rules/one-submenu-level.js +0 -43
- package/dist/eslint/rules/one-toast-per-flow.js +0 -91
- package/dist/eslint/rules/option-count.js +0 -167
- package/dist/eslint/rules/page-command-link-not-render.js +0 -43
- package/dist/eslint/rules/page-composition.js +0 -232
- package/dist/eslint/rules/progress-needs-name.js +0 -57
- package/dist/eslint/rules/rendered-import.js +0 -121
- package/dist/eslint/rules/server-action-discipline.js +0 -233
- package/dist/eslint/rules/settings-limit-in-footer.js +0 -94
- package/dist/eslint/rules/skeleton-in-region.js +0 -80
- package/dist/eslint/rules/sortable-heading-uses-sort.js +0 -79
- package/dist/eslint/rules/table-cell-inset-owner.js +0 -107
- package/dist/eslint/rules/tabs-selection-is-controlled.js +0 -47
- package/dist/eslint/rules/test-files-from-one-definition.js +0 -67
- package/dist/eslint/rules/tooltip-only-arrow.js +0 -38
- package/dist/eslint/rules/tooltip-trigger-accessible-name.js +0 -114
- package/dist/eslint/rules/workspace-declares-imports.js +0 -163
- package/dist/eslint/strict-design-system.js +0 -250
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"button.d.ts","sourceRoot":"","sources":["../../src/components/button.tsx"],"names":[],"mappings":"AAAA,OAAO,EAAE,MAAM,IAAI,eAAe,EAAE,MAAM,uBAAuB,CAAC;AAElE,OAAO,EAAE,SAAS,EAAE,MAAM,2BAA2B,CAAC;AACtD,OAAO,
|
|
1
|
+
{"version":3,"file":"button.d.ts","sourceRoot":"","sources":["../../src/components/button.tsx"],"names":[],"mappings":"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"}
|
|
@@ -2,81 +2,10 @@ import { jsx as _jsx, Fragment as _Fragment, jsxs as _jsxs } from "react/jsx-run
|
|
|
2
2
|
import { Button as ButtonPrimitive } from "@base-ui/react/button";
|
|
3
3
|
import { mergeProps } from "@base-ui/react/merge-props";
|
|
4
4
|
import { useRender } from "@base-ui/react/use-render";
|
|
5
|
-
import { cva } from "class-variance-authority";
|
|
6
5
|
import { Children, isValidElement } from "react";
|
|
7
6
|
import { PendingLabel } from "./pending-label.js";
|
|
7
|
+
import { buttonVariants, } from "../internal/button-classes.js";
|
|
8
8
|
import { cn } from "../lib/utils.js";
|
|
9
|
-
const heldNeutral = "disabled:border-border disabled:bg-muted disabled:text-muted-foreground aria-disabled:border-border aria-disabled:bg-muted aria-disabled:text-muted-foreground";
|
|
10
|
-
const heldDim = "disabled:opacity-50 aria-disabled:not-aria-busy:opacity-50";
|
|
11
|
-
const buttonClasses = cva("group/button inline-flex min-h-touch-target min-w-touch-target shrink-0 items-center justify-center rounded-sm border border-transparent bg-clip-padding text-button font-medium whitespace-nowrap transition-[background-color,border-color,color] duration-[var(--nc-duration-confirm)] ease-[var(--nc-ease-out-strong)] select-none disabled:pointer-events-none aria-disabled:pointer-events-none aria-invalid:border-destructive [@media(hover:hover)_and_(pointer:fine)]:min-h-0 [@media(hover:hover)_and_(pointer:fine)]:min-w-0 [&_svg]:pointer-events-none [&_svg]:shrink-0 [&_svg:not([class*='size-'])]:size-4", {
|
|
12
|
-
variants: {
|
|
13
|
-
variant: {
|
|
14
|
-
default: [
|
|
15
|
-
"bg-primary text-primary-foreground hover:bg-primary-hover active:bg-primary-hover aria-expanded:bg-primary-hover",
|
|
16
|
-
heldNeutral,
|
|
17
|
-
],
|
|
18
|
-
outline: [
|
|
19
|
-
"border-border bg-(--nc-field,var(--background)) text-foreground hover:bg-muted hover:text-foreground active:bg-muted aria-expanded:bg-muted aria-expanded:text-foreground",
|
|
20
|
-
heldNeutral,
|
|
21
|
-
],
|
|
22
|
-
secondary: [
|
|
23
|
-
"border-border bg-secondary text-secondary-foreground hover:bg-accent active:bg-accent aria-expanded:bg-accent aria-expanded:text-accent-foreground",
|
|
24
|
-
heldNeutral,
|
|
25
|
-
],
|
|
26
|
-
ghost: [
|
|
27
|
-
"hover:bg-muted hover:text-foreground active:bg-muted aria-expanded:bg-muted aria-expanded:text-foreground",
|
|
28
|
-
heldDim,
|
|
29
|
-
],
|
|
30
|
-
brandGhost: [
|
|
31
|
-
"text-nc-identity-white hover:bg-nc-identity-white/10 hover:text-nc-identity-white aria-expanded:bg-nc-identity-white/10 aria-expanded:text-nc-identity-white",
|
|
32
|
-
heldDim,
|
|
33
|
-
],
|
|
34
|
-
brandSolid: [
|
|
35
|
-
"bg-nc-identity-white text-nc-identity-ink hover:bg-nc-identity-white/90 hover:text-nc-identity-ink active:bg-nc-identity-white/90 active:text-nc-identity-ink",
|
|
36
|
-
heldDim,
|
|
37
|
-
],
|
|
38
|
-
destructive: [
|
|
39
|
-
"bg-destructive text-destructive-foreground hover:brightness-90 active:brightness-90",
|
|
40
|
-
heldNeutral,
|
|
41
|
-
],
|
|
42
|
-
warning: [
|
|
43
|
-
"bg-warning text-warning-foreground hover:brightness-90 active:brightness-90",
|
|
44
|
-
heldNeutral,
|
|
45
|
-
],
|
|
46
|
-
link: ["text-(--nc-link) underline-offset-4 hover:underline", heldDim],
|
|
47
|
-
},
|
|
48
|
-
size: {
|
|
49
|
-
default: "h-control-height gap-0.75 px-button-padding-inline [@media(hover:hover)_and_(pointer:fine)]:min-h-control-height [&_[data-icon]_svg:not([class*='size-'])]:size-3.5",
|
|
50
|
-
xs: "h-nadicode-control-height-xs gap-1 px-2 text-button-xs in-data-[slot=button-group]:rounded-sm has-data-[icon=inline-end]:pr-1.5 has-data-[icon=inline-start]:pl-1.5 [&_svg:not([class*='size-'])]:size-3",
|
|
51
|
-
sm: "h-nadicode-control-height-sm gap-0.75 px-button-padding-inline-sm in-data-[slot=button-group]:rounded-sm [&_svg:not([class*='size-'])]:size-3.5",
|
|
52
|
-
lg: "h-nadicode-control-height-lg gap-0.75 rounded-md px-button-padding-inline-lg text-button-lg",
|
|
53
|
-
icon: "size-control-height",
|
|
54
|
-
"icon-xs": "size-nadicode-control-height-xs rounded-xs-plus in-data-[slot=button-group]:rounded-sm",
|
|
55
|
-
"icon-sm": "size-nadicode-control-height-sm in-data-[slot=button-group]:rounded-sm",
|
|
56
|
-
"icon-lg": "size-nadicode-control-height-lg rounded-md",
|
|
57
|
-
},
|
|
58
|
-
shape: {
|
|
59
|
-
square: "",
|
|
60
|
-
rounded: "rounded-full px-3",
|
|
61
|
-
circle: "rounded-full",
|
|
62
|
-
},
|
|
63
|
-
},
|
|
64
|
-
defaultVariants: {
|
|
65
|
-
variant: "default",
|
|
66
|
-
size: "default",
|
|
67
|
-
shape: "square",
|
|
68
|
-
},
|
|
69
|
-
});
|
|
70
|
-
/**
|
|
71
|
-
* The button classes for an element that is not a `Button`, such as a calendar's
|
|
72
|
-
* day arrows. They pass through `cn` as `Button`'s do, so a variant's border,
|
|
73
|
-
* fill or text replaces the base one instead of losing to it in the stylesheet:
|
|
74
|
-
* unmerged, the base `border-transparent` hides every outline edge. A link
|
|
75
|
-
* drawn as a button is a `ButtonLink`.
|
|
76
|
-
*/
|
|
77
|
-
function buttonVariants(props) {
|
|
78
|
-
return cn(buttonClasses(props));
|
|
79
|
-
}
|
|
80
9
|
function isIconSize(size) {
|
|
81
10
|
return size.startsWith("icon");
|
|
82
11
|
}
|
|
@@ -103,8 +32,7 @@ function ButtonContent({ children, loading, loadingLabel, prefix, size, suffix,
|
|
|
103
32
|
* Ours: one `default` per surface, the thing this page or dialog is for.
|
|
104
33
|
* @instead "Switch to a `Menu` or `Split Button` when more than one related action shares a row." (https://vercel.com/geist/button)
|
|
105
34
|
* Ours: a link inside a sentence is `TextLink`. A record's secondary commands go in `ActionMenu`. Appending to a list is a
|
|
106
|
-
* `LoadMoreButton`. An on/off value is a `Switch`.
|
|
107
|
-
* `ButtonLink` takes `buttonVariants`.
|
|
35
|
+
* `LoadMoreButton`. An on/off value is a `Switch`.
|
|
108
36
|
* @behaviour "Default `Button` is primary." (https://vercel.com/geist/button)
|
|
109
37
|
* "Pass `type="secondary"` for the supporting action and `type="error"` for destructive confirmations." (https://vercel.com/geist/button)
|
|
110
38
|
* "`primary`, `success`, `ghost`, and `violet` are not valid `type` values." (https://vercel.com/geist/button)
|
|
@@ -117,6 +45,8 @@ function ButtonContent({ children, loading, loadingLabel, prefix, size, suffix,
|
|
|
117
45
|
* "The default size is medium." (https://vercel.com/geist/button)
|
|
118
46
|
* Ours: `xs` (24 px), `sm` (32 px), `default` (36 px, medium) and `lg` (40 px); `sm` and `xs` are
|
|
119
47
|
* for a control nested in dense content, such as a composer or an input group, never for chrome.
|
|
48
|
+
* `inline` is a `link` command standing in a line of text (*Change*, *Switch account*): no padding
|
|
49
|
+
* of its own, and on a mouse it keeps the control's minimum height so it is as easy to hit.
|
|
120
50
|
* The corner is 6 px, 8 px at `lg` and 4 px on the 24 px icon button. The label is the button type
|
|
121
51
|
* at `sm` and `default`, the large one at `lg` and the 12 px one at `xs`, and the inline padding is
|
|
122
52
|
* 6 px at `sm`, 10 px at `default` and 14 px at `lg` (8 px at `xs`).
|
|
@@ -163,7 +93,7 @@ function ButtonContent({ children, loading, loadingLabel, prefix, size, suffix,
|
|
|
163
93
|
*/
|
|
164
94
|
function Button({ children, className, disabled, focusableWhenDisabled, loading, loadingLabel, prefix, shape = "square", size = "default", suffix, variant = "default", ...props }) {
|
|
165
95
|
const busy = loading === true;
|
|
166
|
-
return (_jsx(ButtonPrimitive, { "data-slot": "button", "data-nc-ui": "", "data-size": size, "data-variant": variant, "aria-busy": busy || undefined, className: buttonVariants({ variant, size, shape, className }), disabled: disabled || busy, focusableWhenDisabled: focusableWhenDisabled || busy, ...props, children: _jsx(ButtonContent, { loading: loading, loadingLabel: loadingLabel, prefix: prefix, size: size, suffix: suffix, children: children }) }));
|
|
96
|
+
return (_jsx(ButtonPrimitive, { "data-slot": "button", "data-nc-ui": "", "data-size": size, "data-variant": variant, "aria-busy": busy || undefined, className: buttonVariants({ variant, size, shape, className }), disabled: disabled === true || busy, focusableWhenDisabled: focusableWhenDisabled === true || busy, ...props, children: _jsx(ButtonContent, { loading: loading, loadingLabel: loadingLabel, prefix: prefix, size: size, suffix: suffix, children: children }) }));
|
|
167
97
|
}
|
|
168
98
|
function refuseClick(event) {
|
|
169
99
|
event.preventDefault();
|
|
@@ -200,4 +130,4 @@ function ButtonLink({ children, className, disabled, loading, loadingLabel, onCl
|
|
|
200
130
|
}, props),
|
|
201
131
|
});
|
|
202
132
|
}
|
|
203
|
-
export { Button, ButtonLink
|
|
133
|
+
export { Button, ButtonLink };
|
|
@@ -1,6 +1,6 @@
|
|
|
1
1
|
import * as React from "react";
|
|
2
2
|
import { type DayButton, type Locale, type PropsBase, type PropsRange, type PropsSingle } from "react-day-picker";
|
|
3
|
-
import { buttonVariants } from "
|
|
3
|
+
import { buttonVariants } from "../internal/button-classes.js";
|
|
4
4
|
type Controlled<Props extends PropsSingle | PropsRange> = Omit<Props, "onSelect" | "selected"> & {
|
|
5
5
|
/** The chosen day or range, `undefined` before the first choice. */
|
|
6
6
|
selected: Props["selected"];
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"calendar.d.ts","sourceRoot":"","sources":["../../src/components/calendar.tsx"],"names":[],"mappings":"AAEA,OAAO,KAAK,KAAK,MAAM,OAAO,CAAC;AAC/B,OAAO,EAKL,KAAK,SAAS,EACd,KAAK,MAAM,EAEX,KAAK,SAAS,EACd,KAAK,UAAU,EACf,KAAK,WAAW,EACjB,MAAM,kBAAkB,CAAC;AAG1B,OAAO,EAAE,cAAc,EAAE,MAAM,
|
|
1
|
+
{"version":3,"file":"calendar.d.ts","sourceRoot":"","sources":["../../src/components/calendar.tsx"],"names":[],"mappings":"AAEA,OAAO,KAAK,KAAK,MAAM,OAAO,CAAC;AAC/B,OAAO,EAKL,KAAK,SAAS,EACd,KAAK,MAAM,EAEX,KAAK,SAAS,EACd,KAAK,UAAU,EACf,KAAK,WAAW,EACjB,MAAM,kBAAkB,CAAC;AAG1B,OAAO,EAAE,cAAc,EAAE,MAAM,2BAA2B,CAAC;AAG3D,KAAK,UAAU,CAAC,KAAK,SAAS,WAAW,GAAG,UAAU,IAAI,IAAI,CAAC,KAAK,EAAE,UAAU,GAAG,UAAU,CAAC,GAAG;IAC/F,oEAAoE;IACpE,QAAQ,EAAE,KAAK,CAAC,UAAU,CAAC,CAAC;IAC5B,kCAAkC;IAClC,QAAQ,EAAE,WAAW,CAAC,KAAK,CAAC,UAAU,CAAC,CAAC,CAAC;CAC1C,CAAC;AAEF,KAAK,aAAa,GAAG,SAAS,GAC5B,CAAC,UAAU,CAAC,WAAW,CAAC,GAAG,UAAU,CAAC,UAAU,CAAC,CAAC,GAAG;IACnD,aAAa,CAAC,EAAE,WAAW,CAAC,UAAU,CAAC,OAAO,cAAc,CAAC,CAAC,CAAC,CAAC,CAAC,CAAC,SAAS,CAAC,CAAC;IAC7E,wCAAwC;IACxC,QAAQ,CAAC,EAAE,IAAI,GAAG,SAAS,CAAC;IAC5B,uCAAuC;IACvC,QAAQ,CAAC,EAAE,IAAI,GAAG,SAAS,CAAC;CAC7B,CAAC;AAEJ;;;;;;;;;;;;;;GAcG;AACH,iBAAS,QAAQ,CAAC,EAChB,SAAS,EACT,UAAU,EACV,eAAsB,EACtB,aAAuB,EACvB,aAAuB,EACvB,MAAM,EACN,UAAU,EACV,UAAU,EACV,QAAQ,EACR,QAAQ,EACR,QAAQ,EACR,GAAG,KAAK,EACT,EAAE,aAAa,qBA4Gf;AA4CD,iBAAS,iBAAiB,CAAC,EACzB,SAAS,EACT,GAAG,EACH,SAAS,EACT,MAAM,EACN,GAAG,KAAK,EACT,EAAE,KAAK,CAAC,cAAc,CAAC,OAAO,SAAS,CAAC,GAAG;IAAE,MAAM,CAAC,EAAE,OAAO,CAAC,MAAM,CAAC,CAAA;CAAE,qBAkCvE;AAED,OAAO,EAAE,QAAQ,EAAE,iBAAiB,EAAE,CAAC"}
|
|
@@ -3,7 +3,7 @@ import { jsx as _jsx } from "react/jsx-runtime";
|
|
|
3
3
|
import * as React from "react";
|
|
4
4
|
import { DayPicker, getDefaultClassNames, useDayPicker, } from "react-day-picker";
|
|
5
5
|
import { cn } from "../lib/utils.js";
|
|
6
|
-
import { buttonVariants } from "
|
|
6
|
+
import { buttonVariants } from "../internal/button-classes.js";
|
|
7
7
|
import { ChevronLeftIcon, ChevronRightIcon, ChevronDownIcon } from "lucide-react";
|
|
8
8
|
/**
|
|
9
9
|
* A month grid for choosing a day or a range of days.
|
|
@@ -53,9 +53,9 @@ function Calendar({ className, classNames, showOutsideDays = true, captionLayout
|
|
|
53
53
|
day: cn("group/day relative flex h-(--cell-size) flex-1 items-center justify-center p-0 text-center select-none [&:last-child[data-selected=true]]:rounded-r-(--cell-radius)", props.showWeekNumber
|
|
54
54
|
? "[&:nth-child(2)[data-selected=true]]:rounded-l-(--cell-radius)"
|
|
55
55
|
: "[&:first-child[data-selected=true]]:rounded-l-(--cell-radius)", defaultClassNames.day),
|
|
56
|
-
range_start: cn("relative isolate z-0 after:absolute after:inset-y-0 after:
|
|
56
|
+
range_start: cn("relative isolate z-0 after:absolute after:inset-y-0 after:inset-s-1/2 after:inset-e-0 after:bg-muted", defaultClassNames.range_start),
|
|
57
57
|
range_middle: cn("rounded-none bg-muted", defaultClassNames.range_middle),
|
|
58
|
-
range_end: cn("relative isolate z-0 before:absolute before:inset-y-0 before:
|
|
58
|
+
range_end: cn("relative isolate z-0 before:absolute before:inset-y-0 before:inset-s-0 before:inset-e-1/2 before:bg-muted", defaultClassNames.range_end),
|
|
59
59
|
outside: cn("text-muted-foreground aria-selected:text-muted-foreground", defaultClassNames.outside),
|
|
60
60
|
disabled: cn("text-muted-foreground opacity-50", defaultClassNames.disabled),
|
|
61
61
|
hidden: cn("invisible", defaultClassNames.hidden),
|
|
@@ -72,7 +72,7 @@ function CardRow({ className, columns = 2, from = "md", render, ...props }) {
|
|
|
72
72
|
return useRender({
|
|
73
73
|
defaultTagName: "div",
|
|
74
74
|
props: mergeProps({
|
|
75
|
-
className: cn("grid grid-cols-1 items-stretch gap-4
|
|
75
|
+
className: cn("grid grid-cols-1 items-stretch gap-4 *:data-[slot=card]:h-full [&>li]:flex [&>li>[data-slot=card]]:size-full ", columnClasses[from][columns], className),
|
|
76
76
|
}, props),
|
|
77
77
|
render,
|
|
78
78
|
state: { columns: String(columns), from, slot: "card-row" },
|
|
@@ -2,6 +2,7 @@ import * as React from "react";
|
|
|
2
2
|
import { useRender } from "@base-ui/react/use-render";
|
|
3
3
|
type CardSurface = "plain" | "resting" | "raised" | "outlined";
|
|
4
4
|
type CardVariant = "default" | "interactive" | "link";
|
|
5
|
+
type CardFlush = "bottom" | "all";
|
|
5
6
|
/**
|
|
6
7
|
* The surface of every card; on its own only a container inside a composition.
|
|
7
8
|
*
|
|
@@ -9,10 +10,12 @@ type CardVariant = "default" | "interactive" | "link";
|
|
|
9
10
|
* @when "For in-product cards and dashboard tiles, use `Card`; Book is too decorative for repeated UI rows." (https://vercel.com/geist/book) Ours: only inside a composition that owns the job: the object card of an `ObjectPage`, the setting card of a `SettingsSection`, a KPI, a chart, a table. A new kind of card is a new composition, never a `Card` assembled at a call site.
|
|
10
11
|
* @instead "Groups related form controls inside a bordered card with optional footer actions." (https://vercel.com/geist/fieldset) Ours: that card, a title and description, one control and a footer with help at the start and one action at the end, is `SettingsSection`. An object's card (a header bar with its name and commands, a body of facts, rows that open, a footer hint with one link elsewhere) is `ObjectPage`. The page's title row is never in a card. A row of a list is `Item`. A plane of brand colour is `BrandField`.
|
|
11
12
|
* @behaviour "One Note per concept." (https://vercel.com/geist/note) "Stacking three Notes on a card means the page architecture, not the Note copy, is wrong." (https://vercel.com/geist/note) "Use the Error component as a block surface when a section or page-level resource failed to load: a panel, a dashboard card, a route boundary." (https://vercel.com/geist/error) Ours: the corner and shadow come with `surface`: a raised card takes the larger corner. Never set a corner at the call site. `surface` defaults to `resting`, the resting height of "Elevation & Depth" in DESIGN.md. `CardHeader` lays out title, description and one `CardAction`. An action of one control (a button, a badge, a sparkline, the three dots) stands at the title's right, as Vercel keeps a card's Add on its title row on a phone; on a card narrower than 28rem the description runs under both, and the control moves under the title only when the title's longest word would not fit beside it, so it never covers it. An action of several controls moves under the description in a header narrower than 28rem (the header's own width, not the viewport's); `CardFooter` is a strip in the `recessed` role, one tone off the card body inside the card's edge, behind one seam in the border colour: `canvas-soft` below the white card in light, and `dark-canvas` below the resting body in dark; on the left one short muted line, only where it says something specific to that card (a limit such as *Please use 32 characters at maximum.*, what a value is for, the plan a feature needs or a link to learn more) and never one sentence every card repeats, on the right at most one button or link, the section's action. It is 56 px high whether or not it holds a button, and as high as its lines in a `size="sm"` card, the compact card of a side column or a figure. The two kinds differ in what their header and footer hold: an object card's header holds the object's commands and its footer only a link, so it never saves; a setting card's header holds a title, a description and at most a switch that applies on change, and its footer holds the Save. A card is neutral; colour enters only through a status inside it or a section's `tone`.
|
|
13
|
+
* `flush="bottom"` ends the card at its last child, for rows whose hairlines run to its bottom edge, as a footer does; `flush="all"` lets the content meet every edge with no gap between children, for one picture or grid that fills the card.
|
|
12
14
|
* @words The title is a noun phrase naming what the card holds; the description one sentence directly under it, only when it adds something.
|
|
13
15
|
* @access A plain container; give it `render={<section />}` with a heading when it is a region of the page.
|
|
14
16
|
*/
|
|
15
|
-
declare function Card({ className, render, size, surface, variant, ...props }: useRender.ComponentProps<"div"> & {
|
|
17
|
+
declare function Card({ className, flush, render, size, surface, variant, ...props }: useRender.ComponentProps<"div"> & {
|
|
18
|
+
flush?: CardFlush;
|
|
16
19
|
size?: "default" | "sm";
|
|
17
20
|
surface?: CardSurface;
|
|
18
21
|
variant?: CardVariant;
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"card.d.ts","sourceRoot":"","sources":["../../src/components/card.tsx"],"names":[],"mappings":"AAAA,OAAO,KAAK,KAAK,MAAM,OAAO,CAAC;AAE/B,OAAO,EAAE,SAAS,EAAE,MAAM,2BAA2B,CAAC;AAItD,KAAK,WAAW,GAAG,OAAO,GAAG,SAAS,GAAG,QAAQ,GAAG,UAAU,CAAC;AAC/D,KAAK,WAAW,GAAG,SAAS,GAAG,aAAa,GAAG,MAAM,CAAC;
|
|
1
|
+
{"version":3,"file":"card.d.ts","sourceRoot":"","sources":["../../src/components/card.tsx"],"names":[],"mappings":"AAAA,OAAO,KAAK,KAAK,MAAM,OAAO,CAAC;AAE/B,OAAO,EAAE,SAAS,EAAE,MAAM,2BAA2B,CAAC;AAItD,KAAK,WAAW,GAAG,OAAO,GAAG,SAAS,GAAG,QAAQ,GAAG,UAAU,CAAC;AAC/D,KAAK,WAAW,GAAG,SAAS,GAAG,aAAa,GAAG,MAAM,CAAC;AACtD,KAAK,SAAS,GAAG,QAAQ,GAAG,KAAK,CAAC;AAElC;;;;;;;;;;GAUG;AACH,iBAAS,IAAI,CAAC,EACZ,SAAS,EACT,KAAK,EACL,MAAM,EACN,IAAgB,EAChB,OAAmB,EACnB,OAAmB,EACnB,GAAG,KAAK,EACT,EAAE,SAAS,CAAC,cAAc,CAAC,KAAK,CAAC,GAAG;IACnC,KAAK,CAAC,EAAE,SAAS,CAAC;IAClB,IAAI,CAAC,EAAE,SAAS,GAAG,IAAI,CAAC;IACxB,OAAO,CAAC,EAAE,WAAW,CAAC;IACtB,OAAO,CAAC,EAAE,WAAW,CAAC;CACvB,0EA0BA;AAED,iBAAS,UAAU,CAAC,EAClB,SAAS,EACT,YAAY,EACZ,GAAG,KAAK,EACT,EAAE,KAAK,CAAC,cAAc,CAAC,KAAK,CAAC,GAAG;IAC/B;;;;;OAKG;IACH,YAAY,CAAC,EAAE,WAAW,GAAG,KAAK,CAAC;CACpC,qBAgBA;AAED,iBAAS,SAAS,CAAC,EACjB,SAAS,EACT,WAAmB,EACnB,GAAG,KAAK,EACT,EAAE,KAAK,CAAC,cAAc,CAAC,KAAK,CAAC,GAAG;IAAE,WAAW,CAAC,EAAE,OAAO,CAAA;CAAE,qBAazD;AAED,iBAAS,eAAe,CAAC,EAAE,SAAS,EAAE,GAAG,KAAK,EAAE,EAAE,KAAK,CAAC,cAAc,CAAC,KAAK,CAAC,qBAQ5E;AAED,iBAAS,UAAU,CAAC,EAAE,SAAS,EAAE,GAAG,KAAK,EAAE,EAAE,KAAK,CAAC,cAAc,CAAC,KAAK,CAAC,qBAQvE;AAED,iBAAS,WAAW,CAAC,EAAE,SAAS,EAAE,GAAG,KAAK,EAAE,EAAE,KAAK,CAAC,cAAc,CAAC,KAAK,CAAC,qBAIxE;AAED,iBAAS,UAAU,CAAC,EAAE,SAAS,EAAE,GAAG,KAAK,EAAE,EAAE,KAAK,CAAC,cAAc,CAAC,KAAK,CAAC,qBAWvE;AAED,OAAO,EACL,IAAI,EACJ,UAAU,EACV,UAAU,EACV,SAAS,EACT,UAAU,EACV,eAAe,EACf,WAAW,EACX,KAAK,WAAW,EAChB,KAAK,WAAW,GACjB,CAAC"}
|
package/dist/components/card.js
CHANGED
|
@@ -9,11 +9,12 @@ import { cn } from "../lib/utils.js";
|
|
|
9
9
|
* @when "For in-product cards and dashboard tiles, use `Card`; Book is too decorative for repeated UI rows." (https://vercel.com/geist/book) Ours: only inside a composition that owns the job: the object card of an `ObjectPage`, the setting card of a `SettingsSection`, a KPI, a chart, a table. A new kind of card is a new composition, never a `Card` assembled at a call site.
|
|
10
10
|
* @instead "Groups related form controls inside a bordered card with optional footer actions." (https://vercel.com/geist/fieldset) Ours: that card, a title and description, one control and a footer with help at the start and one action at the end, is `SettingsSection`. An object's card (a header bar with its name and commands, a body of facts, rows that open, a footer hint with one link elsewhere) is `ObjectPage`. The page's title row is never in a card. A row of a list is `Item`. A plane of brand colour is `BrandField`.
|
|
11
11
|
* @behaviour "One Note per concept." (https://vercel.com/geist/note) "Stacking three Notes on a card means the page architecture, not the Note copy, is wrong." (https://vercel.com/geist/note) "Use the Error component as a block surface when a section or page-level resource failed to load: a panel, a dashboard card, a route boundary." (https://vercel.com/geist/error) Ours: the corner and shadow come with `surface`: a raised card takes the larger corner. Never set a corner at the call site. `surface` defaults to `resting`, the resting height of "Elevation & Depth" in DESIGN.md. `CardHeader` lays out title, description and one `CardAction`. An action of one control (a button, a badge, a sparkline, the three dots) stands at the title's right, as Vercel keeps a card's Add on its title row on a phone; on a card narrower than 28rem the description runs under both, and the control moves under the title only when the title's longest word would not fit beside it, so it never covers it. An action of several controls moves under the description in a header narrower than 28rem (the header's own width, not the viewport's); `CardFooter` is a strip in the `recessed` role, one tone off the card body inside the card's edge, behind one seam in the border colour: `canvas-soft` below the white card in light, and `dark-canvas` below the resting body in dark; on the left one short muted line, only where it says something specific to that card (a limit such as *Please use 32 characters at maximum.*, what a value is for, the plan a feature needs or a link to learn more) and never one sentence every card repeats, on the right at most one button or link, the section's action. It is 56 px high whether or not it holds a button, and as high as its lines in a `size="sm"` card, the compact card of a side column or a figure. The two kinds differ in what their header and footer hold: an object card's header holds the object's commands and its footer only a link, so it never saves; a setting card's header holds a title, a description and at most a switch that applies on change, and its footer holds the Save. A card is neutral; colour enters only through a status inside it or a section's `tone`.
|
|
12
|
+
* `flush="bottom"` ends the card at its last child, for rows whose hairlines run to its bottom edge, as a footer does; `flush="all"` lets the content meet every edge with no gap between children, for one picture or grid that fills the card.
|
|
12
13
|
* @words The title is a noun phrase naming what the card holds; the description one sentence directly under it, only when it adds something.
|
|
13
14
|
* @access A plain container; give it `render={<section />}` with a heading when it is a region of the page.
|
|
14
15
|
*/
|
|
15
|
-
function Card({ className, render, size = "default", surface = "resting", variant = "default", ...props }) {
|
|
16
|
-
const structure = cn("group/card flex flex-col gap-(--card-spacing) overflow-hidden bg-card py-(--card-spacing) text-sm text-card-foreground [--card-spacing:var(--spacing-nadicode-card-padding)] has-data-[slot=card-footer]:pb-0 has-[>img:first-child]:pt-0 data-[size=sm]:[--card-spacing:var(--spacing-nadicode-md)] data-[size=sm]:has-data-[slot=card-footer]:pb-0", variant === "interactive" && "cursor-pointer", variant === "link" && "nc-transition-paint");
|
|
16
|
+
function Card({ className, flush, render, size = "default", surface = "resting", variant = "default", ...props }) {
|
|
17
|
+
const structure = cn("group/card flex flex-col gap-(--card-spacing) overflow-hidden bg-card py-(--card-spacing) text-sm text-card-foreground [--card-spacing:var(--spacing-nadicode-card-padding)] has-data-[slot=card-footer]:pb-0 has-[>img:first-child]:pt-0 data-[size=sm]:[--card-spacing:var(--spacing-nadicode-md)] data-[size=sm]:has-data-[slot=card-footer]:pb-0", flush === "bottom" && "pb-0", flush === "all" && "gap-0 py-0", variant === "interactive" && "cursor-pointer", variant === "link" && "nc-transition-paint");
|
|
17
18
|
const corner = surface === "raised" ? "rounded-lg" : "rounded-sm";
|
|
18
19
|
const surfaceClassName = surface === "outlined"
|
|
19
20
|
? cn(structure, corner, "border border-border", className)
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"catalog-drawer.d.ts","sourceRoot":"","sources":["../../src/components/catalog-drawer.tsx"],"names":[],"mappings":"AAGA,OAAO,KAAK,EAAE,cAAc,EAAE,MAAM,4BAA4B,CAAC;AACjE,OAAO,EAAoB,KAAK,qBAAqB,EAAE,MAAM,gCAAgC,CAAC;AAC9F,OAAO,EAAc,KAAK,cAAc,EAAE,MAAM,0BAA0B,CAAC;AAC3E,OAAO,
|
|
1
|
+
{"version":3,"file":"catalog-drawer.d.ts","sourceRoot":"","sources":["../../src/components/catalog-drawer.tsx"],"names":[],"mappings":"AAGA,OAAO,KAAK,EAAE,cAAc,EAAE,MAAM,4BAA4B,CAAC;AACjE,OAAO,EAAoB,KAAK,qBAAqB,EAAE,MAAM,gCAAgC,CAAC;AAC9F,OAAO,EAAc,KAAK,cAAc,EAAE,MAAM,0BAA0B,CAAC;AAC3E,OAAO,EAAoC,KAAK,gBAAgB,EAAE,MAAM,0BAA0B,CAAC;AAKnG,MAAM,MAAM,kBAAkB,GAAG,IAAI,CAAC,gBAAgB,EAAE,UAAU,GAAG,SAAS,CAAC,GAAG;IAChF,MAAM,EAAE,qBAAqB,CAAC;IAC9B,6DAA6D;IAC7D,QAAQ,EAAE,SAAS,cAAc,EAAE,GAAG,SAAS,CAAC;IAChD,YAAY,EAAE,MAAM,CAAC;IACrB,MAAM,CAAC,EAAE,cAAc,CAAC,QAAQ,CAAC,CAAC;IAClC,0CAA0C;IAC1C,KAAK,EAAE,cAAc,CAAC,YAAY,CAAC,CAAC;IACpC,qGAAqG;IACrG,OAAO,CAAC,EAAE,IAAI,CAAC,cAAc,CAAC,WAAW,CAAC,EAAE,MAAM,CAAC,CAAC;IACpD,gEAAgE;IAChE,IAAI,EAAE,MAAM,CAAC;CACd,CAAC;AAEF;;;;;;;;;GASG;AACH,wBAAgB,aAAa,CAAC,EAC5B,MAAM,EACN,QAAQ,EACR,YAAY,EACZ,MAAM,EACN,KAAK,EACL,OAAO,EACP,IAAI,EACJ,GAAG,OAAO,EACX,EAAE,kBAAkB,+BAoBpB"}
|
|
@@ -3,8 +3,9 @@ import { jsx as _jsx, jsxs as _jsxs } from "react/jsx-runtime";
|
|
|
3
3
|
import { Button } from "./button.js";
|
|
4
4
|
import { CollectionSearch } from "./collection-search.js";
|
|
5
5
|
import { EmptyState } from "./empty-state.js";
|
|
6
|
-
import {
|
|
6
|
+
import { FormDrawerBody, FormDrawerFooter } from "./form-drawer.js";
|
|
7
7
|
import { SheetClose } from "./sheet.js";
|
|
8
|
+
import { FormDrawerFrame } from "../internal/form-drawer-frame.js";
|
|
8
9
|
import { CatalogList, CatalogSkeleton, catalogIsEmpty } from "../internal/catalog-list.js";
|
|
9
10
|
/**
|
|
10
11
|
* A catalogue to choose from in the right-side sheet, each entry added from its own row.
|
|
@@ -17,7 +18,7 @@ import { CatalogList, CatalogSkeleton, catalogIsEmpty } from "../internal/catalo
|
|
|
17
18
|
* @access "Trap focus inside the sheet while it’s open and return focus to the trigger row on close so keyboard users keep their place in the list." (https://vercel.com/geist/sheet) "Provide a visible close button labeled `Close` (or an icon button with `aria-label="Close"`) since clicking outside doesn’t dismiss." (https://vercel.com/geist/sheet) Ours: a modal dialog named by its title; focus starts in the search. The loading entries are one status named by `loadingLabel`.
|
|
18
19
|
*/
|
|
19
20
|
export function CatalogDrawer({ search, sections, loadingLabel, failed, empty, noMatch, done, ...surface }) {
|
|
20
|
-
return (_jsxs(
|
|
21
|
+
return (_jsxs(FormDrawerFrame, { ...surface, job: "catalog", children: [_jsx("div", { className: "px-nadicode-lg", "data-slot": "catalog-drawer-search", children: _jsx(CollectionSearch, { ...search }) }), _jsx(FormDrawerBody, { className: "pb-nadicode-lg", children: _jsx(CatalogBody, { empty: empty, failed: failed, loadingLabel: loadingLabel, noMatch: search.value ? noMatch : undefined, sections: sections }) }), _jsx(FormDrawerFooter, { children: _jsx(SheetClose, { render: _jsx(Button, { type: "button" }), children: done }) })] }));
|
|
21
22
|
}
|
|
22
23
|
function CatalogBody({ sections, loadingLabel, failed, empty, noMatch, }) {
|
|
23
24
|
if (failed)
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"chart-axis.d.ts","sourceRoot":"","sources":["../../src/components/chart-axis.ts"],"names":[],"mappings":"AAAA;;;;;;;;;GASG;AAEH;;;;;;;;GAQG;AACH,QAAA,MAAM,kBAAkB;;;CAAoE,CAAC;AAE7F,6CAA6C;AAC7C,QAAA,MAAM,uBAAuB,IAAI,CAAC;AAKlC,iBAAS,QAAQ,CAAC,OAAO,EAAE,MAAM,GAAG,MAAM,CAMzC;AAED;;;;GAIG;AACH,iBAAS,WAAW,CAAC,GAAG,EAAE,MAAM,GAAG,MAAM,GAAG,SAAS,CAIpD;AAED;;;;;GAKG;AACH,iBAAS,aAAa,CAAC,GAAG,EAAE,MAAM,GAAG,SAAS,GAAG,MAAM,EAAE,GAAG,SAAS,CAOpE;AAED,KAAK,SAAS,GAAG,MAAM,CAAC,MAAM,EAAE,MAAM,GAAG,MAAM,CAAC,CAAC;AAEjD,0EAA0E;AAC1E,iBAAS,cAAc,CAAC,IAAI,EAAE,SAAS,SAAS,EAAE,EAAE,IAAI,EAAE,SAAS,MAAM,EAAE,GAAG,MAAM,GAAG,SAAS,
|
|
1
|
+
{"version":3,"file":"chart-axis.d.ts","sourceRoot":"","sources":["../../src/components/chart-axis.ts"],"names":[],"mappings":"AAAA;;;;;;;;;GASG;AAEH;;;;;;;;GAQG;AACH,QAAA,MAAM,kBAAkB;;;CAAoE,CAAC;AAE7F,6CAA6C;AAC7C,QAAA,MAAM,uBAAuB,IAAI,CAAC;AAKlC,iBAAS,QAAQ,CAAC,OAAO,EAAE,MAAM,GAAG,MAAM,CAMzC;AAED;;;;GAIG;AACH,iBAAS,WAAW,CAAC,GAAG,EAAE,MAAM,GAAG,MAAM,GAAG,SAAS,CAIpD;AAED;;;;;GAKG;AACH,iBAAS,aAAa,CAAC,GAAG,EAAE,MAAM,GAAG,SAAS,GAAG,MAAM,EAAE,GAAG,SAAS,CAOpE;AAED,KAAK,SAAS,GAAG,MAAM,CAAC,MAAM,EAAE,MAAM,GAAG,MAAM,CAAC,CAAC;AAEjD,0EAA0E;AAC1E,iBAAS,cAAc,CAAC,IAAI,EAAE,SAAS,SAAS,EAAE,EAAE,IAAI,EAAE,SAAS,MAAM,EAAE,GAAG,MAAM,GAAG,SAAS,CAW/F;AAED;;;;;GAKG;AACH,iBAAS,aAAa,CAAC,IAAI,EAAE,SAAS,SAAS,EAAE,EAAE,IAAI,EAAE,SAAS,MAAM,EAAE,GAAG,MAAM,GAAG,SAAS,CAW9F;AAED,OAAO,EACL,kBAAkB,EAClB,uBAAuB,EACvB,WAAW,EACX,aAAa,EACb,QAAQ,EACR,aAAa,EACb,cAAc,GACf,CAAC"}
|
|
@@ -61,7 +61,6 @@ function stackedAxisMax(data, keys) {
|
|
|
61
61
|
let total = 0;
|
|
62
62
|
for (const key of keys) {
|
|
63
63
|
const value = datum[key];
|
|
64
|
-
// oxlint-disable-next-line anti-slop/no-runtime-typeof -- a chart datum is our own Record<string, number | string>; only typeof tells a value from a label.
|
|
65
64
|
if (typeof value === "number" && Number.isFinite(value))
|
|
66
65
|
total += value;
|
|
67
66
|
}
|
|
@@ -81,7 +80,6 @@ function seriesAxisMax(data, keys) {
|
|
|
81
80
|
for (const datum of data) {
|
|
82
81
|
for (const key of keys) {
|
|
83
82
|
const value = datum[key];
|
|
84
|
-
// oxlint-disable-next-line anti-slop/no-runtime-typeof -- a chart datum is our own Record<string, number | string>; only typeof tells a value from a label.
|
|
85
83
|
if (typeof value !== "number" || !Number.isFinite(value))
|
|
86
84
|
continue;
|
|
87
85
|
if (value < 0)
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"chart-bar-horizontal.d.ts","sourceRoot":"","sources":["../../src/components/chart-bar-horizontal.tsx"],"names":[],"mappings":"
|
|
1
|
+
{"version":3,"file":"chart-bar-horizontal.d.ts","sourceRoot":"","sources":["../../src/components/chart-bar-horizontal.tsx"],"names":[],"mappings":"AAyBA,OAAO,EAKL,KAAK,cAAc,EACpB,MAAM,yBAAyB,CAAC;AA8CjC,iBAAS,UAAU,CAAC,IAAI,EAAE,SAAS,MAAM,CAAC,MAAM,EAAE,MAAM,GAAG,MAAM,CAAC,EAAE,EAAE,QAAQ,EAAE,MAAM;;;EAoCrF;AAyCD;;;;;;;;;GASG;AACH,iBAAS,kBAAkB,CAAC,EAC1B,KAAK,EACL,MAAM,EACN,QAAQ,EACR,IAAI,EACJ,OAAO,EACP,KAAK,EACL,MAAM,EACN,YAAY,EACZ,IAAI,EACJ,IAAI,EACJ,QAAQ,EACR,UAAU,EACV,kBAAkB,EAClB,aAAa,EACb,aAAa,EACb,cAAsC,EACtC,aAAa,EACb,UAAU,EACV,IAAgB,EAChB,SAAS,GACV,EAAE,IAAI,CAAC,cAAc,EAAE,QAAQ,GAAG,gBAAgB,GAAG,YAAY,CAAC,GAAG;IACpE,QAAQ,EAAE,MAAM,CAAC;IACjB,UAAU,CAAC,EAAE,MAAM,CAAC;IACpB,kBAAkB,CAAC,EAAE,MAAM,CAAC;IAC5B,aAAa,EAAE,MAAM,CAAC;IACtB,aAAa,EAAE,MAAM,CAAC;CACvB,+BA+FA;AAED,OAAO,EAAE,kBAAkB,EAAE,UAAU,EAAE,CAAC"}
|
|
@@ -35,7 +35,6 @@ function categoryAxisWidth(data, xKey) {
|
|
|
35
35
|
function signedAxis(data, valueKey) {
|
|
36
36
|
const values = data.flatMap((datum) => {
|
|
37
37
|
const value = datum[valueKey];
|
|
38
|
-
// oxlint-disable-next-line anti-slop/no-runtime-typeof -- a chart datum is our own Record<string, number | string>; only typeof tells a value from a label.
|
|
39
38
|
return typeof value === "number" && Number.isFinite(value) ? [value] : [];
|
|
40
39
|
});
|
|
41
40
|
const minimum = Math.min(0, ...values);
|
|
@@ -61,6 +60,21 @@ function signedAxis(data, valueKey) {
|
|
|
61
60
|
const ticks = [...negativeTicks, 0, ...positiveTicks];
|
|
62
61
|
return { domain: [ticks[0] ?? minimum, ticks.at(-1) ?? maximum], ticks };
|
|
63
62
|
}
|
|
63
|
+
/** The preformatted string a row carries under `key`; the tooltip entry's payload is the row Recharts was given. */
|
|
64
|
+
function displayText(rows, entry, key) {
|
|
65
|
+
const text = key === undefined ? undefined : rows.find((row) => row === entry?.payload)?.[key];
|
|
66
|
+
return typeof text === "string" ? text : undefined;
|
|
67
|
+
}
|
|
68
|
+
function categoryLabelFormatter(rows, categoryDisplayKey) {
|
|
69
|
+
return (label, payload) => displayText(rows, payload?.[0], categoryDisplayKey) ?? label;
|
|
70
|
+
}
|
|
71
|
+
function valueRowFormatter(rows, displayKey, valueFormatter) {
|
|
72
|
+
return (value, _name, item) => {
|
|
73
|
+
if (Number(value) === 0)
|
|
74
|
+
return null;
|
|
75
|
+
return (_jsx("span", { className: "ml-auto font-mono font-medium text-foreground tabular-nums", children: displayText(rows, item, displayKey) ?? valueFormatter(Number(value)) }));
|
|
76
|
+
};
|
|
77
|
+
}
|
|
64
78
|
/**
|
|
65
79
|
* A signed comparison across entities: profit to the right, loss to the left of a zero line.
|
|
66
80
|
*
|
|
@@ -75,7 +89,6 @@ function ChartBarHorizontal({ title, period, controls, link, summary, aside, foo
|
|
|
75
89
|
const axis = signedAxis(data, valueKey);
|
|
76
90
|
const signedData = data.map((datum) => {
|
|
77
91
|
const value = datum[valueKey];
|
|
78
|
-
// oxlint-disable-next-line anti-slop/no-runtime-typeof -- a chart datum is our own Record<string, number | string>; only typeof tells a value from a label.
|
|
79
92
|
const numeric = typeof value === "number" && Number.isFinite(value) ? value : 0;
|
|
80
93
|
return {
|
|
81
94
|
...datum,
|
|
@@ -87,17 +100,6 @@ function ChartBarHorizontal({ title, period, controls, link, summary, aside, foo
|
|
|
87
100
|
[POSITIVE_KEY]: { label: positiveLabel, color: POSITIVE_BAR_COLOR },
|
|
88
101
|
[NEGATIVE_KEY]: { label: negativeLabel, color: NEGATIVE_BAR_COLOR },
|
|
89
102
|
};
|
|
90
|
-
return (_jsx(ChartCard, { title: title, period: period, controls: controls, ...(link ? { link } : {}), summary: summary, aside: aside, ...(footer ? { footer } : {}), ...(headingLevel ? { headingLevel } : {}), className: className, children: (titleId) => emptyState && data.length === 0 ? (emptyState) : (_jsx(ChartContainer, { config: chartConfig, className: chartPlotClassName(size), children: _jsxs(BarChart, { accessibilityLayer: true, "aria-labelledby": titleId, data: signedData, layout: "vertical", margin: { left: 8, right: 16 }, children: [_jsx(CartesianGrid, { horizontal: false, strokeDasharray: "3 3" }), _jsx(XAxis, { type: "number", domain: axis.domain, ticks: axis.ticks, tickLine: false, axisLine: false, tickMargin: 8, tickFormatter: (value) => (axisFormatter ?? valueFormatter)(Number(value)) }), _jsx(YAxis, { type: "category", dataKey: xKey, width: categoryAxisWidth(data, xKey), interval: 0, tick: CategoryTick, tickLine: false, axisLine: false, tickMargin: 8 }), _jsx(ReferenceLine, { x: 0, stroke: "var(--border)", strokeWidth: 1.5 }), _jsx(ChartTooltip, { cursor: false, content: _jsx(ChartTooltipContent, { indicator: "line", labelFormatter: (
|
|
91
|
-
const exact = categoryDisplayKey
|
|
92
|
-
? payload?.[0]?.payload?.[categoryDisplayKey]
|
|
93
|
-
: undefined;
|
|
94
|
-
// oxlint-disable-next-line anti-slop/no-runtime-typeof -- Recharts types the tooltip payload as any; the display key holds our preformatted string.
|
|
95
|
-
return typeof exact === "string" ? exact : _label;
|
|
96
|
-
}, formatter: (value, _name, item) => {
|
|
97
|
-
if (Number(value) === 0)
|
|
98
|
-
return null;
|
|
99
|
-
const exact = displayKey ? item.payload?.[displayKey] : undefined;
|
|
100
|
-
return (_jsx("span", { className: "ml-auto font-mono font-medium text-foreground tabular-nums", children: typeof exact === "string" ? exact : valueFormatter(Number(value)) }));
|
|
101
|
-
} }) }), _jsx(ChartLegend, { itemSorter: null, content: _jsx(ChartLegendContent, { className: CHART_LEGEND_CLASS }) }), _jsx(Bar, { dataKey: POSITIVE_KEY, stackId: "signed", fill: POSITIVE_BAR_COLOR, radius: [0, 4, 4, 0], maxBarSize: 32 }), _jsx(Bar, { dataKey: NEGATIVE_KEY, stackId: "signed", fill: NEGATIVE_BAR_COLOR, radius: [4, 0, 0, 4], maxBarSize: 32 })] }) })) }));
|
|
103
|
+
return (_jsx(ChartCard, { title: title, period: period, controls: controls, ...(link ? { link } : {}), summary: summary, aside: aside, ...(footer ? { footer } : {}), ...(headingLevel ? { headingLevel } : {}), className: className, children: (titleId) => emptyState && data.length === 0 ? (emptyState) : (_jsx(ChartContainer, { config: chartConfig, className: chartPlotClassName(size), children: _jsxs(BarChart, { accessibilityLayer: true, "aria-labelledby": titleId, data: signedData, layout: "vertical", margin: { left: 8, right: 16 }, children: [_jsx(CartesianGrid, { horizontal: false, strokeDasharray: "3 3" }), _jsx(XAxis, { type: "number", domain: axis.domain, ticks: axis.ticks, tickLine: false, axisLine: false, tickMargin: 8, tickFormatter: (value) => (axisFormatter ?? valueFormatter)(Number(value)) }), _jsx(YAxis, { type: "category", dataKey: xKey, width: categoryAxisWidth(data, xKey), interval: 0, tick: CategoryTick, tickLine: false, axisLine: false, tickMargin: 8 }), _jsx(ReferenceLine, { x: 0, stroke: "var(--border)", strokeWidth: 1.5 }), _jsx(ChartTooltip, { cursor: false, content: _jsx(ChartTooltipContent, { indicator: "line", labelFormatter: categoryLabelFormatter(signedData, categoryDisplayKey), formatter: valueRowFormatter(signedData, displayKey, valueFormatter) }) }), _jsx(ChartLegend, { itemSorter: null, content: _jsx(ChartLegendContent, { className: CHART_LEGEND_CLASS }) }), _jsx(Bar, { dataKey: POSITIVE_KEY, stackId: "signed", fill: POSITIVE_BAR_COLOR, radius: [0, 4, 4, 0], maxBarSize: 32 }), _jsx(Bar, { dataKey: NEGATIVE_KEY, stackId: "signed", fill: NEGATIVE_BAR_COLOR, radius: [4, 0, 0, 4], maxBarSize: 32 })] }) })) }));
|
|
102
104
|
}
|
|
103
105
|
export { ChartBarHorizontal, signedAxis };
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"chart-card.d.ts","sourceRoot":"","sources":["../../src/components/chart-card.tsx"],"names":[],"mappings":"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
|
|
1
|
+
{"version":3,"file":"chart-card.d.ts","sourceRoot":"","sources":["../../src/components/chart-card.tsx"],"names":[],"mappings":"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"}
|
|
@@ -46,7 +46,6 @@ function foldOtherSeries(series, data, entityColorMap, otherLabel) {
|
|
|
46
46
|
const foldedData = data.map((datum) => {
|
|
47
47
|
const otherSum = neutral.reduce((sum, entry) => {
|
|
48
48
|
const value = datum[entry.id];
|
|
49
|
-
// oxlint-disable-next-line anti-slop/no-runtime-typeof -- a chart datum is our own Record<string, number | string>; only typeof tells a value from a label.
|
|
50
49
|
return sum + (typeof value === "number" ? value : 0);
|
|
51
50
|
}, 0);
|
|
52
51
|
const next = Object.fromEntries(Object.entries(datum).filter(([key]) => !neutralIds.has(key)));
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"chart.d.ts","sourceRoot":"","sources":["../../src/components/chart.tsx"],"names":[],"mappings":"
|
|
1
|
+
{"version":3,"file":"chart.d.ts","sourceRoot":"","sources":["../../src/components/chart.tsx"],"names":[],"mappings":"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"}
|
package/dist/components/chart.js
CHANGED
|
@@ -1,8 +1,10 @@
|
|
|
1
|
+
/* oxlint-disable typescript/no-unsafe-assignment, typescript/no-unsafe-member-access, typescript/no-unsafe-argument, typescript/restrict-template-expressions, react/no-danger -- vendored shadcn registry item `chart`: Recharts types a tooltip or legend entry's payload and dataKey as any, and the stylesheet is the item's own sanitized <style> injection. */
|
|
1
2
|
"use client";
|
|
2
3
|
import { jsx as _jsx, jsxs as _jsxs, Fragment as _Fragment } from "react/jsx-runtime";
|
|
3
4
|
import * as React from "react";
|
|
4
5
|
import * as RechartsPrimitive from "recharts";
|
|
5
6
|
import { cn } from "../lib/utils.js";
|
|
7
|
+
import { cssVariables } from "../lib/css-variables.js";
|
|
6
8
|
// Format: { THEME_NAME: CSS_SELECTOR }
|
|
7
9
|
const THEMES = { light: "", dark: ".dark" };
|
|
8
10
|
const INITIAL_DIMENSION = { width: 320, height: 200 };
|
|
@@ -47,8 +49,9 @@ function useChart() {
|
|
|
47
49
|
function ChartContainer({ id, className, children, config, initialDimension = INITIAL_DIMENSION, ...props }) {
|
|
48
50
|
const uniqueId = React.useId();
|
|
49
51
|
const chartId = sanitizeChartToken(`chart-${id ?? uniqueId.replace(/:/g, "")}`);
|
|
50
|
-
|
|
51
|
-
|
|
52
|
+
const chartContext = React.useMemo(() => ({ config }), [config]);
|
|
53
|
+
return (_jsx(ChartContext.Provider, { value: chartContext, children: _jsxs("div", { "data-slot": "chart", "data-chart": chartId, className: cn(
|
|
54
|
+
// oxlint-disable-next-line nadicodeai/ui-raw-colour-literal -- the hexes here are MATCH KEYS for Recharts' hardcoded default strokes (#ccc grid and reference lines, #fff dot and sector outlines), remapped onto theme tokens. None of them is a colour this component emits.
|
|
52
55
|
"flex aspect-video justify-center text-xs [&_.recharts-cartesian-axis-tick-label_text]:fill-muted-foreground [&_.recharts-cartesian-grid_line[stroke='#ccc']]:stroke-border/50 [&_.recharts-curve.recharts-tooltip-cursor]:stroke-border [&_.recharts-dot[stroke='#fff']]:stroke-transparent [&_.recharts-layer]:outline-hidden [&_.recharts-polar-grid_[stroke='#ccc']]:stroke-border [&_.recharts-radial-bar-background-sector]:fill-muted [&_.recharts-rectangle.recharts-tooltip-cursor]:fill-muted [&_.recharts-reference-line_[stroke='#ccc']]:stroke-border [&_.recharts-sector]:outline-hidden [&_.recharts-sector[stroke='#fff']]:stroke-transparent [&_.recharts-surface]:outline-hidden", className), ...props, children: [_jsx(ChartStyle, { id: chartId, config: config }), _jsx(RechartsPrimitive.ResponsiveContainer, { initialDimension: initialDimension, children: children })] }) }));
|
|
53
56
|
}
|
|
54
57
|
const ChartStyle = ({ id, config }) => {
|
|
@@ -83,9 +86,7 @@ function ChartTooltipContent({ active, payload, className, indicator = "dot", hi
|
|
|
83
86
|
const [item] = payload;
|
|
84
87
|
const key = `${labelKey ?? item?.dataKey ?? item?.name ?? "value"}`;
|
|
85
88
|
const itemConfig = getPayloadConfigFromPayload(config, item, key);
|
|
86
|
-
const value =
|
|
87
|
-
// oxlint-disable-next-line anti-slop/no-runtime-typeof -- the tooltip label is a ReactNode; only a string can key the chart config.
|
|
88
|
-
!labelKey && typeof label === "string" ? (config[label]?.label ?? label) : itemConfig?.label;
|
|
89
|
+
const value = !labelKey && typeof label === "string" ? (config[label]?.label ?? label) : itemConfig?.label;
|
|
89
90
|
if (labelFormatter) {
|
|
90
91
|
return (_jsx("div", { className: cn("font-medium", labelClassName), children: labelFormatter(value, payload) }));
|
|
91
92
|
}
|
|
@@ -104,17 +105,12 @@ function ChartTooltipContent({ active, payload, className, indicator = "dot", hi
|
|
|
104
105
|
const key = `${nameKey ?? item.name ?? item.dataKey ?? "value"}`;
|
|
105
106
|
const itemConfig = getPayloadConfigFromPayload(config, item, key);
|
|
106
107
|
const indicatorColor = color ?? item.payload?.fill ?? item.color;
|
|
107
|
-
return (_jsx("div", { className: cn("flex w-full flex-wrap items-stretch gap-2 [&>svg]:
|
|
108
|
-
"
|
|
108
|
+
return (_jsx("div", { className: cn("flex w-full flex-wrap items-stretch gap-2 [&>svg]:size-2.5 [&>svg]:text-muted-foreground", indicator === "dot" && "items-center"), children: formatter && item?.value !== undefined && item.name ? (formatter(item.value, item.name, item, index, item.payload)) : (_jsxs(_Fragment, { children: [itemConfig?.icon ? (_jsx(itemConfig.icon, {})) : (!hideIndicator && (_jsx("div", { className: cn("shrink-0 rounded-xs border-(--indicator) bg-(--indicator)", {
|
|
109
|
+
"size-2.5 ": indicator === "dot",
|
|
109
110
|
"w-1": indicator === "line",
|
|
110
111
|
"w-0 border-[1.5px] border-dashed bg-transparent": indicator === "dashed",
|
|
111
112
|
"my-0.5": nestLabel && indicator === "dashed",
|
|
112
|
-
}),
|
|
113
|
-
// SAFETY: CSSProperties lists only standard properties; React sets each `--` custom property key here through style.setProperty.
|
|
114
|
-
style: {
|
|
115
|
-
"--color-bg": indicatorColor,
|
|
116
|
-
"--color-border": indicatorColor,
|
|
117
|
-
} }))), _jsxs("div", { className: cn("flex flex-1 justify-between gap-4 leading-none", nestLabel ? "items-end" : "items-center"), children: [_jsxs("div", { className: "grid gap-1.5", children: [nestLabel ? tooltipLabel : null, _jsx("span", { className: "text-muted-foreground", children: itemConfig?.label ?? item.name })] }), item.value != null && (_jsx("span", { className: "font-mono font-medium text-foreground tabular-nums", children: typeof item.value === "number"
|
|
113
|
+
}), style: cssVariables({ "--indicator": indicatorColor }) }))), _jsxs("div", { className: cn("flex flex-1 justify-between gap-4 leading-none", nestLabel ? "items-end" : "items-center"), children: [_jsxs("div", { className: "grid gap-1.5", children: [nestLabel ? tooltipLabel : null, _jsx("span", { className: "text-muted-foreground", children: itemConfig?.label ?? item.name })] }), item.value !== null && item.value !== undefined && (_jsx("span", { className: "font-mono font-medium text-foreground tabular-nums", children: typeof item.value === "number"
|
|
118
114
|
? (valueFormatter?.(item.value) ?? item.value.toLocaleString())
|
|
119
115
|
: String(item.value) }))] })] })) }, index));
|
|
120
116
|
}) })] }));
|
|
@@ -130,35 +126,25 @@ function ChartLegendContent({ className, hideIcon = false, payload, nameKey, })
|
|
|
130
126
|
.map((item, index) => {
|
|
131
127
|
const key = `${nameKey ?? item.dataKey ?? "value"}`;
|
|
132
128
|
const itemConfig = getPayloadConfigFromPayload(config, item, key);
|
|
133
|
-
return (_jsxs("div", { className: cn("flex items-center gap-1.5 [&>svg]:
|
|
129
|
+
return (_jsxs("div", { className: cn("flex items-center gap-1.5 [&>svg]:size-3 [&>svg]:text-muted-foreground"), children: [itemConfig?.icon && !hideIcon ? (_jsx(itemConfig.icon, {})) : (_jsx("div", { className: "size-2 shrink-0 rounded-full", style: {
|
|
134
130
|
backgroundColor: item.color,
|
|
135
131
|
} })), itemConfig?.label] }, index));
|
|
136
132
|
}) }));
|
|
137
133
|
}
|
|
138
134
|
function getPayloadConfigFromPayload(config, payload, key) {
|
|
139
|
-
// oxlint-disable-next-line anti-slop/no-runtime-typeof -- a Recharts tooltip or legend entry carries its series datum untyped; packages/ui declares no schema library, so this check is its parser where it enters the chart.
|
|
140
135
|
if (typeof payload !== "object" || payload === null) {
|
|
141
136
|
return undefined;
|
|
142
137
|
}
|
|
143
|
-
const payloadPayload =
|
|
144
|
-
// oxlint-disable-next-line anti-slop/no-runtime-typeof -- a Recharts tooltip or legend entry carries its series datum untyped; packages/ui declares no schema library, so this check is its parser where it enters the chart.
|
|
145
|
-
"payload" in payload && typeof payload.payload === "object" && payload.payload !== null
|
|
138
|
+
const payloadPayload = "payload" in payload && typeof payload.payload === "object" && payload.payload !== null
|
|
146
139
|
? payload.payload
|
|
147
140
|
: undefined;
|
|
148
|
-
|
|
149
|
-
|
|
150
|
-
|
|
151
|
-
if (key in payload && typeof payload[key] === "string") {
|
|
152
|
-
// SAFETY: the typeof check in this branch's condition read a string at this key.
|
|
153
|
-
configLabelKey = payload[key];
|
|
154
|
-
}
|
|
155
|
-
else if (payloadPayload &&
|
|
156
|
-
key in payloadPayload &&
|
|
157
|
-
// oxlint-disable-next-line anti-slop/no-runtime-typeof -- a Recharts tooltip or legend entry carries its series datum untyped; packages/ui declares no schema library, so this check is its parser where it enters the chart.
|
|
158
|
-
typeof payloadPayload[key] === "string") {
|
|
159
|
-
// SAFETY: the typeof check in this branch's condition read a string at this key.
|
|
160
|
-
configLabelKey = payloadPayload[key];
|
|
161
|
-
}
|
|
141
|
+
const configLabelKey = stringAt(Object.entries(payload), key) ??
|
|
142
|
+
(payloadPayload ? stringAt(Object.entries(payloadPayload), key) : undefined) ??
|
|
143
|
+
key;
|
|
162
144
|
return configLabelKey in config ? config[configLabelKey] : config[key];
|
|
163
145
|
}
|
|
146
|
+
function stringAt(fields, key) {
|
|
147
|
+
const value = fields.find(([name]) => name === key)?.[1];
|
|
148
|
+
return typeof value === "string" ? value : undefined;
|
|
149
|
+
}
|
|
164
150
|
export { ChartContainer, ChartTooltip, ChartTooltipContent, ChartLegend, ChartLegendContent, ChartStyle, };
|
|
@@ -26,7 +26,8 @@ import { type ControlName } from "../internal/control-name.js";
|
|
|
26
26
|
* pair (ink and a white mark, the light action fill and a near-black mark in dark); an
|
|
27
27
|
* unchecked box shows the surface and greys on hover. Mixed is an unfilled box with a grey dash. A
|
|
28
28
|
* disabled box turns grey, an unchecked or mixed one with a lighter edge and a checked one mid
|
|
29
|
-
* grey, and ignores hover.
|
|
29
|
+
* grey, and ignores hover. `nativeButton` draws the box on a native `<button type="button">`,
|
|
30
|
+
* which the box owns.
|
|
30
31
|
* @words "Group label above a `<fieldset>` is a Title Case noun like `Notifications` or `Required
|
|
31
32
|
* Permissions`. No trailing colon." (https://vercel.com/geist/checkbox) "Acknowledgment label is a
|
|
32
33
|
* full sentence ending in a period: `I agree to the Terms of Service.`"
|
|
@@ -43,6 +44,6 @@ import { type ControlName } from "../internal/control-name.js";
|
|
|
43
44
|
* true, false or mixed. A row's box is named for its record: *Select pec@acme.it*. A set sits in a
|
|
44
45
|
* `FieldSet` with its legend.
|
|
45
46
|
*/
|
|
46
|
-
declare function Checkbox({ className, ...props }: CheckboxPrimitive.Root.Props & ControlName): import("react").JSX.Element;
|
|
47
|
+
declare function Checkbox({ className, nativeButton, ...props }: Omit<CheckboxPrimitive.Root.Props, "render"> & ControlName): import("react").JSX.Element;
|
|
47
48
|
export { Checkbox };
|
|
48
49
|
//# sourceMappingURL=checkbox.d.ts.map
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"checkbox.d.ts","sourceRoot":"","sources":["../../src/components/checkbox.tsx"],"names":[],"mappings":"AAEA,OAAO,EAAE,QAAQ,IAAI,iBAAiB,EAAE,MAAM,yBAAyB,CAAC;AAGxE,OAAO,EAAE,KAAK,WAAW,EAAE,MAAM,yBAAyB,CAAC;AAG3D
|
|
1
|
+
{"version":3,"file":"checkbox.d.ts","sourceRoot":"","sources":["../../src/components/checkbox.tsx"],"names":[],"mappings":"AAEA,OAAO,EAAE,QAAQ,IAAI,iBAAiB,EAAE,MAAM,yBAAyB,CAAC;AAGxE,OAAO,EAAE,KAAK,WAAW,EAAE,MAAM,yBAAyB,CAAC;AAG3D;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;GA2CG;AACH,iBAAS,QAAQ,CAAC,EAChB,SAAS,EACT,YAAY,EACZ,GAAG,KAAK,EACT,EAAE,IAAI,CAAC,iBAAiB,CAAC,IAAI,CAAC,KAAK,EAAE,QAAQ,CAAC,GAAG,WAAW,+BAuB5D;AAED,OAAO,EAAE,QAAQ,EAAE,CAAC"}
|
|
@@ -29,7 +29,8 @@ import { CheckIcon, MinusIcon } from "lucide-react";
|
|
|
29
29
|
* pair (ink and a white mark, the light action fill and a near-black mark in dark); an
|
|
30
30
|
* unchecked box shows the surface and greys on hover. Mixed is an unfilled box with a grey dash. A
|
|
31
31
|
* disabled box turns grey, an unchecked or mixed one with a lighter edge and a checked one mid
|
|
32
|
-
* grey, and ignores hover.
|
|
32
|
+
* grey, and ignores hover. `nativeButton` draws the box on a native `<button type="button">`,
|
|
33
|
+
* which the box owns.
|
|
33
34
|
* @words "Group label above a `<fieldset>` is a Title Case noun like `Notifications` or `Required
|
|
34
35
|
* Permissions`. No trailing colon." (https://vercel.com/geist/checkbox) "Acknowledgment label is a
|
|
35
36
|
* full sentence ending in a period: `I agree to the Terms of Service.`"
|
|
@@ -46,7 +47,7 @@ import { CheckIcon, MinusIcon } from "lucide-react";
|
|
|
46
47
|
* true, false or mixed. A row's box is named for its record: *Select pec@acme.it*. A set sits in a
|
|
47
48
|
* `FieldSet` with its legend.
|
|
48
49
|
*/
|
|
49
|
-
function Checkbox({ className, ...props }) {
|
|
50
|
-
return (_jsx(CheckboxPrimitive.Root, { "data-slot": "checkbox", "data-nc-ui": "", className: cn("peer relative flex size-4 shrink-0 items-center justify-center rounded-xs-plus border border-input nc-transition-paint after:absolute after:top-1/2 after:left-1/2 after:size-touch-target after:-translate-
|
|
50
|
+
function Checkbox({ className, nativeButton, ...props }) {
|
|
51
|
+
return (_jsx(CheckboxPrimitive.Root, { "data-slot": "checkbox", "data-nc-ui": "", className: cn("peer relative flex size-4 shrink-0 items-center justify-center rounded-xs-plus border border-input nc-transition-paint after:absolute after:top-1/2 after:left-1/2 after:size-touch-target after:-translate-1/2 data-checked:border-primary data-checked:bg-primary data-checked:text-primary-foreground data-disabled:cursor-not-allowed data-disabled:not-data-checked:border-border data-disabled:not-data-checked:bg-muted data-disabled:data-checked:border-transparent data-disabled:data-checked:bg-input/50 data-indeterminate:text-input data-unchecked:not-data-disabled:hover:bg-accent data-indeterminate:not-data-disabled:hover:bg-accent aria-invalid:border-destructive aria-invalid:aria-checked:border-primary [@media(hover:hover)_and_(pointer:fine)]:after:hidden", className), ...props, nativeButton: nativeButton, render: nativeButton ? _jsx("button", { type: "button" }) : undefined, children: _jsx(CheckboxPrimitive.Indicator, { "data-slot": "checkbox-indicator", "data-nc-ui": "", className: "grid place-content-center text-current transition-none [&>svg]:size-3.5", render: (indicatorProps, state) => (_jsx("span", { ...indicatorProps, children: state.indeterminate ? _jsx(MinusIcon, {}) : _jsx(CheckIcon, {}) })) }) }));
|
|
51
52
|
}
|
|
52
53
|
export { Checkbox };
|