@camunda/design-system 0.64.0 → 0.66.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/README.md +41 -0
- package/dist/carbon-compat/accordion-skeleton.js +1 -1
- package/dist/carbon-compat/accordion-skeleton.js.map +1 -1
- package/dist/carbon-compat/accordion.js +1 -1
- package/dist/carbon-compat/accordion.js.map +1 -1
- package/dist/carbon-compat/c3-data-table.js +2 -2
- package/dist/carbon-compat/c3-data-table.js.map +1 -1
- package/dist/carbon-compat/checkbox.d.ts +2 -2
- package/dist/carbon-compat/checkbox.d.ts.map +1 -1
- package/dist/carbon-compat/checkbox.js +24 -12
- package/dist/carbon-compat/checkbox.js.map +1 -1
- package/dist/carbon-compat/combo-box.d.ts.map +1 -1
- package/dist/carbon-compat/combo-box.js +8 -7
- package/dist/carbon-compat/combo-box.js.map +1 -1
- package/dist/carbon-compat/date-picker.d.ts +2 -0
- package/dist/carbon-compat/date-picker.d.ts.map +1 -1
- package/dist/carbon-compat/date-picker.js +36 -8
- package/dist/carbon-compat/date-picker.js.map +1 -1
- package/dist/carbon-compat/dropdown.d.ts.map +1 -1
- package/dist/carbon-compat/dropdown.js +9 -8
- package/dist/carbon-compat/dropdown.js.map +1 -1
- package/dist/carbon-compat/field-messages.d.ts +37 -0
- package/dist/carbon-compat/field-messages.d.ts.map +1 -0
- package/dist/carbon-compat/field-messages.js +47 -0
- package/dist/carbon-compat/field-messages.js.map +1 -0
- package/dist/carbon-compat/filterable-multi-select.d.ts +3 -1
- package/dist/carbon-compat/filterable-multi-select.d.ts.map +1 -1
- package/dist/carbon-compat/filterable-multi-select.js +11 -9
- package/dist/carbon-compat/filterable-multi-select.js.map +1 -1
- package/dist/carbon-compat/form-group.js +1 -1
- package/dist/carbon-compat/form-group.js.map +1 -1
- package/dist/carbon-compat/link.js +1 -1
- package/dist/carbon-compat/link.js.map +1 -1
- package/dist/carbon-compat/modal.d.ts.map +1 -1
- package/dist/carbon-compat/modal.js +22 -4
- package/dist/carbon-compat/modal.js.map +1 -1
- package/dist/carbon-compat/multi-select.d.ts +3 -1
- package/dist/carbon-compat/multi-select.d.ts.map +1 -1
- package/dist/carbon-compat/multi-select.js +11 -9
- package/dist/carbon-compat/multi-select.js.map +1 -1
- package/dist/carbon-compat/radio-button.d.ts.map +1 -1
- package/dist/carbon-compat/radio-button.js +11 -11
- package/dist/carbon-compat/radio-button.js.map +1 -1
- package/dist/carbon-compat/radio-tile.js +1 -1
- package/dist/carbon-compat/radio-tile.js.map +1 -1
- package/dist/carbon-compat/select.d.ts.map +1 -1
- package/dist/carbon-compat/select.js +8 -7
- package/dist/carbon-compat/select.js.map +1 -1
- package/dist/carbon-compat/stories/field-message-expect.d.ts +7 -0
- package/dist/carbon-compat/stories/field-message-expect.d.ts.map +1 -0
- package/dist/carbon-compat/stories/field-message-expect.js +20 -0
- package/dist/carbon-compat/stories/field-message-expect.js.map +1 -0
- package/dist/carbon-compat/table-batch-actions.d.ts.map +1 -1
- package/dist/carbon-compat/table-batch-actions.js +2 -2
- package/dist/carbon-compat/table-batch-actions.js.map +1 -1
- package/dist/carbon-compat/text-area.d.ts.map +1 -1
- package/dist/carbon-compat/text-area.js +8 -21
- package/dist/carbon-compat/text-area.js.map +1 -1
- package/dist/carbon-compat/text-input.d.ts.map +1 -1
- package/dist/carbon-compat/text-input.js +6 -24
- package/dist/carbon-compat/text-input.js.map +1 -1
- package/dist/carbon-compat/tile.js +2 -2
- package/dist/carbon-compat/tile.js.map +1 -1
- package/dist/carbon-compat/time-picker.d.ts.map +1 -1
- package/dist/carbon-compat/time-picker.js +8 -15
- package/dist/carbon-compat/time-picker.js.map +1 -1
- package/dist/src/components/ui/alert-dialog.d.ts +8 -1
- package/dist/src/components/ui/alert-dialog.d.ts.map +1 -1
- package/dist/src/components/ui/alert-dialog.js +21 -2
- package/dist/src/components/ui/alert-dialog.js.map +1 -1
- package/dist/src/components/ui/checkbox.d.ts +11 -1
- package/dist/src/components/ui/checkbox.d.ts.map +1 -1
- package/dist/src/components/ui/checkbox.js +13 -2
- package/dist/src/components/ui/checkbox.js.map +1 -1
- package/dist/src/components/ui/code-block.d.ts +2 -0
- package/dist/src/components/ui/code-block.d.ts.map +1 -1
- package/dist/src/components/ui/code-block.js +27 -12
- package/dist/src/components/ui/code-block.js.map +1 -1
- package/dist/src/components/ui/combobox.d.ts.map +1 -1
- package/dist/src/components/ui/combobox.js +5 -3
- package/dist/src/components/ui/combobox.js.map +1 -1
- package/dist/src/components/ui/command.d.ts +9 -1
- package/dist/src/components/ui/command.d.ts.map +1 -1
- package/dist/src/components/ui/command.js +9 -2
- package/dist/src/components/ui/command.js.map +1 -1
- package/dist/src/components/ui/data-table.d.ts +28 -1
- package/dist/src/components/ui/data-table.d.ts.map +1 -1
- package/dist/src/components/ui/data-table.js +17 -8
- package/dist/src/components/ui/data-table.js.map +1 -1
- package/dist/src/components/ui/date-picker.d.ts +3 -0
- package/dist/src/components/ui/date-picker.d.ts.map +1 -1
- package/dist/src/components/ui/date-picker.js +2 -2
- package/dist/src/components/ui/date-picker.js.map +1 -1
- package/dist/src/components/ui/date-range-picker.d.ts +3 -0
- package/dist/src/components/ui/date-range-picker.d.ts.map +1 -1
- package/dist/src/components/ui/date-range-picker.js +2 -2
- package/dist/src/components/ui/date-range-picker.js.map +1 -1
- package/dist/src/components/ui/dropdown.js +4 -4
- package/dist/src/components/ui/dropdown.js.map +1 -1
- package/dist/src/components/ui/empty-state.d.ts +1 -0
- package/dist/src/components/ui/empty-state.d.ts.map +1 -1
- package/dist/src/components/ui/empty-state.js +7 -2
- package/dist/src/components/ui/empty-state.js.map +1 -1
- package/dist/src/components/ui/file-uploader.d.ts.map +1 -1
- package/dist/src/components/ui/file-uploader.js +10 -10
- package/dist/src/components/ui/file-uploader.js.map +1 -1
- package/dist/src/components/ui/multi-select.d.ts +4 -1
- package/dist/src/components/ui/multi-select.d.ts.map +1 -1
- package/dist/src/components/ui/multi-select.js +6 -6
- package/dist/src/components/ui/multi-select.js.map +1 -1
- package/dist/src/components/ui/page-layout.js +1 -1
- package/dist/src/components/ui/page-layout.js.map +1 -1
- package/dist/src/components/ui/select.js +1 -1
- package/dist/src/components/ui/select.js.map +1 -1
- package/dist/src/components/ui/split-button.js +1 -1
- package/dist/src/components/ui/split-button.js.map +1 -1
- package/dist/src/components/ui/switch.js +1 -1
- package/dist/src/components/ui/switch.js.map +1 -1
- package/dist/src/examples/shared/DashboardSection.d.ts.map +1 -1
- package/dist/src/examples/shared/DashboardSection.js +1 -1
- package/dist/src/examples/shared/DashboardSection.js.map +1 -1
- package/dist/styles.css +47 -21
- package/package.json +2 -2
|
@@ -0,0 +1,20 @@
|
|
|
1
|
+
import { expect } from "storybook/test";
|
|
2
|
+
/**
|
|
3
|
+
* Asserts that `message` is wired to `control` the way carbon-compat's
|
|
4
|
+
* `fieldMessages` promises: a real, non-`undefined` id listed in
|
|
5
|
+
* `aria-describedby`, plus `aria-invalid`/`aria-errormessage` only for errors.
|
|
6
|
+
*/
|
|
7
|
+
export async function expectMessageWiring(control, message, kind) {
|
|
8
|
+
await expect(message.id).toBeTruthy();
|
|
9
|
+
await expect(message.id).not.toContain("undefined");
|
|
10
|
+
await expect((control.getAttribute("aria-describedby") ?? "").split(" ")).toContain(message.id);
|
|
11
|
+
if (kind === "error") {
|
|
12
|
+
await expect(control).toHaveAttribute("aria-invalid", "true");
|
|
13
|
+
await expect(control).toHaveAttribute("aria-errormessage", message.id);
|
|
14
|
+
}
|
|
15
|
+
else {
|
|
16
|
+
await expect(control).not.toHaveAttribute("aria-invalid");
|
|
17
|
+
await expect(control).not.toHaveAttribute("aria-errormessage");
|
|
18
|
+
}
|
|
19
|
+
}
|
|
20
|
+
//# sourceMappingURL=field-message-expect.js.map
|
|
@@ -0,0 +1 @@
|
|
|
1
|
+
{"version":3,"file":"field-message-expect.js","sourceRoot":"","sources":["../../../carbon-compat/stories/field-message-expect.ts"],"names":[],"mappings":"AAAA,OAAO,EAAE,MAAM,EAAE,MAAM,gBAAgB,CAAC;AAExC;;;;GAIG;AACH,MAAM,CAAC,KAAK,UAAU,mBAAmB,CACvC,OAAoB,EACpB,OAAoB,EACpB,IAAiC;IAEjC,MAAM,MAAM,CAAC,OAAO,CAAC,EAAE,CAAC,CAAC,UAAU,EAAE,CAAC;IACtC,MAAM,MAAM,CAAC,OAAO,CAAC,EAAE,CAAC,CAAC,GAAG,CAAC,SAAS,CAAC,WAAW,CAAC,CAAC;IACpD,MAAM,MAAM,CACV,CAAC,OAAO,CAAC,YAAY,CAAC,kBAAkB,CAAC,IAAI,EAAE,CAAC,CAAC,KAAK,CAAC,GAAG,CAAC,CAC5D,CAAC,SAAS,CAAC,OAAO,CAAC,EAAE,CAAC,CAAC;IACxB,IAAI,IAAI,KAAK,OAAO,EAAE,CAAC;QACrB,MAAM,MAAM,CAAC,OAAO,CAAC,CAAC,eAAe,CAAC,cAAc,EAAE,MAAM,CAAC,CAAC;QAC9D,MAAM,MAAM,CAAC,OAAO,CAAC,CAAC,eAAe,CAAC,mBAAmB,EAAE,OAAO,CAAC,EAAE,CAAC,CAAC;IACzE,CAAC;SAAM,CAAC;QACN,MAAM,MAAM,CAAC,OAAO,CAAC,CAAC,GAAG,CAAC,eAAe,CAAC,cAAc,CAAC,CAAC;QAC1D,MAAM,MAAM,CAAC,OAAO,CAAC,CAAC,GAAG,CAAC,eAAe,CAAC,mBAAmB,CAAC,CAAC;IACjE,CAAC;AACH,CAAC"}
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"table-batch-actions.d.ts","sourceRoot":"","sources":["../../carbon-compat/table-batch-actions.tsx"],"names":[],"mappings":"AAAA;;;;;GAKG;AAEH,OAAO,KAAK,KAAK,MAAM,OAAO,CAAC;AAM/B,MAAM,WAAW,sBAAsB;IACrC,QAAQ,CAAC,EAAE,KAAK,CAAC,SAAS,CAAC;IAC3B,SAAS,CAAC,EAAE,MAAM,CAAC;IACnB,sBAAsB,CAAC,EAAE,OAAO,CAAC;IACjC,aAAa,CAAC,EAAE,MAAM,CAAC;IACvB,QAAQ,CAAC,EAAE,KAAK,CAAC,iBAAiB,CAAC,iBAAiB,CAAC,CAAC;IACtD,iDAAiD;IACjD,eAAe,CAAC,EAAE,OAAO,CAAC;IAC1B,oMAAoM;IACpM,kBAAkB,CAAC,EAAE,MAAM,CAAC;IAC5B,mIAAmI;IACnI,WAAW,CAAC,EAAE,MAAM,CAAC;CACtB;AAED,wBAAgB,iBAAiB,CAAC,EAChC,QAAQ,EACR,SAAS,EACT,sBAAsB,EACtB,aAAa,EACb,QAAQ,EACR,kBAAkB,EAClB,WAAW,GACZ,EAAE,sBAAsB,4BAgCxB;AAED,MAAM,WAAW,qBAAsB,SAAQ,KAAK,CAAC,oBAAoB,CAAC,iBAAiB,CAAC;IAC1F,mEAAmE;IACnE,UAAU,CAAC,EAAE,OAAO,CAAC;IACrB,iDAAiD;IACjD,eAAe,CAAC,EAAE,MAAM,CAAC;IACzB,QAAQ,CAAC,EAAE,MAAM,CAAC;CACnB;AAED,wBAAgB,gBAAgB,CAAC,EAC/B,QAAQ,EACR,SAAS,EACT,UAAU,EAAE,WAAW,EACvB,eAAe,EAAE,gBAAgB,EACjC,GAAG,IAAI,EACR,EAAE,qBAAqB,
|
|
1
|
+
{"version":3,"file":"table-batch-actions.d.ts","sourceRoot":"","sources":["../../carbon-compat/table-batch-actions.tsx"],"names":[],"mappings":"AAAA;;;;;GAKG;AAEH,OAAO,KAAK,KAAK,MAAM,OAAO,CAAC;AAM/B,MAAM,WAAW,sBAAsB;IACrC,QAAQ,CAAC,EAAE,KAAK,CAAC,SAAS,CAAC;IAC3B,SAAS,CAAC,EAAE,MAAM,CAAC;IACnB,sBAAsB,CAAC,EAAE,OAAO,CAAC;IACjC,aAAa,CAAC,EAAE,MAAM,CAAC;IACvB,QAAQ,CAAC,EAAE,KAAK,CAAC,iBAAiB,CAAC,iBAAiB,CAAC,CAAC;IACtD,iDAAiD;IACjD,eAAe,CAAC,EAAE,OAAO,CAAC;IAC1B,oMAAoM;IACpM,kBAAkB,CAAC,EAAE,MAAM,CAAC;IAC5B,mIAAmI;IACnI,WAAW,CAAC,EAAE,MAAM,CAAC;CACtB;AAED,wBAAgB,iBAAiB,CAAC,EAChC,QAAQ,EACR,SAAS,EACT,sBAAsB,EACtB,aAAa,EACb,QAAQ,EACR,kBAAkB,EAClB,WAAW,GACZ,EAAE,sBAAsB,4BAgCxB;AAED,MAAM,WAAW,qBAAsB,SAAQ,KAAK,CAAC,oBAAoB,CAAC,iBAAiB,CAAC;IAC1F,mEAAmE;IACnE,UAAU,CAAC,EAAE,OAAO,CAAC;IACrB,iDAAiD;IACjD,eAAe,CAAC,EAAE,MAAM,CAAC;IACzB,QAAQ,CAAC,EAAE,MAAM,CAAC;CACnB;AAED,wBAAgB,gBAAgB,CAAC,EAC/B,QAAQ,EACR,SAAS,EACT,UAAU,EAAE,WAAW,EACvB,eAAe,EAAE,gBAAgB,EACjC,GAAG,IAAI,EACR,EAAE,qBAAqB,qBAWvB"}
|
|
@@ -13,12 +13,12 @@ export function TableBatchActions({ children, className, shouldShowBatchActions,
|
|
|
13
13
|
const { t } = useC4Dictionary();
|
|
14
14
|
if (!shouldShowBatchActions)
|
|
15
15
|
return null;
|
|
16
|
-
return (_jsxs("div", { className: cn("
|
|
16
|
+
return (_jsxs("div", { className: cn("mb-2 flex items-center gap-3 rounded-md border border-border bg-neutral-background-subtle px-4 py-2 text-sm text-neutral-foreground-strong", className), children: [totalSelected !== undefined && (_jsx("span", { className: "mr-2 font-medium", children: selectedCountLabel ??
|
|
17
17
|
t("carbonCompat.tableBatchActions.selectedCount", {
|
|
18
18
|
count: totalSelected,
|
|
19
19
|
}) })), children, onCancel && (_jsx(Button, { variant: "ghost", size: "sm", className: "ml-auto", onClick: onCancel, children: cancelLabel ?? t("carbonCompat.tableBatchActions.cancel") }))] }));
|
|
20
20
|
}
|
|
21
21
|
export function TableBatchAction({ children, className, renderIcon: _renderIcon, iconDescription: _iconDescription, ...rest }) {
|
|
22
|
-
return (_jsx(Button, { variant: "
|
|
22
|
+
return (_jsx(Button, { variant: "secondary", size: "sm", className: className, ...rest, children: children }));
|
|
23
23
|
}
|
|
24
24
|
//# sourceMappingURL=table-batch-actions.js.map
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"table-batch-actions.js","sourceRoot":"","sources":["../../carbon-compat/table-batch-actions.tsx"],"names":[],"mappings":";AAAA;;;;;GAKG;AAEH,OAAO,KAAK,KAAK,MAAM,OAAO,CAAC;AAE/B,OAAO,EAAE,MAAM,EAAE,MAAM,6BAA6B,CAAC;AACrD,OAAO,EAAE,eAAe,EAAE,MAAM,yBAAyB,CAAC;AAC1D,OAAO,EAAE,EAAE,EAAE,MAAM,kBAAkB,CAAC;AAgBtC,MAAM,UAAU,iBAAiB,CAAC,EAChC,QAAQ,EACR,SAAS,EACT,sBAAsB,EACtB,aAAa,EACb,QAAQ,EACR,kBAAkB,EAClB,WAAW,GACY;IACvB,MAAM,EAAE,CAAC,EAAE,GAAG,eAAe,EAAE,CAAC;IAChC,IAAI,CAAC,sBAAsB;QAAE,OAAO,IAAI,CAAC;IAEzC,OAAO,CACL,eACE,SAAS,EAAE,EAAE,CACX,
|
|
1
|
+
{"version":3,"file":"table-batch-actions.js","sourceRoot":"","sources":["../../carbon-compat/table-batch-actions.tsx"],"names":[],"mappings":";AAAA;;;;;GAKG;AAEH,OAAO,KAAK,KAAK,MAAM,OAAO,CAAC;AAE/B,OAAO,EAAE,MAAM,EAAE,MAAM,6BAA6B,CAAC;AACrD,OAAO,EAAE,eAAe,EAAE,MAAM,yBAAyB,CAAC;AAC1D,OAAO,EAAE,EAAE,EAAE,MAAM,kBAAkB,CAAC;AAgBtC,MAAM,UAAU,iBAAiB,CAAC,EAChC,QAAQ,EACR,SAAS,EACT,sBAAsB,EACtB,aAAa,EACb,QAAQ,EACR,kBAAkB,EAClB,WAAW,GACY;IACvB,MAAM,EAAE,CAAC,EAAE,GAAG,eAAe,EAAE,CAAC;IAChC,IAAI,CAAC,sBAAsB;QAAE,OAAO,IAAI,CAAC;IAEzC,OAAO,CACL,eACE,SAAS,EAAE,EAAE,CACX,4IAA4I,EAC5I,SAAS,CACV,aAEA,aAAa,KAAK,SAAS,IAAI,CAC9B,eAAM,SAAS,EAAC,kBAAkB,YAC/B,kBAAkB;oBACjB,CAAC,CAAC,8CAA8C,EAAE;wBAChD,KAAK,EAAE,aAAa;qBACrB,CAAC,GACC,CACR,EACA,QAAQ,EACR,QAAQ,IAAI,CACX,KAAC,MAAM,IACL,OAAO,EAAC,OAAO,EACf,IAAI,EAAC,IAAI,EACT,SAAS,EAAC,SAAS,EACnB,OAAO,EAAE,QAAQ,YAEhB,WAAW,IAAI,CAAC,CAAC,uCAAuC,CAAC,GACnD,CACV,IACG,CACP,CAAC;AACJ,CAAC;AAUD,MAAM,UAAU,gBAAgB,CAAC,EAC/B,QAAQ,EACR,SAAS,EACT,UAAU,EAAE,WAAW,EACvB,eAAe,EAAE,gBAAgB,EACjC,GAAG,IAAI,EACe;IACtB,OAAO,CACL,KAAC,MAAM,IACL,OAAO,EAAC,WAAW,EACnB,IAAI,EAAC,IAAI,EACT,SAAS,EAAE,SAAS,KACf,IAAsD,YAE1D,QAAQ,GACF,CACV,CAAC;AACJ,CAAC"}
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"text-area.d.ts","sourceRoot":"","sources":["../../carbon-compat/text-area.tsx"],"names":[],"mappings":"AAAA,OAAO,KAAK,KAAK,MAAM,OAAO,CAAC;
|
|
1
|
+
{"version":3,"file":"text-area.d.ts","sourceRoot":"","sources":["../../carbon-compat/text-area.tsx"],"names":[],"mappings":"AAAA,OAAO,KAAK,KAAK,MAAM,OAAO,CAAC;AAK/B,OAAO,KAAK,EAAE,aAAa,IAAI,mBAAmB,EAAE,MAAM,eAAe,CAAC;AAE1E,MAAM,MAAM,aAAa,GAAG,mBAAmB,CAAC;AAEhD,iBAAS,QAAQ,CAAC,KAAK,EAAE,aAAa,qBA+IrC;AAED,OAAO,EAAE,QAAQ,EAAE,CAAC"}
|
|
@@ -3,26 +3,16 @@ import * as React from "react";
|
|
|
3
3
|
import { CharacterCount } from "../src/components/ui/character-count.js";
|
|
4
4
|
import { Textarea } from "../src/components/ui/textarea.js";
|
|
5
5
|
import { cn, warnDroppedProps } from "../src/lib/utils.js";
|
|
6
|
+
import { fieldMessages } from "./field-messages.js";
|
|
6
7
|
function TextArea(props) {
|
|
7
8
|
const { id, labelText, helperText, invalid, invalidText, warn, warnText, enableCounter, maxCount, counterMode, hideLabel, light, className, disabled, placeholder, value, defaultValue, onChange, onBlur, onFocus, rows, cols, readOnly, "aria-describedby": ariaDescribedBy, "aria-errormessage": ariaErrorMessage, ...rest } = props;
|
|
8
9
|
warnDroppedProps("TextArea", {
|
|
9
|
-
warn,
|
|
10
|
-
warnText,
|
|
11
10
|
hideLabel,
|
|
12
11
|
light,
|
|
13
12
|
});
|
|
14
13
|
const generatedId = React.useId();
|
|
15
14
|
const inputId = id ?? generatedId;
|
|
16
15
|
const showCounter = enableCounter && maxCount !== undefined;
|
|
17
|
-
const showInvalidText = invalid && invalidText !== undefined;
|
|
18
|
-
const showHelperText = !invalid && helperText !== undefined;
|
|
19
|
-
const errorId = showInvalidText ? `${inputId}-error-msg` : undefined;
|
|
20
|
-
const helperId = showHelperText ? `${inputId}-helper-text` : undefined;
|
|
21
|
-
// A consumer-supplied `aria-errormessage` wins outright rather than being
|
|
22
|
-
// merged: axe's own aria-errormessage rule rejects more than one id token
|
|
23
|
-
// there (unlike aria-describedby, which supports multiple).
|
|
24
|
-
const errorMessageId = ariaErrorMessage ?? errorId;
|
|
25
|
-
const message = showInvalidText ? (_jsx("span", { id: errorId, className: "text-xs text-danger-foreground-subtle", children: invalidText })) : showHelperText ? (_jsx("span", { id: helperId, className: "text-xs text-neutral-foreground-subtle", children: helperText })) : null;
|
|
26
16
|
const isControlled = value !== undefined;
|
|
27
17
|
const [uncontrolledValue, setUncontrolledValue] = React.useState(() => String(defaultValue ?? ""));
|
|
28
18
|
const liveValue = isControlled ? String(value) : uncontrolledValue;
|
|
@@ -31,20 +21,17 @@ function TextArea(props) {
|
|
|
31
21
|
setUncontrolledValue(event.target.value);
|
|
32
22
|
onChange?.(event);
|
|
33
23
|
};
|
|
34
|
-
const wrapped = labelText !== undefined || showCounter || message !== null;
|
|
35
24
|
const counterId = showCounter ? `${inputId}-counter` : undefined;
|
|
36
25
|
// Carbon auto-caps character-mode counters via native `maxLength`; word mode
|
|
37
26
|
// has no native equivalent and is left uncapped, matching Carbon's own behavior.
|
|
38
27
|
const nativeMaxLength = showCounter && counterMode !== "word" ? maxCount : undefined;
|
|
39
|
-
//
|
|
40
|
-
|
|
41
|
-
|
|
42
|
-
|
|
43
|
-
|
|
44
|
-
|
|
45
|
-
const
|
|
46
|
-
undefined;
|
|
47
|
-
const textarea = (_jsx(Textarea, { id: inputId, className: wrapped ? undefined : className, disabled: disabled, placeholder: placeholder, value: value, defaultValue: defaultValue, onChange: handleChange, onBlur: onBlur, onFocus: onFocus, rows: rows, cols: cols, readOnly: readOnly, maxLength: nativeMaxLength, "aria-invalid": invalid || undefined, "aria-errormessage": errorMessageId, "aria-describedby": describedBy, ...rest }));
|
|
28
|
+
// The counter is described alongside the message, ahead of consumer ids.
|
|
29
|
+
const { ariaProps, message } = fieldMessages(inputId, { invalid, invalidText, warn, warnText, helperText }, {
|
|
30
|
+
"aria-describedby": [counterId, ariaDescribedBy].filter(Boolean).join(" ") || undefined,
|
|
31
|
+
"aria-errormessage": ariaErrorMessage,
|
|
32
|
+
});
|
|
33
|
+
const wrapped = labelText !== undefined || showCounter || message !== null;
|
|
34
|
+
const textarea = (_jsx(Textarea, { id: inputId, className: wrapped ? undefined : className, disabled: disabled, placeholder: placeholder, value: value, defaultValue: defaultValue, onChange: handleChange, onBlur: onBlur, onFocus: onFocus, rows: rows, cols: cols, readOnly: readOnly, maxLength: nativeMaxLength, ...ariaProps, ...rest }));
|
|
48
35
|
const counter = showCounter ? (_jsx(CharacterCount, { id: counterId, value: liveValue, max: maxCount, mode: counterMode === "word" ? "word" : "character", className: "self-end" })) : null;
|
|
49
36
|
if (labelText !== undefined) {
|
|
50
37
|
return (_jsxs("div", { className: cn("flex flex-col gap-2", className), children: [_jsxs("label", { htmlFor: inputId, className: "flex flex-col gap-2 text-sm", children: [_jsx("span", { children: labelText }), textarea] }), message, counter] }));
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"text-area.js","sourceRoot":"","sources":["../../carbon-compat/text-area.tsx"],"names":[],"mappings":";AAAA,OAAO,KAAK,KAAK,MAAM,OAAO,CAAC;AAC/B,OAAO,EAAE,cAAc,EAAE,MAAM,sCAAsC,CAAC;AACtE,OAAO,EAAE,QAAQ,EAAE,MAAM,+BAA+B,CAAC;AACzD,OAAO,EAAE,EAAE,EAAE,gBAAgB,EAAE,MAAM,kBAAkB,CAAC;
|
|
1
|
+
{"version":3,"file":"text-area.js","sourceRoot":"","sources":["../../carbon-compat/text-area.tsx"],"names":[],"mappings":"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"}
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"text-input.d.ts","sourceRoot":"","sources":["../../carbon-compat/text-input.tsx"],"names":[],"mappings":"AAAA,OAAO,KAAK,KAAK,MAAM,OAAO,CAAC;
|
|
1
|
+
{"version":3,"file":"text-input.d.ts","sourceRoot":"","sources":["../../carbon-compat/text-input.tsx"],"names":[],"mappings":"AAAA,OAAO,KAAK,KAAK,MAAM,OAAO,CAAC;AAI/B,OAAO,KAAK,EAAE,cAAc,IAAI,oBAAoB,EAAE,MAAM,eAAe,CAAC;AAE5E,MAAM,MAAM,cAAc,GAAG,oBAAoB,CAAC;AAElD,iBAAS,SAAS,CAAC,KAAK,EAAE,cAAc,qBA2EvC;AAED,OAAO,EAAE,SAAS,EAAE,CAAC"}
|
|
@@ -2,6 +2,7 @@ import { jsx as _jsx, jsxs as _jsxs } from "react/jsx-runtime";
|
|
|
2
2
|
import * as React from "react";
|
|
3
3
|
import { Input } from "../src/components/ui/input.js";
|
|
4
4
|
import { cn, warnDroppedProps } from "../src/lib/utils.js";
|
|
5
|
+
import { fieldMessages } from "./field-messages.js";
|
|
5
6
|
function TextInput(props) {
|
|
6
7
|
const { className, decorator, defaultValue, disabled, enableCounter, helperText, hideLabel, id, inline, invalid, invalidText, labelText, light, maxCount, onChange, onClick, placeholder, readOnly, size, slug, type, value, warn, warnText, "aria-describedby": ariaDescribedBy, "aria-errormessage": ariaErrorMessage, ...rest } = props;
|
|
7
8
|
warnDroppedProps("TextInput", {
|
|
@@ -12,33 +13,14 @@ function TextInput(props) {
|
|
|
12
13
|
maxCount,
|
|
13
14
|
size,
|
|
14
15
|
slug,
|
|
15
|
-
warn,
|
|
16
|
-
warnText,
|
|
17
16
|
});
|
|
18
17
|
const generatedId = React.useId();
|
|
19
18
|
const resolvedId = id ?? generatedId;
|
|
20
|
-
const
|
|
21
|
-
|
|
22
|
-
|
|
23
|
-
|
|
24
|
-
|
|
25
|
-
const showHelperText = !invalid &&
|
|
26
|
-
helperText !== undefined &&
|
|
27
|
-
helperText !== null &&
|
|
28
|
-
helperText !== "";
|
|
29
|
-
const errorId = showInvalidText ? `${resolvedId}-error-msg` : undefined;
|
|
30
|
-
const helperId = showHelperText ? `${resolvedId}-helper-text` : undefined;
|
|
31
|
-
// A consumer-supplied `aria-errormessage` wins outright rather than being
|
|
32
|
-
// merged: axe's own aria-errormessage rule rejects more than one id token
|
|
33
|
-
// there (unlike aria-describedby, which supports multiple).
|
|
34
|
-
const errorMessageId = ariaErrorMessage ?? errorId;
|
|
35
|
-
// `aria-errormessage` alone is unreliable — most screen readers don't
|
|
36
|
-
// support it. Also mirroring the id into `aria-describedby` is the
|
|
37
|
-
// WAI-ARIA APG-recommended fallback technique (Carbon's own TimePicker
|
|
38
|
-
// does the same). Without it axe's aria-errormessage check flags the
|
|
39
|
-
// reference as using no supported announcement technique.
|
|
40
|
-
const describedBy = [errorId, helperId, ariaDescribedBy].filter(Boolean).join(" ") || undefined;
|
|
41
|
-
return (_jsxs("div", { className: cn("flex flex-col gap-1", className), children: [labelText !== undefined ? (_jsx("label", { htmlFor: resolvedId, className: cn("text-sm font-medium", hideLabel && "sr-only"), children: labelText })) : null, _jsx(Input, { id: resolvedId, type: type, value: value, defaultValue: defaultValue, disabled: disabled, readOnly: readOnly, placeholder: placeholder, onChange: onChange, onClick: onClick, "aria-invalid": invalid || undefined, "aria-errormessage": errorMessageId, "aria-describedby": describedBy, ...rest }), showInvalidText ? (_jsx("span", { id: errorId, className: "text-xs text-danger-foreground-subtle", children: invalidText })) : null, showHelperText ? (_jsx("span", { id: helperId, className: "text-xs text-neutral-foreground-subtle", children: helperText })) : null] }));
|
|
19
|
+
const { ariaProps, message } = fieldMessages(resolvedId, { invalid, invalidText, warn, warnText, helperText }, {
|
|
20
|
+
"aria-describedby": ariaDescribedBy,
|
|
21
|
+
"aria-errormessage": ariaErrorMessage,
|
|
22
|
+
});
|
|
23
|
+
return (_jsxs("div", { className: cn("flex flex-col gap-1", className), children: [labelText !== undefined ? (_jsx("label", { htmlFor: resolvedId, className: cn("text-sm font-medium", hideLabel && "sr-only"), children: labelText })) : null, _jsx(Input, { id: resolvedId, type: type, value: value, defaultValue: defaultValue, disabled: disabled, readOnly: readOnly, placeholder: placeholder, onChange: onChange, onClick: onClick, ...ariaProps, ...rest }), message] }));
|
|
42
24
|
}
|
|
43
25
|
export { TextInput };
|
|
44
26
|
//# sourceMappingURL=text-input.js.map
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"text-input.js","sourceRoot":"","sources":["../../carbon-compat/text-input.tsx"],"names":[],"mappings":";AAAA,OAAO,KAAK,KAAK,MAAM,OAAO,CAAC;AAC/B,OAAO,EAAE,KAAK,EAAE,MAAM,4BAA4B,CAAC;AACnD,OAAO,EAAE,EAAE,EAAE,gBAAgB,EAAE,MAAM,kBAAkB,CAAC;
|
|
1
|
+
{"version":3,"file":"text-input.js","sourceRoot":"","sources":["../../carbon-compat/text-input.tsx"],"names":[],"mappings":";AAAA,OAAO,KAAK,KAAK,MAAM,OAAO,CAAC;AAC/B,OAAO,EAAE,KAAK,EAAE,MAAM,4BAA4B,CAAC;AACnD,OAAO,EAAE,EAAE,EAAE,gBAAgB,EAAE,MAAM,kBAAkB,CAAC;AACxD,OAAO,EAAE,aAAa,EAAE,MAAM,kBAAkB,CAAC;AAKjD,SAAS,SAAS,CAAC,KAAqB;IACtC,MAAM,EACJ,SAAS,EACT,SAAS,EACT,YAAY,EACZ,QAAQ,EACR,aAAa,EACb,UAAU,EACV,SAAS,EACT,EAAE,EACF,MAAM,EACN,OAAO,EACP,WAAW,EACX,SAAS,EACT,KAAK,EACL,QAAQ,EACR,QAAQ,EACR,OAAO,EACP,WAAW,EACX,QAAQ,EACR,IAAI,EACJ,IAAI,EACJ,IAAI,EACJ,KAAK,EACL,IAAI,EACJ,QAAQ,EACR,kBAAkB,EAAE,eAAe,EACnC,mBAAmB,EAAE,gBAAgB,EACrC,GAAG,IAAI,EACR,GAAG,KAAK,CAAC;IACV,gBAAgB,CAAC,WAAW,EAAE;QAC5B,SAAS;QACT,aAAa;QACb,MAAM;QACN,KAAK;QACL,QAAQ;QACR,IAAI;QACJ,IAAI;KACL,CAAC,CAAC;IACH,MAAM,WAAW,GAAG,KAAK,CAAC,KAAK,EAAE,CAAC;IAClC,MAAM,UAAU,GAAG,EAAE,IAAI,WAAW,CAAC;IACrC,MAAM,EAAE,SAAS,EAAE,OAAO,EAAE,GAAG,aAAa,CAC1C,UAAU,EACV,EAAE,OAAO,EAAE,WAAW,EAAE,IAAI,EAAE,QAAQ,EAAE,UAAU,EAAE,EACpD;QACE,kBAAkB,EAAE,eAAe;QACnC,mBAAmB,EAAE,gBAAgB;KACtC,CACF,CAAC;IACF,OAAO,CACL,eAAK,SAAS,EAAE,EAAE,CAAC,qBAAqB,EAAE,SAAS,CAAC,aACjD,SAAS,KAAK,SAAS,CAAC,CAAC,CAAC,CACzB,gBACE,OAAO,EAAE,UAAU,EACnB,SAAS,EAAE,EAAE,CAAC,qBAAqB,EAAE,SAAS,IAAI,SAAS,CAAC,YAE3D,SAAS,GACJ,CACT,CAAC,CAAC,CAAC,IAAI,EACR,KAAC,KAAK,IACJ,EAAE,EAAE,UAAU,EACd,IAAI,EAAE,IAAI,EACV,KAAK,EAAE,KAAK,EACZ,YAAY,EAAE,YAAY,EAC1B,QAAQ,EAAE,QAAQ,EAClB,QAAQ,EAAE,QAAQ,EAClB,WAAW,EAAE,WAAW,EACxB,QAAQ,EAAE,QAAQ,EAClB,OAAO,EAAE,OAAO,KACZ,SAAS,KACR,IAA2C,GAChD,EACD,OAAO,IACJ,CACP,CAAC;AACJ,CAAC;AAED,OAAO,EAAE,SAAS,EAAE,CAAC"}
|
|
@@ -18,9 +18,9 @@ function ClickableTile({ href, disabled, onClick, onKeyDown, decorator, light, c
|
|
|
18
18
|
}
|
|
19
19
|
onKeyDown?.(e);
|
|
20
20
|
};
|
|
21
|
-
return (_jsx("a", { "data-slot": "carbon-compat-clickable-tile", href: disabled ? undefined : href, role: href ? undefined : "button", tabIndex: disabled ? -1 : 0, "aria-disabled": disabled || undefined, onClick: disabled ? undefined : onClick, onKeyDown: handleKeyDown, className: cn("block rounded-md border bg-neutral-background-subtle px-6 py-4 text-
|
|
21
|
+
return (_jsx("a", { "data-slot": "carbon-compat-clickable-tile", href: disabled ? undefined : href, role: href ? undefined : "button", tabIndex: disabled ? -1 : 0, "aria-disabled": disabled || undefined, onClick: disabled ? undefined : onClick, onKeyDown: handleKeyDown, className: cn("block rounded-md border bg-neutral-background-subtle px-6 py-4 text-neutral-foreground-strong transition-colors", disabled
|
|
22
22
|
? "cursor-not-allowed opacity-50"
|
|
23
|
-
: "cursor-pointer hover:bg-neutral-background-
|
|
23
|
+
: "cursor-pointer hover:bg-neutral-background-medium", "focus-visible:outline-none focus-visible:ring-2 focus-visible:ring-ring", className), ...rest, children: children }));
|
|
24
24
|
}
|
|
25
25
|
export { Tile, ClickableTile };
|
|
26
26
|
//# sourceMappingURL=tile.js.map
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"tile.js","sourceRoot":"","sources":["../../carbon-compat/tile.tsx"],"names":[],"mappings":";AAAA,OAAO,KAAK,KAAK,MAAM,OAAO,CAAC;AAM/B,OAAO,EAAE,IAAI,EAAE,MAAM,2BAA2B,CAAC;AACjD,OAAO,EAAE,EAAE,EAAE,gBAAgB,EAAE,MAAM,kBAAkB,CAAC;AAKxD,SAAS,IAAI,CAAC,KAAgB;IAC5B,MAAM,EACJ,QAAQ,EACR,SAAS,EACT,SAAS,EACT,iBAAiB,EACjB,KAAK,EACL,IAAI,EACJ,GAAG,IAAI,EACR,GAAG,KAAK,CAAC;IACV,gBAAgB,CAAC,MAAM,EAAE,EAAE,SAAS,EAAE,iBAAiB,EAAE,KAAK,EAAE,IAAI,EAAE,CAAC,CAAC;IACxE,OAAO,CACL,KAAC,IAAI,IACH,SAAS,EAAE,EAAE,CAAC,MAAM,EAAE,SAAS,CAAC,KAC3B,IAA0C,YAE9C,QAAQ,GACJ,CACR,CAAC;AACJ,CAAC;AAED,SAAS,aAAa,CAAC,EACrB,IAAI,EACJ,QAAQ,EACR,OAAO,EACP,SAAS,EACT,SAAS,EACT,KAAK,EACL,QAAQ,EACR,SAAS,EACT,GAAG,IAAI,EACY;IACnB,gBAAgB,CAAC,eAAe,EAAE,EAAE,SAAS,EAAE,KAAK,EAAE,CAAC,CAAC;IACxD,MAAM,aAAa,GAAG,CAAC,CAAyC,EAAE,EAAE;QAClE,IAAI,QAAQ;YAAE,OAAO;QACrB,IAAI,CAAC,CAAC,CAAC,GAAG,KAAK,OAAO,IAAI,CAAC,CAAC,GAAG,KAAK,GAAG,CAAC,IAAI,CAAC,IAAI,EAAE,CAAC;YAClD,CAAC,CAAC,cAAc,EAAE,CAAC;YACnB,OAAO,EAAE,CAAC,CAAmD,CAAC,CAAC;QACjE,CAAC;QACD,SAAS,EAAE,CAAC,CAAC,CAAC,CAAC;IACjB,CAAC,CAAC;IACF,OAAO,CACL,yBACY,8BAA8B,EACxC,IAAI,EAAE,QAAQ,CAAC,CAAC,CAAC,SAAS,CAAC,CAAC,CAAC,IAAI,EACjC,IAAI,EAAE,IAAI,CAAC,CAAC,CAAC,SAAS,CAAC,CAAC,CAAC,QAAQ,EACjC,QAAQ,EAAE,QAAQ,CAAC,CAAC,CAAC,CAAC,CAAC,CAAC,CAAC,CAAC,CAAC,mBACZ,QAAQ,IAAI,SAAS,EACpC,OAAO,EAAE,QAAQ,CAAC,CAAC,CAAC,SAAS,CAAC,CAAC,CAAC,OAAO,EACvC,SAAS,EAAE,aAAa,EACxB,SAAS,EAAE,EAAE,CACX,
|
|
1
|
+
{"version":3,"file":"tile.js","sourceRoot":"","sources":["../../carbon-compat/tile.tsx"],"names":[],"mappings":";AAAA,OAAO,KAAK,KAAK,MAAM,OAAO,CAAC;AAM/B,OAAO,EAAE,IAAI,EAAE,MAAM,2BAA2B,CAAC;AACjD,OAAO,EAAE,EAAE,EAAE,gBAAgB,EAAE,MAAM,kBAAkB,CAAC;AAKxD,SAAS,IAAI,CAAC,KAAgB;IAC5B,MAAM,EACJ,QAAQ,EACR,SAAS,EACT,SAAS,EACT,iBAAiB,EACjB,KAAK,EACL,IAAI,EACJ,GAAG,IAAI,EACR,GAAG,KAAK,CAAC;IACV,gBAAgB,CAAC,MAAM,EAAE,EAAE,SAAS,EAAE,iBAAiB,EAAE,KAAK,EAAE,IAAI,EAAE,CAAC,CAAC;IACxE,OAAO,CACL,KAAC,IAAI,IACH,SAAS,EAAE,EAAE,CAAC,MAAM,EAAE,SAAS,CAAC,KAC3B,IAA0C,YAE9C,QAAQ,GACJ,CACR,CAAC;AACJ,CAAC;AAED,SAAS,aAAa,CAAC,EACrB,IAAI,EACJ,QAAQ,EACR,OAAO,EACP,SAAS,EACT,SAAS,EACT,KAAK,EACL,QAAQ,EACR,SAAS,EACT,GAAG,IAAI,EACY;IACnB,gBAAgB,CAAC,eAAe,EAAE,EAAE,SAAS,EAAE,KAAK,EAAE,CAAC,CAAC;IACxD,MAAM,aAAa,GAAG,CAAC,CAAyC,EAAE,EAAE;QAClE,IAAI,QAAQ;YAAE,OAAO;QACrB,IAAI,CAAC,CAAC,CAAC,GAAG,KAAK,OAAO,IAAI,CAAC,CAAC,GAAG,KAAK,GAAG,CAAC,IAAI,CAAC,IAAI,EAAE,CAAC;YAClD,CAAC,CAAC,cAAc,EAAE,CAAC;YACnB,OAAO,EAAE,CAAC,CAAmD,CAAC,CAAC;QACjE,CAAC;QACD,SAAS,EAAE,CAAC,CAAC,CAAC,CAAC;IACjB,CAAC,CAAC;IACF,OAAO,CACL,yBACY,8BAA8B,EACxC,IAAI,EAAE,QAAQ,CAAC,CAAC,CAAC,SAAS,CAAC,CAAC,CAAC,IAAI,EACjC,IAAI,EAAE,IAAI,CAAC,CAAC,CAAC,SAAS,CAAC,CAAC,CAAC,QAAQ,EACjC,QAAQ,EAAE,QAAQ,CAAC,CAAC,CAAC,CAAC,CAAC,CAAC,CAAC,CAAC,CAAC,mBACZ,QAAQ,IAAI,SAAS,EACpC,OAAO,EAAE,QAAQ,CAAC,CAAC,CAAC,SAAS,CAAC,CAAC,CAAC,OAAO,EACvC,SAAS,EAAE,aAAa,EACxB,SAAS,EAAE,EAAE,CACX,iHAAiH,EACjH,QAAQ;YACN,CAAC,CAAC,+BAA+B;YACjC,CAAC,CAAC,mDAAmD,EACvD,yEAAyE,EACzE,SAAS,CACV,KACG,IAAI,YAEP,QAAQ,GACP,CACL,CAAC;AACJ,CAAC;AAED,OAAO,EAAE,IAAI,EAAE,aAAa,EAAE,CAAC"}
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"time-picker.d.ts","sourceRoot":"","sources":["../../carbon-compat/time-picker.tsx"],"names":[],"mappings":"AAAA,OAAO,KAAK,KAAK,MAAM,OAAO,CAAC;
|
|
1
|
+
{"version":3,"file":"time-picker.d.ts","sourceRoot":"","sources":["../../carbon-compat/time-picker.tsx"],"names":[],"mappings":"AAAA,OAAO,KAAK,KAAK,MAAM,OAAO,CAAC;AAI/B,OAAO,KAAK,EACV,eAAe,IAAI,qBAAqB,EACxC,qBAAqB,IAAI,2BAA2B,EACrD,MAAM,eAAe,CAAC;AAEvB,MAAM,MAAM,eAAe,GAAG,qBAAqB,CAAC;AACpD,MAAM,MAAM,qBAAqB,GAAG,2BAA2B,CAAC;AAEhE,iBAAS,UAAU,CAAC,KAAK,EAAE,eAAe,qBAiFzC;AAED,iBAAS,gBAAgB,CAAC,KAAK,EAAE,qBAAqB,qBA4BrD;AAED,OAAO,EAAE,UAAU,EAAE,gBAAgB,EAAE,CAAC"}
|
|
@@ -2,6 +2,7 @@ import { jsx as _jsx, jsxs as _jsxs } from "react/jsx-runtime";
|
|
|
2
2
|
import * as React from "react";
|
|
3
3
|
import { Input } from "../src/components/ui/input.js";
|
|
4
4
|
import { cn, warnDroppedProps } from "../src/lib/utils.js";
|
|
5
|
+
import { fieldMessages } from "./field-messages.js";
|
|
5
6
|
function TimePicker(props) {
|
|
6
7
|
const { id, value, onChange, onBlur, onClick, disabled, readOnly, placeholder, labelText, hideLabel, invalid, invalidText, warning, warningText, type = "time", className, inputClassName, pickerClassName, children, light, maxLength, pattern, size, "aria-describedby": ariaDescribedBy, "aria-errormessage": ariaErrorMessage, ...rest } = props;
|
|
7
8
|
warnDroppedProps("TimePicker", {
|
|
@@ -11,27 +12,19 @@ function TimePicker(props) {
|
|
|
11
12
|
size,
|
|
12
13
|
inputClassName,
|
|
13
14
|
pickerClassName,
|
|
14
|
-
warning,
|
|
15
|
-
warningText,
|
|
16
15
|
});
|
|
17
16
|
const generatedId = React.useId();
|
|
18
17
|
const inputId = id ?? generatedId;
|
|
19
|
-
|
|
20
|
-
const
|
|
21
|
-
|
|
22
|
-
|
|
23
|
-
|
|
24
|
-
|
|
25
|
-
// Mirror the error id into aria-describedby alongside aria-errormessage:
|
|
26
|
-
// most screen readers don't support aria-errormessage, so the id is
|
|
27
|
-
// duplicated there as the WAI-ARIA APG-recommended fallback technique
|
|
28
|
-
// (also required for axe's aria-errormessage check to pass).
|
|
29
|
-
const describedBy = [errorId, ariaDescribedBy].filter(Boolean).join(" ") || undefined;
|
|
30
|
-
return (_jsxs("div", { className: cn("flex flex-col gap-1", className), children: [labelText !== undefined ? (_jsx("label", { htmlFor: inputId, className: cn("text-sm font-medium", hideLabel && "sr-only"), children: labelText })) : null, _jsxs("div", { className: cn("flex gap-1", pickerClassName), children: [_jsx(Input, { id: inputId, type: type, value: value, disabled: disabled, readOnly: readOnly, placeholder: placeholder, onChange: onChange, onBlur: onBlur, onClick: onClick, "aria-invalid": invalid || undefined, "aria-errormessage": errorMessageId, "aria-describedby": describedBy, className: inputClassName, ...rest }), children] }), showInvalidText ? (_jsx("span", { id: errorId, className: "text-xs text-destructive", children: invalidText })) : null] }));
|
|
18
|
+
// Carbon's TimePicker names its warn pair `warning` / `warningText`.
|
|
19
|
+
const { ariaProps, message } = fieldMessages(inputId, { invalid, invalidText, warn: warning, warnText: warningText }, {
|
|
20
|
+
"aria-describedby": ariaDescribedBy,
|
|
21
|
+
"aria-errormessage": ariaErrorMessage,
|
|
22
|
+
});
|
|
23
|
+
return (_jsxs("div", { className: cn("flex flex-col gap-1", className), children: [labelText !== undefined ? (_jsx("label", { htmlFor: inputId, className: cn("text-sm font-medium", hideLabel && "sr-only"), children: labelText })) : null, _jsxs("div", { className: cn("flex gap-1", pickerClassName), children: [_jsx(Input, { id: inputId, type: type, value: value, disabled: disabled, readOnly: readOnly, placeholder: placeholder, onChange: onChange, onBlur: onBlur, onClick: onClick, ...ariaProps, className: inputClassName, ...rest }), children] }), message] }));
|
|
31
24
|
}
|
|
32
25
|
function TimePickerSelect(props) {
|
|
33
26
|
const { id, value, defaultValue, onChange, disabled, children, className, ...rest } = props;
|
|
34
|
-
return (_jsx("select", { id: id, value: value, defaultValue: defaultValue, onChange: onChange, disabled: disabled, className: cn("h-9 rounded-lg border border-input bg-input-background px-2.5 py-1 text-sm text-foreground outline-none transition-colors focus-visible:border-
|
|
27
|
+
return (_jsx("select", { id: id, value: value, defaultValue: defaultValue, onChange: onChange, disabled: disabled, className: cn("h-9 rounded-lg border border-input bg-input-background px-2.5 py-1 text-sm text-foreground outline-none transition-colors focus-visible:border-ring focus-visible:ring-3 focus-visible:ring-ring/20 dark:focus-visible:ring-ring/40 disabled:pointer-events-none disabled:cursor-not-allowed disabled:opacity-50", className), ...rest, children: children }));
|
|
35
28
|
}
|
|
36
29
|
export { TimePicker, TimePickerSelect };
|
|
37
30
|
//# sourceMappingURL=time-picker.js.map
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"time-picker.js","sourceRoot":"","sources":["../../carbon-compat/time-picker.tsx"],"names":[],"mappings":";AAAA,OAAO,KAAK,KAAK,MAAM,OAAO,CAAC;AAC/B,OAAO,EAAE,KAAK,EAAE,MAAM,4BAA4B,CAAC;AACnD,OAAO,EAAE,EAAE,EAAE,gBAAgB,EAAE,MAAM,kBAAkB,CAAC;
|
|
1
|
+
{"version":3,"file":"time-picker.js","sourceRoot":"","sources":["../../carbon-compat/time-picker.tsx"],"names":[],"mappings":";AAAA,OAAO,KAAK,KAAK,MAAM,OAAO,CAAC;AAC/B,OAAO,EAAE,KAAK,EAAE,MAAM,4BAA4B,CAAC;AACnD,OAAO,EAAE,EAAE,EAAE,gBAAgB,EAAE,MAAM,kBAAkB,CAAC;AACxD,OAAO,EAAE,aAAa,EAAE,MAAM,kBAAkB,CAAC;AASjD,SAAS,UAAU,CAAC,KAAsB;IACxC,MAAM,EACJ,EAAE,EACF,KAAK,EACL,QAAQ,EACR,MAAM,EACN,OAAO,EACP,QAAQ,EACR,QAAQ,EACR,WAAW,EACX,SAAS,EACT,SAAS,EACT,OAAO,EACP,WAAW,EACX,OAAO,EACP,WAAW,EACX,IAAI,GAAG,MAAM,EACb,SAAS,EACT,cAAc,EACd,eAAe,EACf,QAAQ,EACR,KAAK,EACL,SAAS,EACT,OAAO,EACP,IAAI,EACJ,kBAAkB,EAAE,eAAe,EACnC,mBAAmB,EAAE,gBAAgB,EACrC,GAAG,IAAI,EACR,GAAG,KAAK,CAAC;IAEV,gBAAgB,CAAC,YAAY,EAAE;QAC7B,KAAK;QACL,SAAS;QACT,OAAO;QACP,IAAI;QACJ,cAAc;QACd,eAAe;KAChB,CAAC,CAAC;IAEH,MAAM,WAAW,GAAG,KAAK,CAAC,KAAK,EAAE,CAAC;IAClC,MAAM,OAAO,GAAG,EAAE,IAAI,WAAW,CAAC;IAClC,qEAAqE;IACrE,MAAM,EAAE,SAAS,EAAE,OAAO,EAAE,GAAG,aAAa,CAC1C,OAAO,EACP,EAAE,OAAO,EAAE,WAAW,EAAE,IAAI,EAAE,OAAO,EAAE,QAAQ,EAAE,WAAW,EAAE,EAC9D;QACE,kBAAkB,EAAE,eAAe;QACnC,mBAAmB,EAAE,gBAAgB;KACtC,CACF,CAAC;IAEF,OAAO,CACL,eAAK,SAAS,EAAE,EAAE,CAAC,qBAAqB,EAAE,SAAS,CAAC,aACjD,SAAS,KAAK,SAAS,CAAC,CAAC,CAAC,CACzB,gBACE,OAAO,EAAE,OAAO,EAChB,SAAS,EAAE,EAAE,CAAC,qBAAqB,EAAE,SAAS,IAAI,SAAS,CAAC,YAE3D,SAAS,GACJ,CACT,CAAC,CAAC,CAAC,IAAI,EACR,eAAK,SAAS,EAAE,EAAE,CAAC,YAAY,EAAE,eAAe,CAAC,aAC/C,KAAC,KAAK,IACJ,EAAE,EAAE,OAAO,EACX,IAAI,EAAE,IAAI,EACV,KAAK,EAAE,KAAK,EACZ,QAAQ,EAAE,QAAQ,EAClB,QAAQ,EAAE,QAAQ,EAClB,WAAW,EAAE,WAAW,EACxB,QAAQ,EAAE,QAAQ,EAClB,MAAM,EAAE,MAAM,EACd,OAAO,EAAE,OAAO,KACZ,SAAS,EACb,SAAS,EAAE,cAAc,KACpB,IAA2C,GAChD,EACD,QAAQ,IACL,EACL,OAAO,IACJ,CACP,CAAC;AACJ,CAAC;AAED,SAAS,gBAAgB,CAAC,KAA4B;IACpD,MAAM,EACJ,EAAE,EACF,KAAK,EACL,YAAY,EACZ,QAAQ,EACR,QAAQ,EACR,QAAQ,EACR,SAAS,EACT,GAAG,IAAI,EACR,GAAG,KAAK,CAAC;IAEV,OAAO,CACL,iBACE,EAAE,EAAE,EAAE,EACN,KAAK,EAAE,KAA2B,EAClC,YAAY,EAAE,YAAkC,EAChD,QAAQ,EAAE,QAAuD,EACjE,QAAQ,EAAE,QAAQ,EAClB,SAAS,EAAE,EAAE,CACX,kTAAkT,EAClT,SAAS,CACV,KACI,IAAsD,YAE1D,QAAQ,GACF,CACV,CAAC;AACJ,CAAC;AAED,OAAO,EAAE,UAAU,EAAE,gBAAgB,EAAE,CAAC"}
|
|
@@ -4,7 +4,14 @@ declare function AlertDialog({ ...props }: React.ComponentProps<typeof AlertDial
|
|
|
4
4
|
declare const AlertDialogTrigger: React.ForwardRefExoticComponent<Omit<AlertDialogPrimitive.AlertDialogTriggerProps & React.RefAttributes<HTMLButtonElement>, "ref"> & React.RefAttributes<HTMLButtonElement>>;
|
|
5
5
|
declare function AlertDialogPortal({ ...props }: React.ComponentProps<typeof AlertDialogPrimitive.Portal>): React.JSX.Element;
|
|
6
6
|
declare function AlertDialogOverlay({ className, ...props }: React.ComponentProps<typeof AlertDialogPrimitive.Overlay>): React.JSX.Element;
|
|
7
|
-
declare function AlertDialogContent({ className, onOpenAutoFocus, onCloseAutoFocus, initialFocusRef, restoreFocusRef, ...props }: React.ComponentProps<typeof AlertDialogPrimitive.Content> & {
|
|
7
|
+
declare function AlertDialogContent({ className, size, onOpenAutoFocus, onCloseAutoFocus, initialFocusRef, restoreFocusRef, ...props }: React.ComponentProps<typeof AlertDialogPrimitive.Content> & {
|
|
8
|
+
/**
|
|
9
|
+
* Width tier from the shared cross-overlay size scale (see
|
|
10
|
+
* docs/specs/shadcn/components-overlays.md): `sm` 400px (default), `md`
|
|
11
|
+
* 600px, `lg` 800px, `full` 90vw. Rendered as a `sm:max-w-*` class, so a
|
|
12
|
+
* consumer `className` override still wins via tailwind-merge dedup.
|
|
13
|
+
*/
|
|
14
|
+
size?: "sm" | "md" | "lg" | "full";
|
|
8
15
|
/**
|
|
9
16
|
* Element to focus when the alert opens, instead of the default — the
|
|
10
17
|
* `AlertDialogCancel` button, so a stray Enter on open can never fire the
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"alert-dialog.d.ts","sourceRoot":"","sources":["../../../../src/components/ui/alert-dialog.tsx"],"names":[],"mappings":"AAEA,OAAO,KAAK,KAAK,MAAM,OAAO,CAAC;
|
|
1
|
+
{"version":3,"file":"alert-dialog.d.ts","sourceRoot":"","sources":["../../../../src/components/ui/alert-dialog.tsx"],"names":[],"mappings":"AAEA,OAAO,KAAK,KAAK,MAAM,OAAO,CAAC;AAE/B,OAAO,EAAE,WAAW,IAAI,oBAAoB,EAAE,MAAM,UAAU,CAAC;AAc/D,iBAAS,WAAW,CAAC,EACnB,GAAG,KAAK,EACT,EAAE,KAAK,CAAC,cAAc,CAAC,OAAO,oBAAoB,CAAC,IAAI,CAAC,qBAExD;AAUD,QAAA,MAAM,kBAAkB,8KAGC,CAAC;AAE1B,iBAAS,iBAAiB,CAAC,EACzB,GAAG,KAAK,EACT,EAAE,KAAK,CAAC,cAAc,CAAC,OAAO,oBAAoB,CAAC,MAAM,CAAC,qBAI1D;AAED,iBAAS,kBAAkB,CAAC,EAC1B,SAAS,EACT,GAAG,KAAK,EACT,EAAE,KAAK,CAAC,cAAc,CAAC,OAAO,oBAAoB,CAAC,OAAO,CAAC,qBAW3D;AAwBD,iBAAS,kBAAkB,CAAC,EAC1B,SAAS,EACT,IAAI,EACJ,eAAe,EACf,gBAAgB,EAChB,eAAe,EACf,eAAe,EACf,GAAG,KAAK,EACT,EAAE,KAAK,CAAC,cAAc,CAAC,OAAO,oBAAoB,CAAC,OAAO,CAAC,GAAG;IAC7D;;;;;OAKG;IACH,IAAI,CAAC,EAAE,IAAI,GAAG,IAAI,GAAG,IAAI,GAAG,MAAM,CAAC;IACnC;;;;;;;;OAQG;IACH,eAAe,CAAC,EAAE,KAAK,CAAC,SAAS,CAAC,WAAW,GAAG,IAAI,CAAC,CAAC;IACtD;;;;;OAKG;IACH,eAAe,CAAC,EAAE,KAAK,CAAC,SAAS,CAAC,WAAW,GAAG,IAAI,CAAC,CAAC;CACvD,qBA4BA;AAED,iBAAS,iBAAiB,CAAC,EACzB,SAAS,EACT,GAAG,KAAK,EACT,EAAE,KAAK,CAAC,cAAc,CAAC,KAAK,CAAC,qBAQ7B;AAED,iBAAS,iBAAiB,CAAC,EACzB,SAAS,EACT,GAAG,KAAK,EACT,EAAE,KAAK,CAAC,cAAc,CAAC,KAAK,CAAC,qBAW7B;AAED,iBAAS,gBAAgB,CAAC,EACxB,SAAS,EACT,GAAG,KAAK,EACT,EAAE,KAAK,CAAC,cAAc,CAAC,OAAO,oBAAoB,CAAC,KAAK,CAAC,qBAUzD;AAED,iBAAS,sBAAsB,CAAC,EAC9B,SAAS,EACT,GAAG,KAAK,EACT,EAAE,KAAK,CAAC,cAAc,CAAC,OAAO,oBAAoB,CAAC,WAAW,CAAC,qBAQ/D;AAED,iBAAS,iBAAiB,CAAC,EACzB,SAAS,EACT,GAAG,KAAK,EACT,EAAE,KAAK,CAAC,cAAc,CAAC,OAAO,oBAAoB,CAAC,MAAM,CAAC,qBAO1D;AAED,iBAAS,iBAAiB,CAAC,EACzB,SAAS,EACT,GAAG,KAAK,EACT,EAAE,KAAK,CAAC,cAAc,CAAC,OAAO,oBAAoB,CAAC,MAAM,CAAC,qBAO1D;AAED,OAAO,EACL,WAAW,EACX,iBAAiB,EACjB,kBAAkB,EAClB,kBAAkB,EAClB,kBAAkB,EAClB,iBAAiB,EACjB,iBAAiB,EACjB,gBAAgB,EAChB,sBAAsB,EACtB,iBAAiB,EACjB,iBAAiB,GAClB,CAAC"}
|
|
@@ -1,6 +1,7 @@
|
|
|
1
1
|
"use client";
|
|
2
2
|
import { jsx as _jsx, jsxs as _jsxs } from "react/jsx-runtime";
|
|
3
3
|
import * as React from "react";
|
|
4
|
+
import { cva } from "class-variance-authority";
|
|
4
5
|
import { AlertDialog as AlertDialogPrimitive } from "radix-ui";
|
|
5
6
|
import { cn } from "../../lib/utils.js";
|
|
6
7
|
import { withRef } from "../../lib/with-ref.js";
|
|
@@ -21,7 +22,25 @@ function AlertDialogPortal({ ...props }) {
|
|
|
21
22
|
function AlertDialogOverlay({ className, ...props }) {
|
|
22
23
|
return (_jsx(AlertDialogPrimitive.Overlay, { "data-slot": "alert-dialog-overlay", className: cn("fixed inset-0 isolate z-50 bg-black/10 duration-100 supports-backdrop-filter:backdrop-blur-xs data-[state=open]:animate-in data-[state=open]:fade-in-0 data-[state=closed]:animate-out data-[state=closed]:fade-out-0", className), ...props }));
|
|
23
24
|
}
|
|
24
|
-
|
|
25
|
+
// Same width shape as `dialogContentVariants` (#444, #237/#267 parity): the
|
|
26
|
+
// mobile inset is a `w-*`, so the `size` variant's `sm:max-w-*` — or a
|
|
27
|
+
// consumer `className` override — is the only `max-w-*` in the DOM,
|
|
28
|
+
// cascade-safe regardless of stylesheet load order. Tiers follow the shared
|
|
29
|
+
// cross-overlay scale in docs/specs/shadcn/components-overlays.md.
|
|
30
|
+
const alertDialogContentVariants = cva("fixed top-1/2 left-1/2 z-50 grid w-[calc(100%-2rem)] -translate-x-1/2 -translate-y-1/2 gap-4 rounded-xl bg-popover p-4 text-sm text-popover-foreground ring-1 ring-border shadow-xl duration-100 outline-none sm:w-full data-[state=open]:animate-in data-[state=open]:fade-in-0 data-[state=open]:zoom-in-95 data-[state=closed]:animate-out data-[state=closed]:fade-out-0 data-[state=closed]:zoom-out-95", {
|
|
31
|
+
variants: {
|
|
32
|
+
size: {
|
|
33
|
+
sm: "sm:max-w-[400px]",
|
|
34
|
+
md: "sm:max-w-[600px]",
|
|
35
|
+
lg: "sm:max-w-[800px]",
|
|
36
|
+
full: "sm:max-w-[90vw]",
|
|
37
|
+
},
|
|
38
|
+
},
|
|
39
|
+
defaultVariants: {
|
|
40
|
+
size: "sm",
|
|
41
|
+
},
|
|
42
|
+
});
|
|
43
|
+
function AlertDialogContent({ className, size, onOpenAutoFocus, onCloseAutoFocus, initialFocusRef, restoreFocusRef, ...props }) {
|
|
25
44
|
const dialogFocusReturn = useDialogFocusReturn(restoreFocusRef);
|
|
26
45
|
return (_jsx(AlertDialogPortal, { children: _jsxs(C4Provider, { children: [_jsx(AlertDialogOverlay, {}), _jsx(AlertDialogPrimitive.Content, { "data-slot": "alert-dialog-content",
|
|
27
46
|
// #26413 — restore focus to the real launcher on close, even for
|
|
@@ -31,7 +50,7 @@ function AlertDialogContent({ className, onOpenAutoFocus, onCloseAutoFocus, init
|
|
|
31
50
|
onOpenAutoFocus: composeOpenAutoFocus(composeInitialFocus(onOpenAutoFocus, initialFocusRef), dialogFocusReturn.onOpenAutoFocus),
|
|
32
51
|
// #259 — make the trigger's restored focus ring visible on a mouse
|
|
33
52
|
// close (see focus-visible-on-close).
|
|
34
|
-
onCloseAutoFocus: composeCloseAutoFocus(onCloseAutoFocus, dialogFocusReturn.onCloseAutoFocus), className: cn(
|
|
53
|
+
onCloseAutoFocus: composeCloseAutoFocus(onCloseAutoFocus, dialogFocusReturn.onCloseAutoFocus), className: cn(alertDialogContentVariants({ size }), className), ...props })] }) }));
|
|
35
54
|
}
|
|
36
55
|
function AlertDialogHeader({ className, ...props }) {
|
|
37
56
|
return (_jsx("div", { "data-slot": "alert-dialog-header", className: cn("flex flex-col gap-2", className), ...props }));
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"alert-dialog.js","sourceRoot":"","sources":["../../../../src/components/ui/alert-dialog.tsx"],"names":[],"mappings":"AAAA,YAAY,CAAC;;AAEb,OAAO,KAAK,KAAK,MAAM,OAAO,CAAC;AAC/B,OAAO,EAAE,WAAW,IAAI,oBAAoB,EAAE,MAAM,UAAU,CAAC;AAE/D,OAAO,EAAE,EAAE,EAAE,MAAM,WAAW,CAAC;AAC/B,OAAO,EAAE,OAAO,EAAE,MAAM,cAAc,CAAC;AACvC,OAAO,EACL,qBAAqB,EACrB,mBAAmB,EACnB,oBAAoB,EACpB,oBAAoB,GACrB,MAAM,4BAA4B,CAAC;AACpC,OAAO,EAAE,UAAU,EAAE,MAAM,eAAe,CAAC;AAC3C,OAAO,EAAE,cAAc,EAAE,MAAM,UAAU,CAAC;AAC1C,OAAO,EAAE,kBAAkB,EAAE,MAAM,cAAc,CAAC;AAElD,SAAS,WAAW,CAAC,EACnB,GAAG,KAAK,EAC+C;IACvD,OAAO,KAAC,oBAAoB,CAAC,IAAI,iBAAW,cAAc,KAAK,KAAK,GAAI,CAAC;AAC3E,CAAC;AAED,SAAS,sBAAsB,CAAC,EAC9B,GAAG,KAAK,EACkD;IAC1D,OAAO,CACL,KAAC,oBAAoB,CAAC,OAAO,iBAAW,sBAAsB,KAAK,KAAK,GAAI,CAC7E,CAAC;AACJ,CAAC;AAED,MAAM,kBAAkB,GAAG,OAAO,CAGhC,sBAAsB,CAAC,CAAC;AAE1B,SAAS,iBAAiB,CAAC,EACzB,GAAG,KAAK,EACiD;IACzD,OAAO,CACL,KAAC,oBAAoB,CAAC,MAAM,iBAAW,qBAAqB,KAAK,KAAK,GAAI,CAC3E,CAAC;AACJ,CAAC;AAED,SAAS,kBAAkB,CAAC,EAC1B,SAAS,EACT,GAAG,KAAK,EACkD;IAC1D,OAAO,CACL,KAAC,oBAAoB,CAAC,OAAO,iBACjB,sBAAsB,EAChC,SAAS,EAAE,EAAE,CACX,uNAAuN,EACvN,SAAS,CACV,KACG,KAAK,GACT,CACH,CAAC;AACJ,CAAC;AAED,SAAS,kBAAkB,CAAC,EAC1B,SAAS,EACT,eAAe,EACf,gBAAgB,EAChB,eAAe,EACf,eAAe,EACf,GAAG,KAAK,
|
|
1
|
+
{"version":3,"file":"alert-dialog.js","sourceRoot":"","sources":["../../../../src/components/ui/alert-dialog.tsx"],"names":[],"mappings":"AAAA,YAAY,CAAC;;AAEb,OAAO,KAAK,KAAK,MAAM,OAAO,CAAC;AAC/B,OAAO,EAAE,GAAG,EAAE,MAAM,0BAA0B,CAAC;AAC/C,OAAO,EAAE,WAAW,IAAI,oBAAoB,EAAE,MAAM,UAAU,CAAC;AAE/D,OAAO,EAAE,EAAE,EAAE,MAAM,WAAW,CAAC;AAC/B,OAAO,EAAE,OAAO,EAAE,MAAM,cAAc,CAAC;AACvC,OAAO,EACL,qBAAqB,EACrB,mBAAmB,EACnB,oBAAoB,EACpB,oBAAoB,GACrB,MAAM,4BAA4B,CAAC;AACpC,OAAO,EAAE,UAAU,EAAE,MAAM,eAAe,CAAC;AAC3C,OAAO,EAAE,cAAc,EAAE,MAAM,UAAU,CAAC;AAC1C,OAAO,EAAE,kBAAkB,EAAE,MAAM,cAAc,CAAC;AAElD,SAAS,WAAW,CAAC,EACnB,GAAG,KAAK,EAC+C;IACvD,OAAO,KAAC,oBAAoB,CAAC,IAAI,iBAAW,cAAc,KAAK,KAAK,GAAI,CAAC;AAC3E,CAAC;AAED,SAAS,sBAAsB,CAAC,EAC9B,GAAG,KAAK,EACkD;IAC1D,OAAO,CACL,KAAC,oBAAoB,CAAC,OAAO,iBAAW,sBAAsB,KAAK,KAAK,GAAI,CAC7E,CAAC;AACJ,CAAC;AAED,MAAM,kBAAkB,GAAG,OAAO,CAGhC,sBAAsB,CAAC,CAAC;AAE1B,SAAS,iBAAiB,CAAC,EACzB,GAAG,KAAK,EACiD;IACzD,OAAO,CACL,KAAC,oBAAoB,CAAC,MAAM,iBAAW,qBAAqB,KAAK,KAAK,GAAI,CAC3E,CAAC;AACJ,CAAC;AAED,SAAS,kBAAkB,CAAC,EAC1B,SAAS,EACT,GAAG,KAAK,EACkD;IAC1D,OAAO,CACL,KAAC,oBAAoB,CAAC,OAAO,iBACjB,sBAAsB,EAChC,SAAS,EAAE,EAAE,CACX,uNAAuN,EACvN,SAAS,CACV,KACG,KAAK,GACT,CACH,CAAC;AACJ,CAAC;AAED,4EAA4E;AAC5E,uEAAuE;AACvE,oEAAoE;AACpE,4EAA4E;AAC5E,mEAAmE;AACnE,MAAM,0BAA0B,GAAG,GAAG,CACpC,8YAA8Y,EAC9Y;IACE,QAAQ,EAAE;QACR,IAAI,EAAE;YACJ,EAAE,EAAE,kBAAkB;YACtB,EAAE,EAAE,kBAAkB;YACtB,EAAE,EAAE,kBAAkB;YACtB,IAAI,EAAE,iBAAiB;SACxB;KACF;IACD,eAAe,EAAE;QACf,IAAI,EAAE,IAAI;KACX;CACF,CACF,CAAC;AAEF,SAAS,kBAAkB,CAAC,EAC1B,SAAS,EACT,IAAI,EACJ,eAAe,EACf,gBAAgB,EAChB,eAAe,EACf,eAAe,EACf,GAAG,KAAK,EA0BT;IACC,MAAM,iBAAiB,GAAG,oBAAoB,CAAC,eAAe,CAAC,CAAC;IAChE,OAAO,CACL,KAAC,iBAAiB,cAChB,MAAC,UAAU,eACT,KAAC,kBAAkB,KAAG,EACtB,KAAC,oBAAoB,CAAC,OAAO,iBACjB,sBAAsB;oBAChC,iEAAiE;oBACjE,4DAA4D;oBAC5D,oEAAoE;oBACpE,qEAAqE;oBACrE,eAAe,EAAE,oBAAoB,CACnC,mBAAmB,CAAC,eAAe,EAAE,eAAe,CAAC,EACrD,iBAAiB,CAAC,eAAe,CAClC;oBACD,mEAAmE;oBACnE,sCAAsC;oBACtC,gBAAgB,EAAE,qBAAqB,CACrC,gBAAgB,EAChB,iBAAiB,CAAC,gBAAgB,CACnC,EACD,SAAS,EAAE,EAAE,CAAC,0BAA0B,CAAC,EAAE,IAAI,EAAE,CAAC,EAAE,SAAS,CAAC,KAC1D,KAAK,GACT,IACS,GACK,CACrB,CAAC;AACJ,CAAC;AAED,SAAS,iBAAiB,CAAC,EACzB,SAAS,EACT,GAAG,KAAK,EACoB;IAC5B,OAAO,CACL,2BACY,qBAAqB,EAC/B,SAAS,EAAE,EAAE,CAAC,qBAAqB,EAAE,SAAS,CAAC,KAC3C,KAAK,GACT,CACH,CAAC;AACJ,CAAC;AAED,SAAS,iBAAiB,CAAC,EACzB,SAAS,EACT,GAAG,KAAK,EACoB;IAC5B,OAAO,CACL,2BACY,qBAAqB,EAC/B,SAAS,EAAE,EAAE,CACX,yIAAyI,EACzI,SAAS,CACV,KACG,KAAK,GACT,CACH,CAAC;AACJ,CAAC;AAED,SAAS,gBAAgB,CAAC,EACxB,SAAS,EACT,GAAG,KAAK,EACgD;IACxD,6EAA6E;IAC7E,wEAAwE;IACxE,OAAO,CACL,KAAC,oBAAoB,CAAC,KAAK,iBACf,oBAAoB,EAC9B,SAAS,EAAE,EAAE,CAAC,kBAAkB,CAAC,EAAE,OAAO,EAAE,YAAY,EAAE,CAAC,EAAE,SAAS,CAAC,KACnE,KAAK,GACT,CACH,CAAC;AACJ,CAAC;AAED,SAAS,sBAAsB,CAAC,EAC9B,SAAS,EACT,GAAG,KAAK,EACsD;IAC9D,OAAO,CACL,KAAC,oBAAoB,CAAC,WAAW,iBACrB,0BAA0B,EACpC,SAAS,EAAE,EAAE,CAAC,kBAAkB,CAAC,EAAE,OAAO,EAAE,aAAa,EAAE,CAAC,EAAE,SAAS,CAAC,KACpE,KAAK,GACT,CACH,CAAC;AACJ,CAAC;AAED,SAAS,iBAAiB,CAAC,EACzB,SAAS,EACT,GAAG,KAAK,EACiD;IACzD,OAAO,CACL,KAAC,oBAAoB,CAAC,MAAM,IAC1B,SAAS,EAAE,EAAE,CAAC,cAAc,EAAE,EAAE,SAAS,CAAC,KACtC,KAAK,GACT,CACH,CAAC;AACJ,CAAC;AAED,SAAS,iBAAiB,CAAC,EACzB,SAAS,EACT,GAAG,KAAK,EACiD;IACzD,OAAO,CACL,KAAC,oBAAoB,CAAC,MAAM,IAC1B,SAAS,EAAE,EAAE,CAAC,cAAc,CAAC,EAAE,OAAO,EAAE,WAAW,EAAE,CAAC,EAAE,SAAS,CAAC,KAC9D,KAAK,GACT,CACH,CAAC;AACJ,CAAC;AAED,OAAO,EACL,WAAW,EACX,iBAAiB,EACjB,kBAAkB,EAClB,kBAAkB,EAClB,kBAAkB,EAClB,iBAAiB,EACjB,iBAAiB,EACjB,gBAAgB,EAChB,sBAAsB,EACtB,iBAAiB,EACjB,iBAAiB,GAClB,CAAC"}
|
|
@@ -1,5 +1,15 @@
|
|
|
1
1
|
import * as React from "react";
|
|
2
2
|
import { Checkbox as CheckboxPrimitive } from "radix-ui";
|
|
3
3
|
declare function Checkbox({ className, ...props }: React.ComponentProps<typeof CheckboxPrimitive.Root>): React.JSX.Element;
|
|
4
|
-
|
|
4
|
+
/**
|
|
5
|
+
* Non-interactive, decorative rendering of the Checkbox glyph. For rows that
|
|
6
|
+
* already own selection (e.g. a `role="option"`), where a real checkbox would
|
|
7
|
+
* nest one interactive element inside another. Hidden from assistive tech —
|
|
8
|
+
* the owning row must expose the selection state itself.
|
|
9
|
+
*/
|
|
10
|
+
declare function CheckboxVisual({ checked, className, }: {
|
|
11
|
+
checked: boolean;
|
|
12
|
+
className?: string;
|
|
13
|
+
}): React.JSX.Element;
|
|
14
|
+
export { Checkbox, CheckboxVisual };
|
|
5
15
|
//# sourceMappingURL=checkbox.d.ts.map
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"checkbox.d.ts","sourceRoot":"","sources":["../../../../src/components/ui/checkbox.tsx"],"names":[],"mappings":"AAAA,OAAO,KAAK,KAAK,MAAM,OAAO,CAAC;AAC/B,OAAO,EAAE,QAAQ,IAAI,iBAAiB,EAAE,MAAM,UAAU,CAAC;
|
|
1
|
+
{"version":3,"file":"checkbox.d.ts","sourceRoot":"","sources":["../../../../src/components/ui/checkbox.tsx"],"names":[],"mappings":"AAAA,OAAO,KAAK,KAAK,MAAM,OAAO,CAAC;AAC/B,OAAO,EAAE,QAAQ,IAAI,iBAAiB,EAAE,MAAM,UAAU,CAAC;AAWzD,iBAAS,QAAQ,CAAC,EAChB,SAAS,EACT,GAAG,KAAK,EACT,EAAE,KAAK,CAAC,cAAc,CAAC,OAAO,iBAAiB,CAAC,IAAI,CAAC,qBAmBrD;AAED;;;;;GAKG;AACH,iBAAS,cAAc,CAAC,EACtB,OAAO,EACP,SAAS,GACV,EAAE;IACD,OAAO,EAAE,OAAO,CAAC;IACjB,SAAS,CAAC,EAAE,MAAM,CAAC;CACpB,qBAeA;AAED,OAAO,EAAE,QAAQ,EAAE,cAAc,EAAE,CAAC"}
|
|
@@ -3,8 +3,19 @@ import * as React from "react";
|
|
|
3
3
|
import { Checkbox as CheckboxPrimitive } from "radix-ui";
|
|
4
4
|
import { cn } from "../../lib/utils.js";
|
|
5
5
|
import { CheckIcon } from "../../icons/lucide.js";
|
|
6
|
+
const checkboxBoxClassName = "relative flex size-4 shrink-0 items-center justify-center rounded-[4px] border border-input bg-input-background transition-colors data-checked:border-accent-action-default data-checked:bg-accent-action-default data-checked:text-accent-action-foreground dark:data-checked:bg-accent-action-default";
|
|
7
|
+
const checkboxIndicatorClassName = "grid place-content-center text-current transition-none [&>svg]:size-3.5";
|
|
6
8
|
function Checkbox({ className, ...props }) {
|
|
7
|
-
return (_jsx(CheckboxPrimitive.Root, { "data-slot": "checkbox", className: cn("peer
|
|
9
|
+
return (_jsx(CheckboxPrimitive.Root, { "data-slot": "checkbox", className: cn("peer outline-none group-has-disabled/field:opacity-50 after:absolute after:-inset-x-3 after:-inset-y-2 focus-visible:ring-2 focus-visible:ring-ring disabled:cursor-not-allowed disabled:opacity-50 aria-invalid:border-danger-foreground-subtle aria-invalid:ring-3 aria-invalid:ring-danger-foreground-subtle/20 aria-invalid:aria-checked:border-accent-action-default dark:aria-invalid:ring-danger-foreground-subtle/40", checkboxBoxClassName, className), ...props, children: _jsx(CheckboxPrimitive.Indicator, { "data-slot": "checkbox-indicator", className: checkboxIndicatorClassName, children: _jsx(CheckIcon, { className: "text-current" }) }) }));
|
|
8
10
|
}
|
|
9
|
-
|
|
11
|
+
/**
|
|
12
|
+
* Non-interactive, decorative rendering of the Checkbox glyph. For rows that
|
|
13
|
+
* already own selection (e.g. a `role="option"`), where a real checkbox would
|
|
14
|
+
* nest one interactive element inside another. Hidden from assistive tech —
|
|
15
|
+
* the owning row must expose the selection state itself.
|
|
16
|
+
*/
|
|
17
|
+
function CheckboxVisual({ checked, className, }) {
|
|
18
|
+
return (_jsx("span", { "aria-hidden": "true", "data-slot": "checkbox-visual", "data-state": checked ? "checked" : "unchecked", className: cn(checkboxBoxClassName, className), children: checked && (_jsx("span", { className: checkboxIndicatorClassName, children: _jsx(CheckIcon, { className: "text-current" }) })) }));
|
|
19
|
+
}
|
|
20
|
+
export { Checkbox, CheckboxVisual };
|
|
10
21
|
//# sourceMappingURL=checkbox.js.map
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"checkbox.js","sourceRoot":"","sources":["../../../../src/components/ui/checkbox.tsx"],"names":[],"mappings":";AAAA,OAAO,KAAK,KAAK,MAAM,OAAO,CAAC;AAC/B,OAAO,EAAE,QAAQ,IAAI,iBAAiB,EAAE,MAAM,UAAU,CAAC;AAEzD,OAAO,EAAE,EAAE,EAAE,MAAM,WAAW,CAAC;AAC/B,OAAO,EAAE,SAAS,EAAE,MAAM,cAAc,CAAC;AAEzC,SAAS,QAAQ,CAAC,EAChB,SAAS,EACT,GAAG,KAAK,EAC4C;IACpD,OAAO,CACL,KAAC,iBAAiB,CAAC,IAAI,iBACX,UAAU,EACpB,SAAS,EAAE,EAAE,CACX,
|
|
1
|
+
{"version":3,"file":"checkbox.js","sourceRoot":"","sources":["../../../../src/components/ui/checkbox.tsx"],"names":[],"mappings":";AAAA,OAAO,KAAK,KAAK,MAAM,OAAO,CAAC;AAC/B,OAAO,EAAE,QAAQ,IAAI,iBAAiB,EAAE,MAAM,UAAU,CAAC;AAEzD,OAAO,EAAE,EAAE,EAAE,MAAM,WAAW,CAAC;AAC/B,OAAO,EAAE,SAAS,EAAE,MAAM,cAAc,CAAC;AAEzC,MAAM,oBAAoB,GACxB,ySAAyS,CAAC;AAE5S,MAAM,0BAA0B,GAC9B,yEAAyE,CAAC;AAE5E,SAAS,QAAQ,CAAC,EAChB,SAAS,EACT,GAAG,KAAK,EAC4C;IACpD,OAAO,CACL,KAAC,iBAAiB,CAAC,IAAI,iBACX,UAAU,EACpB,SAAS,EAAE,EAAE,CACX,8ZAA8Z,EAC9Z,oBAAoB,EACpB,SAAS,CACV,KACG,KAAK,YAET,KAAC,iBAAiB,CAAC,SAAS,iBAChB,oBAAoB,EAC9B,SAAS,EAAE,0BAA0B,YAErC,KAAC,SAAS,IAAC,SAAS,EAAC,cAAc,GAAG,GACV,GACP,CAC1B,CAAC;AACJ,CAAC;AAED;;;;;GAKG;AACH,SAAS,cAAc,CAAC,EACtB,OAAO,EACP,SAAS,GAIV;IACC,OAAO,CACL,8BACc,MAAM,eACR,iBAAiB,gBACf,OAAO,CAAC,CAAC,CAAC,SAAS,CAAC,CAAC,CAAC,WAAW,EAC7C,SAAS,EAAE,EAAE,CAAC,oBAAoB,EAAE,SAAS,CAAC,YAE7C,OAAO,IAAI,CACV,eAAM,SAAS,EAAE,0BAA0B,YACzC,KAAC,SAAS,IAAC,SAAS,EAAC,cAAc,GAAG,GACjC,CACR,GACI,CACR,CAAC;AACJ,CAAC;AAED,OAAO,EAAE,QAAQ,EAAE,cAAc,EAAE,CAAC"}
|
|
@@ -18,6 +18,8 @@ type CodeBlockProps = Omit<React.ComponentProps<"pre">, "onCopy"> & VariantProps
|
|
|
18
18
|
* no real error to report.
|
|
19
19
|
*/
|
|
20
20
|
onCopy?: (text: string, success: boolean, error?: unknown) => void;
|
|
21
|
+
/** Resolves the text to copy instead of the rendered `textContent`, so a truncated preview can copy its full value (fetched lazily on click). A rejection surfaces via `onCopy("", false, error)` and shows the failed state. */
|
|
22
|
+
onCopyRequest?: () => string | Promise<string>;
|
|
21
23
|
collapsedRows?: number;
|
|
22
24
|
/** Label for the button that expands a collapsed block. Sourced from the i18n dictionary at key `"codeBlock.showMore"` when omitted. */
|
|
23
25
|
showMoreLabel?: string;
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"code-block.d.ts","sourceRoot":"","sources":["../../../../src/components/ui/code-block.tsx"],"names":[],"mappings":"AAAA,OAAO,KAAK,KAAK,MAAM,OAAO,CAAC;AAC/B,OAAO,EAAO,KAAK,YAAY,EAAE,MAAM,0BAA0B,CAAC;AASlE,QAAA,MAAM,iBAAiB;;8EAatB,CAAC;AAUF,KAAK,cAAc,GAAG,IAAI,CAAC,KAAK,CAAC,cAAc,CAAC,KAAK,CAAC,EAAE,QAAQ,CAAC,GAC/D,YAAY,CAAC,OAAO,iBAAiB,CAAC,GAAG;IACvC,QAAQ,CAAC,EAAE,OAAO,CAAC;IACnB,sIAAsI;IACtI,SAAS,CAAC,EAAE,MAAM,CAAC;IACnB,oJAAoJ;IACpJ,WAAW,CAAC,EAAE,MAAM,CAAC;IACrB,oJAAoJ;IACpJ,eAAe,CAAC,EAAE,MAAM,CAAC;IACzB;;;;;OAKG;IACH,MAAM,CAAC,EAAE,CAAC,IAAI,EAAE,MAAM,EAAE,OAAO,EAAE,OAAO,EAAE,KAAK,CAAC,EAAE,OAAO,KAAK,IAAI,CAAC;IACnE,aAAa,CAAC,EAAE,MAAM,CAAC;IACvB,wIAAwI;IACxI,aAAa,CAAC,EAAE,MAAM,CAAC;IACvB,6IAA6I;IAC7I,aAAa,CAAC,EAAE,MAAM,CAAC;CACxB,CAAC;
|
|
1
|
+
{"version":3,"file":"code-block.d.ts","sourceRoot":"","sources":["../../../../src/components/ui/code-block.tsx"],"names":[],"mappings":"AAAA,OAAO,KAAK,KAAK,MAAM,OAAO,CAAC;AAC/B,OAAO,EAAO,KAAK,YAAY,EAAE,MAAM,0BAA0B,CAAC;AASlE,QAAA,MAAM,iBAAiB;;8EAatB,CAAC;AAUF,KAAK,cAAc,GAAG,IAAI,CAAC,KAAK,CAAC,cAAc,CAAC,KAAK,CAAC,EAAE,QAAQ,CAAC,GAC/D,YAAY,CAAC,OAAO,iBAAiB,CAAC,GAAG;IACvC,QAAQ,CAAC,EAAE,OAAO,CAAC;IACnB,sIAAsI;IACtI,SAAS,CAAC,EAAE,MAAM,CAAC;IACnB,oJAAoJ;IACpJ,WAAW,CAAC,EAAE,MAAM,CAAC;IACrB,oJAAoJ;IACpJ,eAAe,CAAC,EAAE,MAAM,CAAC;IACzB;;;;;OAKG;IACH,MAAM,CAAC,EAAE,CAAC,IAAI,EAAE,MAAM,EAAE,OAAO,EAAE,OAAO,EAAE,KAAK,CAAC,EAAE,OAAO,KAAK,IAAI,CAAC;IACnE,iOAAiO;IACjO,aAAa,CAAC,EAAE,MAAM,MAAM,GAAG,OAAO,CAAC,MAAM,CAAC,CAAC;IAC/C,aAAa,CAAC,EAAE,MAAM,CAAC;IACvB,wIAAwI;IACxI,aAAa,CAAC,EAAE,MAAM,CAAC;IACvB,6IAA6I;IAC7I,aAAa,CAAC,EAAE,MAAM,CAAC;CACxB,CAAC;AA0QJ,QAAA,MAAM,SAAS,oGAAyD,CAAC;AAEzE,OAAO,EAAE,SAAS,EAAE,iBAAiB,EAAE,KAAK,cAAc,EAAE,CAAC"}
|
|
@@ -24,7 +24,7 @@ const COPIED_RESET_MS = 2000;
|
|
|
24
24
|
// error in the measured line-height must not tip that into a dead show-more
|
|
25
25
|
// control for content that doesn't actually overflow.
|
|
26
26
|
const OVERFLOW_EPSILON_PX = 1;
|
|
27
|
-
function CodeBlockImpl({ ref, className, variant = "single", children, copyable = true, copyLabel, copiedLabel, copyFailedLabel, onCopy, collapsedRows, showMoreLabel, showLessLabel, ...props }) {
|
|
27
|
+
function CodeBlockImpl({ ref, className, variant = "single", children, copyable = true, copyLabel, copiedLabel, copyFailedLabel, onCopy, onCopyRequest, collapsedRows, showMoreLabel, showLessLabel, ...props }) {
|
|
28
28
|
const { t } = useC4Dictionary();
|
|
29
29
|
const resolvedCopyLabel = copyLabel ?? t("codeBlock.copy");
|
|
30
30
|
const resolvedCopiedLabel = copiedLabel ?? t("codeBlock.copied");
|
|
@@ -45,6 +45,8 @@ function CodeBlockImpl({ ref, className, variant = "single", children, copyable
|
|
|
45
45
|
const codeRef = React.useRef(null);
|
|
46
46
|
const preRef = React.useRef(null);
|
|
47
47
|
const [status, setStatus] = React.useState("idle");
|
|
48
|
+
// True while an async `onCopyRequest` resolves, to show the spinner.
|
|
49
|
+
const [isCopying, setIsCopying] = React.useState(false);
|
|
48
50
|
const [announcement, setAnnouncement] = React.useState("");
|
|
49
51
|
const resetTimerRef = React.useRef(undefined);
|
|
50
52
|
const announceFrameRef = React.useRef(undefined);
|
|
@@ -93,17 +95,28 @@ function CodeBlockImpl({ ref, className, variant = "single", children, copyable
|
|
|
93
95
|
}
|
|
94
96
|
}, []);
|
|
95
97
|
const handleCopy = async () => {
|
|
96
|
-
|
|
97
|
-
|
|
98
|
-
|
|
99
|
-
onCopy?.("", false);
|
|
100
|
-
return;
|
|
101
|
-
}
|
|
102
|
-
// `writeText` rejects on an insecure origin or denied permission — await it
|
|
103
|
-
// rather than firing-and-forgetting, so `success` reflects what actually
|
|
104
|
-
// happened instead of assuming the write worked.
|
|
98
|
+
// Await the resolver and `writeText` in one try so a rejection from either
|
|
99
|
+
// reaches the catch. `text` seeds to "" so the catch can still report it.
|
|
100
|
+
let text = "";
|
|
105
101
|
let success;
|
|
106
102
|
try {
|
|
103
|
+
if (onCopyRequest) {
|
|
104
|
+
setIsCopying(true);
|
|
105
|
+
try {
|
|
106
|
+
text = await onCopyRequest();
|
|
107
|
+
}
|
|
108
|
+
finally {
|
|
109
|
+
setIsCopying(false);
|
|
110
|
+
}
|
|
111
|
+
}
|
|
112
|
+
else {
|
|
113
|
+
text = codeRef.current?.textContent ?? "";
|
|
114
|
+
}
|
|
115
|
+
if (!text) {
|
|
116
|
+
// Copying nothing would wipe the clipboard and report success.
|
|
117
|
+
onCopy?.("", false);
|
|
118
|
+
return;
|
|
119
|
+
}
|
|
107
120
|
await navigator.clipboard.writeText(text);
|
|
108
121
|
success = true;
|
|
109
122
|
onCopy?.(text, true);
|
|
@@ -148,11 +161,13 @@ function CodeBlockImpl({ ref, className, variant = "single", children, copyable
|
|
|
148
161
|
// computed line-height, so it can't be expressed as a fixed utility class.
|
|
149
162
|
style: isCollapsedVisual && capPx !== null ? { maxHeight: capPx } : undefined, children: _jsx("pre", { ref: preRefCallback, className: cn(variant === "single"
|
|
150
163
|
? "whitespace-pre"
|
|
151
|
-
: "whitespace-pre-wrap break-words", className), ...props, children: _jsx("code", { ref: codeRef, children: children }) }) }), showToggle && (_jsxs(Button, { type: "button", variant: "ghost", size: "xs", onClick: () => setExpanded((prev) => !prev), "aria-expanded": expanded, className: "mt-2", children: [expanded ? resolvedShowLessLabel : resolvedShowMoreLabel, _jsx(ChevronDown, { "aria-hidden": "true", className: cn("transition-transform", expanded && "rotate-180") })] })), copyable && (_jsxs(_Fragment, { children: [_jsx(Button, { type: "button", variant: "ghost", size: "icon-xs", onClick: handleCopy, "aria-label": status === "copied"
|
|
164
|
+
: "whitespace-pre-wrap break-words", className), ...props, children: _jsx("code", { ref: codeRef, children: children }) }) }), showToggle && (_jsxs(Button, { type: "button", variant: "ghost", size: "xs", onClick: () => setExpanded((prev) => !prev), "aria-expanded": expanded, className: "mt-2", children: [expanded ? resolvedShowLessLabel : resolvedShowMoreLabel, _jsx(ChevronDown, { "aria-hidden": "true", className: cn("transition-transform", expanded && "rotate-180") })] })), copyable && (_jsxs(_Fragment, { children: [_jsx(Button, { type: "button", variant: "ghost", size: "icon-xs", loading: isCopying, onClick: handleCopy, "aria-label": status === "copied"
|
|
152
165
|
? resolvedCopiedLabel
|
|
153
166
|
: status === "failed"
|
|
154
167
|
? resolvedCopyFailedLabel
|
|
155
|
-
: resolvedCopyLabel,
|
|
168
|
+
: resolvedCopyLabel,
|
|
169
|
+
// `aria-disabled` here means copy-in-flight, not disabled: keep full opacity.
|
|
170
|
+
className: "absolute top-1.5 right-1.5 aria-disabled:opacity-100", children: status === "copied" ? (_jsx(Check, { className: "text-success-foreground-subtle", "aria-hidden": "true" })) : status === "failed" ? (_jsx(CircleAlert, { className: "text-danger-foreground-subtle", "aria-hidden": "true" })) : (_jsx(Copy, { "aria-hidden": "true" })) }), _jsx("span", { role: "status", "aria-live": "polite", className: "sr-only", children: announcement })] }))] }));
|
|
156
171
|
}
|
|
157
172
|
const CodeBlock = withRef(CodeBlockImpl);
|
|
158
173
|
export { CodeBlock, codeBlockVariants };
|