@setsquare/ui 0.5.0 → 0.7.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/CHANGELOG.md +116 -0
- package/README.md +42 -4
- package/dist/index.d.ts +15 -9
- package/dist/index.d.ts.map +1 -1
- package/dist/index.js +2 -0
- package/dist/index.js.map +1 -1
- package/dist/lib/cn.d.ts.map +1 -1
- package/dist/lib/cn.js +1 -0
- package/dist/lib/cn.js.map +1 -1
- package/dist/lib/english.d.ts +11 -0
- package/dist/lib/english.d.ts.map +1 -0
- package/dist/lib/english.js +67 -0
- package/dist/lib/english.js.map +1 -0
- package/dist/lib/labels.d.ts +38 -8
- package/dist/lib/labels.d.ts.map +1 -1
- package/dist/lib/labels.js +97 -9
- package/dist/lib/labels.js.map +1 -1
- package/dist/lib/locale.d.ts +108 -0
- package/dist/lib/locale.d.ts.map +1 -0
- package/dist/lib/locale.js +42 -0
- package/dist/lib/locale.js.map +1 -0
- package/dist/shell/app-header.d.ts +4 -1
- package/dist/shell/app-header.d.ts.map +1 -1
- package/dist/shell/app-header.js +6 -3
- package/dist/shell/app-header.js.map +1 -1
- package/dist/shell/dashboard-shell.d.ts +16 -2
- package/dist/shell/dashboard-shell.d.ts.map +1 -1
- package/dist/shell/dashboard-shell.js +7 -3
- package/dist/shell/dashboard-shell.js.map +1 -1
- package/dist/shell/landmarks.d.ts +33 -0
- package/dist/shell/landmarks.d.ts.map +1 -0
- package/dist/shell/landmarks.js +20 -0
- package/dist/shell/landmarks.js.map +1 -0
- package/dist/shell/nav-status.d.ts +46 -0
- package/dist/shell/nav-status.d.ts.map +1 -0
- package/dist/shell/nav-status.js +26 -0
- package/dist/shell/nav-status.js.map +1 -0
- package/dist/shell/rail.d.ts +73 -0
- package/dist/shell/rail.d.ts.map +1 -0
- package/dist/shell/rail.js +87 -0
- package/dist/shell/rail.js.map +1 -0
- package/dist/shell/right-panel.d.ts +7 -2
- package/dist/shell/right-panel.d.ts.map +1 -1
- package/dist/shell/right-panel.js +13 -7
- package/dist/shell/right-panel.js.map +1 -1
- package/dist/shell/sidebar.d.ts +41 -8
- package/dist/shell/sidebar.d.ts.map +1 -1
- package/dist/shell/sidebar.js +73 -19
- package/dist/shell/sidebar.js.map +1 -1
- package/dist/shell/site-menu.d.ts +11 -3
- package/dist/shell/site-menu.d.ts.map +1 -1
- package/dist/shell/site-menu.js +7 -1
- package/dist/shell/site-menu.js.map +1 -1
- package/dist/shell/site-nav.d.ts +4 -1
- package/dist/shell/site-nav.d.ts.map +1 -1
- package/dist/shell/site-nav.js +3 -3
- package/dist/shell/site-nav.js.map +1 -1
- package/dist/shell/site-shell.d.ts +4 -2
- package/dist/shell/site-shell.d.ts.map +1 -1
- package/dist/shell/site-shell.js +3 -2
- package/dist/shell/site-shell.js.map +1 -1
- package/dist/styles/theme.css +78 -0
- package/dist/styles/tokens.css +4 -4
- package/dist/tokens.json +4 -4
- package/dist/ui/alert.d.ts +2 -0
- package/dist/ui/alert.d.ts.map +1 -1
- package/dist/ui/alert.js +11 -9
- package/dist/ui/alert.js.map +1 -1
- package/dist/ui/breadcrumbs.d.ts +9 -1
- package/dist/ui/breadcrumbs.d.ts.map +1 -1
- package/dist/ui/breadcrumbs.js +5 -2
- package/dist/ui/breadcrumbs.js.map +1 -1
- package/dist/ui/calendar.d.ts +1 -0
- package/dist/ui/calendar.d.ts.map +1 -1
- package/dist/ui/calendar.js +7 -1
- package/dist/ui/calendar.js.map +1 -1
- package/dist/ui/checkbox.d.ts.map +1 -1
- package/dist/ui/checkbox.js +7 -7
- package/dist/ui/checkbox.js.map +1 -1
- package/dist/ui/code-block-parts.d.ts +30 -0
- package/dist/ui/code-block-parts.d.ts.map +1 -0
- package/dist/ui/code-block-parts.js +27 -0
- package/dist/ui/code-block-parts.js.map +1 -0
- package/dist/ui/code-block.d.ts +4 -10
- package/dist/ui/code-block.d.ts.map +1 -1
- package/dist/ui/code-block.js +4 -9
- package/dist/ui/code-block.js.map +1 -1
- package/dist/ui/combo-box.d.ts +7 -1
- package/dist/ui/combo-box.d.ts.map +1 -1
- package/dist/ui/combo-box.js +9 -2
- package/dist/ui/combo-box.js.map +1 -1
- package/dist/ui/copy-button.d.ts +7 -1
- package/dist/ui/copy-button.d.ts.map +1 -1
- package/dist/ui/copy-button.js +11 -10
- package/dist/ui/copy-button.js.map +1 -1
- package/dist/ui/date-field.d.ts +1 -0
- package/dist/ui/date-field.d.ts.map +1 -1
- package/dist/ui/date-field.js +20 -16
- package/dist/ui/date-field.js.map +1 -1
- package/dist/ui/dialog.d.ts +6 -1
- package/dist/ui/dialog.d.ts.map +1 -1
- package/dist/ui/dialog.js +11 -8
- package/dist/ui/dialog.js.map +1 -1
- package/dist/ui/error-state.d.ts +17 -2
- package/dist/ui/error-state.d.ts.map +1 -1
- package/dist/ui/error-state.js +32 -34
- package/dist/ui/error-state.js.map +1 -1
- package/dist/ui/feature-card.d.ts +18 -3
- package/dist/ui/feature-card.d.ts.map +1 -1
- package/dist/ui/feature-card.js +18 -3
- package/dist/ui/feature-card.js.map +1 -1
- package/dist/ui/field.d.ts +28 -9
- package/dist/ui/field.d.ts.map +1 -1
- package/dist/ui/field.js +22 -10
- package/dist/ui/field.js.map +1 -1
- package/dist/ui/file-upload.d.ts +23 -5
- package/dist/ui/file-upload.d.ts.map +1 -1
- package/dist/ui/file-upload.js +54 -36
- package/dist/ui/file-upload.js.map +1 -1
- package/dist/ui/form.d.ts +11 -1
- package/dist/ui/form.d.ts.map +1 -1
- package/dist/ui/form.js +7 -4
- package/dist/ui/form.js.map +1 -1
- package/dist/ui/number-field.d.ts.map +1 -1
- package/dist/ui/number-field.js +5 -3
- package/dist/ui/number-field.js.map +1 -1
- package/dist/ui/pagination.d.ts +11 -3
- package/dist/ui/pagination.d.ts.map +1 -1
- package/dist/ui/pagination.js +30 -23
- package/dist/ui/pagination.js.map +1 -1
- package/dist/ui/radio-group.d.ts.map +1 -1
- package/dist/ui/radio-group.js +4 -4
- package/dist/ui/radio-group.js.map +1 -1
- package/dist/ui/search.d.ts +3 -0
- package/dist/ui/search.d.ts.map +1 -1
- package/dist/ui/search.js +11 -10
- package/dist/ui/search.js.map +1 -1
- package/dist/ui/select.d.ts +7 -1
- package/dist/ui/select.d.ts.map +1 -1
- package/dist/ui/select.js +7 -3
- package/dist/ui/select.js.map +1 -1
- package/dist/ui/selection-bar.d.ts +17 -4
- package/dist/ui/selection-bar.d.ts.map +1 -1
- package/dist/ui/selection-bar.js +15 -11
- package/dist/ui/selection-bar.js.map +1 -1
- package/dist/ui/sheet.d.ts +1 -0
- package/dist/ui/sheet.d.ts.map +1 -1
- package/dist/ui/sheet.js +4 -1
- package/dist/ui/sheet.js.map +1 -1
- package/dist/ui/slider.d.ts +9 -2
- package/dist/ui/slider.d.ts.map +1 -1
- package/dist/ui/slider.js +13 -5
- package/dist/ui/slider.js.map +1 -1
- package/dist/ui/tabs.d.ts +1 -0
- package/dist/ui/tabs.d.ts.map +1 -1
- package/dist/ui/tabs.js +13 -12
- package/dist/ui/tabs.js.map +1 -1
- package/dist/ui/text-field.d.ts.map +1 -1
- package/dist/ui/text-field.js +7 -3
- package/dist/ui/text-field.js.map +1 -1
- package/dist/ui/theme-switcher.d.ts +1 -0
- package/dist/ui/theme-switcher.d.ts.map +1 -1
- package/dist/ui/theme-switcher.js +7 -7
- package/dist/ui/theme-switcher.js.map +1 -1
- package/dist/ui/toast.d.ts +1 -0
- package/dist/ui/toast.d.ts.map +1 -1
- package/dist/ui/toast.js +4 -1
- package/dist/ui/toast.js.map +1 -1
- package/dist/ui/tree.d.ts.map +1 -1
- package/dist/ui/tree.js +5 -5
- package/dist/ui/tree.js.map +1 -1
- package/package.json +2 -1
package/dist/ui/calendar.js.map
CHANGED
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"calendar.js","sourceRoot":"","sources":["../../src/ui/calendar.tsx"],"names":[],"mappings":"AAAA,YAAY,CAAC;;AAGb,OAAO,EACL,QAAQ,IAAI,WAAW,EACvB,YAAY,IAAI,eAAe,EAC/B,YAAY,EACZ,gBAAgB,EAChB,kBAAkB,EAClB,kBAAkB,EAClB,OAAO,EACP,aAAa,IAAI,gBAAgB,EACjC,IAAI,GAIL,MAAM,uBAAuB,CAAC;AAC/B,OAAO,EAAE,WAAW,EAAE,YAAY,EAAE,MAAM,cAAc,CAAC;AACzD,OAAO,EAAE,EAAE,EAAE,MAAM,cAAc,CAAC;AAClC,OAAO,EAAE,UAAU,EAAE,MAAM,kBAAkB,CAAC;AAE9C;;;GAGG;AACH,MAAM,YAAY,GAAG,uEAAuE,CAAC;AAQ7F,SAAS,cAAc,CAAC,EAAE,MAAM,EAAwC;IACtE,OAAO,CACL,eAAK,SAAS,EAAC,yCAAyC,aACtD,KAAC,UAAU,IACT,IAAI,EAAC,UAAU,EACf,KAAK,EAAE,
|
|
1
|
+
{"version":3,"file":"calendar.js","sourceRoot":"","sources":["../../src/ui/calendar.tsx"],"names":[],"mappings":"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"}
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"checkbox.d.ts","sourceRoot":"","sources":["../../src/ui/checkbox.tsx"],"names":[],"mappings":"AAEA,OAAO,EAAqB,KAAK,SAAS,EAAE,MAAM,OAAO,CAAC;AAC1D,OAAO,EAGL,KAAK,kBAAkB,IAAI,qBAAqB,EAChD,KAAK,aAAa,IAAI,gBAAgB,EACvC,MAAM,uBAAuB,CAAC;AAG/B,OAAO,
|
|
1
|
+
{"version":3,"file":"checkbox.d.ts","sourceRoot":"","sources":["../../src/ui/checkbox.tsx"],"names":[],"mappings":"AAEA,OAAO,EAAqB,KAAK,SAAS,EAAE,MAAM,OAAO,CAAC;AAC1D,OAAO,EAGL,KAAK,kBAAkB,IAAI,qBAAqB,EAChD,KAAK,aAAa,IAAI,gBAAgB,EACvC,MAAM,uBAAuB,CAAC;AAG/B,OAAO,EAQL,KAAK,WAAW,EACjB,MAAM,YAAY,CAAC;AAWpB,MAAM,WAAW,aAAc,SAAQ,IAAI,CACzC,gBAAgB,EAChB,WAAW,GAAG,UAAU,GAAG,UAAU,CACtC;IACC,QAAQ,EAAE,SAAS,CAAC;IACpB,mCAAmC;IACnC,WAAW,CAAC,EAAE,SAAS,CAAC;IACxB,yEAAyE;IACzE,eAAe,CAAC,EAAE,MAAM,CAAC;IACzB,MAAM,CAAC,EAAE,OAAO,CAAC,WAAW,CAAC,CAAC;IAC9B,SAAS,CAAC,EAAE,MAAM,CAAC;CACpB;AAED;;;GAGG;AACH,wBAAgB,QAAQ,CAAC,EACvB,QAAQ,EACR,WAAW,EACX,eAAe,EACf,MAAM,EACN,SAAS,EACT,GAAG,KAAK,EACT,EAAE,aAAa,+BAmEf;AAED,MAAM,WAAW,kBAAmB,SAAQ,IAAI,CAC9C,qBAAqB,EACrB,WAAW,GAAG,UAAU,GAAG,UAAU,CACtC;IACC,KAAK,EAAE,MAAM,CAAC;IACd,WAAW,CAAC,EAAE,SAAS,CAAC;IACxB,YAAY,CAAC,EAAE,MAAM,CAAC;IACtB,iCAAiC;IACjC,eAAe,CAAC,EAAE,MAAM,CAAC;IACzB,QAAQ,EAAE,SAAS,CAAC;IACpB,MAAM,CAAC,EAAE,OAAO,CAAC,WAAW,CAAC,CAAC;IAC9B,SAAS,CAAC,EAAE,MAAM,CAAC;CACpB;AAED,sDAAsD;AACtD,wBAAgB,aAAa,CAAC,EAC5B,KAAK,EACL,WAAW,EACX,YAAY,EACZ,eAAe,EACf,QAAQ,EACR,MAAM,EACN,SAAS,EACT,GAAG,KAAK,EACT,EAAE,kBAAkB,+BAqBpB;AAED,MAAM,WAAW,sBAAuB,SAAQ,IAAI,CAClD,gBAAgB,EAChB,WAAW,GAAG,UAAU,GAAG,MAAM,CAClC;IACC,SAAS,CAAC,EAAE,MAAM,CAAC;CACpB;AAED;;;;GAIG;AACH,wBAAgB,iBAAiB,CAAC,EAAE,SAAS,EAAE,GAAG,KAAK,EAAE,EAAE,sBAAsB,+BAiBhF"}
|
package/dist/ui/checkbox.js
CHANGED
|
@@ -4,7 +4,7 @@ import { useContext, useId } from 'react';
|
|
|
4
4
|
import { Checkbox as RACCheckbox, CheckboxGroup as RACCheckboxGroup, } from 'react-aria-components';
|
|
5
5
|
import { Check, CircleAlert, Minus } from 'lucide-react';
|
|
6
6
|
import { cn } from '../lib/cn.js';
|
|
7
|
-
import { FieldDescription, FieldError, FieldLabel, NecessityContext, fieldStack, withRequired, } from './field.js';
|
|
7
|
+
import { FieldDescription, FieldError, FieldLabel, NecessityContext, fieldStack, withRequired, useFieldLabels, } from './field.js';
|
|
8
8
|
/** The visible box, shared by Checkbox and SelectionCheckbox. Checked: a tick; mixed: a dash — shape, not only fill. */
|
|
9
9
|
const boxStyles = cn('grid size-choice shrink-0 place-items-center rounded-sm border border-input bg-background text-primary-foreground', 'group-data-focus-visible/choice:focus-ring group-data-hovered/choice:border-foreground', 'group-data-selected/choice:border-primary group-data-selected/choice:bg-primary group-data-indeterminate/choice:border-primary group-data-indeterminate/choice:bg-primary', 'group-data-invalid/choice:border-destructive group-data-invalid/choice:shadow-[0_0_0_1px_var(--destructive)]', '[&_svg]:size-[calc(var(--choice-size)-4px)] [&_svg]:[stroke-width:3]');
|
|
10
10
|
/**
|
|
@@ -12,20 +12,20 @@ const boxStyles = cn('grid size-choice shrink-0 place-items-center rounded-sm bo
|
|
|
12
12
|
* The whole row — box and label — is the target, at least --target-min tall.
|
|
13
13
|
*/
|
|
14
14
|
export function Checkbox({ children, description, requiredMessage, labels, className, ...props }) {
|
|
15
|
+
const t = useFieldLabels(labels);
|
|
16
|
+
const required = requiredMessage ?? t('checkRequired');
|
|
15
17
|
const necessity = useContext(NecessityContext);
|
|
16
18
|
const autoId = useId();
|
|
17
19
|
const id = props.id ?? autoId;
|
|
18
20
|
const errorId = `${id}-error`;
|
|
19
21
|
return (_jsx(RACCheckbox, { ...props, id: id, "aria-describedby": [props['aria-describedby'], props.isRequired ? errorId : null].filter(Boolean).join(' ') ||
|
|
20
|
-
undefined, validate: props.isRequired
|
|
21
|
-
? withRequired(true, requiredMessage ?? 'Select this to continue', (v) => !v)
|
|
22
|
-
: undefined, className: cn('group/choice relative flex min-h-target cursor-pointer items-start gap-3 py-[calc((var(--target-min)-var(--choice-size))/2)] text-sm leading-5 text-foreground outline-none data-disabled:cursor-not-allowed data-disabled:opacity-60 data-readonly:cursor-default', className), children: ({ isSelected, isIndeterminate, isInvalid }) => (_jsxs(_Fragment, { children: [_jsx("span", { "aria-hidden": "true", className: cn('mt-[calc((20px-var(--choice-size))/2)]', boxStyles), children: isIndeterminate ? _jsx(Minus, {}) : isSelected ? _jsx(Check, {}) : null }), _jsxs("span", { className: "flex min-w-0 flex-col", children: [_jsxs("span", { children: [children, props.isRequired && necessity === 'required' && (_jsxs("span", { "aria-hidden": "true", className: "text-muted-foreground", children: [' ', "(required)"] }))] }), description && (_jsx("span", { className: "text-[13px] text-muted-foreground", children: description })), props.isRequired && isInvalid && (_jsxs("span", { id: errorId, "aria-hidden": "true", className: "mt-1 flex items-start gap-1.5 text-[13px] leading-5 font-semibold text-destructive", children: [_jsx(CircleAlert, { className: "mt-0.5 size-4 shrink-0" }), _jsxs("span", { "data-field-error-text": true, children: [_jsx("span", { className: "sr-only", "data-field-error-prefix": true, children: labels?.errorPrefix ?? 'Error: ' }), requiredMessage ?? 'Select this to continue'] })] }))] })] })) }));
|
|
22
|
+
undefined, validate: props.isRequired ? withRequired(true, required, (v) => !v) : undefined, className: cn('group/choice relative flex min-h-target cursor-pointer items-start gap-3 py-[calc((var(--target-min)-var(--choice-size))/2)] text-sm leading-5 text-foreground outline-none data-disabled:cursor-not-allowed data-disabled:opacity-60 data-readonly:cursor-default', className), children: ({ isSelected, isIndeterminate, isInvalid }) => (_jsxs(_Fragment, { children: [_jsx("span", { "aria-hidden": "true", className: cn('mt-[calc((20px-var(--choice-size))/2)]', boxStyles), children: isIndeterminate ? _jsx(Minus, {}) : isSelected ? _jsx(Check, {}) : null }), _jsxs("span", { className: "flex min-w-0 flex-col", children: [_jsxs("span", { children: [children, props.isRequired && necessity === 'required' && (_jsxs(_Fragment, { children: [' ', _jsx("span", { "aria-hidden": "true", className: "text-muted-foreground", children: t('requiredMarker') })] }))] }), description && (_jsx("span", { className: "text-[13px] text-muted-foreground", children: description })), props.isRequired && isInvalid && (_jsxs("span", { id: errorId, "aria-hidden": "true", className: "mt-1 flex items-start gap-1.5 text-[13px] leading-5 font-semibold text-destructive", children: [_jsx(CircleAlert, { className: "mt-0.5 size-4 shrink-0" }), _jsxs("span", { "data-field-error-text": true, children: [_jsx("span", { className: "sr-only", "data-field-error-prefix": true, children: t('errorPrefix') }), required] })] }))] })] })) }));
|
|
23
23
|
}
|
|
24
24
|
/** A labelled list of checkboxes, read as a group. */
|
|
25
25
|
export function CheckboxGroup({ label, description, errorMessage, requiredMessage, children, labels, className, ...props }) {
|
|
26
|
-
|
|
27
|
-
|
|
28
|
-
|
|
26
|
+
const t = useFieldLabels(labels);
|
|
27
|
+
const required = requiredMessage ?? t('checkGroupRequired');
|
|
28
|
+
return (_jsxs(RACCheckboxGroup, { ...props, validate: props.isRequired ? withRequired(true, required, (v) => !v?.length) : undefined, className: cn(fieldStack, className), children: [_jsx(FieldLabel, { elementType: "span", isRequired: props.isRequired, labels: labels, children: label }), description && _jsx(FieldDescription, { children: description }), _jsx(FieldError, { errorPrefix: t('errorPrefix'), requiredMessage: required, children: errorMessage }), _jsx("div", { className: "flex flex-col", children: children })] }));
|
|
29
29
|
}
|
|
30
30
|
/**
|
|
31
31
|
* The box alone, for the selection column of a Table or a GridList item. React Aria wires it to the row
|
package/dist/ui/checkbox.js.map
CHANGED
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"checkbox.js","sourceRoot":"","sources":["../../src/ui/checkbox.tsx"],"names":[],"mappings":"AAAA,YAAY,CAAC;;AAEb,OAAO,EAAE,UAAU,EAAE,KAAK,EAAkB,MAAM,OAAO,CAAC;AAC1D,OAAO,EACL,QAAQ,IAAI,WAAW,EACvB,aAAa,IAAI,gBAAgB,GAGlC,MAAM,uBAAuB,CAAC;AAC/B,OAAO,EAAE,KAAK,EAAE,WAAW,EAAE,KAAK,EAAE,MAAM,cAAc,CAAC;AACzD,OAAO,EAAE,EAAE,EAAE,MAAM,cAAc,CAAC;AAClC,OAAO,EACL,gBAAgB,EAChB,UAAU,EACV,UAAU,EACV,gBAAgB,EAChB,UAAU,EACV,YAAY,
|
|
1
|
+
{"version":3,"file":"checkbox.js","sourceRoot":"","sources":["../../src/ui/checkbox.tsx"],"names":[],"mappings":"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"}
|
|
@@ -0,0 +1,30 @@
|
|
|
1
|
+
import type { ReactNode } from 'react';
|
|
2
|
+
import { type CopyButtonLabels } from './copy-button.js';
|
|
3
|
+
/** A code block's words, for the `labels` prop: its copy button's, and its own. */
|
|
4
|
+
export interface CodeBlockLabels extends CopyButtonLabels {
|
|
5
|
+
/** Shown above a `terminal` block with no `label`. */
|
|
6
|
+
terminal: string;
|
|
7
|
+
/** What the copy button says it copies when there is no `label`. */
|
|
8
|
+
code: string;
|
|
9
|
+
/** Names the block while it scrolls: `{name}` is its label (or `terminal`, or `code`) and `{first}` its first line. */
|
|
10
|
+
region: string;
|
|
11
|
+
}
|
|
12
|
+
/** Its own words; its copy button's come from CopyButton's, app-wide under `copyButton`. */
|
|
13
|
+
export declare const codeBlockLabels: Omit<CodeBlockLabels, keyof CopyButtonLabels>;
|
|
14
|
+
interface CodeBlockWords {
|
|
15
|
+
label?: string;
|
|
16
|
+
terminal: boolean;
|
|
17
|
+
labels?: Partial<CodeBlockLabels>;
|
|
18
|
+
}
|
|
19
|
+
/** The line above the code: its label, and the copy button. */
|
|
20
|
+
export declare function CodeBlockCaption({ copy, copied, ...words }: CodeBlockWords & {
|
|
21
|
+
copy: boolean;
|
|
22
|
+
copied: string;
|
|
23
|
+
}): import("react").JSX.Element;
|
|
24
|
+
/** The code's scroller, named by the block's label and its first line. */
|
|
25
|
+
export declare function CodeBlockRegion({ first, children, ...words }: CodeBlockWords & {
|
|
26
|
+
first: string;
|
|
27
|
+
children: ReactNode;
|
|
28
|
+
}): import("react").JSX.Element;
|
|
29
|
+
export {};
|
|
30
|
+
//# sourceMappingURL=code-block-parts.d.ts.map
|
|
@@ -0,0 +1 @@
|
|
|
1
|
+
{"version":3,"file":"code-block-parts.d.ts","sourceRoot":"","sources":["../../src/ui/code-block-parts.tsx"],"names":[],"mappings":"AAEA,OAAO,KAAK,EAAE,SAAS,EAAE,MAAM,OAAO,CAAC;AAEvC,OAAO,EAAc,KAAK,gBAAgB,EAAE,MAAM,kBAAkB,CAAC;AAGrE,mFAAmF;AACnF,MAAM,WAAW,eAAgB,SAAQ,gBAAgB;IACvD,sDAAsD;IACtD,QAAQ,EAAE,MAAM,CAAC;IACjB,oEAAoE;IACpE,IAAI,EAAE,MAAM,CAAC;IACb,uHAAuH;IACvH,MAAM,EAAE,MAAM,CAAC;CAChB;AAED,4FAA4F;AAC5F,eAAO,MAAM,eAAe,EAAE,IAAI,CAAC,eAAe,EAAE,MAAM,gBAAgB,CAIzE,CAAC;AAEF,UAAU,cAAc;IACtB,KAAK,CAAC,EAAE,MAAM,CAAC;IACf,QAAQ,EAAE,OAAO,CAAC;IAClB,MAAM,CAAC,EAAE,OAAO,CAAC,eAAe,CAAC,CAAC;CACnC;AAQD,+DAA+D;AAC/D,wBAAgB,gBAAgB,CAAC,EAC/B,IAAI,EACJ,MAAM,EACN,GAAG,KAAK,EACT,EAAE,cAAc,GAAG;IAAE,IAAI,EAAE,OAAO,CAAC;IAAC,MAAM,EAAE,MAAM,CAAA;CAAE,+BAUpD;AAED,0EAA0E;AAC1E,wBAAgB,eAAe,CAAC,EAC9B,KAAK,EACL,QAAQ,EACR,GAAG,KAAK,EACT,EAAE,cAAc,GAAG;IAAE,KAAK,EAAE,MAAM,CAAC;IAAC,QAAQ,EAAE,SAAS,CAAA;CAAE,+BAKzD"}
|
|
@@ -0,0 +1,27 @@
|
|
|
1
|
+
'use client';
|
|
2
|
+
import { jsx as _jsx, jsxs as _jsxs } from "react/jsx-runtime";
|
|
3
|
+
import { useLabels } from '../lib/locale.js';
|
|
4
|
+
import { CopyButton } from './copy-button.js';
|
|
5
|
+
import { ScrollRegion } from './scroll-region.js';
|
|
6
|
+
/** Its own words; its copy button's come from CopyButton's, app-wide under `copyButton`. */
|
|
7
|
+
export const codeBlockLabels = {
|
|
8
|
+
terminal: 'Terminal',
|
|
9
|
+
code: 'code',
|
|
10
|
+
region: '{name}: {first}',
|
|
11
|
+
};
|
|
12
|
+
/** What the block calls itself: its label, or the word for a terminal or for code. */
|
|
13
|
+
function useName({ label, terminal, labels }) {
|
|
14
|
+
const t = useLabels('codeBlock', codeBlockLabels, labels);
|
|
15
|
+
return { t, name: label ?? (terminal ? t('terminal') : t('code')) };
|
|
16
|
+
}
|
|
17
|
+
/** The line above the code: its label, and the copy button. */
|
|
18
|
+
export function CodeBlockCaption({ copy, copied, ...words }) {
|
|
19
|
+
const { t, name } = useName(words);
|
|
20
|
+
return (_jsxs("figcaption", { className: "relative flex items-center justify-between gap-2.5 border-b border-border py-1 pr-1.5 pl-4", children: [_jsx("span", { className: "min-w-0 truncate font-mono text-[13px] leading-5 text-muted-foreground", children: words.label ?? (words.terminal ? t('terminal') : '') }), copy && _jsx(CopyButton, { text: copied, label: name, labels: words.labels })] }));
|
|
21
|
+
}
|
|
22
|
+
/** The code's scroller, named by the block's label and its first line. */
|
|
23
|
+
export function CodeBlockRegion({ first, children, ...words }) {
|
|
24
|
+
const { t, name } = useName(words);
|
|
25
|
+
return (_jsx(ScrollRegion, { label: first ? t('region', { name, first }) : name, children: children }));
|
|
26
|
+
}
|
|
27
|
+
//# sourceMappingURL=code-block-parts.js.map
|
|
@@ -0,0 +1 @@
|
|
|
1
|
+
{"version":3,"file":"code-block-parts.js","sourceRoot":"","sources":["../../src/ui/code-block-parts.tsx"],"names":[],"mappings":"AAAA,YAAY,CAAC;;AAGb,OAAO,EAAE,SAAS,EAAE,MAAM,kBAAkB,CAAC;AAC7C,OAAO,EAAE,UAAU,EAAyB,MAAM,kBAAkB,CAAC;AACrE,OAAO,EAAE,YAAY,EAAE,MAAM,oBAAoB,CAAC;AAYlD,4FAA4F;AAC5F,MAAM,CAAC,MAAM,eAAe,GAAkD;IAC5E,QAAQ,EAAE,UAAU;IACpB,IAAI,EAAE,MAAM;IACZ,MAAM,EAAE,iBAAiB;CAC1B,CAAC;AAQF,sFAAsF;AACtF,SAAS,OAAO,CAAC,EAAE,KAAK,EAAE,QAAQ,EAAE,MAAM,EAAkB;IAC1D,MAAM,CAAC,GAAG,SAAS,CAAC,WAAW,EAAE,eAAe,EAAE,MAAM,CAAC,CAAC;IAC1D,OAAO,EAAE,CAAC,EAAE,IAAI,EAAE,KAAK,IAAI,CAAC,QAAQ,CAAC,CAAC,CAAC,CAAC,CAAC,UAAU,CAAC,CAAC,CAAC,CAAC,CAAC,CAAC,MAAM,CAAC,CAAC,EAAE,CAAC;AACtE,CAAC;AAED,+DAA+D;AAC/D,MAAM,UAAU,gBAAgB,CAAC,EAC/B,IAAI,EACJ,MAAM,EACN,GAAG,KAAK,EAC2C;IACnD,MAAM,EAAE,CAAC,EAAE,IAAI,EAAE,GAAG,OAAO,CAAC,KAAK,CAAC,CAAC;IACnC,OAAO,CACL,sBAAY,SAAS,EAAC,4FAA4F,aAChH,eAAM,SAAS,EAAC,wEAAwE,YACrF,KAAK,CAAC,KAAK,IAAI,CAAC,KAAK,CAAC,QAAQ,CAAC,CAAC,CAAC,CAAC,CAAC,UAAU,CAAC,CAAC,CAAC,CAAC,EAAE,CAAC,GAChD,EACN,IAAI,IAAI,KAAC,UAAU,IAAC,IAAI,EAAE,MAAM,EAAE,KAAK,EAAE,IAAI,EAAE,MAAM,EAAE,KAAK,CAAC,MAAM,GAAI,IAC7D,CACd,CAAC;AACJ,CAAC;AAED,0EAA0E;AAC1E,MAAM,UAAU,eAAe,CAAC,EAC9B,KAAK,EACL,QAAQ,EACR,GAAG,KAAK,EACgD;IACxD,MAAM,EAAE,CAAC,EAAE,IAAI,EAAE,GAAG,OAAO,CAAC,KAAK,CAAC,CAAC;IACnC,OAAO,CACL,KAAC,YAAY,IAAC,KAAK,EAAE,KAAK,CAAC,CAAC,CAAC,CAAC,CAAC,QAAQ,EAAE,EAAE,IAAI,EAAE,KAAK,EAAE,CAAC,CAAC,CAAC,CAAC,IAAI,YAAG,QAAQ,GAAgB,CAC5F,CAAC;AACJ,CAAC"}
|
package/dist/ui/code-block.d.ts
CHANGED
|
@@ -1,4 +1,5 @@
|
|
|
1
|
-
import { type
|
|
1
|
+
import { type CodeBlockLabels } from './code-block-parts.js';
|
|
2
|
+
export type { CodeBlockLabels } from './code-block-parts.js';
|
|
2
3
|
export interface CodeBlockProps {
|
|
3
4
|
code: string;
|
|
4
5
|
/** What it is: a file path (`app/layout.tsx`), a language, or "Terminal". Shown above the code. */
|
|
@@ -13,17 +14,10 @@ export interface CodeBlockProps {
|
|
|
13
14
|
labels?: Partial<CodeBlockLabels>;
|
|
14
15
|
className?: string;
|
|
15
16
|
}
|
|
16
|
-
/** A code block's words, for the `labels` prop: its copy button's, and what it calls itself unlabelled. */
|
|
17
|
-
export interface CodeBlockLabels extends CopyButtonLabels {
|
|
18
|
-
/** Shown above a `terminal` block with no `label`. */
|
|
19
|
-
terminal: string;
|
|
20
|
-
/** What the copy button says it copies when there is no `label`. */
|
|
21
|
-
code: string;
|
|
22
|
-
}
|
|
23
17
|
/**
|
|
24
18
|
* Code with a label and a copy button. Long lines scroll sideways inside a ScrollRegion, never the page; the
|
|
25
|
-
* region is named by the label and the first line, so two on a page can be told apart. Server-safe:
|
|
26
|
-
*
|
|
19
|
+
* region is named by the label and the first line, so two on a page can be told apart. Server-safe: its words
|
|
20
|
+
* are in two small client components, so the code itself is rendered on the server and holds no state.
|
|
27
21
|
*/
|
|
28
22
|
export declare function CodeBlock({ code, label, tone, copy, labels, className, }: CodeBlockProps): import("react").JSX.Element;
|
|
29
23
|
//# sourceMappingURL=code-block.d.ts.map
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"code-block.d.ts","sourceRoot":"","sources":["../../src/ui/code-block.tsx"],"names":[],"mappings":"AACA,OAAO,
|
|
1
|
+
{"version":3,"file":"code-block.d.ts","sourceRoot":"","sources":["../../src/ui/code-block.tsx"],"names":[],"mappings":"AACA,OAAO,EAAqC,KAAK,eAAe,EAAE,MAAM,uBAAuB,CAAC;AAEhG,YAAY,EAAE,eAAe,EAAE,MAAM,uBAAuB,CAAC;AAE7D,MAAM,WAAW,cAAc;IAC7B,IAAI,EAAE,MAAM,CAAC;IACb,mGAAmG;IACnG,KAAK,CAAC,EAAE,MAAM,CAAC;IACf;;;OAGG;IACH,IAAI,CAAC,EAAE,MAAM,GAAG,UAAU,CAAC;IAC3B,0CAA0C;IAC1C,IAAI,CAAC,EAAE,OAAO,CAAC;IACf,MAAM,CAAC,EAAE,OAAO,CAAC,eAAe,CAAC,CAAC;IAClC,SAAS,CAAC,EAAE,MAAM,CAAC;CACpB;AAID;;;;GAIG;AACH,wBAAgB,SAAS,CAAC,EACxB,IAAI,EACJ,KAAK,EACL,IAAa,EACb,IAAW,EACX,MAAM,EACN,SAAS,GACV,EAAE,cAAc,+BAgDhB"}
|
package/dist/ui/code-block.js
CHANGED
|
@@ -1,24 +1,19 @@
|
|
|
1
1
|
import { Fragment as _Fragment, jsx as _jsx, jsxs as _jsxs } from "react/jsx-runtime";
|
|
2
2
|
import { cn } from '../lib/cn.js';
|
|
3
|
-
import {
|
|
4
|
-
import { withLabels } from '../lib/labels.js';
|
|
5
|
-
import { ScrollRegion } from './scroll-region.js';
|
|
6
|
-
const codeBlockNames = { terminal: 'Terminal', code: 'code' };
|
|
3
|
+
import { CodeBlockCaption, CodeBlockRegion } from './code-block-parts.js';
|
|
7
4
|
const PROMPT = /^\$ /;
|
|
8
5
|
/**
|
|
9
6
|
* Code with a label and a copy button. Long lines scroll sideways inside a ScrollRegion, never the page; the
|
|
10
|
-
* region is named by the label and the first line, so two on a page can be told apart. Server-safe:
|
|
11
|
-
*
|
|
7
|
+
* region is named by the label and the first line, so two on a page can be told apart. Server-safe: its words
|
|
8
|
+
* are in two small client components, so the code itself is rendered on the server and holds no state.
|
|
12
9
|
*/
|
|
13
10
|
export function CodeBlock({ code, label, tone = 'code', copy = true, labels, className, }) {
|
|
14
|
-
const names = withLabels(codeBlockNames, labels);
|
|
15
11
|
const lines = code.split('\n');
|
|
16
12
|
const terminal = tone === 'terminal';
|
|
17
13
|
const commands = terminal ? lines.filter((l) => PROMPT.test(l)) : [];
|
|
18
14
|
const copied = commands.length ? commands.map((l) => l.replace(PROMPT, '')).join('\n') : code;
|
|
19
|
-
const name = label ?? (terminal ? names.terminal : names.code);
|
|
20
15
|
const first = (commands[0]?.replace(PROMPT, '') ?? lines[0]).trim().slice(0, 60);
|
|
21
|
-
return (_jsxs("figure", { className: cn('relative m-0 min-w-0 overflow-clip rounded-lg border border-border bg-background', className), children: [(label || terminal || copy) && (
|
|
16
|
+
return (_jsxs("figure", { className: cn('relative m-0 min-w-0 overflow-clip rounded-lg border border-border bg-background', className), children: [(label || terminal || copy) && (_jsx(CodeBlockCaption, { label: label, terminal: terminal, copy: copy, copied: copied, labels: labels })), _jsx(CodeBlockRegion, { label: label, terminal: terminal, first: first, labels: labels, children: _jsx("pre", { className: "m-0 w-max min-w-full p-[18px] text-code", children: _jsx("code", { children: terminal
|
|
22
17
|
? lines.map((line, i) => (_jsx("span", { className: "block", children: PROMPT.test(line) ? (_jsxs(_Fragment, { children: [_jsx("span", { "aria-hidden": "true", className: "text-muted-foreground select-none", children: '$ ' }), line.replace(PROMPT, '')] })) : (_jsx("span", { className: "text-muted-foreground", children: line || ' ' })) }, i)))
|
|
23
18
|
: code }) }) })] }));
|
|
24
19
|
}
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"code-block.js","sourceRoot":"","sources":["../../src/ui/code-block.tsx"],"names":[],"mappings":";AAAA,OAAO,EAAE,EAAE,EAAE,MAAM,cAAc,CAAC;AAClC,OAAO,EAAE,
|
|
1
|
+
{"version":3,"file":"code-block.js","sourceRoot":"","sources":["../../src/ui/code-block.tsx"],"names":[],"mappings":";AAAA,OAAO,EAAE,EAAE,EAAE,MAAM,cAAc,CAAC;AAClC,OAAO,EAAE,gBAAgB,EAAE,eAAe,EAAwB,MAAM,uBAAuB,CAAC;AAmBhG,MAAM,MAAM,GAAG,MAAM,CAAC;AAEtB;;;;GAIG;AACH,MAAM,UAAU,SAAS,CAAC,EACxB,IAAI,EACJ,KAAK,EACL,IAAI,GAAG,MAAM,EACb,IAAI,GAAG,IAAI,EACX,MAAM,EACN,SAAS,GACM;IACf,MAAM,KAAK,GAAG,IAAI,CAAC,KAAK,CAAC,IAAI,CAAC,CAAC;IAC/B,MAAM,QAAQ,GAAG,IAAI,KAAK,UAAU,CAAC;IACrC,MAAM,QAAQ,GAAG,QAAQ,CAAC,CAAC,CAAC,KAAK,CAAC,MAAM,CAAC,CAAC,CAAC,EAAE,EAAE,CAAC,MAAM,CAAC,IAAI,CAAC,CAAC,CAAC,CAAC,CAAC,CAAC,CAAC,EAAE,CAAC;IACrE,MAAM,MAAM,GAAG,QAAQ,CAAC,MAAM,CAAC,CAAC,CAAC,QAAQ,CAAC,GAAG,CAAC,CAAC,CAAC,EAAE,EAAE,CAAC,CAAC,CAAC,OAAO,CAAC,MAAM,EAAE,EAAE,CAAC,CAAC,CAAC,IAAI,CAAC,IAAI,CAAC,CAAC,CAAC,CAAC,IAAI,CAAC;IAC9F,MAAM,KAAK,GAAG,CAAC,QAAQ,CAAC,CAAC,CAAC,EAAE,OAAO,CAAC,MAAM,EAAE,EAAE,CAAC,IAAI,KAAK,CAAC,CAAC,CAAC,CAAC,CAAC,IAAI,EAAE,CAAC,KAAK,CAAC,CAAC,EAAE,EAAE,CAAC,CAAC;IACjF,OAAO,CACL,kBACE,SAAS,EAAE,EAAE,CACX,kFAAkF,EAClF,SAAS,CACV,aAEA,CAAC,KAAK,IAAI,QAAQ,IAAI,IAAI,CAAC,IAAI,CAC9B,KAAC,gBAAgB,IACf,KAAK,EAAE,KAAK,EACZ,QAAQ,EAAE,QAAQ,EAClB,IAAI,EAAE,IAAI,EACV,MAAM,EAAE,MAAM,EACd,MAAM,EAAE,MAAM,GACd,CACH,EACD,KAAC,eAAe,IAAC,KAAK,EAAE,KAAK,EAAE,QAAQ,EAAE,QAAQ,EAAE,KAAK,EAAE,KAAK,EAAE,MAAM,EAAE,MAAM,YAE7E,cAAK,SAAS,EAAC,yCAAyC,YACtD,yBACG,QAAQ;4BACP,CAAC,CAAC,KAAK,CAAC,GAAG,CAAC,CAAC,IAAI,EAAE,CAAC,EAAE,EAAE,CAAC,CAErB,eAAc,SAAS,EAAC,OAAO,YAC5B,MAAM,CAAC,IAAI,CAAC,IAAI,CAAC,CAAC,CAAC,CAAC,CACnB,8BACE,8BAAkB,MAAM,EAAC,SAAS,EAAC,mCAAmC,YACnE,IAAI,GACA,EACN,IAAI,CAAC,OAAO,CAAC,MAAM,EAAE,EAAE,CAAC,IACxB,CACJ,CAAC,CAAC,CAAC,CACF,eAAM,SAAS,EAAC,uBAAuB,YAAE,IAAI,IAAI,GAAG,GAAQ,CAC7D,IAVQ,CAAC,CAWL,CACR,CAAC;4BACJ,CAAC,CAAC,IAAI,GACH,GACH,GACU,IACX,CACV,CAAC;AACJ,CAAC"}
|
package/dist/ui/combo-box.d.ts
CHANGED
|
@@ -1,6 +1,12 @@
|
|
|
1
1
|
import type { ReactNode } from 'react';
|
|
2
2
|
import { type ComboBoxProps as RACComboBoxProps, type Key } from 'react-aria-components';
|
|
3
3
|
import { type FieldWidth, type FieldLabels } from './field.js';
|
|
4
|
+
/** A combo box's words, for the `labels` prop: every field's, and what its open list says when it's empty. */
|
|
5
|
+
export interface ComboBoxLabels extends FieldLabels {
|
|
6
|
+
/** The open list with nothing in it, when there is no `emptyState`. */
|
|
7
|
+
noMatches: string;
|
|
8
|
+
}
|
|
9
|
+
export declare const comboBoxLabels: ComboBoxLabels;
|
|
4
10
|
export interface ComboBoxProps<T extends object> extends Omit<RACComboBoxProps<T>, 'className' | 'children' | 'validate'> {
|
|
5
11
|
label: string;
|
|
6
12
|
description?: ReactNode;
|
|
@@ -10,7 +16,7 @@ export interface ComboBoxProps<T extends object> extends Omit<RACComboBoxProps<T
|
|
|
10
16
|
placeholder?: string;
|
|
11
17
|
children: ReactNode | ((item: T) => ReactNode);
|
|
12
18
|
width?: FieldWidth;
|
|
13
|
-
labels?: Partial<
|
|
19
|
+
labels?: Partial<ComboBoxLabels>;
|
|
14
20
|
/**
|
|
15
21
|
* What the open list says when nothing is in it: "Searching…" while results load, or why nothing matched. Inside
|
|
16
22
|
* the list, because React Aria hides the rest of the page from assistive technology while the list is open.
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"combo-box.d.ts","sourceRoot":"","sources":["../../src/ui/combo-box.tsx"],"names":[],"mappings":"AAEA,OAAO,KAAK,EAAE,SAAS,EAAE,MAAM,OAAO,CAAC;AACvC,OAAO,EAGL,KAAK,aAAa,IAAI,gBAAgB,EACtC,KAAK,GAAG,EACT,MAAM,uBAAuB,CAAC;
|
|
1
|
+
{"version":3,"file":"combo-box.d.ts","sourceRoot":"","sources":["../../src/ui/combo-box.tsx"],"names":[],"mappings":"AAEA,OAAO,KAAK,EAAE,SAAS,EAAE,MAAM,OAAO,CAAC;AACvC,OAAO,EAGL,KAAK,aAAa,IAAI,gBAAgB,EACtC,KAAK,GAAG,EACT,MAAM,uBAAuB,CAAC;AAK/B,OAAO,EASL,KAAK,UAAU,EAEf,KAAK,WAAW,EACjB,MAAM,YAAY,CAAC;AAIpB,8GAA8G;AAC9G,MAAM,WAAW,cAAe,SAAQ,WAAW;IACjD,uEAAuE;IACvE,SAAS,EAAE,MAAM,CAAC;CACnB;AAED,eAAO,MAAM,cAAc,EAAE,cAG5B,CAAC;AAEF,MAAM,WAAW,aAAa,CAAC,CAAC,SAAS,MAAM,CAAE,SAAQ,IAAI,CAC3D,gBAAgB,CAAC,CAAC,CAAC,EACnB,WAAW,GAAG,UAAU,GAAG,UAAU,CACtC;IACC,KAAK,EAAE,MAAM,CAAC;IACd,WAAW,CAAC,EAAE,SAAS,CAAC;IACxB,YAAY,CAAC,EAAE,MAAM,CAAC;IACtB,eAAe,CAAC,EAAE,MAAM,CAAC;IACzB,QAAQ,CAAC,EAAE,CAAC,KAAK,EAAE,GAAG,GAAG,IAAI,KAAK,MAAM,GAAG,MAAM,EAAE,GAAG,IAAI,GAAG,IAAI,GAAG,SAAS,CAAC;IAC9E,WAAW,CAAC,EAAE,MAAM,CAAC;IACrB,QAAQ,EAAE,SAAS,GAAG,CAAC,CAAC,IAAI,EAAE,CAAC,KAAK,SAAS,CAAC,CAAC;IAC/C,KAAK,CAAC,EAAE,UAAU,CAAC;IACnB,MAAM,CAAC,EAAE,OAAO,CAAC,cAAc,CAAC,CAAC;IACjC;;;OAGG;IACH,UAAU,CAAC,EAAE,SAAS,CAAC;IACvB,SAAS,CAAC,EAAE,MAAM,CAAC;CACpB;AAED,4HAA4H;AAC5H,wBAAgB,QAAQ,CAAC,CAAC,SAAS,MAAM,EAAE,EACzC,KAAK,EACL,WAAW,EACX,YAAY,EACZ,eAAe,EACf,QAAQ,EACR,WAAW,EACX,QAAQ,EACR,KAAY,EACZ,MAAM,EACN,UAAU,EACV,SAAS,EACT,GAAG,KAAK,EACT,EAAE,aAAa,CAAC,CAAC,CAAC,+BA2ClB"}
|
package/dist/ui/combo-box.js
CHANGED
|
@@ -3,12 +3,19 @@ import { jsx as _jsx, jsxs as _jsxs } from "react/jsx-runtime";
|
|
|
3
3
|
import { ComboBox as RACComboBox, Input, } from 'react-aria-components';
|
|
4
4
|
import { ChevronsUpDown } from 'lucide-react';
|
|
5
5
|
import { cn } from '../lib/cn.js';
|
|
6
|
+
import { useLabels } from '../lib/locale.js';
|
|
6
7
|
import { Button } from './button.js';
|
|
7
|
-
import { FieldDescription, FieldError, FieldLabel, fieldBox, fieldInput, fieldStack, fieldWidths,
|
|
8
|
+
import { FieldDescription, FieldError, FieldLabel, fieldBox, fieldInput, fieldStack, fieldWidths, withRequired, fieldLabels, } from './field.js';
|
|
8
9
|
import { ListBox } from './list-box.js';
|
|
9
10
|
import { Popover } from './menu.js';
|
|
11
|
+
export const comboBoxLabels = {
|
|
12
|
+
...fieldLabels,
|
|
13
|
+
noMatches: 'No matches. Check the spelling or try fewer letters.',
|
|
14
|
+
};
|
|
10
15
|
/** Type to filter a long list, then choose (people, countries, projects). The list opens as you type or from the button. */
|
|
11
16
|
export function ComboBox({ label, description, errorMessage, requiredMessage, validate, placeholder, children, width = 'md', labels, emptyState, className, ...props }) {
|
|
12
|
-
|
|
17
|
+
const t = useLabels(['field', 'comboBox'], comboBoxLabels, labels);
|
|
18
|
+
const required = requiredMessage ?? t('chooseValue', { label });
|
|
19
|
+
return (_jsxs(RACComboBox, { ...props, validate: withRequired(props.isRequired, required, (v) => v == null, validate), className: cn(fieldStack, fieldWidths[width], className), children: [_jsx(FieldLabel, { isRequired: props.isRequired, labels: labels, children: label }), description && _jsx(FieldDescription, { children: description }), _jsx(FieldError, { errorPrefix: t('errorPrefix'), requiredMessage: required, children: errorMessage }), _jsxs("div", { className: fieldBox, children: [_jsx(Input, { placeholder: placeholder, className: fieldInput }), _jsx(Button, { variant: "ghost", visualSize: "icon-sm", className: "me-1 justify-end", visualClassName: "text-muted-foreground group-data-hovered/button:text-foreground [&_svg]:size-4", children: _jsx(ChevronsUpDown, { "aria-hidden": "true" }) })] }), _jsx(Popover, { placement: "bottom start", className: "max-h-80", children: _jsx(ListBox, { renderEmptyState: () => (_jsx("p", { className: "px-3 py-2 text-sm text-muted-foreground", children: emptyState ?? t('noMatches') })), children: children }) })] }));
|
|
13
20
|
}
|
|
14
21
|
//# sourceMappingURL=combo-box.js.map
|
package/dist/ui/combo-box.js.map
CHANGED
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"combo-box.js","sourceRoot":"","sources":["../../src/ui/combo-box.tsx"],"names":[],"mappings":"AAAA,YAAY,CAAC;;AAGb,OAAO,EACL,QAAQ,IAAI,WAAW,EACvB,KAAK,GAGN,MAAM,uBAAuB,CAAC;AAC/B,OAAO,EAAE,cAAc,EAAE,MAAM,cAAc,CAAC;AAC9C,OAAO,EAAE,EAAE,EAAE,MAAM,cAAc,CAAC;AAClC,OAAO,EAAE,MAAM,EAAE,MAAM,aAAa,CAAC;AACrC,OAAO,EACL,gBAAgB,EAChB,UAAU,EACV,UAAU,EACV,QAAQ,EACR,UAAU,EACV,UAAU,EACV,WAAW,EACX,
|
|
1
|
+
{"version":3,"file":"combo-box.js","sourceRoot":"","sources":["../../src/ui/combo-box.tsx"],"names":[],"mappings":"AAAA,YAAY,CAAC;;AAGb,OAAO,EACL,QAAQ,IAAI,WAAW,EACvB,KAAK,GAGN,MAAM,uBAAuB,CAAC;AAC/B,OAAO,EAAE,cAAc,EAAE,MAAM,cAAc,CAAC;AAC9C,OAAO,EAAE,EAAE,EAAE,MAAM,cAAc,CAAC;AAClC,OAAO,EAAE,SAAS,EAAE,MAAM,kBAAkB,CAAC;AAC7C,OAAO,EAAE,MAAM,EAAE,MAAM,aAAa,CAAC;AACrC,OAAO,EACL,gBAAgB,EAChB,UAAU,EACV,UAAU,EACV,QAAQ,EACR,UAAU,EACV,UAAU,EACV,WAAW,EACX,YAAY,EAEZ,WAAW,GAEZ,MAAM,YAAY,CAAC;AACpB,OAAO,EAAE,OAAO,EAAE,MAAM,eAAe,CAAC;AACxC,OAAO,EAAE,OAAO,EAAE,MAAM,WAAW,CAAC;AAQpC,MAAM,CAAC,MAAM,cAAc,GAAmB;IAC5C,GAAG,WAAW;IACd,SAAS,EAAE,sDAAsD;CAClE,CAAC;AAuBF,4HAA4H;AAC5H,MAAM,UAAU,QAAQ,CAAmB,EACzC,KAAK,EACL,WAAW,EACX,YAAY,EACZ,eAAe,EACf,QAAQ,EACR,WAAW,EACX,QAAQ,EACR,KAAK,GAAG,IAAI,EACZ,MAAM,EACN,UAAU,EACV,SAAS,EACT,GAAG,KAAK,EACS;IACjB,MAAM,CAAC,GAAG,SAAS,CAAC,CAAC,OAAO,EAAE,UAAU,CAAC,EAAE,cAAc,EAAE,MAAM,CAAC,CAAC;IACnE,MAAM,QAAQ,GAAG,eAAe,IAAI,CAAC,CAAC,aAAa,EAAE,EAAE,KAAK,EAAE,CAAC,CAAC;IAChE,OAAO,CACL,MAAC,WAAW,OACL,KAA6B,EAClC,QAAQ,EACN,YAAY,CAAa,KAAK,CAAC,UAAU,EAAE,QAAQ,EAAE,CAAC,CAAC,EAAE,EAAE,CAAC,CAAC,IAAI,IAAI,EAAE,QAAQ,CAAU,EAE3F,SAAS,EAAE,EAAE,CAAC,UAAU,EAAE,WAAW,CAAC,KAAK,CAAC,EAAE,SAAS,CAAC,aAExD,KAAC,UAAU,IAAC,UAAU,EAAE,KAAK,CAAC,UAAU,EAAE,MAAM,EAAE,MAAM,YACrD,KAAK,GACK,EACZ,WAAW,IAAI,KAAC,gBAAgB,cAAE,WAAW,GAAoB,EAClE,KAAC,UAAU,IAAC,WAAW,EAAE,CAAC,CAAC,aAAa,CAAC,EAAE,eAAe,EAAE,QAAQ,YACjE,YAAY,GACF,EACb,eAAK,SAAS,EAAE,QAAQ,aACtB,KAAC,KAAK,IAAC,WAAW,EAAE,WAAW,EAAE,SAAS,EAAE,UAAU,GAAI,EAE1D,KAAC,MAAM,IACL,OAAO,EAAC,OAAO,EACf,UAAU,EAAC,SAAS,EACpB,SAAS,EAAC,kBAAkB,EAC5B,eAAe,EAAC,gFAAgF,YAEhG,KAAC,cAAc,mBAAa,MAAM,GAAG,GAC9B,IACL,EACN,KAAC,OAAO,IAAC,SAAS,EAAC,cAAc,EAAC,SAAS,EAAC,UAAU,YACpD,KAAC,OAAO,IACN,gBAAgB,EAAE,GAAG,EAAE,CAAC,CACtB,YAAG,SAAS,EAAC,yCAAyC,YACnD,UAAU,IAAI,CAAC,CAAC,WAAW,CAAC,GAC3B,CACL,YAEA,QAAiB,GACV,GACF,IACE,CACf,CAAC;AACJ,CAAC"}
|
package/dist/ui/copy-button.d.ts
CHANGED
|
@@ -2,7 +2,7 @@ import { type ButtonProps } from './button.js';
|
|
|
2
2
|
export interface CopyButtonProps extends Omit<ButtonProps, 'onPress' | 'children' | 'aria-label'> {
|
|
3
3
|
/** What to copy. */
|
|
4
4
|
text: string;
|
|
5
|
-
/** What it copies, said after "Copy" to a screen reader: "install command"
|
|
5
|
+
/** What it copies, said after "Copy" to a screen reader (`{label}` in `labels.name`): "install command". */
|
|
6
6
|
label: string;
|
|
7
7
|
labels?: Partial<CopyButtonLabels>;
|
|
8
8
|
}
|
|
@@ -11,11 +11,17 @@ export interface CopyButtonLabels {
|
|
|
11
11
|
copy: string;
|
|
12
12
|
copied: string;
|
|
13
13
|
notCopied: string;
|
|
14
|
+
/**
|
|
15
|
+
* The button's name: `{word}` is the word it shows (`copy`, `copied` or `notCopied`) and `{label}` what it
|
|
16
|
+
* copies. Keep `{word}` in it, so a voice command for what's on screen reaches the button.
|
|
17
|
+
*/
|
|
18
|
+
name: string;
|
|
14
19
|
/** Said after a copy. */
|
|
15
20
|
announceCopied: string;
|
|
16
21
|
/** Said when the browser refuses. */
|
|
17
22
|
announceFailed: string;
|
|
18
23
|
}
|
|
24
|
+
export declare const copyButtonLabels: CopyButtonLabels;
|
|
19
25
|
/**
|
|
20
26
|
* Copies text to the clipboard and says so: the button reads Copied (or Not copied) for two seconds, and a
|
|
21
27
|
* status message says what happened, again on a second copy. The visible word starts the button's name, so a
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"copy-button.d.ts","sourceRoot":"","sources":["../../src/ui/copy-button.tsx"],"names":[],"mappings":"AAGA,OAAO,EAAU,KAAK,WAAW,EAAE,MAAM,aAAa,CAAC;AAGvD,MAAM,WAAW,eAAgB,SAAQ,IAAI,CAAC,WAAW,EAAE,SAAS,GAAG,UAAU,GAAG,YAAY,CAAC;IAC/F,oBAAoB;IACpB,IAAI,EAAE,MAAM,CAAC;IACb,
|
|
1
|
+
{"version":3,"file":"copy-button.d.ts","sourceRoot":"","sources":["../../src/ui/copy-button.tsx"],"names":[],"mappings":"AAGA,OAAO,EAAU,KAAK,WAAW,EAAE,MAAM,aAAa,CAAC;AAGvD,MAAM,WAAW,eAAgB,SAAQ,IAAI,CAAC,WAAW,EAAE,SAAS,GAAG,UAAU,GAAG,YAAY,CAAC;IAC/F,oBAAoB;IACpB,IAAI,EAAE,MAAM,CAAC;IACb,4GAA4G;IAC5G,KAAK,EAAE,MAAM,CAAC;IACd,MAAM,CAAC,EAAE,OAAO,CAAC,gBAAgB,CAAC,CAAC;CACpC;AAED,uGAAuG;AACvG,MAAM,WAAW,gBAAgB;IAC/B,IAAI,EAAE,MAAM,CAAC;IACb,MAAM,EAAE,MAAM,CAAC;IACf,SAAS,EAAE,MAAM,CAAC;IAClB;;;OAGG;IACH,IAAI,EAAE,MAAM,CAAC;IACb,yBAAyB;IACzB,cAAc,EAAE,MAAM,CAAC;IACvB,qCAAqC;IACrC,cAAc,EAAE,MAAM,CAAC;CACxB;AAED,eAAO,MAAM,gBAAgB,EAAE,gBAO9B,CAAC;AAIF;;;;GAIG;AACH,wBAAgB,UAAU,CAAC,EACzB,IAAI,EACJ,KAAK,EACL,OAAiB,EACjB,UAAiB,EACjB,MAAM,EAAE,KAAK,EACb,GAAG,KAAK,EACT,EAAE,eAAe,+BA6CjB"}
|
package/dist/ui/copy-button.js
CHANGED
|
@@ -2,11 +2,12 @@
|
|
|
2
2
|
import { jsx as _jsx, jsxs as _jsxs } from "react/jsx-runtime";
|
|
3
3
|
import { useEffect, useRef, useState } from 'react';
|
|
4
4
|
import { Button } from './button.js';
|
|
5
|
-
import {
|
|
6
|
-
const copyButtonLabels = {
|
|
5
|
+
import { useLabels } from '../lib/locale.js';
|
|
6
|
+
export const copyButtonLabels = {
|
|
7
7
|
copy: 'Copy',
|
|
8
8
|
copied: 'Copied',
|
|
9
9
|
notCopied: 'Not copied',
|
|
10
|
+
name: '{word} {label}',
|
|
10
11
|
announceCopied: 'Copied {label}',
|
|
11
12
|
announceFailed: "Couldn't copy {label}. Select it and copy it yourself.",
|
|
12
13
|
};
|
|
@@ -16,11 +17,11 @@ const copyButtonLabels = {
|
|
|
16
17
|
* voice command for what's on screen reaches it.
|
|
17
18
|
*/
|
|
18
19
|
export function CopyButton({ text, label, variant = 'ghost', visualSize = 'sm', labels: given, ...props }) {
|
|
19
|
-
const
|
|
20
|
+
const t = useLabels('copyButton', copyButtonLabels, given);
|
|
20
21
|
const shown = {
|
|
21
|
-
idle:
|
|
22
|
-
copied:
|
|
23
|
-
failed:
|
|
22
|
+
idle: t('copy'),
|
|
23
|
+
copied: t('copied'),
|
|
24
|
+
failed: t('notCopied'),
|
|
24
25
|
};
|
|
25
26
|
const [state, setState] = useState('idle');
|
|
26
27
|
const [message, setMessage] = useState('');
|
|
@@ -36,14 +37,14 @@ export function CopyButton({ text, label, variant = 'ghost', visualSize = 'sm',
|
|
|
36
37
|
later(() => setMessage(words), 100);
|
|
37
38
|
later(() => setState('idle'), 2000);
|
|
38
39
|
};
|
|
39
|
-
return (_jsxs("span", { className: "relative inline-flex", children: [
|
|
40
|
+
return (_jsxs("span", { className: "relative inline-flex", children: [_jsx(Button, { ...props, "aria-label": t('name', { word: shown[state], label }), variant: variant, visualSize: visualSize, onPress: async () => {
|
|
40
41
|
try {
|
|
41
42
|
await navigator.clipboard.writeText(text);
|
|
42
|
-
announce('copied',
|
|
43
|
+
announce('copied', t('announceCopied', { label }));
|
|
43
44
|
}
|
|
44
45
|
catch {
|
|
45
|
-
announce('failed',
|
|
46
|
+
announce('failed', t('announceFailed', { label }));
|
|
46
47
|
}
|
|
47
|
-
}, children:
|
|
48
|
+
}, children: shown[state] }), _jsx("span", { role: "status", className: "sr-only", children: message })] }));
|
|
48
49
|
}
|
|
49
50
|
//# sourceMappingURL=copy-button.js.map
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"copy-button.js","sourceRoot":"","sources":["../../src/ui/copy-button.tsx"],"names":[],"mappings":"AAAA,YAAY,CAAC;;AAEb,OAAO,EAAE,SAAS,EAAE,MAAM,EAAE,QAAQ,EAAE,MAAM,OAAO,CAAC;AACpD,OAAO,EAAE,MAAM,EAAoB,MAAM,aAAa,CAAC;AACvD,OAAO,EAAE,
|
|
1
|
+
{"version":3,"file":"copy-button.js","sourceRoot":"","sources":["../../src/ui/copy-button.tsx"],"names":[],"mappings":"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"}
|
package/dist/ui/date-field.d.ts
CHANGED
|
@@ -14,6 +14,7 @@ export interface DateFieldLabels extends FieldLabels {
|
|
|
14
14
|
}
|
|
15
15
|
/** A date picker's words: its field's and its calendar's. */
|
|
16
16
|
export type DatePickerLabels = DateFieldLabels & CalendarLabels;
|
|
17
|
+
export declare const dateFieldLabels: DateFieldLabels;
|
|
17
18
|
interface FieldBase {
|
|
18
19
|
label: string;
|
|
19
20
|
/** Hint beyond the format, e.g. "The date on your certificate". */
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"date-field.d.ts","sourceRoot":"","sources":["../../src/ui/date-field.tsx"],"names":[],"mappings":"AAEA,OAAO,KAAK,EAAE,SAAS,EAAE,MAAM,OAAO,CAAC;AACvC,OAAO,EAUL,KAAK,cAAc,IAAI,iBAAiB,EACxC,KAAK,eAAe,IAAI,kBAAkB,EAC1C,KAAK,SAAS,EACd,KAAK,oBAAoB,IAAI,uBAAuB,EACpD,KAAK,SAAS,EACd,KAAK,cAAc,IAAI,iBAAiB,EACxC,KAAK,SAAS,EACf,MAAM,uBAAuB,CAAC;AAK/B,OAAO,EAA2B,KAAK,cAAc,EAAE,MAAM,eAAe,CAAC;AAE7E,OAAO,
|
|
1
|
+
{"version":3,"file":"date-field.d.ts","sourceRoot":"","sources":["../../src/ui/date-field.tsx"],"names":[],"mappings":"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"}
|
package/dist/ui/date-field.js
CHANGED
|
@@ -6,8 +6,8 @@ import { CalendarDays } from 'lucide-react';
|
|
|
6
6
|
import { cn } from '../lib/cn.js';
|
|
7
7
|
import { Button } from './button.js';
|
|
8
8
|
import { Calendar, RangeCalendar } from './calendar.js';
|
|
9
|
-
import {
|
|
10
|
-
import { FieldDescription, FieldError, FieldLabel, fieldBox, fieldStack, fieldWidths,
|
|
9
|
+
import { useLabels } from '../lib/locale.js';
|
|
10
|
+
import { FieldDescription, FieldError, FieldLabel, fieldBox, fieldStack, fieldWidths, withRequired, fieldLabels, useFieldLabels, } from './field.js';
|
|
11
11
|
import { Popover } from './menu.js';
|
|
12
12
|
/**
|
|
13
13
|
* The box around the segments (Layer 2, painted by field-paint), the same height, edge and focus ring as
|
|
@@ -27,14 +27,14 @@ function Segments({ className, slot }) {
|
|
|
27
27
|
// the box's height, not the target's.
|
|
28
28
|
'flex min-h-control-target min-w-(--target-min) cursor-text items-center justify-center self-stretch rounded-sm border-y-(length:--field-band) border-transparent bg-clip-padding px-1 tabular-nums outline-none caret-transparent', 'data-disabled:cursor-not-allowed data-[type=literal]:min-w-0 data-[type=literal]:cursor-default', 'data-placeholder:text-muted-foreground data-[type=literal]:px-0 data-[type=literal]:text-muted-foreground', 'data-focused:bg-primary data-focused:text-primary-foreground data-invalid:data-focused:bg-destructive data-invalid:data-focused:text-destructive-foreground') })) }));
|
|
29
29
|
}
|
|
30
|
-
const dateFieldLabels = {
|
|
31
|
-
|
|
30
|
+
export const dateFieldLabels = {
|
|
31
|
+
...fieldLabels,
|
|
32
32
|
tooEarly: 'Enter a date on or after {date}',
|
|
33
33
|
tooLate: 'Enter a date on or before {date}',
|
|
34
34
|
unavailable: "{date} isn't available. Choose another date",
|
|
35
35
|
};
|
|
36
36
|
function useLimitMessages(minValue, maxValue, isDateUnavailable, given) {
|
|
37
|
-
const
|
|
37
|
+
const t = useLabels(['field', 'dateField'], dateFieldLabels, given);
|
|
38
38
|
const { locale } = useLocale();
|
|
39
39
|
const fmt = new DateFormatter(locale, { dateStyle: 'medium' });
|
|
40
40
|
const show = (d) => fmt.format(d.toDate(getLocalTimeZone()));
|
|
@@ -42,24 +42,26 @@ function useLimitMessages(minValue, maxValue, isDateUnavailable, given) {
|
|
|
42
42
|
if (!value)
|
|
43
43
|
return null;
|
|
44
44
|
if (minValue && value.compare(minValue) < 0)
|
|
45
|
-
return
|
|
45
|
+
return t('tooEarly', { date: show(minValue) });
|
|
46
46
|
if (maxValue && value.compare(maxValue) > 0)
|
|
47
|
-
return
|
|
47
|
+
return t('tooLate', { date: show(maxValue) });
|
|
48
48
|
if (isDateUnavailable?.(value, null))
|
|
49
|
-
return
|
|
49
|
+
return t('unavailable', { date: show(value) });
|
|
50
50
|
return null;
|
|
51
51
|
};
|
|
52
52
|
}
|
|
53
53
|
/** A date typed in parts. Best for dates people know without looking — a date of birth, an expiry date. */
|
|
54
54
|
export function DateField({ label, description, errorMessage, requiredMessage, validate, width = 'sm', labels, className, ...props }) {
|
|
55
55
|
const limits = useLimitMessages(props.minValue, props.maxValue, props.isDateUnavailable, labels);
|
|
56
|
-
const
|
|
57
|
-
|
|
56
|
+
const t = useLabels(['field', 'dateField'], dateFieldLabels, labels);
|
|
57
|
+
const required = requiredMessage ?? t('enterValue', { label });
|
|
58
|
+
return (_jsxs(RACDateField, { ...props, validate: withRequired(props.isRequired, required, (v) => v == null, (v) => validate?.(v) ?? limits(v)), className: cn(fieldStack, fieldWidths[width], className), children: [_jsx(FieldLabel, { isRequired: props.isRequired, labels: labels, children: label }), description && _jsx(FieldDescription, { children: description }), _jsx(FieldError, { errorPrefix: t('errorPrefix'), requiredMessage: required, children: errorMessage }), _jsx(Segments, { className: cn(boxStyles, 'px-(--control-pad-x)') })] }));
|
|
58
59
|
}
|
|
59
60
|
/** A time typed in parts. The hour cycle (12 or 24) follows the locale unless `hourCycle` is set. */
|
|
60
61
|
export function TimeField({ label, description, errorMessage, requiredMessage, validate, width = 'sm', labels, className, ...props }) {
|
|
61
|
-
const
|
|
62
|
-
|
|
62
|
+
const t = useFieldLabels(labels);
|
|
63
|
+
const required = requiredMessage ?? t('enterValue', { label });
|
|
64
|
+
return (_jsxs(RACTimeField, { ...props, validate: withRequired(props.isRequired, required, (v) => v == null, validate), className: cn(fieldStack, fieldWidths[width], className), children: [_jsx(FieldLabel, { isRequired: props.isRequired, labels: labels, children: label }), description && _jsx(FieldDescription, { children: description }), _jsx(FieldError, { errorPrefix: t('errorPrefix'), requiredMessage: required, children: errorMessage }), _jsx(Segments, { className: cn(boxStyles, 'px-(--control-pad-x)') })] }));
|
|
63
65
|
}
|
|
64
66
|
function PickerButton() {
|
|
65
67
|
// React Aria names it ("Calendar", localised) and wires it to the popover. The painted button stays 4px
|
|
@@ -72,13 +74,15 @@ function PickerButton() {
|
|
|
72
74
|
*/
|
|
73
75
|
export function DatePicker({ label, description, errorMessage, requiredMessage, validate, width = 'sm', labels, className, ...props }) {
|
|
74
76
|
const limits = useLimitMessages(props.minValue, props.maxValue, props.isDateUnavailable, labels);
|
|
75
|
-
const
|
|
76
|
-
|
|
77
|
+
const t = useLabels(['field', 'dateField'], dateFieldLabels, labels);
|
|
78
|
+
const required = requiredMessage ?? t('enterValue', { label });
|
|
79
|
+
return (_jsxs(RACDatePicker, { ...props, validate: withRequired(props.isRequired, required, (v) => v == null, (v) => validate?.(v) ?? limits(v)), className: cn(fieldStack, fieldWidths[width], className), children: [_jsx(FieldLabel, { isRequired: props.isRequired, labels: labels, children: label }), description && _jsx(FieldDescription, { children: description }), _jsx(FieldError, { errorPrefix: t('errorPrefix'), requiredMessage: required, children: errorMessage }), _jsxs(Group, { className: boxStyles, children: [_jsx(Segments, { className: "ps-(--control-pad-x)" }), _jsx(PickerButton, {})] }), _jsx(Popover, { placement: "bottom end", className: "min-w-0 p-3", children: _jsx(RACDialog, { className: "outline-none", children: _jsx(Calendar, { labels: labels }) }) })] }));
|
|
77
80
|
}
|
|
78
81
|
/** A start and an end date, each typed in parts, with a two-click range calendar. */
|
|
79
82
|
export function DateRangePicker({ label, description, errorMessage, requiredMessage, validate, width = 'md', labels, className, ...props }) {
|
|
80
83
|
const limits = useLimitMessages(props.minValue, props.maxValue, props.isDateUnavailable, labels);
|
|
81
|
-
const
|
|
82
|
-
|
|
84
|
+
const t = useLabels(['field', 'dateField'], dateFieldLabels, labels);
|
|
85
|
+
const required = requiredMessage ?? t('enterValue', { label });
|
|
86
|
+
return (_jsxs(RACDateRangePicker, { ...props, validate: withRequired(props.isRequired, required, (v) => !v?.start || !v?.end, (v) => validate?.(v) ?? (v ? (limits(v.start) ?? limits(v.end)) : null)), className: cn(fieldStack, fieldWidths[width], className), children: [_jsx(FieldLabel, { isRequired: props.isRequired, labels: labels, children: label }), description && _jsx(FieldDescription, { children: description }), _jsx(FieldError, { errorPrefix: t('errorPrefix'), requiredMessage: required, children: errorMessage }), _jsxs(Group, { className: boxStyles, children: [_jsx(Segments, { slot: "start", className: "ps-(--control-pad-x)" }), _jsx("span", { "aria-hidden": "true", className: "flex items-center px-2 text-muted-foreground", children: "\u2013" }), _jsx(Segments, { slot: "end" }), _jsx(PickerButton, {})] }), _jsx(Popover, { placement: "bottom end", className: "min-w-0 p-3", children: _jsx(RACDialog, { className: "outline-none", children: _jsx(RangeCalendar, { labels: labels }) }) })] }));
|
|
83
87
|
}
|
|
84
88
|
//# sourceMappingURL=date-field.js.map
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"date-field.js","sourceRoot":"","sources":["../../src/ui/date-field.tsx"],"names":[],"mappings":"AAAA,YAAY,CAAC;;AAGb,OAAO,EACL,SAAS,IAAI,YAAY,EACzB,SAAS,EACT,UAAU,IAAI,aAAa,EAC3B,eAAe,IAAI,kBAAkB,EACrC,WAAW,EACX,MAAM,IAAI,SAAS,EACnB,KAAK,EACL,SAAS,IAAI,YAAY,EACzB,SAAS,GAQV,MAAM,uBAAuB,CAAC;AAC/B,OAAO,EAAE,aAAa,EAAE,gBAAgB,EAAE,MAAM,yBAAyB,CAAC;AAC1E,OAAO,EAAE,YAAY,EAAE,MAAM,cAAc,CAAC;AAC5C,OAAO,EAAE,EAAE,EAAE,MAAM,cAAc,CAAC;AAClC,OAAO,EAAE,MAAM,EAAE,MAAM,aAAa,CAAC;AACrC,OAAO,EAAE,QAAQ,EAAE,aAAa,EAAuB,MAAM,eAAe,CAAC;AAC7E,OAAO,EAAE,
|
|
1
|
+
{"version":3,"file":"date-field.js","sourceRoot":"","sources":["../../src/ui/date-field.tsx"],"names":[],"mappings":"AAAA,YAAY,CAAC;;AAGb,OAAO,EACL,SAAS,IAAI,YAAY,EACzB,SAAS,EACT,UAAU,IAAI,aAAa,EAC3B,eAAe,IAAI,kBAAkB,EACrC,WAAW,EACX,MAAM,IAAI,SAAS,EACnB,KAAK,EACL,SAAS,IAAI,YAAY,EACzB,SAAS,GAQV,MAAM,uBAAuB,CAAC;AAC/B,OAAO,EAAE,aAAa,EAAE,gBAAgB,EAAE,MAAM,yBAAyB,CAAC;AAC1E,OAAO,EAAE,YAAY,EAAE,MAAM,cAAc,CAAC;AAC5C,OAAO,EAAE,EAAE,EAAE,MAAM,cAAc,CAAC;AAClC,OAAO,EAAE,MAAM,EAAE,MAAM,aAAa,CAAC;AACrC,OAAO,EAAE,QAAQ,EAAE,aAAa,EAAuB,MAAM,eAAe,CAAC;AAC7E,OAAO,EAAE,SAAS,EAAE,MAAM,kBAAkB,CAAC;AAC7C,OAAO,EACL,gBAAgB,EAChB,UAAU,EACV,UAAU,EACV,QAAQ,EACR,UAAU,EACV,WAAW,EACX,YAAY,EACZ,WAAW,EACX,cAAc,GAGf,MAAM,YAAY,CAAC;AACpB,OAAO,EAAE,OAAO,EAAE,MAAM,WAAW,CAAC;AAEpC;;;;;GAKG;AACH,MAAM,SAAS,GAAG,EAAE,CAAC,QAAQ,EAAE,gCAAgC,CAAC,CAAC;AAEjE;;;GAGG;AACH,SAAS,QAAQ,CAAC,EAAE,SAAS,EAAE,IAAI,EAAkD;IACnF,OAAO,CACL,KAAC,SAAS,IAAC,IAAI,EAAE,IAAI,EAAE,SAAS,EAAE,EAAE,CAAC,sCAAsC,EAAE,SAAS,CAAC,YACpF,CAAC,OAAO,EAAE,EAAE,CAAC,CACZ,KAAC,WAAW,IACV,OAAO,EAAE,OAAO,EAChB,SAAS,EAAE,EAAE;YACX,+FAA+F;YAC/F,+FAA+F;YAC/F,sCAAsC;YACtC,mOAAmO,EACnO,iGAAiG,EACjG,2GAA2G,EAC3G,6JAA6J,CAC9J,GACD,CACH,GACS,CACb,CAAC;AACJ,CAAC;AAiBD,MAAM,CAAC,MAAM,eAAe,GAAoB;IAC9C,GAAG,WAAW;IACd,QAAQ,EAAE,iCAAiC;IAC3C,OAAO,EAAE,kCAAkC;IAC3C,WAAW,EAAE,6CAA6C;CAC3D,CAAC;AAEF,SAAS,gBAAgB,CACvB,QAAsC,EACtC,QAAsC,EACtC,iBAA6E,EAC7E,KAA2C;IAE3C,MAAM,CAAC,GAAG,SAAS,CAAC,CAAC,OAAO,EAAE,WAAW,CAAC,EAAE,eAAe,EAAE,KAAK,CAAC,CAAC;IACpE,MAAM,EAAE,MAAM,EAAE,GAAG,SAAS,EAAE,CAAC;IAC/B,MAAM,GAAG,GAAG,IAAI,aAAa,CAAC,MAAM,EAAE,EAAE,SAAS,EAAE,QAAQ,EAAE,CAAC,CAAC;IAC/D,MAAM,IAAI,GAAG,CAAC,CAAY,EAAE,EAAE,CAAC,GAAG,CAAC,MAAM,CAAC,CAAC,CAAC,MAAM,CAAC,gBAAgB,EAAE,CAAC,CAAC,CAAC;IACxE,OAAO,CAAC,KAAuB,EAAE,EAAE;QACjC,IAAI,CAAC,KAAK;YAAE,OAAO,IAAI,CAAC;QACxB,IAAI,QAAQ,IAAI,KAAK,CAAC,OAAO,CAAC,QAAQ,CAAC,GAAG,CAAC;YAAE,OAAO,CAAC,CAAC,UAAU,EAAE,EAAE,IAAI,EAAE,IAAI,CAAC,QAAQ,CAAC,EAAE,CAAC,CAAC;QAC5F,IAAI,QAAQ,IAAI,KAAK,CAAC,OAAO,CAAC,QAAQ,CAAC,GAAG,CAAC;YAAE,OAAO,CAAC,CAAC,SAAS,EAAE,EAAE,IAAI,EAAE,IAAI,CAAC,QAAQ,CAAC,EAAE,CAAC,CAAC;QAC3F,IAAI,iBAAiB,EAAE,CAAC,KAAK,EAAE,IAAI,CAAC;YAAE,OAAO,CAAC,CAAC,aAAa,EAAE,EAAE,IAAI,EAAE,IAAI,CAAC,KAAK,CAAC,EAAE,CAAC,CAAC;QACrF,OAAO,IAAI,CAAC;IACd,CAAC,CAAC;AACJ,CAAC;AAmBD,2GAA2G;AAC3G,MAAM,UAAU,SAAS,CAAsB,EAC7C,KAAK,EACL,WAAW,EACX,YAAY,EACZ,eAAe,EACf,QAAQ,EACR,KAAK,GAAG,IAAI,EACZ,MAAM,EACN,SAAS,EACT,GAAG,KAAK,EACU;IAClB,MAAM,MAAM,GAAG,gBAAgB,CAAC,KAAK,CAAC,QAAQ,EAAE,KAAK,CAAC,QAAQ,EAAE,KAAK,CAAC,iBAAiB,EAAE,MAAM,CAAC,CAAC;IACjG,MAAM,CAAC,GAAG,SAAS,CAAC,CAAC,OAAO,EAAE,WAAW,CAAC,EAAE,eAAe,EAAE,MAAM,CAAC,CAAC;IACrE,MAAM,QAAQ,GAAG,eAAe,IAAI,CAAC,CAAC,YAAY,EAAE,EAAE,KAAK,EAAE,CAAC,CAAC;IAC/D,OAAO,CACL,MAAC,YAAY,OACP,KAAK,EACT,QAAQ,EACN,YAAY,CACV,KAAK,CAAC,UAAU,EAChB,QAAQ,EACR,CAAC,CAAC,EAAE,EAAE,CAAC,CAAC,IAAI,IAAI,EAChB,CAAC,CAAC,EAAE,EAAE,CAAC,QAAQ,EAAE,CAAC,CAAC,CAAC,IAAI,MAAM,CAAC,CAAC,CAAC,CACzB,EAEZ,SAAS,EAAE,EAAE,CAAC,UAAU,EAAE,WAAW,CAAC,KAAK,CAAC,EAAE,SAAS,CAAC,aAExD,KAAC,UAAU,IAAC,UAAU,EAAE,KAAK,CAAC,UAAU,EAAE,MAAM,EAAE,MAAM,YACrD,KAAK,GACK,EACZ,WAAW,IAAI,KAAC,gBAAgB,cAAE,WAAW,GAAoB,EAClE,KAAC,UAAU,IAAC,WAAW,EAAE,CAAC,CAAC,aAAa,CAAC,EAAE,eAAe,EAAE,QAAQ,YACjE,YAAY,GACF,EACb,KAAC,QAAQ,IAAC,SAAS,EAAE,EAAE,CAAC,SAAS,EAAE,sBAAsB,CAAC,GAAI,IACjD,CAChB,CAAC;AACJ,CAAC;AAQD,qGAAqG;AACrG,MAAM,UAAU,SAAS,CAAsB,EAC7C,KAAK,EACL,WAAW,EACX,YAAY,EACZ,eAAe,EACf,QAAQ,EACR,KAAK,GAAG,IAAI,EACZ,MAAM,EACN,SAAS,EACT,GAAG,KAAK,EACU;IAClB,MAAM,CAAC,GAAG,cAAc,CAAC,MAAM,CAAC,CAAC;IACjC,MAAM,QAAQ,GAAG,eAAe,IAAI,CAAC,CAAC,YAAY,EAAE,EAAE,KAAK,EAAE,CAAC,CAAC;IAC/D,OAAO,CACL,MAAC,YAAY,OACP,KAAK,EACT,QAAQ,EACN,YAAY,CACV,KAAK,CAAC,UAAU,EAChB,QAAQ,EACR,CAAC,CAAC,EAAE,EAAE,CAAC,CAAC,IAAI,IAAI,EAChB,QAAQ,CACA,EAEZ,SAAS,EAAE,EAAE,CAAC,UAAU,EAAE,WAAW,CAAC,KAAK,CAAC,EAAE,SAAS,CAAC,aAExD,KAAC,UAAU,IAAC,UAAU,EAAE,KAAK,CAAC,UAAU,EAAE,MAAM,EAAE,MAAM,YACrD,KAAK,GACK,EACZ,WAAW,IAAI,KAAC,gBAAgB,cAAE,WAAW,GAAoB,EAClE,KAAC,UAAU,IAAC,WAAW,EAAE,CAAC,CAAC,aAAa,CAAC,EAAE,eAAe,EAAE,QAAQ,YACjE,YAAY,GACF,EACb,KAAC,QAAQ,IAAC,SAAS,EAAE,EAAE,CAAC,SAAS,EAAE,sBAAsB,CAAC,GAAI,IACjD,CAChB,CAAC;AACJ,CAAC;AAED,SAAS,YAAY;IACnB,wGAAwG;IACxG,gEAAgE;IAChE,OAAO,CACL,KAAC,MAAM,IACL,OAAO,EAAC,OAAO,EACf,UAAU,EAAC,SAAS,EACpB,SAAS,EAAC,0BAA0B,EACpC,eAAe,EAAC,iEAAiE,YAEjF,KAAC,YAAY,mBAAa,MAAM,GAAG,GAC5B,CACV,CAAC;AACJ,CAAC;AAQD;;;GAGG;AACH,MAAM,UAAU,UAAU,CAAsB,EAC9C,KAAK,EACL,WAAW,EACX,YAAY,EACZ,eAAe,EACf,QAAQ,EACR,KAAK,GAAG,IAAI,EACZ,MAAM,EACN,SAAS,EACT,GAAG,KAAK,EACW;IACnB,MAAM,MAAM,GAAG,gBAAgB,CAAC,KAAK,CAAC,QAAQ,EAAE,KAAK,CAAC,QAAQ,EAAE,KAAK,CAAC,iBAAiB,EAAE,MAAM,CAAC,CAAC;IACjG,MAAM,CAAC,GAAG,SAAS,CAAC,CAAC,OAAO,EAAE,WAAW,CAAC,EAAE,eAAe,EAAE,MAAM,CAAC,CAAC;IACrE,MAAM,QAAQ,GAAG,eAAe,IAAI,CAAC,CAAC,YAAY,EAAE,EAAE,KAAK,EAAE,CAAC,CAAC;IAC/D,OAAO,CACL,MAAC,aAAa,OACR,KAAK,EACT,QAAQ,EACN,YAAY,CACV,KAAK,CAAC,UAAU,EAChB,QAAQ,EACR,CAAC,CAAC,EAAE,EAAE,CAAC,CAAC,IAAI,IAAI,EAChB,CAAC,CAAC,EAAE,EAAE,CAAC,QAAQ,EAAE,CAAC,CAAC,CAAC,IAAI,MAAM,CAAC,CAAC,CAAC,CACzB,EAEZ,SAAS,EAAE,EAAE,CAAC,UAAU,EAAE,WAAW,CAAC,KAAK,CAAC,EAAE,SAAS,CAAC,aAExD,KAAC,UAAU,IAAC,UAAU,EAAE,KAAK,CAAC,UAAU,EAAE,MAAM,EAAE,MAAM,YACrD,KAAK,GACK,EACZ,WAAW,IAAI,KAAC,gBAAgB,cAAE,WAAW,GAAoB,EAClE,KAAC,UAAU,IAAC,WAAW,EAAE,CAAC,CAAC,aAAa,CAAC,EAAE,eAAe,EAAE,QAAQ,YACjE,YAAY,GACF,EACb,MAAC,KAAK,IAAC,SAAS,EAAE,SAAS,aACzB,KAAC,QAAQ,IAAC,SAAS,EAAC,sBAAsB,GAAG,EAC7C,KAAC,YAAY,KAAG,IACV,EACR,KAAC,OAAO,IAAC,SAAS,EAAC,YAAY,EAAC,SAAS,EAAC,aAAa,YACrD,KAAC,SAAS,IAAC,SAAS,EAAC,cAAc,YACjC,KAAC,QAAQ,IAAC,MAAM,EAAE,MAAM,GAAI,GAClB,GACJ,IACI,CACjB,CAAC;AACJ,CAAC;AAQD,qFAAqF;AACrF,MAAM,UAAU,eAAe,CAAsB,EACnD,KAAK,EACL,WAAW,EACX,YAAY,EACZ,eAAe,EACf,QAAQ,EACR,KAAK,GAAG,IAAI,EACZ,MAAM,EACN,SAAS,EACT,GAAG,KAAK,EACgB;IACxB,MAAM,MAAM,GAAG,gBAAgB,CAAC,KAAK,CAAC,QAAQ,EAAE,KAAK,CAAC,QAAQ,EAAE,KAAK,CAAC,iBAAiB,EAAE,MAAM,CAAC,CAAC;IACjG,MAAM,CAAC,GAAG,SAAS,CAAC,CAAC,OAAO,EAAE,WAAW,CAAC,EAAE,eAAe,EAAE,MAAM,CAAC,CAAC;IACrE,MAAM,QAAQ,GAAG,eAAe,IAAI,CAAC,CAAC,YAAY,EAAE,EAAE,KAAK,EAAE,CAAC,CAAC;IAC/D,OAAO,CACL,MAAC,kBAAkB,OACb,KAAK,EACT,QAAQ,EACN,YAAY,CACV,KAAK,CAAC,UAAU,EAChB,QAAQ,EACR,CAAC,CAAC,EAAE,EAAE,CAAC,CAAC,CAAC,EAAE,KAAK,IAAI,CAAC,CAAC,EAAE,GAAG,EAC3B,CAAC,CAAC,EAAE,EAAE,CAAC,QAAQ,EAAE,CAAC,CAAC,CAAC,IAAI,CAAC,CAAC,CAAC,CAAC,CAAC,CAAC,MAAM,CAAC,CAAC,CAAC,KAAK,CAAC,IAAI,MAAM,CAAC,CAAC,CAAC,GAAG,CAAC,CAAC,CAAC,CAAC,CAAC,IAAI,CAAC,CAC/D,EAEZ,SAAS,EAAE,EAAE,CAAC,UAAU,EAAE,WAAW,CAAC,KAAK,CAAC,EAAE,SAAS,CAAC,aAExD,KAAC,UAAU,IAAC,UAAU,EAAE,KAAK,CAAC,UAAU,EAAE,MAAM,EAAE,MAAM,YACrD,KAAK,GACK,EACZ,WAAW,IAAI,KAAC,gBAAgB,cAAE,WAAW,GAAoB,EAClE,KAAC,UAAU,IAAC,WAAW,EAAE,CAAC,CAAC,aAAa,CAAC,EAAE,eAAe,EAAE,QAAQ,YACjE,YAAY,GACF,EACb,MAAC,KAAK,IAAC,SAAS,EAAE,SAAS,aACzB,KAAC,QAAQ,IAAC,IAAI,EAAC,OAAO,EAAC,SAAS,EAAC,sBAAsB,GAAG,EAC1D,8BAAkB,MAAM,EAAC,SAAS,EAAC,8CAA8C,uBAE1E,EACP,KAAC,QAAQ,IAAC,IAAI,EAAC,KAAK,GAAG,EACvB,KAAC,YAAY,KAAG,IACV,EACR,KAAC,OAAO,IAAC,SAAS,EAAC,YAAY,EAAC,SAAS,EAAC,aAAa,YACrD,KAAC,SAAS,IAAC,SAAS,EAAC,cAAc,YACjC,KAAC,aAAa,IAAC,MAAM,EAAE,MAAM,GAAI,GACvB,GACJ,IACS,CACtB,CAAC;AACJ,CAAC"}
|