@alfadocs/ui-kit-debug 0.38.0 → 0.40.0
This diff represents the content of publicly available package versions that have been released to one of the supported registries. The information contained in this diff is provided for informational purposes only and reflects changes between package versions as they appear in their respective public registries.
- package/dist/_chunks/{accordion-bSU21uTV.js → accordion-9lJSMMsZ.js} +6 -6
- package/dist/_chunks/accordion-9lJSMMsZ.js.map +1 -0
- package/dist/_chunks/{agenda-tray-By_asPN9.js → agenda-tray-Dyj9ChHC.js} +22 -21
- package/dist/_chunks/agenda-tray-Dyj9ChHC.js.map +1 -0
- package/dist/_chunks/{bmi-calculator-BRUru9QX.js → bmi-calculator-DnEr513I.js} +2 -2
- package/dist/_chunks/{bmi-calculator-BRUru9QX.js.map → bmi-calculator-DnEr513I.js.map} +1 -1
- package/dist/_chunks/{booking-DK_BPHnQ.js → booking-4mCw3Mpl.js} +2 -2
- package/dist/_chunks/{booking-DK_BPHnQ.js.map → booking-4mCw3Mpl.js.map} +1 -1
- package/dist/_chunks/{chart-DnHvmiDX.js → chart-Cbt0_sKv.js} +46 -37
- package/dist/_chunks/chart-Cbt0_sKv.js.map +1 -0
- package/dist/_chunks/{collapsible-CERONory.js → collapsible-X3oaLPU3.js} +5 -5
- package/dist/_chunks/collapsible-X3oaLPU3.js.map +1 -0
- package/dist/_chunks/{document-scanner-CdHQ6lTN.js → document-scanner-CqS_klIr.js} +56 -55
- package/dist/_chunks/document-scanner-CqS_klIr.js.map +1 -0
- package/dist/_chunks/{editable-currency-cell-renderer-DGKuRNVG.js → editable-currency-cell-renderer-DgkCIIcO.js} +2 -2
- package/dist/_chunks/{editable-currency-cell-renderer-DGKuRNVG.js.map → editable-currency-cell-renderer-DgkCIIcO.js.map} +1 -1
- package/dist/_chunks/{file-upload-CnzRcErt.js → file-upload-BosbPDb1.js} +2 -2
- package/dist/_chunks/file-upload-BosbPDb1.js.map +1 -0
- package/dist/_chunks/{freemium-paywall-D1N02Oam.js → freemium-paywall-BAk3a6er.js} +7 -7
- package/dist/_chunks/{freemium-paywall-D1N02Oam.js.map → freemium-paywall-BAk3a6er.js.map} +1 -1
- package/dist/_chunks/header-settings-CBLwUK6t.js +244 -0
- package/dist/_chunks/header-settings-CBLwUK6t.js.map +1 -0
- package/dist/_chunks/{map-view-vD5pvWs9.js → map-view-qJLybrmN.js} +2 -2
- package/dist/_chunks/{map-view-vD5pvWs9.js.map → map-view-qJLybrmN.js.map} +1 -1
- package/dist/_chunks/marketplace-app-shell-BlxVizU4.js +296 -0
- package/dist/_chunks/marketplace-app-shell-BlxVizU4.js.map +1 -0
- package/dist/_chunks/{message-card-BbRhZkDI.js → message-card-DSPw5ghw.js} +20 -19
- package/dist/_chunks/message-card-DSPw5ghw.js.map +1 -0
- package/dist/_chunks/{message-tray-B762TKuv.js → message-tray-hSQff9u4.js} +3 -3
- package/dist/_chunks/message-tray-hSQff9u4.js.map +1 -0
- package/dist/_chunks/{notification-card-DMdO4g54.js → notification-card-CObnGdJu.js} +22 -21
- package/dist/_chunks/notification-card-CObnGdJu.js.map +1 -0
- package/dist/_chunks/{notification-tray-Dl3FTleW.js → notification-tray-BWHDIjgd.js} +2 -2
- package/dist/_chunks/{notification-tray-Dl3FTleW.js.map → notification-tray-BWHDIjgd.js.map} +1 -1
- package/dist/_chunks/{otp-input-CDTWT5EK.js → otp-input-CMphfBxZ.js} +70 -71
- package/dist/_chunks/otp-input-CMphfBxZ.js.map +1 -0
- package/dist/_chunks/{patient-shell-Bz3CdO84.js → patient-shell-DF81lALv.js} +36 -35
- package/dist/_chunks/{patient-shell-Bz3CdO84.js.map → patient-shell-DF81lALv.js.map} +1 -1
- package/dist/_chunks/{payment-form-D5rgnZu7.js → payment-form-Dy3WIIsC.js} +18 -18
- package/dist/_chunks/payment-form-Dy3WIIsC.js.map +1 -0
- package/dist/_chunks/{pdf-viewer-DvtEHcEP.js → pdf-viewer-Cy6Ul3hZ.js} +2 -2
- package/dist/_chunks/pdf-viewer-Cy6Ul3hZ.js.map +1 -0
- package/dist/_chunks/{practice-results-C8ciLQap.js → practice-results-C0d4IL5E.js} +2 -2
- package/dist/_chunks/{practice-results-C8ciLQap.js.map → practice-results-C0d4IL5E.js.map} +1 -1
- package/dist/_chunks/{public-footer.agent-zw1vFin_.js → public-footer.agent-okt8ZRc5.js} +2 -2
- package/dist/_chunks/{public-footer.agent-zw1vFin_.js.map → public-footer.agent-okt8ZRc5.js.map} +1 -1
- package/dist/_chunks/{reviews-panel-Dow8Dzoa.js → reviews-panel-CPrXu5TX.js} +2 -2
- package/dist/_chunks/{reviews-panel-Dow8Dzoa.js.map → reviews-panel-CPrXu5TX.js.map} +1 -1
- package/dist/_chunks/{sidebar-BbR8f6oe.js → sidebar-_vJXI9rB.js} +2 -2
- package/dist/_chunks/{sidebar-BbR8f6oe.js.map → sidebar-_vJXI9rB.js.map} +1 -1
- package/dist/_chunks/sign-document-CpLDZ6Db.js +316 -0
- package/dist/_chunks/sign-document-CpLDZ6Db.js.map +1 -0
- package/dist/_chunks/{signature-capture-C-fF71xI.js → signature-capture-DoiBd6i3.js} +138 -143
- package/dist/_chunks/signature-capture-DoiBd6i3.js.map +1 -0
- package/dist/_chunks/{sparkline-DEROcSl0.js → sparkline-DGhCSw8M.js} +55 -46
- package/dist/_chunks/sparkline-DGhCSw8M.js.map +1 -0
- package/dist/_chunks/{stepper-accordion-BfS6lUB9.js → stepper-accordion-Dki6r9ZE.js} +2 -2
- package/dist/_chunks/stepper-accordion-Dki6r9ZE.js.map +1 -0
- package/dist/_chunks/{tag-CyoaEmf_.js → tag-CdA0s_VV.js} +16 -16
- package/dist/_chunks/tag-CdA0s_VV.js.map +1 -0
- package/dist/_chunks/{task-card-BUVMh6HN.js → task-card-CPyQ5AXC.js} +6 -5
- package/dist/_chunks/task-card-CPyQ5AXC.js.map +1 -0
- package/dist/_chunks/{task-tray-DRK0b0Qb.js → task-tray-B8jFv5FV.js} +36 -35
- package/dist/_chunks/task-tray-B8jFv5FV.js.map +1 -0
- package/dist/_chunks/{transcript-panel-DyhTpAP7.js → transcript-panel-CR7VY1uw.js} +8 -7
- package/dist/_chunks/transcript-panel-CR7VY1uw.js.map +1 -0
- package/dist/_chunks/{warning-stack-bDicCvxs.js → warning-stack-DNR3-IbP.js} +17 -16
- package/dist/_chunks/warning-stack-DNR3-IbP.js.map +1 -0
- package/dist/_chunks/{workflow-map-uSiHbOWQ.js → workflow-map-C3gB0FvB.js} +3 -2
- package/dist/_chunks/{workflow-map-uSiHbOWQ.js.map → workflow-map-C3gB0FvB.js.map} +1 -1
- package/dist/agent-catalog.json +39 -1
- package/dist/brand/product-lockup/product-lockup.d.ts.map +1 -1
- package/dist/components/accordion/index.js +1 -1
- package/dist/components/agenda-tray/agenda-tray.d.ts.map +1 -1
- package/dist/components/agenda-tray/index.js +1 -1
- package/dist/components/bmi-calculator/index.js +1 -1
- package/dist/components/booking/index.js +1 -1
- package/dist/components/chart/chart.d.ts +1 -1
- package/dist/components/chart/chart.d.ts.map +1 -1
- package/dist/components/chart/index.js +1 -1
- package/dist/components/collapsible/index.js +1 -1
- package/dist/components/data-table/index.js +1 -1
- package/dist/components/document-scanner/document-scanner.d.ts.map +1 -1
- package/dist/components/document-scanner/index.js +1 -1
- package/dist/components/file-upload/index.js +1 -1
- package/dist/components/freemium-paywall/index.js +1 -1
- package/dist/components/header-settings/header-settings.agent.d.ts +4 -0
- package/dist/components/header-settings/header-settings.agent.d.ts.map +1 -0
- package/dist/components/header-settings/header-settings.d.ts +36 -0
- package/dist/components/header-settings/header-settings.d.ts.map +1 -0
- package/dist/components/header-settings/index.d.ts +2 -0
- package/dist/components/header-settings/index.d.ts.map +1 -0
- package/dist/components/header-settings/index.js +2 -241
- package/dist/components/header-settings/index.js.map +1 -1
- package/dist/components/index.d.ts +1 -0
- package/dist/components/index.d.ts.map +1 -1
- package/dist/components/locale-picker/locale-picker.agent.d.ts +4 -0
- package/dist/components/locale-picker/locale-picker.agent.d.ts.map +1 -0
- package/dist/components/locale-picker/locale-picker.d.ts +80 -0
- package/dist/components/locale-picker/locale-picker.d.ts.map +1 -0
- package/dist/components/map-view/index.js +1 -1
- package/dist/components/message-card/index.js +1 -1
- package/dist/components/message-card/message-card.d.ts.map +1 -1
- package/dist/components/message-tray/index.js +1 -1
- package/dist/components/notification-card/index.js +1 -1
- package/dist/components/notification-card/notification-card.d.ts.map +1 -1
- package/dist/components/notification-tray/index.js +1 -1
- package/dist/components/otp-input/index.d.ts +1 -1
- package/dist/components/otp-input/index.d.ts.map +1 -1
- package/dist/components/otp-input/index.js +1 -1
- package/dist/components/otp-input/otp-input.d.ts +1 -1
- package/dist/components/otp-input/otp-input.d.ts.map +1 -1
- package/dist/components/payment-form/index.js +1 -1
- package/dist/components/pdf-viewer/index.js +1 -1
- package/dist/components/practice-results/index.js +1 -1
- package/dist/components/public-footer/index.js +1 -1
- package/dist/components/reviews-panel/index.js +1 -1
- package/dist/components/sidebar/index.js +1 -1
- package/dist/components/sign-document/index.d.ts +4 -0
- package/dist/components/sign-document/index.d.ts.map +1 -0
- package/dist/components/sign-document/index.js +6 -0
- package/dist/components/sign-document/index.js.map +1 -0
- package/dist/components/sign-document/sign-document.agent.d.ts +4 -0
- package/dist/components/sign-document/sign-document.agent.d.ts.map +1 -0
- package/dist/components/sign-document/sign-document.d.ts +47 -0
- package/dist/components/sign-document/sign-document.d.ts.map +1 -0
- package/dist/components/signature-capture/index.js +1 -1
- package/dist/components/signature-capture/signature-capture.d.ts.map +1 -1
- package/dist/components/sparkline/index.js +1 -1
- package/dist/components/sparkline/sparkline.d.ts +1 -1
- package/dist/components/sparkline/sparkline.d.ts.map +1 -1
- package/dist/components/stepper-accordion/index.js +1 -1
- package/dist/components/tag/index.js +1 -1
- package/dist/components/task-card/index.js +1 -1
- package/dist/components/task-card/task-card.d.ts.map +1 -1
- package/dist/components/task-tray/index.js +1 -1
- package/dist/components/task-tray/task-tray.d.ts.map +1 -1
- package/dist/components/transcript-panel/index.js +1 -1
- package/dist/components/transcript-panel/transcript-panel.d.ts.map +1 -1
- package/dist/components/warning-stack/index.js +1 -1
- package/dist/components/warning-stack/warning-stack.d.ts.map +1 -1
- package/dist/components/workflow/index.js +1 -1
- package/dist/components/workflow/workflow-map.d.ts.map +1 -1
- package/dist/i18n/locale-meta.d.ts +56 -0
- package/dist/i18n/locale-meta.d.ts.map +1 -0
- package/dist/i18n/locales/ar.d.ts +22 -0
- package/dist/i18n/locales/ar.d.ts.map +1 -1
- package/dist/i18n/locales/ar.js +22 -0
- package/dist/i18n/locales/ar.js.map +1 -1
- package/dist/i18n/locales/de.d.ts +22 -0
- package/dist/i18n/locales/de.d.ts.map +1 -1
- package/dist/i18n/locales/de.js +22 -0
- package/dist/i18n/locales/de.js.map +1 -1
- package/dist/i18n/locales/el.d.ts +22 -0
- package/dist/i18n/locales/el.d.ts.map +1 -1
- package/dist/i18n/locales/el.js +22 -0
- package/dist/i18n/locales/el.js.map +1 -1
- package/dist/i18n/locales/en.d.ts +22 -0
- package/dist/i18n/locales/en.d.ts.map +1 -1
- package/dist/i18n/locales/en.js +22 -0
- package/dist/i18n/locales/en.js.map +1 -1
- package/dist/i18n/locales/es.d.ts +22 -0
- package/dist/i18n/locales/es.d.ts.map +1 -1
- package/dist/i18n/locales/es.js +22 -0
- package/dist/i18n/locales/es.js.map +1 -1
- package/dist/i18n/locales/fr.d.ts +22 -0
- package/dist/i18n/locales/fr.d.ts.map +1 -1
- package/dist/i18n/locales/fr.js +22 -0
- package/dist/i18n/locales/fr.js.map +1 -1
- package/dist/i18n/locales/hi.d.ts +22 -0
- package/dist/i18n/locales/hi.d.ts.map +1 -1
- package/dist/i18n/locales/hi.js +22 -0
- package/dist/i18n/locales/hi.js.map +1 -1
- package/dist/i18n/locales/it.d.ts +22 -0
- package/dist/i18n/locales/it.d.ts.map +1 -1
- package/dist/i18n/locales/it.js +22 -0
- package/dist/i18n/locales/it.js.map +1 -1
- package/dist/i18n/locales/ja.d.ts +22 -0
- package/dist/i18n/locales/ja.d.ts.map +1 -1
- package/dist/i18n/locales/ja.js +22 -0
- package/dist/i18n/locales/ja.js.map +1 -1
- package/dist/i18n/locales/nl.d.ts +22 -0
- package/dist/i18n/locales/nl.d.ts.map +1 -1
- package/dist/i18n/locales/nl.js +22 -0
- package/dist/i18n/locales/nl.js.map +1 -1
- package/dist/i18n/locales/pl.d.ts +22 -0
- package/dist/i18n/locales/pl.d.ts.map +1 -1
- package/dist/i18n/locales/pl.js +22 -0
- package/dist/i18n/locales/pl.js.map +1 -1
- package/dist/i18n/locales/pt.d.ts +22 -0
- package/dist/i18n/locales/pt.d.ts.map +1 -1
- package/dist/i18n/locales/pt.js +22 -0
- package/dist/i18n/locales/pt.js.map +1 -1
- package/dist/i18n/locales/ro.d.ts +22 -0
- package/dist/i18n/locales/ro.d.ts.map +1 -1
- package/dist/i18n/locales/ro.js +22 -0
- package/dist/i18n/locales/ro.js.map +1 -1
- package/dist/i18n/locales/ru.d.ts +22 -0
- package/dist/i18n/locales/ru.d.ts.map +1 -1
- package/dist/i18n/locales/ru.js +22 -0
- package/dist/i18n/locales/ru.js.map +1 -1
- package/dist/i18n/locales/sq.d.ts +22 -0
- package/dist/i18n/locales/sq.d.ts.map +1 -1
- package/dist/i18n/locales/sq.js +22 -0
- package/dist/i18n/locales/sq.js.map +1 -1
- package/dist/i18n/locales/sv.d.ts +22 -0
- package/dist/i18n/locales/sv.d.ts.map +1 -1
- package/dist/i18n/locales/sv.js +22 -0
- package/dist/i18n/locales/sv.js.map +1 -1
- package/dist/i18n/locales/tr.d.ts +22 -0
- package/dist/i18n/locales/tr.d.ts.map +1 -1
- package/dist/i18n/locales/tr.js +22 -0
- package/dist/i18n/locales/tr.js.map +1 -1
- package/dist/i18n/locales/zh.d.ts +22 -0
- package/dist/i18n/locales/zh.d.ts.map +1 -1
- package/dist/i18n/locales/zh.js +22 -0
- package/dist/i18n/locales/zh.js.map +1 -1
- package/dist/index.js +110 -107
- package/dist/index.js.map +1 -1
- package/dist/locales/ar.json +22 -0
- package/dist/locales/de.json +22 -0
- package/dist/locales/el.json +22 -0
- package/dist/locales/en.json +22 -0
- package/dist/locales/es.json +22 -0
- package/dist/locales/fr.json +22 -0
- package/dist/locales/hi.json +22 -0
- package/dist/locales/it.json +22 -0
- package/dist/locales/ja.json +22 -0
- package/dist/locales/nl.json +22 -0
- package/dist/locales/pl.json +22 -0
- package/dist/locales/pt.json +22 -0
- package/dist/locales/ro.json +22 -0
- package/dist/locales/ru.json +22 -0
- package/dist/locales/sq.json +22 -0
- package/dist/locales/sv.json +22 -0
- package/dist/locales/tr.json +22 -0
- package/dist/locales/zh.json +22 -0
- package/dist/patterns/marketplace-app-shell/index.js +1 -1
- package/dist/patterns/marketplace-app-shell/marketplace-app-shell.d.ts +12 -8
- package/dist/patterns/marketplace-app-shell/marketplace-app-shell.d.ts.map +1 -1
- package/dist/patterns/patient-shell/index.js +1 -1
- package/dist/patterns/patient-shell/patient-shell.d.ts.map +1 -1
- package/dist/tokens.css +1 -1
- package/package.json +5 -1
- package/dist/_chunks/accordion-bSU21uTV.js.map +0 -1
- package/dist/_chunks/agenda-tray-By_asPN9.js.map +0 -1
- package/dist/_chunks/chart-DnHvmiDX.js.map +0 -1
- package/dist/_chunks/collapsible-CERONory.js.map +0 -1
- package/dist/_chunks/document-scanner-CdHQ6lTN.js.map +0 -1
- package/dist/_chunks/file-upload-CnzRcErt.js.map +0 -1
- package/dist/_chunks/marketplace-app-shell-BnClrL2B.js +0 -295
- package/dist/_chunks/marketplace-app-shell-BnClrL2B.js.map +0 -1
- package/dist/_chunks/message-card-BbRhZkDI.js.map +0 -1
- package/dist/_chunks/message-tray-B762TKuv.js.map +0 -1
- package/dist/_chunks/notification-card-DMdO4g54.js.map +0 -1
- package/dist/_chunks/otp-input-CDTWT5EK.js.map +0 -1
- package/dist/_chunks/payment-form-D5rgnZu7.js.map +0 -1
- package/dist/_chunks/pdf-viewer-DvtEHcEP.js.map +0 -1
- package/dist/_chunks/signature-capture-C-fF71xI.js.map +0 -1
- package/dist/_chunks/sparkline-DEROcSl0.js.map +0 -1
- package/dist/_chunks/stepper-accordion-BfS6lUB9.js.map +0 -1
- package/dist/_chunks/tag-CyoaEmf_.js.map +0 -1
- package/dist/_chunks/task-card-BUVMh6HN.js.map +0 -1
- package/dist/_chunks/task-tray-DRK0b0Qb.js.map +0 -1
- package/dist/_chunks/transcript-panel-DyhTpAP7.js.map +0 -1
- package/dist/_chunks/warning-stack-bDicCvxs.js.map +0 -1
|
@@ -1,9 +1,9 @@
|
|
|
1
|
-
import { jsx as
|
|
2
|
-
import { forwardRef as j, useId as G, useMemo as
|
|
1
|
+
import { jsx as v, jsxs as P } from "react/jsx-runtime";
|
|
2
|
+
import { forwardRef as j, useId as G, useMemo as w, useRef as V, useState as A, useEffect as H, useImperativeHandle as Z } from "react";
|
|
3
3
|
import { c as $ } from "./index-D2ZczOXr.js";
|
|
4
4
|
import { useTranslation as q } from "react-i18next";
|
|
5
5
|
import J from "react-apexcharts";
|
|
6
|
-
import
|
|
6
|
+
import R from "apexcharts";
|
|
7
7
|
import { g as D, u as K } from "./apexcharts-theme-BJigns_V.js";
|
|
8
8
|
import { u as Q } from "./registry-nPAVE19X.js";
|
|
9
9
|
function X(n) {
|
|
@@ -15,8 +15,8 @@ function X(n) {
|
|
|
15
15
|
const o = s - a;
|
|
16
16
|
i += o * (n[s] - c), l += o * o;
|
|
17
17
|
}
|
|
18
|
-
const d = l === 0 ? 0 : i / l,
|
|
19
|
-
return { slope: d, direction:
|
|
18
|
+
const d = l === 0 ? 0 : i / l, k = 0.01 * (Math.max(...n) - Math.min(...n) || 1), u = Math.abs(d) < k ? "steady" : d > 0 ? "increasing" : "decreasing";
|
|
19
|
+
return { slope: d, direction: u };
|
|
20
20
|
}
|
|
21
21
|
const Y = {
|
|
22
22
|
id: "sparkline",
|
|
@@ -50,7 +50,10 @@ const Y = {
|
|
|
50
50
|
size: {
|
|
51
51
|
xs: "ds:h-6",
|
|
52
52
|
sm: "ds:h-8",
|
|
53
|
-
md: "ds:h-10"
|
|
53
|
+
md: "ds:h-10",
|
|
54
|
+
// Applied when an explicit `height` prop is given: the wrapper
|
|
55
|
+
// grows with the svg instead of clipping at the size's fixed height.
|
|
56
|
+
auto: ""
|
|
54
57
|
}
|
|
55
58
|
},
|
|
56
59
|
defaultVariants: { size: "md" }
|
|
@@ -76,26 +79,26 @@ const ne = j(
|
|
|
76
79
|
color: l,
|
|
77
80
|
showEndpoint: d = !1,
|
|
78
81
|
showTooltip: M = !1,
|
|
79
|
-
width:
|
|
80
|
-
height:
|
|
82
|
+
width: k,
|
|
83
|
+
height: u,
|
|
81
84
|
className: s,
|
|
82
85
|
...o
|
|
83
86
|
}, _) => {
|
|
84
|
-
var
|
|
85
|
-
const { t:
|
|
87
|
+
var S;
|
|
88
|
+
const { t: m, i18n: C } = q(), T = G(), p = w(
|
|
86
89
|
() => `sparkline-${T.replace(/[^a-zA-Z0-9-_]/g, "")}`,
|
|
87
90
|
[T]
|
|
88
|
-
),
|
|
91
|
+
), h = V(null), [O, E] = A(0), { direction: y } = X(t), z = w(() => {
|
|
89
92
|
if (t.length === 0)
|
|
90
|
-
return
|
|
91
|
-
const e = (
|
|
93
|
+
return m("sparkline.noData", "No data");
|
|
94
|
+
const e = (b) => new Intl.NumberFormat(C.language).format(b), r = m(`sparkline.direction.${y}`), g = {
|
|
92
95
|
min: e(Math.min(...t)),
|
|
93
96
|
max: e(Math.max(...t)),
|
|
94
97
|
current: e(t[t.length - 1]),
|
|
95
98
|
direction: r
|
|
96
99
|
};
|
|
97
|
-
return i ?
|
|
98
|
-
}, [t, i, y, C.language,
|
|
100
|
+
return i ? m("sparkline.summary", { label: i, ...g }) : m("sparkline.summaryNoLabel", g);
|
|
101
|
+
}, [t, i, y, C.language, m]), [f, W] = A(
|
|
99
102
|
() => {
|
|
100
103
|
try {
|
|
101
104
|
return D();
|
|
@@ -104,7 +107,7 @@ const ne = j(
|
|
|
104
107
|
}
|
|
105
108
|
}
|
|
106
109
|
);
|
|
107
|
-
|
|
110
|
+
H(() => {
|
|
108
111
|
let e;
|
|
109
112
|
const r = new MutationObserver(() => {
|
|
110
113
|
clearTimeout(e), e = setTimeout(() => {
|
|
@@ -120,57 +123,60 @@ const ne = j(
|
|
|
120
123
|
}), () => {
|
|
121
124
|
clearTimeout(e), r.disconnect();
|
|
122
125
|
};
|
|
123
|
-
}, []),
|
|
124
|
-
const e =
|
|
126
|
+
}, []), H(() => {
|
|
127
|
+
const e = h.current;
|
|
125
128
|
if (!e) return;
|
|
126
|
-
const r = new ResizeObserver((
|
|
127
|
-
const
|
|
128
|
-
|
|
129
|
+
const r = new ResizeObserver((g) => {
|
|
130
|
+
const b = g[0];
|
|
131
|
+
b && E(Math.floor(b.contentRect.width));
|
|
129
132
|
});
|
|
130
133
|
return r.observe(e), () => r.disconnect();
|
|
131
|
-
}, []), K(
|
|
132
|
-
const x =
|
|
134
|
+
}, []), K(h);
|
|
135
|
+
const x = w(
|
|
133
136
|
() => ({
|
|
134
137
|
updateSeries(e) {
|
|
135
138
|
var r;
|
|
136
|
-
(r =
|
|
139
|
+
(r = R.getChartByID(p)) == null || r.updateSeries([{ data: e }]);
|
|
137
140
|
},
|
|
138
141
|
updateOptions(e) {
|
|
139
142
|
var r;
|
|
140
|
-
(r =
|
|
143
|
+
(r = R.getChartByID(p)) == null || r.updateOptions(e);
|
|
141
144
|
},
|
|
142
145
|
async dataURI() {
|
|
143
|
-
const e =
|
|
146
|
+
const e = R.getChartByID(p);
|
|
144
147
|
return e ? (await e.dataURI()).imgURI : "";
|
|
145
148
|
}
|
|
146
149
|
}),
|
|
147
|
-
[
|
|
150
|
+
[p]
|
|
148
151
|
);
|
|
149
152
|
Z(_, () => x, [x]), Q(Y, x, n);
|
|
150
|
-
const I = l ?? ((
|
|
153
|
+
const I = l ?? ((S = f.colors) == null ? void 0 : S[0]) ?? "currentColor";
|
|
151
154
|
if (t.length === 0)
|
|
152
|
-
return /* @__PURE__ */
|
|
155
|
+
return /* @__PURE__ */ v(
|
|
153
156
|
"div",
|
|
154
157
|
{
|
|
155
|
-
ref:
|
|
158
|
+
ref: h,
|
|
156
159
|
role: "img",
|
|
157
|
-
"aria-label":
|
|
160
|
+
"aria-label": z,
|
|
158
161
|
dir: "ltr",
|
|
159
|
-
className: U({
|
|
162
|
+
className: U({
|
|
163
|
+
size: u !== void 0 ? "auto" : c,
|
|
164
|
+
className: s
|
|
165
|
+
}),
|
|
160
166
|
...o
|
|
161
167
|
}
|
|
162
168
|
);
|
|
163
|
-
const
|
|
164
|
-
...
|
|
169
|
+
const N = re(), B = {
|
|
170
|
+
...f,
|
|
165
171
|
chart: {
|
|
166
|
-
...
|
|
167
|
-
id:
|
|
172
|
+
...f.chart,
|
|
173
|
+
id: p,
|
|
168
174
|
type: a,
|
|
169
175
|
sparkline: { enabled: !0 },
|
|
170
176
|
toolbar: { show: !1 },
|
|
171
177
|
animations: {
|
|
172
|
-
enabled: !
|
|
173
|
-
dynamicAnimation: { enabled: !
|
|
178
|
+
enabled: !N,
|
|
179
|
+
dynamicAnimation: { enabled: !N }
|
|
174
180
|
},
|
|
175
181
|
zoom: { enabled: !1 },
|
|
176
182
|
parentHeightOffset: 0
|
|
@@ -200,26 +206,29 @@ const ne = j(
|
|
|
200
206
|
]
|
|
201
207
|
} : { size: 0 },
|
|
202
208
|
grid: {
|
|
203
|
-
...
|
|
209
|
+
...f.grid,
|
|
204
210
|
show: !1,
|
|
205
211
|
// ApexCharts grid.padding uses physical keys (not CSS logical properties).
|
|
206
212
|
// The chart wrapper enforces dir="ltr" so these always resolve correctly.
|
|
207
213
|
padding: { top: 2, right: 2, bottom: 2, left: 2 }
|
|
208
214
|
}
|
|
209
|
-
}, F =
|
|
215
|
+
}, F = k ?? (O > 0 ? O : "100%"), L = u ?? te[c ?? "md"];
|
|
210
216
|
return /* @__PURE__ */ P(
|
|
211
217
|
"div",
|
|
212
218
|
{
|
|
213
|
-
ref:
|
|
219
|
+
ref: h,
|
|
214
220
|
role: "img",
|
|
215
|
-
"aria-label":
|
|
221
|
+
"aria-label": z,
|
|
216
222
|
dir: "ltr",
|
|
217
|
-
className: U({
|
|
223
|
+
className: U({
|
|
224
|
+
size: u !== void 0 ? "auto" : c,
|
|
225
|
+
className: s
|
|
226
|
+
}),
|
|
218
227
|
"data-component": "sparkline",
|
|
219
228
|
"data-component-id": n,
|
|
220
229
|
...o,
|
|
221
230
|
children: [
|
|
222
|
-
/* @__PURE__ */
|
|
231
|
+
/* @__PURE__ */ v(
|
|
223
232
|
J,
|
|
224
233
|
{
|
|
225
234
|
type: a,
|
|
@@ -230,7 +239,7 @@ const ne = j(
|
|
|
230
239
|
"aria-hidden": "true"
|
|
231
240
|
}
|
|
232
241
|
),
|
|
233
|
-
d && /* @__PURE__ */
|
|
242
|
+
d && /* @__PURE__ */ v(
|
|
234
243
|
"span",
|
|
235
244
|
{
|
|
236
245
|
"aria-hidden": "true",
|
|
@@ -249,4 +258,4 @@ export {
|
|
|
249
258
|
Y as s,
|
|
250
259
|
X as u
|
|
251
260
|
};
|
|
252
|
-
//# sourceMappingURL=sparkline-
|
|
261
|
+
//# sourceMappingURL=sparkline-DGhCSw8M.js.map
|
|
@@ -0,0 +1 @@
|
|
|
1
|
+
{"version":3,"file":"sparkline-DGhCSw8M.js","sources":["../../src/components/sparkline/use-linear-trend.ts","../../src/components/sparkline/sparkline.agent.ts","../../src/components/sparkline/sparkline.tsx"],"sourcesContent":["export type TrendDirection = 'increasing' | 'decreasing' | 'steady';\n\nexport interface LinearTrendResult {\n slope: number;\n direction: TrendDirection;\n}\n\nexport function useLinearTrend(data: number[]): LinearTrendResult {\n if (data.length < 2) {\n return { slope: 0, direction: 'steady' };\n }\n\n const n = data.length;\n const xMean = (n - 1) / 2;\n const yMean = data.reduce((sum, y) => sum + y, 0) / n;\n\n let numerator = 0;\n let denominator = 0;\n\n for (let i = 0; i < n; i++) {\n const dx = i - xMean;\n numerator += dx * (data[i] - yMean);\n denominator += dx * dx;\n }\n\n const slope = denominator === 0 ? 0 : numerator / denominator;\n const range = Math.max(...data) - Math.min(...data);\n const threshold = 0.01 * (range || 1);\n\n const direction: TrendDirection =\n Math.abs(slope) < threshold\n ? 'steady'\n : slope > 0\n ? 'increasing'\n : 'decreasing';\n\n return { slope, direction };\n}\n","import type { AgentAdapter } from '../../agent/types';\nimport type { SparklineHandle } from './sparkline';\n\nexport const sparklineAgent: AgentAdapter<SparklineHandle> = {\n id: 'sparkline',\n capabilities: [],\n state: {},\n actions: {\n update_series: {\n safety: 'read',\n argsType: '{ data: number[] }',\n description: 'Replace the sparkline data without remounting.',\n invoke: (handle, args: { data: number[] }) => {\n handle.updateSeries(args.data);\n },\n },\n export_png: {\n safety: 'read',\n description: 'Return a PNG data URI of the sparkline.',\n invoke: (handle) => handle.dataURI(),\n },\n },\n domHooks: {\n root: { attr: 'data-component', value: 'sparkline' },\n instanceId: {\n attr: 'data-component-id',\n sourceProp: 'id',\n description: 'Sourced from the id prop.',\n },\n },\n};\n","import {\n forwardRef,\n useEffect,\n useId,\n useImperativeHandle,\n useMemo,\n useRef,\n useState,\n type HTMLAttributes,\n} from 'react';\nimport { cva, type VariantProps } from 'class-variance-authority';\nimport { useTranslation } from 'react-i18next';\nimport ReactApexChart from 'react-apexcharts';\nimport ApexCharts from 'apexcharts';\nimport { getApexChartsTheme } from '../../tokens/apexcharts-theme';\nimport { useNeutraliseHiddenFocus } from '../_shared/use-neutralize-hidden-focus';\nimport { useLinearTrend } from './use-linear-trend';\nimport { useAgentRegistration } from '../../agent/registry';\nimport { sparklineAgent } from './sparkline.agent';\n\n/* ------------------------------------------------------------------ */\n/* CVA */\n/* ------------------------------------------------------------------ */\n\nconst sparklineVariants = cva('ds:relative ds:inline-block ds:w-full', {\n variants: {\n size: {\n xs: 'ds:h-6',\n sm: 'ds:h-8',\n md: 'ds:h-10',\n // Applied when an explicit `height` prop is given: the wrapper\n // grows with the svg instead of clipping at the size's fixed height.\n auto: '',\n },\n },\n defaultVariants: { size: 'md' },\n});\n\n/* ------------------------------------------------------------------ */\n/* Constants */\n/* ------------------------------------------------------------------ */\n\nconst DIRECTION_ARROW = {\n increasing: '↑',\n decreasing: '↓',\n steady: '→',\n} as const;\n\nconst SIZE_HEIGHT: Record<'xs' | 'sm' | 'md', number> = {\n xs: 24,\n sm: 32,\n md: 40,\n};\n\nfunction prefersReducedMotion(): boolean {\n return (\n typeof window !== 'undefined' &&\n window.matchMedia('(prefers-reduced-motion: reduce)').matches\n );\n}\n\n/* ------------------------------------------------------------------ */\n/* Public types */\n/* ------------------------------------------------------------------ */\n\nexport interface SparklineHandle {\n updateSeries: (data: number[]) => void;\n updateOptions: (opts: ApexCharts.ApexOptions) => void;\n dataURI: () => Promise<string>;\n}\n\nexport interface SparklineProps\n extends\n Omit<HTMLAttributes<HTMLDivElement>, 'role' | 'children'>,\n VariantProps<typeof sparklineVariants> {\n /** Array of numeric data points */\n data: number[];\n /** Chart visual style */\n variant?: 'line' | 'bar' | 'area';\n /** Size preset */\n size?: 'xs' | 'sm' | 'md';\n /** Accessible label prefix, e.g. \"Revenue, 30 days\" */\n label?: string;\n /** Stroke / bar colour override — defaults to var(--primary) via bridge */\n color?: string;\n /** Show end-point dot with trend direction arrow */\n showEndpoint?: boolean;\n /**\n * Show Apex's hover tooltip with the data point value. Defaults to\n * `false` — sparklines are intentionally minimal — opt in when the\n * sparkline is large enough to be a primary metric surface (e.g.\n * dashboard widgets) and the user benefits from per-point readout.\n */\n showTooltip?: boolean;\n /** Width override — defaults to 100% of container */\n width?: string | number;\n /** Height override — defaults to the size variant height */\n height?: string | number;\n}\n\n/* ------------------------------------------------------------------ */\n/* Sparkline component */\n/* ------------------------------------------------------------------ */\n\nexport const Sparkline = forwardRef<SparklineHandle, SparklineProps>(\n (\n {\n id,\n data,\n variant = 'line',\n size = 'md',\n label,\n color,\n showEndpoint = false,\n showTooltip = false,\n width,\n height,\n className,\n ...props\n },\n ref,\n ) => {\n const { t, i18n } = useTranslation();\n const rawId = useId();\n const chartId = useMemo(\n () => `sparkline-${rawId.replace(/[^a-zA-Z0-9-_]/g, '')}`,\n [rawId],\n );\n const wrapperRef = useRef<HTMLDivElement>(null);\n const [containerWidth, setContainerWidth] = useState(0);\n\n const { direction } = useLinearTrend(data);\n\n /* ---- accessible summary ---------------------------------------- */\n const ariaLabel = useMemo(() => {\n if (data.length === 0) {\n return t('sparkline.noData', 'No data');\n }\n const fmt = (n: number) => new Intl.NumberFormat(i18n.language).format(n);\n const dirText = t(`sparkline.direction.${direction}`);\n const nums = {\n min: fmt(Math.min(...data)),\n max: fmt(Math.max(...data)),\n current: fmt(data[data.length - 1]),\n direction: dirText,\n };\n if (label) {\n return t('sparkline.summary', { label, ...nums });\n }\n return t('sparkline.summaryNoLabel', nums);\n }, [data, label, direction, i18n.language, t]);\n\n /* ---- theme-reactive state -------------------------------------- */\n const [themeOptions, setThemeOptions] = useState<ApexCharts.ApexOptions>(\n () => {\n try {\n return getApexChartsTheme();\n } catch {\n return {};\n }\n },\n );\n\n /* ---- MutationObserver: re-read theme on class change ----------- */\n useEffect(() => {\n let timer: ReturnType<typeof setTimeout>;\n const observer = new MutationObserver(() => {\n clearTimeout(timer);\n timer = setTimeout(() => {\n try {\n setThemeOptions(getApexChartsTheme());\n } catch {\n /* no-op in non-browser environments */\n }\n }, 50);\n });\n observer.observe(document.documentElement, {\n attributes: true,\n attributeFilter: ['class'],\n });\n return () => {\n clearTimeout(timer);\n observer.disconnect();\n };\n }, []);\n\n /* ---- ResizeObserver: track container width -------------------- */\n useEffect(() => {\n const el = wrapperRef.current;\n if (!el) return;\n const ro = new ResizeObserver((entries) => {\n const entry = entries[0];\n if (entry) setContainerWidth(Math.floor(entry.contentRect.width));\n });\n ro.observe(el);\n return () => ro.disconnect();\n }, []);\n\n /* ApexCharts injects focusable canvases inside the `aria-hidden` */\n /* chart wrapper. Neutralise their tabindex so axe's */\n /* `aria-hidden-focus` rule passes. Shared hook — same fix in */\n /* `Chart` (full apex) and the calendar's mirror events. */\n useNeutraliseHiddenFocus(wrapperRef);\n\n /* ---- imperative handle ---------------------------------------- */\n const agentHandle = useMemo<SparklineHandle>(\n () => ({\n updateSeries(newData: number[]) {\n ApexCharts.getChartByID(chartId)?.updateSeries([{ data: newData }]);\n },\n updateOptions(opts: ApexCharts.ApexOptions) {\n ApexCharts.getChartByID(chartId)?.updateOptions(opts);\n },\n async dataURI(): Promise<string> {\n const instance = ApexCharts.getChartByID(chartId);\n if (!instance) return '';\n const result = await instance.dataURI();\n return (result as { imgURI: string }).imgURI;\n },\n }),\n [chartId],\n );\n useImperativeHandle(ref, () => agentHandle, [agentHandle]);\n useAgentRegistration(sparklineAgent, agentHandle, id);\n\n /* ---- resolve color -------------------------------------------- */\n const resolvedColor = color ?? themeOptions.colors?.[0] ?? 'currentColor';\n\n /* ---- empty state ---------------------------------------------- */\n if (data.length === 0) {\n return (\n <div\n ref={wrapperRef}\n role=\"img\"\n aria-label={ariaLabel}\n dir=\"ltr\"\n className={sparklineVariants({\n size: height !== undefined ? 'auto' : size,\n className,\n })}\n {...props}\n />\n );\n }\n\n /* ---- chart config ---------------------------------------------- */\n const reducedMotion = prefersReducedMotion();\n\n const chartOptions: ApexCharts.ApexOptions = {\n ...themeOptions,\n chart: {\n ...themeOptions.chart,\n id: chartId,\n type: variant,\n sparkline: { enabled: true },\n toolbar: { show: false },\n animations: {\n enabled: !reducedMotion,\n dynamicAnimation: { enabled: !reducedMotion },\n },\n zoom: { enabled: false },\n parentHeightOffset: 0,\n },\n colors: [resolvedColor],\n stroke: {\n curve: 'smooth',\n width: variant === 'bar' ? 0 : 2,\n },\n fill: {\n opacity: variant === 'area' ? 0.15 : 1,\n },\n xaxis: {\n crosshairs: { show: false },\n },\n tooltip: { enabled: showTooltip },\n markers: showEndpoint\n ? {\n size: [0],\n discrete: [\n {\n seriesIndex: 0,\n dataPointIndex: data.length - 1,\n fillColor: resolvedColor,\n strokeColor: resolvedColor,\n size: 4,\n },\n ],\n }\n : { size: 0 },\n grid: {\n ...themeOptions.grid,\n show: false,\n // ApexCharts grid.padding uses physical keys (not CSS logical properties).\n // The chart wrapper enforces dir=\"ltr\" so these always resolve correctly.\n padding: { top: 2, right: 2, bottom: 2, left: 2 },\n },\n };\n\n const resolvedWidth =\n width ?? (containerWidth > 0 ? containerWidth : '100%');\n const resolvedHeight = height ?? SIZE_HEIGHT[size ?? 'md'];\n\n return (\n <div\n ref={wrapperRef}\n role=\"img\"\n aria-label={ariaLabel}\n dir=\"ltr\"\n className={sparklineVariants({\n size: height !== undefined ? 'auto' : size,\n className,\n })}\n data-component=\"sparkline\"\n data-component-id={id}\n {...props}\n >\n <ReactApexChart\n type={variant}\n series={[{ data }]}\n options={chartOptions}\n width={resolvedWidth}\n height={resolvedHeight}\n aria-hidden=\"true\"\n />\n {showEndpoint && (\n <span\n aria-hidden=\"true\"\n className=\"ds:pointer-events-none ds:absolute ds:end-0 ds:top-0 ds:text-[length:var(--font-size-xs)] ds:leading-none\"\n >\n {DIRECTION_ARROW[direction]}\n </span>\n )}\n </div>\n );\n },\n);\n\nSparkline.displayName = 'Sparkline';\n"],"names":["useLinearTrend","data","n","xMean","yMean","sum","y","numerator","denominator","i","dx","slope","threshold","direction","sparklineAgent","handle","args","sparklineVariants","cva","DIRECTION_ARROW","SIZE_HEIGHT","prefersReducedMotion","Sparkline","forwardRef","id","variant","size","label","color","showEndpoint","showTooltip","width","height","className","props","ref","t","i18n","useTranslation","rawId","useId","chartId","useMemo","wrapperRef","useRef","containerWidth","setContainerWidth","useState","ariaLabel","fmt","dirText","nums","themeOptions","setThemeOptions","getApexChartsTheme","useEffect","timer","observer","el","ro","entries","entry","useNeutraliseHiddenFocus","agentHandle","newData","_a","ApexCharts","opts","instance","useImperativeHandle","useAgentRegistration","resolvedColor","jsx","reducedMotion","chartOptions","resolvedWidth","resolvedHeight","jsxs","ReactApexChart"],"mappings":"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"}
|
|
@@ -88,7 +88,7 @@ const J = [
|
|
|
88
88
|
}), Q = v(
|
|
89
89
|
[
|
|
90
90
|
"ds:group/item ds:overflow-hidden ds:rounded-[var(--radius-md)]",
|
|
91
|
-
"ds:border ds:border-[var(--border)] ds:bg-[var(--card)]",
|
|
91
|
+
"ds:border ds:border-[color:var(--card-border)] ds:[.theme-accessible_&]:border-2 ds:bg-[var(--card)]",
|
|
92
92
|
"ds:data-[state=open]:border-[var(--primary)]",
|
|
93
93
|
"ds:transition-[border-color] ds:duration-[var(--animation-duration)] ds:ease-[var(--ease-out)]",
|
|
94
94
|
"ds:motion-reduce:transition-none"
|
|
@@ -254,4 +254,4 @@ ne.displayName = "StepperAccordion";
|
|
|
254
254
|
export {
|
|
255
255
|
ne as S
|
|
256
256
|
};
|
|
257
|
-
//# sourceMappingURL=stepper-accordion-
|
|
257
|
+
//# sourceMappingURL=stepper-accordion-Dki6r9ZE.js.map
|
|
@@ -0,0 +1 @@
|
|
|
1
|
+
{"version":3,"file":"stepper-accordion-Dki6r9ZE.js","sources":["../../node_modules/lucide-react/dist/esm/icons/lock.js","../../src/components/_shared/stepper.ts","../../src/components/stepper-accordion/stepper-accordion.tsx"],"sourcesContent":["/**\n * @license lucide-react v1.8.0 - ISC\n *\n * This source code is licensed under the ISC license.\n * See the LICENSE file in the root directory of this source tree.\n */\n\nimport createLucideIcon from '../createLucideIcon.js';\n\nconst __iconNode = [\n [\"rect\", { width: \"18\", height: \"11\", x: \"3\", y: \"11\", rx: \"2\", ry: \"2\", key: \"1w4ew1\" }],\n [\"path\", { d: \"M7 11V7a5 5 0 0 1 10 0v4\", key: \"fwvmzm\" }]\n];\nconst Lock = createLucideIcon(\"lock\", __iconNode);\n\nexport { __iconNode, Lock as default };\n//# sourceMappingURL=lock.js.map\n","// Shared types + state machine for the two stepper variants:\n// - src/components/stepper-progress (lightweight progress bar + caption)\n// - src/components/stepper-accordion (vertical disclosure wizard)\n//\n// Both components consume `StepSpec` and the `stateForStep` helper so the\n// four-state machine (upcoming | current | completed | error) stays in one\n// place. Rename or removal is a MAJOR per src/docs/13-maintainability.mdx.\n\nexport type StepStatus = 'completed' | 'error';\n\nexport type StepState = 'upcoming' | 'current' | 'completed' | 'error';\n\nexport interface StepSpec {\n /** Visible step label — comes from the consumer, already translated. */\n label: string;\n /** Optional secondary line (kept short; shown in accordion + progress captions). */\n description?: string;\n /**\n * Consumer-explicit status override. `error` always wins; `completed` is\n * honoured only for steps at or beyond the active index so the active step\n * always keeps `current` (otherwise a consumer pre-setting `completed` on\n * every step would silently mask the current position).\n */\n status?: StepStatus;\n}\n\nexport function stateForStep(\n index: number,\n activeStep: number,\n status?: StepStatus,\n): StepState {\n if (status === 'error') return 'error';\n if (index === activeStep) return 'current';\n if (status === 'completed') return 'completed';\n if (index < activeStep) return 'completed';\n return 'upcoming';\n}\n","import {\n forwardRef,\n useImperativeHandle,\n useMemo,\n type ComponentPropsWithoutRef,\n type ReactNode,\n} from 'react';\nimport * as AccordionPrimitive from '@radix-ui/react-accordion';\nimport { cva, type VariantProps } from 'class-variance-authority';\nimport { ChevronDown, Lock } from 'lucide-react';\nimport { useTranslation } from 'react-i18next';\nimport {\n stateForStep,\n type StepSpec,\n type StepState,\n} from '../_shared/stepper';\n\n/* -------------------------------------------------------------------- */\n/* StepperAccordion */\n/* */\n/* Vertical disclosure wizard. The current step is expanded inline; */\n/* completed steps collapse to a one-line summary with an \"Edit\" hint */\n/* that re-opens them; upcoming steps are locked. Built on Radix */\n/* Accordion in controlled-single mode with collapsible=false so the */\n/* current panel always stays open. */\n/* -------------------------------------------------------------------- */\n\nconst STEP_VALUE_PREFIX = 'step-';\nconst makeValue = (index: number) => `${STEP_VALUE_PREFIX}${index}`;\nconst indexFromValue = (value: string): number =>\n Number(value.slice(STEP_VALUE_PREFIX.length));\n\n/* -------------------------------------------------------------------- */\n/* Indicator — shared with progress bar visual tone but sized for the */\n/* vertical wizard's dense header row. */\n/* -------------------------------------------------------------------- */\n\nconst iconDrawClasses = [\n 'ds:[stroke-dasharray:1] ds:[stroke-dashoffset:1]',\n 'ds:animate-[stepper-icon-draw_var(--animation-duration)_var(--ease-out)_forwards]',\n 'ds:motion-reduce:animate-none ds:motion-reduce:[stroke-dashoffset:0]',\n].join(' ');\n\nfunction CheckGlyph() {\n return (\n <svg\n viewBox=\"0 0 24 24\"\n fill=\"none\"\n stroke=\"currentColor\"\n strokeWidth=\"3\"\n strokeLinecap=\"round\"\n strokeLinejoin=\"round\"\n aria-hidden=\"true\"\n className=\"ds:size-4\"\n >\n <path pathLength=\"1\" d=\"M5 12l5 5L20 7\" className={iconDrawClasses} />\n </svg>\n );\n}\n\nfunction CrossGlyph() {\n return (\n <svg\n viewBox=\"0 0 24 24\"\n fill=\"none\"\n stroke=\"currentColor\"\n strokeWidth=\"3\"\n strokeLinecap=\"round\"\n strokeLinejoin=\"round\"\n aria-hidden=\"true\"\n className=\"ds:size-4\"\n >\n <path pathLength=\"1\" d=\"M6 6l12 12\" className={iconDrawClasses} />\n <path pathLength=\"1\" d=\"M18 6l-12 12\" className={iconDrawClasses} />\n </svg>\n );\n}\n\nconst indicatorClasses = [\n 'ds:inline-flex ds:shrink-0 ds:items-center ds:justify-center',\n 'ds:min-w-[var(--min-target-size)] ds:min-h-[var(--min-target-size)]',\n 'ds:size-[var(--min-target-size)]',\n 'ds:rounded-[var(--radius-full)]',\n 'ds:text-[var(--font-size-sm)] ds:font-[var(--font-weight-semibold)]',\n 'ds:border ds:border-[var(--border)]',\n 'ds:transition-[background-color,border-color,color]',\n 'ds:duration-[var(--animation-duration)] ds:ease-[var(--ease-out)]',\n 'ds:motion-reduce:transition-none',\n].join(' ');\n\nconst indicatorVariants = cva(indicatorClasses, {\n variants: {\n state: {\n upcoming: 'ds:bg-[var(--background)] ds:text-[var(--muted-foreground)]',\n current: [\n 'ds:border-[var(--primary)] ds:bg-[var(--primary)] ds:text-[var(--primary-foreground)]',\n 'ds:animate-[stepper-indicator-pop_var(--animation-duration)_var(--ease-out)_both]',\n 'ds:motion-reduce:animate-none',\n ].join(' '),\n completed:\n 'ds:border-[var(--primary)] ds:bg-[var(--primary)] ds:text-[var(--primary-foreground)]',\n error: [\n 'ds:border-[var(--destructive)] ds:bg-[var(--destructive)] ds:text-[var(--destructive-foreground)]',\n 'ds:animate-[stepper-indicator-pop_var(--animation-duration)_var(--ease-out)_both]',\n 'ds:motion-reduce:animate-none',\n ].join(' '),\n },\n },\n});\n\n/* -------------------------------------------------------------------- */\n/* Item / trigger / content variants */\n/* -------------------------------------------------------------------- */\n\nconst itemVariants = cva(\n [\n 'ds:group/item ds:overflow-hidden ds:rounded-[var(--radius-md)]',\n 'ds:border ds:border-[color:var(--card-border)] ds:[.theme-accessible_&]:border-2 ds:bg-[var(--card)]',\n 'ds:data-[state=open]:border-[var(--primary)]',\n 'ds:transition-[border-color] ds:duration-[var(--animation-duration)] ds:ease-[var(--ease-out)]',\n 'ds:motion-reduce:transition-none',\n ].join(' '),\n {\n variants: {\n tone: {\n neutral: '',\n error: 'ds:data-[state=open]:border-[var(--destructive)]',\n },\n },\n defaultVariants: { tone: 'neutral' },\n },\n);\n\nconst triggerClasses = [\n 'ds:flex ds:w-full ds:items-center ds:gap-[var(--spacing-sm)]',\n 'ds:min-h-[var(--min-target-size)]',\n 'ds:ps-[var(--spacing-md)] ds:pe-[var(--spacing-md)]',\n 'ds:pt-[var(--spacing-sm)] ds:pb-[var(--spacing-sm)]',\n 'ds:text-start',\n 'ds:focus-visible:outline-[length:var(--focus-ring-width)] ds:focus-visible:outline-solid',\n 'ds:focus-visible:outline-[var(--ring)] ds:focus-visible:outline-offset-[length:var(--focus-ring-offset)]',\n 'ds:disabled:cursor-not-allowed',\n 'ds:transition-[background-color] ds:duration-[var(--animation-duration)] ds:ease-[var(--ease-out)]',\n 'ds:motion-reduce:transition-none',\n 'ds:hover:enabled:bg-[var(--muted)]/40',\n].join(' ');\n\nconst labelClasses = (state: StepState) =>\n [\n 'type-body-sm',\n state === 'current' || state === 'error'\n ? 'ds:font-[var(--font-weight-semibold)] ds:text-[var(--foreground)]'\n : state === 'completed'\n ? 'ds:text-[var(--foreground)]'\n : 'ds:text-[var(--muted-foreground)]',\n ].join(' ');\n\nconst descriptionClasses = [\n 'type-meta ds:text-[var(--muted-foreground)]',\n 'ds:mt-[var(--spacing-xs)]',\n].join(' ');\n\nconst hintClasses = [\n 'type-meta',\n 'ds:inline-flex ds:items-center ds:gap-[var(--spacing-xs)]',\n 'ds:text-[var(--muted-foreground)]',\n].join(' ');\n\nconst chevronClasses = [\n 'ds:size-4 ds:shrink-0 ds:text-[var(--muted-foreground)]',\n 'ds:transition-transform ds:duration-[var(--animation-duration)] ds:ease-[var(--ease-out)]',\n 'ds:motion-reduce:transition-none',\n 'ds:group-data-[state=open]/item:rotate-180',\n].join(' ');\n\nconst summaryClasses = [\n 'type-meta ds:text-[var(--muted-foreground)]',\n 'ds:ps-[calc(var(--min-target-size)+var(--spacing-md)+var(--spacing-sm))]',\n 'ds:pe-[var(--spacing-md)] ds:pb-[var(--spacing-sm)]',\n 'ds:group-data-[state=open]/item:hidden',\n].join(' ');\n\nconst contentClasses = [\n 'ds:overflow-hidden',\n 'ds:data-[state=open]:animate-[accordion-down_var(--animation-duration)_var(--ease-out)]',\n 'ds:data-[state=closed]:animate-[accordion-up_var(--animation-duration)_var(--ease-in)]',\n].join(' ');\n\nconst contentInnerClasses = [\n 'ds:ps-[calc(var(--min-target-size)+var(--spacing-md)+var(--spacing-sm))]',\n 'ds:pe-[var(--spacing-md)] ds:pt-[var(--spacing-xs)] ds:pb-[var(--spacing-md)]',\n].join(' ');\n\n/* -------------------------------------------------------------------- */\n/* Types */\n/* -------------------------------------------------------------------- */\n\nexport interface AccordionStepSpec extends StepSpec {\n /** Form content rendered inside the expanded panel. */\n content: ReactNode;\n /**\n * One-line summary shown under the header when the step is completed\n * and its panel is collapsed. Typically a preview of the captured\n * data — \"Mario Rossi · 12/03/1985\".\n */\n summary?: ReactNode;\n}\n\nconst rootVariants = cva('ds:flex ds:flex-col ds:gap-[var(--spacing-sm)]', {\n variants: {},\n});\n\nexport interface StepperAccordionProps\n extends\n Omit<\n ComponentPropsWithoutRef<typeof AccordionPrimitive.Root>,\n 'type' | 'value' | 'defaultValue' | 'onValueChange' | 'collapsible'\n >,\n VariantProps<typeof rootVariants> {\n /** Active step (0-indexed). The matching panel is the one that is open. */\n activeStep: number;\n /** Step specs — each one provides its own content + optional summary. */\n steps: AccordionStepSpec[];\n /**\n * Fires when the user re-opens a completed step. Upcoming steps cannot\n * be activated — their triggers are disabled. The current step cannot\n * be collapsed (Radix `collapsible=false`).\n */\n onStepChange?: (index: number) => void;\n /** Override the default `aria-label` on the list wrapper. */\n 'aria-label'?: string;\n /**\n * Consumer-supplied instance id, surfaced as `data-component-id` so an\n * agent / UI bridge can address this instance.\n */\n id?: string;\n}\n\n/**\n * Imperative handle for agent-readiness. Routes state mutations through\n * the consumer's `onStepChange`, never mutating directly.\n */\nexport interface StepperAccordionHandle {\n getCurrentStep: () => number;\n getTotalSteps: () => number;\n /** Indices of currently-open panels — singleton under Radix `type=\"single\"`. */\n getOpenSteps: () => number[];\n gotoStep: (step: number) => void;\n next: () => void;\n previous: () => void;\n}\n\n/* -------------------------------------------------------------------- */\n/* Component */\n/* -------------------------------------------------------------------- */\n\nconst StepperAccordion = forwardRef<\n StepperAccordionHandle,\n StepperAccordionProps\n>(\n (\n {\n activeStep,\n steps,\n onStepChange,\n 'aria-label': ariaLabel,\n id,\n className,\n ...rest\n },\n ref,\n ) => {\n const { t } = useTranslation();\n const total = steps.length;\n const clampedActive = Math.max(0, Math.min(activeStep, total - 1));\n const label = ariaLabel ?? t('navigation.stepper.label');\n const editCopy = t('navigation.stepper.edit');\n const lockedCopy = t('navigation.stepper.locked');\n const completedCopy = t('navigation.stepper.completed');\n const errorCopy = t('navigation.stepper.error');\n\n const handleValueChange = (value: string) => {\n // `collapsible=false` prevents empty-string values in practice, but the\n // primitive's type still allows one — guard anyway.\n if (!value) return;\n const index = indexFromValue(value);\n if (Number.isFinite(index) && index !== clampedActive) {\n onStepChange?.(index);\n }\n };\n\n const handle = useMemo<StepperAccordionHandle>(\n () => ({\n getCurrentStep: () => clampedActive,\n getTotalSteps: () => total,\n getOpenSteps: () => [clampedActive],\n gotoStep: (step: number) => {\n if (!onStepChange) return;\n const clamped = Math.max(0, Math.min(step, Math.max(total - 1, 0)));\n if (clamped !== clampedActive) onStepChange(clamped);\n },\n next: () => {\n if (!onStepChange) return;\n if (clampedActive < total - 1) onStepChange(clampedActive + 1);\n },\n previous: () => {\n if (!onStepChange) return;\n if (clampedActive > 0) onStepChange(clampedActive - 1);\n },\n }),\n [clampedActive, total, onStepChange],\n );\n useImperativeHandle(ref, () => handle, [handle]);\n\n return (\n <AccordionPrimitive.Root\n type=\"single\"\n value={makeValue(clampedActive)}\n onValueChange={handleValueChange}\n collapsible={false}\n aria-label={label}\n id={id}\n data-component=\"stepper-accordion\"\n data-component-id={id}\n className={rootVariants({ className })}\n {...rest}\n >\n {steps.map((spec, index) => {\n const state = stateForStep(index, clampedActive, spec.status);\n const isCurrent = state === 'current' || state === 'error';\n const isUpcoming = state === 'upcoming';\n const itemTone = state === 'error' ? 'error' : 'neutral';\n const stepN = t('navigation.stepper.stepN', { n: index + 1 });\n\n const indicatorContent = (() => {\n if (state === 'completed') {\n return (\n <>\n <CheckGlyph />\n <span className=\"ds:sr-only\">{completedCopy}</span>\n </>\n );\n }\n if (state === 'error') {\n return (\n <>\n <CrossGlyph />\n <span className=\"ds:sr-only\">{errorCopy}</span>\n </>\n );\n }\n return <span>{index + 1}</span>;\n })();\n\n const hint = (() => {\n if (state === 'completed') {\n return <span className={hintClasses}>{editCopy}</span>;\n }\n if (state === 'upcoming') {\n return (\n <span className={hintClasses}>\n <Lock aria-hidden=\"true\" className=\"ds:size-3\" />\n {lockedCopy}\n </span>\n );\n }\n return null;\n })();\n\n return (\n <AccordionPrimitive.Item\n key={index}\n value={makeValue(index)}\n data-step-id={String(index)}\n className={itemVariants({ tone: itemTone })}\n >\n <AccordionPrimitive.Header className=\"ds:flex\">\n <AccordionPrimitive.Trigger\n // Upcoming steps are *HTML*-disabled — they must not be\n // reachable by Tab or by Radix's arrow-key navigation ring\n // (Radix filters `item.ref.current?.disabled`, which is\n // the HTML attribute). Current is only *ARIA*-disabled so\n // keyboard users can Tab to it as a heading anchor and\n // hear \"current step\"; Radix's `collapsible=false` makes\n // the click a no-op regardless. Setting `disabled` at the\n // Trigger rather than the Item because `...triggerProps`\n // spreads after Collapsible writes its own `disabled`\n // from context, so the Item-level disabled gets overridden.\n disabled={isUpcoming}\n aria-disabled={isCurrent || undefined}\n aria-label={\n state === 'completed' ? `${stepN}, ${editCopy}` : stepN\n }\n aria-current={isCurrent ? 'step' : undefined}\n className={triggerClasses}\n >\n <span\n aria-hidden=\"true\"\n className={indicatorVariants({ state })}\n >\n {indicatorContent}\n </span>\n <span className=\"ds:flex ds:min-w-0 ds:flex-1 ds:flex-col\">\n <span className={labelClasses(state)}>{spec.label}</span>\n {spec.description ? (\n <span className={descriptionClasses}>\n {spec.description}\n </span>\n ) : null}\n </span>\n {hint}\n {isCurrent ? null : (\n <ChevronDown\n aria-hidden=\"true\"\n className={chevronClasses}\n />\n )}\n </AccordionPrimitive.Trigger>\n </AccordionPrimitive.Header>\n {spec.summary && state === 'completed' ? (\n <div className={summaryClasses}>{spec.summary}</div>\n ) : null}\n <AccordionPrimitive.Content className={contentClasses}>\n <div className={contentInnerClasses}>{spec.content}</div>\n </AccordionPrimitive.Content>\n </AccordionPrimitive.Item>\n );\n })}\n </AccordionPrimitive.Root>\n );\n },\n);\nStepperAccordion.displayName = 'StepperAccordion';\n\nexport { StepperAccordion };\n"],"names":["__iconNode","Lock","createLucideIcon","stateForStep","index","activeStep","status","STEP_VALUE_PREFIX","makeValue","indexFromValue","value","iconDrawClasses","CheckGlyph","jsx","CrossGlyph","jsxs","indicatorClasses","indicatorVariants","cva","itemVariants","triggerClasses","labelClasses","state","descriptionClasses","hintClasses","chevronClasses","summaryClasses","contentClasses","contentInnerClasses","rootVariants","StepperAccordion","forwardRef","steps","onStepChange","ariaLabel","id","className","rest","ref","t","useTranslation","total","clampedActive","label","editCopy","lockedCopy","completedCopy","errorCopy","handleValueChange","handle","useMemo","step","clamped","useImperativeHandle","AccordionPrimitive","spec","isCurrent","isUpcoming","itemTone","stepN","indicatorContent","Fragment","hint","ChevronDown"],"mappings":"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","x_google_ignoreList":[0]}
|
|
@@ -27,7 +27,7 @@ const V = B(
|
|
|
27
27
|
},
|
|
28
28
|
fill: {
|
|
29
29
|
solid: "",
|
|
30
|
-
outline: "ds:border ds:bg-transparent"
|
|
30
|
+
outline: "ds:border ds:border-[color:var(--border)] ds:bg-transparent"
|
|
31
31
|
},
|
|
32
32
|
size: {
|
|
33
33
|
// Symmetric start/end padding — close button uses negative margin to stay flush.
|
|
@@ -131,7 +131,7 @@ const V = B(
|
|
|
131
131
|
}
|
|
132
132
|
), M = q(
|
|
133
133
|
({
|
|
134
|
-
label:
|
|
134
|
+
label: o,
|
|
135
135
|
variant: g = "neutral",
|
|
136
136
|
fill: p = "solid",
|
|
137
137
|
size: a = "md",
|
|
@@ -139,20 +139,20 @@ const V = B(
|
|
|
139
139
|
onRemove: t,
|
|
140
140
|
onClick: b,
|
|
141
141
|
disabled: e = !1,
|
|
142
|
-
maxInlineSize:
|
|
142
|
+
maxInlineSize: n = "none",
|
|
143
143
|
className: h
|
|
144
144
|
}, i) => {
|
|
145
145
|
const { t: w } = H(), y = F(null), [D, C] = E(!1), [O, R] = E("");
|
|
146
146
|
G(() => {
|
|
147
147
|
const s = y.current;
|
|
148
|
-
if (!s ||
|
|
148
|
+
if (!s || n === "none") return;
|
|
149
149
|
const z = () => C(s.scrollWidth > s.clientWidth), j = new ResizeObserver(z);
|
|
150
150
|
return j.observe(s), z(), () => j.disconnect();
|
|
151
|
-
}, [
|
|
151
|
+
}, [n]);
|
|
152
152
|
const W = (s) => {
|
|
153
153
|
(s.key === "Backspace" || s.key === "Delete") && t && !e && (s.preventDefault(), x(), setTimeout(t, 100));
|
|
154
154
|
}, x = () => {
|
|
155
|
-
R(w("tag.removed", { label:
|
|
155
|
+
R(w("tag.removed", { label: o }));
|
|
156
156
|
}, K = () => {
|
|
157
157
|
!e && t && (x(), setTimeout(t, 100));
|
|
158
158
|
}, d = !!t, N = !!b && !d, T = V({
|
|
@@ -174,22 +174,22 @@ const V = B(
|
|
|
174
174
|
"span",
|
|
175
175
|
{
|
|
176
176
|
ref: y,
|
|
177
|
-
className:
|
|
178
|
-
style:
|
|
179
|
-
children:
|
|
177
|
+
className: n !== "none" ? "ds:overflow-hidden ds:text-ellipsis ds:whitespace-nowrap" : void 0,
|
|
178
|
+
style: n !== "none" ? { maxInlineSize: n } : void 0,
|
|
179
|
+
children: o
|
|
180
180
|
}
|
|
181
181
|
), A = /* @__PURE__ */ r("span", { role: "status", "aria-live": "polite", className: "ds:sr-only", children: O }), X = d ? /* @__PURE__ */ r(
|
|
182
182
|
"button",
|
|
183
183
|
{
|
|
184
184
|
type: "button",
|
|
185
|
-
"aria-label": w("tag.remove", { label:
|
|
185
|
+
"aria-label": w("tag.remove", { label: o }),
|
|
186
186
|
onClick: K,
|
|
187
187
|
disabled: e,
|
|
188
188
|
tabIndex: -1,
|
|
189
189
|
className: L({ size: a }),
|
|
190
190
|
children: /* @__PURE__ */ r(J, { "aria-hidden": "true" })
|
|
191
191
|
}
|
|
192
|
-
) : null, u =
|
|
192
|
+
) : null, u = n !== "none" && D;
|
|
193
193
|
if (N) {
|
|
194
194
|
const s = /* @__PURE__ */ f(
|
|
195
195
|
"button",
|
|
@@ -206,7 +206,7 @@ const V = B(
|
|
|
206
206
|
]
|
|
207
207
|
}
|
|
208
208
|
);
|
|
209
|
-
return u ? /* @__PURE__ */ r(v, { label:
|
|
209
|
+
return u ? /* @__PURE__ */ r(v, { label: o, children: s }) : s;
|
|
210
210
|
}
|
|
211
211
|
if (d) {
|
|
212
212
|
const s = (
|
|
@@ -216,7 +216,7 @@ const V = B(
|
|
|
216
216
|
{
|
|
217
217
|
ref: i,
|
|
218
218
|
role: "group",
|
|
219
|
-
"aria-label":
|
|
219
|
+
"aria-label": o,
|
|
220
220
|
tabIndex: e ? -1 : 0,
|
|
221
221
|
"aria-disabled": e || void 0,
|
|
222
222
|
onKeyDown: W,
|
|
@@ -231,7 +231,7 @@ const V = B(
|
|
|
231
231
|
}
|
|
232
232
|
)
|
|
233
233
|
);
|
|
234
|
-
return u ? /* @__PURE__ */ r(v, { label:
|
|
234
|
+
return u ? /* @__PURE__ */ r(v, { label: o, children: s }) : s;
|
|
235
235
|
}
|
|
236
236
|
const k = /* @__PURE__ */ f(
|
|
237
237
|
"span",
|
|
@@ -245,11 +245,11 @@ const V = B(
|
|
|
245
245
|
]
|
|
246
246
|
}
|
|
247
247
|
);
|
|
248
|
-
return u ? /* @__PURE__ */ r(v, { label:
|
|
248
|
+
return u ? /* @__PURE__ */ r(v, { label: o, children: k }) : k;
|
|
249
249
|
}
|
|
250
250
|
);
|
|
251
251
|
M.displayName = "Tag";
|
|
252
252
|
export {
|
|
253
253
|
M as T
|
|
254
254
|
};
|
|
255
|
-
//# sourceMappingURL=tag-
|
|
255
|
+
//# sourceMappingURL=tag-CdA0s_VV.js.map
|
|
@@ -0,0 +1 @@
|
|
|
1
|
+
{"version":3,"file":"tag-CdA0s_VV.js","sources":["../../src/components/tag/tag.tsx"],"sourcesContent":["import { forwardRef, useRef, useState, useEffect, type ReactNode } from 'react';\nimport { cva } from 'class-variance-authority';\nimport { useTranslation } from 'react-i18next';\nimport { X } from 'lucide-react';\nimport { Tooltip } from '../tooltip';\n\n/* ------------------------------------------------------------------ */\n/* CVA — tag pill */\n/* ------------------------------------------------------------------ */\n\nconst tagVariants = cva(\n [\n 'ds:inline-flex ds:items-center ds:gap-[var(--spacing-xs)]',\n 'ds:rounded-[var(--radius-full)]',\n 'type-eyebrow ds:whitespace-nowrap',\n 'ds:transition-colors ds:duration-[var(--animation-duration)] ds:motion-reduce:transition-none',\n 'ds:focus-visible:outline-[length:var(--focus-ring-width)] ds:focus-visible:outline-solid',\n 'ds:focus-visible:outline-[color:var(--ring)] ds:focus-visible:outline-offset-[length:var(--focus-ring-offset)]',\n 'ds:aria-disabled:cursor-not-allowed ds:aria-disabled:opacity-50',\n 'ds:disabled:cursor-not-allowed ds:disabled:opacity-50',\n ].join(' '),\n {\n variants: {\n variant: {\n neutral: '',\n info: '',\n success: '',\n warning: '',\n error: '',\n brand: '',\n },\n fill: {\n solid: '',\n outline: 'ds:border ds:border-[color:var(--border)] ds:bg-transparent',\n },\n size: {\n // Symmetric start/end padding — close button uses negative margin to stay flush.\n // Size is the only eyebrow-role axis that varies per Tag size; weight, transform,\n // tracking, line-height, and features all come from `.type-eyebrow` on the base.\n sm: 'ds:h-[calc(var(--spacing)*4)] ds:ps-[var(--spacing-xs)] ds:pe-[var(--spacing-xs)] ds:[--type-eyebrow-size:var(--font-size-2xs)]',\n md: 'ds:h-[calc(var(--spacing)*5)] ds:ps-[var(--spacing-sm)] ds:pe-[var(--spacing-sm)] ds:[--type-eyebrow-size:var(--font-size-2xs)]',\n lg: 'ds:h-[calc(var(--spacing)*6)] ds:ps-[var(--spacing-sm)] ds:pe-[var(--spacing-sm)] ds:[--type-eyebrow-size:var(--font-size-xs)]',\n },\n },\n compoundVariants: [\n // Solid fills — foreground tokens adapt per theme\n {\n fill: 'solid',\n variant: 'neutral',\n className: 'ds:bg-muted/20 ds:text-muted-foreground',\n },\n {\n fill: 'solid',\n variant: 'info',\n className: 'ds:bg-info ds:text-[color:var(--info-solid-foreground)]',\n },\n {\n fill: 'solid',\n variant: 'success',\n className:\n 'ds:bg-success ds:text-[color:var(--success-solid-foreground)]',\n },\n {\n fill: 'solid',\n variant: 'warning',\n className: 'ds:bg-warning ds:text-foreground',\n },\n {\n fill: 'solid',\n variant: 'error',\n className: 'ds:bg-destructive ds:text-destructive-foreground',\n },\n {\n fill: 'solid',\n variant: 'brand',\n className: 'ds:bg-primary ds:text-primary-foreground',\n },\n // Outline fills\n {\n fill: 'outline',\n variant: 'neutral',\n className: 'ds:border-muted ds:text-muted-foreground',\n },\n {\n fill: 'outline',\n variant: 'info',\n className: 'ds:border-info ds:text-[var(--info-foreground)]',\n },\n {\n fill: 'outline',\n variant: 'success',\n className: 'ds:border-success ds:text-[var(--success-foreground)]',\n },\n {\n fill: 'outline',\n variant: 'warning',\n className: 'ds:border-warning ds:text-[var(--warning-foreground)]',\n },\n {\n fill: 'outline',\n variant: 'error',\n className: 'ds:border-destructive ds:text-[var(--error-foreground)]',\n },\n {\n fill: 'outline',\n variant: 'brand',\n className: 'ds:border-primary ds:text-primary',\n },\n ],\n defaultVariants: {\n variant: 'neutral',\n fill: 'solid',\n size: 'md',\n },\n },\n);\n\n/* ------------------------------------------------------------------ */\n/* CVA — close button */\n/* ------------------------------------------------------------------ */\n\nconst closeButtonVariants = cva(\n [\n 'ds:inline-flex ds:items-center ds:justify-center ds:shrink-0 ds:rounded-full',\n // Negative end margin keeps the button flush with the pill edge\n 'ds:-me-[var(--spacing-xs)]',\n 'ds:hover:bg-foreground/10',\n 'ds:transition-colors ds:duration-[var(--animation-duration)] ds:motion-reduce:transition-none',\n 'ds:focus-visible:outline-[length:var(--focus-ring-width)] ds:focus-visible:outline-solid',\n 'ds:focus-visible:outline-[color:var(--ring)] ds:focus-visible:outline-offset-[length:var(--focus-ring-offset)]',\n 'ds:disabled:cursor-not-allowed ds:disabled:opacity-50',\n ].join(' '),\n {\n variants: {\n size: {\n sm: 'ds:p-1 ds:[&>svg]:size-3',\n md: 'ds:p-1 ds:[&>svg]:size-3.5',\n lg: 'ds:p-1.5 ds:[&>svg]:size-4',\n },\n },\n defaultVariants: { size: 'md' },\n },\n);\n\n/* ------------------------------------------------------------------ */\n/* TagProps */\n/* ------------------------------------------------------------------ */\n\nexport interface TagProps {\n /** The visible label text */\n label: string;\n /** Semantic colour variant */\n variant?: 'neutral' | 'info' | 'success' | 'warning' | 'error' | 'brand';\n /** Visual fill style */\n fill?: 'solid' | 'outline';\n /** Size */\n size?: 'sm' | 'md' | 'lg';\n /** Leading slot — icon element or dot */\n leading?: ReactNode;\n /** Called when the tag is removed (enables close button + Backspace/Delete) */\n onRemove?: () => void;\n /** Called when the tag is clicked (non-removable interactive tag) */\n onClick?: () => void;\n /** Disabled state */\n disabled?: boolean;\n /** Max inline size before truncation with tooltip — default 'none' */\n maxInlineSize?: string | 'none';\n /** Additional class names */\n className?: string;\n}\n\n/* ------------------------------------------------------------------ */\n/* Tag */\n/* ------------------------------------------------------------------ */\n\nexport const Tag = forwardRef<HTMLElement, TagProps>(\n (\n {\n label,\n variant = 'neutral',\n fill = 'solid',\n size = 'md',\n leading,\n onRemove,\n onClick,\n disabled = false,\n maxInlineSize = 'none',\n className,\n },\n ref,\n ) => {\n const { t } = useTranslation();\n const labelRef = useRef<HTMLSpanElement>(null);\n const [isOverflowing, setIsOverflowing] = useState(false);\n const [announcement, setAnnouncement] = useState('');\n\n useEffect(() => {\n const el = labelRef.current;\n if (!el || maxInlineSize === 'none') return;\n\n const check = () => setIsOverflowing(el.scrollWidth > el.clientWidth);\n const observer = new ResizeObserver(check);\n observer.observe(el);\n check();\n return () => observer.disconnect();\n }, [maxInlineSize]);\n\n const handleKeyDown = (e: React.KeyboardEvent) => {\n if (\n (e.key === 'Backspace' || e.key === 'Delete') &&\n onRemove &&\n !disabled\n ) {\n e.preventDefault();\n announce();\n // Delay gives the live region one render cycle before unmount\n setTimeout(onRemove, 100);\n }\n };\n\n const announce = () => {\n setAnnouncement(t('tag.removed', { label }));\n };\n\n const handleRemove = () => {\n if (!disabled && onRemove) {\n announce();\n setTimeout(onRemove, 100);\n }\n };\n\n const isRemovable = !!onRemove;\n const isClickable = !!onClick && !isRemovable;\n\n const rootClasses = tagVariants({\n variant,\n fill,\n size,\n className: [\n isClickable && !disabled\n ? 'ds:hover:brightness-90 ds:cursor-pointer'\n : '',\n className ?? '',\n ]\n .filter(Boolean)\n .join(' '),\n });\n\n const leadingEl = leading ? (\n <span\n aria-hidden=\"true\"\n className=\"ds:shrink-0 ds:inline-flex ds:items-center ds:[&>svg]:size-3.5\"\n >\n {leading}\n </span>\n ) : null;\n\n // Consumer-controlled layout constraint — not a design token.\n // maxInlineSize is an arbitrary caller-supplied value that cannot be expressed\n // as a static Tailwind class; the style prop is the only cross-browser option.\n const labelEl = (\n <span\n ref={labelRef}\n className={\n maxInlineSize !== 'none'\n ? 'ds:overflow-hidden ds:text-ellipsis ds:whitespace-nowrap'\n : undefined\n }\n // eslint-disable-next-line react/forbid-dom-props -- caller-supplied maxInlineSize, runtime-computed\n style={maxInlineSize !== 'none' ? { maxInlineSize } : undefined}\n >\n {label}\n </span>\n );\n\n // Live region — only for removable tags; must be a sibling outside the button.\n const liveRegion = (\n <span role=\"status\" aria-live=\"polite\" className=\"ds:sr-only\">\n {announcement}\n </span>\n );\n\n const closeButton = isRemovable ? (\n <button\n type=\"button\"\n aria-label={t('tag.remove', { label })}\n onClick={handleRemove}\n disabled={disabled}\n // Intentionally excluded from tab order: Backspace/Delete on the focused\n // group element provides the same keyboard action.\n tabIndex={-1}\n className={closeButtonVariants({ size })}\n >\n <X aria-hidden=\"true\" />\n </button>\n ) : null;\n\n const shouldWrapTooltip = maxInlineSize !== 'none' && isOverflowing;\n\n // Clickable tag — renders as <button>; live region is a sibling, not inside button\n if (isClickable) {\n const tagEl = (\n <button\n ref={ref as React.Ref<HTMLButtonElement>}\n type=\"button\"\n onClick={!disabled ? onClick : undefined}\n disabled={disabled}\n data-component=\"tag\"\n className={rootClasses}\n >\n {leadingEl}\n {labelEl}\n </button>\n );\n return shouldWrapTooltip ? (\n <Tooltip label={label}>{tagEl}</Tooltip>\n ) : (\n tagEl\n );\n }\n\n // Removable tag — focusable <span> with embedded close button\n if (isRemovable) {\n const tagEl = (\n // eslint-disable-next-line jsx-a11y/no-noninteractive-element-interactions -- removable tag is focusable as a group; Backspace/Delete keyboard removal handled via onKeyDown\n <span\n ref={ref as React.Ref<HTMLSpanElement>}\n role=\"group\"\n aria-label={label}\n tabIndex={disabled ? -1 : 0}\n aria-disabled={disabled || undefined}\n onKeyDown={handleKeyDown}\n data-component=\"tag\"\n className={rootClasses}\n >\n {liveRegion}\n {leadingEl}\n {labelEl}\n {closeButton}\n </span>\n );\n return shouldWrapTooltip ? (\n <Tooltip label={label}>{tagEl}</Tooltip>\n ) : (\n tagEl\n );\n }\n\n // Decorative tag — plain <span>, no interactive role\n const tagEl = (\n <span\n ref={ref as React.Ref<HTMLSpanElement>}\n data-component=\"tag\"\n className={tagVariants({ variant, fill, size, className })}\n >\n {leadingEl}\n {labelEl}\n </span>\n );\n return shouldWrapTooltip ? <Tooltip label={label}>{tagEl}</Tooltip> : tagEl;\n },\n);\n\nTag.displayName = 'Tag';\n"],"names":["tagVariants","cva","closeButtonVariants","Tag","forwardRef","label","variant","fill","size","leading","onRemove","onClick","disabled","maxInlineSize","className","ref","t","useTranslation","labelRef","useRef","isOverflowing","setIsOverflowing","useState","announcement","setAnnouncement","useEffect","el","check","observer","handleKeyDown","e","announce","handleRemove","isRemovable","isClickable","rootClasses","leadingEl","jsx","labelEl","liveRegion","closeButton","X","shouldWrapTooltip","tagEl","jsxs","Tooltip"],"mappings":"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"}
|
|
@@ -1,18 +1,19 @@
|
|
|
1
1
|
import { jsx as e, jsxs as l } from "react/jsx-runtime";
|
|
2
2
|
import { forwardRef as v } from "react";
|
|
3
|
-
import { c as
|
|
4
|
-
import { useTranslation as
|
|
3
|
+
import { c as b } from "./index-D2ZczOXr.js";
|
|
4
|
+
import { useTranslation as g } from "react-i18next";
|
|
5
5
|
import { C as x } from "./chevron-right-BrpYejk0.js";
|
|
6
6
|
import { S as y } from "./square-check-big-Jr-0202D.js";
|
|
7
7
|
import { C } from "./circle-alert-ChA9opNA.js";
|
|
8
8
|
import { S as N } from "./square-CZoGU14v.js";
|
|
9
|
-
const k =
|
|
9
|
+
const k = b(
|
|
10
10
|
[
|
|
11
11
|
"ds:relative ds:flex ds:items-start ds:gap-[var(--spacing-sm)]",
|
|
12
12
|
"ds:rounded-[var(--radius-sm)]",
|
|
13
13
|
"ds:transition-colors",
|
|
14
14
|
"ds:motion-reduce:transition-none",
|
|
15
15
|
"ds:text-start ds:group",
|
|
16
|
+
"ds:border ds:border-[color:var(--card-border)] ds:[.theme-accessible_&]:border-2",
|
|
16
17
|
"ds:forced-colors:border ds:forced-colors:border-[CanvasText]"
|
|
17
18
|
].join(" "),
|
|
18
19
|
{
|
|
@@ -53,7 +54,7 @@ function T({
|
|
|
53
54
|
}
|
|
54
55
|
const w = v(
|
|
55
56
|
({ item: s, size: a = "sm", onActivate: r, className: u, ...f }, p) => {
|
|
56
|
-
const { t: m } =
|
|
57
|
+
const { t: m } = g(), t = !!r, h = !!s.url && S(s.url), n = m("taskCard.itemLabel", {
|
|
57
58
|
title: s.title,
|
|
58
59
|
due: s.dueLabel ?? "",
|
|
59
60
|
defaultValue: '{{title}}{{due, prepend, " · "}}'
|
|
@@ -114,4 +115,4 @@ export {
|
|
|
114
115
|
w as T,
|
|
115
116
|
S as i
|
|
116
117
|
};
|
|
117
|
-
//# sourceMappingURL=task-card-
|
|
118
|
+
//# sourceMappingURL=task-card-CPyQ5AXC.js.map
|
|
@@ -0,0 +1 @@
|
|
|
1
|
+
{"version":3,"file":"task-card-CPyQ5AXC.js","sources":["../../src/components/task-card/task-card.tsx"],"sourcesContent":["import { forwardRef, type HTMLAttributes, type ReactNode } from 'react';\nimport { cva, type VariantProps } from 'class-variance-authority';\nimport { useTranslation } from 'react-i18next';\nimport { CheckSquare, Square, AlertCircle, ChevronRight } from 'lucide-react';\n\n/* ------------------------------------------------------------------ */\n/* Types */\n/* ------------------------------------------------------------------ */\n\nexport type TaskStatus = 'open' | 'in-progress' | 'done';\nexport type TaskPriority = 'low' | 'normal' | 'high';\n\nexport interface TaskItem {\n /** Unique identifier for the task. */\n id: string;\n /** Title — single line, primary content. */\n title: string;\n /** Optional secondary line (e.g. \"Patient A · Due today\"). */\n description?: string;\n /**\n * Localised due-date hint (e.g. \"Due today\" / \"Tomorrow\"). Rendered as a\n * trailing eyebrow chip when set; consumers compute the bucket and pass\n * the localised string.\n */\n dueLabel?: string;\n /** Lifecycle state — drives the leading icon. */\n status?: TaskStatus;\n /** Priority — `high` colours the leading icon as `--destructive`. */\n priority?: TaskPriority;\n /** Optional deep link — when present the row is an anchor. */\n url?: string;\n}\n\nexport interface TaskCardProps\n extends\n Omit<HTMLAttributes<HTMLDivElement>, 'onClick' | 'role' | 'title'>,\n VariantProps<typeof taskCardVariants> {\n /** The task to render. */\n item: TaskItem;\n /** Visual density. */\n size?: 'sm' | 'md';\n /** Fires when the row is activated (click / Enter / Space). */\n onActivate?: (item: TaskItem) => void;\n}\n\n/* ------------------------------------------------------------------ */\n/* CVA */\n/* ------------------------------------------------------------------ */\n\nconst taskCardVariants = cva(\n [\n 'ds:relative ds:flex ds:items-start ds:gap-[var(--spacing-sm)]',\n 'ds:rounded-[var(--radius-sm)]',\n 'ds:transition-colors',\n 'ds:motion-reduce:transition-none',\n 'ds:text-start ds:group',\n 'ds:border ds:border-[color:var(--card-border)] ds:[.theme-accessible_&]:border-2',\n 'ds:forced-colors:border ds:forced-colors:border-[CanvasText]',\n ].join(' '),\n {\n variants: {\n size: {\n sm: 'ds:p-[var(--spacing-sm)]',\n md: 'ds:p-[var(--spacing-md)]',\n },\n interactive: {\n true: 'ds:hover:bg-[color:var(--muted)]/40 ds:cursor-pointer',\n false: '',\n },\n },\n defaultVariants: {\n size: 'sm',\n interactive: false,\n },\n },\n);\n\nconst stretchedLinkClass = [\n 'ds:focus-visible:outline-none',\n \"ds:after:content-[''] ds:after:absolute ds:after:inset-0 ds:after:rounded-[var(--radius-sm)]\",\n 'ds:after:pointer-events-auto',\n 'ds:focus-visible:after:outline-[length:var(--focus-ring-width)]',\n 'ds:focus-visible:after:outline-solid',\n 'ds:focus-visible:after:outline-[color:var(--ring)]',\n 'ds:focus-visible:after:outline-offset-[length:var(--focus-ring-offset)]',\n 'ds:forced-colors:focus-visible:after:outline-[CanvasText]',\n].join(' ');\n\n/* ------------------------------------------------------------------ */\n/* Helpers */\n/* ------------------------------------------------------------------ */\n\nexport function isSafeTaskUrl(url: string): boolean {\n return /^(https?:\\/\\/(?!\\/)|\\/(?!\\/)|#)/.test(url);\n}\n\nfunction StatusIcon({\n status,\n priority,\n}: {\n status?: TaskStatus;\n priority?: TaskPriority;\n}): ReactNode {\n const tone =\n priority === 'high'\n ? 'ds:text-[color:var(--destructive)]'\n : 'ds:text-[color:var(--muted-foreground)]';\n if (status === 'done') {\n return <CheckSquare aria-hidden=\"true\" className={`ds:size-4 ${tone}`} />;\n }\n if (priority === 'high') {\n return <AlertCircle aria-hidden=\"true\" className={`ds:size-4 ${tone}`} />;\n }\n return <Square aria-hidden=\"true\" className={`ds:size-4 ${tone}`} />;\n}\n\n/* ------------------------------------------------------------------ */\n/* Component */\n/* ------------------------------------------------------------------ */\n\nexport const TaskCard = forwardRef<HTMLDivElement, TaskCardProps>(\n ({ item, size = 'sm', onActivate, className, ...rest }, ref) => {\n const { t } = useTranslation();\n const interactive = !!onActivate;\n const hasSafeUrl = !!item.url && isSafeTaskUrl(item.url);\n const ariaLabel = t('taskCard.itemLabel', {\n title: item.title,\n due: item.dueLabel ?? '',\n defaultValue: '{{title}}{{due, prepend, \" · \"}}',\n });\n\n const titleNode = (\n <span className=\"ds:flex-1 ds:min-w-0 ds:truncate type-body-sm ds:text-[color:var(--foreground)]\">\n {item.title}\n </span>\n );\n\n let activator: ReactNode;\n if (interactive && hasSafeUrl) {\n activator = (\n <a\n href={item.url}\n aria-label={ariaLabel}\n className={stretchedLinkClass + ' ds:contents'}\n onClick={(e) => {\n if (e.defaultPrevented || e.metaKey || e.ctrlKey || e.shiftKey)\n return;\n onActivate?.(item);\n }}\n >\n {titleNode}\n </a>\n );\n } else if (interactive) {\n activator = (\n <button\n type=\"button\"\n aria-label={ariaLabel}\n className={\n stretchedLinkClass +\n ' ds:contents ds:bg-transparent ds:border-0 ds:p-0 ds:text-start'\n }\n onClick={() => onActivate?.(item)}\n >\n {titleNode}\n </button>\n );\n } else {\n activator = titleNode;\n }\n\n return (\n <div\n ref={ref}\n role=\"listitem\"\n data-component=\"task-card\"\n data-component-id={item.id}\n data-status={item.status ?? 'open'}\n data-priority={item.priority ?? 'normal'}\n className={taskCardVariants({ size, interactive, className })}\n {...rest}\n >\n <span className=\"ds:mt-[var(--spacing-2xs)] ds:shrink-0\">\n <StatusIcon status={item.status} priority={item.priority} />\n </span>\n\n <div className=\"ds:flex-1 ds:min-w-0 ds:flex ds:flex-col ds:gap-[var(--spacing-2xs)]\">\n {activator}\n {item.description ? (\n <span className=\"type-body-sm ds:text-[color:var(--muted-foreground)] ds:truncate\">\n {item.description}\n </span>\n ) : null}\n {item.dueLabel ? (\n <span className=\"type-eyebrow ds:text-[color:var(--muted-foreground)]\">\n {item.dueLabel}\n </span>\n ) : null}\n </div>\n\n {interactive ? (\n <ChevronRight\n aria-hidden=\"true\"\n className=\"ds:mt-[var(--spacing-2xs)] ds:size-4 ds:shrink-0 ds:text-[color:var(--muted-foreground)] ds:opacity-0 ds:transition-opacity ds:motion-reduce:transition-none ds:group-hover:opacity-100 ds:group-focus-within:opacity-100 ds:rtl:rotate-180\"\n />\n ) : null}\n </div>\n );\n },\n);\n\nTaskCard.displayName = 'TaskCard';\n"],"names":["taskCardVariants","cva","stretchedLinkClass","isSafeTaskUrl","url","StatusIcon","status","priority","tone","CheckSquare","AlertCircle","Square","TaskCard","forwardRef","item","size","onActivate","className","rest","ref","t","useTranslation","interactive","hasSafeUrl","ariaLabel","titleNode","jsx","activator","e","jsxs","ChevronRight"],"mappings":"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"}
|