@reopt-ai/opt-ui 1.13.0 → 1.15.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 +45 -0
- package/COMPONENT_CATALOG.md +644 -123
- package/README.md +35 -7
- package/dist/core/index.cjs +4 -4
- package/dist/core/index.d.cts +2 -2
- package/dist/core/index.d.ts +2 -2
- package/dist/core/index.js +2 -2
- package/dist/docs/02-components/01-core.md +261 -58
- package/dist/docs/02-components/02-visuals.md +1 -1
- package/dist/docs/02-components/03-shells.md +391 -65
- package/dist/docs/02-components/04-surfaces.md +1 -1
- package/dist/docs/02-components/index.md +4 -4
- package/dist/id-registry.cjs +32 -0
- package/dist/id-registry.js +32 -0
- package/dist/id-registry.json +68 -0
- package/dist/index.cjs +1196 -427
- package/dist/index.d.cts +208 -19
- package/dist/index.d.ts +208 -19
- package/dist/index.js +1050 -295
- package/dist/{key-pad-menu-DMmbQ1jF.js → key-pad-menu-BCOeYvsH.js} +59 -67
- package/dist/{key-pad-menu-BOVu97bj.d.cts → key-pad-menu-CaIsTHB2.d.cts} +22 -9
- package/dist/{key-pad-menu-0KWOnELe.cjs → key-pad-menu-Jaqxhx9P.cjs} +57 -77
- package/dist/{key-pad-menu-NlZ9zNF8.d.ts → key-pad-menu-odAEycIX.d.ts} +22 -9
- package/dist/meta.cjs +877 -26
- package/dist/meta.js +877 -26
- package/dist/{field-sidebar-CRdToHRO.js → replay-player-layout-BVUNsUS1.js} +904 -203
- package/dist/{field-sidebar-CxxSK4JO.cjs → replay-player-layout-Cmzptq89.cjs} +944 -201
- package/dist/{field-sidebar-D-rwuN_w.d.cts → replay-player-layout-DpqdfdQ6.d.ts} +246 -3
- package/dist/{field-sidebar-Dz7J4ett.d.ts → replay-player-layout-DuZW-gFF.d.cts} +246 -3
- package/dist/shells/index.cjs +58 -52
- package/dist/shells/index.d.cts +2 -2
- package/dist/shells/index.d.ts +2 -2
- package/dist/shells/index.js +2 -2
- package/dist/{text-truncate-Bd-0WkSP.js → text-truncate-B-8nJgnu.js} +200 -101
- package/dist/{text-truncate-eMzvU_7k.d.cts → text-truncate-DOxUijpB.d.cts} +3 -30
- package/dist/{text-truncate-eMzvU_7k.d.ts → text-truncate-DOxUijpB.d.ts} +3 -30
- package/dist/{text-truncate-BeYW6XZu.cjs → text-truncate-gQhpMy-Z.cjs} +214 -97
- package/dist/theme/server.d.cts +2 -2
- package/dist/theme/server.d.ts +2 -2
- package/package.json +2 -2
|
@@ -1,5 +1,5 @@
|
|
|
1
1
|
"use client";
|
|
2
|
-
const require_text_truncate = require("./text-truncate-
|
|
2
|
+
const require_text_truncate = require("./text-truncate-gQhpMy-Z.cjs");
|
|
3
3
|
let react_jsx_runtime = require("react/jsx-runtime");
|
|
4
4
|
let react = require("react");
|
|
5
5
|
react = require_text_truncate.__toESM(react, 1);
|
|
@@ -8,7 +8,7 @@ let lucide_react = require("lucide-react");
|
|
|
8
8
|
let ogl = require("ogl");
|
|
9
9
|
let _reopt_ai_opt_palette = require("@reopt-ai/opt-palette");
|
|
10
10
|
//#region src/core/text.tsx
|
|
11
|
-
const _excluded$
|
|
11
|
+
const _excluded$10 = [
|
|
12
12
|
"as",
|
|
13
13
|
"variant",
|
|
14
14
|
"tone",
|
|
@@ -24,7 +24,7 @@ const toneStyles$1 = {
|
|
|
24
24
|
};
|
|
25
25
|
/** Semantic body text whose visual role is controlled by foundation tokens. */
|
|
26
26
|
function Text(_ref) {
|
|
27
|
-
let { as, variant = "body", tone = "primary", truncate = false, className, children } = _ref, props = require_text_truncate._objectWithoutProperties(_ref, _excluded$
|
|
27
|
+
let { as, variant = "body", tone = "primary", truncate = false, className, children } = _ref, props = require_text_truncate._objectWithoutProperties(_ref, _excluded$10);
|
|
28
28
|
const Component = as !== null && as !== void 0 ? as : "span";
|
|
29
29
|
const elementProps = require_text_truncate._objectSpread2(require_text_truncate._objectSpread2({}, props), {}, {
|
|
30
30
|
className: require_text_truncate.cn(`opt-type-${variant}`, toneStyles$1[tone], truncate && "truncate", className),
|
|
@@ -39,7 +39,7 @@ function Text(_ref) {
|
|
|
39
39
|
}
|
|
40
40
|
//#endregion
|
|
41
41
|
//#region src/core/heading.tsx
|
|
42
|
-
const _excluded$
|
|
42
|
+
const _excluded$9 = [
|
|
43
43
|
"level",
|
|
44
44
|
"variant",
|
|
45
45
|
"className",
|
|
@@ -47,7 +47,7 @@ const _excluded$10 = [
|
|
|
47
47
|
];
|
|
48
48
|
/** Semantic heading with independently selectable visual hierarchy. */
|
|
49
49
|
function Heading(_ref) {
|
|
50
|
-
let { level = 2, variant = `heading-${level}`, className, children } = _ref, props = require_text_truncate._objectWithoutProperties(_ref, _excluded$
|
|
50
|
+
let { level = 2, variant = `heading-${level}`, className, children } = _ref, props = require_text_truncate._objectWithoutProperties(_ref, _excluded$9);
|
|
51
51
|
const Component = {
|
|
52
52
|
1: "h1",
|
|
53
53
|
2: "h2",
|
|
@@ -265,47 +265,6 @@ function OtpField({ length = 6, value: controlledValue, defaultValue = "", onCha
|
|
|
265
265
|
}
|
|
266
266
|
OtpField.displayName = "OtpField";
|
|
267
267
|
//#endregion
|
|
268
|
-
//#region src/core/toggle.tsx
|
|
269
|
-
const _excluded$9 = [
|
|
270
|
-
"size",
|
|
271
|
-
"className",
|
|
272
|
-
"children"
|
|
273
|
-
];
|
|
274
|
-
const _excluded2$5 = [
|
|
275
|
-
"className",
|
|
276
|
-
"children",
|
|
277
|
-
"orientation"
|
|
278
|
-
];
|
|
279
|
-
const sizeStyles$6 = {
|
|
280
|
-
sm: "h-8 min-w-8 px-2 text-xs gap-1.5",
|
|
281
|
-
md: "h-10 min-w-10 px-3 text-sm gap-2"
|
|
282
|
-
};
|
|
283
|
-
const toggleBase = require_text_truncate.cn("inline-flex cursor-pointer items-center justify-center rounded-md border border-border bg-surface font-medium text-text-secondary", "hover:bg-bg-subtle hover:text-text-primary", "data-[pressed]:border-accent data-[pressed]:bg-accent-subtle data-[pressed]:text-accent", "disabled:pointer-events-none disabled:opacity-40", require_text_truncate.OPT_FOCUS_VISIBLE);
|
|
284
|
-
/** A two-state (pressed) button. Use standalone or inside `ToggleGroup`. */
|
|
285
|
-
function Toggle(_ref) {
|
|
286
|
-
let { size = "md", className, children } = _ref, props = require_text_truncate._objectWithoutProperties(_ref, _excluded$9);
|
|
287
|
-
return /* @__PURE__ */ (0, react_jsx_runtime.jsx)(_reopt_ai_opt_ui_primitives.Toggle, require_text_truncate._objectSpread2(require_text_truncate._objectSpread2({ className: require_text_truncate.cn(toggleBase, sizeStyles$6[size], className) }, props), {}, {
|
|
288
|
-
"data-opt-id": "GFCMY",
|
|
289
|
-
"data-opt-slug": "toggle.Toggle",
|
|
290
|
-
children
|
|
291
|
-
}));
|
|
292
|
-
}
|
|
293
|
-
Toggle.displayName = "Toggle";
|
|
294
|
-
/** A set of related toggles with shared selection and keyboard navigation. */
|
|
295
|
-
function ToggleGroup(_ref2) {
|
|
296
|
-
let { className, children, orientation = "horizontal" } = _ref2, props = require_text_truncate._objectWithoutProperties(_ref2, _excluded2$5);
|
|
297
|
-
return /* @__PURE__ */ (0, react_jsx_runtime.jsx)(_reopt_ai_opt_ui_primitives.ToggleGroup, require_text_truncate._objectSpread2(require_text_truncate._objectSpread2({
|
|
298
|
-
orientation,
|
|
299
|
-
"aria-orientation": orientation,
|
|
300
|
-
className: require_text_truncate.cn("inline-flex gap-1", orientation === "vertical" ? "flex-col" : "flex-row", className)
|
|
301
|
-
}, props), {}, {
|
|
302
|
-
"data-opt-id": "47J37",
|
|
303
|
-
"data-opt-slug": "toggle.ToggleGroup",
|
|
304
|
-
children
|
|
305
|
-
}));
|
|
306
|
-
}
|
|
307
|
-
ToggleGroup.displayName = "ToggleGroup";
|
|
308
|
-
//#endregion
|
|
309
268
|
//#region src/core/accordion.tsx
|
|
310
269
|
const _excluded$8 = ["className"];
|
|
311
270
|
const _excluded2$4 = ["className"];
|
|
@@ -583,7 +542,7 @@ function AvatarGroup(_ref5) {
|
|
|
583
542
|
}
|
|
584
543
|
//#endregion
|
|
585
544
|
//#region src/core/identity.tsx
|
|
586
|
-
const defaultLabels$
|
|
545
|
+
const defaultLabels$3 = {
|
|
587
546
|
identified: "Identified",
|
|
588
547
|
anonymous: "Anonymous"
|
|
589
548
|
};
|
|
@@ -613,7 +572,7 @@ function resolveDisplay(name, secondary, id) {
|
|
|
613
572
|
* lose track of when a table mixes profiles and devices.
|
|
614
573
|
*/
|
|
615
574
|
function Identity({ name, secondary, id, avatarSrc, state, badge, size = "md", hideAvatar = false, labels: customLabels, className }) {
|
|
616
|
-
const labels = require_text_truncate._objectSpread2(require_text_truncate._objectSpread2({}, defaultLabels$
|
|
575
|
+
const labels = require_text_truncate._objectSpread2(require_text_truncate._objectSpread2({}, defaultLabels$3), customLabels);
|
|
617
576
|
const { primary, sub } = resolveDisplay(name, secondary, id);
|
|
618
577
|
const anonymous = state === "anonymous";
|
|
619
578
|
const badgeContent = badge !== null && badge !== void 0 ? badge : state ? anonymous ? labels.anonymous : labels.identified : null;
|
|
@@ -1084,6 +1043,7 @@ function StepBuilder({ steps, onChange, label, addLabel = "Add step", maxSteps,
|
|
|
1084
1043
|
StepBuilder.displayName = "StepBuilder";
|
|
1085
1044
|
//#endregion
|
|
1086
1045
|
//#region src/core/condition-builder.tsx
|
|
1046
|
+
const defaultLabels$2 = { previewSuffix: "matches" };
|
|
1087
1047
|
const OPERATOR_LABELS = {
|
|
1088
1048
|
equals: "equals",
|
|
1089
1049
|
not_equals: "does not equal",
|
|
@@ -1142,8 +1102,9 @@ function collectConditionBuilderIds(groups) {
|
|
|
1142
1102
|
};
|
|
1143
1103
|
}
|
|
1144
1104
|
/** Renders the condition builder component. */
|
|
1145
|
-
function ConditionBuilder({ groups, onChange, properties = DEFAULT_PROPERTIES, label, addConditionLabel = "Add condition", addGroupLabel = "Add group", addNestedGroupLabel = "Add nested group", nested = false, maxDepth = 3, conditionTypes, onPreview, previewCount, className, "aria-label": ariaLabel }) {
|
|
1105
|
+
function ConditionBuilder({ groups, onChange, properties = DEFAULT_PROPERTIES, label, addConditionLabel = "Add condition", addGroupLabel = "Add group", addNestedGroupLabel = "Add nested group", nested = false, maxDepth = 3, conditionTypes, onPreview, previewCount, labels: customLabels, className, "aria-label": ariaLabel }) {
|
|
1146
1106
|
var _ref;
|
|
1107
|
+
const labels = require_text_truncate._objectSpread2(require_text_truncate._objectSpread2({}, defaultLabels$2), customLabels);
|
|
1147
1108
|
const inheritedIdScope = react.useContext(ConditionBuilderIdScopeContext);
|
|
1148
1109
|
const nextGroupIdRef = react.useRef(1);
|
|
1149
1110
|
const nextConditionIdRef = react.useRef(1);
|
|
@@ -1360,7 +1321,8 @@ function ConditionBuilder({ groups, onChange, properties = DEFAULT_PROPERTIES, l
|
|
|
1360
1321
|
addNestedGroupLabel,
|
|
1361
1322
|
nested,
|
|
1362
1323
|
maxDepth: maxDepth - 1,
|
|
1363
|
-
conditionTypes
|
|
1324
|
+
conditionTypes,
|
|
1325
|
+
labels: customLabels
|
|
1364
1326
|
})
|
|
1365
1327
|
}),
|
|
1366
1328
|
/* @__PURE__ */ (0, react_jsx_runtime.jsxs)("div", {
|
|
@@ -1403,9 +1365,9 @@ function ConditionBuilder({ groups, onChange, properties = DEFAULT_PROPERTIES, l
|
|
|
1403
1365
|
onClick: addGroup,
|
|
1404
1366
|
className: "self-start",
|
|
1405
1367
|
children: ["+ ", addGroupLabel]
|
|
1406
|
-
}), previewCount != null && /* @__PURE__ */ (0, react_jsx_runtime.
|
|
1368
|
+
}), previewCount != null && /* @__PURE__ */ (0, react_jsx_runtime.jsx)("span", {
|
|
1407
1369
|
className: require_text_truncate.cn("text-text-secondary", "text-sm"),
|
|
1408
|
-
children:
|
|
1370
|
+
children: labels.formatPreview ? labels.formatPreview(previewCount) : `${require_text_truncate.formatOptNumber(previewCount)} ${labels.previewSuffix}`
|
|
1409
1371
|
})]
|
|
1410
1372
|
})
|
|
1411
1373
|
]
|
|
@@ -3686,6 +3648,7 @@ function ColorPalettePicker({ palettes, value, onValueChange, label = "Colour pa
|
|
|
3686
3648
|
//#endregion
|
|
3687
3649
|
//#region src/core/inline-edit.tsx
|
|
3688
3650
|
const defaultLabels = {
|
|
3651
|
+
input: "Value",
|
|
3689
3652
|
edit: (value) => `Edit ${value}`,
|
|
3690
3653
|
save: "Save",
|
|
3691
3654
|
cancel: "Cancel",
|
|
@@ -3721,24 +3684,39 @@ function InlineEdit({ value, onSave, as: Tag = "span", size = "md", placeholder,
|
|
|
3721
3684
|
const [rejected, setRejected] = (0, react.useState)(false);
|
|
3722
3685
|
const [saving, setSaving] = (0, react.useState)(false);
|
|
3723
3686
|
const inputRef = (0, react.useRef)(null);
|
|
3687
|
+
const rootRef = (0, react.useRef)(null);
|
|
3688
|
+
const readButtonRef = (0, react.useRef)(null);
|
|
3689
|
+
const restoreFocusRef = (0, react.useRef)(false);
|
|
3690
|
+
const savingRef = (0, react.useRef)(false);
|
|
3691
|
+
const errorId = (0, react.useId)();
|
|
3724
3692
|
(0, react.useEffect)(() => {
|
|
3725
3693
|
if (!editing) setDraft(value);
|
|
3726
3694
|
}, [value, editing]);
|
|
3727
|
-
(0, react.
|
|
3695
|
+
(0, react.useLayoutEffect)(() => {
|
|
3728
3696
|
if (editing) {
|
|
3729
3697
|
var _inputRef$current, _inputRef$current2;
|
|
3730
3698
|
(_inputRef$current = inputRef.current) === null || _inputRef$current === void 0 || _inputRef$current.focus();
|
|
3731
3699
|
(_inputRef$current2 = inputRef.current) === null || _inputRef$current2 === void 0 || _inputRef$current2.select();
|
|
3700
|
+
} else if (restoreFocusRef.current) {
|
|
3701
|
+
var _readButtonRef$curren;
|
|
3702
|
+
restoreFocusRef.current = false;
|
|
3703
|
+
(_readButtonRef$curren = readButtonRef.current) === null || _readButtonRef$curren === void 0 || _readButtonRef$curren.focus();
|
|
3732
3704
|
}
|
|
3733
3705
|
}, [editing]);
|
|
3734
|
-
const
|
|
3735
|
-
|
|
3706
|
+
const finishEditing = (restoreFocus) => {
|
|
3707
|
+
var _rootRef$current;
|
|
3708
|
+
restoreFocusRef.current = restoreFocus && (document.activeElement === document.body || Boolean((_rootRef$current = rootRef.current) === null || _rootRef$current === void 0 ? void 0 : _rootRef$current.contains(document.activeElement)));
|
|
3709
|
+
setEditing(false);
|
|
3710
|
+
};
|
|
3711
|
+
const commit = async (restoreFocus) => {
|
|
3712
|
+
if (savingRef.current || disabled) return;
|
|
3736
3713
|
const next = draft.trim();
|
|
3737
3714
|
if (next === value) {
|
|
3738
|
-
|
|
3715
|
+
finishEditing(restoreFocus);
|
|
3739
3716
|
setRejected(false);
|
|
3740
3717
|
return;
|
|
3741
3718
|
}
|
|
3719
|
+
savingRef.current = true;
|
|
3742
3720
|
setSaving(true);
|
|
3743
3721
|
try {
|
|
3744
3722
|
if (await onSave(next) === false) {
|
|
@@ -3746,26 +3724,35 @@ function InlineEdit({ value, onSave, as: Tag = "span", size = "md", placeholder,
|
|
|
3746
3724
|
return;
|
|
3747
3725
|
}
|
|
3748
3726
|
setRejected(false);
|
|
3749
|
-
|
|
3727
|
+
finishEditing(restoreFocus);
|
|
3728
|
+
} catch (_unused) {
|
|
3729
|
+
setRejected(true);
|
|
3750
3730
|
} finally {
|
|
3731
|
+
savingRef.current = false;
|
|
3751
3732
|
setSaving(false);
|
|
3752
3733
|
}
|
|
3753
3734
|
};
|
|
3754
3735
|
const cancel = () => {
|
|
3736
|
+
if (savingRef.current) return;
|
|
3755
3737
|
setDraft(value);
|
|
3756
3738
|
setRejected(false);
|
|
3757
|
-
|
|
3739
|
+
finishEditing(true);
|
|
3758
3740
|
};
|
|
3759
3741
|
const handleKeyDown = (event) => {
|
|
3742
|
+
if (require_text_truncate.isComposingKey(event)) return;
|
|
3760
3743
|
if (event.key === "Enter") {
|
|
3761
3744
|
event.preventDefault();
|
|
3762
|
-
commit();
|
|
3745
|
+
commit(true);
|
|
3763
3746
|
} else if (event.key === "Escape") {
|
|
3764
3747
|
event.preventDefault();
|
|
3765
3748
|
cancel();
|
|
3766
3749
|
}
|
|
3767
3750
|
};
|
|
3768
3751
|
if (editing) return /* @__PURE__ */ (0, react_jsx_runtime.jsxs)("span", {
|
|
3752
|
+
ref: rootRef,
|
|
3753
|
+
onBlur: (event) => {
|
|
3754
|
+
if (!event.currentTarget.contains(event.relatedTarget)) commit(false);
|
|
3755
|
+
},
|
|
3769
3756
|
className: require_text_truncate.cn("inline-flex min-w-0 items-center gap-element", className),
|
|
3770
3757
|
"data-opt-id": "RQ0H2",
|
|
3771
3758
|
"data-opt-slug": "inline-edit.InlineEdit",
|
|
@@ -3778,16 +3765,18 @@ function InlineEdit({ value, onSave, as: Tag = "span", size = "md", placeholder,
|
|
|
3778
3765
|
setRejected(false);
|
|
3779
3766
|
},
|
|
3780
3767
|
onKeyDown: handleKeyDown,
|
|
3781
|
-
onBlur: () => void commit(),
|
|
3782
3768
|
placeholder,
|
|
3783
3769
|
maxLength,
|
|
3784
|
-
|
|
3770
|
+
readOnly: saving || disabled,
|
|
3771
|
+
"aria-busy": saving || void 0,
|
|
3772
|
+
"aria-label": text.input,
|
|
3785
3773
|
"aria-invalid": rejected || void 0,
|
|
3786
|
-
"aria-errormessage": rejected ?
|
|
3774
|
+
"aria-errormessage": rejected ? errorId : void 0,
|
|
3775
|
+
"aria-describedby": rejected ? errorId : void 0,
|
|
3787
3776
|
className: require_text_truncate.cn(require_text_truncate.OPT_INPUT, sizeStyles$1[size], "min-w-0 flex-1")
|
|
3788
3777
|
}),
|
|
3789
3778
|
rejected && /* @__PURE__ */ (0, react_jsx_runtime.jsx)("span", {
|
|
3790
|
-
id:
|
|
3779
|
+
id: errorId,
|
|
3791
3780
|
role: "alert",
|
|
3792
3781
|
className: "sr-only",
|
|
3793
3782
|
children: text.invalid
|
|
@@ -3795,9 +3784,9 @@ function InlineEdit({ value, onSave, as: Tag = "span", size = "md", placeholder,
|
|
|
3795
3784
|
/* @__PURE__ */ (0, react_jsx_runtime.jsx)("button", {
|
|
3796
3785
|
type: "button",
|
|
3797
3786
|
"aria-label": text.save,
|
|
3798
|
-
disabled: saving,
|
|
3787
|
+
disabled: saving || disabled,
|
|
3799
3788
|
onMouseDown: (event) => event.preventDefault(),
|
|
3800
|
-
onClick: () => void commit(),
|
|
3789
|
+
onClick: () => void commit(true),
|
|
3801
3790
|
className: require_text_truncate.cn("text-success hover:bg-success-subtle rounded-md p-1", require_text_truncate.OPT_FOCUS_VISIBLE),
|
|
3802
3791
|
children: /* @__PURE__ */ (0, react_jsx_runtime.jsx)(lucide_react.Check, {
|
|
3803
3792
|
className: "size-4",
|
|
@@ -3807,6 +3796,7 @@ function InlineEdit({ value, onSave, as: Tag = "span", size = "md", placeholder,
|
|
|
3807
3796
|
/* @__PURE__ */ (0, react_jsx_runtime.jsx)("button", {
|
|
3808
3797
|
type: "button",
|
|
3809
3798
|
"aria-label": text.cancel,
|
|
3799
|
+
disabled: saving,
|
|
3810
3800
|
onMouseDown: (event) => event.preventDefault(),
|
|
3811
3801
|
onClick: cancel,
|
|
3812
3802
|
className: require_text_truncate.cn("text-text-tertiary hover:bg-bg-subtle rounded-md p-1", require_text_truncate.OPT_FOCUS_VISIBLE),
|
|
@@ -3818,10 +3808,12 @@ function InlineEdit({ value, onSave, as: Tag = "span", size = "md", placeholder,
|
|
|
3818
3808
|
]
|
|
3819
3809
|
});
|
|
3820
3810
|
return /* @__PURE__ */ (0, react_jsx_runtime.jsxs)("span", {
|
|
3811
|
+
ref: rootRef,
|
|
3821
3812
|
className: require_text_truncate.cn("inline-flex min-w-0 items-center gap-element", className),
|
|
3822
3813
|
"data-opt-id": "RQ0H2",
|
|
3823
3814
|
"data-opt-slug": "inline-edit.InlineEdit",
|
|
3824
3815
|
children: [/* @__PURE__ */ (0, react_jsx_runtime.jsxs)("button", {
|
|
3816
|
+
ref: readButtonRef,
|
|
3825
3817
|
type: "button",
|
|
3826
3818
|
disabled,
|
|
3827
3819
|
onClick: () => setEditing(true),
|
|
@@ -4222,18 +4214,6 @@ Object.defineProperty(exports, "Text", {
|
|
|
4222
4214
|
return Text;
|
|
4223
4215
|
}
|
|
4224
4216
|
});
|
|
4225
|
-
Object.defineProperty(exports, "Toggle", {
|
|
4226
|
-
enumerable: true,
|
|
4227
|
-
get: function() {
|
|
4228
|
-
return Toggle;
|
|
4229
|
-
}
|
|
4230
|
-
});
|
|
4231
|
-
Object.defineProperty(exports, "ToggleGroup", {
|
|
4232
|
-
enumerable: true,
|
|
4233
|
-
get: function() {
|
|
4234
|
-
return ToggleGroup;
|
|
4235
|
-
}
|
|
4236
|
-
});
|
|
4237
4217
|
Object.defineProperty(exports, "VirtualList", {
|
|
4238
4218
|
enumerable: true,
|
|
4239
4219
|
get: function() {
|
|
@@ -1,8 +1,8 @@
|
|
|
1
1
|
|
|
2
|
-
import {
|
|
2
|
+
import { U as StatCard$1, g as DateRangePickerProps } from "./text-truncate-DOxUijpB.js";
|
|
3
3
|
import * as React$1 from "react";
|
|
4
4
|
import { CSSProperties, ComponentPropsWithoutRef, HTMLAttributes, ImgHTMLAttributes, ReactNode } from "react";
|
|
5
|
-
import { AccordionContentProps as PrimAccordionContentProps, AccordionItemProps as PrimAccordionItemProps, AccordionRootProps, AccordionTriggerProps as PrimAccordionTriggerProps, AlertDialogPanelProps, ComboboxGroupLabelProps, ComboboxGroupProps, ComboboxInputProps, ComboboxItemProps, ComboboxPopoverProps, ComboboxRootProps, Composite, CompositeItem, CompositeProvider, CompositeRow, DialogPanelProps, DialogRootProps, DisclosureContentProps as PrimDisclosureContentProps, DisclosureRootProps, DisclosureTriggerProps as PrimDisclosureTriggerProps, FormCheckboxProps, FormDescriptionProps, FormErrorProps, FormFieldProps, FormGroupLabelProps, FormGroupProps, FormInputProps, FormLabelProps, FormProvider, FormPushProps, FormRadioGroupProps, FormRadioProps, FormRemoveProps, FormResetProps, FormRootProps, FormStoreInstance, FormSubmitProps, FormSwitchProps, MenuButtonArrowProps, MenuItemCheckboxProps, MenuItemProps, MenuItemRadioProps, MenuPopoverProps, MenuRootProps, MenuSeparatorProps, MenuTriggerProps, MenubarContainerProps, MenubarRootProps, PopoverCloseProps, PopoverContentProps, PopoverRootProps, PopoverTriggerProps, SelectItemProps, SelectLabelProps, SelectPopoverProps, SelectRootProps, SelectTriggerProps, TabListProps, TabPanelProps, TabProps, TabsRootProps, ToggleGroupProps, ToggleProps, ToolbarButtonProps, ToolbarContainerProps, ToolbarRootProps, ToolbarSeparatorProps, TooltipAnchorProps, TooltipProps, TooltipRootProps, useFieldValue, useFormContext, useFormStore } from "@reopt-ai/opt-ui-primitives";
|
|
5
|
+
import { AccordionContentProps as PrimAccordionContentProps, AccordionItemProps as PrimAccordionItemProps, AccordionRootProps, AccordionTriggerProps as PrimAccordionTriggerProps, AlertDialogPanelProps, ComboboxGroupLabelProps, ComboboxGroupProps, ComboboxInputProps, ComboboxItemProps, ComboboxPopoverProps, ComboboxRootProps, Composite, CompositeItem, CompositeProvider, CompositeRow, DialogPanelProps, DialogRootProps, DisclosureContentProps as PrimDisclosureContentProps, DisclosureRootProps, DisclosureTriggerProps as PrimDisclosureTriggerProps, FormCheckboxProps, FormDescriptionProps, FormErrorProps, FormFieldProps, FormGroupLabelProps, FormGroupProps, FormInputProps, FormLabelProps, FormProvider, FormPushProps, FormRadioGroupProps, FormRadioProps, FormRemoveProps, FormResetProps, FormRootProps, FormStoreInstance, FormSubmitProps, FormSwitchProps, FormTextareaProps, MenuButtonArrowProps, MenuItemCheckboxProps, MenuItemProps, MenuItemRadioProps, MenuPopoverProps, MenuRootProps, MenuSeparatorProps, MenuTriggerProps, MenubarContainerProps, MenubarRootProps, PopoverCloseProps, PopoverContentProps, PopoverRootProps, PopoverTriggerProps, SelectItemProps, SelectLabelProps, SelectPopoverProps, SelectRootProps, SelectTriggerProps, TabListProps, TabPanelProps, TabProps, TabsRootProps, ToggleGroupProps, ToggleProps, ToolbarButtonProps, ToolbarContainerProps, ToolbarRootProps, ToolbarSeparatorProps, TooltipAnchorProps, TooltipProps, TooltipRootProps, useFieldValue, useFormContext, useFormStore } from "@reopt-ai/opt-ui-primitives";
|
|
6
6
|
import { GroupImperativeHandle, GroupProps, Layout, PanelImperativeHandle, PanelProps, PanelSize, SeparatorProps } from "react-resizable-panels";
|
|
7
7
|
//#region src/core/kbd.d.ts
|
|
8
8
|
/** Props for the kbd component. */
|
|
@@ -1144,6 +1144,8 @@ interface SliderProps {
|
|
|
1144
1144
|
value?: number;
|
|
1145
1145
|
defaultValue?: number;
|
|
1146
1146
|
onChange?: (value: number) => void;
|
|
1147
|
+
/** Called once when a pointer or keyboard edit finishes; useful for expensive seeks. */
|
|
1148
|
+
onValueCommit?: (value: number) => void;
|
|
1147
1149
|
min?: number;
|
|
1148
1150
|
max?: number;
|
|
1149
1151
|
step?: number;
|
|
@@ -1157,7 +1159,7 @@ interface SliderProps {
|
|
|
1157
1159
|
"aria-label"?: string;
|
|
1158
1160
|
}
|
|
1159
1161
|
/** Renders the slider component. */
|
|
1160
|
-
declare function Slider({ value: controlledValue, defaultValue, onChange, min, max, step, label, showValue, formatValue, disabled, className, "aria-label": ariaLabel }: SliderProps): import("react").JSX.Element;
|
|
1162
|
+
declare function Slider({ value: controlledValue, defaultValue, onChange, onValueCommit, min, max, step, label, showValue, formatValue, disabled, className, "aria-label": ariaLabel }: SliderProps): import("react").JSX.Element;
|
|
1161
1163
|
declare namespace Slider {
|
|
1162
1164
|
var displayName: string;
|
|
1163
1165
|
}
|
|
@@ -1260,23 +1262,24 @@ type FormInputProps$1 = FormInputProps;
|
|
|
1260
1262
|
/** Renders the form input component. */
|
|
1261
1263
|
declare function FormInput$1({ className, ...props }: FormInputProps$1): import("react").JSX.Element;
|
|
1262
1264
|
/** Props for the form textarea component. */
|
|
1263
|
-
type FormTextareaProps =
|
|
1264
|
-
name: string;
|
|
1265
|
+
type FormTextareaProps$1 = FormTextareaProps & {
|
|
1265
1266
|
resize?: "none" | "vertical" | "horizontal" | "both";
|
|
1266
1267
|
};
|
|
1267
1268
|
/** Renders the form textarea component. */
|
|
1268
|
-
declare function FormTextarea({ className, resize, rows, name, ...props }: FormTextareaProps): import("react").JSX.Element;
|
|
1269
|
+
declare function FormTextarea$1({ className, resize, rows, name, ...props }: FormTextareaProps$1): import("react").JSX.Element;
|
|
1269
1270
|
/** Props for the form select component. */
|
|
1270
1271
|
type FormSelectProps = {
|
|
1271
1272
|
name: string;
|
|
1273
|
+
id?: string;
|
|
1272
1274
|
children: React.ReactNode;
|
|
1273
1275
|
className?: string;
|
|
1274
1276
|
placeholder?: string;
|
|
1275
1277
|
minWidth?: number | string;
|
|
1276
1278
|
"aria-label"?: string;
|
|
1279
|
+
"aria-describedby"?: string;
|
|
1277
1280
|
};
|
|
1278
1281
|
/** Renders the form select component. */
|
|
1279
|
-
declare function FormSelect({ name, children, className, placeholder, minWidth, "aria-label": ariaLabel }: FormSelectProps): import("react").JSX.Element;
|
|
1282
|
+
declare function FormSelect({ name, id, children, className, placeholder, minWidth, "aria-label": ariaLabel, "aria-describedby": ariaDescribedBy }: FormSelectProps): import("react").JSX.Element;
|
|
1280
1283
|
type FormSelectPopoverProps = ComponentPropsWithoutRef<typeof SelectPopover$1>;
|
|
1281
1284
|
/** Renders the form select popover component. */
|
|
1282
1285
|
declare function FormSelectPopover({ className, ...props }: FormSelectPopoverProps): import("react").JSX.Element;
|
|
@@ -1424,6 +1427,13 @@ interface ConditionTypeRenderer {
|
|
|
1424
1427
|
label: string;
|
|
1425
1428
|
render: (condition: ConditionDef, onChange: (updates: Partial<ConditionDef>) => void) => React$1.ReactNode;
|
|
1426
1429
|
}
|
|
1430
|
+
/** Localized labels for the condition builder. */
|
|
1431
|
+
interface ConditionBuilderLabels {
|
|
1432
|
+
/** Word after the formatted preview count — "matches". */
|
|
1433
|
+
previewSuffix?: string;
|
|
1434
|
+
/** Replaces the whole preview text. Wins over `previewSuffix`. */
|
|
1435
|
+
formatPreview?: (count: number) => string;
|
|
1436
|
+
}
|
|
1427
1437
|
/** Props for the condition builder component. */
|
|
1428
1438
|
interface ConditionBuilderProps {
|
|
1429
1439
|
groups: ConditionGroup[];
|
|
@@ -1444,11 +1454,13 @@ interface ConditionBuilderProps {
|
|
|
1444
1454
|
onPreview?: (groups: ConditionGroup[]) => void;
|
|
1445
1455
|
/** Live preview count to display */
|
|
1446
1456
|
previewCount?: number;
|
|
1457
|
+
/** Overrides the preview wording; defaults stay English for existing consumers. */
|
|
1458
|
+
labels?: ConditionBuilderLabels;
|
|
1447
1459
|
className?: string;
|
|
1448
1460
|
"aria-label"?: string;
|
|
1449
1461
|
}
|
|
1450
1462
|
/** Renders the condition builder component. */
|
|
1451
|
-
declare function ConditionBuilder({ groups, onChange, properties, label, addConditionLabel, addGroupLabel, addNestedGroupLabel, nested, maxDepth, conditionTypes, onPreview, previewCount, className, "aria-label": ariaLabel }: ConditionBuilderProps): React$1.JSX.Element;
|
|
1463
|
+
declare function ConditionBuilder({ groups, onChange, properties, label, addConditionLabel, addGroupLabel, addNestedGroupLabel, nested, maxDepth, conditionTypes, onPreview, previewCount, labels: customLabels, className, "aria-label": ariaLabel }: ConditionBuilderProps): React$1.JSX.Element;
|
|
1452
1464
|
declare namespace ConditionBuilder {
|
|
1453
1465
|
var displayName: string;
|
|
1454
1466
|
}
|
|
@@ -2186,6 +2198,7 @@ declare function ColorPalettePicker({ palettes, value, onValueChange, label, hid
|
|
|
2186
2198
|
//#region src/core/inline-edit.d.ts
|
|
2187
2199
|
/** Localized strings for inline editing. */
|
|
2188
2200
|
interface InlineEditLabels {
|
|
2201
|
+
input?: string;
|
|
2189
2202
|
edit?: (value: string) => string;
|
|
2190
2203
|
save?: string;
|
|
2191
2204
|
cancel?: string;
|
|
@@ -2290,4 +2303,4 @@ interface KeyPadMenuProps {
|
|
|
2290
2303
|
*/
|
|
2291
2304
|
declare function KeyPadMenu({ items, label, selection, value, onValueChange, columns, size, hideLabel, className }: KeyPadMenuProps): import("react").JSX.Element;
|
|
2292
2305
|
//#endregion
|
|
2293
|
-
export { DrawerSize as $,
|
|
2306
|
+
export { DrawerSize as $, DescriptionListLabels as $i, ToolbarButton$1 as $n, DisclosureContent$1 as $r, FormColorPicker as $t, ShaderSurfaceHandle as A, TextElement as Aa, AlertProps as Ai, FormSubmit$1 as An, DialogFooter as Ar, CheckboxGroupProps as At, ShaderPresetCategory as B, CardDescription as Bi, TagInput as Bn, SelectPopover$1 as Br, PopoverRoot$1 as Bt, Facet as C, Separator$2 as Ca, SkeletonTable as Ci, FormSelectItem as Cn, AlertDialogPanel$1 as Cr, BlockLayoutProps as Ct, FacetItem as D, HeadingProps as Da, Input as Di, FormSliderProps as Dn, DialogDescription$1 as Dr, RadioProps as Dt, FacetGroupProps as E, HeadingLevel as Ea, SwitchProps as Ei, FormSlider as En, DialogBodyProps as Er, RadioGroupProps as Et, SHADER_PRESETS as F, KbdProps as Fa, Button as Fi, FormTextarea$1 as Fn, DialogPanel$1 as Fr, DropdownSeparator as Ft, VirtualListProps as G, CardHeaderProps as Gi, ColorPicker as Gn, TabListProps$1 as Gr, ConditionDef as Gt, getShaderFragment as H, CardFooter as Hi, IconDef as Hn, SelectTrigger$1 as Hr, ConditionBuilder as Ht, SHADER_PRESET_IDS as I, ButtonProps as Ii, FormTextareaProps$1 as In, DialogRoot$1 as Ir, DropdownTrigger as It, DrawerClose as J, CardTitleProps as Ji, StarRatingProps as Jn, TabProps$1 as Jr, ConditionTypeRenderer as Jt, Pagination as K, CardProps as Ki, ColorPickerProps as Kn, TabPanel$1 as Kr, ConditionGroup as Kt, ShaderParamKey as L, Card as Li, useFieldValue as Ln, DialogSize as Lr, PopoverClose$1 as Lt, SHADER_OVERLAY_PARAM_KEYS as M, TextRole as Ma, SpinnerProps as Mi, FormSwitchProps$1 as Mn, DialogHeader as Mr, DropdownContent as Mt, SHADER_PARAM_FALLBACK as N, TextTone as Na, Badge as Ni, FormTagInput as Nn, DialogHeaderProps as Nr, DropdownItem as Nt, FacetProps as O, HeadingRole as Oa, InputProps as Oi, FormStarRating as On, DialogDisclosure$1 as Or, Checkbox as Ot, SHADER_PARAM_KEYS as P, Kbd as Pa, BadgeProps as Pi, FormTagInputProps as Pn, DialogHeading$1 as Pr, DropdownMenu as Pt, DrawerSide as Q, DescriptionListItem as Qi, NumberInputProps as Qn, TabsVariant as Qr, FormCheckbox$1 as Qt, ShaderParamSpec as R, CardContent as Ri, useFormContext as Rn, SelectItem$1 as Rr, PopoverContent$1 as Rt, ExpressionTone as S, OtpFieldProps as Sa, SkeletonProps as Si, FormSelect as Sn, ComboboxRoot$1 as Sr, BlockLayout as St, FacetGroupLabels as T, Heading as Ta, Switch as Ti, FormSelectProps as Tn, DialogBody as Tr, RadioGroup as Tt, getShaderPreset as U, CardFooterProps as Ui, IconPicker as Un, Tab$1 as Ur, ConditionBuilderLabels as Ut, ShaderPresetId as V, CardDescriptionProps as Vi, TagInputProps as Vn, SelectRoot$1 as Vr, PopoverTrigger$1 as Vt, VirtualList as W, CardHeader as Wi, IconPickerProps as Wn, TabList$1 as Wr, ConditionBuilderProps as Wt, DrawerPanelProps as X, IdentityProps as Xi, SliderProps as Xn, TabsRoot$1 as Xr, StepBuilderProps as Xt, DrawerPanel as Y, Identity as Yi, Slider as Yn, TabStatus as Yr, StepBuilder as Yt, DrawerRoot as Z, DescriptionList as Zi, NumberInput as Zn, TabsRootProps$1 as Zr, StepDef as Zt, HighlightProps as _, Toggle$1 as _a, Textarea as _i, FormRadio$1 as _n, ComboboxGroup$1 as _r, ScrollAreaProps as _t, InlineEditLabels as a, BreadcrumbItem as aa, CompositeRow as ai, FormError$1 as an, TooltipProvider as ar, PanelSize as at, ExpressionGroupProps as b, ToggleProps$1 as ba, SkeletonAvatar as bi, FormReset$1 as bn, ComboboxItem$1 as br, BlockBaseProps as bt, ColorPaletteDisplay as c, StatCardProps as ca, MeterProps as ci, FormGroupLabel$1 as cn, MenuItemCheckbox$1 as cr, ResizablePanel as ct, ColorPalettePickerProps as d, AccordionRoot$1 as da, Progress as di, FormInput$1 as dn, MenuRoot$1 as dr, ResizablePanelProps as dt, DescriptionListProps as ea, DisclosureRoot$1 as ei, FormColorPickerProps as en, ToolbarContainer$1 as er, Logo as et, PaletteKind as f, AccordionRootProps as fa, ProgressProps as fi, FormLabel$1 as fn, MenuSeparator$1 as fr, Section as ft, Highlight as g, PrimAccordionTriggerProps as ga, AvatarProps as gi, FormPush$1 as gn, ComboboxEmpty as gr, ScrollArea as gt, LiveRegionProps as h, PrimAccordionItemProps as ha, AvatarGroupProps as hi, FormProvider$1 as hn, MenubarRoot$1 as hr, ContainerProps as ht, InlineEdit as i, Breadcrumb as ia, CompositeProvider as ii, FormDescription$1 as in, TooltipAnchor$1 as ir, PanelImperativeHandle as it, ShaderSurfaceProps as j, TextProps as ja, Spinner as ji, FormSwitch$1 as jn, DialogFooterProps as jr, CheckboxProps as jt, ShaderSurface as k, Text as ka, Alert as ki, FormStarRatingProps as kn, DialogDismiss$1 as kr, CheckboxGroup as kt, ColorPaletteDisplayProps as l, AccordionContent$1 as la, CircularProgress as li, FormIconPicker as ln, MenuItemRadio$1 as lr, ResizablePanelGroup as lt, LiveRegion as m, PrimAccordionContentProps as ma, AvatarGroup as mi, FormNumberInputProps as mn, MenubarContainer$1 as mr, Container as mt, KeyPadMenu as n, EmptyStateAction as na, Composite as ni, FormDateRangePicker as nn, ToolbarSeparator$1 as nr, GroupImperativeHandle as nt, InlineEditProps as o, BreadcrumbProps as oa, CompositeZone as oi, FormField$1 as on, MenuButtonArrow$1 as or, ResizableHandle as ot, THEME_PALETTES as p, AccordionTrigger$1 as pa, Avatar as pi, FormNumberInput as pn, MenuTrigger$1 as pr, SectionProps as pt, PaginationProps as q, CardTitle as qi, StarRating as qn, TabPanelProps$1 as qr, ConditionOperator as qt, KeyPadMenuProps as r, EmptyStateProps as ra, CompositeItem as ri, FormDateRangePickerProps as rn, Tooltip$1 as rr, Layout as rt, ColorPalette as s, StatCard as sa, Meter$1 as si, FormGroup$1 as sn, MenuItem$1 as sr, ResizableHandleProps as st, KeyPadItem as t, EmptyState as ta, DisclosureTrigger$1 as ti, FormControl$1 as tn, ToolbarRoot$1 as tr, LogoProps as tt, ColorPalettePicker as u, AccordionItem$1 as ua, CircularProgressProps as ui, FormIconPickerProps as un, MenuPopover$1 as ur, ResizablePanelGroupProps as ut, Expression as v, ToggleGroup$1 as va, TextareaProps as vi, FormRadioGroup$1 as vn, ComboboxGroupLabel$1 as vr, PageHeader as vt, FacetGroup as w, SeparatorProps$1 as wa, SkeletonText as wi, FormSelectPopover as wn, AlertDialogPanelProps$1 as wr, Radio$1 as wt, ExpressionProps as x, OtpField as xa, SkeletonCard as xi, FormRoot$1 as xn, ComboboxPopover$1 as xr, createBlock as xt, ExpressionGroup as y, ToggleGroupProps$1 as ya, Skeleton as yi, FormRemove$1 as yn, ComboboxInput$1 as yr, PageHeaderProps as yt, ShaderPreset as z, CardContentProps as zi, useFormStore as zn, SelectLabel$1 as zr, PopoverContentProps$1 as zt };
|