@tensor_1/react 2.21.0 → 2.23.0
This diff represents the content of publicly available package versions that have been released to one of the supported registries. The information contained in this diff is provided for informational purposes only and reflects changes between package versions as they appear in their respective public registries.
- package/dist/components/Avatar.d.ts +1 -1
- package/dist/components/EditorIcons.d.ts +1 -0
- package/dist/components/EditorIcons.js +2 -1
- package/dist/components/TableControls.d.ts +32 -4
- package/dist/components/TableControls.js +99 -9
- package/dist/emoji.cjs +2 -1
- package/dist/index.cjs +647 -505
- package/dist/index.d.cts +33 -5
- package/dist/index.d.ts +1 -1
- package/dist/rich-text.cjs +2 -1
- package/package.json +1 -1
package/dist/index.cjs
CHANGED
|
@@ -2933,69 +2933,211 @@ function SegmentedOption({
|
|
|
2933
2933
|
|
|
2934
2934
|
// src/components/TableControls.tsx
|
|
2935
2935
|
var import_react33 = require("react");
|
|
2936
|
+
|
|
2937
|
+
// src/components/EditorIcons.tsx
|
|
2936
2938
|
var import_jsx_runtime49 = require("react/jsx-runtime");
|
|
2939
|
+
var PATHS = {
|
|
2940
|
+
heading1: "M4 12h8M4 18V6M12 18V6M17 12l3-2v8",
|
|
2941
|
+
heading2: "M4 12h8M4 18V6M12 18V6M21 18h-4c0-4 4-3 4-6 0-1.5-2-2.5-4-1",
|
|
2942
|
+
heading3: "M4 12h8M4 18V6M12 18V6M17.5 10.5c1.7-1 3.5 0 3.5 1.5a2 2 0 0 1-2 2M17 17.5c2 1.5 4 .3 4-1.5a2 2 0 0 0-2-2",
|
|
2943
|
+
bold: "M6 12h9a4 4 0 0 1 0 8H7a1 1 0 0 1-1-1V5a1 1 0 0 1 1-1h7a4 4 0 0 1 0 8",
|
|
2944
|
+
italic: "M19 4h-9M14 20H5M15 4 9 20",
|
|
2945
|
+
strike: "M16 4H9a3 3 0 0 0-2.83 4M14 12a4 4 0 0 1 0 8H6M4 12h16",
|
|
2946
|
+
code: "m16 18 6-6-6-6M8 6l-6 6 6 6",
|
|
2947
|
+
bulletList: "M3 12h.01M3 18h.01M3 6h.01M8 12h13M8 18h13M8 6h13",
|
|
2948
|
+
orderedList: "M10 12h11M10 18h11M10 6h11M4 10h2M4 6h1v4M6 18H4c0-1 2-2 2-3s-1-1.5-2-1",
|
|
2949
|
+
taskList: "m3 17 2 2 4-4M3 7l2 2 4-4M13 6h8M13 12h8M13 18h8",
|
|
2950
|
+
blockquote: "M17 6H3M21 12H8M21 18H8M3 12v6",
|
|
2951
|
+
codeBlock: "m10 9-3 3 3 3M14 15l3-3-3-3M5 3h14a2 2 0 0 1 2 2v14a2 2 0 0 1-2 2H5a2 2 0 0 1-2-2V5a2 2 0 0 1 2-2Z",
|
|
2952
|
+
horizontalRule: "M5 12h14",
|
|
2953
|
+
link: "M10 13a5 5 0 0 0 7.54.54l3-3a5 5 0 0 0-7.07-7.07l-1.72 1.71M14 11a5 5 0 0 0-7.54-.54l-3 3a5 5 0 0 0 7.07 7.07l1.71-1.71",
|
|
2954
|
+
table: "M12 3v18M5 3h14a2 2 0 0 1 2 2v14a2 2 0 0 1-2 2H5a2 2 0 0 1-2-2V5a2 2 0 0 1 2-2ZM3 9h18M3 15h18",
|
|
2955
|
+
tableAddRow: "M4 3h16a1 1 0 0 1 1 1v6a1 1 0 0 1-1 1H4a1 1 0 0 1-1-1V4a1 1 0 0 1 1-1ZM12 15v6M9 18h6",
|
|
2956
|
+
tableAddColumn: "M4 3h6a1 1 0 0 1 1 1v16a1 1 0 0 1-1 1H4a1 1 0 0 1-1-1V4a1 1 0 0 1 1-1ZM18 9v6M15 12h6",
|
|
2957
|
+
tableDeleteRow: "M4 3h16a1 1 0 0 1 1 1v6a1 1 0 0 1-1 1H4a1 1 0 0 1-1-1V4a1 1 0 0 1 1-1ZM9 18h6",
|
|
2958
|
+
tableDeleteColumn: "M4 3h6a1 1 0 0 1 1 1v16a1 1 0 0 1-1 1H4a1 1 0 0 1-1-1V4a1 1 0 0 1 1-1ZM15 12h6",
|
|
2959
|
+
trash: "M3 6h18M19 6v14c0 1-1 2-2 2H7c-1 0-2-1-2-2V6M8 6V4c0-1 1-2 2-2h4c1 0 2 1 2 2v2",
|
|
2960
|
+
image: "M5 3h14a2 2 0 0 1 2 2v14a2 2 0 0 1-2 2H5a2 2 0 0 1-2-2V5a2 2 0 0 1 2-2ZM9 7a2 2 0 1 0 0 4 2 2 0 0 0 0-4ZM21 15l-3.09-3.09a2 2 0 0 0-2.82 0L6 21",
|
|
2961
|
+
emoji: "M12 2a10 10 0 1 0 0 20 10 10 0 0 0 0-20ZM8 14s1.5 2 4 2 4-2 4-2M9 9h.01M15 9h.01",
|
|
2962
|
+
addReaction: "M22 11v1a10 10 0 1 1-9-10M8 14s1.5 2 4 2 4-2 4-2M9 9h.01M15 9h.01M16 5h6M19 2v6",
|
|
2963
|
+
undo: "M9 14 4 9l5-5M4 9h10.5a5.5 5.5 0 0 1 0 11H11",
|
|
2964
|
+
redo: "m15 14 5-5-5-5M20 9H9.5a5.5 5.5 0 0 0 0 11H13",
|
|
2965
|
+
sourceMode: "M10 12.5 8 15l2 2.5M14 12.5l2 2.5-2 2.5M14 2v4a2 2 0 0 0 2 2h4M15 2H6a2 2 0 0 0-2 2v16a2 2 0 0 0 2 2h12a2 2 0 0 0 2-2V7Z",
|
|
2966
|
+
richMode: "M14 2v4a2 2 0 0 0 2 2h4M15 2H6a2 2 0 0 0-2 2v16a2 2 0 0 0 2 2h12a2 2 0 0 0 2-2V7ZM8 13h8M8 17h5",
|
|
2967
|
+
clock: "M12 2a10 10 0 1 0 0 20 10 10 0 0 0 0-20ZM12 6v6l4 2",
|
|
2968
|
+
grip: "M9 5h.01M9 12h.01M9 19h.01M15 5h.01M15 12h.01M15 19h.01"
|
|
2969
|
+
};
|
|
2970
|
+
function EditorIcon({ name, ...props }) {
|
|
2971
|
+
return /* @__PURE__ */ (0, import_jsx_runtime49.jsx)(
|
|
2972
|
+
"svg",
|
|
2973
|
+
{
|
|
2974
|
+
viewBox: "0 0 24 24",
|
|
2975
|
+
fill: "none",
|
|
2976
|
+
stroke: "currentColor",
|
|
2977
|
+
strokeWidth: 2,
|
|
2978
|
+
strokeLinecap: "round",
|
|
2979
|
+
strokeLinejoin: "round",
|
|
2980
|
+
"aria-hidden": "true",
|
|
2981
|
+
focusable: "false",
|
|
2982
|
+
...props,
|
|
2983
|
+
children: /* @__PURE__ */ (0, import_jsx_runtime49.jsx)("path", { d: PATHS[name] })
|
|
2984
|
+
}
|
|
2985
|
+
);
|
|
2986
|
+
}
|
|
2987
|
+
|
|
2988
|
+
// src/components/TableControls.tsx
|
|
2989
|
+
var import_jsx_runtime50 = require("react/jsx-runtime");
|
|
2937
2990
|
function ViewMenu({ density, densityLabel, densityOptions, onDensityChange, zebra, freeze, columns, columnsLabel, onColumnVisibilityChange }) {
|
|
2938
2991
|
const densityLabelId = (0, import_react33.useId)();
|
|
2939
2992
|
const zebraLabelId = (0, import_react33.useId)();
|
|
2940
2993
|
const freezeLabelId = (0, import_react33.useId)();
|
|
2941
|
-
return /* @__PURE__ */ (0,
|
|
2942
|
-
/* @__PURE__ */ (0,
|
|
2943
|
-
/* @__PURE__ */ (0,
|
|
2944
|
-
/* @__PURE__ */ (0,
|
|
2994
|
+
return /* @__PURE__ */ (0, import_jsx_runtime50.jsxs)("div", { className: "uix-view-menu", children: [
|
|
2995
|
+
/* @__PURE__ */ (0, import_jsx_runtime50.jsxs)("div", { className: "uix-view-menu__group", children: [
|
|
2996
|
+
/* @__PURE__ */ (0, import_jsx_runtime50.jsx)("div", { id: densityLabelId, className: "uix-view-menu__label", children: densityLabel }),
|
|
2997
|
+
/* @__PURE__ */ (0, import_jsx_runtime50.jsx)(Segmented, { value: density, onChange: onDensityChange, "aria-labelledby": densityLabelId, children: densityOptions.map((option) => /* @__PURE__ */ (0, import_jsx_runtime50.jsx)(SegmentedOption, { value: option.value, children: option.label }, option.value)) })
|
|
2945
2998
|
] }),
|
|
2946
|
-
(zebra || freeze) && /* @__PURE__ */ (0,
|
|
2947
|
-
zebra && /* @__PURE__ */ (0,
|
|
2948
|
-
/* @__PURE__ */ (0,
|
|
2949
|
-
/* @__PURE__ */ (0,
|
|
2999
|
+
(zebra || freeze) && /* @__PURE__ */ (0, import_jsx_runtime50.jsxs)("div", { className: "uix-view-menu__group", children: [
|
|
3000
|
+
zebra && /* @__PURE__ */ (0, import_jsx_runtime50.jsxs)("div", { className: "uix-view-menu__row", children: [
|
|
3001
|
+
/* @__PURE__ */ (0, import_jsx_runtime50.jsx)("span", { id: zebraLabelId, children: zebra.label }),
|
|
3002
|
+
/* @__PURE__ */ (0, import_jsx_runtime50.jsx)(Switch, { checked: zebra.checked, "aria-labelledby": zebraLabelId, onChange: (event) => zebra.onChange(event.currentTarget.checked) })
|
|
2950
3003
|
] }),
|
|
2951
|
-
freeze && /* @__PURE__ */ (0,
|
|
2952
|
-
/* @__PURE__ */ (0,
|
|
2953
|
-
/* @__PURE__ */ (0,
|
|
3004
|
+
freeze && /* @__PURE__ */ (0, import_jsx_runtime50.jsxs)("div", { className: "uix-view-menu__row", children: [
|
|
3005
|
+
/* @__PURE__ */ (0, import_jsx_runtime50.jsx)("span", { id: freezeLabelId, children: freeze.label }),
|
|
3006
|
+
/* @__PURE__ */ (0, import_jsx_runtime50.jsx)(Switch, { checked: freeze.checked, "aria-labelledby": freezeLabelId, onChange: (event) => freeze.onChange(event.currentTarget.checked) })
|
|
2954
3007
|
] })
|
|
2955
3008
|
] }),
|
|
2956
|
-
columns && columns.length > 0 && /* @__PURE__ */ (0,
|
|
2957
|
-
columnsLabel != null && /* @__PURE__ */ (0,
|
|
2958
|
-
/* @__PURE__ */ (0,
|
|
3009
|
+
columns && columns.length > 0 && /* @__PURE__ */ (0, import_jsx_runtime50.jsxs)("div", { className: "uix-view-menu__group", children: [
|
|
3010
|
+
columnsLabel != null && /* @__PURE__ */ (0, import_jsx_runtime50.jsx)("div", { className: "uix-view-menu__label", children: columnsLabel }),
|
|
3011
|
+
/* @__PURE__ */ (0, import_jsx_runtime50.jsx)("div", { className: "uix-view-menu__cols", children: columns.map((column) => /* @__PURE__ */ (0, import_jsx_runtime50.jsx)(Checkbox, { label: column.label, checked: column.visible, disabled: column.disabled, onChange: (event) => onColumnVisibilityChange?.(column.id, event.currentTarget.checked) }, column.id)) })
|
|
2959
3012
|
] })
|
|
2960
3013
|
] });
|
|
2961
3014
|
}
|
|
2962
3015
|
function FilterPopover({ label, type = "text", value, onValueChange, options, applyLabel, clearLabel, onApply, onClear, placeholder }) {
|
|
2963
|
-
return /* @__PURE__ */ (0,
|
|
2964
|
-
/* @__PURE__ */ (0,
|
|
2965
|
-
/* @__PURE__ */ (0,
|
|
2966
|
-
type === "select" || type === "enum" || type === "boolean" ? /* @__PURE__ */ (0,
|
|
3016
|
+
return /* @__PURE__ */ (0, import_jsx_runtime50.jsxs)("div", { className: "uix-filter-popover", children: [
|
|
3017
|
+
/* @__PURE__ */ (0, import_jsx_runtime50.jsxs)("label", { className: "uix-label", children: [
|
|
3018
|
+
/* @__PURE__ */ (0, import_jsx_runtime50.jsx)("span", { children: label }),
|
|
3019
|
+
type === "select" || type === "enum" || type === "boolean" ? /* @__PURE__ */ (0, import_jsx_runtime50.jsx)("select", { className: "uix-select", value, onChange: (event) => onValueChange(event.currentTarget.value), children: options?.map((option) => /* @__PURE__ */ (0, import_jsx_runtime50.jsx)("option", { value: option.value, children: option.label }, option.value)) }) : /* @__PURE__ */ (0, import_jsx_runtime50.jsx)(Input, { type, value, placeholder, onChange: (event) => onValueChange(event.currentTarget.value) })
|
|
2967
3020
|
] }),
|
|
2968
|
-
/* @__PURE__ */ (0,
|
|
2969
|
-
/* @__PURE__ */ (0,
|
|
2970
|
-
/* @__PURE__ */ (0,
|
|
3021
|
+
/* @__PURE__ */ (0, import_jsx_runtime50.jsxs)("div", { className: "uix-filter-popover__actions", children: [
|
|
3022
|
+
/* @__PURE__ */ (0, import_jsx_runtime50.jsx)(Button, { type: "button", onClick: onClear, children: clearLabel }),
|
|
3023
|
+
/* @__PURE__ */ (0, import_jsx_runtime50.jsx)(Button, { type: "button", variant: "primary", onClick: onApply, children: applyLabel })
|
|
2971
3024
|
] })
|
|
2972
3025
|
] });
|
|
2973
3026
|
}
|
|
2974
|
-
|
|
2975
|
-
|
|
2976
|
-
|
|
2977
|
-
|
|
2978
|
-
|
|
2979
|
-
|
|
2980
|
-
|
|
2981
|
-
|
|
2982
|
-
|
|
3027
|
+
var sameOrder = (a, b) => a.length === b.length && a.every((id, i) => id === b[i]);
|
|
3028
|
+
function placeId(ids, id, index) {
|
|
3029
|
+
const from = ids.indexOf(id);
|
|
3030
|
+
const to = Math.max(0, Math.min(index, ids.length - 1));
|
|
3031
|
+
if (from < 0 || from === to) return ids;
|
|
3032
|
+
const next = ids.filter((other) => other !== id);
|
|
3033
|
+
next.splice(to, 0, id);
|
|
3034
|
+
return next;
|
|
3035
|
+
}
|
|
3036
|
+
function SavedViewMenu({ items, sections, onSelect, onPinChange, pinLabel, unpinLabel, onReorder, reorderLabel, emptyLabel, actions, footer }) {
|
|
3037
|
+
const baseId = (0, import_react33.useId)();
|
|
3038
|
+
const groups = sections ?? [{ id: void 0, items: items ?? [] }];
|
|
3039
|
+
const [draft, setDraft] = (0, import_react33.useState)(null);
|
|
3040
|
+
const [dragging, setDragging] = (0, import_react33.useState)(null);
|
|
3041
|
+
const dragStart = (0, import_react33.useRef)(null);
|
|
3042
|
+
const orderKey = JSON.stringify(groups.map((group) => [group.id, group.items.map((item) => item.id)]));
|
|
3043
|
+
(0, import_react33.useEffect)(() => setDraft(null), [orderKey]);
|
|
3044
|
+
const orderOf = (group) => draft && draft.group === group.id ? draft.ids : group.items.map((item) => item.id);
|
|
3045
|
+
const move = (group, id, delta) => {
|
|
3046
|
+
const current = orderOf(group);
|
|
3047
|
+
const next = placeId(current, id, current.indexOf(id) + delta);
|
|
3048
|
+
if (next === current) return;
|
|
3049
|
+
setDraft({ group: group.id, ids: next });
|
|
3050
|
+
onReorder?.([...next], group.id);
|
|
3051
|
+
};
|
|
3052
|
+
const dragOver = (event, group, id) => {
|
|
3053
|
+
if (dragging !== id) return;
|
|
3054
|
+
const rows = Array.from(event.currentTarget.closest("ul")?.querySelectorAll(":scope > .uix-saved-views__row") ?? []);
|
|
3055
|
+
let index = rows.length - 1;
|
|
3056
|
+
for (let i = 0; i < rows.length; i++) {
|
|
3057
|
+
const box = rows[i].getBoundingClientRect();
|
|
3058
|
+
if (event.clientY < box.top + box.height / 2) {
|
|
3059
|
+
index = i;
|
|
3060
|
+
break;
|
|
3061
|
+
}
|
|
3062
|
+
}
|
|
3063
|
+
const current = orderOf(group);
|
|
3064
|
+
const next = placeId(current, id, index);
|
|
3065
|
+
if (next !== current) setDraft({ group: group.id, ids: next });
|
|
3066
|
+
};
|
|
3067
|
+
const drop = (group, id) => {
|
|
3068
|
+
if (dragging !== id) return;
|
|
3069
|
+
setDragging(null);
|
|
3070
|
+
const start = dragStart.current;
|
|
3071
|
+
dragStart.current = null;
|
|
3072
|
+
const end = orderOf(group);
|
|
3073
|
+
if (start && !sameOrder(start, end)) onReorder?.([...end], group.id);
|
|
3074
|
+
};
|
|
3075
|
+
const visible = groups.filter((group) => group.items.length > 0);
|
|
3076
|
+
const renderRows = (group, groupIndex) => {
|
|
3077
|
+
const byId = new Map(group.items.map((item) => [item.id, item]));
|
|
3078
|
+
return orderOf(group).map((id, index) => {
|
|
3079
|
+
const item = byId.get(id);
|
|
3080
|
+
if (!item) return null;
|
|
3081
|
+
const nameId = `${baseId}-${groupIndex}-${index}`;
|
|
3082
|
+
const extra = actions?.(item);
|
|
3083
|
+
return /* @__PURE__ */ (0, import_jsx_runtime50.jsxs)("li", { className: "uix-saved-views__row", "data-active": item.active || void 0, "data-dragging": dragging === item.id || void 0, children: [
|
|
3084
|
+
onReorder && /* @__PURE__ */ (0, import_jsx_runtime50.jsx)(
|
|
3085
|
+
"button",
|
|
3086
|
+
{
|
|
3087
|
+
type: "button",
|
|
3088
|
+
className: "uix-saved-views__grip",
|
|
3089
|
+
"aria-label": reorderLabel,
|
|
3090
|
+
"aria-describedby": nameId,
|
|
3091
|
+
onPointerDown: (event) => {
|
|
3092
|
+
if (event.button !== 0) return;
|
|
3093
|
+
event.preventDefault();
|
|
3094
|
+
event.currentTarget.setPointerCapture?.(event.pointerId);
|
|
3095
|
+
dragStart.current = orderOf(group);
|
|
3096
|
+
setDragging(item.id);
|
|
3097
|
+
},
|
|
3098
|
+
onPointerMove: (event) => dragOver(event, group, item.id),
|
|
3099
|
+
onPointerUp: () => drop(group, item.id),
|
|
3100
|
+
onPointerCancel: () => drop(group, item.id),
|
|
3101
|
+
onKeyDown: (event) => {
|
|
3102
|
+
if (event.key !== "ArrowUp" && event.key !== "ArrowDown") return;
|
|
3103
|
+
event.preventDefault();
|
|
3104
|
+
move(group, item.id, event.key === "ArrowUp" ? -1 : 1);
|
|
3105
|
+
},
|
|
3106
|
+
children: /* @__PURE__ */ (0, import_jsx_runtime50.jsx)(EditorIcon, { name: "grip" })
|
|
3107
|
+
}
|
|
3108
|
+
),
|
|
3109
|
+
/* @__PURE__ */ (0, import_jsx_runtime50.jsx)("button", { type: "button", id: nameId, className: "uix-menu__item", "data-active": item.active || void 0, "aria-current": item.active || void 0, title: typeof item.label === "string" ? item.label : void 0, onClick: () => onSelect(item.id), children: /* @__PURE__ */ (0, import_jsx_runtime50.jsx)("span", { className: "uix-saved-views__name", children: item.label }) }),
|
|
3110
|
+
onPinChange && /* @__PURE__ */ (0, import_jsx_runtime50.jsx)("button", { type: "button", className: "uix-saved-views__pin", "aria-label": item.pinned ? unpinLabel : pinLabel, "data-on": item.pinned || void 0, onClick: () => onPinChange(item.id, !item.pinned), children: "\u2605" }),
|
|
3111
|
+
extra != null && extra !== false && /* @__PURE__ */ (0, import_jsx_runtime50.jsx)("span", { className: "uix-saved-views__actions", children: extra })
|
|
3112
|
+
] }, item.id);
|
|
3113
|
+
});
|
|
3114
|
+
};
|
|
3115
|
+
return /* @__PURE__ */ (0, import_jsx_runtime50.jsxs)("ul", { className: "uix-menu uix-saved-views", "data-dragging": dragging ? "" : void 0, children: [
|
|
3116
|
+
visible.length === 0 && emptyLabel != null && /* @__PURE__ */ (0, import_jsx_runtime50.jsx)("li", { className: "uix-menu__label", children: emptyLabel }),
|
|
3117
|
+
sections ? visible.map((group, groupIndex) => {
|
|
3118
|
+
const labelId = `${baseId}-section-${groupIndex}`;
|
|
3119
|
+
return /* @__PURE__ */ (0, import_jsx_runtime50.jsxs)("li", { className: "uix-saved-views__section", children: [
|
|
3120
|
+
/* @__PURE__ */ (0, import_jsx_runtime50.jsx)("div", { id: labelId, className: "uix-menu__label uix-saved-views__section-label", children: group.label }),
|
|
3121
|
+
/* @__PURE__ */ (0, import_jsx_runtime50.jsx)("ul", { className: "uix-saved-views__group", "aria-labelledby": labelId, children: renderRows(group, groupIndex) })
|
|
3122
|
+
] }, group.id);
|
|
3123
|
+
}) : visible[0] && renderRows(visible[0], 0),
|
|
3124
|
+
footer != null && /* @__PURE__ */ (0, import_jsx_runtime50.jsx)("li", { className: "uix-saved-views__footer", children: footer })
|
|
2983
3125
|
] });
|
|
2984
3126
|
}
|
|
2985
3127
|
|
|
2986
3128
|
// src/components/Timeline.tsx
|
|
2987
|
-
var
|
|
3129
|
+
var import_jsx_runtime51 = require("react/jsx-runtime");
|
|
2988
3130
|
function Timeline({ children, className, ...props }) {
|
|
2989
|
-
return /* @__PURE__ */ (0,
|
|
3131
|
+
return /* @__PURE__ */ (0, import_jsx_runtime51.jsx)("ol", { className: cx("uix-timeline", className), ...props, children });
|
|
2990
3132
|
}
|
|
2991
3133
|
function TimelineItem({ node, meta, children, className, ...props }) {
|
|
2992
|
-
return /* @__PURE__ */ (0,
|
|
2993
|
-
/* @__PURE__ */ (0,
|
|
2994
|
-
node ?? /* @__PURE__ */ (0,
|
|
2995
|
-
/* @__PURE__ */ (0,
|
|
3134
|
+
return /* @__PURE__ */ (0, import_jsx_runtime51.jsxs)("li", { className: cx("uix-timeline__item", className), ...props, children: [
|
|
3135
|
+
/* @__PURE__ */ (0, import_jsx_runtime51.jsxs)("div", { className: "uix-timeline__rail", "aria-hidden": "true", children: [
|
|
3136
|
+
node ?? /* @__PURE__ */ (0, import_jsx_runtime51.jsx)("span", { className: "uix-timeline__node" }),
|
|
3137
|
+
/* @__PURE__ */ (0, import_jsx_runtime51.jsx)("span", { className: "uix-timeline__line" })
|
|
2996
3138
|
] }),
|
|
2997
|
-
/* @__PURE__ */ (0,
|
|
2998
|
-
meta != null && /* @__PURE__ */ (0,
|
|
3139
|
+
/* @__PURE__ */ (0, import_jsx_runtime51.jsxs)("div", { className: "uix-timeline__body", children: [
|
|
3140
|
+
meta != null && /* @__PURE__ */ (0, import_jsx_runtime51.jsx)("div", { className: "uix-timeline__meta", children: meta }),
|
|
2999
3141
|
children
|
|
3000
3142
|
] })
|
|
3001
3143
|
] });
|
|
@@ -3003,10 +3145,10 @@ function TimelineItem({ node, meta, children, className, ...props }) {
|
|
|
3003
3145
|
|
|
3004
3146
|
// src/components/Pipeline.tsx
|
|
3005
3147
|
var import_react34 = require("react");
|
|
3006
|
-
var
|
|
3148
|
+
var import_jsx_runtime52 = require("react/jsx-runtime");
|
|
3007
3149
|
function Pipeline({ detailed = false, children, className, tabIndex, ...props }) {
|
|
3008
3150
|
const stages = detailed ? import_react34.Children.map(children, (child) => (0, import_react34.isValidElement)(child) && child.type === PipelineStage ? (0, import_react34.cloneElement)(child, { detailed: child.props.detailed ?? true }) : child) : children;
|
|
3009
|
-
return /* @__PURE__ */ (0,
|
|
3151
|
+
return /* @__PURE__ */ (0, import_jsx_runtime52.jsx)(
|
|
3010
3152
|
"ol",
|
|
3011
3153
|
{
|
|
3012
3154
|
className: cx("uix-pipeline", detailed && "uix-pipeline--detailed", className),
|
|
@@ -3043,20 +3185,20 @@ function PipelineStage({
|
|
|
3043
3185
|
const current = currentProp ?? (state === "active" || state === "current" || state === "running");
|
|
3044
3186
|
const resolvedStateLabel = stateLabel ?? DEFAULT_STATE_LABELS[state];
|
|
3045
3187
|
const showDetails = detailed || description != null || meta != null || marker != null;
|
|
3046
|
-
return /* @__PURE__ */ (0,
|
|
3188
|
+
return /* @__PURE__ */ (0, import_jsx_runtime52.jsx)(
|
|
3047
3189
|
"li",
|
|
3048
3190
|
{
|
|
3049
3191
|
className: cx("uix-pipeline__stage", className),
|
|
3050
3192
|
"data-state": state,
|
|
3051
3193
|
"aria-current": current ? "step" : void 0,
|
|
3052
3194
|
...props,
|
|
3053
|
-
children: showDetails ? /* @__PURE__ */ (0,
|
|
3054
|
-
/* @__PURE__ */ (0,
|
|
3055
|
-
/* @__PURE__ */ (0,
|
|
3056
|
-
/* @__PURE__ */ (0,
|
|
3057
|
-
/* @__PURE__ */ (0,
|
|
3058
|
-
description != null && /* @__PURE__ */ (0,
|
|
3059
|
-
meta != null && /* @__PURE__ */ (0,
|
|
3195
|
+
children: showDetails ? /* @__PURE__ */ (0, import_jsx_runtime52.jsxs)(import_jsx_runtime52.Fragment, { children: [
|
|
3196
|
+
/* @__PURE__ */ (0, import_jsx_runtime52.jsx)("span", { className: "uix-pipeline__marker", "aria-hidden": "true", children: marker }),
|
|
3197
|
+
/* @__PURE__ */ (0, import_jsx_runtime52.jsxs)("div", { className: "uix-pipeline__content", children: [
|
|
3198
|
+
/* @__PURE__ */ (0, import_jsx_runtime52.jsx)("div", { className: "uix-pipeline__eyebrow", children: /* @__PURE__ */ (0, import_jsx_runtime52.jsx)("span", { className: "uix-pipeline__state", children: resolvedStateLabel }) }),
|
|
3199
|
+
/* @__PURE__ */ (0, import_jsx_runtime52.jsx)("div", { className: "uix-pipeline__title", children: label }),
|
|
3200
|
+
description != null && /* @__PURE__ */ (0, import_jsx_runtime52.jsx)("div", { className: "uix-pipeline__description", children: description }),
|
|
3201
|
+
meta != null && /* @__PURE__ */ (0, import_jsx_runtime52.jsx)("div", { className: "uix-pipeline__meta", children: meta })
|
|
3060
3202
|
] })
|
|
3061
3203
|
] }) : label
|
|
3062
3204
|
}
|
|
@@ -3064,9 +3206,9 @@ function PipelineStage({
|
|
|
3064
3206
|
}
|
|
3065
3207
|
|
|
3066
3208
|
// src/components/Flow.tsx
|
|
3067
|
-
var
|
|
3209
|
+
var import_jsx_runtime53 = require("react/jsx-runtime");
|
|
3068
3210
|
function Flow({ variant = "linear", panel = false, children, className, role = "group", ...props }) {
|
|
3069
|
-
return /* @__PURE__ */ (0,
|
|
3211
|
+
return /* @__PURE__ */ (0, import_jsx_runtime53.jsx)(
|
|
3070
3212
|
"div",
|
|
3071
3213
|
{
|
|
3072
3214
|
className: cx("uix-flow", `uix-flow--${variant}`, panel && "uix-flow--panel", className),
|
|
@@ -3096,33 +3238,33 @@ function FlowNode({
|
|
|
3096
3238
|
...props
|
|
3097
3239
|
}) {
|
|
3098
3240
|
const resolvedStateLabel = stateLabel ?? FLOW_STATE_LABELS[state];
|
|
3099
|
-
return /* @__PURE__ */ (0,
|
|
3100
|
-
icon != null && /* @__PURE__ */ (0,
|
|
3101
|
-
/* @__PURE__ */ (0,
|
|
3102
|
-
eyebrow != null && /* @__PURE__ */ (0,
|
|
3103
|
-
/* @__PURE__ */ (0,
|
|
3104
|
-
meta != null && /* @__PURE__ */ (0,
|
|
3105
|
-
/* @__PURE__ */ (0,
|
|
3241
|
+
return /* @__PURE__ */ (0, import_jsx_runtime53.jsxs)("div", { className: cx("uix-node", `uix-node--${state}`, icon == null && "uix-node--no-icon", wide && "uix-node--wide", className), ...props, children: [
|
|
3242
|
+
icon != null && /* @__PURE__ */ (0, import_jsx_runtime53.jsx)("span", { className: "uix-node__icon", "aria-hidden": "true", children: icon }),
|
|
3243
|
+
/* @__PURE__ */ (0, import_jsx_runtime53.jsxs)("div", { className: "uix-node__body", children: [
|
|
3244
|
+
eyebrow != null && /* @__PURE__ */ (0, import_jsx_runtime53.jsx)("div", { className: "uix-node__eyebrow", children: eyebrow }),
|
|
3245
|
+
/* @__PURE__ */ (0, import_jsx_runtime53.jsx)("div", { className: "uix-node__title", children: title }),
|
|
3246
|
+
meta != null && /* @__PURE__ */ (0, import_jsx_runtime53.jsx)("div", { className: "uix-node__meta", children: meta }),
|
|
3247
|
+
/* @__PURE__ */ (0, import_jsx_runtime53.jsx)("div", { className: "uix-node__status", children: resolvedStateLabel })
|
|
3106
3248
|
] }),
|
|
3107
|
-
footer != null && /* @__PURE__ */ (0,
|
|
3249
|
+
footer != null && /* @__PURE__ */ (0, import_jsx_runtime53.jsx)("div", { className: "uix-node__footer", children: footer })
|
|
3108
3250
|
] });
|
|
3109
3251
|
}
|
|
3110
3252
|
|
|
3111
3253
|
// src/components/Prose.tsx
|
|
3112
|
-
var
|
|
3254
|
+
var import_jsx_runtime54 = require("react/jsx-runtime");
|
|
3113
3255
|
function Prose({ children, className, ...props }) {
|
|
3114
|
-
return /* @__PURE__ */ (0,
|
|
3256
|
+
return /* @__PURE__ */ (0, import_jsx_runtime54.jsx)("div", { className: cx("uix-prose", className), ...props, children });
|
|
3115
3257
|
}
|
|
3116
3258
|
function Note({ tone, icon, children, className, ...props }) {
|
|
3117
|
-
return /* @__PURE__ */ (0,
|
|
3118
|
-
icon != null && /* @__PURE__ */ (0,
|
|
3119
|
-
/* @__PURE__ */ (0,
|
|
3259
|
+
return /* @__PURE__ */ (0, import_jsx_runtime54.jsxs)("div", { className: cx("uix-note", tone && `uix-note--${tone}`, className), ...props, children: [
|
|
3260
|
+
icon != null && /* @__PURE__ */ (0, import_jsx_runtime54.jsx)("div", { className: "uix-note__icon", children: icon }),
|
|
3261
|
+
/* @__PURE__ */ (0, import_jsx_runtime54.jsx)("div", { className: "uix-note__body", children })
|
|
3120
3262
|
] });
|
|
3121
3263
|
}
|
|
3122
3264
|
|
|
3123
3265
|
// src/components/Popover.tsx
|
|
3124
3266
|
var import_react35 = require("react");
|
|
3125
|
-
var
|
|
3267
|
+
var import_jsx_runtime55 = require("react/jsx-runtime");
|
|
3126
3268
|
function Popover({
|
|
3127
3269
|
popover = "auto",
|
|
3128
3270
|
anchor,
|
|
@@ -3151,12 +3293,12 @@ function Popover({
|
|
|
3151
3293
|
el.addEventListener("toggle", sync);
|
|
3152
3294
|
return () => el.removeEventListener("toggle", sync);
|
|
3153
3295
|
}, [anchor, reposition]);
|
|
3154
|
-
return /* @__PURE__ */ (0,
|
|
3296
|
+
return /* @__PURE__ */ (0, import_jsx_runtime55.jsx)("div", { ref, className: cx("uix-popover", className), ...popoverAttr, ...props, children });
|
|
3155
3297
|
}
|
|
3156
3298
|
|
|
3157
3299
|
// src/components/CommandPalette.tsx
|
|
3158
3300
|
var import_react36 = require("react");
|
|
3159
|
-
var
|
|
3301
|
+
var import_jsx_runtime56 = require("react/jsx-runtime");
|
|
3160
3302
|
var CmdkContext = (0, import_react36.createContext)(null);
|
|
3161
3303
|
function CommandPalette({ inputProps, children, inputLabel = "Command palette", className, ...props }) {
|
|
3162
3304
|
const listId = (0, import_react36.useId)();
|
|
@@ -3175,8 +3317,8 @@ function CommandPalette({ inputProps, children, inputLabel = "Command palette",
|
|
|
3175
3317
|
return () => clearTimeout(t);
|
|
3176
3318
|
}, [count]);
|
|
3177
3319
|
const ctx = (0, import_react36.useMemo)(() => ({ listId, setActive, registerItem }), [listId, setActive, registerItem]);
|
|
3178
|
-
return /* @__PURE__ */ (0,
|
|
3179
|
-
/* @__PURE__ */ (0,
|
|
3320
|
+
return /* @__PURE__ */ (0, import_jsx_runtime56.jsx)(CmdkContext.Provider, { value: ctx, children: /* @__PURE__ */ (0, import_jsx_runtime56.jsxs)("div", { className: cx("uix-cmdk", className), ...props, children: [
|
|
3321
|
+
/* @__PURE__ */ (0, import_jsx_runtime56.jsx)(
|
|
3180
3322
|
"input",
|
|
3181
3323
|
{
|
|
3182
3324
|
className: "uix-cmdk__input",
|
|
@@ -3189,14 +3331,14 @@ function CommandPalette({ inputProps, children, inputLabel = "Command palette",
|
|
|
3189
3331
|
...inputProps
|
|
3190
3332
|
}
|
|
3191
3333
|
),
|
|
3192
|
-
/* @__PURE__ */ (0,
|
|
3193
|
-
/* @__PURE__ */ (0,
|
|
3334
|
+
/* @__PURE__ */ (0, import_jsx_runtime56.jsx)("div", { className: "uix-cmdk__list", role: "listbox", id: listId, children }),
|
|
3335
|
+
/* @__PURE__ */ (0, import_jsx_runtime56.jsx)("span", { className: "uix-visually-hidden", role: "status", children: announced })
|
|
3194
3336
|
] }) });
|
|
3195
3337
|
}
|
|
3196
3338
|
function CommandGroup({ label, children }) {
|
|
3197
3339
|
const labelId = (0, import_react36.useId)();
|
|
3198
|
-
return /* @__PURE__ */ (0,
|
|
3199
|
-
label != null && /* @__PURE__ */ (0,
|
|
3340
|
+
return /* @__PURE__ */ (0, import_jsx_runtime56.jsxs)("div", { role: "group", "aria-labelledby": label != null ? labelId : void 0, children: [
|
|
3341
|
+
label != null && /* @__PURE__ */ (0, import_jsx_runtime56.jsx)("div", { className: "uix-cmdk__group", id: labelId, children: label }),
|
|
3200
3342
|
children
|
|
3201
3343
|
] });
|
|
3202
3344
|
}
|
|
@@ -3210,7 +3352,7 @@ function CommandItem({ icon, shortcut, active, children, className, id, ...props
|
|
|
3210
3352
|
ctx.setActive(itemId, true);
|
|
3211
3353
|
return () => ctx.setActive(itemId, false);
|
|
3212
3354
|
}, [ctx, itemId, active]);
|
|
3213
|
-
return /* @__PURE__ */ (0,
|
|
3355
|
+
return /* @__PURE__ */ (0, import_jsx_runtime56.jsxs)(
|
|
3214
3356
|
"div",
|
|
3215
3357
|
{
|
|
3216
3358
|
className: cx("uix-cmdk__item", className),
|
|
@@ -3221,7 +3363,7 @@ function CommandItem({ icon, shortcut, active, children, className, id, ...props
|
|
|
3221
3363
|
...props,
|
|
3222
3364
|
children: [
|
|
3223
3365
|
icon,
|
|
3224
|
-
/* @__PURE__ */ (0,
|
|
3366
|
+
/* @__PURE__ */ (0, import_jsx_runtime56.jsx)("span", { children }),
|
|
3225
3367
|
shortcut
|
|
3226
3368
|
]
|
|
3227
3369
|
}
|
|
@@ -3230,9 +3372,9 @@ function CommandItem({ icon, shortcut, active, children, className, id, ...props
|
|
|
3230
3372
|
|
|
3231
3373
|
// src/components/Inbox.tsx
|
|
3232
3374
|
var import_react37 = require("react");
|
|
3233
|
-
var
|
|
3375
|
+
var import_jsx_runtime57 = require("react/jsx-runtime");
|
|
3234
3376
|
function Inbox({ view, children, className, ...props }) {
|
|
3235
|
-
return /* @__PURE__ */ (0,
|
|
3377
|
+
return /* @__PURE__ */ (0, import_jsx_runtime57.jsx)("div", { className: cx("uix-inbox", className), "data-view": view, ...props, children });
|
|
3236
3378
|
}
|
|
3237
3379
|
var InboxListCtx = (0, import_react37.createContext)({});
|
|
3238
3380
|
function InboxList({ children, listLabel = "Inbox", className, ...props }) {
|
|
@@ -3273,7 +3415,7 @@ function InboxList({ children, listLabel = "Inbox", className, ...props }) {
|
|
|
3273
3415
|
setActiveId(el.id);
|
|
3274
3416
|
el.scrollIntoView({ block: "nearest" });
|
|
3275
3417
|
};
|
|
3276
|
-
return /* @__PURE__ */ (0,
|
|
3418
|
+
return /* @__PURE__ */ (0, import_jsx_runtime57.jsx)(InboxListCtx.Provider, { value: ctx, children: /* @__PURE__ */ (0, import_jsx_runtime57.jsx)(
|
|
3277
3419
|
"div",
|
|
3278
3420
|
{
|
|
3279
3421
|
ref: listRef,
|
|
@@ -3302,7 +3444,7 @@ function InboxItem({
|
|
|
3302
3444
|
const autoId = (0, import_react37.useId)();
|
|
3303
3445
|
const itemId = id ?? autoId;
|
|
3304
3446
|
const { activeId } = (0, import_react37.useContext)(InboxListCtx);
|
|
3305
|
-
return /* @__PURE__ */ (0,
|
|
3447
|
+
return /* @__PURE__ */ (0, import_jsx_runtime57.jsxs)(
|
|
3306
3448
|
"div",
|
|
3307
3449
|
{
|
|
3308
3450
|
role: "option",
|
|
@@ -3314,35 +3456,35 @@ function InboxItem({
|
|
|
3314
3456
|
...props,
|
|
3315
3457
|
children: [
|
|
3316
3458
|
leading,
|
|
3317
|
-
subject != null && /* @__PURE__ */ (0,
|
|
3318
|
-
preview != null && /* @__PURE__ */ (0,
|
|
3459
|
+
subject != null && /* @__PURE__ */ (0, import_jsx_runtime57.jsx)("div", { className: "uix-inbox__subject", children: subject }),
|
|
3460
|
+
preview != null && /* @__PURE__ */ (0, import_jsx_runtime57.jsx)("div", { className: "uix-inbox__preview", children: preview }),
|
|
3319
3461
|
children
|
|
3320
3462
|
]
|
|
3321
3463
|
}
|
|
3322
3464
|
);
|
|
3323
3465
|
}
|
|
3324
3466
|
function InboxDetail({ children, className, ...props }) {
|
|
3325
|
-
return /* @__PURE__ */ (0,
|
|
3467
|
+
return /* @__PURE__ */ (0, import_jsx_runtime57.jsx)("div", { className: cx("uix-inbox__detail", className), ...props, children });
|
|
3326
3468
|
}
|
|
3327
3469
|
|
|
3328
3470
|
// src/components/Kanban.tsx
|
|
3329
3471
|
var import_react38 = require("react");
|
|
3330
|
-
var
|
|
3472
|
+
var import_jsx_runtime58 = require("react/jsx-runtime");
|
|
3331
3473
|
function Kanban({ announcement, children, className, ...props }) {
|
|
3332
|
-
return /* @__PURE__ */ (0,
|
|
3333
|
-
announcement != null && /* @__PURE__ */ (0,
|
|
3474
|
+
return /* @__PURE__ */ (0, import_jsx_runtime58.jsxs)("div", { className: cx("uix-kanban", className), ...props, children: [
|
|
3475
|
+
announcement != null && /* @__PURE__ */ (0, import_jsx_runtime58.jsx)("div", { role: "status", className: "uix-visually-hidden", children: announcement }),
|
|
3334
3476
|
children
|
|
3335
3477
|
] });
|
|
3336
3478
|
}
|
|
3337
3479
|
function KanbanColumn({ title, count, children, className, ...props }) {
|
|
3338
3480
|
const headId = (0, import_react38.useId)();
|
|
3339
3481
|
const hasHead = title != null || count != null;
|
|
3340
|
-
return /* @__PURE__ */ (0,
|
|
3341
|
-
hasHead && /* @__PURE__ */ (0,
|
|
3482
|
+
return /* @__PURE__ */ (0, import_jsx_runtime58.jsxs)("div", { className: cx("uix-kanban__col", className), ...props, children: [
|
|
3483
|
+
hasHead && /* @__PURE__ */ (0, import_jsx_runtime58.jsxs)("div", { className: "uix-kanban__head", id: headId, children: [
|
|
3342
3484
|
title,
|
|
3343
|
-
count != null && /* @__PURE__ */ (0,
|
|
3485
|
+
count != null && /* @__PURE__ */ (0, import_jsx_runtime58.jsx)("span", { className: "uix-kanban__count", children: count })
|
|
3344
3486
|
] }),
|
|
3345
|
-
/* @__PURE__ */ (0,
|
|
3487
|
+
/* @__PURE__ */ (0, import_jsx_runtime58.jsx)("div", { className: "uix-kanban__body", role: "list", "aria-labelledby": hasHead ? headId : void 0, children })
|
|
3346
3488
|
] });
|
|
3347
3489
|
}
|
|
3348
3490
|
var MOVE_KEYS = {
|
|
@@ -3361,7 +3503,7 @@ function KanbanCard({ title, meta, children, className, onMove, onKeyDown, ...pr
|
|
|
3361
3503
|
onMove(dir);
|
|
3362
3504
|
}
|
|
3363
3505
|
};
|
|
3364
|
-
return /* @__PURE__ */ (0,
|
|
3506
|
+
return /* @__PURE__ */ (0, import_jsx_runtime58.jsxs)(
|
|
3365
3507
|
"div",
|
|
3366
3508
|
{
|
|
3367
3509
|
role: "listitem",
|
|
@@ -3370,8 +3512,8 @@ function KanbanCard({ title, meta, children, className, onMove, onKeyDown, ...pr
|
|
|
3370
3512
|
onKeyDown: handleKeyDown,
|
|
3371
3513
|
...props,
|
|
3372
3514
|
children: [
|
|
3373
|
-
title && /* @__PURE__ */ (0,
|
|
3374
|
-
meta && /* @__PURE__ */ (0,
|
|
3515
|
+
title && /* @__PURE__ */ (0, import_jsx_runtime58.jsx)("div", { className: "uix-kanban__card-title", children: title }),
|
|
3516
|
+
meta && /* @__PURE__ */ (0, import_jsx_runtime58.jsx)("div", { className: "uix-kanban__card-meta", children: meta }),
|
|
3375
3517
|
children
|
|
3376
3518
|
]
|
|
3377
3519
|
}
|
|
@@ -3437,12 +3579,12 @@ function treeNav(flat, currentId, key) {
|
|
|
3437
3579
|
}
|
|
3438
3580
|
|
|
3439
3581
|
// src/components/Tree.tsx
|
|
3440
|
-
var
|
|
3441
|
-
var ChevronIcon2 = () => /* @__PURE__ */ (0,
|
|
3582
|
+
var import_jsx_runtime59 = require("react/jsx-runtime");
|
|
3583
|
+
var ChevronIcon2 = () => /* @__PURE__ */ (0, import_jsx_runtime59.jsx)("svg", { viewBox: "0 0 12 12", fill: "none", stroke: "currentColor", strokeWidth: 1.5, strokeLinecap: "round", strokeLinejoin: "round", "aria-hidden": "true", children: /* @__PURE__ */ (0, import_jsx_runtime59.jsx)("path", { d: "M2 4l4 4 4-4" }) });
|
|
3442
3584
|
function TreeNode({ node, expanded, selected, selectable, tabbableId, onToggle, onSelect, onFocusNode, level = 1, rowToggles = true }) {
|
|
3443
3585
|
const hasChildren = Array.isArray(node.children) && node.children.length > 0;
|
|
3444
3586
|
const isExpanded = expanded.has(node.id);
|
|
3445
|
-
return /* @__PURE__ */ (0,
|
|
3587
|
+
return /* @__PURE__ */ (0, import_jsx_runtime59.jsxs)(
|
|
3446
3588
|
"li",
|
|
3447
3589
|
{
|
|
3448
3590
|
role: "treeitem",
|
|
@@ -3462,12 +3604,12 @@ function TreeNode({ node, expanded, selected, selectable, tabbableId, onToggle,
|
|
|
3462
3604
|
onFocusNode(node.id);
|
|
3463
3605
|
},
|
|
3464
3606
|
children: [
|
|
3465
|
-
/* @__PURE__ */ (0,
|
|
3607
|
+
/* @__PURE__ */ (0, import_jsx_runtime59.jsxs)("span", { className: "uix-tree__row", children: [
|
|
3466
3608
|
hasChildren ? (
|
|
3467
3609
|
// TENSOR RX-125 (UIX-09): the chevron is its own pointer target, so a
|
|
3468
3610
|
// branch can be expanded without selecting it. Keyboard users toggle with
|
|
3469
3611
|
// the arrow keys on the treeitem, so it stays out of the tab order.
|
|
3470
|
-
/* @__PURE__ */ (0,
|
|
3612
|
+
/* @__PURE__ */ (0, import_jsx_runtime59.jsx)(
|
|
3471
3613
|
"button",
|
|
3472
3614
|
{
|
|
3473
3615
|
type: "button",
|
|
@@ -3479,14 +3621,14 @@ function TreeNode({ node, expanded, selected, selectable, tabbableId, onToggle,
|
|
|
3479
3621
|
onToggle(node.id);
|
|
3480
3622
|
onFocusNode(node.id);
|
|
3481
3623
|
},
|
|
3482
|
-
children: /* @__PURE__ */ (0,
|
|
3624
|
+
children: /* @__PURE__ */ (0, import_jsx_runtime59.jsx)(ChevronIcon2, {})
|
|
3483
3625
|
}
|
|
3484
3626
|
)
|
|
3485
|
-
) : /* @__PURE__ */ (0,
|
|
3486
|
-
node.icon && /* @__PURE__ */ (0,
|
|
3487
|
-
/* @__PURE__ */ (0,
|
|
3627
|
+
) : /* @__PURE__ */ (0, import_jsx_runtime59.jsx)("span", { className: "uix-tree__toggle" }),
|
|
3628
|
+
node.icon && /* @__PURE__ */ (0, import_jsx_runtime59.jsx)("span", { "aria-hidden": "true", children: node.icon }),
|
|
3629
|
+
/* @__PURE__ */ (0, import_jsx_runtime59.jsx)("span", { className: "uix-tree__label", children: node.label })
|
|
3488
3630
|
] }),
|
|
3489
|
-
hasChildren && isExpanded && /* @__PURE__ */ (0,
|
|
3631
|
+
hasChildren && isExpanded && /* @__PURE__ */ (0, import_jsx_runtime59.jsx)("ul", { role: "group", className: "uix-tree__group", children: node.children.map((child) => /* @__PURE__ */ (0, import_jsx_runtime59.jsx)(
|
|
3490
3632
|
TreeNode,
|
|
3491
3633
|
{
|
|
3492
3634
|
node: child,
|
|
@@ -3541,7 +3683,7 @@ function Tree({
|
|
|
3541
3683
|
const useVirtual = virtualize ?? shouldVirtualize(flat.length);
|
|
3542
3684
|
const tabbableId = focusedId ?? selected ?? nodes[0]?.id;
|
|
3543
3685
|
if (useVirtual) {
|
|
3544
|
-
return /* @__PURE__ */ (0,
|
|
3686
|
+
return /* @__PURE__ */ (0, import_jsx_runtime59.jsx)(
|
|
3545
3687
|
VirtualTreeView,
|
|
3546
3688
|
{
|
|
3547
3689
|
flat,
|
|
@@ -3619,7 +3761,7 @@ function Tree({
|
|
|
3619
3761
|
break;
|
|
3620
3762
|
}
|
|
3621
3763
|
};
|
|
3622
|
-
return /* @__PURE__ */ (0,
|
|
3764
|
+
return /* @__PURE__ */ (0, import_jsx_runtime59.jsx)("ul", { ref: rootRef, className: cx("uix-tree", className), role: "tree", onKeyDown, ...props, children: nodes.map((node) => /* @__PURE__ */ (0, import_jsx_runtime59.jsx)(
|
|
3623
3765
|
TreeNode,
|
|
3624
3766
|
{
|
|
3625
3767
|
node,
|
|
@@ -3701,7 +3843,7 @@ function VirtualTreeView({
|
|
|
3701
3843
|
}
|
|
3702
3844
|
if (act.focusId !== void 0) moveTo(act.focusId);
|
|
3703
3845
|
};
|
|
3704
|
-
return /* @__PURE__ */ (0,
|
|
3846
|
+
return /* @__PURE__ */ (0, import_jsx_runtime59.jsxs)(
|
|
3705
3847
|
"ul",
|
|
3706
3848
|
{
|
|
3707
3849
|
ref: scrollRef,
|
|
@@ -3719,13 +3861,13 @@ function VirtualTreeView({
|
|
|
3719
3861
|
},
|
|
3720
3862
|
...props,
|
|
3721
3863
|
children: [
|
|
3722
|
-
win.padTop > 0 && /* @__PURE__ */ (0,
|
|
3864
|
+
win.padTop > 0 && /* @__PURE__ */ (0, import_jsx_runtime59.jsx)("li", { role: "presentation", "aria-hidden": "true", style: { height: win.padTop } }),
|
|
3723
3865
|
rows.map((f, i) => {
|
|
3724
3866
|
const rowStyle = {
|
|
3725
3867
|
height: rowHeight,
|
|
3726
3868
|
paddingLeft: `calc(${Math.min(f.level - 1, 4)} * var(--uix-space-5) + ${Math.max(0, f.level - 5)} * var(--uix-space-1))`
|
|
3727
3869
|
};
|
|
3728
|
-
return /* @__PURE__ */ (0,
|
|
3870
|
+
return /* @__PURE__ */ (0, import_jsx_runtime59.jsx)(
|
|
3729
3871
|
"li",
|
|
3730
3872
|
{
|
|
3731
3873
|
role: "treeitem",
|
|
@@ -3746,12 +3888,12 @@ function VirtualTreeView({
|
|
|
3746
3888
|
onSelect?.(f.node.id);
|
|
3747
3889
|
setFocusedId(f.node.id);
|
|
3748
3890
|
},
|
|
3749
|
-
children: /* @__PURE__ */ (0,
|
|
3891
|
+
children: /* @__PURE__ */ (0, import_jsx_runtime59.jsxs)("span", { className: "uix-tree__row", style: rowStyle, children: [
|
|
3750
3892
|
f.hasChildren ? (
|
|
3751
3893
|
// TENSOR RX-125 (UIX-09): the chevron is its own pointer target, so a
|
|
3752
3894
|
// branch can be expanded without selecting it. Keyboard users toggle with
|
|
3753
3895
|
// the arrow keys on the treeitem, so it stays out of the tab order.
|
|
3754
|
-
/* @__PURE__ */ (0,
|
|
3896
|
+
/* @__PURE__ */ (0, import_jsx_runtime59.jsx)(
|
|
3755
3897
|
"button",
|
|
3756
3898
|
{
|
|
3757
3899
|
type: "button",
|
|
@@ -3763,25 +3905,25 @@ function VirtualTreeView({
|
|
|
3763
3905
|
onToggle(f.node.id);
|
|
3764
3906
|
setFocusedId(f.node.id);
|
|
3765
3907
|
},
|
|
3766
|
-
children: /* @__PURE__ */ (0,
|
|
3908
|
+
children: /* @__PURE__ */ (0, import_jsx_runtime59.jsx)(ChevronIcon2, {})
|
|
3767
3909
|
}
|
|
3768
3910
|
)
|
|
3769
|
-
) : /* @__PURE__ */ (0,
|
|
3770
|
-
f.node.icon && /* @__PURE__ */ (0,
|
|
3771
|
-
/* @__PURE__ */ (0,
|
|
3911
|
+
) : /* @__PURE__ */ (0, import_jsx_runtime59.jsx)("span", { className: "uix-tree__toggle" }),
|
|
3912
|
+
f.node.icon && /* @__PURE__ */ (0, import_jsx_runtime59.jsx)("span", { "aria-hidden": "true", children: f.node.icon }),
|
|
3913
|
+
/* @__PURE__ */ (0, import_jsx_runtime59.jsx)("span", { className: "uix-tree__label", children: f.node.label })
|
|
3772
3914
|
] })
|
|
3773
3915
|
},
|
|
3774
3916
|
f.node.id
|
|
3775
3917
|
);
|
|
3776
3918
|
}),
|
|
3777
|
-
win.padBottom > 0 && /* @__PURE__ */ (0,
|
|
3919
|
+
win.padBottom > 0 && /* @__PURE__ */ (0, import_jsx_runtime59.jsx)("li", { role: "presentation", "aria-hidden": "true", style: { height: win.padBottom } })
|
|
3778
3920
|
]
|
|
3779
3921
|
}
|
|
3780
3922
|
);
|
|
3781
3923
|
}
|
|
3782
3924
|
|
|
3783
3925
|
// src/components/EditorialHome.tsx
|
|
3784
|
-
var
|
|
3926
|
+
var import_jsx_runtime60 = require("react/jsx-runtime");
|
|
3785
3927
|
function PageIntro({
|
|
3786
3928
|
kicker,
|
|
3787
3929
|
title,
|
|
@@ -3794,39 +3936,39 @@ function PageIntro({
|
|
|
3794
3936
|
children,
|
|
3795
3937
|
...props
|
|
3796
3938
|
}) {
|
|
3797
|
-
return /* @__PURE__ */ (0,
|
|
3798
|
-
/* @__PURE__ */ (0,
|
|
3799
|
-
kicker != null && /* @__PURE__ */ (0,
|
|
3800
|
-
/* @__PURE__ */ (0,
|
|
3801
|
-
lede != null && /* @__PURE__ */ (0,
|
|
3939
|
+
return /* @__PURE__ */ (0, import_jsx_runtime60.jsxs)("section", { className: cx("uix-page-intro", className), ...props, children: [
|
|
3940
|
+
/* @__PURE__ */ (0, import_jsx_runtime60.jsxs)("div", { children: [
|
|
3941
|
+
kicker != null && /* @__PURE__ */ (0, import_jsx_runtime60.jsx)("p", { className: "uix-page-kicker", children: kicker }),
|
|
3942
|
+
/* @__PURE__ */ (0, import_jsx_runtime60.jsx)("h1", { className: "uix-page-title", children: title }),
|
|
3943
|
+
lede != null && /* @__PURE__ */ (0, import_jsx_runtime60.jsx)("p", { className: "uix-page-lede", children: lede })
|
|
3802
3944
|
] }),
|
|
3803
|
-
search != null && /* @__PURE__ */ (0,
|
|
3804
|
-
searchLabel != null && /* @__PURE__ */ (0,
|
|
3945
|
+
search != null && /* @__PURE__ */ (0, import_jsx_runtime60.jsxs)("div", { children: [
|
|
3946
|
+
searchLabel != null && /* @__PURE__ */ (0, import_jsx_runtime60.jsx)("p", { className: "uix-intro-search__label", children: searchLabel }),
|
|
3805
3947
|
search
|
|
3806
3948
|
] }),
|
|
3807
|
-
shortcuts != null && /* @__PURE__ */ (0,
|
|
3949
|
+
shortcuts != null && /* @__PURE__ */ (0, import_jsx_runtime60.jsx)("div", { className: "uix-shortcut-grid", "aria-label": shortcutsLabel, children: shortcuts }),
|
|
3808
3950
|
children
|
|
3809
3951
|
] });
|
|
3810
3952
|
}
|
|
3811
3953
|
function SectionHead({ title, titleId, action, className, ...props }) {
|
|
3812
|
-
return /* @__PURE__ */ (0,
|
|
3813
|
-
/* @__PURE__ */ (0,
|
|
3954
|
+
return /* @__PURE__ */ (0, import_jsx_runtime60.jsxs)("div", { className: cx("uix-section-head", className), ...props, children: [
|
|
3955
|
+
/* @__PURE__ */ (0, import_jsx_runtime60.jsx)("h2", { className: "uix-section-title", id: titleId, children: title }),
|
|
3814
3956
|
action
|
|
3815
3957
|
] });
|
|
3816
3958
|
}
|
|
3817
3959
|
function NoticeQueue({ icon, title, summary, meta, position, actions, className, ...props }) {
|
|
3818
|
-
return /* @__PURE__ */ (0,
|
|
3960
|
+
return /* @__PURE__ */ (0, import_jsx_runtime60.jsxs)("section", { className: cx("uix-notice", className), ...props, children: [
|
|
3819
3961
|
icon,
|
|
3820
|
-
/* @__PURE__ */ (0,
|
|
3821
|
-
/* @__PURE__ */ (0,
|
|
3822
|
-
title != null && /* @__PURE__ */ (0,
|
|
3962
|
+
/* @__PURE__ */ (0, import_jsx_runtime60.jsxs)("div", { className: "uix-notice__content", "aria-live": "polite", children: [
|
|
3963
|
+
/* @__PURE__ */ (0, import_jsx_runtime60.jsxs)("p", { className: "uix-notice__copy", children: [
|
|
3964
|
+
title != null && /* @__PURE__ */ (0, import_jsx_runtime60.jsx)("strong", { children: title }),
|
|
3823
3965
|
title != null && summary != null && " ",
|
|
3824
3966
|
summary
|
|
3825
3967
|
] }),
|
|
3826
|
-
meta != null && /* @__PURE__ */ (0,
|
|
3968
|
+
meta != null && /* @__PURE__ */ (0, import_jsx_runtime60.jsx)("p", { className: "uix-notice__meta", children: meta })
|
|
3827
3969
|
] }),
|
|
3828
|
-
(position != null || actions != null) && /* @__PURE__ */ (0,
|
|
3829
|
-
position != null && /* @__PURE__ */ (0,
|
|
3970
|
+
(position != null || actions != null) && /* @__PURE__ */ (0, import_jsx_runtime60.jsxs)("div", { className: "uix-notice__actions", children: [
|
|
3971
|
+
position != null && /* @__PURE__ */ (0, import_jsx_runtime60.jsx)("span", { className: "uix-notice__position", children: position }),
|
|
3830
3972
|
actions
|
|
3831
3973
|
] })
|
|
3832
3974
|
] });
|
|
@@ -3844,8 +3986,8 @@ function FeaturedStage({
|
|
|
3844
3986
|
className,
|
|
3845
3987
|
...props
|
|
3846
3988
|
}) {
|
|
3847
|
-
return /* @__PURE__ */ (0,
|
|
3848
|
-
/* @__PURE__ */ (0,
|
|
3989
|
+
return /* @__PURE__ */ (0, import_jsx_runtime60.jsxs)("article", { className: cx("uix-featured__stage", className), ...props, children: [
|
|
3990
|
+
/* @__PURE__ */ (0, import_jsx_runtime60.jsx)(
|
|
3849
3991
|
"div",
|
|
3850
3992
|
{
|
|
3851
3993
|
className: "uix-featured__visual",
|
|
@@ -3855,32 +3997,32 @@ function FeaturedStage({
|
|
|
3855
3997
|
children: visual
|
|
3856
3998
|
}
|
|
3857
3999
|
),
|
|
3858
|
-
/* @__PURE__ */ (0,
|
|
3859
|
-
(eyebrow != null || ordinal != null) && /* @__PURE__ */ (0,
|
|
3860
|
-
ordinal != null && /* @__PURE__ */ (0,
|
|
4000
|
+
/* @__PURE__ */ (0, import_jsx_runtime60.jsxs)("div", { className: "uix-featured__content", "aria-live": "polite", children: [
|
|
4001
|
+
(eyebrow != null || ordinal != null) && /* @__PURE__ */ (0, import_jsx_runtime60.jsxs)("p", { className: "uix-featured__eyebrow", children: [
|
|
4002
|
+
ordinal != null && /* @__PURE__ */ (0, import_jsx_runtime60.jsx)("span", { className: "uix-featured__now", children: ordinal }),
|
|
3861
4003
|
eyebrow
|
|
3862
4004
|
] }),
|
|
3863
|
-
/* @__PURE__ */ (0,
|
|
3864
|
-
description != null && /* @__PURE__ */ (0,
|
|
3865
|
-
meta != null && /* @__PURE__ */ (0,
|
|
4005
|
+
/* @__PURE__ */ (0, import_jsx_runtime60.jsx)("h2", { className: "uix-featured__title", id: titleId, children: title }),
|
|
4006
|
+
description != null && /* @__PURE__ */ (0, import_jsx_runtime60.jsx)("p", { className: "uix-featured__description", children: description }),
|
|
4007
|
+
meta != null && /* @__PURE__ */ (0, import_jsx_runtime60.jsx)("p", { className: "uix-featured__meta", children: meta }),
|
|
3866
4008
|
action
|
|
3867
4009
|
] })
|
|
3868
4010
|
] });
|
|
3869
4011
|
}
|
|
3870
4012
|
function FeaturedRundown({ eyebrow, title, titleId, meta, children, className, ...props }) {
|
|
3871
|
-
return /* @__PURE__ */ (0,
|
|
3872
|
-
/* @__PURE__ */ (0,
|
|
3873
|
-
/* @__PURE__ */ (0,
|
|
3874
|
-
eyebrow != null && /* @__PURE__ */ (0,
|
|
3875
|
-
/* @__PURE__ */ (0,
|
|
4013
|
+
return /* @__PURE__ */ (0, import_jsx_runtime60.jsxs)("aside", { className: cx("uix-rundown", className), ...props, children: [
|
|
4014
|
+
/* @__PURE__ */ (0, import_jsx_runtime60.jsxs)("div", { className: "uix-rundown__head", children: [
|
|
4015
|
+
/* @__PURE__ */ (0, import_jsx_runtime60.jsxs)("div", { children: [
|
|
4016
|
+
eyebrow != null && /* @__PURE__ */ (0, import_jsx_runtime60.jsx)("p", { className: "uix-rundown__eyebrow", children: eyebrow }),
|
|
4017
|
+
/* @__PURE__ */ (0, import_jsx_runtime60.jsx)("h2", { className: "uix-rundown__title", id: titleId, children: title })
|
|
3876
4018
|
] }),
|
|
3877
4019
|
meta
|
|
3878
4020
|
] }),
|
|
3879
|
-
/* @__PURE__ */ (0,
|
|
4021
|
+
/* @__PURE__ */ (0, import_jsx_runtime60.jsx)("div", { className: "uix-rundown__items", children })
|
|
3880
4022
|
] });
|
|
3881
4023
|
}
|
|
3882
4024
|
function FeaturedRundownItem({ number, topic, title, selected = false, className, ...props }) {
|
|
3883
|
-
return /* @__PURE__ */ (0,
|
|
4025
|
+
return /* @__PURE__ */ (0, import_jsx_runtime60.jsxs)(
|
|
3884
4026
|
"button",
|
|
3885
4027
|
{
|
|
3886
4028
|
type: "button",
|
|
@@ -3889,63 +4031,63 @@ function FeaturedRundownItem({ number, topic, title, selected = false, className
|
|
|
3889
4031
|
"data-selected": selected ? "true" : "false",
|
|
3890
4032
|
...props,
|
|
3891
4033
|
children: [
|
|
3892
|
-
number != null && /* @__PURE__ */ (0,
|
|
3893
|
-
/* @__PURE__ */ (0,
|
|
3894
|
-
topic != null && /* @__PURE__ */ (0,
|
|
3895
|
-
/* @__PURE__ */ (0,
|
|
4034
|
+
number != null && /* @__PURE__ */ (0, import_jsx_runtime60.jsx)("span", { className: "uix-rundown__number", children: number }),
|
|
4035
|
+
/* @__PURE__ */ (0, import_jsx_runtime60.jsxs)("span", { children: [
|
|
4036
|
+
topic != null && /* @__PURE__ */ (0, import_jsx_runtime60.jsx)("span", { className: "uix-rundown__topic", children: topic }),
|
|
4037
|
+
/* @__PURE__ */ (0, import_jsx_runtime60.jsx)("span", { className: "uix-rundown__item-title", children: title })
|
|
3896
4038
|
] })
|
|
3897
4039
|
]
|
|
3898
4040
|
}
|
|
3899
4041
|
);
|
|
3900
4042
|
}
|
|
3901
4043
|
function NewsLead({ meta, title, summary, className, ...props }) {
|
|
3902
|
-
return /* @__PURE__ */ (0,
|
|
3903
|
-
meta != null && /* @__PURE__ */ (0,
|
|
3904
|
-
/* @__PURE__ */ (0,
|
|
3905
|
-
summary != null && /* @__PURE__ */ (0,
|
|
4044
|
+
return /* @__PURE__ */ (0, import_jsx_runtime60.jsxs)("article", { className: cx("uix-news-lead", className), ...props, children: [
|
|
4045
|
+
meta != null && /* @__PURE__ */ (0, import_jsx_runtime60.jsx)("p", { className: "uix-news-lead__meta", children: meta }),
|
|
4046
|
+
/* @__PURE__ */ (0, import_jsx_runtime60.jsx)("h3", { className: "uix-news-lead__title", children: title }),
|
|
4047
|
+
summary != null && /* @__PURE__ */ (0, import_jsx_runtime60.jsx)("p", { className: "uix-news-lead__summary", children: summary })
|
|
3906
4048
|
] });
|
|
3907
4049
|
}
|
|
3908
4050
|
function ContentList({ children, className, ...props }) {
|
|
3909
|
-
return /* @__PURE__ */ (0,
|
|
4051
|
+
return /* @__PURE__ */ (0, import_jsx_runtime60.jsx)("ul", { className: cx("uix-content-list", className), ...props, children });
|
|
3910
4052
|
}
|
|
3911
4053
|
function ContentListItem({ title, meta, trailing, className, ...props }) {
|
|
3912
|
-
return /* @__PURE__ */ (0,
|
|
3913
|
-
/* @__PURE__ */ (0,
|
|
3914
|
-
/* @__PURE__ */ (0,
|
|
3915
|
-
meta != null && /* @__PURE__ */ (0,
|
|
4054
|
+
return /* @__PURE__ */ (0, import_jsx_runtime60.jsxs)("li", { className: cx("uix-content-list__item", className), ...props, children: [
|
|
4055
|
+
/* @__PURE__ */ (0, import_jsx_runtime60.jsxs)("div", { children: [
|
|
4056
|
+
/* @__PURE__ */ (0, import_jsx_runtime60.jsx)("p", { className: "uix-content-list__title", children: title }),
|
|
4057
|
+
meta != null && /* @__PURE__ */ (0, import_jsx_runtime60.jsx)("p", { className: "uix-content-list__meta", children: meta })
|
|
3916
4058
|
] }),
|
|
3917
4059
|
trailing
|
|
3918
4060
|
] });
|
|
3919
4061
|
}
|
|
3920
4062
|
function ResourceGrid({ children, className, ...props }) {
|
|
3921
|
-
return /* @__PURE__ */ (0,
|
|
4063
|
+
return /* @__PURE__ */ (0, import_jsx_runtime60.jsx)("div", { className: cx("uix-resource-grid", className), ...props, children });
|
|
3922
4064
|
}
|
|
3923
4065
|
function StatLine({ items, children, className, ...props }) {
|
|
3924
|
-
return /* @__PURE__ */ (0,
|
|
3925
|
-
items?.map((item, i) => /* @__PURE__ */ (0,
|
|
3926
|
-
/* @__PURE__ */ (0,
|
|
3927
|
-
/* @__PURE__ */ (0,
|
|
4066
|
+
return /* @__PURE__ */ (0, import_jsx_runtime60.jsxs)("div", { className: cx("uix-stat-line", className), ...props, children: [
|
|
4067
|
+
items?.map((item, i) => /* @__PURE__ */ (0, import_jsx_runtime60.jsxs)("div", { className: "uix-stat-line__item", children: [
|
|
4068
|
+
/* @__PURE__ */ (0, import_jsx_runtime60.jsx)("span", { className: "uix-stat-line__value", children: item.value }),
|
|
4069
|
+
/* @__PURE__ */ (0, import_jsx_runtime60.jsx)("span", { className: "uix-stat-line__label", children: item.label })
|
|
3928
4070
|
] }, item.id ?? i)),
|
|
3929
4071
|
children
|
|
3930
4072
|
] });
|
|
3931
4073
|
}
|
|
3932
4074
|
function EventRow({ month, day, title, meta, className, ...props }) {
|
|
3933
|
-
return /* @__PURE__ */ (0,
|
|
3934
|
-
/* @__PURE__ */ (0,
|
|
3935
|
-
/* @__PURE__ */ (0,
|
|
3936
|
-
/* @__PURE__ */ (0,
|
|
4075
|
+
return /* @__PURE__ */ (0, import_jsx_runtime60.jsxs)("div", { className: cx("uix-event-row", className), ...props, children: [
|
|
4076
|
+
/* @__PURE__ */ (0, import_jsx_runtime60.jsxs)("div", { className: "uix-event-date", children: [
|
|
4077
|
+
/* @__PURE__ */ (0, import_jsx_runtime60.jsx)("span", { className: "uix-event-date__month", children: month }),
|
|
4078
|
+
/* @__PURE__ */ (0, import_jsx_runtime60.jsx)("span", { className: "uix-event-date__day", children: day })
|
|
3937
4079
|
] }),
|
|
3938
|
-
/* @__PURE__ */ (0,
|
|
3939
|
-
/* @__PURE__ */ (0,
|
|
3940
|
-
meta != null && /* @__PURE__ */ (0,
|
|
4080
|
+
/* @__PURE__ */ (0, import_jsx_runtime60.jsxs)("div", { children: [
|
|
4081
|
+
/* @__PURE__ */ (0, import_jsx_runtime60.jsx)("p", { className: "uix-event-row__title", children: title }),
|
|
4082
|
+
meta != null && /* @__PURE__ */ (0, import_jsx_runtime60.jsx)("p", { className: "uix-event-row__meta", children: meta })
|
|
3941
4083
|
] })
|
|
3942
4084
|
] });
|
|
3943
4085
|
}
|
|
3944
4086
|
function StatusRow({ indicator, name, meta, className, ...props }) {
|
|
3945
|
-
return /* @__PURE__ */ (0,
|
|
4087
|
+
return /* @__PURE__ */ (0, import_jsx_runtime60.jsxs)("div", { className: cx("uix-status-row", className), ...props, children: [
|
|
3946
4088
|
indicator,
|
|
3947
|
-
/* @__PURE__ */ (0,
|
|
3948
|
-
meta != null && /* @__PURE__ */ (0,
|
|
4089
|
+
/* @__PURE__ */ (0, import_jsx_runtime60.jsx)("span", { className: "uix-status-row__name", children: name }),
|
|
4090
|
+
meta != null && /* @__PURE__ */ (0, import_jsx_runtime60.jsx)("span", { className: "uix-list-meta", children: meta })
|
|
3949
4091
|
] });
|
|
3950
4092
|
}
|
|
3951
4093
|
|
|
@@ -4050,7 +4192,7 @@ function fillLabel(template, values) {
|
|
|
4050
4192
|
}
|
|
4051
4193
|
|
|
4052
4194
|
// src/components/RuleBuilder.tsx
|
|
4053
|
-
var
|
|
4195
|
+
var import_jsx_runtime61 = require("react/jsx-runtime");
|
|
4054
4196
|
var DEFAULT_RULE_BUILDER_LABELS = {
|
|
4055
4197
|
region: "Rule builder",
|
|
4056
4198
|
summary: "Rule summary",
|
|
@@ -4097,21 +4239,21 @@ function RuleGroupEditor({ group, depth, root, fields, operators, maxDepth, disa
|
|
|
4097
4239
|
combinator: "and",
|
|
4098
4240
|
conditions: [defaultCondition(fields, operators)]
|
|
4099
4241
|
}, maxDepth));
|
|
4100
|
-
return /* @__PURE__ */ (0,
|
|
4101
|
-
/* @__PURE__ */ (0,
|
|
4102
|
-
/* @__PURE__ */ (0,
|
|
4103
|
-
/* @__PURE__ */ (0,
|
|
4242
|
+
return /* @__PURE__ */ (0, import_jsx_runtime61.jsxs)("fieldset", { className: "uix-rule-builder__group", "data-depth": depth, children: [
|
|
4243
|
+
/* @__PURE__ */ (0, import_jsx_runtime61.jsxs)("legend", { className: "uix-rule-builder__group-heading", children: [
|
|
4244
|
+
/* @__PURE__ */ (0, import_jsx_runtime61.jsx)("span", { children: depth === 1 ? labels.when : labels.group }),
|
|
4245
|
+
/* @__PURE__ */ (0, import_jsx_runtime61.jsxs)("label", { children: [
|
|
4104
4246
|
labels.match,
|
|
4105
|
-
/* @__PURE__ */ (0,
|
|
4106
|
-
/* @__PURE__ */ (0,
|
|
4107
|
-
/* @__PURE__ */ (0,
|
|
4247
|
+
/* @__PURE__ */ (0, import_jsx_runtime61.jsxs)("select", { className: "uix-select uix-select--sm", value: group.combinator, disabled, onChange: (event) => updateNode(group.id, (node) => ({ ...node, combinator: event.currentTarget.value })), children: [
|
|
4248
|
+
/* @__PURE__ */ (0, import_jsx_runtime61.jsx)("option", { value: "and", children: labels.all }),
|
|
4249
|
+
/* @__PURE__ */ (0, import_jsx_runtime61.jsx)("option", { value: "or", children: labels.any })
|
|
4108
4250
|
] })
|
|
4109
4251
|
] })
|
|
4110
4252
|
] }),
|
|
4111
|
-
/* @__PURE__ */ (0,
|
|
4112
|
-
/* @__PURE__ */ (0,
|
|
4113
|
-
/* @__PURE__ */ (0,
|
|
4114
|
-
] }, node.id) : /* @__PURE__ */ (0,
|
|
4253
|
+
/* @__PURE__ */ (0, import_jsx_runtime61.jsx)("div", { className: "uix-rule-builder__rows", children: group.conditions.map((node, index) => isRuleGroup(node) ? /* @__PURE__ */ (0, import_jsx_runtime61.jsxs)("div", { className: "uix-rule-builder__nested", children: [
|
|
4254
|
+
/* @__PURE__ */ (0, import_jsx_runtime61.jsx)(RuleGroupEditor, { ...{ group: node, depth: depth + 1, root, fields, operators, maxDepth, disabled, onRootChange, labels } }),
|
|
4255
|
+
/* @__PURE__ */ (0, import_jsx_runtime61.jsx)(RowControls, { labels, label: labels.itemGroup, first: index === 0, last: index === group.conditions.length - 1, disabled, onUp: () => onRootChange(moveRuleNode(root, node.id, -1)), onDown: () => onRootChange(moveRuleNode(root, node.id, 1)), onRemove: () => onRootChange(removeRuleNode(root, node.id)) })
|
|
4256
|
+
] }, node.id) : /* @__PURE__ */ (0, import_jsx_runtime61.jsx)(
|
|
4115
4257
|
ConditionRow,
|
|
4116
4258
|
{
|
|
4117
4259
|
labels,
|
|
@@ -4120,13 +4262,13 @@ function RuleGroupEditor({ group, depth, root, fields, operators, maxDepth, disa
|
|
|
4120
4262
|
operators,
|
|
4121
4263
|
disabled,
|
|
4122
4264
|
onChange: (condition) => updateNode(node.id, () => condition),
|
|
4123
|
-
controls: /* @__PURE__ */ (0,
|
|
4265
|
+
controls: /* @__PURE__ */ (0, import_jsx_runtime61.jsx)(RowControls, { labels, label: labels.itemCondition, first: index === 0, last: index === group.conditions.length - 1, disabled, onUp: () => onRootChange(moveRuleNode(root, node.id, -1)), onDown: () => onRootChange(moveRuleNode(root, node.id, 1)), onRemove: () => onRootChange(removeRuleNode(root, node.id)) })
|
|
4124
4266
|
},
|
|
4125
4267
|
node.id
|
|
4126
4268
|
)) }),
|
|
4127
|
-
/* @__PURE__ */ (0,
|
|
4128
|
-
/* @__PURE__ */ (0,
|
|
4129
|
-
/* @__PURE__ */ (0,
|
|
4269
|
+
/* @__PURE__ */ (0, import_jsx_runtime61.jsxs)("div", { className: "uix-rule-builder__add", children: [
|
|
4270
|
+
/* @__PURE__ */ (0, import_jsx_runtime61.jsx)("button", { type: "button", className: "uix-btn uix-btn--secondary uix-btn--sm", onClick: addCondition, disabled: disabled || fields.length === 0 || operators.length === 0, children: labels.addCondition }),
|
|
4271
|
+
/* @__PURE__ */ (0, import_jsx_runtime61.jsx)("button", { type: "button", className: "uix-btn uix-btn--ghost uix-btn--sm", onClick: addGroup, disabled: disabled || depth >= maxDepth, children: labels.addGroup })
|
|
4130
4272
|
] })
|
|
4131
4273
|
] });
|
|
4132
4274
|
}
|
|
@@ -4139,24 +4281,24 @@ function ConditionRow({ labels, condition, fields, operators, disabled, onChange
|
|
|
4139
4281
|
const nextOperator = operators.find((item) => nextField?.operators?.includes(item.id)) ?? availableOperators[0] ?? operators[0];
|
|
4140
4282
|
onChange({ ...condition, field: id, operator: nextOperator?.id ?? "" });
|
|
4141
4283
|
};
|
|
4142
|
-
return /* @__PURE__ */ (0,
|
|
4143
|
-
/* @__PURE__ */ (0,
|
|
4144
|
-
/* @__PURE__ */ (0,
|
|
4145
|
-
/* @__PURE__ */ (0,
|
|
4284
|
+
return /* @__PURE__ */ (0, import_jsx_runtime61.jsxs)("div", { className: "uix-rule-builder__condition", children: [
|
|
4285
|
+
/* @__PURE__ */ (0, import_jsx_runtime61.jsxs)("label", { children: [
|
|
4286
|
+
/* @__PURE__ */ (0, import_jsx_runtime61.jsx)("span", { className: "uix-visually-hidden", children: labels.field }),
|
|
4287
|
+
/* @__PURE__ */ (0, import_jsx_runtime61.jsx)("select", { className: "uix-select", value: condition.field, onChange: (event) => setField(event.currentTarget.value), disabled, children: fields.map((item) => /* @__PURE__ */ (0, import_jsx_runtime61.jsx)("option", { value: item.id, children: item.label }, item.id)) })
|
|
4146
4288
|
] }),
|
|
4147
|
-
/* @__PURE__ */ (0,
|
|
4148
|
-
/* @__PURE__ */ (0,
|
|
4149
|
-
/* @__PURE__ */ (0,
|
|
4289
|
+
/* @__PURE__ */ (0, import_jsx_runtime61.jsxs)("label", { children: [
|
|
4290
|
+
/* @__PURE__ */ (0, import_jsx_runtime61.jsx)("span", { className: "uix-visually-hidden", children: labels.operator }),
|
|
4291
|
+
/* @__PURE__ */ (0, import_jsx_runtime61.jsx)("select", { className: "uix-select", value: condition.operator, onChange: (event) => onChange({ ...condition, operator: event.currentTarget.value }), disabled, children: availableOperators.map((item) => /* @__PURE__ */ (0, import_jsx_runtime61.jsx)("option", { value: item.id, children: item.label }, item.id)) })
|
|
4150
4292
|
] }),
|
|
4151
|
-
operator?.requiresValue !== false && /* @__PURE__ */ (0,
|
|
4293
|
+
operator?.requiresValue !== false && /* @__PURE__ */ (0, import_jsx_runtime61.jsx)("div", { className: "uix-rule-builder__value", children: field?.renderValueEditor?.({ condition, onChange: (value) => onChange({ ...condition, value }), disabled }) ?? /* @__PURE__ */ (0, import_jsx_runtime61.jsx)("input", { className: "uix-input", value: typeof condition.value === "string" || typeof condition.value === "number" ? condition.value : condition.value == null ? "" : JSON.stringify(condition.value), onChange: (event) => onChange({ ...condition, value: event.currentTarget.value }), disabled, "aria-label": fillLabel(labels.valueFor, { field: field?.label ?? labels.itemCondition }) }) }),
|
|
4152
4294
|
controls
|
|
4153
4295
|
] });
|
|
4154
4296
|
}
|
|
4155
4297
|
function RowControls({ labels, label, first, last, disabled, onUp, onDown, onRemove }) {
|
|
4156
|
-
return /* @__PURE__ */ (0,
|
|
4157
|
-
/* @__PURE__ */ (0,
|
|
4158
|
-
/* @__PURE__ */ (0,
|
|
4159
|
-
/* @__PURE__ */ (0,
|
|
4298
|
+
return /* @__PURE__ */ (0, import_jsx_runtime61.jsxs)("span", { className: "uix-rule-builder__row-actions", children: [
|
|
4299
|
+
/* @__PURE__ */ (0, import_jsx_runtime61.jsx)("button", { type: "button", className: "uix-btn uix-btn--ghost uix-btn--sm", onClick: onUp, disabled: disabled || first, "aria-label": fillLabel(labels.moveUpNamed, { item: label }), children: labels.moveUp }),
|
|
4300
|
+
/* @__PURE__ */ (0, import_jsx_runtime61.jsx)("button", { type: "button", className: "uix-btn uix-btn--ghost uix-btn--sm", onClick: onDown, disabled: disabled || last, "aria-label": fillLabel(labels.moveDownNamed, { item: label }), children: labels.moveDown }),
|
|
4301
|
+
/* @__PURE__ */ (0, import_jsx_runtime61.jsx)("button", { type: "button", className: "uix-btn uix-btn--ghost uix-btn--sm", onClick: onRemove, disabled, "aria-label": fillLabel(labels.removeNamed, { item: label }), children: labels.remove })
|
|
4160
4302
|
] });
|
|
4161
4303
|
}
|
|
4162
4304
|
function RuleBuilder({
|
|
@@ -4186,21 +4328,21 @@ function RuleBuilder({
|
|
|
4186
4328
|
const fieldLabels = Object.fromEntries(fields.map((field) => [field.id, field.label]));
|
|
4187
4329
|
const operatorLabels = Object.fromEntries(operators.map((operator) => [operator.id, operator.label]));
|
|
4188
4330
|
const actionLabels = Object.fromEntries(actions.map((action) => [action.id, action.label]));
|
|
4189
|
-
if (readOnly) return /* @__PURE__ */ (0,
|
|
4190
|
-
/* @__PURE__ */ (0,
|
|
4191
|
-
issues.length > 0 && /* @__PURE__ */ (0,
|
|
4331
|
+
if (readOnly) return /* @__PURE__ */ (0, import_jsx_runtime61.jsxs)("section", { className: cx("uix-rule-builder uix-rule-builder--summary", className), "aria-label": labels.summary, children: [
|
|
4332
|
+
/* @__PURE__ */ (0, import_jsx_runtime61.jsx)("p", { children: summarizeRule(value, { fields: fieldLabels, operators: operatorLabels, actions: actionLabels }) }),
|
|
4333
|
+
issues.length > 0 && /* @__PURE__ */ (0, import_jsx_runtime61.jsx)("p", { className: "uix-rule-builder__invalid", children: issuesText(labels.summaryIssuesOne, labels.summaryIssuesMany) })
|
|
4192
4334
|
] });
|
|
4193
4335
|
const updateActions = (next) => onChange({ ...value, then: next });
|
|
4194
|
-
return /* @__PURE__ */ (0,
|
|
4195
|
-
/* @__PURE__ */ (0,
|
|
4196
|
-
/* @__PURE__ */ (0,
|
|
4197
|
-
/* @__PURE__ */ (0,
|
|
4336
|
+
return /* @__PURE__ */ (0, import_jsx_runtime61.jsxs)("section", { className: cx("uix-rule-builder", className), "aria-label": labels.region, children: [
|
|
4337
|
+
/* @__PURE__ */ (0, import_jsx_runtime61.jsx)(RuleGroupEditor, { group: value.when, depth: 1, root: value.when, fields, operators, maxDepth, disabled: readOnly, onRootChange: (when) => onChange({ ...value, when }), labels }),
|
|
4338
|
+
/* @__PURE__ */ (0, import_jsx_runtime61.jsxs)("fieldset", { className: "uix-rule-builder__actions", children: [
|
|
4339
|
+
/* @__PURE__ */ (0, import_jsx_runtime61.jsx)("legend", { children: labels.then }),
|
|
4198
4340
|
value.then.map((action, index) => {
|
|
4199
4341
|
const definition = actions.find((item) => item.id === action.type);
|
|
4200
|
-
return /* @__PURE__ */ (0,
|
|
4201
|
-
/* @__PURE__ */ (0,
|
|
4342
|
+
return /* @__PURE__ */ (0, import_jsx_runtime61.jsxs)("div", { className: "uix-rule-builder__action", children: [
|
|
4343
|
+
/* @__PURE__ */ (0, import_jsx_runtime61.jsx)("select", { className: "uix-select", value: action.type, onChange: (event) => updateActions(value.then.map((item) => item.id === action.id ? { ...item, type: event.currentTarget.value } : item)), "aria-label": labels.actionType, children: actions.map((item) => /* @__PURE__ */ (0, import_jsx_runtime61.jsx)("option", { value: item.id, children: item.label }, item.id)) }),
|
|
4202
4344
|
definition?.renderParameters?.(action, (parameters) => updateActions(value.then.map((item) => item.id === action.id ? { ...item, parameters } : item)), false),
|
|
4203
|
-
/* @__PURE__ */ (0,
|
|
4345
|
+
/* @__PURE__ */ (0, import_jsx_runtime61.jsx)(
|
|
4204
4346
|
RowControls,
|
|
4205
4347
|
{
|
|
4206
4348
|
labels,
|
|
@@ -4223,18 +4365,18 @@ function RuleBuilder({
|
|
|
4223
4365
|
)
|
|
4224
4366
|
] }, action.id);
|
|
4225
4367
|
}),
|
|
4226
|
-
/* @__PURE__ */ (0,
|
|
4368
|
+
/* @__PURE__ */ (0, import_jsx_runtime61.jsx)("button", { type: "button", className: "uix-btn uix-btn--secondary uix-btn--sm", disabled: actions.length === 0, onClick: () => updateActions([...value.then, { id: nextId("action"), type: actions[0]?.id ?? "", parameters: {} }]), children: labels.addAction })
|
|
4227
4369
|
] }),
|
|
4228
|
-
/* @__PURE__ */ (0,
|
|
4229
|
-
/* @__PURE__ */ (0,
|
|
4230
|
-
/* @__PURE__ */ (0,
|
|
4370
|
+
/* @__PURE__ */ (0, import_jsx_runtime61.jsx)("div", { className: "uix-rule-builder__validation", "aria-live": "polite", children: issues.length === 0 ? /* @__PURE__ */ (0, import_jsx_runtime61.jsx)("span", { children: labels.valid }) : /* @__PURE__ */ (0, import_jsx_runtime61.jsxs)(import_jsx_runtime61.Fragment, { children: [
|
|
4371
|
+
/* @__PURE__ */ (0, import_jsx_runtime61.jsx)("strong", { children: issuesText(labels.issuesOne, labels.issuesMany) }),
|
|
4372
|
+
/* @__PURE__ */ (0, import_jsx_runtime61.jsx)("ul", { children: issues.map((issue, index) => /* @__PURE__ */ (0, import_jsx_runtime61.jsx)("li", { children: issue.message }, `${issue.path}-${index}`)) })
|
|
4231
4373
|
] }) })
|
|
4232
4374
|
] });
|
|
4233
4375
|
}
|
|
4234
4376
|
|
|
4235
4377
|
// src/components/BuilderCanvas.tsx
|
|
4236
4378
|
var import_react40 = require("react");
|
|
4237
|
-
var
|
|
4379
|
+
var import_jsx_runtime62 = require("react/jsx-runtime");
|
|
4238
4380
|
var DEFAULT_BUILDER_CANVAS_LABELS = {
|
|
4239
4381
|
region: "Builder canvas",
|
|
4240
4382
|
palette: "Item palette",
|
|
@@ -4313,24 +4455,24 @@ function BuilderCanvas({
|
|
|
4313
4455
|
if (from >= 0 && to >= 0) onItemsChange(reorder(items, from, to));
|
|
4314
4456
|
setDraggedId(void 0);
|
|
4315
4457
|
};
|
|
4316
|
-
return /* @__PURE__ */ (0,
|
|
4317
|
-
/* @__PURE__ */ (0,
|
|
4318
|
-
/* @__PURE__ */ (0,
|
|
4319
|
-
palette.length === 0 ? /* @__PURE__ */ (0,
|
|
4320
|
-
/* @__PURE__ */ (0,
|
|
4321
|
-
item.description && /* @__PURE__ */ (0,
|
|
4322
|
-
/* @__PURE__ */ (0,
|
|
4458
|
+
return /* @__PURE__ */ (0, import_jsx_runtime62.jsxs)("section", { className: cx("uix-builder-canvas", className), "aria-label": labels.region, children: [
|
|
4459
|
+
/* @__PURE__ */ (0, import_jsx_runtime62.jsxs)("aside", { className: "uix-builder-canvas__palette", "aria-label": labels.palette, children: [
|
|
4460
|
+
/* @__PURE__ */ (0, import_jsx_runtime62.jsx)("h3", { children: labels.paletteHeading }),
|
|
4461
|
+
palette.length === 0 ? /* @__PURE__ */ (0, import_jsx_runtime62.jsx)("p", { children: labels.paletteEmpty }) : /* @__PURE__ */ (0, import_jsx_runtime62.jsx)("ul", { children: palette.map((item) => /* @__PURE__ */ (0, import_jsx_runtime62.jsx)("li", { children: /* @__PURE__ */ (0, import_jsx_runtime62.jsxs)("button", { type: "button", onClick: () => add(item), children: [
|
|
4462
|
+
/* @__PURE__ */ (0, import_jsx_runtime62.jsx)("strong", { children: item.label }),
|
|
4463
|
+
item.description && /* @__PURE__ */ (0, import_jsx_runtime62.jsx)("span", { children: item.description }),
|
|
4464
|
+
/* @__PURE__ */ (0, import_jsx_runtime62.jsx)("span", { "aria-hidden": "true", children: labels.add })
|
|
4323
4465
|
] }) }, item.id)) })
|
|
4324
4466
|
] }),
|
|
4325
|
-
/* @__PURE__ */ (0,
|
|
4326
|
-
/* @__PURE__ */ (0,
|
|
4327
|
-
loading ? /* @__PURE__ */ (0,
|
|
4328
|
-
/* @__PURE__ */ (0,
|
|
4329
|
-
onRetry && /* @__PURE__ */ (0,
|
|
4330
|
-
] }) : items.length === 0 ? /* @__PURE__ */ (0,
|
|
4331
|
-
/* @__PURE__ */ (0,
|
|
4332
|
-
palette[0] && /* @__PURE__ */ (0,
|
|
4333
|
-
] }) : /* @__PURE__ */ (0,
|
|
4467
|
+
/* @__PURE__ */ (0, import_jsx_runtime62.jsxs)("div", { className: "uix-builder-canvas__workspace", children: [
|
|
4468
|
+
/* @__PURE__ */ (0, import_jsx_runtime62.jsx)("h3", { children: labels.canvasHeading }),
|
|
4469
|
+
loading ? /* @__PURE__ */ (0, import_jsx_runtime62.jsx)("div", { className: "uix-builder-canvas__state", role: "status", children: labels.loading }) : error ? /* @__PURE__ */ (0, import_jsx_runtime62.jsxs)("div", { className: "uix-builder-canvas__state", role: "alert", children: [
|
|
4470
|
+
/* @__PURE__ */ (0, import_jsx_runtime62.jsx)("p", { children: error }),
|
|
4471
|
+
onRetry && /* @__PURE__ */ (0, import_jsx_runtime62.jsx)("button", { type: "button", className: "uix-btn uix-btn--secondary", onClick: onRetry, children: labels.retry })
|
|
4472
|
+
] }) : items.length === 0 ? /* @__PURE__ */ (0, import_jsx_runtime62.jsxs)("div", { className: "uix-builder-canvas__state", children: [
|
|
4473
|
+
/* @__PURE__ */ (0, import_jsx_runtime62.jsx)("p", { children: emptyMessage }),
|
|
4474
|
+
palette[0] && /* @__PURE__ */ (0, import_jsx_runtime62.jsx)("button", { type: "button", className: "uix-btn uix-btn--primary", onClick: () => add(palette[0]), children: fillLabel(labels.addFirst, { label: palette[0].label }) })
|
|
4475
|
+
] }) : /* @__PURE__ */ (0, import_jsx_runtime62.jsx)("ol", { className: "uix-builder-canvas__items", children: items.map((item, index) => /* @__PURE__ */ (0, import_jsx_runtime62.jsxs)(
|
|
4334
4476
|
"li",
|
|
4335
4477
|
{
|
|
4336
4478
|
draggable: true,
|
|
@@ -4340,27 +4482,27 @@ function BuilderCanvas({
|
|
|
4340
4482
|
onDrop: (event) => drop(event, item.id),
|
|
4341
4483
|
className: cx("uix-builder-canvas__item", selectedId === item.id && "uix-builder-canvas__item--selected"),
|
|
4342
4484
|
children: [
|
|
4343
|
-
/* @__PURE__ */ (0,
|
|
4344
|
-
/* @__PURE__ */ (0,
|
|
4345
|
-
item.description && /* @__PURE__ */ (0,
|
|
4485
|
+
/* @__PURE__ */ (0, import_jsx_runtime62.jsx)("button", { type: "button", className: "uix-builder-canvas__item-main", "aria-pressed": selectedId === item.id, onClick: () => select(item.id), children: renderItem?.(item, selectedId === item.id) ?? /* @__PURE__ */ (0, import_jsx_runtime62.jsxs)(import_jsx_runtime62.Fragment, { children: [
|
|
4486
|
+
/* @__PURE__ */ (0, import_jsx_runtime62.jsx)("strong", { children: item.label }),
|
|
4487
|
+
item.description && /* @__PURE__ */ (0, import_jsx_runtime62.jsx)("span", { children: item.description })
|
|
4346
4488
|
] }) }),
|
|
4347
|
-
/* @__PURE__ */ (0,
|
|
4348
|
-
/* @__PURE__ */ (0,
|
|
4349
|
-
/* @__PURE__ */ (0,
|
|
4350
|
-
/* @__PURE__ */ (0,
|
|
4489
|
+
/* @__PURE__ */ (0, import_jsx_runtime62.jsxs)("span", { className: "uix-builder-canvas__item-actions", children: [
|
|
4490
|
+
/* @__PURE__ */ (0, import_jsx_runtime62.jsx)("button", { type: "button", onClick: () => move(item.id, -1), disabled: index === 0, "aria-label": fillLabel(labels.moveUpNamed, { label: item.label }), children: labels.moveUp }),
|
|
4491
|
+
/* @__PURE__ */ (0, import_jsx_runtime62.jsx)("button", { type: "button", onClick: () => move(item.id, 1), disabled: index === items.length - 1, "aria-label": fillLabel(labels.moveDownNamed, { label: item.label }), children: labels.moveDown }),
|
|
4492
|
+
/* @__PURE__ */ (0, import_jsx_runtime62.jsx)("button", { type: "button", onClick: () => remove(item.id), "aria-label": fillLabel(labels.removeNamed, { label: item.label }), children: labels.remove })
|
|
4351
4493
|
] })
|
|
4352
4494
|
]
|
|
4353
4495
|
},
|
|
4354
4496
|
item.id
|
|
4355
4497
|
)) })
|
|
4356
4498
|
] }),
|
|
4357
|
-
/* @__PURE__ */ (0,
|
|
4358
|
-
/* @__PURE__ */ (0,
|
|
4359
|
-
!selected ? /* @__PURE__ */ (0,
|
|
4360
|
-
/* @__PURE__ */ (0,
|
|
4361
|
-
/* @__PURE__ */ (0,
|
|
4362
|
-
/* @__PURE__ */ (0,
|
|
4363
|
-
/* @__PURE__ */ (0,
|
|
4499
|
+
/* @__PURE__ */ (0, import_jsx_runtime62.jsxs)("aside", { className: "uix-builder-canvas__properties", "aria-label": labels.properties, children: [
|
|
4500
|
+
/* @__PURE__ */ (0, import_jsx_runtime62.jsx)("h3", { ref: propertyHeadingRef, tabIndex: -1, children: labels.propertiesHeading }),
|
|
4501
|
+
!selected ? /* @__PURE__ */ (0, import_jsx_runtime62.jsx)("p", { children: labels.propertiesEmpty }) : renderProperties?.(selected, (updated) => onItemsChange(items.map((item) => item.id === updated.id ? updated : item))) ?? /* @__PURE__ */ (0, import_jsx_runtime62.jsxs)("dl", { children: [
|
|
4502
|
+
/* @__PURE__ */ (0, import_jsx_runtime62.jsx)("dt", { children: labels.type }),
|
|
4503
|
+
/* @__PURE__ */ (0, import_jsx_runtime62.jsx)("dd", { children: selected.type }),
|
|
4504
|
+
/* @__PURE__ */ (0, import_jsx_runtime62.jsx)("dt", { children: labels.label }),
|
|
4505
|
+
/* @__PURE__ */ (0, import_jsx_runtime62.jsx)("dd", { children: selected.label })
|
|
4364
4506
|
] })
|
|
4365
4507
|
] })
|
|
4366
4508
|
] });
|
|
@@ -4448,7 +4590,7 @@ function isDateUnavailable(date, options) {
|
|
|
4448
4590
|
}
|
|
4449
4591
|
|
|
4450
4592
|
// src/components/SchedulingCalendar.tsx
|
|
4451
|
-
var
|
|
4593
|
+
var import_jsx_runtime63 = require("react/jsx-runtime");
|
|
4452
4594
|
var DEFAULT_SCHEDULING_CALENDAR_LABELS = {
|
|
4453
4595
|
region: "Scheduling calendar in {timeZone}",
|
|
4454
4596
|
previous: "Previous",
|
|
@@ -4540,55 +4682,55 @@ function SchedulingCalendar({
|
|
|
4540
4682
|
return date >= span.start && date <= span.end;
|
|
4541
4683
|
});
|
|
4542
4684
|
const formatInstant = (instant) => new Intl.DateTimeFormat(locale, { timeZone, dateStyle: "medium", timeStyle: "short" }).format(new Date(instant));
|
|
4543
|
-
return /* @__PURE__ */ (0,
|
|
4544
|
-
/* @__PURE__ */ (0,
|
|
4545
|
-
/* @__PURE__ */ (0,
|
|
4546
|
-
/* @__PURE__ */ (0,
|
|
4547
|
-
/* @__PURE__ */ (0,
|
|
4685
|
+
return /* @__PURE__ */ (0, import_jsx_runtime63.jsxs)("section", { className: cx("uix-scheduling-calendar", className), "aria-label": fillLabel(labels.region, { timeZone }), children: [
|
|
4686
|
+
/* @__PURE__ */ (0, import_jsx_runtime63.jsxs)("div", { className: "uix-scheduling-calendar__header", children: [
|
|
4687
|
+
/* @__PURE__ */ (0, import_jsx_runtime63.jsxs)("div", { children: [
|
|
4688
|
+
/* @__PURE__ */ (0, import_jsx_runtime63.jsx)("button", { type: "button", className: "uix-btn uix-btn--ghost uix-btn--sm", onClick: () => movePeriod(-1), disabled: !onAnchorDateChange, children: labels.previous }),
|
|
4689
|
+
/* @__PURE__ */ (0, import_jsx_runtime63.jsx)("button", { type: "button", className: "uix-btn uix-btn--ghost uix-btn--sm", onClick: () => movePeriod(1), disabled: !onAnchorDateChange, children: labels.next })
|
|
4548
4690
|
] }),
|
|
4549
|
-
/* @__PURE__ */ (0,
|
|
4550
|
-
/* @__PURE__ */ (0,
|
|
4691
|
+
/* @__PURE__ */ (0, import_jsx_runtime63.jsx)("strong", { children: view === "month" ? new Intl.DateTimeFormat(locale, { month: "long", year: "numeric", timeZone: "UTC" }).format(/* @__PURE__ */ new Date(`${anchorDate}T00:00:00Z`)) : `${dateLabel(weekStart, locale)} \u2013 ${dateLabel(weekDays[weekDays.length - 1], locale)}` }),
|
|
4692
|
+
/* @__PURE__ */ (0, import_jsx_runtime63.jsx)("div", { className: "uix-segmented", role: "group", "aria-label": labels.viewGroup, children: ["month", "week", "agenda"].map((option) => /* @__PURE__ */ (0, import_jsx_runtime63.jsx)("button", { type: "button", className: "uix-segmented__option", "aria-pressed": view === option, "data-selected": view === option || void 0, onClick: () => setView(option), children: viewLabel[option] }, option)) })
|
|
4551
4693
|
] }),
|
|
4552
|
-
loading ? /* @__PURE__ */ (0,
|
|
4553
|
-
/* @__PURE__ */ (0,
|
|
4554
|
-
onRetry && /* @__PURE__ */ (0,
|
|
4555
|
-
] }) : view === "agenda" ? /* @__PURE__ */ (0,
|
|
4694
|
+
loading ? /* @__PURE__ */ (0, import_jsx_runtime63.jsx)("div", { className: "uix-scheduling-calendar__state", role: "status", children: labels.loading }) : error ? /* @__PURE__ */ (0, import_jsx_runtime63.jsxs)("div", { className: "uix-scheduling-calendar__state", role: "alert", children: [
|
|
4695
|
+
/* @__PURE__ */ (0, import_jsx_runtime63.jsx)("p", { children: error }),
|
|
4696
|
+
onRetry && /* @__PURE__ */ (0, import_jsx_runtime63.jsx)("button", { type: "button", className: "uix-btn uix-btn--secondary", onClick: onRetry, children: labels.retry })
|
|
4697
|
+
] }) : view === "agenda" ? /* @__PURE__ */ (0, import_jsx_runtime63.jsx)("div", { className: "uix-scheduling-calendar__agenda", role: "region", "aria-label": labels.agenda, children: visibleEntries.length === 0 ? /* @__PURE__ */ (0, import_jsx_runtime63.jsx)("p", { children: labels.agendaEmpty }) : /* @__PURE__ */ (0, import_jsx_runtime63.jsx)("ol", { children: [...visibleEntries].sort((a, b) => a.start.localeCompare(b.start)).map((entry) => {
|
|
4556
4698
|
const state = entry.state ?? "scheduled";
|
|
4557
|
-
return /* @__PURE__ */ (0,
|
|
4558
|
-
/* @__PURE__ */ (0,
|
|
4559
|
-
/* @__PURE__ */ (0,
|
|
4560
|
-
/* @__PURE__ */ (0,
|
|
4699
|
+
return /* @__PURE__ */ (0, import_jsx_runtime63.jsx)("li", { children: /* @__PURE__ */ (0, import_jsx_runtime63.jsxs)("button", { type: "button", onClick: () => onSelectEntry?.(entry), children: [
|
|
4700
|
+
/* @__PURE__ */ (0, import_jsx_runtime63.jsxs)("span", { children: [
|
|
4701
|
+
/* @__PURE__ */ (0, import_jsx_runtime63.jsx)("strong", { children: renderEntry?.(entry) ?? entry.title }),
|
|
4702
|
+
/* @__PURE__ */ (0, import_jsx_runtime63.jsxs)("span", { children: [
|
|
4561
4703
|
formatInstant(entry.start),
|
|
4562
4704
|
" \u2013 ",
|
|
4563
4705
|
formatInstant(entry.end)
|
|
4564
4706
|
] }),
|
|
4565
|
-
entry.meta && /* @__PURE__ */ (0,
|
|
4707
|
+
entry.meta && /* @__PURE__ */ (0, import_jsx_runtime63.jsx)("span", { children: entry.meta })
|
|
4566
4708
|
] }),
|
|
4567
|
-
/* @__PURE__ */ (0,
|
|
4709
|
+
/* @__PURE__ */ (0, import_jsx_runtime63.jsx)(StatusPill, { tone: stateTone(state), children: stateLabel[state] })
|
|
4568
4710
|
] }) }, entry.id);
|
|
4569
|
-
}) }) }) : /* @__PURE__ */ (0,
|
|
4711
|
+
}) }) }) : /* @__PURE__ */ (0, import_jsx_runtime63.jsx)("div", { ref: gridRef, className: cx("uix-scheduling-calendar__grid", view === "week" && "uix-scheduling-calendar__grid--week"), role: "group", "aria-label": fillLabel(labels.grid, { view: viewLabel[view] }), children: days.map((date, index) => {
|
|
4570
4712
|
const dayEntries = entriesFor(date);
|
|
4571
4713
|
const dayOverlays = overlaysFor(date);
|
|
4572
|
-
return /* @__PURE__ */ (0,
|
|
4573
|
-
/* @__PURE__ */ (0,
|
|
4574
|
-
dayOverlays.map((overlay) => /* @__PURE__ */ (0,
|
|
4575
|
-
/* @__PURE__ */ (0,
|
|
4714
|
+
return /* @__PURE__ */ (0, import_jsx_runtime63.jsxs)("div", { className: "uix-scheduling-calendar__day", "data-outside": view === "month" && !monthDays[index].inMonth || void 0, children: [
|
|
4715
|
+
/* @__PURE__ */ (0, import_jsx_runtime63.jsx)("button", { type: "button", className: "uix-scheduling-calendar__date", "data-calendar-date": date, tabIndex: activeDate === date ? 0 : -1, onFocus: () => setActiveDate(date), onKeyDown: (event) => onDayKeyDown(event, date), "aria-label": dateLabel(date, locale), children: Number(date.slice(-2)) }),
|
|
4716
|
+
dayOverlays.map((overlay) => /* @__PURE__ */ (0, import_jsx_runtime63.jsx)("span", { className: "uix-scheduling-calendar__overlay", "data-kind": overlay.kind, children: overlay.label }, overlay.id)),
|
|
4717
|
+
/* @__PURE__ */ (0, import_jsx_runtime63.jsx)("div", { className: "uix-scheduling-calendar__entries", children: dayEntries.map((entry) => {
|
|
4576
4718
|
const span = entrySpans.get(entry.id);
|
|
4577
4719
|
const state = entry.state ?? "scheduled";
|
|
4578
|
-
return /* @__PURE__ */ (0,
|
|
4579
|
-
/* @__PURE__ */ (0,
|
|
4580
|
-
/* @__PURE__ */ (0,
|
|
4720
|
+
return /* @__PURE__ */ (0, import_jsx_runtime63.jsxs)("button", { type: "button", className: "uix-scheduling-calendar__entry", "data-state": state, "data-range-start": date === span.start || void 0, "data-range-end": date === span.end || void 0, onClick: () => onSelectEntry?.(entry), "aria-label": fillLabel(labels.entry, { title: entry.title, state: stateLabel[state], start: formatInstant(entry.start), end: formatInstant(entry.end) }), children: [
|
|
4721
|
+
/* @__PURE__ */ (0, import_jsx_runtime63.jsx)("span", { children: renderEntry?.(entry) ?? entry.title }),
|
|
4722
|
+
/* @__PURE__ */ (0, import_jsx_runtime63.jsx)("span", { className: "uix-visually-hidden", children: stateLabel[state] })
|
|
4581
4723
|
] }, entry.id);
|
|
4582
4724
|
}) })
|
|
4583
4725
|
] }, date);
|
|
4584
4726
|
}) }),
|
|
4585
|
-
/* @__PURE__ */ (0,
|
|
4727
|
+
/* @__PURE__ */ (0, import_jsx_runtime63.jsx)("div", { className: "uix-scheduling-calendar__legend", "aria-label": labels.legend, children: ["scheduled", "conflicted", "in-progress", "blackout-violation"].map((state) => /* @__PURE__ */ (0, import_jsx_runtime63.jsx)("span", { "data-state": state, children: stateLabel[state] }, state)) })
|
|
4586
4728
|
] });
|
|
4587
4729
|
}
|
|
4588
4730
|
|
|
4589
4731
|
// src/components/DateRangePicker.tsx
|
|
4590
4732
|
var import_react42 = require("react");
|
|
4591
|
-
var
|
|
4733
|
+
var import_jsx_runtime64 = require("react/jsx-runtime");
|
|
4592
4734
|
var DEFAULT_DATE_RANGE_PICKER_LABELS = {
|
|
4593
4735
|
previous: "Previous",
|
|
4594
4736
|
previousMonth: "Show previous month",
|
|
@@ -4682,23 +4824,23 @@ function DateRangePicker({
|
|
|
4682
4824
|
}
|
|
4683
4825
|
};
|
|
4684
4826
|
const announcement = !value.start ? labels.noneSelected : !value.end ? labels.startSelected.replace("{start}", dateLabel2(value.start, locale)) : labels.rangeSelected.replace("{start}", dateLabel2(value.start, locale)).replace("{end}", dateLabel2(value.end, locale));
|
|
4685
|
-
return /* @__PURE__ */ (0,
|
|
4686
|
-
/* @__PURE__ */ (0,
|
|
4687
|
-
/* @__PURE__ */ (0,
|
|
4688
|
-
/* @__PURE__ */ (0,
|
|
4689
|
-
/* @__PURE__ */ (0,
|
|
4690
|
-
/* @__PURE__ */ (0,
|
|
4827
|
+
return /* @__PURE__ */ (0, import_jsx_runtime64.jsxs)("section", { className: cx("uix-date-range-picker", rangeInvalid && "uix-date-range-picker--invalid", className), "aria-labelledby": `${id}-label`, children: [
|
|
4828
|
+
/* @__PURE__ */ (0, import_jsx_runtime64.jsxs)("div", { className: "uix-date-range-picker__header", children: [
|
|
4829
|
+
/* @__PURE__ */ (0, import_jsx_runtime64.jsx)("h3", { id: `${id}-label`, children: label }),
|
|
4830
|
+
/* @__PURE__ */ (0, import_jsx_runtime64.jsxs)("div", { children: [
|
|
4831
|
+
/* @__PURE__ */ (0, import_jsx_runtime64.jsx)("button", { type: "button", className: "uix-btn uix-btn--ghost uix-btn--sm", onClick: () => setMonth(addCalendarMonths(visibleMonth, -1)), "aria-label": labels.previousMonth, children: labels.previous }),
|
|
4832
|
+
/* @__PURE__ */ (0, import_jsx_runtime64.jsx)("button", { type: "button", className: "uix-btn uix-btn--ghost uix-btn--sm", onClick: () => setMonth(addCalendarMonths(visibleMonth, 1)), "aria-label": labels.nextMonth, children: labels.next })
|
|
4691
4833
|
] })
|
|
4692
4834
|
] }),
|
|
4693
|
-
/* @__PURE__ */ (0,
|
|
4694
|
-
/* @__PURE__ */ (0,
|
|
4695
|
-
/* @__PURE__ */ (0,
|
|
4696
|
-
/* @__PURE__ */ (0,
|
|
4697
|
-
Array.from({ length: ((/* @__PURE__ */ new Date(`${month}T00:00:00Z`)).getUTCDay() + 6) % 7 }, (_, index) => /* @__PURE__ */ (0,
|
|
4835
|
+
/* @__PURE__ */ (0, import_jsx_runtime64.jsx)("div", { ref: rootRef, className: "uix-date-range-picker__months", children: calendars.map(({ month, days }) => /* @__PURE__ */ (0, import_jsx_runtime64.jsxs)("div", { className: "uix-date-range-picker__month", children: [
|
|
4836
|
+
/* @__PURE__ */ (0, import_jsx_runtime64.jsx)("h4", { children: monthLabel(month, locale) }),
|
|
4837
|
+
/* @__PURE__ */ (0, import_jsx_runtime64.jsx)("div", { className: "uix-date-range-picker__weekdays", "aria-hidden": "true", children: weekdays.map((day, index) => /* @__PURE__ */ (0, import_jsx_runtime64.jsx)("span", { children: day }, index)) }),
|
|
4838
|
+
/* @__PURE__ */ (0, import_jsx_runtime64.jsxs)("div", { className: "uix-date-range-picker__grid", role: "group", "aria-label": monthLabel(month, locale), children: [
|
|
4839
|
+
Array.from({ length: ((/* @__PURE__ */ new Date(`${month}T00:00:00Z`)).getUTCDay() + 6) % 7 }, (_, index) => /* @__PURE__ */ (0, import_jsx_runtime64.jsx)("span", { "aria-hidden": "true" }, `blank-${index}`)),
|
|
4698
4840
|
days.map((day) => {
|
|
4699
4841
|
const unavailable = disabled || isDateUnavailable(day.date, { min, max, isDisabled: isDateDisabled });
|
|
4700
4842
|
const edge = day.date === value.start ? "start" : day.date === value.end ? "end" : void 0;
|
|
4701
|
-
return /* @__PURE__ */ (0,
|
|
4843
|
+
return /* @__PURE__ */ (0, import_jsx_runtime64.jsx)(
|
|
4702
4844
|
"button",
|
|
4703
4845
|
{
|
|
4704
4846
|
type: "button",
|
|
@@ -4719,8 +4861,8 @@ function DateRangePicker({
|
|
|
4719
4861
|
})
|
|
4720
4862
|
] })
|
|
4721
4863
|
] }, month)) }),
|
|
4722
|
-
/* @__PURE__ */ (0,
|
|
4723
|
-
rangeInvalid && /* @__PURE__ */ (0,
|
|
4864
|
+
/* @__PURE__ */ (0, import_jsx_runtime64.jsx)("p", { className: "uix-date-range-picker__selection", "aria-live": "polite", children: announcement }),
|
|
4865
|
+
rangeInvalid && /* @__PURE__ */ (0, import_jsx_runtime64.jsx)("p", { className: "uix-field__error", role: "alert", children: invalidMessage })
|
|
4724
4866
|
] });
|
|
4725
4867
|
}
|
|
4726
4868
|
|
|
@@ -5209,7 +5351,7 @@ function layeredNeighbor(layout, currentId, key) {
|
|
|
5209
5351
|
var import_react43 = require("react");
|
|
5210
5352
|
|
|
5211
5353
|
// src/components/RelationshipGraphList.tsx
|
|
5212
|
-
var
|
|
5354
|
+
var import_jsx_runtime65 = require("react/jsx-runtime");
|
|
5213
5355
|
function EquivalentRelationshipList({
|
|
5214
5356
|
nodes,
|
|
5215
5357
|
edges,
|
|
@@ -5220,19 +5362,19 @@ function EquivalentRelationshipList({
|
|
|
5220
5362
|
onOpenDetails
|
|
5221
5363
|
}) {
|
|
5222
5364
|
const labelById = new Map(nodes.map((node) => [node.id, node.label]));
|
|
5223
|
-
return /* @__PURE__ */ (0,
|
|
5224
|
-
/* @__PURE__ */ (0,
|
|
5225
|
-
/* @__PURE__ */ (0,
|
|
5365
|
+
return /* @__PURE__ */ (0, import_jsx_runtime65.jsxs)("div", { className: "uix-relationship-graph__list", role: "region", "aria-label": labels.list, children: [
|
|
5366
|
+
/* @__PURE__ */ (0, import_jsx_runtime65.jsx)("h3", { children: labels.listHeading }),
|
|
5367
|
+
/* @__PURE__ */ (0, import_jsx_runtime65.jsx)("ul", { children: nodes.map((node) => {
|
|
5226
5368
|
const neighbors = relationshipNeighbors(node.id, edges).map((id) => labelById.get(id) ?? id);
|
|
5227
|
-
return /* @__PURE__ */ (0,
|
|
5228
|
-
/* @__PURE__ */ (0,
|
|
5229
|
-
/* @__PURE__ */ (0,
|
|
5230
|
-
node.type && /* @__PURE__ */ (0,
|
|
5231
|
-
/* @__PURE__ */ (0,
|
|
5369
|
+
return /* @__PURE__ */ (0, import_jsx_runtime65.jsxs)("li", { "data-selected": selectedId === node.id || void 0, children: [
|
|
5370
|
+
/* @__PURE__ */ (0, import_jsx_runtime65.jsxs)("button", { type: "button", onClick: () => onSelect(node.id), "aria-pressed": selectedId === node.id, children: [
|
|
5371
|
+
/* @__PURE__ */ (0, import_jsx_runtime65.jsx)("strong", { children: node.label }),
|
|
5372
|
+
node.type && /* @__PURE__ */ (0, import_jsx_runtime65.jsx)("span", { children: node.type }),
|
|
5373
|
+
/* @__PURE__ */ (0, import_jsx_runtime65.jsx)("span", { children: neighbors.length ? labels.connectedTo(neighbors.join(", ")) : labels.noConnections })
|
|
5232
5374
|
] }),
|
|
5233
|
-
/* @__PURE__ */ (0,
|
|
5234
|
-
onExpandNeighbors && /* @__PURE__ */ (0,
|
|
5235
|
-
onOpenDetails && /* @__PURE__ */ (0,
|
|
5375
|
+
/* @__PURE__ */ (0, import_jsx_runtime65.jsxs)("span", { className: "uix-relationship-graph__list-actions", children: [
|
|
5376
|
+
onExpandNeighbors && /* @__PURE__ */ (0, import_jsx_runtime65.jsx)("button", { type: "button", onClick: () => onExpandNeighbors(node), children: labels.expandNeighbors }),
|
|
5377
|
+
onOpenDetails && /* @__PURE__ */ (0, import_jsx_runtime65.jsx)("button", { type: "button", onClick: () => onOpenDetails(node), children: labels.openDetails })
|
|
5236
5378
|
] })
|
|
5237
5379
|
] }, node.id);
|
|
5238
5380
|
}) })
|
|
@@ -5240,7 +5382,7 @@ function EquivalentRelationshipList({
|
|
|
5240
5382
|
}
|
|
5241
5383
|
|
|
5242
5384
|
// src/components/RelationshipGraphLayered.tsx
|
|
5243
|
-
var
|
|
5385
|
+
var import_jsx_runtime66 = require("react/jsx-runtime");
|
|
5244
5386
|
var EMPTY_IDS = /* @__PURE__ */ new Set();
|
|
5245
5387
|
var MIN_ZOOM = 0.4;
|
|
5246
5388
|
var MAX_ZOOM = 1.5;
|
|
@@ -5513,21 +5655,21 @@ function LayeredRelationshipGraph({
|
|
|
5513
5655
|
height: layout.height,
|
|
5514
5656
|
transform: `translate(${view.x}px, ${view.y}px) scale(${view.zoom})`
|
|
5515
5657
|
};
|
|
5516
|
-
return /* @__PURE__ */ (0,
|
|
5517
|
-
/* @__PURE__ */ (0,
|
|
5518
|
-
/* @__PURE__ */ (0,
|
|
5519
|
-
/* @__PURE__ */ (0,
|
|
5520
|
-
/* @__PURE__ */ (0,
|
|
5521
|
-
/* @__PURE__ */ (0,
|
|
5522
|
-
/* @__PURE__ */ (0,
|
|
5523
|
-
/* @__PURE__ */ (0,
|
|
5524
|
-
/* @__PURE__ */ (0,
|
|
5525
|
-
/* @__PURE__ */ (0,
|
|
5526
|
-
/* @__PURE__ */ (0,
|
|
5658
|
+
return /* @__PURE__ */ (0, import_jsx_runtime66.jsxs)("section", { className: cx("uix-relationship-graph", "uix-relationship-graph--layered", density === "compact" && "uix-relationship-graph--compact", className), "aria-label": labels.graph, children: [
|
|
5659
|
+
/* @__PURE__ */ (0, import_jsx_runtime66.jsxs)("div", { className: "uix-relationship-graph__toolbar", role: "group", "aria-label": labels.controls, children: [
|
|
5660
|
+
/* @__PURE__ */ (0, import_jsx_runtime66.jsx)("button", { type: "button", onClick: () => zoomBy(ZOOM_STEP), disabled: view.zoom >= MAX_ZOOM, children: labels.zoomIn }),
|
|
5661
|
+
/* @__PURE__ */ (0, import_jsx_runtime66.jsx)("button", { type: "button", onClick: () => zoomBy(1 / ZOOM_STEP), disabled: view.zoom <= MIN_ZOOM, children: labels.zoomOut }),
|
|
5662
|
+
/* @__PURE__ */ (0, import_jsx_runtime66.jsx)("button", { type: "button", onClick: () => moveView(fitView(layout, size), true), children: labels.fit }),
|
|
5663
|
+
/* @__PURE__ */ (0, import_jsx_runtime66.jsx)("button", { type: "button", onClick: () => moveView(initialView(layout, size), true), children: labels.reset }),
|
|
5664
|
+
/* @__PURE__ */ (0, import_jsx_runtime66.jsx)("button", { type: "button", onClick: () => panBy(PAN_STEP, 0), "aria-label": labels.panLeft, children: labels.left }),
|
|
5665
|
+
/* @__PURE__ */ (0, import_jsx_runtime66.jsx)("button", { type: "button", onClick: () => panBy(0, PAN_STEP), "aria-label": labels.panUp, children: labels.up }),
|
|
5666
|
+
/* @__PURE__ */ (0, import_jsx_runtime66.jsx)("button", { type: "button", onClick: () => panBy(0, -PAN_STEP), "aria-label": labels.panDown, children: labels.down }),
|
|
5667
|
+
/* @__PURE__ */ (0, import_jsx_runtime66.jsx)("button", { type: "button", onClick: () => panBy(-PAN_STEP, 0), "aria-label": labels.panRight, children: labels.right }),
|
|
5668
|
+
/* @__PURE__ */ (0, import_jsx_runtime66.jsx)("span", { "aria-live": "polite", children: labels.zoomLevel(Math.round(view.zoom * 100)) })
|
|
5527
5669
|
] }),
|
|
5528
|
-
bounded.omittedNodeCount > 0 && /* @__PURE__ */ (0,
|
|
5529
|
-
/* @__PURE__ */ (0,
|
|
5530
|
-
/* @__PURE__ */ (0,
|
|
5670
|
+
bounded.omittedNodeCount > 0 && /* @__PURE__ */ (0, import_jsx_runtime66.jsx)("p", { className: "uix-relationship-graph__bounded", role: "status", children: labels.bounded(bounded.nodes.length, bounded.omittedNodeCount) }),
|
|
5671
|
+
/* @__PURE__ */ (0, import_jsx_runtime66.jsx)("p", { id: hintId, className: "uix-visually-hidden", children: labels.keyboardHint }),
|
|
5672
|
+
/* @__PURE__ */ (0, import_jsx_runtime66.jsx)(
|
|
5531
5673
|
"div",
|
|
5532
5674
|
{
|
|
5533
5675
|
ref: viewportRef,
|
|
@@ -5537,11 +5679,11 @@ function LayeredRelationshipGraph({
|
|
|
5537
5679
|
onPointerMove,
|
|
5538
5680
|
onPointerUp: onPointerEnd,
|
|
5539
5681
|
onPointerCancel: onPointerEnd,
|
|
5540
|
-
children: /* @__PURE__ */ (0,
|
|
5541
|
-
/* @__PURE__ */ (0,
|
|
5682
|
+
children: /* @__PURE__ */ (0, import_jsx_runtime66.jsxs)("div", { className: "uix-relationship-graph__stage", style: stageStyle, "data-animate": animate || void 0, onTransitionEnd: () => setAnimate(false), children: [
|
|
5683
|
+
/* @__PURE__ */ (0, import_jsx_runtime66.jsx)("svg", { className: "uix-relationship-graph__edges", width: layout.width, height: layout.height, "aria-hidden": "true", focusable: "false", children: layout.edges.map((edge) => {
|
|
5542
5684
|
const active = activeIds.has(edge.source) || activeIds.has(edge.target) || edge.edgeIds.some((id) => highlightedEdgeIds.has(id));
|
|
5543
5685
|
const angle = edge.arrowAngle * 180 / Math.PI;
|
|
5544
|
-
return /* @__PURE__ */ (0,
|
|
5686
|
+
return /* @__PURE__ */ (0, import_jsx_runtime66.jsxs)(
|
|
5545
5687
|
"g",
|
|
5546
5688
|
{
|
|
5547
5689
|
className: "uix-relationship-graph__link",
|
|
@@ -5551,15 +5693,15 @@ function LayeredRelationshipGraph({
|
|
|
5551
5693
|
"data-conflicted": edge.edgeIds.some((id) => conflictedEdgeIds.has(id)) || void 0,
|
|
5552
5694
|
"data-dimmed": dimmedNodeIds.has(edge.source) && dimmedNodeIds.has(edge.target) || void 0,
|
|
5553
5695
|
children: [
|
|
5554
|
-
/* @__PURE__ */ (0,
|
|
5555
|
-
edge.arrow !== "none" && /* @__PURE__ */ (0,
|
|
5556
|
-
showLabel(edge) && /* @__PURE__ */ (0,
|
|
5696
|
+
/* @__PURE__ */ (0, import_jsx_runtime66.jsx)("path", { d: edge.path }),
|
|
5697
|
+
edge.arrow !== "none" && /* @__PURE__ */ (0, import_jsx_runtime66.jsx)("polygon", { points: arrowPoints, transform: `translate(${edge.arrowX} ${edge.arrowY}) rotate(${angle})` }),
|
|
5698
|
+
showLabel(edge) && /* @__PURE__ */ (0, import_jsx_runtime66.jsx)("text", { x: edge.labelX, y: edge.labelY, textAnchor: "middle", dominantBaseline: "middle", children: (edge.kind === "cycle" ? [...edge.labelLines, labels.cycle] : edge.labelLines).map((line, index, lines) => /* @__PURE__ */ (0, import_jsx_runtime66.jsx)("tspan", { x: edge.labelX, dy: index === 0 ? `${-(lines.length - 1) * 0.55}em` : "1.1em", children: line }, index)) })
|
|
5557
5699
|
]
|
|
5558
5700
|
},
|
|
5559
5701
|
edge.id
|
|
5560
5702
|
);
|
|
5561
5703
|
}) }),
|
|
5562
|
-
layout.columns.map((column) => /* @__PURE__ */ (0,
|
|
5704
|
+
layout.columns.map((column) => /* @__PURE__ */ (0, import_jsx_runtime66.jsx)(
|
|
5563
5705
|
"div",
|
|
5564
5706
|
{
|
|
5565
5707
|
className: "uix-relationship-graph__column",
|
|
@@ -5569,17 +5711,17 @@ function LayeredRelationshipGraph({
|
|
|
5569
5711
|
},
|
|
5570
5712
|
column.depth
|
|
5571
5713
|
)),
|
|
5572
|
-
/* @__PURE__ */ (0,
|
|
5714
|
+
/* @__PURE__ */ (0, import_jsx_runtime66.jsx)("div", { role: "group", "aria-roledescription": labels.roleDescription, "aria-label": labels.graphSummary(bounded.nodes.length, bounded.edges.length), "aria-describedby": hintId, children: layout.items.map((item) => {
|
|
5573
5715
|
const selected = item.id === selectedItemId;
|
|
5574
5716
|
const dimmed = item.node ? dimmedNodeIds.has(item.node.id) : item.cluster.members.every((member) => dimmedNodeIds.has(member.id));
|
|
5575
|
-
const body = item.cluster ? renderCluster?.(item.cluster) ?? /* @__PURE__ */ (0,
|
|
5576
|
-
/* @__PURE__ */ (0,
|
|
5577
|
-
/* @__PURE__ */ (0,
|
|
5578
|
-
] }) : renderNode?.(item.node, { selected, dimmed }) ?? /* @__PURE__ */ (0,
|
|
5579
|
-
/* @__PURE__ */ (0,
|
|
5580
|
-
(item.node.type || item.node.description) && /* @__PURE__ */ (0,
|
|
5717
|
+
const body = item.cluster ? renderCluster?.(item.cluster) ?? /* @__PURE__ */ (0, import_jsx_runtime66.jsxs)(import_jsx_runtime66.Fragment, { children: [
|
|
5718
|
+
/* @__PURE__ */ (0, import_jsx_runtime66.jsx)("span", { className: "uix-relationship-graph__item-label", children: labels.cluster(item.cluster.members.length, item.cluster.type, item.cluster.edgeLabel) }),
|
|
5719
|
+
/* @__PURE__ */ (0, import_jsx_runtime66.jsx)("span", { className: "uix-relationship-graph__item-meta", children: labels.expandCluster })
|
|
5720
|
+
] }) : renderNode?.(item.node, { selected, dimmed }) ?? /* @__PURE__ */ (0, import_jsx_runtime66.jsxs)(import_jsx_runtime66.Fragment, { children: [
|
|
5721
|
+
/* @__PURE__ */ (0, import_jsx_runtime66.jsx)("span", { className: "uix-relationship-graph__item-label", children: item.node.label }),
|
|
5722
|
+
(item.node.type || item.node.description) && /* @__PURE__ */ (0, import_jsx_runtime66.jsx)("span", { className: "uix-relationship-graph__item-meta", children: [item.node.type, item.node.description].filter(Boolean).join(" \xB7 ") })
|
|
5581
5723
|
] });
|
|
5582
|
-
return /* @__PURE__ */ (0,
|
|
5724
|
+
return /* @__PURE__ */ (0, import_jsx_runtime66.jsxs)(
|
|
5583
5725
|
"button",
|
|
5584
5726
|
{
|
|
5585
5727
|
ref: (element) => {
|
|
@@ -5610,7 +5752,7 @@ function LayeredRelationshipGraph({
|
|
|
5610
5752
|
onPointerLeave: () => setHoverId((current) => current === item.id ? void 0 : current),
|
|
5611
5753
|
children: [
|
|
5612
5754
|
body,
|
|
5613
|
-
item.inCycle && /* @__PURE__ */ (0,
|
|
5755
|
+
item.inCycle && /* @__PURE__ */ (0, import_jsx_runtime66.jsx)("span", { className: "uix-relationship-graph__item-flag", "aria-hidden": "true", children: labels.cycle })
|
|
5614
5756
|
]
|
|
5615
5757
|
},
|
|
5616
5758
|
item.id
|
|
@@ -5618,7 +5760,7 @@ function LayeredRelationshipGraph({
|
|
|
5618
5760
|
}) }),
|
|
5619
5761
|
layout.items.filter((item) => item.expandedGroup).map((item) => {
|
|
5620
5762
|
const group = item.expandedGroup;
|
|
5621
|
-
return /* @__PURE__ */ (0,
|
|
5763
|
+
return /* @__PURE__ */ (0, import_jsx_runtime66.jsx)(
|
|
5622
5764
|
"button",
|
|
5623
5765
|
{
|
|
5624
5766
|
type: "button",
|
|
@@ -5634,8 +5776,8 @@ function LayeredRelationshipGraph({
|
|
|
5634
5776
|
] })
|
|
5635
5777
|
}
|
|
5636
5778
|
),
|
|
5637
|
-
legend.length > 0 && /* @__PURE__ */ (0,
|
|
5638
|
-
showList && /* @__PURE__ */ (0,
|
|
5779
|
+
legend.length > 0 && /* @__PURE__ */ (0, import_jsx_runtime66.jsx)("ul", { className: "uix-relationship-graph__legend", "aria-label": labels.legend, children: legend.map((entry) => /* @__PURE__ */ (0, import_jsx_runtime66.jsx)("li", { "data-type": entry.id, children: entry.label }, entry.id)) }),
|
|
5780
|
+
showList && /* @__PURE__ */ (0, import_jsx_runtime66.jsx)(
|
|
5639
5781
|
EquivalentRelationshipList,
|
|
5640
5782
|
{
|
|
5641
5783
|
nodes: bounded.nodes,
|
|
@@ -5654,7 +5796,7 @@ function LayeredRelationshipGraph({
|
|
|
5654
5796
|
}
|
|
5655
5797
|
|
|
5656
5798
|
// src/components/RelationshipGraph.tsx
|
|
5657
|
-
var
|
|
5799
|
+
var import_jsx_runtime67 = require("react/jsx-runtime");
|
|
5658
5800
|
var DEFAULT_RELATIONSHIP_GRAPH_LABELS = {
|
|
5659
5801
|
graph: "Relationship graph",
|
|
5660
5802
|
controls: "Graph view controls",
|
|
@@ -5718,19 +5860,19 @@ function radialViewBox(nodes) {
|
|
|
5718
5860
|
function RelationshipGraph(props) {
|
|
5719
5861
|
const labels = (0, import_react44.useMemo)(() => ({ ...DEFAULT_RELATIONSHIP_GRAPH_LABELS, ...props.labels }), [props.labels]);
|
|
5720
5862
|
const stateClass = cx("uix-relationship-graph uix-relationship-graph--state", props.className);
|
|
5721
|
-
if (props.loading) return /* @__PURE__ */ (0,
|
|
5863
|
+
if (props.loading) return /* @__PURE__ */ (0, import_jsx_runtime67.jsx)("div", { className: stateClass, role: "status", children: labels.loading });
|
|
5722
5864
|
if (props.error) {
|
|
5723
|
-
return /* @__PURE__ */ (0,
|
|
5724
|
-
/* @__PURE__ */ (0,
|
|
5725
|
-
props.onRetry && /* @__PURE__ */ (0,
|
|
5865
|
+
return /* @__PURE__ */ (0, import_jsx_runtime67.jsxs)("div", { className: stateClass, role: "alert", children: [
|
|
5866
|
+
/* @__PURE__ */ (0, import_jsx_runtime67.jsx)("p", { children: props.error }),
|
|
5867
|
+
props.onRetry && /* @__PURE__ */ (0, import_jsx_runtime67.jsx)("button", { type: "button", className: "uix-btn uix-btn--secondary", onClick: props.onRetry, children: labels.retry })
|
|
5726
5868
|
] });
|
|
5727
5869
|
}
|
|
5728
|
-
if (props.nodes.length === 0) return /* @__PURE__ */ (0,
|
|
5729
|
-
/* @__PURE__ */ (0,
|
|
5730
|
-
/* @__PURE__ */ (0,
|
|
5870
|
+
if (props.nodes.length === 0) return /* @__PURE__ */ (0, import_jsx_runtime67.jsxs)("div", { className: stateClass, children: [
|
|
5871
|
+
/* @__PURE__ */ (0, import_jsx_runtime67.jsx)("p", { children: labels.emptyTitle }),
|
|
5872
|
+
/* @__PURE__ */ (0, import_jsx_runtime67.jsx)("p", { children: labels.emptyHint })
|
|
5731
5873
|
] });
|
|
5732
|
-
if (props.layout === "layered") return /* @__PURE__ */ (0,
|
|
5733
|
-
return /* @__PURE__ */ (0,
|
|
5874
|
+
if (props.layout === "layered") return /* @__PURE__ */ (0, import_jsx_runtime67.jsx)(LayeredRelationshipGraph, { ...props, labels });
|
|
5875
|
+
return /* @__PURE__ */ (0, import_jsx_runtime67.jsx)(RadialRelationshipGraph, { ...props, labels });
|
|
5734
5876
|
}
|
|
5735
5877
|
function RadialRelationshipGraph({
|
|
5736
5878
|
nodes,
|
|
@@ -5783,25 +5925,25 @@ function RadialRelationshipGraph({
|
|
|
5783
5925
|
setZoom(1);
|
|
5784
5926
|
setPan({ x: 0, y: 0 });
|
|
5785
5927
|
};
|
|
5786
|
-
return /* @__PURE__ */ (0,
|
|
5787
|
-
/* @__PURE__ */ (0,
|
|
5788
|
-
/* @__PURE__ */ (0,
|
|
5789
|
-
/* @__PURE__ */ (0,
|
|
5790
|
-
/* @__PURE__ */ (0,
|
|
5791
|
-
/* @__PURE__ */ (0,
|
|
5792
|
-
/* @__PURE__ */ (0,
|
|
5793
|
-
/* @__PURE__ */ (0,
|
|
5794
|
-
/* @__PURE__ */ (0,
|
|
5795
|
-
/* @__PURE__ */ (0,
|
|
5928
|
+
return /* @__PURE__ */ (0, import_jsx_runtime67.jsxs)("section", { className: cx("uix-relationship-graph", `uix-relationship-graph--${density}`, className), "aria-label": labels.graph, children: [
|
|
5929
|
+
/* @__PURE__ */ (0, import_jsx_runtime67.jsxs)("div", { className: "uix-relationship-graph__toolbar", "aria-label": labels.controls, children: [
|
|
5930
|
+
/* @__PURE__ */ (0, import_jsx_runtime67.jsx)("button", { type: "button", onClick: () => setPan((value) => ({ ...value, x: value.x - 24 })), "aria-label": labels.panLeft, children: labels.left }),
|
|
5931
|
+
/* @__PURE__ */ (0, import_jsx_runtime67.jsx)("button", { type: "button", onClick: () => setPan((value) => ({ ...value, y: value.y - 24 })), "aria-label": labels.panUp, children: labels.up }),
|
|
5932
|
+
/* @__PURE__ */ (0, import_jsx_runtime67.jsx)("button", { type: "button", onClick: () => setPan((value) => ({ ...value, y: value.y + 24 })), "aria-label": labels.panDown, children: labels.down }),
|
|
5933
|
+
/* @__PURE__ */ (0, import_jsx_runtime67.jsx)("button", { type: "button", onClick: () => setPan((value) => ({ ...value, x: value.x + 24 })), "aria-label": labels.panRight, children: labels.right }),
|
|
5934
|
+
/* @__PURE__ */ (0, import_jsx_runtime67.jsx)("button", { type: "button", onClick: () => setZoom((value) => Math.min(2, Number((value + 0.2).toFixed(1)))), "aria-label": labels.zoomIn, children: labels.zoomIn }),
|
|
5935
|
+
/* @__PURE__ */ (0, import_jsx_runtime67.jsx)("button", { type: "button", onClick: () => setZoom((value) => Math.max(0.5, Number((value - 0.2).toFixed(1)))), "aria-label": labels.zoomOut, children: labels.zoomOut }),
|
|
5936
|
+
/* @__PURE__ */ (0, import_jsx_runtime67.jsx)("button", { type: "button", onClick: reset, children: labels.reset }),
|
|
5937
|
+
/* @__PURE__ */ (0, import_jsx_runtime67.jsx)("span", { "aria-live": "polite", children: labels.zoomLevel(Math.round(zoom * 100)) })
|
|
5796
5938
|
] }),
|
|
5797
|
-
bounded.omittedNodeCount > 0 && /* @__PURE__ */ (0,
|
|
5798
|
-
/* @__PURE__ */ (0,
|
|
5939
|
+
bounded.omittedNodeCount > 0 && /* @__PURE__ */ (0, import_jsx_runtime67.jsx)("p", { className: "uix-relationship-graph__bounded", role: "status", children: labels.bounded(bounded.nodes.length, bounded.omittedNodeCount) }),
|
|
5940
|
+
/* @__PURE__ */ (0, import_jsx_runtime67.jsx)("div", { className: "uix-relationship-graph__visual", children: /* @__PURE__ */ (0, import_jsx_runtime67.jsx)("svg", { ref: svgRef, viewBox: radialViewBox(positioned), role: "group", "aria-label": labels.graphSummary(bounded.nodes.length, bounded.edges.length), children: /* @__PURE__ */ (0, import_jsx_runtime67.jsxs)("g", { transform: `translate(${pan.x} ${pan.y}) scale(${zoom})`, children: [
|
|
5799
5941
|
bounded.edges.map((edge) => {
|
|
5800
5942
|
const source = positionedById.get(edge.source);
|
|
5801
5943
|
const target = positionedById.get(edge.target);
|
|
5802
|
-
return /* @__PURE__ */ (0,
|
|
5944
|
+
return /* @__PURE__ */ (0, import_jsx_runtime67.jsx)("line", { x1: source.x * RADIAL_SCALE_X, y1: source.y * RADIAL_SCALE_Y, x2: target.x * RADIAL_SCALE_X, y2: target.y * RADIAL_SCALE_Y, className: "uix-relationship-graph__edge", "data-typed": edge.type != null && typeColor.has(edge.type) || void 0, style: edge.type != null && typeColor.has(edge.type) ? { "--uix-graph-type-color": typeColor.get(edge.type) } : void 0, "data-highlighted": highlightedEdgeIds.has(edge.id) || void 0, "data-conflicted": conflictedEdgeIds.has(edge.id) || void 0, children: /* @__PURE__ */ (0, import_jsx_runtime67.jsx)("title", { children: edge.label ?? edge.type ?? labels.relationship }) }, edge.id);
|
|
5803
5945
|
}),
|
|
5804
|
-
positioned.map((node) => /* @__PURE__ */ (0,
|
|
5946
|
+
positioned.map((node) => /* @__PURE__ */ (0, import_jsx_runtime67.jsxs)(
|
|
5805
5947
|
"g",
|
|
5806
5948
|
{
|
|
5807
5949
|
transform: `translate(${node.x * RADIAL_SCALE_X} ${node.y * RADIAL_SCALE_Y})`,
|
|
@@ -5817,22 +5959,22 @@ function RadialRelationshipGraph({
|
|
|
5817
5959
|
onKeyDown: (event) => onNodeKeyDown(event, node.id),
|
|
5818
5960
|
onClick: () => select(node.id),
|
|
5819
5961
|
children: [
|
|
5820
|
-
/* @__PURE__ */ (0,
|
|
5821
|
-
/* @__PURE__ */ (0,
|
|
5822
|
-
/* @__PURE__ */ (0,
|
|
5962
|
+
/* @__PURE__ */ (0, import_jsx_runtime67.jsx)("title", { children: node.label }),
|
|
5963
|
+
/* @__PURE__ */ (0, import_jsx_runtime67.jsx)("rect", { x: -RADIAL_NODE_HALF_W, y: -RADIAL_NODE_HALF_H, width: RADIAL_NODE_HALF_W * 2, height: RADIAL_NODE_HALF_H * 2, rx: "8" }),
|
|
5964
|
+
/* @__PURE__ */ (0, import_jsx_runtime67.jsx)("text", { textAnchor: "middle", dominantBaseline: "middle", children: node.label.length > 16 ? `${node.label.slice(0, 15)}\u2026` : node.label })
|
|
5823
5965
|
]
|
|
5824
5966
|
},
|
|
5825
5967
|
node.id
|
|
5826
5968
|
))
|
|
5827
5969
|
] }) }) }),
|
|
5828
|
-
legend.length > 0 && /* @__PURE__ */ (0,
|
|
5829
|
-
showList && /* @__PURE__ */ (0,
|
|
5970
|
+
legend.length > 0 && /* @__PURE__ */ (0, import_jsx_runtime67.jsx)("ul", { className: "uix-relationship-graph__legend", "aria-label": labels.legend, children: legend.map((item) => /* @__PURE__ */ (0, import_jsx_runtime67.jsx)("li", { "data-type": item.id, style: { "--uix-graph-type-color": typeColor.get(item.id) }, children: item.label }, item.id)) }),
|
|
5971
|
+
showList && /* @__PURE__ */ (0, import_jsx_runtime67.jsx)(EquivalentRelationshipList, { nodes: bounded.nodes, edges: bounded.edges, selectedId, labels, onSelect: select, onExpandNeighbors, onOpenDetails })
|
|
5830
5972
|
] });
|
|
5831
5973
|
}
|
|
5832
5974
|
|
|
5833
5975
|
// src/components/MatchReview.tsx
|
|
5834
5976
|
var import_react45 = require("react");
|
|
5835
|
-
var
|
|
5977
|
+
var import_jsx_runtime68 = require("react/jsx-runtime");
|
|
5836
5978
|
var DEFAULT_MATCH_REVIEW_LABELS = {
|
|
5837
5979
|
region: "Match review",
|
|
5838
5980
|
loading: "Loading match candidates\u2026",
|
|
@@ -5927,48 +6069,48 @@ function MatchReview({
|
|
|
5927
6069
|
setBulkPending(false);
|
|
5928
6070
|
}
|
|
5929
6071
|
};
|
|
5930
|
-
if (loading) return /* @__PURE__ */ (0,
|
|
5931
|
-
if (error) return /* @__PURE__ */ (0,
|
|
5932
|
-
/* @__PURE__ */ (0,
|
|
5933
|
-
onRetry && /* @__PURE__ */ (0,
|
|
6072
|
+
if (loading) return /* @__PURE__ */ (0, import_jsx_runtime68.jsx)("div", { className: cx("uix-match-review uix-match-review--state", className), role: "status", children: labels.loading });
|
|
6073
|
+
if (error) return /* @__PURE__ */ (0, import_jsx_runtime68.jsxs)("div", { className: cx("uix-match-review uix-match-review--state", className), role: "alert", children: [
|
|
6074
|
+
/* @__PURE__ */ (0, import_jsx_runtime68.jsx)("p", { children: error }),
|
|
6075
|
+
onRetry && /* @__PURE__ */ (0, import_jsx_runtime68.jsx)("button", { type: "button", className: "uix-btn uix-btn--secondary", onClick: onRetry, children: labels.retry })
|
|
5934
6076
|
] });
|
|
5935
|
-
if (candidates.length === 0) return /* @__PURE__ */ (0,
|
|
5936
|
-
/* @__PURE__ */ (0,
|
|
5937
|
-
/* @__PURE__ */ (0,
|
|
6077
|
+
if (candidates.length === 0) return /* @__PURE__ */ (0, import_jsx_runtime68.jsxs)("div", { className: cx("uix-match-review uix-match-review--state", className), children: [
|
|
6078
|
+
/* @__PURE__ */ (0, import_jsx_runtime68.jsx)("p", { children: labels.empty }),
|
|
6079
|
+
/* @__PURE__ */ (0, import_jsx_runtime68.jsx)("p", { children: labels.emptyDetail })
|
|
5938
6080
|
] });
|
|
5939
|
-
return /* @__PURE__ */ (0,
|
|
5940
|
-
/* @__PURE__ */ (0,
|
|
5941
|
-
/* @__PURE__ */ (0,
|
|
5942
|
-
/* @__PURE__ */ (0,
|
|
5943
|
-
/* @__PURE__ */ (0,
|
|
6081
|
+
return /* @__PURE__ */ (0, import_jsx_runtime68.jsxs)("section", { className: cx("uix-match-review", className), "aria-label": labels.region, children: [
|
|
6082
|
+
/* @__PURE__ */ (0, import_jsx_runtime68.jsxs)("div", { className: "uix-match-review__summary", children: [
|
|
6083
|
+
/* @__PURE__ */ (0, import_jsx_runtime68.jsxs)("div", { children: [
|
|
6084
|
+
/* @__PURE__ */ (0, import_jsx_runtime68.jsx)("strong", { children: incomingLabel }),
|
|
6085
|
+
/* @__PURE__ */ (0, import_jsx_runtime68.jsx)("span", { children: fillLabel(labels.pendingOf, { pending: pending.length, total: candidates.length }) })
|
|
5944
6086
|
] }),
|
|
5945
|
-
/* @__PURE__ */ (0,
|
|
5946
|
-
/* @__PURE__ */ (0,
|
|
6087
|
+
/* @__PURE__ */ (0, import_jsx_runtime68.jsx)("div", { className: "uix-match-review__incoming", children: fields.map((field) => /* @__PURE__ */ (0, import_jsx_runtime68.jsxs)("span", { children: [
|
|
6088
|
+
/* @__PURE__ */ (0, import_jsx_runtime68.jsx)("b", { children: field.label }),
|
|
5947
6089
|
field.render?.(incoming[field.id], incoming) ?? valueText(incoming[field.id])
|
|
5948
6090
|
] }, field.id)) })
|
|
5949
6091
|
] }),
|
|
5950
|
-
onBulkDecision && /* @__PURE__ */ (0,
|
|
5951
|
-
/* @__PURE__ */ (0,
|
|
5952
|
-
/* @__PURE__ */ (0,
|
|
5953
|
-
/* @__PURE__ */ (0,
|
|
6092
|
+
onBulkDecision && /* @__PURE__ */ (0, import_jsx_runtime68.jsxs)("div", { className: "uix-match-review__bulk", "aria-label": labels.bulk, children: [
|
|
6093
|
+
/* @__PURE__ */ (0, import_jsx_runtime68.jsx)("span", { children: fillLabel(labels.selectedCount, { count: selection.size }) }),
|
|
6094
|
+
/* @__PURE__ */ (0, import_jsx_runtime68.jsx)("button", { type: "button", className: "uix-btn uix-btn--secondary uix-btn--sm", disabled: selection.size === 0 || bulkPending, onClick: () => void runBulk("accept"), children: bulkPending ? labels.applying : labels.acceptSelected }),
|
|
6095
|
+
/* @__PURE__ */ (0, import_jsx_runtime68.jsx)("button", { type: "button", className: "uix-btn uix-btn--ghost uix-btn--sm", disabled: selection.size === 0 || bulkPending, onClick: () => void runBulk("dismiss"), children: bulkPending ? labels.applying : labels.dismissSelected })
|
|
5954
6096
|
] }),
|
|
5955
|
-
/* @__PURE__ */ (0,
|
|
5956
|
-
/* @__PURE__ */ (0,
|
|
5957
|
-
/* @__PURE__ */ (0,
|
|
5958
|
-
/* @__PURE__ */ (0,
|
|
5959
|
-
/* @__PURE__ */ (0,
|
|
5960
|
-
fields.map((field) => /* @__PURE__ */ (0,
|
|
5961
|
-
/* @__PURE__ */ (0,
|
|
5962
|
-
/* @__PURE__ */ (0,
|
|
6097
|
+
/* @__PURE__ */ (0, import_jsx_runtime68.jsx)("div", { className: "uix-match-review__table-wrap", children: /* @__PURE__ */ (0, import_jsx_runtime68.jsxs)("table", { className: "uix-table uix-match-review__table", children: [
|
|
6098
|
+
/* @__PURE__ */ (0, import_jsx_runtime68.jsx)("caption", { className: "uix-visually-hidden", children: labels.caption }),
|
|
6099
|
+
/* @__PURE__ */ (0, import_jsx_runtime68.jsx)("thead", { children: /* @__PURE__ */ (0, import_jsx_runtime68.jsxs)("tr", { children: [
|
|
6100
|
+
/* @__PURE__ */ (0, import_jsx_runtime68.jsx)("th", { scope: "col", children: /* @__PURE__ */ (0, import_jsx_runtime68.jsx)("span", { className: "uix-visually-hidden", children: labels.select }) }),
|
|
6101
|
+
/* @__PURE__ */ (0, import_jsx_runtime68.jsx)("th", { scope: "col", children: labels.confidence }),
|
|
6102
|
+
fields.map((field) => /* @__PURE__ */ (0, import_jsx_runtime68.jsx)("th", { scope: "col", children: field.label }, field.id)),
|
|
6103
|
+
/* @__PURE__ */ (0, import_jsx_runtime68.jsx)("th", { scope: "col", children: labels.status }),
|
|
6104
|
+
/* @__PURE__ */ (0, import_jsx_runtime68.jsx)("th", { scope: "col", children: labels.actions })
|
|
5963
6105
|
] }) }),
|
|
5964
|
-
/* @__PURE__ */ (0,
|
|
6106
|
+
/* @__PURE__ */ (0, import_jsx_runtime68.jsx)("tbody", { children: candidates.map((candidate) => {
|
|
5965
6107
|
const resolved = candidate.status === "resolved";
|
|
5966
|
-
return /* @__PURE__ */ (0,
|
|
5967
|
-
/* @__PURE__ */ (0,
|
|
5968
|
-
/* @__PURE__ */ (0,
|
|
5969
|
-
fields.map((field) => /* @__PURE__ */ (0,
|
|
5970
|
-
/* @__PURE__ */ (0,
|
|
5971
|
-
/* @__PURE__ */ (0,
|
|
6108
|
+
return /* @__PURE__ */ (0, import_jsx_runtime68.jsxs)("tr", { "data-status": candidate.status ?? "pending", children: [
|
|
6109
|
+
/* @__PURE__ */ (0, import_jsx_runtime68.jsx)("td", { children: /* @__PURE__ */ (0, import_jsx_runtime68.jsx)("input", { type: "checkbox", checked: selection.has(candidate.id), onChange: () => toggle(candidate.id), "aria-label": fillLabel(labels.selectCandidate, { id: candidate.id }) }) }),
|
|
6110
|
+
/* @__PURE__ */ (0, import_jsx_runtime68.jsx)("td", { children: /* @__PURE__ */ (0, import_jsx_runtime68.jsx)("span", { className: "uix-match-review__confidence", children: candidate.confidence == null ? labels.notScored : `${Math.round(candidate.confidence * 100)}%` }) }),
|
|
6111
|
+
fields.map((field) => /* @__PURE__ */ (0, import_jsx_runtime68.jsx)("td", { children: field.render?.(candidate.record[field.id], candidate.record) ?? valueText(candidate.record[field.id]) }, field.id)),
|
|
6112
|
+
/* @__PURE__ */ (0, import_jsx_runtime68.jsx)("td", { children: /* @__PURE__ */ (0, import_jsx_runtime68.jsx)(StatusPill, { tone: resolved ? "success" : "warning", children: resolved ? candidate.decision ? decisionLabel[candidate.decision] : labels.resolved : labels.pending }) }),
|
|
6113
|
+
/* @__PURE__ */ (0, import_jsx_runtime68.jsx)("td", { children: /* @__PURE__ */ (0, import_jsx_runtime68.jsx)("div", { className: "uix-match-review__actions", children: ["accept", "dismiss", "split", "pick-other"].map((action) => /* @__PURE__ */ (0, import_jsx_runtime68.jsx)(
|
|
5972
6114
|
"button",
|
|
5973
6115
|
{
|
|
5974
6116
|
type: "button",
|
|
@@ -5982,7 +6124,7 @@ function MatchReview({
|
|
|
5982
6124
|
] }, candidate.id);
|
|
5983
6125
|
}) })
|
|
5984
6126
|
] }) }),
|
|
5985
|
-
/* @__PURE__ */ (0,
|
|
6127
|
+
/* @__PURE__ */ (0, import_jsx_runtime68.jsx)("p", { className: "uix-visually-hidden", "aria-live": "polite", children: announcement })
|
|
5986
6128
|
] });
|
|
5987
6129
|
}
|
|
5988
6130
|
|
|
@@ -6012,7 +6154,7 @@ function parseMetricValue(value) {
|
|
|
6012
6154
|
}
|
|
6013
6155
|
|
|
6014
6156
|
// src/components/MetricInput.tsx
|
|
6015
|
-
var
|
|
6157
|
+
var import_jsx_runtime69 = require("react/jsx-runtime");
|
|
6016
6158
|
var defaultMetricFormat = (input) => input == null ? "" : String(input);
|
|
6017
6159
|
function MetricInput({
|
|
6018
6160
|
value,
|
|
@@ -6061,10 +6203,10 @@ function MetricInput({
|
|
|
6061
6203
|
const parsed = parse(event.currentTarget.value);
|
|
6062
6204
|
setText(parsed === null && event.currentTarget.value.trim() !== "" ? format(value) : format(parsed));
|
|
6063
6205
|
};
|
|
6064
|
-
return /* @__PURE__ */ (0,
|
|
6065
|
-
/* @__PURE__ */ (0,
|
|
6066
|
-
/* @__PURE__ */ (0,
|
|
6067
|
-
/* @__PURE__ */ (0,
|
|
6206
|
+
return /* @__PURE__ */ (0, import_jsx_runtime69.jsxs)("div", { className: cx("uix-metric-input", invalid && "uix-metric-input--invalid", className), children: [
|
|
6207
|
+
/* @__PURE__ */ (0, import_jsx_runtime69.jsx)("label", { className: "uix-field__label", htmlFor: id, children: label }),
|
|
6208
|
+
/* @__PURE__ */ (0, import_jsx_runtime69.jsxs)("div", { className: "uix-metric-input__control", children: [
|
|
6209
|
+
/* @__PURE__ */ (0, import_jsx_runtime69.jsx)(
|
|
6068
6210
|
Input,
|
|
6069
6211
|
{
|
|
6070
6212
|
id,
|
|
@@ -6083,22 +6225,22 @@ function MetricInput({
|
|
|
6083
6225
|
readOnly
|
|
6084
6226
|
}
|
|
6085
6227
|
),
|
|
6086
|
-
unit && /* @__PURE__ */ (0,
|
|
6087
|
-
/* @__PURE__ */ (0,
|
|
6088
|
-
/* @__PURE__ */ (0,
|
|
6089
|
-
/* @__PURE__ */ (0,
|
|
6228
|
+
unit && /* @__PURE__ */ (0, import_jsx_runtime69.jsx)("span", { className: "uix-metric-input__unit", "aria-hidden": "true", children: unit }),
|
|
6229
|
+
/* @__PURE__ */ (0, import_jsx_runtime69.jsxs)("span", { className: "uix-metric-input__steps", children: [
|
|
6230
|
+
/* @__PURE__ */ (0, import_jsx_runtime69.jsx)("button", { type: "button", className: "uix-metric-input__step", onClick: () => stepBy(1), disabled: disabled || readOnly, "aria-label": `Increase ${label}`, children: "+" }),
|
|
6231
|
+
/* @__PURE__ */ (0, import_jsx_runtime69.jsx)("button", { type: "button", className: "uix-metric-input__step", onClick: () => stepBy(-1), disabled: disabled || readOnly, "aria-label": `Decrease ${label}`, children: "\u2212" })
|
|
6090
6232
|
] })
|
|
6091
6233
|
] }),
|
|
6092
|
-
unit && /* @__PURE__ */ (0,
|
|
6234
|
+
unit && /* @__PURE__ */ (0, import_jsx_runtime69.jsxs)("span", { className: "uix-visually-hidden", children: [
|
|
6093
6235
|
"Unit: ",
|
|
6094
6236
|
unit
|
|
6095
6237
|
] }),
|
|
6096
|
-
invalid && errorMessage && /* @__PURE__ */ (0,
|
|
6238
|
+
invalid && errorMessage && /* @__PURE__ */ (0, import_jsx_runtime69.jsx)("span", { id: errorId, className: "uix-field__error", children: errorMessage })
|
|
6097
6239
|
] });
|
|
6098
6240
|
}
|
|
6099
6241
|
|
|
6100
6242
|
// src/components/LicensePositionBar.tsx
|
|
6101
|
-
var
|
|
6243
|
+
var import_jsx_runtime70 = require("react/jsx-runtime");
|
|
6102
6244
|
var defaultCapacityFormat = (value) => new Intl.NumberFormat().format(value);
|
|
6103
6245
|
function LicensePositionBar({
|
|
6104
6246
|
consumed,
|
|
@@ -6119,18 +6261,18 @@ function LicensePositionBar({
|
|
|
6119
6261
|
const percent = safeEntitled === 0 ? safeConsumed > 0 ? 100 : 0 : safeConsumed / safeEntitled * 100;
|
|
6120
6262
|
const format = (value) => `${formatValue(value)}${unit ? ` ${unit}` : ""}`;
|
|
6121
6263
|
const summary = `${consumedLabel}: ${format(safeConsumed)}. ${entitledLabel}: ${format(safeEntitled)}. ${over > 0 ? `${format(over)} ${overLabel}` : `${format(available)} ${availableLabel}`}.`;
|
|
6122
|
-
return /* @__PURE__ */ (0,
|
|
6123
|
-
/* @__PURE__ */ (0,
|
|
6124
|
-
/* @__PURE__ */ (0,
|
|
6264
|
+
return /* @__PURE__ */ (0, import_jsx_runtime70.jsxs)("div", { className: cx("uix-license-position", over > 0 && "uix-license-position--over", className), ...props, children: [
|
|
6265
|
+
/* @__PURE__ */ (0, import_jsx_runtime70.jsxs)("div", { className: "uix-license-position__header", children: [
|
|
6266
|
+
/* @__PURE__ */ (0, import_jsx_runtime70.jsxs)("span", { className: "uix-license-position__value", children: [
|
|
6125
6267
|
format(safeConsumed),
|
|
6126
6268
|
" / ",
|
|
6127
6269
|
format(safeEntitled)
|
|
6128
6270
|
] }),
|
|
6129
|
-
/* @__PURE__ */ (0,
|
|
6271
|
+
/* @__PURE__ */ (0, import_jsx_runtime70.jsx)(StatusPill, { tone: over > 0 ? "danger" : percent >= 80 ? "warning" : "success", children: over > 0 ? `${format(over)} ${overLabel}` : `${format(available)} ${availableLabel}` })
|
|
6130
6272
|
] }),
|
|
6131
|
-
/* @__PURE__ */ (0,
|
|
6132
|
-
/* @__PURE__ */ (0,
|
|
6133
|
-
over > 0 && /* @__PURE__ */ (0,
|
|
6273
|
+
/* @__PURE__ */ (0, import_jsx_runtime70.jsxs)("div", { className: "uix-license-position__track", children: [
|
|
6274
|
+
/* @__PURE__ */ (0, import_jsx_runtime70.jsx)(Meter, { value: Math.min(100, percent), tone: over > 0 ? "danger" : percent >= 80 ? "warning" : "success", "aria-label": summary, "aria-valuetext": summary }),
|
|
6275
|
+
over > 0 && /* @__PURE__ */ (0, import_jsx_runtime70.jsx)(
|
|
6134
6276
|
"span",
|
|
6135
6277
|
{
|
|
6136
6278
|
className: "uix-license-position__overflow",
|
|
@@ -6139,7 +6281,7 @@ function LicensePositionBar({
|
|
|
6139
6281
|
}
|
|
6140
6282
|
)
|
|
6141
6283
|
] }),
|
|
6142
|
-
/* @__PURE__ */ (0,
|
|
6284
|
+
/* @__PURE__ */ (0, import_jsx_runtime70.jsx)("span", { className: "uix-visually-hidden", children: summary })
|
|
6143
6285
|
] });
|
|
6144
6286
|
}
|
|
6145
6287
|
|
|
@@ -6214,7 +6356,7 @@ function meetsContrast(background, foreground, minimum = 4.5) {
|
|
|
6214
6356
|
|
|
6215
6357
|
// src/components/ColorPicker.tsx
|
|
6216
6358
|
var import_react47 = require("react");
|
|
6217
|
-
var
|
|
6359
|
+
var import_jsx_runtime71 = require("react/jsx-runtime");
|
|
6218
6360
|
var DEFAULT_COLOR_PICKER_LABELS = {
|
|
6219
6361
|
trigger: "{label}: {color}",
|
|
6220
6362
|
sample: "Aa",
|
|
@@ -6298,8 +6440,8 @@ function ColorPicker({
|
|
|
6298
6440
|
if (next) onChange(next);
|
|
6299
6441
|
};
|
|
6300
6442
|
const sampleStyle = { backgroundColor: normalized };
|
|
6301
|
-
return /* @__PURE__ */ (0,
|
|
6302
|
-
/* @__PURE__ */ (0,
|
|
6443
|
+
return /* @__PURE__ */ (0, import_jsx_runtime71.jsxs)("div", { className: cx("uix-color-picker", className), children: [
|
|
6444
|
+
/* @__PURE__ */ (0, import_jsx_runtime71.jsxs)(
|
|
6303
6445
|
"button",
|
|
6304
6446
|
{
|
|
6305
6447
|
ref: triggerRef,
|
|
@@ -6311,12 +6453,12 @@ function ColorPicker({
|
|
|
6311
6453
|
onClick: () => setOpen((current) => !current),
|
|
6312
6454
|
disabled,
|
|
6313
6455
|
children: [
|
|
6314
|
-
/* @__PURE__ */ (0,
|
|
6315
|
-
/* @__PURE__ */ (0,
|
|
6456
|
+
/* @__PURE__ */ (0, import_jsx_runtime71.jsx)("span", { className: "uix-color-picker__swatch", style: sampleStyle, "aria-hidden": "true" }),
|
|
6457
|
+
/* @__PURE__ */ (0, import_jsx_runtime71.jsx)("span", { children: normalized })
|
|
6316
6458
|
]
|
|
6317
6459
|
}
|
|
6318
6460
|
),
|
|
6319
|
-
open && /* @__PURE__ */ (0,
|
|
6461
|
+
open && /* @__PURE__ */ (0, import_jsx_runtime71.jsxs)(
|
|
6320
6462
|
"div",
|
|
6321
6463
|
{
|
|
6322
6464
|
ref: dialogRef,
|
|
@@ -6327,55 +6469,55 @@ function ColorPicker({
|
|
|
6327
6469
|
className: "uix-color-picker__popover",
|
|
6328
6470
|
onKeyDown: onDialogKeyDown,
|
|
6329
6471
|
children: [
|
|
6330
|
-
/* @__PURE__ */ (0,
|
|
6331
|
-
/* @__PURE__ */ (0,
|
|
6472
|
+
/* @__PURE__ */ (0, import_jsx_runtime71.jsx)("div", { className: "uix-color-picker__preview", style: sampleStyle, children: /* @__PURE__ */ (0, import_jsx_runtime71.jsx)("span", { style: { color: foreground }, children: labels.sample }) }),
|
|
6473
|
+
/* @__PURE__ */ (0, import_jsx_runtime71.jsxs)("label", { className: "uix-color-picker__range", children: [
|
|
6332
6474
|
labels.hue,
|
|
6333
6475
|
" ",
|
|
6334
|
-
/* @__PURE__ */ (0,
|
|
6476
|
+
/* @__PURE__ */ (0, import_jsx_runtime71.jsxs)("span", { children: [
|
|
6335
6477
|
Math.round(hsv.h),
|
|
6336
6478
|
"\xB0"
|
|
6337
6479
|
] }),
|
|
6338
|
-
/* @__PURE__ */ (0,
|
|
6480
|
+
/* @__PURE__ */ (0, import_jsx_runtime71.jsx)("input", { type: "range", min: "0", max: "359", value: Math.round(hsv.h), onChange: (event) => updateHsv({ h: Number(event.currentTarget.value) }) })
|
|
6339
6481
|
] }),
|
|
6340
|
-
/* @__PURE__ */ (0,
|
|
6482
|
+
/* @__PURE__ */ (0, import_jsx_runtime71.jsxs)("label", { className: "uix-color-picker__range", children: [
|
|
6341
6483
|
labels.saturation,
|
|
6342
6484
|
" ",
|
|
6343
|
-
/* @__PURE__ */ (0,
|
|
6485
|
+
/* @__PURE__ */ (0, import_jsx_runtime71.jsxs)("span", { children: [
|
|
6344
6486
|
Math.round(hsv.s * 100),
|
|
6345
6487
|
"%"
|
|
6346
6488
|
] }),
|
|
6347
|
-
/* @__PURE__ */ (0,
|
|
6489
|
+
/* @__PURE__ */ (0, import_jsx_runtime71.jsx)("input", { type: "range", min: "0", max: "100", value: Math.round(hsv.s * 100), onChange: (event) => updateHsv({ s: Number(event.currentTarget.value) / 100 }) })
|
|
6348
6490
|
] }),
|
|
6349
|
-
/* @__PURE__ */ (0,
|
|
6491
|
+
/* @__PURE__ */ (0, import_jsx_runtime71.jsxs)("label", { className: "uix-color-picker__range", children: [
|
|
6350
6492
|
labels.brightness,
|
|
6351
6493
|
" ",
|
|
6352
|
-
/* @__PURE__ */ (0,
|
|
6494
|
+
/* @__PURE__ */ (0, import_jsx_runtime71.jsxs)("span", { children: [
|
|
6353
6495
|
Math.round(hsv.v * 100),
|
|
6354
6496
|
"%"
|
|
6355
6497
|
] }),
|
|
6356
|
-
/* @__PURE__ */ (0,
|
|
6498
|
+
/* @__PURE__ */ (0, import_jsx_runtime71.jsx)("input", { type: "range", min: "0", max: "100", value: Math.round(hsv.v * 100), onChange: (event) => updateHsv({ v: Number(event.currentTarget.value) / 100 }) })
|
|
6357
6499
|
] }),
|
|
6358
|
-
/* @__PURE__ */ (0,
|
|
6500
|
+
/* @__PURE__ */ (0, import_jsx_runtime71.jsxs)("label", { className: "uix-color-picker__hex", children: [
|
|
6359
6501
|
labels.hex,
|
|
6360
|
-
/* @__PURE__ */ (0,
|
|
6361
|
-
/* @__PURE__ */ (0,
|
|
6502
|
+
/* @__PURE__ */ (0, import_jsx_runtime71.jsxs)("span", { className: "uix-color-picker__hex-row", children: [
|
|
6503
|
+
/* @__PURE__ */ (0, import_jsx_runtime71.jsx)("input", { className: "uix-input", value: hexText, onChange: (event) => setHexText(event.currentTarget.value), onBlur: commitHex, onKeyDown: (event) => {
|
|
6362
6504
|
if (event.key === "Enter") commitHex();
|
|
6363
6505
|
}, "aria-invalid": !normalizeHex(hexText) }),
|
|
6364
|
-
/* @__PURE__ */ (0,
|
|
6506
|
+
/* @__PURE__ */ (0, import_jsx_runtime71.jsx)("button", { type: "button", className: "uix-btn uix-btn--secondary uix-btn--sm", onClick: commitHex, disabled: !normalizeHex(hexText), children: labels.set })
|
|
6365
6507
|
] })
|
|
6366
6508
|
] }),
|
|
6367
|
-
(presets.length > 0 || recent.length > 0) && /* @__PURE__ */ (0,
|
|
6368
|
-
presets.length > 0 && /* @__PURE__ */ (0,
|
|
6369
|
-
/* @__PURE__ */ (0,
|
|
6370
|
-
/* @__PURE__ */ (0,
|
|
6509
|
+
(presets.length > 0 || recent.length > 0) && /* @__PURE__ */ (0, import_jsx_runtime71.jsxs)("div", { className: "uix-color-picker__palettes", children: [
|
|
6510
|
+
presets.length > 0 && /* @__PURE__ */ (0, import_jsx_runtime71.jsxs)("fieldset", { children: [
|
|
6511
|
+
/* @__PURE__ */ (0, import_jsx_runtime71.jsx)("legend", { children: labels.presets }),
|
|
6512
|
+
/* @__PURE__ */ (0, import_jsx_runtime71.jsx)("div", { children: presets.map((color) => /* @__PURE__ */ (0, import_jsx_runtime71.jsx)("button", { type: "button", className: "uix-color-picker__preset", style: { backgroundColor: normalizeHex(color) ?? color }, onClick: () => choose(color), "aria-label": fillLabel(labels.usePreset, { color }) }, color)) })
|
|
6371
6513
|
] }),
|
|
6372
|
-
recent.length > 0 && /* @__PURE__ */ (0,
|
|
6373
|
-
/* @__PURE__ */ (0,
|
|
6374
|
-
/* @__PURE__ */ (0,
|
|
6514
|
+
recent.length > 0 && /* @__PURE__ */ (0, import_jsx_runtime71.jsxs)("fieldset", { children: [
|
|
6515
|
+
/* @__PURE__ */ (0, import_jsx_runtime71.jsx)("legend", { children: labels.recent }),
|
|
6516
|
+
/* @__PURE__ */ (0, import_jsx_runtime71.jsx)("div", { children: recent.map((color) => /* @__PURE__ */ (0, import_jsx_runtime71.jsx)("button", { type: "button", className: "uix-color-picker__preset", style: { backgroundColor: normalizeHex(color) ?? color }, onClick: () => choose(color), "aria-label": fillLabel(labels.useRecent, { color }) }, color)) })
|
|
6375
6517
|
] })
|
|
6376
6518
|
] }),
|
|
6377
|
-
/* @__PURE__ */ (0,
|
|
6378
|
-
/* @__PURE__ */ (0,
|
|
6519
|
+
/* @__PURE__ */ (0, import_jsx_runtime71.jsx)("p", { className: cx("uix-color-picker__contrast", passes ? "uix-color-picker__contrast--pass" : "uix-color-picker__contrast--fail"), role: "status", "aria-live": "polite", children: fillLabel(passes ? labels.contrastPasses : labels.contrastFails, { ratio: ratio.toFixed(2), minimum: minimumContrast }) }),
|
|
6520
|
+
/* @__PURE__ */ (0, import_jsx_runtime71.jsx)("button", { type: "button", className: "uix-btn uix-btn--primary uix-btn--sm", onClick: close, children: labels.done })
|
|
6379
6521
|
]
|
|
6380
6522
|
}
|
|
6381
6523
|
)
|
|
@@ -6383,7 +6525,7 @@ function ColorPicker({
|
|
|
6383
6525
|
}
|
|
6384
6526
|
|
|
6385
6527
|
// src/components/BrandProfiles.tsx
|
|
6386
|
-
var
|
|
6528
|
+
var import_jsx_runtime72 = require("react/jsx-runtime");
|
|
6387
6529
|
var PROFILE_PROPERTIES = {
|
|
6388
6530
|
brand: "--uix-brand",
|
|
6389
6531
|
brandForeground: "--uix-brand-fg",
|
|
@@ -6492,54 +6634,54 @@ function BrandProfileEditor({
|
|
|
6492
6634
|
...value.typography?.sans ? { "--uix-font-sans": value.typography.sans } : {},
|
|
6493
6635
|
...value.typography?.heading ? { "--uix-font-heading": value.typography.heading } : {}
|
|
6494
6636
|
};
|
|
6495
|
-
return /* @__PURE__ */ (0,
|
|
6496
|
-
/* @__PURE__ */ (0,
|
|
6497
|
-
profiles.length > 0 && /* @__PURE__ */ (0,
|
|
6637
|
+
return /* @__PURE__ */ (0, import_jsx_runtime72.jsxs)("section", { className: cx("uix-brand-profiles", className), "aria-label": labels.region, children: [
|
|
6638
|
+
/* @__PURE__ */ (0, import_jsx_runtime72.jsxs)("div", { className: "uix-brand-profiles__form", children: [
|
|
6639
|
+
profiles.length > 0 && /* @__PURE__ */ (0, import_jsx_runtime72.jsxs)("label", { className: "uix-field__label", children: [
|
|
6498
6640
|
labels.profile,
|
|
6499
|
-
/* @__PURE__ */ (0,
|
|
6641
|
+
/* @__PURE__ */ (0, import_jsx_runtime72.jsx)("select", { className: "uix-select", value: value.id, onChange: (event) => {
|
|
6500
6642
|
const selected = profiles.find((profile) => profile.id === event.currentTarget.value);
|
|
6501
6643
|
if (selected) onSelectProfile?.(selected);
|
|
6502
|
-
}, children: profiles.map((profile) => /* @__PURE__ */ (0,
|
|
6644
|
+
}, children: profiles.map((profile) => /* @__PURE__ */ (0, import_jsx_runtime72.jsx)("option", { value: profile.id, children: profile.name }, profile.id)) })
|
|
6503
6645
|
] }),
|
|
6504
|
-
/* @__PURE__ */ (0,
|
|
6646
|
+
/* @__PURE__ */ (0, import_jsx_runtime72.jsxs)("label", { className: "uix-field__label", children: [
|
|
6505
6647
|
labels.name,
|
|
6506
|
-
/* @__PURE__ */ (0,
|
|
6648
|
+
/* @__PURE__ */ (0, import_jsx_runtime72.jsx)("input", { className: "uix-input", value: value.name, onChange: (event) => update({ name: event.currentTarget.value }) })
|
|
6507
6649
|
] }),
|
|
6508
|
-
/* @__PURE__ */ (0,
|
|
6509
|
-
/* @__PURE__ */ (0,
|
|
6650
|
+
/* @__PURE__ */ (0, import_jsx_runtime72.jsxs)("div", { className: "uix-brand-profiles__colors", children: [
|
|
6651
|
+
/* @__PURE__ */ (0, import_jsx_runtime72.jsxs)("label", { children: [
|
|
6510
6652
|
labels.brand,
|
|
6511
|
-
/* @__PURE__ */ (0,
|
|
6653
|
+
/* @__PURE__ */ (0, import_jsx_runtime72.jsx)(ColorPicker, { label: labels.brandColor, value: value.brand, foreground: value.brandForeground, presets: colorPresets, onChange: (brand) => update({ brand }) })
|
|
6512
6654
|
] }),
|
|
6513
|
-
/* @__PURE__ */ (0,
|
|
6655
|
+
/* @__PURE__ */ (0, import_jsx_runtime72.jsxs)("label", { children: [
|
|
6514
6656
|
labels.onBrand,
|
|
6515
|
-
/* @__PURE__ */ (0,
|
|
6657
|
+
/* @__PURE__ */ (0, import_jsx_runtime72.jsx)(ColorPicker, { label: labels.onBrandColor, value: value.brandForeground, foreground: value.brand, presets: colorPresets, onChange: (brandForeground) => update({ brandForeground }) })
|
|
6516
6658
|
] })
|
|
6517
6659
|
] }),
|
|
6518
|
-
/* @__PURE__ */ (0,
|
|
6660
|
+
/* @__PURE__ */ (0, import_jsx_runtime72.jsxs)("label", { className: "uix-field__label", children: [
|
|
6519
6661
|
labels.bodyFont,
|
|
6520
|
-
/* @__PURE__ */ (0,
|
|
6662
|
+
/* @__PURE__ */ (0, import_jsx_runtime72.jsx)("input", { className: "uix-input", value: value.typography?.sans ?? "", onChange: (event) => update({ typography: { ...value.typography, sans: event.currentTarget.value || void 0 } }) })
|
|
6521
6663
|
] }),
|
|
6522
|
-
/* @__PURE__ */ (0,
|
|
6664
|
+
/* @__PURE__ */ (0, import_jsx_runtime72.jsxs)("label", { className: "uix-field__label", children: [
|
|
6523
6665
|
labels.headingFont,
|
|
6524
|
-
/* @__PURE__ */ (0,
|
|
6666
|
+
/* @__PURE__ */ (0, import_jsx_runtime72.jsx)("input", { className: "uix-input", value: value.typography?.heading ?? "", onChange: (event) => update({ typography: { ...value.typography, heading: event.currentTarget.value || void 0 } }) })
|
|
6525
6667
|
] }),
|
|
6526
|
-
/* @__PURE__ */ (0,
|
|
6668
|
+
/* @__PURE__ */ (0, import_jsx_runtime72.jsxs)("label", { className: "uix-file-upload uix-brand-profiles__upload", children: [
|
|
6527
6669
|
labels.logoFile,
|
|
6528
|
-
/* @__PURE__ */ (0,
|
|
6670
|
+
/* @__PURE__ */ (0, import_jsx_runtime72.jsx)("input", { type: "file", accept: "image/*", onChange: onFile })
|
|
6529
6671
|
] }),
|
|
6530
|
-
/* @__PURE__ */ (0,
|
|
6531
|
-
/* @__PURE__ */ (0,
|
|
6672
|
+
/* @__PURE__ */ (0, import_jsx_runtime72.jsx)("button", { type: "button", className: "uix-btn uix-btn--primary", onClick: apply, children: labels.apply }),
|
|
6673
|
+
/* @__PURE__ */ (0, import_jsx_runtime72.jsx)("span", { className: "uix-visually-hidden", "aria-live": "polite", children: announcement })
|
|
6532
6674
|
] }),
|
|
6533
|
-
/* @__PURE__ */ (0,
|
|
6534
|
-
/* @__PURE__ */ (0,
|
|
6535
|
-
value.logo ? /* @__PURE__ */ (0,
|
|
6536
|
-
/* @__PURE__ */ (0,
|
|
6675
|
+
/* @__PURE__ */ (0, import_jsx_runtime72.jsxs)("div", { className: "uix-brand-profiles__preview", style: previewStyle, "aria-label": fillLabel(labels.preview, { name: value.name }), children: [
|
|
6676
|
+
/* @__PURE__ */ (0, import_jsx_runtime72.jsxs)("div", { className: "uix-brand-profiles__preview-header", children: [
|
|
6677
|
+
value.logo ? /* @__PURE__ */ (0, import_jsx_runtime72.jsx)("img", { src: value.logo.src, alt: value.logo.alt }) : /* @__PURE__ */ (0, import_jsx_runtime72.jsx)("span", { className: "uix-brand-profiles__logo-placeholder", children: labels.logoPlaceholder }),
|
|
6678
|
+
/* @__PURE__ */ (0, import_jsx_runtime72.jsx)("strong", { children: value.name || labels.previewTitleFallback })
|
|
6537
6679
|
] }),
|
|
6538
|
-
/* @__PURE__ */ (0,
|
|
6539
|
-
/* @__PURE__ */ (0,
|
|
6540
|
-
/* @__PURE__ */ (0,
|
|
6541
|
-
/* @__PURE__ */ (0,
|
|
6542
|
-
/* @__PURE__ */ (0,
|
|
6680
|
+
/* @__PURE__ */ (0, import_jsx_runtime72.jsxs)("div", { className: "uix-brand-profiles__preview-body", children: [
|
|
6681
|
+
/* @__PURE__ */ (0, import_jsx_runtime72.jsx)("h3", { children: labels.previewHeading }),
|
|
6682
|
+
/* @__PURE__ */ (0, import_jsx_runtime72.jsx)("p", { children: labels.previewBody }),
|
|
6683
|
+
/* @__PURE__ */ (0, import_jsx_runtime72.jsx)("button", { type: "button", className: "uix-btn uix-btn--primary", children: labels.previewPrimary }),
|
|
6684
|
+
/* @__PURE__ */ (0, import_jsx_runtime72.jsx)("a", { href: "#brand-profile-preview", children: labels.previewLink })
|
|
6543
6685
|
] })
|
|
6544
6686
|
] })
|
|
6545
6687
|
] });
|
|
@@ -6598,7 +6740,7 @@ function summarizeDiff(entries, resolutions = {}) {
|
|
|
6598
6740
|
}
|
|
6599
6741
|
|
|
6600
6742
|
// src/components/DiffViewer.tsx
|
|
6601
|
-
var
|
|
6743
|
+
var import_jsx_runtime73 = require("react/jsx-runtime");
|
|
6602
6744
|
var DEFAULT_DIFF_VIEWER_LABELS = {
|
|
6603
6745
|
base: "Base",
|
|
6604
6746
|
current: "Current",
|
|
@@ -6647,24 +6789,24 @@ function DiffViewer({
|
|
|
6647
6789
|
if (controlledResolutions === void 0) setInternalResolutions((currentState) => ({ ...currentState, [path]: resolution }));
|
|
6648
6790
|
onResolutionChange?.(path, resolution);
|
|
6649
6791
|
};
|
|
6650
|
-
if (entries.length === 0) return /* @__PURE__ */ (0,
|
|
6651
|
-
/* @__PURE__ */ (0,
|
|
6652
|
-
/* @__PURE__ */ (0,
|
|
6792
|
+
if (entries.length === 0) return /* @__PURE__ */ (0, import_jsx_runtime73.jsxs)("section", { className: cx("uix-diff-viewer uix-diff-viewer--empty", className), "aria-label": labels.region, children: [
|
|
6793
|
+
/* @__PURE__ */ (0, import_jsx_runtime73.jsx)("h3", { children: labels.noDifferences }),
|
|
6794
|
+
/* @__PURE__ */ (0, import_jsx_runtime73.jsx)("p", { children: labels.noDifferencesDetail })
|
|
6653
6795
|
] });
|
|
6654
|
-
return /* @__PURE__ */ (0,
|
|
6655
|
-
/* @__PURE__ */ (0,
|
|
6656
|
-
GROUPS.map((kind) => /* @__PURE__ */ (0,
|
|
6657
|
-
/* @__PURE__ */ (0,
|
|
6796
|
+
return /* @__PURE__ */ (0, import_jsx_runtime73.jsxs)("section", { className: cx("uix-diff-viewer", className), "aria-label": labels.region, children: [
|
|
6797
|
+
/* @__PURE__ */ (0, import_jsx_runtime73.jsxs)("div", { className: "uix-diff-viewer__summary", "aria-label": labels.summary, children: [
|
|
6798
|
+
GROUPS.map((kind) => /* @__PURE__ */ (0, import_jsx_runtime73.jsxs)("span", { children: [
|
|
6799
|
+
/* @__PURE__ */ (0, import_jsx_runtime73.jsx)("b", { children: summary[kind] }),
|
|
6658
6800
|
" ",
|
|
6659
6801
|
labels[kind].toLowerCase()
|
|
6660
6802
|
] }, kind)),
|
|
6661
|
-
/* @__PURE__ */ (0,
|
|
6662
|
-
/* @__PURE__ */ (0,
|
|
6803
|
+
/* @__PURE__ */ (0, import_jsx_runtime73.jsxs)("span", { children: [
|
|
6804
|
+
/* @__PURE__ */ (0, import_jsx_runtime73.jsx)("b", { children: summary.resolved }),
|
|
6663
6805
|
" ",
|
|
6664
6806
|
labels.resolved
|
|
6665
6807
|
] }),
|
|
6666
|
-
/* @__PURE__ */ (0,
|
|
6667
|
-
/* @__PURE__ */ (0,
|
|
6808
|
+
/* @__PURE__ */ (0, import_jsx_runtime73.jsxs)("span", { children: [
|
|
6809
|
+
/* @__PURE__ */ (0, import_jsx_runtime73.jsx)("b", { children: summary.pending }),
|
|
6668
6810
|
" ",
|
|
6669
6811
|
labels.pending
|
|
6670
6812
|
] })
|
|
@@ -6672,33 +6814,33 @@ function DiffViewer({
|
|
|
6672
6814
|
GROUPS.map((kind) => {
|
|
6673
6815
|
const grouped = entries.filter((entry) => entry.kind === kind);
|
|
6674
6816
|
if (!grouped.length) return null;
|
|
6675
|
-
return /* @__PURE__ */ (0,
|
|
6676
|
-
/* @__PURE__ */ (0,
|
|
6817
|
+
return /* @__PURE__ */ (0, import_jsx_runtime73.jsxs)("section", { className: "uix-diff-viewer__group", "aria-labelledby": `${id}-${kind}`, children: [
|
|
6818
|
+
/* @__PURE__ */ (0, import_jsx_runtime73.jsxs)("h3", { id: `${id}-${kind}`, children: [
|
|
6677
6819
|
labels[kind],
|
|
6678
6820
|
" ",
|
|
6679
|
-
/* @__PURE__ */ (0,
|
|
6821
|
+
/* @__PURE__ */ (0, import_jsx_runtime73.jsx)("span", { children: grouped.length })
|
|
6680
6822
|
] }),
|
|
6681
6823
|
grouped.map((entry) => {
|
|
6682
6824
|
const resolution = resolutions[entry.path] ?? "pending";
|
|
6683
|
-
return /* @__PURE__ */ (0,
|
|
6684
|
-
/* @__PURE__ */ (0,
|
|
6685
|
-
/* @__PURE__ */ (0,
|
|
6686
|
-
/* @__PURE__ */ (0,
|
|
6825
|
+
return /* @__PURE__ */ (0, import_jsx_runtime73.jsxs)("details", { className: "uix-diff-viewer__entry", "data-kind": entry.kind, open: entry.kind === "conflicted", children: [
|
|
6826
|
+
/* @__PURE__ */ (0, import_jsx_runtime73.jsxs)("summary", { children: [
|
|
6827
|
+
/* @__PURE__ */ (0, import_jsx_runtime73.jsx)("code", { children: entry.path }),
|
|
6828
|
+
/* @__PURE__ */ (0, import_jsx_runtime73.jsx)(StatusPill, { tone: resolution === "pending" ? "warning" : "success", children: resolutionLabel[resolution] })
|
|
6687
6829
|
] }),
|
|
6688
|
-
/* @__PURE__ */ (0,
|
|
6689
|
-
/* @__PURE__ */ (0,
|
|
6690
|
-
/* @__PURE__ */ (0,
|
|
6830
|
+
/* @__PURE__ */ (0, import_jsx_runtime73.jsx)("div", { className: "uix-diff-viewer__versions", children: ["base", "current", "incoming"].map((version) => /* @__PURE__ */ (0, import_jsx_runtime73.jsxs)("div", { role: "region", "aria-label": fillLabel(labels.valueFor, { version: labels[version], path: entry.path }), children: [
|
|
6831
|
+
/* @__PURE__ */ (0, import_jsx_runtime73.jsx)("strong", { children: labels[version] }),
|
|
6832
|
+
/* @__PURE__ */ (0, import_jsx_runtime73.jsx)("pre", { children: renderValue(entry[version], labels.notPresent) })
|
|
6691
6833
|
] }, version)) }),
|
|
6692
|
-
/* @__PURE__ */ (0,
|
|
6693
|
-
/* @__PURE__ */ (0,
|
|
6694
|
-
/* @__PURE__ */ (0,
|
|
6695
|
-
/* @__PURE__ */ (0,
|
|
6834
|
+
/* @__PURE__ */ (0, import_jsx_runtime73.jsxs)("div", { className: "uix-diff-viewer__actions", "aria-label": fillLabel(labels.resolve, { path: entry.path }), children: [
|
|
6835
|
+
/* @__PURE__ */ (0, import_jsx_runtime73.jsx)("button", { type: "button", className: "uix-btn uix-btn--primary uix-btn--sm", "aria-pressed": resolution === "accept", onClick: () => resolve2(entry.path, "accept"), children: labels.acceptIncoming }),
|
|
6836
|
+
/* @__PURE__ */ (0, import_jsx_runtime73.jsx)("button", { type: "button", className: "uix-btn uix-btn--secondary uix-btn--sm", "aria-pressed": resolution === "skip", onClick: () => resolve2(entry.path, "skip"), children: labels.keepCurrent }),
|
|
6837
|
+
/* @__PURE__ */ (0, import_jsx_runtime73.jsx)("button", { type: "button", className: "uix-btn uix-btn--ghost uix-btn--sm", "aria-pressed": resolution === "pending", onClick: () => resolve2(entry.path, "pending"), children: labels.markPending })
|
|
6696
6838
|
] })
|
|
6697
6839
|
] }, entry.path);
|
|
6698
6840
|
})
|
|
6699
6841
|
] }, kind);
|
|
6700
6842
|
}),
|
|
6701
|
-
/* @__PURE__ */ (0,
|
|
6843
|
+
/* @__PURE__ */ (0, import_jsx_runtime73.jsx)("p", { className: "uix-visually-hidden", "aria-live": "polite", children: fillLabel(labels.progress, { resolved: summary.resolved, total: entries.length }) })
|
|
6702
6844
|
] });
|
|
6703
6845
|
}
|
|
6704
6846
|
// Annotate the CommonJS export names for ESM import in node:
|