@squadbase/vantage 0.6.2-stg.3a2ba98 → 0.7.0-dev1.1197de7
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/add-4GHF2TX2.js +6 -0
- package/dist/add-4GHF2TX2.js.map +1 -0
- package/dist/{build-O5TVNH4E.js → build-U7GO26HR.js} +9 -9
- package/dist/{build-O5TVNH4E.js.map → build-U7GO26HR.js.map} +1 -1
- package/dist/{check-WFBEDHDR.js → check-MRVAIHG5.js} +7 -7
- package/dist/{check-WFBEDHDR.js.map → check-MRVAIHG5.js.map} +1 -1
- package/dist/{chunk-QDZA5JSL.js → chunk-AABMKHEU.js} +4 -4
- package/dist/{chunk-QDZA5JSL.js.map → chunk-AABMKHEU.js.map} +1 -1
- package/dist/{chunk-PVTHHV7X.js → chunk-ANZLVSEP.js} +28 -7
- package/dist/chunk-ANZLVSEP.js.map +1 -0
- package/dist/chunk-CKWPK4RO.js +50 -0
- package/dist/chunk-CKWPK4RO.js.map +1 -0
- package/dist/chunk-EG4PX726.js +678 -0
- package/dist/chunk-EG4PX726.js.map +1 -0
- package/dist/{chunk-3G43C6OL.js → chunk-GNXCX4WE.js} +46 -3
- package/dist/chunk-GNXCX4WE.js.map +1 -0
- package/dist/chunk-LYUGDHSF.js +61 -0
- package/dist/chunk-LYUGDHSF.js.map +1 -0
- package/dist/{chunk-RPZAALCX.js → chunk-MQUIAP66.js} +321 -165
- package/dist/chunk-MQUIAP66.js.map +1 -0
- package/dist/chunk-P2KIHF65.js +152 -0
- package/dist/chunk-P2KIHF65.js.map +1 -0
- package/dist/{chunk-BCE22JSM.js → chunk-PJ4SPXHS.js} +52 -16
- package/dist/chunk-PJ4SPXHS.js.map +1 -0
- package/dist/{chunk-ZVANIULZ.js → chunk-RNTDBX6S.js} +4 -4
- package/dist/{chunk-ZVANIULZ.js.map → chunk-RNTDBX6S.js.map} +1 -1
- package/dist/{chunk-PXRX5PEC.js → chunk-ROHNXP7J.js} +73 -4
- package/dist/chunk-ROHNXP7J.js.map +1 -0
- package/dist/chunk-S5MDTHH7.js +466 -0
- package/dist/chunk-S5MDTHH7.js.map +1 -0
- package/dist/chunk-SDJTTMLK.js +1877 -0
- package/dist/chunk-SDJTTMLK.js.map +1 -0
- package/dist/{chunk-EP6JHXSR.js → chunk-SHZM3EXB.js} +68 -12
- package/dist/chunk-SHZM3EXB.js.map +1 -0
- package/dist/{chunk-A2UUGASH.js → chunk-U736PVHY.js} +2 -2
- package/dist/chunk-U736PVHY.js.map +1 -0
- package/dist/{chunk-JGRMRXXZ.js → chunk-UWSQUHX6.js} +4 -99
- package/dist/chunk-UWSQUHX6.js.map +1 -0
- package/dist/chunk-XRKSIC5Z.js +176 -0
- package/dist/chunk-XRKSIC5Z.js.map +1 -0
- package/dist/chunk-YJQCB3UP.js +10764 -0
- package/dist/chunk-YJQCB3UP.js.map +1 -0
- package/dist/cli.js +15 -11
- package/dist/cli.js.map +1 -1
- package/dist/client/index.d.ts +34 -3
- package/dist/client/index.js +211 -12
- package/dist/client/index.js.map +1 -1
- package/dist/components/index.d.ts +2389 -31
- package/dist/components/index.js +7 -4
- package/dist/delta-text-tav2Lh5d.d.ts +17 -0
- package/dist/{dev-NZRLOQCL.js → dev-O42JFQ64.js} +24 -13
- package/dist/dev-O42JFQ64.js.map +1 -0
- package/dist/doc/index.d.ts +215 -2
- package/dist/doc/index.js +423 -5
- package/dist/doc/index.js.map +1 -1
- package/dist/{docs-ZGDJUHJI.js → docs-JVP4RPKT.js} +3 -3
- package/dist/{docs-ZGDJUHJI.js.map → docs-JVP4RPKT.js.map} +1 -1
- package/dist/{doctor-VFKEMR54.js → doctor-YD3XAAOT.js} +8 -8
- package/dist/doctor-YD3XAAOT.js.map +1 -0
- package/dist/format-D34piCei.d.ts +250 -0
- package/dist/geo-japan-7BMSOJRX.js +8 -0
- package/dist/geo-japan-7BMSOJRX.js.map +1 -0
- package/dist/geo-us-GVOG7VXH.js +8 -0
- package/dist/geo-us-GVOG7VXH.js.map +1 -0
- package/dist/geo-world-35HL56UU.js +8 -0
- package/dist/geo-world-35HL56UU.js.map +1 -0
- package/dist/markdown/index.js +1 -1
- package/dist/markdown/index.js.map +1 -1
- package/dist/{preview-QDCIVVSR.js → preview-T6CLSQVX.js} +12 -4
- package/dist/preview-T6CLSQVX.js.map +1 -0
- package/dist/query/index.d.ts +0 -11
- package/dist/query/index.js +2 -2
- package/dist/{routes-RHP5FVGD.js → routes-PVKNT777.js} +6 -6
- package/dist/{routes-RHP5FVGD.js.map → routes-PVKNT777.js.map} +1 -1
- package/dist/{search-RFBELGY7.js → search-5LC4XPB5.js} +3 -3
- package/dist/{search-RFBELGY7.js.map → search-5LC4XPB5.js.map} +1 -1
- package/dist/slide/index.d.ts +272 -1
- package/dist/slide/index.js +1086 -19
- package/dist/slide/index.js.map +1 -1
- package/dist/table/index.js +13 -10
- package/dist/table/index.js.map +1 -1
- package/dist/ui/index.d.ts +148 -12
- package/dist/ui/index.js +1339 -88
- package/dist/ui/index.js.map +1 -1
- package/dist/{upgrade-GF2P67M6.js → upgrade-6DT7ADRP.js} +7 -7
- package/dist/{upgrade-GF2P67M6.js.map → upgrade-6DT7ADRP.js.map} +1 -1
- package/dist/vite/index.d.ts +10 -0
- package/dist/vite/index.js +4 -4
- package/docs/en/agent-skills.md +1 -1
- package/docs/en/changelog.md +82 -0
- package/docs/en/cli-reference.md +30 -0
- package/docs/en/components.md +42 -17
- package/docs/en/doc/delta-text.md +40 -0
- package/docs/en/doc/doc-action-items.md +49 -0
- package/docs/en/doc/doc-callout.md +38 -0
- package/docs/en/doc/doc-data-table.md +60 -0
- package/docs/en/doc/doc-executive-summary.md +64 -0
- package/docs/en/doc/doc-figure.md +56 -0
- package/docs/en/doc/doc-key-findings.md +61 -0
- package/docs/en/doc/doc-kpi-scorecard.md +80 -0
- package/docs/en/doc/doc-notes-and-sources.md +43 -0
- package/docs/en/doc/doc-report-header.md +46 -0
- package/docs/en/pages-and-metadata.md +15 -0
- package/docs/en/parts/area-chart.md +99 -0
- package/docs/en/parts/bar-chart.md +91 -0
- package/docs/en/parts/bar-list.md +50 -0
- package/docs/en/parts/category-bar.md +37 -0
- package/docs/en/parts/chart-frame.md +39 -0
- package/docs/en/parts/data-table.md +22 -0
- package/docs/en/parts/delta.md +51 -0
- package/docs/en/parts/donut-chart.md +72 -0
- package/docs/en/parts/draft-chart.md +42 -0
- package/docs/en/parts/format.md +43 -0
- package/docs/en/parts/funnel-steps.md +2 -1
- package/docs/en/parts/heatmap.md +53 -0
- package/docs/en/parts/kpi-card.md +58 -0
- package/docs/en/parts/legend.md +35 -0
- package/docs/en/parts/line-chart.md +94 -0
- package/docs/en/parts/metric-value.md +3 -2
- package/docs/en/parts/page-shell.md +2 -2
- package/docs/en/parts/progress-circle.md +33 -0
- package/docs/en/parts/sample-data.md +39 -0
- package/docs/en/parts/scatter-chart.md +56 -0
- package/docs/en/parts/sparkline.md +1 -1
- package/docs/en/parts/tracker.md +36 -0
- package/docs/en/parts/trend-indicator.md +17 -1
- package/docs/en/parts/updated-at.md +30 -0
- package/docs/en/parts/waterfall-chart.md +56 -0
- package/docs/en/slide/slide-chart-full.md +48 -0
- package/docs/en/slide/slide-chart-insight.md +52 -0
- package/docs/en/slide/slide-columns.md +46 -0
- package/docs/en/slide/slide-comparison.md +68 -0
- package/docs/en/slide/slide-cover.md +39 -0
- package/docs/en/slide/slide-exec-summary.md +47 -0
- package/docs/en/slide/slide-heading.md +38 -0
- package/docs/en/slide/slide-kpi-grid.md +55 -0
- package/docs/en/slide/slide-kpi-hero.md +58 -0
- package/docs/en/slide/slide-next-actions.md +49 -0
- package/docs/en/slide/slide-scorecard-table.md +54 -0
- package/docs/en/slide/slide-section.md +44 -0
- package/docs/en/slide/slide-source-line.md +34 -0
- package/docs/en/ui/alert-dialog.md +42 -0
- package/docs/en/ui/avatar.md +31 -0
- package/docs/en/ui/combobox.md +74 -0
- package/docs/en/ui/drawer.md +41 -0
- package/docs/en/ui/empty.md +1 -1
- package/docs/en/ui/error-state.md +4 -3
- package/docs/en/ui/field.md +42 -0
- package/docs/en/ui/hover-card.md +21 -0
- package/docs/en/ui/kbd.md +17 -0
- package/docs/en/ui/loading.md +1 -1
- package/docs/en/ui/pagination.md +36 -0
- package/docs/en/ui/radio-group.md +21 -0
- package/docs/en/ui/toast.md +44 -0
- package/docs/en/ui/toggle-group.md +4 -3
- package/docs/en/ui-and-theming.md +1 -1
- package/docs/index.json +1222 -132
- package/docs/ja/agent-skills.md +1 -1
- package/docs/ja/changelog.md +84 -0
- package/docs/ja/cli-reference.md +29 -0
- package/docs/ja/components.md +68 -101
- package/docs/ja/doc/delta-text.md +40 -0
- package/docs/ja/doc/doc-action-items.md +49 -0
- package/docs/ja/doc/doc-callout.md +38 -0
- package/docs/ja/doc/doc-data-table.md +60 -0
- package/docs/ja/doc/doc-executive-summary.md +64 -0
- package/docs/ja/doc/doc-figure.md +56 -0
- package/docs/ja/doc/doc-key-findings.md +61 -0
- package/docs/ja/doc/doc-kpi-scorecard.md +80 -0
- package/docs/ja/doc/doc-notes-and-sources.md +43 -0
- package/docs/ja/doc/doc-report-header.md +46 -0
- package/docs/ja/page-types/csv.md +83 -0
- package/docs/ja/page-types/doc.md +83 -0
- package/docs/ja/page-types/excel.md +82 -0
- package/docs/ja/page-types/slide.md +133 -0
- package/docs/ja/page-types.md +47 -0
- package/docs/ja/pages-and-metadata.md +15 -0
- package/docs/ja/parts/area-chart.md +85 -0
- package/docs/ja/parts/bar-chart.md +95 -0
- package/docs/ja/parts/bar-list.md +58 -0
- package/docs/ja/parts/category-bar.md +36 -0
- package/docs/ja/parts/chart-frame.md +36 -0
- package/docs/ja/parts/data-table.md +22 -0
- package/docs/ja/parts/delta.md +51 -0
- package/docs/ja/parts/donut-chart.md +66 -0
- package/docs/ja/parts/draft-chart.md +40 -0
- package/docs/ja/parts/echart.md +3 -0
- package/docs/ja/parts/format.md +44 -0
- package/docs/ja/parts/funnel-steps.md +27 -8
- package/docs/ja/parts/heatmap.md +45 -0
- package/docs/ja/parts/kpi-card.md +56 -0
- package/docs/ja/parts/legend.md +36 -0
- package/docs/ja/parts/line-chart.md +84 -0
- package/docs/ja/parts/metric-value.md +3 -2
- package/docs/ja/parts/page-shell.md +2 -2
- package/docs/ja/parts/progress-circle.md +34 -0
- package/docs/ja/parts/sample-data.md +61 -0
- package/docs/ja/parts/scatter-chart.md +69 -0
- package/docs/ja/parts/sparkline.md +2 -2
- package/docs/ja/parts/tracker.md +32 -0
- package/docs/ja/parts/trend-indicator.md +17 -1
- package/docs/ja/parts/updated-at.md +27 -0
- package/docs/ja/parts/waterfall-chart.md +61 -0
- package/docs/ja/routing.md +8 -86
- package/docs/ja/slide/slide-chart-full.md +48 -0
- package/docs/ja/slide/slide-chart-insight.md +52 -0
- package/docs/ja/slide/slide-columns.md +46 -0
- package/docs/ja/slide/slide-comparison.md +68 -0
- package/docs/ja/slide/slide-cover.md +39 -0
- package/docs/ja/slide/slide-exec-summary.md +47 -0
- package/docs/ja/slide/slide-heading.md +38 -0
- package/docs/ja/slide/slide-kpi-grid.md +55 -0
- package/docs/ja/slide/slide-kpi-hero.md +58 -0
- package/docs/ja/slide/slide-next-actions.md +49 -0
- package/docs/ja/slide/slide-scorecard-table.md +54 -0
- package/docs/ja/slide/slide-section.md +44 -0
- package/docs/ja/slide/slide-source-line.md +34 -0
- package/docs/ja/ui/alert-dialog.md +41 -0
- package/docs/ja/ui/avatar.md +31 -0
- package/docs/ja/ui/combobox.md +74 -0
- package/docs/ja/ui/drawer.md +41 -0
- package/docs/ja/ui/empty.md +1 -1
- package/docs/ja/ui/error-state.md +4 -3
- package/docs/ja/ui/field.md +42 -0
- package/docs/ja/ui/hover-card.md +21 -0
- package/docs/ja/ui/kbd.md +16 -0
- package/docs/ja/ui/loading.md +1 -1
- package/docs/ja/ui/pagination.md +36 -0
- package/docs/ja/ui/radio-group.md +21 -0
- package/docs/ja/ui/toast.md +46 -0
- package/docs/ja/ui/toggle-group.md +4 -3
- package/docs/ja/ui-and-theming.md +14 -7
- package/package.json +43 -29
- package/registry/parts.json +5221 -0
- package/registry/ui/accordion.tsx +76 -0
- package/registry/ui/alert-dialog.tsx +189 -0
- package/registry/ui/alert.tsx +80 -0
- package/registry/ui/app-shell.tsx +424 -0
- package/registry/ui/area-chart.tsx +3960 -0
- package/registry/ui/attention-list.tsx +465 -0
- package/registry/ui/avatar.tsx +110 -0
- package/registry/ui/badge.tsx +56 -0
- package/registry/ui/bar-chart.tsx +3954 -0
- package/registry/ui/bar-list.tsx +3998 -0
- package/registry/ui/box-plot-chart.tsx +4214 -0
- package/registry/ui/breadcrumb.tsx +128 -0
- package/registry/ui/button.tsx +62 -0
- package/registry/ui/calendar.tsx +223 -0
- package/registry/ui/card.tsx +107 -0
- package/registry/ui/category-bar.tsx +1498 -0
- package/registry/ui/chart-frame.tsx +1612 -0
- package/registry/ui/checkbox.tsx +30 -0
- package/registry/ui/collapsible.tsx +23 -0
- package/registry/ui/combo-chart.tsx +1852 -0
- package/registry/ui/combobox.tsx +310 -0
- package/registry/ui/command.tsx +198 -0
- package/registry/ui/dashboard-card.tsx +219 -0
- package/registry/ui/data-table.tsx +899 -158
- package/registry/ui/date-range-picker.tsx +544 -0
- package/registry/ui/delta.tsx +352 -0
- package/registry/ui/dialog.tsx +161 -0
- package/registry/ui/donut-chart.tsx +4006 -0
- package/registry/ui/drawer.tsx +229 -0
- package/registry/ui/dropdown-menu.tsx +274 -0
- package/registry/ui/echart.tsx +1178 -0
- package/registry/ui/field.tsx +240 -0
- package/registry/ui/filter-bar.tsx +553 -0
- package/registry/ui/forecast-chart.tsx +4734 -0
- package/registry/ui/funnel-steps.tsx +3843 -0
- package/registry/ui/heatmap.tsx +2027 -0
- package/registry/ui/histogram-chart.tsx +4284 -0
- package/registry/ui/hover-card.tsx +52 -0
- package/registry/ui/input-group.tsx +160 -0
- package/registry/ui/input.tsx +24 -0
- package/registry/ui/kbd.tsx +30 -0
- package/registry/ui/kpi-card.tsx +907 -0
- package/registry/ui/label.tsx +22 -0
- package/registry/ui/legend.tsx +3817 -0
- package/registry/ui/line-chart.tsx +3958 -0
- package/registry/ui/metric-value.tsx +62 -0
- package/registry/ui/multi-select.tsx +382 -0
- package/registry/ui/page-shell.tsx +441 -0
- package/registry/ui/pagination.tsx +140 -0
- package/registry/ui/paired-chart.tsx +4086 -0
- package/registry/ui/pivot-table.tsx +1260 -0
- package/registry/ui/placeholder.tsx +36 -0
- package/registry/ui/popover.tsx +92 -0
- package/registry/ui/progress-circle.tsx +1033 -0
- package/registry/ui/progress.tsx +85 -0
- package/registry/ui/radio-group.tsx +39 -0
- package/registry/ui/sample-data.tsx +230 -0
- package/registry/ui/scatter-chart.tsx +4503 -0
- package/registry/ui/scroll-area.tsx +56 -0
- package/registry/ui/searchable-select.tsx +352 -0
- package/registry/ui/section-header.tsx +43 -0
- package/registry/ui/segmented-control.tsx +76 -0
- package/registry/ui/select.tsx +255 -0
- package/registry/ui/separator.tsx +27 -0
- package/registry/ui/sheet.tsx +139 -0
- package/registry/ui/sidebar.tsx +725 -0
- package/registry/ui/skeleton.tsx +17 -0
- package/registry/ui/slider.tsx +56 -0
- package/registry/ui/sparkline.tsx +230 -0
- package/registry/ui/spinner.tsx +14 -0
- package/registry/ui/states.tsx +247 -0
- package/registry/ui/status-badge.tsx +286 -0
- package/registry/ui/switch.tsx +34 -0
- package/registry/ui/table.tsx +118 -0
- package/registry/ui/tabs.tsx +84 -0
- package/registry/ui/textarea.tsx +22 -0
- package/registry/ui/toast.tsx +250 -0
- package/registry/ui/toggle-group.tsx +91 -0
- package/registry/ui/toggle.tsx +47 -0
- package/registry/ui/tooltip.tsx +72 -0
- package/registry/ui/tracker.tsx +1015 -0
- package/registry/ui/treemap.tsx +1917 -0
- package/registry/ui/trend-indicator.tsx +217 -0
- package/registry/ui/updated-at.tsx +276 -0
- package/registry/ui/waterfall-chart.tsx +4561 -0
- package/skills/vantage-add-feature/SKILL.md +14 -7
- package/skills/vantage-design/SKILL.md +62 -52
- package/skills/vantage-design/references/extract.md +26 -27
- package/skills/vantage-design/references/format.md +12 -172
- package/skills/vantage-design/references/presets.md +50 -110
- package/skills/vantage-pitfalls/SKILL.md +10 -1
- package/skills/vantage-slide/SKILL.md +71 -36
- package/templates/AGENTS.md +54 -16
- package/templates/agents/api.md +36 -0
- package/templates/agents/csv.md +2 -1
- package/templates/agents/doc.md +52 -3
- package/templates/agents/page.md +91 -10
- package/templates/agents/slide.md +90 -4
- package/templates/agents/xlsx.md +2 -1
- package/theme.css +247 -132
- package/dist/add-EISGSZAH.js +0 -6
- package/dist/add-EISGSZAH.js.map +0 -1
- package/dist/chunk-3G43C6OL.js.map +0 -1
- package/dist/chunk-5ZOP4SQR.js +0 -47
- package/dist/chunk-5ZOP4SQR.js.map +0 -1
- package/dist/chunk-A2UUGASH.js.map +0 -1
- package/dist/chunk-BCE22JSM.js.map +0 -1
- package/dist/chunk-DTDVSFRY.js +0 -29
- package/dist/chunk-DTDVSFRY.js.map +0 -1
- package/dist/chunk-EP6JHXSR.js.map +0 -1
- package/dist/chunk-JGRMRXXZ.js.map +0 -1
- package/dist/chunk-KLEIVDUV.js +0 -165
- package/dist/chunk-KLEIVDUV.js.map +0 -1
- package/dist/chunk-LSRMRIXA.js +0 -2227
- package/dist/chunk-LSRMRIXA.js.map +0 -1
- package/dist/chunk-PVTHHV7X.js.map +0 -1
- package/dist/chunk-PXRX5PEC.js.map +0 -1
- package/dist/chunk-RPZAALCX.js.map +0 -1
- package/dist/chunk-T3FLAGI6.js +0 -316
- package/dist/chunk-T3FLAGI6.js.map +0 -1
- package/dist/dev-NZRLOQCL.js.map +0 -1
- package/dist/doctor-VFKEMR54.js.map +0 -1
- package/dist/preview-QDCIVVSR.js.map +0 -1
|
@@ -0,0 +1,286 @@
|
|
|
1
|
+
// Copied by `vantage add ui status-badge`. This file is yours to edit.
|
|
2
|
+
// Generated from @squadbase/squadkit registry/components/status-badge.tsx by `pnpm run registry` (in Vantage, edit packages/squadkit, not registry/).
|
|
3
|
+
"use client"
|
|
4
|
+
|
|
5
|
+
/**
|
|
6
|
+
* StatusBadge — a dot-plus-label badge for row/record status. Statuses map to a
|
|
7
|
+
* tone through `defaultColorMap`; pass `colorMap` to extend or override it.
|
|
8
|
+
*
|
|
9
|
+
* Tones are the theme's semantic tokens — `positive` | `negative` | `warning` |
|
|
10
|
+
* `info` | `neutral` — drawn as a `--<tone>` dot and text on a `--<tone>-subtle`
|
|
11
|
+
* background. The legacy colour names `green` / `red` / `yellow` / `blue` /
|
|
12
|
+
* `gray` are still accepted and map to positive / negative / warning / info /
|
|
13
|
+
* neutral. Unknown statuses and tones fall back to `neutral`.
|
|
14
|
+
*
|
|
15
|
+
* The default label comes from `STATUS_VOCABULARY` (one table of status, label and tone; the label follows the
|
|
16
|
+
* page's language, `<html lang>`), so the same state is worded the same everywhere (Tracker legends import it too):
|
|
17
|
+
*
|
|
18
|
+
* | status | ラベル(ja / en) | 色調 |
|
|
19
|
+
* |---|---|---|
|
|
20
|
+
* | `success` | 正常 / Healthy | positive |
|
|
21
|
+
* | `partial` | 一部失敗 / Partially failed | warning |
|
|
22
|
+
* | `failed` | 失敗 / Failed | negative |
|
|
23
|
+
* | `delayed` | 遅延 / Delayed | warning |
|
|
24
|
+
* | `running` | 実行中 / Running | info |
|
|
25
|
+
* | `stopped` | 停止中 / Stopped | neutral |
|
|
26
|
+
* | `active` / `inactive` | 有効 / 無効、Active / Inactive | positive / neutral |
|
|
27
|
+
* | `warning` / `error` / `pending` | 警告 / エラー / 保留中、Warning / Error / Pending | warning / negative / info |
|
|
28
|
+
*/
|
|
29
|
+
import { forwardRef } from "react"
|
|
30
|
+
|
|
31
|
+
import { cn } from "@squadbase/vantage/ui"
|
|
32
|
+
import { Badge } from "@squadbase/vantage/ui"
|
|
33
|
+
import { useSyncExternalStore } from "react"
|
|
34
|
+
|
|
35
|
+
/* ---------- inlined from @squadbase/squadkit registry/lib/locale.ts (internal to @squadbase/vantage) ---------- */
|
|
36
|
+
|
|
37
|
+
/**
|
|
38
|
+
* The display language of the parts and the defaults that follow it.
|
|
39
|
+
*
|
|
40
|
+
* The language comes from `<html lang>`: a tag starting with `ja` reads Japanese, anything else English.
|
|
41
|
+
* Without a usable `lang` (missing, invalid, or no `document` — SSR, Node) the locale is `FALLBACK_LOCALE`
|
|
42
|
+
* (`en-US`). A `locale` passed explicitly (a prop, an argument) always wins.
|
|
43
|
+
*
|
|
44
|
+
* Parts read the locale through `useLocale` (`hooks/use-locale`) and pass it down; the pure helpers here
|
|
45
|
+
* and in `format` / `comparison` / `chart-*` take it as an argument and fall back to `documentLocale()`.
|
|
46
|
+
*/
|
|
47
|
+
|
|
48
|
+
/** The language of the built-in wording: Japanese or English. */
|
|
49
|
+
type UiLanguage = "ja" | "en"
|
|
50
|
+
|
|
51
|
+
/** The locale used when `<html lang>` gives none (and on the server). */
|
|
52
|
+
const FALLBACK_LOCALE = "en-US"
|
|
53
|
+
|
|
54
|
+
/** `"ja"` when `locale` starts with `ja` (`ja`, `ja-JP`), else `"en"`. A missing locale is `"en"`. */
|
|
55
|
+
function uiLanguage(locale: string | null | undefined): UiLanguage {
|
|
56
|
+
return typeof locale === "string" && locale.trim().toLowerCase().startsWith("ja") ? "ja" : "en"
|
|
57
|
+
}
|
|
58
|
+
|
|
59
|
+
/** A BCP 47 tag in its canonical form (`en-gb` → `en-GB`), or `FALLBACK_LOCALE` when it is empty or invalid. */
|
|
60
|
+
function normalizeLocale(tag: string | null | undefined): string {
|
|
61
|
+
const value = tag?.trim()
|
|
62
|
+
if (!value) return FALLBACK_LOCALE
|
|
63
|
+
try {
|
|
64
|
+
return Intl.getCanonicalLocales(value)[0] ?? FALLBACK_LOCALE
|
|
65
|
+
} catch {
|
|
66
|
+
return FALLBACK_LOCALE
|
|
67
|
+
}
|
|
68
|
+
}
|
|
69
|
+
|
|
70
|
+
/**
|
|
71
|
+
* The locale of the page: `document.documentElement.lang`, canonicalized. `FALLBACK_LOCALE` when it is empty or
|
|
72
|
+
* invalid, or there is no `document`. Parts read it through `useLocale`, never while rendering.
|
|
73
|
+
*/
|
|
74
|
+
function documentLocale(): string {
|
|
75
|
+
if (typeof document === "undefined") return FALLBACK_LOCALE
|
|
76
|
+
return normalizeLocale(document.documentElement?.getAttribute("lang"))
|
|
77
|
+
}
|
|
78
|
+
|
|
79
|
+
/** `locale` when given, else the page's locale (`documentLocale()`). */
|
|
80
|
+
function resolveLocale(locale?: string | null): string {
|
|
81
|
+
return locale || documentLocale()
|
|
82
|
+
}
|
|
83
|
+
|
|
84
|
+
/** Picks the wording table of the locale's language. */
|
|
85
|
+
function pickLocale<T>(table: { ja: T; en: T }, locale?: string | null): T {
|
|
86
|
+
return table[uiLanguage(resolveLocale(locale))]
|
|
87
|
+
}
|
|
88
|
+
|
|
89
|
+
/** The currency `format="currency"` uses without a `currency`: JPY for Japanese, USD otherwise. */
|
|
90
|
+
function defaultCurrency(locale?: string | null): string {
|
|
91
|
+
return uiLanguage(resolveLocale(locale)) === "ja" ? "JPY" : "USD"
|
|
92
|
+
}
|
|
93
|
+
|
|
94
|
+
/** The month a fiscal year starts in (1–12) when none is given: April for Japanese, January otherwise. */
|
|
95
|
+
function defaultFiscalYearStartMonth(locale?: string | null): number {
|
|
96
|
+
return uiLanguage(resolveLocale(locale)) === "ja" ? 4 : 1
|
|
97
|
+
}
|
|
98
|
+
|
|
99
|
+
/** A day of the week, 0 = Sunday … 6 = Saturday (the `Date#getDay` / date-fns numbering). */
|
|
100
|
+
type WeekDay = 0 | 1 | 2 | 3 | 4 | 5 | 6
|
|
101
|
+
|
|
102
|
+
/** Locales whose week starts on Sunday when the runtime has no week data. */
|
|
103
|
+
const SUNDAY_FIRST = new Set(["en", "en-US", "en-CA"])
|
|
104
|
+
|
|
105
|
+
/**
|
|
106
|
+
* The first day of the week: Monday for Japanese; otherwise the locale's convention from `Intl.Locale`
|
|
107
|
+
* (`en-US` Sunday, `en-GB` Monday). Without week data in the runtime: Sunday for `en` / `en-US` / `en-CA`,
|
|
108
|
+
* Monday for the rest.
|
|
109
|
+
*/
|
|
110
|
+
function weekStartsOn(locale?: string | null): WeekDay {
|
|
111
|
+
const tag = normalizeLocale(resolveLocale(locale))
|
|
112
|
+
if (uiLanguage(tag) === "ja") return 1
|
|
113
|
+
try {
|
|
114
|
+
const info = new Intl.Locale(tag) as Intl.Locale & {
|
|
115
|
+
getWeekInfo?: () => { firstDay: number }
|
|
116
|
+
weekInfo?: { firstDay: number }
|
|
117
|
+
}
|
|
118
|
+
const firstDay = info.getWeekInfo?.().firstDay ?? info.weekInfo?.firstDay
|
|
119
|
+
if (typeof firstDay === "number" && firstDay >= 1 && firstDay <= 7) return (firstDay % 7) as WeekDay
|
|
120
|
+
} catch {
|
|
121
|
+
// Fall through to the table below.
|
|
122
|
+
}
|
|
123
|
+
return SUNDAY_FIRST.has(tag) ? 0 : 1
|
|
124
|
+
}
|
|
125
|
+
|
|
126
|
+
/* ---------- inlined from @squadbase/squadkit registry/hooks/use-locale.ts (internal to @squadbase/vantage) ---------- */
|
|
127
|
+
|
|
128
|
+
const listeners = new Set<() => void>()
|
|
129
|
+
let observer: MutationObserver | null = null
|
|
130
|
+
|
|
131
|
+
/** One observer on `<html lang>` for every subscribed part. */
|
|
132
|
+
function subscribe(onChange: () => void): () => void {
|
|
133
|
+
if (typeof document === "undefined" || typeof MutationObserver === "undefined") return () => {}
|
|
134
|
+
listeners.add(onChange)
|
|
135
|
+
if (!observer) {
|
|
136
|
+
observer = new MutationObserver(() => {
|
|
137
|
+
for (const listener of [...listeners]) listener()
|
|
138
|
+
})
|
|
139
|
+
observer.observe(document.documentElement, { attributes: true, attributeFilter: ["lang"] })
|
|
140
|
+
}
|
|
141
|
+
return () => {
|
|
142
|
+
listeners.delete(onChange)
|
|
143
|
+
if (listeners.size === 0 && observer) {
|
|
144
|
+
observer.disconnect()
|
|
145
|
+
observer = null
|
|
146
|
+
}
|
|
147
|
+
}
|
|
148
|
+
}
|
|
149
|
+
|
|
150
|
+
const serverLocale = () => FALLBACK_LOCALE
|
|
151
|
+
|
|
152
|
+
/**
|
|
153
|
+
* The page's locale (`<html lang>`), following changes made while the page runs. On the server and during
|
|
154
|
+
* hydration it is `FALLBACK_LOCALE` (`en-US`), so the markup matches; it switches right after.
|
|
155
|
+
*/
|
|
156
|
+
function useDocumentLocale(): string {
|
|
157
|
+
return useSyncExternalStore(subscribe, documentLocale, serverLocale)
|
|
158
|
+
}
|
|
159
|
+
|
|
160
|
+
/** The locale a part renders in: its `locale` prop when given, else the page's (`useDocumentLocale`). */
|
|
161
|
+
function useLocale(locale?: string | null): string {
|
|
162
|
+
const page = useDocumentLocale()
|
|
163
|
+
return locale || page
|
|
164
|
+
}
|
|
165
|
+
|
|
166
|
+
/* ---------- end of inlined code ---------- */
|
|
167
|
+
|
|
168
|
+
type StatusTone = "positive" | "negative" | "warning" | "info" | "neutral"
|
|
169
|
+
|
|
170
|
+
const STATUS_LABELS = {
|
|
171
|
+
ja: {
|
|
172
|
+
success: "正常",
|
|
173
|
+
partial: "一部失敗",
|
|
174
|
+
failed: "失敗",
|
|
175
|
+
delayed: "遅延",
|
|
176
|
+
running: "実行中",
|
|
177
|
+
stopped: "停止中",
|
|
178
|
+
active: "有効",
|
|
179
|
+
inactive: "無効",
|
|
180
|
+
warning: "警告",
|
|
181
|
+
error: "エラー",
|
|
182
|
+
pending: "保留中",
|
|
183
|
+
},
|
|
184
|
+
en: {
|
|
185
|
+
success: "Healthy",
|
|
186
|
+
partial: "Partially failed",
|
|
187
|
+
failed: "Failed",
|
|
188
|
+
delayed: "Delayed",
|
|
189
|
+
running: "Running",
|
|
190
|
+
stopped: "Stopped",
|
|
191
|
+
active: "Active",
|
|
192
|
+
inactive: "Inactive",
|
|
193
|
+
warning: "Warning",
|
|
194
|
+
error: "Error",
|
|
195
|
+
pending: "Pending",
|
|
196
|
+
},
|
|
197
|
+
} as const
|
|
198
|
+
|
|
199
|
+
/**
|
|
200
|
+
* 状態の語彙の正本: status → ラベルと色調。StatusBadge の既定の表示と、Tracker の凡例など
|
|
201
|
+
* 同じ状態を語る他の場所が、同じ語を使うためにここから参照する。`label` は英語(フォールバック)で、
|
|
202
|
+
* ページの言語に合わせた語は `statusLabel(status, locale)` で引く。
|
|
203
|
+
*/
|
|
204
|
+
export const STATUS_VOCABULARY = {
|
|
205
|
+
success: { label: STATUS_LABELS.en.success, tone: "positive" },
|
|
206
|
+
partial: { label: STATUS_LABELS.en.partial, tone: "warning" },
|
|
207
|
+
failed: { label: STATUS_LABELS.en.failed, tone: "negative" },
|
|
208
|
+
delayed: { label: STATUS_LABELS.en.delayed, tone: "warning" },
|
|
209
|
+
running: { label: STATUS_LABELS.en.running, tone: "info" },
|
|
210
|
+
stopped: { label: STATUS_LABELS.en.stopped, tone: "neutral" },
|
|
211
|
+
active: { label: STATUS_LABELS.en.active, tone: "positive" },
|
|
212
|
+
inactive: { label: STATUS_LABELS.en.inactive, tone: "neutral" },
|
|
213
|
+
warning: { label: STATUS_LABELS.en.warning, tone: "warning" },
|
|
214
|
+
error: { label: STATUS_LABELS.en.error, tone: "negative" },
|
|
215
|
+
pending: { label: STATUS_LABELS.en.pending, tone: "info" },
|
|
216
|
+
} as const satisfies Record<string, { label: string; tone: StatusTone }>
|
|
217
|
+
|
|
218
|
+
export type StatusKey = keyof typeof STATUS_VOCABULARY
|
|
219
|
+
|
|
220
|
+
/** 状態のラベル(`locale` の言語。既定はページのロケール)。語彙に無い status は渡された文字列のまま返す。 */
|
|
221
|
+
export function statusLabel(status: string, locale?: string): string {
|
|
222
|
+
return Object.hasOwn(STATUS_VOCABULARY, status) ? STATUS_LABELS[uiLanguage(resolveLocale(locale))][status as StatusKey] : status
|
|
223
|
+
}
|
|
224
|
+
|
|
225
|
+
const defaultColorMap: Record<string, string> = Object.fromEntries(
|
|
226
|
+
Object.entries(STATUS_VOCABULARY).map(([key, { tone }]) => [key, tone]),
|
|
227
|
+
)
|
|
228
|
+
|
|
229
|
+
/** Legacy colour names → tones. */
|
|
230
|
+
const legacyColorTones: Record<string, StatusTone> = {
|
|
231
|
+
green: "positive",
|
|
232
|
+
gray: "neutral",
|
|
233
|
+
yellow: "warning",
|
|
234
|
+
red: "negative",
|
|
235
|
+
blue: "info",
|
|
236
|
+
}
|
|
237
|
+
|
|
238
|
+
/**
|
|
239
|
+
* One literal class set per tone — Tailwind only emits classes it can see
|
|
240
|
+
* literally in the source.
|
|
241
|
+
*/
|
|
242
|
+
const toneStyles: Record<StatusTone, { dot: string; bg: string; text: string; border: string }> = {
|
|
243
|
+
positive: { dot: "bg-positive", bg: "bg-positive-subtle", text: "text-positive", border: "border-positive/20 dark:border-positive/25" },
|
|
244
|
+
negative: { dot: "bg-negative", bg: "bg-negative-subtle", text: "text-negative", border: "border-negative/20 dark:border-negative/25" },
|
|
245
|
+
warning: { dot: "bg-warning", bg: "bg-warning-subtle", text: "text-warning", border: "border-warning/20 dark:border-warning/25" },
|
|
246
|
+
info: { dot: "bg-info", bg: "bg-info-subtle", text: "text-info", border: "border-info/20 dark:border-info/25" },
|
|
247
|
+
neutral: { dot: "bg-neutral", bg: "bg-neutral-subtle", text: "text-neutral", border: "border-neutral/20 dark:border-neutral/25" },
|
|
248
|
+
}
|
|
249
|
+
|
|
250
|
+
const resolveTone = (color: string | undefined): StatusTone => {
|
|
251
|
+
if (color === undefined) return "neutral"
|
|
252
|
+
if (Object.hasOwn(toneStyles, color)) return color as StatusTone
|
|
253
|
+
return legacyColorTones[color] ?? "neutral"
|
|
254
|
+
}
|
|
255
|
+
|
|
256
|
+
export interface StatusBadgeProps {
|
|
257
|
+
status: string
|
|
258
|
+
label?: string
|
|
259
|
+
/** status → tone (`positive` | `negative` | `warning` | `info` | `neutral`) or legacy colour name. */
|
|
260
|
+
colorMap?: Partial<Record<string, string>>
|
|
261
|
+
className?: string
|
|
262
|
+
}
|
|
263
|
+
|
|
264
|
+
export const StatusBadge = forwardRef<HTMLSpanElement, StatusBadgeProps>(function StatusBadge(
|
|
265
|
+
{ status, label, colorMap, className },
|
|
266
|
+
ref,
|
|
267
|
+
) {
|
|
268
|
+
const locale = useLocale()
|
|
269
|
+
const mergedColorMap = { ...defaultColorMap, ...colorMap }
|
|
270
|
+
const style = toneStyles[resolveTone(mergedColorMap[status])]
|
|
271
|
+
const displayLabel = label ?? statusLabel(status, locale)
|
|
272
|
+
|
|
273
|
+
return (
|
|
274
|
+
<Badge
|
|
275
|
+
ref={ref}
|
|
276
|
+
data-slot="status-badge"
|
|
277
|
+
variant="outline"
|
|
278
|
+
className={cn("gap-1.5 rounded-md", style.border, style.bg, style.text, className)}
|
|
279
|
+
aria-label={displayLabel}
|
|
280
|
+
>
|
|
281
|
+
<span className={cn("inline-block size-1.5 rounded-full", style.dot)} aria-hidden="true" />
|
|
282
|
+
{displayLabel}
|
|
283
|
+
</Badge>
|
|
284
|
+
)
|
|
285
|
+
})
|
|
286
|
+
StatusBadge.displayName = "StatusBadge"
|
|
@@ -0,0 +1,34 @@
|
|
|
1
|
+
// Copied by `vantage add ui switch`. This file is yours to edit.
|
|
2
|
+
// Generated from @squadbase/squadkit registry/ui/switch.tsx by `pnpm run registry` (in Vantage, edit packages/squadkit, not registry/).
|
|
3
|
+
"use client"
|
|
4
|
+
|
|
5
|
+
import { Switch as SwitchPrimitive } from "@base-ui/react/switch"
|
|
6
|
+
|
|
7
|
+
import { cn } from "@squadbase/vantage/ui"
|
|
8
|
+
|
|
9
|
+
function Switch({
|
|
10
|
+
className,
|
|
11
|
+
size = "default",
|
|
12
|
+
...props
|
|
13
|
+
}: SwitchPrimitive.Root.Props & {
|
|
14
|
+
size?: "sm" | "default"
|
|
15
|
+
}) {
|
|
16
|
+
return (
|
|
17
|
+
<SwitchPrimitive.Root
|
|
18
|
+
data-slot="switch"
|
|
19
|
+
data-size={size}
|
|
20
|
+
className={cn(
|
|
21
|
+
"peer group/switch relative inline-flex shrink-0 items-center rounded-full border border-transparent transition-all outline-none after:absolute after:-inset-x-3 after:-inset-y-2 focus-visible:border-ring focus-visible:ring-3 focus-visible:ring-ring/50 aria-invalid:border-destructive aria-invalid:ring-3 aria-invalid:ring-destructive/20 data-[size=default]:h-[18.4px] data-[size=default]:w-[32px] data-[size=sm]:h-[14px] data-[size=sm]:w-[24px] dark:aria-invalid:border-destructive/50 dark:aria-invalid:ring-destructive/40 data-checked:bg-primary data-unchecked:bg-input dark:data-unchecked:bg-input/80 data-disabled:cursor-not-allowed data-disabled:opacity-50",
|
|
22
|
+
className
|
|
23
|
+
)}
|
|
24
|
+
{...props}
|
|
25
|
+
>
|
|
26
|
+
<SwitchPrimitive.Thumb
|
|
27
|
+
data-slot="switch-thumb"
|
|
28
|
+
className="pointer-events-none block rounded-full bg-background ring-0 transition-transform group-data-[size=default]/switch:size-4 group-data-[size=sm]/switch:size-3 group-data-[size=default]/switch:data-checked:translate-x-[calc(100%-2px)] group-data-[size=sm]/switch:data-checked:translate-x-[calc(100%-2px)] dark:data-checked:bg-primary-foreground group-data-[size=default]/switch:data-unchecked:translate-x-0 group-data-[size=sm]/switch:data-unchecked:translate-x-0 dark:data-unchecked:bg-foreground"
|
|
29
|
+
/>
|
|
30
|
+
</SwitchPrimitive.Root>
|
|
31
|
+
)
|
|
32
|
+
}
|
|
33
|
+
|
|
34
|
+
export { Switch }
|
|
@@ -0,0 +1,118 @@
|
|
|
1
|
+
// Copied by `vantage add ui table`. This file is yours to edit.
|
|
2
|
+
// Generated from @squadbase/squadkit registry/ui/table.tsx by `pnpm run registry` (in Vantage, edit packages/squadkit, not registry/).
|
|
3
|
+
"use client"
|
|
4
|
+
|
|
5
|
+
import * as React from "react"
|
|
6
|
+
|
|
7
|
+
import { cn } from "@squadbase/vantage/ui"
|
|
8
|
+
|
|
9
|
+
function Table({ className, ...props }: React.ComponentProps<"table">) {
|
|
10
|
+
return (
|
|
11
|
+
<div
|
|
12
|
+
data-slot="table-container"
|
|
13
|
+
className="relative w-full overflow-x-auto"
|
|
14
|
+
>
|
|
15
|
+
<table
|
|
16
|
+
data-slot="table"
|
|
17
|
+
className={cn("w-full caption-bottom text-sm", className)}
|
|
18
|
+
{...props}
|
|
19
|
+
/>
|
|
20
|
+
</div>
|
|
21
|
+
)
|
|
22
|
+
}
|
|
23
|
+
|
|
24
|
+
function TableHeader({ className, ...props }: React.ComponentProps<"thead">) {
|
|
25
|
+
return (
|
|
26
|
+
<thead
|
|
27
|
+
data-slot="table-header"
|
|
28
|
+
className={cn("[&_tr]:border-b", className)}
|
|
29
|
+
{...props}
|
|
30
|
+
/>
|
|
31
|
+
)
|
|
32
|
+
}
|
|
33
|
+
|
|
34
|
+
function TableBody({ className, ...props }: React.ComponentProps<"tbody">) {
|
|
35
|
+
return (
|
|
36
|
+
<tbody
|
|
37
|
+
data-slot="table-body"
|
|
38
|
+
className={cn("[&_tr:last-child]:border-0", className)}
|
|
39
|
+
{...props}
|
|
40
|
+
/>
|
|
41
|
+
)
|
|
42
|
+
}
|
|
43
|
+
|
|
44
|
+
function TableFooter({ className, ...props }: React.ComponentProps<"tfoot">) {
|
|
45
|
+
return (
|
|
46
|
+
<tfoot
|
|
47
|
+
data-slot="table-footer"
|
|
48
|
+
className={cn(
|
|
49
|
+
"border-t bg-muted/50 font-medium [&>tr]:last:border-b-0",
|
|
50
|
+
className
|
|
51
|
+
)}
|
|
52
|
+
{...props}
|
|
53
|
+
/>
|
|
54
|
+
)
|
|
55
|
+
}
|
|
56
|
+
|
|
57
|
+
function TableRow({ className, ...props }: React.ComponentProps<"tr">) {
|
|
58
|
+
return (
|
|
59
|
+
<tr
|
|
60
|
+
data-slot="table-row"
|
|
61
|
+
className={cn(
|
|
62
|
+
"border-b transition-colors hover:bg-muted/50 has-aria-expanded:bg-muted/50 data-[state=selected]:bg-muted",
|
|
63
|
+
className
|
|
64
|
+
)}
|
|
65
|
+
{...props}
|
|
66
|
+
/>
|
|
67
|
+
)
|
|
68
|
+
}
|
|
69
|
+
|
|
70
|
+
function TableHead({ className, ...props }: React.ComponentProps<"th">) {
|
|
71
|
+
return (
|
|
72
|
+
<th
|
|
73
|
+
data-slot="table-head"
|
|
74
|
+
className={cn(
|
|
75
|
+
"h-10 px-2 text-left align-middle text-xs font-medium whitespace-nowrap text-muted-foreground [&:has([role=checkbox])]:pr-0",
|
|
76
|
+
className
|
|
77
|
+
)}
|
|
78
|
+
{...props}
|
|
79
|
+
/>
|
|
80
|
+
)
|
|
81
|
+
}
|
|
82
|
+
|
|
83
|
+
function TableCell({ className, ...props }: React.ComponentProps<"td">) {
|
|
84
|
+
return (
|
|
85
|
+
<td
|
|
86
|
+
data-slot="table-cell"
|
|
87
|
+
className={cn(
|
|
88
|
+
"p-2 align-middle whitespace-nowrap [&:has([role=checkbox])]:pr-0",
|
|
89
|
+
className
|
|
90
|
+
)}
|
|
91
|
+
{...props}
|
|
92
|
+
/>
|
|
93
|
+
)
|
|
94
|
+
}
|
|
95
|
+
|
|
96
|
+
function TableCaption({
|
|
97
|
+
className,
|
|
98
|
+
...props
|
|
99
|
+
}: React.ComponentProps<"caption">) {
|
|
100
|
+
return (
|
|
101
|
+
<caption
|
|
102
|
+
data-slot="table-caption"
|
|
103
|
+
className={cn("mt-4 text-sm text-muted-foreground", className)}
|
|
104
|
+
{...props}
|
|
105
|
+
/>
|
|
106
|
+
)
|
|
107
|
+
}
|
|
108
|
+
|
|
109
|
+
export {
|
|
110
|
+
Table,
|
|
111
|
+
TableHeader,
|
|
112
|
+
TableBody,
|
|
113
|
+
TableFooter,
|
|
114
|
+
TableHead,
|
|
115
|
+
TableRow,
|
|
116
|
+
TableCell,
|
|
117
|
+
TableCaption,
|
|
118
|
+
}
|
|
@@ -0,0 +1,84 @@
|
|
|
1
|
+
// Copied by `vantage add ui tabs`. This file is yours to edit.
|
|
2
|
+
// Generated from @squadbase/squadkit registry/ui/tabs.tsx by `pnpm run registry` (in Vantage, edit packages/squadkit, not registry/).
|
|
3
|
+
"use client"
|
|
4
|
+
|
|
5
|
+
import { Tabs as TabsPrimitive } from "@base-ui/react/tabs"
|
|
6
|
+
import { cva, type VariantProps } from "class-variance-authority"
|
|
7
|
+
|
|
8
|
+
import { cn } from "@squadbase/vantage/ui"
|
|
9
|
+
|
|
10
|
+
function Tabs({
|
|
11
|
+
className,
|
|
12
|
+
orientation = "horizontal",
|
|
13
|
+
...props
|
|
14
|
+
}: TabsPrimitive.Root.Props) {
|
|
15
|
+
return (
|
|
16
|
+
<TabsPrimitive.Root
|
|
17
|
+
data-slot="tabs"
|
|
18
|
+
data-orientation={orientation}
|
|
19
|
+
className={cn(
|
|
20
|
+
"group/tabs flex gap-2 data-horizontal:flex-col",
|
|
21
|
+
className
|
|
22
|
+
)}
|
|
23
|
+
{...props}
|
|
24
|
+
/>
|
|
25
|
+
)
|
|
26
|
+
}
|
|
27
|
+
|
|
28
|
+
const tabsListVariants = cva(
|
|
29
|
+
"group/tabs-list inline-flex w-fit items-center justify-center rounded-lg p-[3px] text-muted-foreground group-data-horizontal/tabs:h-8 group-data-vertical/tabs:h-fit group-data-vertical/tabs:flex-col data-[variant=line]:rounded-none",
|
|
30
|
+
{
|
|
31
|
+
variants: {
|
|
32
|
+
variant: {
|
|
33
|
+
default: "bg-muted",
|
|
34
|
+
line: "gap-1 bg-transparent",
|
|
35
|
+
},
|
|
36
|
+
},
|
|
37
|
+
defaultVariants: {
|
|
38
|
+
variant: "default",
|
|
39
|
+
},
|
|
40
|
+
}
|
|
41
|
+
)
|
|
42
|
+
|
|
43
|
+
function TabsList({
|
|
44
|
+
className,
|
|
45
|
+
variant = "default",
|
|
46
|
+
...props
|
|
47
|
+
}: TabsPrimitive.List.Props & VariantProps<typeof tabsListVariants>) {
|
|
48
|
+
return (
|
|
49
|
+
<TabsPrimitive.List
|
|
50
|
+
data-slot="tabs-list"
|
|
51
|
+
data-variant={variant}
|
|
52
|
+
className={cn(tabsListVariants({ variant }), className)}
|
|
53
|
+
{...props}
|
|
54
|
+
/>
|
|
55
|
+
)
|
|
56
|
+
}
|
|
57
|
+
|
|
58
|
+
function TabsTrigger({ className, ...props }: TabsPrimitive.Tab.Props) {
|
|
59
|
+
return (
|
|
60
|
+
<TabsPrimitive.Tab
|
|
61
|
+
data-slot="tabs-trigger"
|
|
62
|
+
className={cn(
|
|
63
|
+
"relative inline-flex h-[calc(100%-1px)] flex-1 items-center justify-center gap-1.5 rounded-md border border-transparent px-1.5 py-0.5 text-sm font-medium whitespace-nowrap text-foreground/60 transition-[color,background-color,border-color,box-shadow] group-data-vertical/tabs:w-full group-data-vertical/tabs:justify-start hover:text-foreground focus-visible:border-ring focus-visible:ring-[3px] focus-visible:ring-ring/50 focus-visible:outline-1 focus-visible:outline-ring disabled:pointer-events-none disabled:opacity-50 has-data-[icon=inline-end]:pr-1 has-data-[icon=inline-start]:pl-1 aria-disabled:pointer-events-none aria-disabled:opacity-50 dark:text-muted-foreground dark:hover:text-foreground group-data-[variant=default]/tabs-list:data-active:shadow-sm group-data-[variant=line]/tabs-list:data-active:shadow-none [&_svg]:pointer-events-none [&_svg]:shrink-0 [&_svg:not([class*='size-'])]:size-4",
|
|
64
|
+
"group-data-[variant=line]/tabs-list:bg-transparent group-data-[variant=line]/tabs-list:data-active:bg-transparent dark:group-data-[variant=line]/tabs-list:data-active:border-transparent dark:group-data-[variant=line]/tabs-list:data-active:bg-transparent",
|
|
65
|
+
"data-active:bg-background data-active:text-foreground dark:data-active:border-input dark:data-active:bg-input/30 dark:data-active:text-foreground",
|
|
66
|
+
"after:absolute after:bg-foreground after:opacity-0 after:transition-opacity group-data-horizontal/tabs:after:inset-x-0 group-data-horizontal/tabs:after:bottom-[-5px] group-data-horizontal/tabs:after:h-0.5 group-data-vertical/tabs:after:inset-y-0 group-data-vertical/tabs:after:-right-1 group-data-vertical/tabs:after:w-0.5 group-data-[variant=line]/tabs-list:data-active:after:opacity-100",
|
|
67
|
+
className
|
|
68
|
+
)}
|
|
69
|
+
{...props}
|
|
70
|
+
/>
|
|
71
|
+
)
|
|
72
|
+
}
|
|
73
|
+
|
|
74
|
+
function TabsContent({ className, ...props }: TabsPrimitive.Panel.Props) {
|
|
75
|
+
return (
|
|
76
|
+
<TabsPrimitive.Panel
|
|
77
|
+
data-slot="tabs-content"
|
|
78
|
+
className={cn("flex-1 text-sm outline-none focus-visible:ring-[3px] focus-visible:ring-ring/50", className)}
|
|
79
|
+
{...props}
|
|
80
|
+
/>
|
|
81
|
+
)
|
|
82
|
+
}
|
|
83
|
+
|
|
84
|
+
export { Tabs, TabsList, TabsTrigger, TabsContent, tabsListVariants }
|
|
@@ -0,0 +1,22 @@
|
|
|
1
|
+
// Copied by `vantage add ui textarea`. This file is yours to edit.
|
|
2
|
+
// Generated from @squadbase/squadkit registry/ui/textarea.tsx by `pnpm run registry` (in Vantage, edit packages/squadkit, not registry/).
|
|
3
|
+
"use client"
|
|
4
|
+
|
|
5
|
+
import * as React from "react"
|
|
6
|
+
|
|
7
|
+
import { cn } from "@squadbase/vantage/ui"
|
|
8
|
+
|
|
9
|
+
function Textarea({ className, ...props }: React.ComponentProps<"textarea">) {
|
|
10
|
+
return (
|
|
11
|
+
<textarea
|
|
12
|
+
data-slot="textarea"
|
|
13
|
+
className={cn(
|
|
14
|
+
"flex field-sizing-content min-h-16 w-full rounded-lg border border-input bg-transparent px-2.5 py-2 text-base transition-colors outline-none placeholder:text-muted-foreground focus-visible:border-ring focus-visible:ring-3 focus-visible:ring-ring/50 disabled:cursor-not-allowed disabled:bg-input/50 disabled:opacity-50 aria-invalid:border-destructive aria-invalid:ring-3 aria-invalid:ring-destructive/20 md:text-sm dark:bg-input/30 dark:disabled:bg-input/80 dark:aria-invalid:border-destructive/50 dark:aria-invalid:ring-destructive/40",
|
|
15
|
+
className
|
|
16
|
+
)}
|
|
17
|
+
{...props}
|
|
18
|
+
/>
|
|
19
|
+
)
|
|
20
|
+
}
|
|
21
|
+
|
|
22
|
+
export { Textarea }
|