@tensor_1/react 2.12.0 → 2.13.0

package/dist/index.cjs

@@ -24,6 +24,9 @@ __export(src_exports, {
   AppShell: () => AppShell,
   Avatar: () => Avatar,
   AvatarGroup: () => AvatarGroup,
+  BrandProfileEditor: () => BrandProfileEditor,
+  BrandProfiles: () => BrandProfiles,
+  BuilderCanvas: () => BuilderCanvas,
   BulkBar: () => BulkBar,
   Button: () => Button,
   ButtonGroup: () => ButtonGroup,
@@ -31,6 +34,7 @@ __export(src_exports, {
   CellStrong: () => CellStrong,
   CellSub: () => CellSub,
   Checkbox: () => Checkbox,
+  ColorPicker: () => ColorPicker,
   CommandGroup: () => CommandGroup,
   CommandItem: () => CommandItem,
   CommandPalette: () => CommandPalette,
@@ -40,9 +44,11 @@ __export(src_exports, {
   ComposerBar: () => ComposerBar,
   ContentList: () => ContentList,
   ContentListItem: () => ContentListItem,
+  DateRangePicker: () => DateRangePicker,
   DescriptionItem: () => DescriptionItem,
   DescriptionList: () => DescriptionList,
   DetailLayout: () => DetailLayout,
+  DiffViewer: () => DiffViewer,
   Drawer: () => Drawer,
   EmptyState: () => EmptyState,
   ErrorState: () => ErrorState,
@@ -63,11 +69,14 @@ __export(src_exports, {
   KanbanCard: () => KanbanCard,
   KanbanColumn: () => KanbanColumn,
   Label: () => Label,
+  LicensePositionBar: () => LicensePositionBar,
   List: () => List,
   ListItem: () => ListItem,
   LoadingState: () => LoadingState,
   Mark: () => Mark,
+  MatchReview: () => MatchReview,
   Meter: () => Meter,
+  MetricInput: () => MetricInput,
   Modal: () => Modal,
   NavFavourites: () => NavFavourites,
   NavGroup: () => NavGroup,
@@ -84,9 +93,12 @@ __export(src_exports, {
   Prose: () => Prose,
   Radio: () => Radio,
   RadioGroup: () => RadioGroup,
+  RelationshipGraph: () => RelationshipGraph,
   ResourceGrid: () => ResourceGrid,
   RowAction: () => RowAction,
   RowActions: () => RowActions,
+  RuleBuilder: () => RuleBuilder,
+  SchedulingCalendar: () => SchedulingCalendar,
   SectionHead: () => SectionHead,
   Segmented: () => Segmented,
   SegmentedOption: () => SegmentedOption,
@@ -117,31 +129,70 @@ __export(src_exports, {
   Tr: () => Tr,
   Tree: () => Tree,
   UserChip: () => UserChip,
+  addCalendarDays: () => addCalendarDays,
+  addCalendarMonths: () => addCalendarMonths,
+  appendRuleNode: () => appendRuleNode,
+  applyBrandProfile: () => applyBrandProfile,
   applyFilters: () => applyFilters,
+  boundRelationshipGraph: () => boundRelationshipGraph,
+  buildMonthGrid: () => buildMonthGrid,
+  buildThreeWayDiff: () => buildThreeWayDiff,
+  clampMetricValue: () => clampMetricValue,
   clampWidth: () => clampWidth,
   computePosition: () => computePosition,
+  contrastRatio: () => contrastRatio,
   cx: () => cx,
+  enumerateDateSpan: () => enumerateDateSpan,
+  findRuleNodeDepth: () => findRuleNodeDepth,
   flattenTree: () => flattenTree,
+  hexToRgb: () => hexToRgb,
   highlightSegments: () => highlightSegments,
+  hsvToHex: () => hsvToHex,
+  hsvToRgb: () => hsvToRgb,
+  isDateInRange: () => isDateInRange,
+  isDateUnavailable: () => isDateUnavailable,
+  isRuleGroup: () => isRuleGroup,
+  layoutRelationshipGraph: () => layoutRelationshipGraph,
+  mapRuleGroup: () => mapRuleGroup,
   matchFilter: () => matchFilter,
+  meetsContrast: () => meetsContrast,
   mergePinned: () => mergePinned,
+  moveRuleNode: () => moveRuleNode,
   multiSort: () => multiSort,
   nextSortDir: () => nextSortDir,
+  normalizeHex: () => normalizeHex,
+  parseMetricValue: () => parseMetricValue,
   parseView: () => parseView,
+  relationshipNeighbors: () => relationshipNeighbors,
+  removeRuleNode: () => removeRuleNode,
   reorder: () => reorder,
+  restoreBrandProfile: () => restoreBrandProfile,
+  rgbToHex: () => rgbToHex,
+  rgbToHsv: () => rgbToHsv,
+  ruleDepth: () => ruleDepth,
   searchRows: () => searchRows,
   selectAllState: () => selectAllState,
+  selectRangeDate: () => selectRangeDate,
   serializeView: () => serializeView,
   shouldVirtualize: () => shouldVirtualize,
+  startOfMonth: () => startOfMonth,
+  stepMetricValue: () => stepMetricValue,
+  summarizeDiff: () => summarizeDiff,
+  summarizeRule: () => summarizeRule,
+  toDateKey: () => toDateKey,
   toggleId: () => toggleId,
   togglePage: () => togglePage,
   toggleSort: () => toggleSort,
+  traverseRelationshipNode: () => traverseRelationshipNode,
   treeNav: () => treeNav,
   useAnchoredPosition: () => useAnchoredPosition,
   useDialog: () => useDialog,
   useTable: () => useTable,
   useVirtualRows: () => useVirtualRows,
-  virtualWindow: () => virtualWindow
+  validateRuleDefinition: () => validateRuleDefinition,
+  virtualWindow: () => virtualWindow,
+  zonedDateKey: () => zonedDateKey,
+  zonedDateSpan: () => zonedDateSpan
 });
 module.exports = __toCommonJS(src_exports);
 
@@ -2549,12 +2600,1664 @@ function StatusRow({ indicator, name, meta, className, ...props }) {
     meta != null && /* @__PURE__ */ (0, import_jsx_runtime45.jsx)("span", { className: "uix-list-meta", children: meta })
   ] });
 }
+
+// src/rule-builder-model.ts
+function isRuleGroup(node) {
+  return "conditions" in node;
+}
+function ruleDepth(group) {
+  return 1 + Math.max(0, ...group.conditions.filter(isRuleGroup).map(ruleDepth));
+}
+function findRuleNodeDepth(group, id, depth = 1) {
+  if (group.id === id) return depth;
+  for (const node of group.conditions) {
+    if (node.id === id) return depth + 1;
+    if (isRuleGroup(node)) {
+      const found = findRuleNodeDepth(node, id, depth + 1);
+      if (found !== void 0) return found;
+    }
+  }
+  return void 0;
+}
+function mapRuleGroup(group, id, update) {
+  if (group.id === id) return update(group);
+  return {
+    ...group,
+    conditions: group.conditions.map((node) => {
+      if (node.id === id) return update(node);
+      return isRuleGroup(node) ? mapRuleGroup(node, id, update) : node;
+    })
+  };
+}
+function appendRuleNode(group, parentId, node, maxDepth = 3) {
+  const parentDepth = findRuleNodeDepth(group, parentId);
+  if (parentDepth === void 0) return group;
+  const addedDepth = isRuleGroup(node) ? ruleDepth(node) : 0;
+  if (parentDepth + addedDepth > maxDepth) return group;
+  return mapRuleGroup(group, parentId, (parent) => isRuleGroup(parent) ? { ...parent, conditions: [...parent.conditions, node] } : parent);
+}
+function removeRuleNode(group, id) {
+  return {
+    ...group,
+    conditions: group.conditions.filter((node) => node.id !== id).map((node) => isRuleGroup(node) ? removeRuleNode(node, id) : node)
+  };
+}
+function moveRuleNode(group, id, direction) {
+  const index = group.conditions.findIndex((node) => node.id === id);
+  if (index >= 0) {
+    const target = index + direction;
+    if (target < 0 || target >= group.conditions.length) return group;
+    const conditions = [...group.conditions];
+    [conditions[index], conditions[target]] = [conditions[target], conditions[index]];
+    return { ...group, conditions };
+  }
+  return {
+    ...group,
+    conditions: group.conditions.map((node) => isRuleGroup(node) ? moveRuleNode(node, id, direction) : node)
+  };
+}
+function validateRuleDefinition(value, maxDepth = 3) {
+  const issues = [];
+  const ids = /* @__PURE__ */ new Set();
+  const visit = (group, path, depth) => {
+    if (ids.has(group.id)) issues.push({ path, message: `Duplicate id \u201C${group.id}\u201D.` });
+    ids.add(group.id);
+    if (depth > maxDepth) issues.push({ path, message: `Nesting exceeds ${maxDepth} levels.` });
+    if (group.conditions.length === 0) issues.push({ path, message: "Add at least one condition." });
+    group.conditions.forEach((node, index) => {
+      const nodePath = `${path}.conditions[${index}]`;
+      if (ids.has(node.id)) issues.push({ path: nodePath, message: `Duplicate id \u201C${node.id}\u201D.` });
+      if (isRuleGroup(node)) visit(node, nodePath, depth + 1);
+      else {
+        ids.add(node.id);
+        if (!node.field) issues.push({ path: nodePath, message: "Choose a field." });
+        if (!node.operator) issues.push({ path: nodePath, message: "Choose an operator." });
+      }
+    });
+  };
+  visit(value.when, "when", 1);
+  if (value.then.length === 0) issues.push({ path: "then", message: "Add at least one action." });
+  value.then.forEach((action, index) => {
+    if (ids.has(action.id)) issues.push({ path: `then[${index}]`, message: `Duplicate id \u201C${action.id}\u201D.` });
+    ids.add(action.id);
+    if (!action.type) issues.push({ path: `then[${index}]`, message: "Choose an action." });
+  });
+  return issues;
+}
+function summarizeRule(value, labels = {}) {
+  const formatValue = (input) => input === void 0 ? "" : ` ${JSON.stringify(input)}`;
+  const formatGroup = (group) => group.conditions.map(
+    (node) => isRuleGroup(node) ? `(${formatGroup(node)})` : `${labels.fields?.[node.field] ?? node.field} ${labels.operators?.[node.operator] ?? node.operator}${formatValue(node.value)}`
+  ).join(` ${group.combinator.toUpperCase()} `);
+  const actions = value.then.map((action) => labels.actions?.[action.type] ?? action.type).join(", ");
+  return `When ${formatGroup(value.when) || "no conditions"}, then ${actions || "no actions"}.`;
+}
+
+// src/components/RuleBuilder.tsx
+var import_jsx_runtime46 = require("react/jsx-runtime");
+var ruleId = 0;
+var nextId = (prefix) => `${prefix}-${Date.now().toString(36)}-${(++ruleId).toString(36)}`;
+function defaultCondition(fields, operators) {
+  const field = fields[0];
+  const operator = operators.find((item) => field?.operators?.includes(item.id)) ?? operators[0];
+  return { id: nextId("condition"), field: field?.id ?? "", operator: operator?.id ?? "", value: "" };
+}
+function RuleGroupEditor({ group, depth, root, fields, operators, maxDepth, disabled, onRootChange, labels }) {
+  const updateNode = (id, update) => onRootChange(mapRuleGroup(root, id, update));
+  const addCondition = () => onRootChange(appendRuleNode(root, group.id, defaultCondition(fields, operators), maxDepth));
+  const addGroup = () => onRootChange(appendRuleNode(root, group.id, {
+    id: nextId("group"),
+    combinator: "and",
+    conditions: [defaultCondition(fields, operators)]
+  }, maxDepth));
+  return /* @__PURE__ */ (0, import_jsx_runtime46.jsxs)("fieldset", { className: "uix-rule-builder__group", "data-depth": depth, children: [
+    /* @__PURE__ */ (0, import_jsx_runtime46.jsxs)("legend", { className: "uix-rule-builder__group-heading", children: [
+      /* @__PURE__ */ (0, import_jsx_runtime46.jsx)("span", { children: depth === 1 ? "When" : "Group" }),
+      /* @__PURE__ */ (0, import_jsx_runtime46.jsxs)("label", { children: [
+        "Match",
+        /* @__PURE__ */ (0, import_jsx_runtime46.jsxs)("select", { className: "uix-select uix-select--sm", value: group.combinator, disabled, onChange: (event) => updateNode(group.id, (node) => ({ ...node, combinator: event.currentTarget.value })), children: [
+          /* @__PURE__ */ (0, import_jsx_runtime46.jsx)("option", { value: "and", children: "all (AND)" }),
+          /* @__PURE__ */ (0, import_jsx_runtime46.jsx)("option", { value: "or", children: "any (OR)" })
+        ] })
+      ] })
+    ] }),
+    /* @__PURE__ */ (0, import_jsx_runtime46.jsx)("div", { className: "uix-rule-builder__rows", children: group.conditions.map((node, index) => isRuleGroup(node) ? /* @__PURE__ */ (0, import_jsx_runtime46.jsxs)("div", { className: "uix-rule-builder__nested", children: [
+      /* @__PURE__ */ (0, import_jsx_runtime46.jsx)(RuleGroupEditor, { ...{ group: node, depth: depth + 1, root, fields, operators, maxDepth, disabled, onRootChange, labels } }),
+      /* @__PURE__ */ (0, import_jsx_runtime46.jsx)(RowControls, { label: "group", 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)) })
+    ] }, node.id) : /* @__PURE__ */ (0, import_jsx_runtime46.jsx)(
+      ConditionRow,
+      {
+        condition: node,
+        fields,
+        operators,
+        disabled,
+        onChange: (condition) => updateNode(node.id, () => condition),
+        controls: /* @__PURE__ */ (0, import_jsx_runtime46.jsx)(RowControls, { label: "condition", 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)) })
+      },
+      node.id
+    )) }),
+    /* @__PURE__ */ (0, import_jsx_runtime46.jsxs)("div", { className: "uix-rule-builder__add", children: [
+      /* @__PURE__ */ (0, import_jsx_runtime46.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 }),
+      /* @__PURE__ */ (0, import_jsx_runtime46.jsx)("button", { type: "button", className: "uix-btn uix-btn--ghost uix-btn--sm", onClick: addGroup, disabled: disabled || depth >= maxDepth, children: labels.addGroup })
+    ] })
+  ] });
+}
+function ConditionRow({ condition, fields, operators, disabled, onChange, controls }) {
+  const field = fields.find((item) => item.id === condition.field);
+  const availableOperators = field?.operators?.length ? operators.filter((item) => field.operators.includes(item.id)) : operators;
+  const operator = operators.find((item) => item.id === condition.operator);
+  const setField = (id) => {
+    const nextField = fields.find((item) => item.id === id);
+    const nextOperator = operators.find((item) => nextField?.operators?.includes(item.id)) ?? availableOperators[0] ?? operators[0];
+    onChange({ ...condition, field: id, operator: nextOperator?.id ?? "" });
+  };
+  return /* @__PURE__ */ (0, import_jsx_runtime46.jsxs)("div", { className: "uix-rule-builder__condition", children: [
+    /* @__PURE__ */ (0, import_jsx_runtime46.jsxs)("label", { children: [
+      /* @__PURE__ */ (0, import_jsx_runtime46.jsx)("span", { className: "uix-visually-hidden", children: "Field" }),
+      /* @__PURE__ */ (0, import_jsx_runtime46.jsx)("select", { className: "uix-select", value: condition.field, onChange: (event) => setField(event.currentTarget.value), disabled, children: fields.map((item) => /* @__PURE__ */ (0, import_jsx_runtime46.jsx)("option", { value: item.id, children: item.label }, item.id)) })
+    ] }),
+    /* @__PURE__ */ (0, import_jsx_runtime46.jsxs)("label", { children: [
+      /* @__PURE__ */ (0, import_jsx_runtime46.jsx)("span", { className: "uix-visually-hidden", children: "Operator" }),
+      /* @__PURE__ */ (0, import_jsx_runtime46.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_runtime46.jsx)("option", { value: item.id, children: item.label }, item.id)) })
+    ] }),
+    operator?.requiresValue !== false && /* @__PURE__ */ (0, import_jsx_runtime46.jsx)("div", { className: "uix-rule-builder__value", children: field?.renderValueEditor?.({ condition, onChange: (value) => onChange({ ...condition, value }), disabled }) ?? /* @__PURE__ */ (0, import_jsx_runtime46.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": `Value for ${field?.label ?? "condition"}` }) }),
+    controls
+  ] });
+}
+function RowControls({ label, first, last, disabled, onUp, onDown, onRemove }) {
+  return /* @__PURE__ */ (0, import_jsx_runtime46.jsxs)("span", { className: "uix-rule-builder__row-actions", children: [
+    /* @__PURE__ */ (0, import_jsx_runtime46.jsx)("button", { type: "button", className: "uix-btn uix-btn--ghost uix-btn--sm", onClick: onUp, disabled: disabled || first, "aria-label": `Move ${label} up`, children: "Up" }),
+    /* @__PURE__ */ (0, import_jsx_runtime46.jsx)("button", { type: "button", className: "uix-btn uix-btn--ghost uix-btn--sm", onClick: onDown, disabled: disabled || last, "aria-label": `Move ${label} down`, children: "Down" }),
+    /* @__PURE__ */ (0, import_jsx_runtime46.jsx)("button", { type: "button", className: "uix-btn uix-btn--ghost uix-btn--sm", onClick: onRemove, disabled, "aria-label": `Remove ${label}`, children: "Remove" })
+  ] });
+}
+function RuleBuilder({
+  value,
+  onChange,
+  fields,
+  operators,
+  actions,
+  maxDepth = 3,
+  readOnly = false,
+  validate,
+  className,
+  addConditionLabel = "Add condition",
+  addGroupLabel = "Add group",
+  addActionLabel = "Add action"
+}) {
+  const issues = [...validateRuleDefinition(value, maxDepth), ...validate?.(value) ?? []];
+  const fieldLabels = Object.fromEntries(fields.map((field) => [field.id, field.label]));
+  const operatorLabels = Object.fromEntries(operators.map((operator) => [operator.id, operator.label]));
+  const actionLabels = Object.fromEntries(actions.map((action) => [action.id, action.label]));
+  if (readOnly) return /* @__PURE__ */ (0, import_jsx_runtime46.jsxs)("section", { className: cx("uix-rule-builder uix-rule-builder--summary", className), "aria-label": "Rule summary", children: [
+    /* @__PURE__ */ (0, import_jsx_runtime46.jsx)("p", { children: summarizeRule(value, { fields: fieldLabels, operators: operatorLabels, actions: actionLabels }) }),
+    issues.length > 0 && /* @__PURE__ */ (0, import_jsx_runtime46.jsxs)("p", { className: "uix-rule-builder__invalid", children: [
+      "Rule has ",
+      issues.length,
+      " validation issue",
+      issues.length === 1 ? "" : "s",
+      "."
+    ] })
+  ] });
+  const updateActions = (next) => onChange({ ...value, then: next });
+  return /* @__PURE__ */ (0, import_jsx_runtime46.jsxs)("section", { className: cx("uix-rule-builder", className), "aria-label": "Rule builder", children: [
+    /* @__PURE__ */ (0, import_jsx_runtime46.jsx)(RuleGroupEditor, { group: value.when, depth: 1, root: value.when, fields, operators, maxDepth, disabled: readOnly, onRootChange: (when) => onChange({ ...value, when }), labels: { addCondition: addConditionLabel, addGroup: addGroupLabel } }),
+    /* @__PURE__ */ (0, import_jsx_runtime46.jsxs)("fieldset", { className: "uix-rule-builder__actions", children: [
+      /* @__PURE__ */ (0, import_jsx_runtime46.jsx)("legend", { children: "Then" }),
+      value.then.map((action, index) => {
+        const definition = actions.find((item) => item.id === action.type);
+        return /* @__PURE__ */ (0, import_jsx_runtime46.jsxs)("div", { className: "uix-rule-builder__action", children: [
+          /* @__PURE__ */ (0, import_jsx_runtime46.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": "Action type", children: actions.map((item) => /* @__PURE__ */ (0, import_jsx_runtime46.jsx)("option", { value: item.id, children: item.label }, item.id)) }),
+          definition?.renderParameters?.(action, (parameters) => updateActions(value.then.map((item) => item.id === action.id ? { ...item, parameters } : item)), false),
+          /* @__PURE__ */ (0, import_jsx_runtime46.jsx)(
+            RowControls,
+            {
+              label: "action",
+              first: index === 0,
+              last: index === value.then.length - 1,
+              disabled: false,
+              onUp: () => {
+                const next = [...value.then];
+                [next[index - 1], next[index]] = [next[index], next[index - 1]];
+                updateActions(next);
+              },
+              onDown: () => {
+                const next = [...value.then];
+                [next[index + 1], next[index]] = [next[index], next[index + 1]];
+                updateActions(next);
+              },
+              onRemove: () => updateActions(value.then.filter((item) => item.id !== action.id))
+            }
+          )
+        ] }, action.id);
+      }),
+      /* @__PURE__ */ (0, import_jsx_runtime46.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: addActionLabel })
+    ] }),
+    /* @__PURE__ */ (0, import_jsx_runtime46.jsx)("div", { className: "uix-rule-builder__validation", "aria-live": "polite", children: issues.length === 0 ? /* @__PURE__ */ (0, import_jsx_runtime46.jsx)("span", { children: "Rule is valid." }) : /* @__PURE__ */ (0, import_jsx_runtime46.jsxs)(import_jsx_runtime46.Fragment, { children: [
+      /* @__PURE__ */ (0, import_jsx_runtime46.jsxs)("strong", { children: [
+        issues.length,
+        " validation issue",
+        issues.length === 1 ? "" : "s"
+      ] }),
+      /* @__PURE__ */ (0, import_jsx_runtime46.jsx)("ul", { children: issues.map((issue, index) => /* @__PURE__ */ (0, import_jsx_runtime46.jsx)("li", { children: issue.message }, `${issue.path}-${index}`)) })
+    ] }) })
+  ] });
+}
+
+// src/components/BuilderCanvas.tsx
+var import_react23 = require("react");
+var import_jsx_runtime47 = require("react/jsx-runtime");
+function BuilderCanvas({
+  items,
+  onItemsChange,
+  palette,
+  selectedId: controlledSelectedId,
+  onSelect,
+  renderItem,
+  renderProperties,
+  loading,
+  error,
+  onRetry,
+  emptyMessage = "Add an item from the palette to begin.",
+  className
+}) {
+  const [internalSelectedId, setInternalSelectedId] = (0, import_react23.useState)();
+  const [draggedId, setDraggedId] = (0, import_react23.useState)();
+  const propertyHeadingRef = (0, import_react23.useRef)(null);
+  const shouldFocusProperties = (0, import_react23.useRef)(false);
+  const selectedId = controlledSelectedId ?? internalSelectedId;
+  const selected = items.find((item) => item.id === selectedId);
+  (0, import_react23.useEffect)(() => {
+    if (shouldFocusProperties.current && selected) {
+      propertyHeadingRef.current?.focus();
+      shouldFocusProperties.current = false;
+    }
+  }, [selected]);
+  const select = (id, focusProperties = true) => {
+    shouldFocusProperties.current = focusProperties;
+    if (controlledSelectedId === void 0) setInternalSelectedId(id);
+    onSelect?.(id);
+  };
+  const move = (id, direction) => {
+    const index = items.findIndex((item) => item.id === id);
+    const target = index + direction;
+    if (index < 0 || target < 0 || target >= items.length) return;
+    onItemsChange(reorder(items, index, target));
+  };
+  const add = (paletteItem) => {
+    const item = paletteItem.create();
+    onItemsChange([...items, item]);
+    select(item.id);
+  };
+  const remove = (id) => {
+    onItemsChange(items.filter((item) => item.id !== id));
+    if (selectedId === id) select(void 0, false);
+  };
+  const drop = (event, targetId) => {
+    event.preventDefault();
+    if (!draggedId || draggedId === targetId) return;
+    const from = items.findIndex((item) => item.id === draggedId);
+    const to = items.findIndex((item) => item.id === targetId);
+    if (from >= 0 && to >= 0) onItemsChange(reorder(items, from, to));
+    setDraggedId(void 0);
+  };
+  return /* @__PURE__ */ (0, import_jsx_runtime47.jsxs)("section", { className: cx("uix-builder-canvas", className), "aria-label": "Builder canvas", children: [
+    /* @__PURE__ */ (0, import_jsx_runtime47.jsxs)("aside", { className: "uix-builder-canvas__palette", "aria-label": "Item palette", children: [
+      /* @__PURE__ */ (0, import_jsx_runtime47.jsx)("h3", { children: "Palette" }),
+      palette.length === 0 ? /* @__PURE__ */ (0, import_jsx_runtime47.jsx)("p", { children: "No item types available." }) : /* @__PURE__ */ (0, import_jsx_runtime47.jsx)("ul", { children: palette.map((item) => /* @__PURE__ */ (0, import_jsx_runtime47.jsx)("li", { children: /* @__PURE__ */ (0, import_jsx_runtime47.jsxs)("button", { type: "button", onClick: () => add(item), children: [
+        /* @__PURE__ */ (0, import_jsx_runtime47.jsx)("strong", { children: item.label }),
+        item.description && /* @__PURE__ */ (0, import_jsx_runtime47.jsx)("span", { children: item.description }),
+        /* @__PURE__ */ (0, import_jsx_runtime47.jsx)("span", { "aria-hidden": "true", children: "Add" })
+      ] }) }, item.id)) })
+    ] }),
+    /* @__PURE__ */ (0, import_jsx_runtime47.jsxs)("div", { className: "uix-builder-canvas__workspace", children: [
+      /* @__PURE__ */ (0, import_jsx_runtime47.jsx)("h3", { children: "Canvas" }),
+      loading ? /* @__PURE__ */ (0, import_jsx_runtime47.jsx)("div", { className: "uix-builder-canvas__state", role: "status", children: "Loading canvas\u2026" }) : error ? /* @__PURE__ */ (0, import_jsx_runtime47.jsxs)("div", { className: "uix-builder-canvas__state", role: "alert", children: [
+        /* @__PURE__ */ (0, import_jsx_runtime47.jsx)("p", { children: error }),
+        onRetry && /* @__PURE__ */ (0, import_jsx_runtime47.jsx)("button", { type: "button", className: "uix-btn uix-btn--secondary", onClick: onRetry, children: "Try again" })
+      ] }) : items.length === 0 ? /* @__PURE__ */ (0, import_jsx_runtime47.jsxs)("div", { className: "uix-builder-canvas__state", children: [
+        /* @__PURE__ */ (0, import_jsx_runtime47.jsx)("p", { children: emptyMessage }),
+        palette[0] && /* @__PURE__ */ (0, import_jsx_runtime47.jsxs)("button", { type: "button", className: "uix-btn uix-btn--primary", onClick: () => add(palette[0]), children: [
+          "Add ",
+          palette[0].label
+        ] })
+      ] }) : /* @__PURE__ */ (0, import_jsx_runtime47.jsx)("ol", { className: "uix-builder-canvas__items", children: items.map((item, index) => /* @__PURE__ */ (0, import_jsx_runtime47.jsxs)(
+        "li",
+        {
+          draggable: true,
+          onDragStart: () => setDraggedId(item.id),
+          onDragEnd: () => setDraggedId(void 0),
+          onDragOver: (event) => event.preventDefault(),
+          onDrop: (event) => drop(event, item.id),
+          className: cx("uix-builder-canvas__item", selectedId === item.id && "uix-builder-canvas__item--selected"),
+          children: [
+            /* @__PURE__ */ (0, import_jsx_runtime47.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_runtime47.jsxs)(import_jsx_runtime47.Fragment, { children: [
+              /* @__PURE__ */ (0, import_jsx_runtime47.jsx)("strong", { children: item.label }),
+              item.description && /* @__PURE__ */ (0, import_jsx_runtime47.jsx)("span", { children: item.description })
+            ] }) }),
+            /* @__PURE__ */ (0, import_jsx_runtime47.jsxs)("span", { className: "uix-builder-canvas__item-actions", children: [
+              /* @__PURE__ */ (0, import_jsx_runtime47.jsx)("button", { type: "button", onClick: () => move(item.id, -1), disabled: index === 0, "aria-label": `Move ${item.label} up`, children: "Up" }),
+              /* @__PURE__ */ (0, import_jsx_runtime47.jsx)("button", { type: "button", onClick: () => move(item.id, 1), disabled: index === items.length - 1, "aria-label": `Move ${item.label} down`, children: "Down" }),
+              /* @__PURE__ */ (0, import_jsx_runtime47.jsx)("button", { type: "button", onClick: () => remove(item.id), "aria-label": `Remove ${item.label}`, children: "Remove" })
+            ] })
+          ]
+        },
+        item.id
+      )) })
+    ] }),
+    /* @__PURE__ */ (0, import_jsx_runtime47.jsxs)("aside", { className: "uix-builder-canvas__properties", "aria-label": "Item properties", children: [
+      /* @__PURE__ */ (0, import_jsx_runtime47.jsx)("h3", { ref: propertyHeadingRef, tabIndex: -1, children: "Properties" }),
+      !selected ? /* @__PURE__ */ (0, import_jsx_runtime47.jsx)("p", { children: "Select a canvas item to edit its properties." }) : renderProperties?.(selected, (updated) => onItemsChange(items.map((item) => item.id === updated.id ? updated : item))) ?? /* @__PURE__ */ (0, import_jsx_runtime47.jsxs)("dl", { children: [
+        /* @__PURE__ */ (0, import_jsx_runtime47.jsx)("dt", { children: "Type" }),
+        /* @__PURE__ */ (0, import_jsx_runtime47.jsx)("dd", { children: selected.type }),
+        /* @__PURE__ */ (0, import_jsx_runtime47.jsx)("dt", { children: "Label" }),
+        /* @__PURE__ */ (0, import_jsx_runtime47.jsx)("dd", { children: selected.label })
+      ] })
+    ] })
+  ] });
+}
+
+// src/components/SchedulingCalendar.tsx
+var import_react24 = require("react");
+
+// src/calendar-model.ts
+function fromDateKey(value) {
+  const match = /^(\d{4})-(\d{2})-(\d{2})$/.exec(value);
+  if (!match) throw new TypeError(`Invalid ISO date: ${value}`);
+  return new Date(Date.UTC(Number(match[1]), Number(match[2]) - 1, Number(match[3])));
+}
+function toDateKey(date) {
+  return `${date.getUTCFullYear().toString().padStart(4, "0")}-${(date.getUTCMonth() + 1).toString().padStart(2, "0")}-${date.getUTCDate().toString().padStart(2, "0")}`;
+}
+function addCalendarDays(value, amount) {
+  const date = fromDateKey(value);
+  date.setUTCDate(date.getUTCDate() + amount);
+  return toDateKey(date);
+}
+function addCalendarMonths(value, amount) {
+  const date = fromDateKey(value);
+  const day = date.getUTCDate();
+  date.setUTCDate(1);
+  date.setUTCMonth(date.getUTCMonth() + amount);
+  const last = new Date(Date.UTC(date.getUTCFullYear(), date.getUTCMonth() + 1, 0)).getUTCDate();
+  date.setUTCDate(Math.min(day, last));
+  return toDateKey(date);
+}
+function startOfMonth(value) {
+  return `${value.slice(0, 7)}-01`;
+}
+function buildMonthGrid(month, weekStartsOn = 1) {
+  const first = fromDateKey(startOfMonth(month));
+  const offset = (first.getUTCDay() - weekStartsOn + 7) % 7;
+  const start = addCalendarDays(toDateKey(first), -offset);
+  return Array.from({ length: 42 }, (_, index) => {
+    const date = addCalendarDays(start, index);
+    const parsed = fromDateKey(date);
+    return {
+      date,
+      day: parsed.getUTCDate(),
+      inMonth: date.slice(0, 7) === month.slice(0, 7),
+      weekday: parsed.getUTCDay()
+    };
+  });
+}
+function zonedDateKey(instant, timeZone) {
+  const date = instant instanceof Date ? instant : new Date(instant);
+  if (Number.isNaN(date.getTime())) throw new TypeError(`Invalid instant: ${String(instant)}`);
+  const parts = new Intl.DateTimeFormat("en-CA", {
+    timeZone,
+    year: "numeric",
+    month: "2-digit",
+    day: "2-digit"
+  }).formatToParts(date);
+  const get = (type) => parts.find((part) => part.type === type)?.value ?? "";
+  return `${get("year")}-${get("month")}-${get("day")}`;
+}
+function zonedDateSpan(start, end, timeZone) {
+  const startKey = zonedDateKey(start, timeZone);
+  const endKey = zonedDateKey(end, timeZone);
+  return startKey <= endKey ? { start: startKey, end: endKey } : { start: endKey, end: startKey };
+}
+function enumerateDateSpan(span, limit = 370) {
+  const dates = [];
+  let current = span.start;
+  while (current <= span.end && dates.length < limit) {
+    dates.push(current);
+    current = addCalendarDays(current, 1);
+  }
+  return dates;
+}
+function selectRangeDate(current, date) {
+  if (!current.start || current.end) return { start: date };
+  return date < current.start ? { start: date, end: current.start } : { start: current.start, end: date };
+}
+function isDateInRange(date, value) {
+  return !!value.start && !!value.end && date >= value.start && date <= value.end;
+}
+function isDateUnavailable(date, options) {
+  return !!options.min && date < options.min || !!options.max && date > options.max || !!options.isDisabled?.(date);
+}
+
+// src/components/SchedulingCalendar.tsx
+var import_jsx_runtime48 = require("react/jsx-runtime");
+var stateLabel = { scheduled: "Scheduled", conflicted: "Conflicted", "in-progress": "In progress", "blackout-violation": "Blackout violation" };
+var stateTone = (state) => state === "scheduled" ? "info" : state === "in-progress" ? "success" : "danger";
+var dateLabel = (date, locale) => new Intl.DateTimeFormat(locale, { dateStyle: "full", timeZone: "UTC" }).format(/* @__PURE__ */ new Date(`${date}T00:00:00Z`));
+var EMPTY_OVERLAYS = [];
+function SchedulingCalendar({
+  entries,
+  anchorDate,
+  timeZone,
+  view: controlledView,
+  onViewChange,
+  onAnchorDateChange,
+  onSelectEntry,
+  overlays = EMPTY_OVERLAYS,
+  filter,
+  renderEntry,
+  locale,
+  loading,
+  error,
+  onRetry,
+  className
+}) {
+  const [internalView, setInternalView] = (0, import_react24.useState)("month");
+  const view = controlledView ?? internalView;
+  const [activeDate, setActiveDate] = (0, import_react24.useState)(anchorDate);
+  const gridRef = (0, import_react24.useRef)(null);
+  const visibleEntries = (0, import_react24.useMemo)(() => entries.filter((entry) => filter?.(entry) ?? true), [entries, filter]);
+  const entrySpans = (0, import_react24.useMemo)(() => new Map(visibleEntries.map((entry) => [entry.id, zonedDateSpan(entry.start, entry.end, timeZone)])), [visibleEntries, timeZone]);
+  const overlaySpans = (0, import_react24.useMemo)(() => new Map(overlays.map((overlay) => [overlay.id, { start: overlay.start.slice(0, 10), end: overlay.end.slice(0, 10) }])), [overlays]);
+  const monthDays = (0, import_react24.useMemo)(() => buildMonthGrid(startOfMonth(anchorDate)), [anchorDate]);
+  const weekday = ((/* @__PURE__ */ new Date(`${anchorDate}T00:00:00Z`)).getUTCDay() + 6) % 7;
+  const weekStart = addCalendarDays(anchorDate, -weekday);
+  const weekDays = (0, import_react24.useMemo)(() => Array.from({ length: 7 }, (_, index) => addCalendarDays(weekStart, index)), [weekStart]);
+  const days = (0, import_react24.useMemo)(() => view === "month" ? monthDays.map((day) => day.date) : weekDays, [view, monthDays, weekDays]);
+  (0, import_react24.useEffect)(() => {
+    if (view !== "agenda" && !days.includes(activeDate)) setActiveDate(days[0]);
+  }, [activeDate, days, view]);
+  const setView = (next) => {
+    if (controlledView === void 0) setInternalView(next);
+    onViewChange?.(next);
+  };
+  const movePeriod = (direction) => onAnchorDateChange?.(view === "month" ? addCalendarMonths(anchorDate, direction) : addCalendarDays(anchorDate, direction * 7));
+  const focusDate = (date) => {
+    setActiveDate(date);
+    requestAnimationFrame(() => gridRef.current?.querySelector(`[data-calendar-date="${date}"]`)?.focus());
+  };
+  const onDayKeyDown = (event, date) => {
+    const offset = { ArrowLeft: -1, ArrowRight: 1, ArrowUp: -7, ArrowDown: 7 }[event.key];
+    if (offset) {
+      event.preventDefault();
+      focusDate(addCalendarDays(date, offset));
+    } else if (event.key === "Home") {
+      event.preventDefault();
+      focusDate(days[0]);
+    } else if (event.key === "End") {
+      event.preventDefault();
+      focusDate(days[days.length - 1]);
+    }
+  };
+  const entriesFor = (date) => visibleEntries.filter((entry) => {
+    const span = entrySpans.get(entry.id);
+    return date >= span.start && date <= span.end;
+  });
+  const overlaysFor = (date) => overlays.filter((overlay) => {
+    const span = overlaySpans.get(overlay.id);
+    return date >= span.start && date <= span.end;
+  });
+  const formatInstant = (instant) => new Intl.DateTimeFormat(locale, { timeZone, dateStyle: "medium", timeStyle: "short" }).format(new Date(instant));
+  return /* @__PURE__ */ (0, import_jsx_runtime48.jsxs)("section", { className: cx("uix-scheduling-calendar", className), "aria-label": `Scheduling calendar in ${timeZone}`, children: [
+    /* @__PURE__ */ (0, import_jsx_runtime48.jsxs)("div", { className: "uix-scheduling-calendar__header", children: [
+      /* @__PURE__ */ (0, import_jsx_runtime48.jsxs)("div", { children: [
+        /* @__PURE__ */ (0, import_jsx_runtime48.jsx)("button", { type: "button", className: "uix-btn uix-btn--ghost uix-btn--sm", onClick: () => movePeriod(-1), disabled: !onAnchorDateChange, children: "Previous" }),
+        /* @__PURE__ */ (0, import_jsx_runtime48.jsx)("button", { type: "button", className: "uix-btn uix-btn--ghost uix-btn--sm", onClick: () => movePeriod(1), disabled: !onAnchorDateChange, children: "Next" })
+      ] }),
+      /* @__PURE__ */ (0, import_jsx_runtime48.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)}` }),
+      /* @__PURE__ */ (0, import_jsx_runtime48.jsx)("div", { className: "uix-segmented", role: "group", "aria-label": "Calendar view", children: ["month", "week", "agenda"].map((option) => /* @__PURE__ */ (0, import_jsx_runtime48.jsxs)("button", { type: "button", className: "uix-segmented__option", "aria-pressed": view === option, "data-selected": view === option || void 0, onClick: () => setView(option), children: [
+        option[0].toUpperCase(),
+        option.slice(1)
+      ] }, option)) })
+    ] }),
+    loading ? /* @__PURE__ */ (0, import_jsx_runtime48.jsx)("div", { className: "uix-scheduling-calendar__state", role: "status", children: "Loading schedule\u2026" }) : error ? /* @__PURE__ */ (0, import_jsx_runtime48.jsxs)("div", { className: "uix-scheduling-calendar__state", role: "alert", children: [
+      /* @__PURE__ */ (0, import_jsx_runtime48.jsx)("p", { children: error }),
+      onRetry && /* @__PURE__ */ (0, import_jsx_runtime48.jsx)("button", { type: "button", className: "uix-btn uix-btn--secondary", onClick: onRetry, children: "Try again" })
+    ] }) : view === "agenda" ? /* @__PURE__ */ (0, import_jsx_runtime48.jsx)("div", { className: "uix-scheduling-calendar__agenda", role: "region", "aria-label": "Schedule agenda", children: visibleEntries.length === 0 ? /* @__PURE__ */ (0, import_jsx_runtime48.jsx)("p", { children: "No scheduled entries match the current filters." }) : /* @__PURE__ */ (0, import_jsx_runtime48.jsx)("ol", { children: [...visibleEntries].sort((a, b) => a.start.localeCompare(b.start)).map((entry) => {
+      const state = entry.state ?? "scheduled";
+      return /* @__PURE__ */ (0, import_jsx_runtime48.jsx)("li", { children: /* @__PURE__ */ (0, import_jsx_runtime48.jsxs)("button", { type: "button", onClick: () => onSelectEntry?.(entry), children: [
+        /* @__PURE__ */ (0, import_jsx_runtime48.jsxs)("span", { children: [
+          /* @__PURE__ */ (0, import_jsx_runtime48.jsx)("strong", { children: renderEntry?.(entry) ?? entry.title }),
+          /* @__PURE__ */ (0, import_jsx_runtime48.jsxs)("span", { children: [
+            formatInstant(entry.start),
+            " \u2013 ",
+            formatInstant(entry.end)
+          ] }),
+          entry.meta && /* @__PURE__ */ (0, import_jsx_runtime48.jsx)("span", { children: entry.meta })
+        ] }),
+        /* @__PURE__ */ (0, import_jsx_runtime48.jsx)(StatusPill, { tone: stateTone(state), children: stateLabel[state] })
+      ] }) }, entry.id);
+    }) }) }) : /* @__PURE__ */ (0, import_jsx_runtime48.jsx)("div", { ref: gridRef, className: cx("uix-scheduling-calendar__grid", view === "week" && "uix-scheduling-calendar__grid--week"), role: "group", "aria-label": `${view} schedule`, children: days.map((date, index) => {
+      const dayEntries = entriesFor(date);
+      const dayOverlays = overlaysFor(date);
+      return /* @__PURE__ */ (0, import_jsx_runtime48.jsxs)("div", { className: "uix-scheduling-calendar__day", "data-outside": view === "month" && !monthDays[index].inMonth || void 0, children: [
+        /* @__PURE__ */ (0, import_jsx_runtime48.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)) }),
+        dayOverlays.map((overlay) => /* @__PURE__ */ (0, import_jsx_runtime48.jsx)("span", { className: "uix-scheduling-calendar__overlay", "data-kind": overlay.kind, children: overlay.label }, overlay.id)),
+        /* @__PURE__ */ (0, import_jsx_runtime48.jsx)("div", { className: "uix-scheduling-calendar__entries", children: dayEntries.map((entry) => {
+          const span = entrySpans.get(entry.id);
+          const state = entry.state ?? "scheduled";
+          return /* @__PURE__ */ (0, import_jsx_runtime48.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": `${entry.title}, ${stateLabel[state]}, ${formatInstant(entry.start)} to ${formatInstant(entry.end)}`, children: [
+            /* @__PURE__ */ (0, import_jsx_runtime48.jsx)("span", { children: renderEntry?.(entry) ?? entry.title }),
+            /* @__PURE__ */ (0, import_jsx_runtime48.jsx)("span", { className: "uix-visually-hidden", children: stateLabel[state] })
+          ] }, entry.id);
+        }) })
+      ] }, date);
+    }) }),
+    /* @__PURE__ */ (0, import_jsx_runtime48.jsx)("div", { className: "uix-scheduling-calendar__legend", "aria-label": "Schedule state legend", children: ["scheduled", "conflicted", "in-progress", "blackout-violation"].map((state) => /* @__PURE__ */ (0, import_jsx_runtime48.jsx)("span", { "data-state": state, children: stateLabel[state] }, state)) })
+  ] });
+}
+
+// src/components/DateRangePicker.tsx
+var import_react25 = require("react");
+var import_jsx_runtime49 = require("react/jsx-runtime");
+var monthLabel = (date, locale) => new Intl.DateTimeFormat(locale, { month: "long", year: "numeric", timeZone: "UTC" }).format(/* @__PURE__ */ new Date(`${date}T00:00:00Z`));
+var dateLabel2 = (date, locale) => new Intl.DateTimeFormat(locale, { dateStyle: "full", timeZone: "UTC" }).format(/* @__PURE__ */ new Date(`${date}T00:00:00Z`));
+function DateRangePicker({
+  value,
+  onChange,
+  visibleMonth: controlledMonth,
+  onVisibleMonthChange,
+  months = 2,
+  min,
+  max,
+  isDateDisabled,
+  locale,
+  label = "Choose date range",
+  invalid,
+  invalidMessage = "The selected date range is invalid.",
+  disabled,
+  className
+}) {
+  const id = (0, import_react25.useId)();
+  const [internalMonth, setInternalMonth] = (0, import_react25.useState)(() => startOfMonth(controlledMonth ?? value.start ?? (/* @__PURE__ */ new Date()).toISOString().slice(0, 10)));
+  const visibleMonth = startOfMonth(controlledMonth ?? internalMonth);
+  const [activeDate, setActiveDate] = (0, import_react25.useState)(value.end ?? value.start ?? visibleMonth);
+  const rootRef = (0, import_react25.useRef)(null);
+  const pendingFocus = (0, import_react25.useRef)(false);
+  const count = Math.max(1, Math.min(3, months));
+  const calendars = (0, import_react25.useMemo)(() => Array.from({ length: count }, (_, index) => {
+    const month = startOfMonth(addCalendarMonths(visibleMonth, index));
+    return { month, days: buildMonthGrid(month).filter((day) => day.inMonth) };
+  }), [visibleMonth, count]);
+  const rangeInvalid = invalid || !!value.start && !!value.end && value.start > value.end;
+  (0, import_react25.useEffect)(() => {
+    const first = calendars[0]?.days[0]?.date;
+    const finalDays = calendars[calendars.length - 1]?.days;
+    const last = finalDays?.[finalDays.length - 1]?.date;
+    if (first && last && (activeDate < first || activeDate > last)) setActiveDate(first);
+  }, [activeDate, calendars]);
+  (0, import_react25.useEffect)(() => {
+    if (!pendingFocus.current) return;
+    rootRef.current?.querySelector(`[data-date="${activeDate}"]`)?.focus();
+    pendingFocus.current = false;
+  }, [activeDate, visibleMonth]);
+  const setMonth = (month) => {
+    const next = startOfMonth(month);
+    if (controlledMonth === void 0) setInternalMonth(next);
+    onVisibleMonthChange?.(next);
+  };
+  const focusDate = (date) => {
+    setActiveDate(date);
+    if (date < calendars[0].month || date.slice(0, 7) > calendars[calendars.length - 1].month.slice(0, 7)) setMonth(startOfMonth(date));
+    pendingFocus.current = true;
+  };
+  const choose = (date) => {
+    if (disabled || isDateUnavailable(date, { min, max, isDisabled: isDateDisabled })) return;
+    onChange(selectRangeDate(value, date));
+    setActiveDate(date);
+  };
+  const onDateKeyDown = (event, date) => {
+    const offsets = { ArrowLeft: -1, ArrowRight: 1, ArrowUp: -7, ArrowDown: 7 };
+    if (event.key in offsets) {
+      event.preventDefault();
+      focusDate(addCalendarDays(date, offsets[event.key]));
+      return;
+    }
+    if (event.key === "Home" || event.key === "End") {
+      event.preventDefault();
+      const weekday = (/* @__PURE__ */ new Date(`${date}T00:00:00Z`)).getUTCDay();
+      const mondayIndex = (weekday + 6) % 7;
+      focusDate(addCalendarDays(date, event.key === "Home" ? -mondayIndex : 6 - mondayIndex));
+    } else if (event.key === "PageUp" || event.key === "PageDown") {
+      event.preventDefault();
+      focusDate(addCalendarMonths(date, event.key === "PageUp" ? -1 : 1));
+    }
+  };
+  const announcement = !value.start ? "No date range selected." : !value.end ? `Start date ${dateLabel2(value.start, locale)} selected. Choose an end date.` : `${dateLabel2(value.start, locale)} to ${dateLabel2(value.end, locale)} selected.`;
+  return /* @__PURE__ */ (0, import_jsx_runtime49.jsxs)("section", { className: cx("uix-date-range-picker", rangeInvalid && "uix-date-range-picker--invalid", className), "aria-labelledby": `${id}-label`, children: [
+    /* @__PURE__ */ (0, import_jsx_runtime49.jsxs)("div", { className: "uix-date-range-picker__header", children: [
+      /* @__PURE__ */ (0, import_jsx_runtime49.jsx)("h3", { id: `${id}-label`, children: label }),
+      /* @__PURE__ */ (0, import_jsx_runtime49.jsxs)("div", { children: [
+        /* @__PURE__ */ (0, import_jsx_runtime49.jsx)("button", { type: "button", className: "uix-btn uix-btn--ghost uix-btn--sm", onClick: () => setMonth(addCalendarMonths(visibleMonth, -1)), "aria-label": "Show previous month", children: "Previous" }),
+        /* @__PURE__ */ (0, import_jsx_runtime49.jsx)("button", { type: "button", className: "uix-btn uix-btn--ghost uix-btn--sm", onClick: () => setMonth(addCalendarMonths(visibleMonth, 1)), "aria-label": "Show next month", children: "Next" })
+      ] })
+    ] }),
+    /* @__PURE__ */ (0, import_jsx_runtime49.jsx)("div", { ref: rootRef, className: "uix-date-range-picker__months", children: calendars.map(({ month, days }) => /* @__PURE__ */ (0, import_jsx_runtime49.jsxs)("div", { className: "uix-date-range-picker__month", children: [
+      /* @__PURE__ */ (0, import_jsx_runtime49.jsx)("h4", { children: monthLabel(month, locale) }),
+      /* @__PURE__ */ (0, import_jsx_runtime49.jsx)("div", { className: "uix-date-range-picker__weekdays", "aria-hidden": "true", children: ["Mon", "Tue", "Wed", "Thu", "Fri", "Sat", "Sun"].map((day) => /* @__PURE__ */ (0, import_jsx_runtime49.jsx)("span", { children: day }, day)) }),
+      /* @__PURE__ */ (0, import_jsx_runtime49.jsxs)("div", { className: "uix-date-range-picker__grid", role: "group", "aria-label": monthLabel(month, locale), children: [
+        Array.from({ length: ((/* @__PURE__ */ new Date(`${month}T00:00:00Z`)).getUTCDay() + 6) % 7 }, (_, index) => /* @__PURE__ */ (0, import_jsx_runtime49.jsx)("span", { "aria-hidden": "true" }, `blank-${index}`)),
+        days.map((day) => {
+          const unavailable = disabled || isDateUnavailable(day.date, { min, max, isDisabled: isDateDisabled });
+          const edge = day.date === value.start ? "start" : day.date === value.end ? "end" : void 0;
+          return /* @__PURE__ */ (0, import_jsx_runtime49.jsx)(
+            "button",
+            {
+              type: "button",
+              "data-date": day.date,
+              "data-range-edge": edge,
+              "data-in-range": isDateInRange(day.date, value) || void 0,
+              "aria-pressed": edge != null || isDateInRange(day.date, value),
+              "aria-label": `${dateLabel2(day.date, locale)}${edge ? `, ${edge} of selected range` : isDateInRange(day.date, value) ? ", in selected range" : ""}`,
+              tabIndex: activeDate === day.date ? 0 : -1,
+              disabled: unavailable,
+              onFocus: () => setActiveDate(day.date),
+              onKeyDown: (event) => onDateKeyDown(event, day.date),
+              onClick: () => choose(day.date),
+              children: day.day
+            },
+            day.date
+          );
+        })
+      ] })
+    ] }, month)) }),
+    /* @__PURE__ */ (0, import_jsx_runtime49.jsx)("p", { className: "uix-date-range-picker__selection", "aria-live": "polite", children: announcement }),
+    rangeInvalid && /* @__PURE__ */ (0, import_jsx_runtime49.jsx)("p", { className: "uix-field__error", role: "alert", children: invalidMessage })
+  ] });
+}
+
+// src/components/RelationshipGraph.tsx
+var import_react26 = require("react");
+
+// src/relationship-graph-model.ts
+function boundRelationshipGraph(nodes, edges, maxNodes = 40) {
+  const boundedNodes = nodes.slice(0, Math.max(1, maxNodes));
+  const ids = new Set(boundedNodes.map((node) => node.id));
+  return {
+    nodes: boundedNodes,
+    edges: edges.filter((edge) => ids.has(edge.source) && ids.has(edge.target)),
+    omittedNodeCount: Math.max(0, nodes.length - boundedNodes.length)
+  };
+}
+function relationshipNeighbors(nodeId, edges) {
+  const result = [];
+  for (const edge of edges) {
+    if (edge.source === nodeId) result.push(edge.target);
+    else if (edge.target === nodeId) result.push(edge.source);
+  }
+  return [...new Set(result)];
+}
+function layoutRelationshipGraph(nodes, edges, rootId = nodes[0]?.id) {
+  if (nodes.length === 0) return [];
+  const root = nodes.some((node) => node.id === rootId) ? rootId : nodes[0].id;
+  const depth = /* @__PURE__ */ new Map([[root, 0]]);
+  const queue = [root];
+  while (queue.length) {
+    const current = queue.shift();
+    for (const neighbor of relationshipNeighbors(current, edges)) {
+      if (!depth.has(neighbor) && nodes.some((node) => node.id === neighbor)) {
+        depth.set(neighbor, (depth.get(current) ?? 0) + 1);
+        queue.push(neighbor);
+      }
+    }
+  }
+  let disconnectedDepth = Math.max(0, ...depth.values()) + 1;
+  nodes.forEach((node) => {
+    if (!depth.has(node.id)) depth.set(node.id, disconnectedDepth);
+  });
+  const groups = /* @__PURE__ */ new Map();
+  nodes.forEach((node) => {
+    const level = depth.get(node.id);
+    groups.set(level, [...groups.get(level) ?? [], node]);
+  });
+  const maxDepth = Math.max(1, ...groups.keys());
+  return nodes.map((node) => {
+    const level = depth.get(node.id);
+    if (node.x !== void 0 && node.y !== void 0) return { ...node, x: node.x, y: node.y, depth: level };
+    if (level === 0) return { ...node, x: 50, y: 50, depth: 0 };
+    const peers = groups.get(level);
+    const index = peers.findIndex((peer) => peer.id === node.id);
+    const angle = Math.PI * 2 * index / peers.length - Math.PI / 2;
+    const radius = 16 + level / maxDepth * 26;
+    return {
+      ...node,
+      x: Number((50 + Math.cos(angle) * radius).toFixed(3)),
+      y: Number((50 + Math.sin(angle) * radius).toFixed(3)),
+      depth: level
+    };
+  });
+}
+function traverseRelationshipNode(nodes, currentId, direction) {
+  if (nodes.length === 0) return void 0;
+  const current = Math.max(0, nodes.findIndex((node) => node.id === currentId));
+  return nodes[(current + direction + nodes.length) % nodes.length]?.id;
+}
+
+// src/components/RelationshipGraph.tsx
+var import_jsx_runtime50 = require("react/jsx-runtime");
+var EMPTY_IDS = /* @__PURE__ */ new Set();
+var EMPTY_LEGEND = [];
+function RelationshipGraph({
+  nodes,
+  edges,
+  selectedId,
+  onSelect,
+  onExpandNeighbors,
+  onOpenDetails,
+  maxNodes = 40,
+  density = "standard",
+  highlightedNodeIds = EMPTY_IDS,
+  conflictedNodeIds = EMPTY_IDS,
+  highlightedEdgeIds = EMPTY_IDS,
+  conflictedEdgeIds = EMPTY_IDS,
+  legend = EMPTY_LEGEND,
+  loading,
+  error,
+  onRetry,
+  className
+}) {
+  const bounded = (0, import_react26.useMemo)(() => boundRelationshipGraph(nodes, edges, maxNodes), [nodes, edges, maxNodes]);
+  const positioned = (0, import_react26.useMemo)(() => layoutRelationshipGraph(bounded.nodes, bounded.edges, selectedId), [bounded, selectedId]);
+  const positionedById = (0, import_react26.useMemo)(() => new Map(positioned.map((node) => [node.id, node])), [positioned]);
+  const [zoom, setZoom] = (0, import_react26.useState)(1);
+  const [pan, setPan] = (0, import_react26.useState)({ x: 0, y: 0 });
+  const [focusedId, setFocusedId] = (0, import_react26.useState)(selectedId ?? positioned[0]?.id);
+  const svgRef = (0, import_react26.useRef)(null);
+  const select = (id) => {
+    const node = bounded.nodes.find((item) => item.id === id);
+    if (node) onSelect?.(node);
+  };
+  const focusNode = (id) => {
+    if (!id) return;
+    setFocusedId(id);
+    requestAnimationFrame(() => svgRef.current?.querySelector(`[data-node-id="${id}"]`)?.focus());
+  };
+  const onNodeKeyDown = (event, id) => {
+    if (["ArrowRight", "ArrowDown", "ArrowLeft", "ArrowUp"].includes(event.key)) {
+      event.preventDefault();
+      focusNode(traverseRelationshipNode(positioned, id, event.key === "ArrowRight" || event.key === "ArrowDown" ? 1 : -1));
+    } else if (event.key === "Enter" || event.key === " ") {
+      event.preventDefault();
+      select(id);
+    }
+  };
+  const reset = () => {
+    setZoom(1);
+    setPan({ x: 0, y: 0 });
+  };
+  if (loading) return /* @__PURE__ */ (0, import_jsx_runtime50.jsx)("div", { className: cx("uix-relationship-graph uix-relationship-graph--state", className), role: "status", children: "Loading relationships\u2026" });
+  if (error) return /* @__PURE__ */ (0, import_jsx_runtime50.jsxs)("div", { className: cx("uix-relationship-graph uix-relationship-graph--state", className), role: "alert", children: [
+    /* @__PURE__ */ (0, import_jsx_runtime50.jsx)("p", { children: error }),
+    onRetry && /* @__PURE__ */ (0, import_jsx_runtime50.jsx)("button", { type: "button", className: "uix-btn uix-btn--secondary", onClick: onRetry, children: "Try again" })
+  ] });
+  if (bounded.nodes.length === 0) return /* @__PURE__ */ (0, import_jsx_runtime50.jsxs)("div", { className: cx("uix-relationship-graph uix-relationship-graph--state", className), children: [
+    /* @__PURE__ */ (0, import_jsx_runtime50.jsx)("p", { children: "No relationships to display." }),
+    /* @__PURE__ */ (0, import_jsx_runtime50.jsx)("p", { children: "Adjust the neighborhood or filters to include a node." })
+  ] });
+  return /* @__PURE__ */ (0, import_jsx_runtime50.jsxs)("section", { className: cx("uix-relationship-graph", `uix-relationship-graph--${density}`, className), "aria-label": "Relationship graph", children: [
+    /* @__PURE__ */ (0, import_jsx_runtime50.jsxs)("div", { className: "uix-relationship-graph__toolbar", "aria-label": "Graph view controls", children: [
+      /* @__PURE__ */ (0, import_jsx_runtime50.jsx)("button", { type: "button", onClick: () => setPan((value) => ({ ...value, x: value.x - 24 })), "aria-label": "Pan left", children: "Left" }),
+      /* @__PURE__ */ (0, import_jsx_runtime50.jsx)("button", { type: "button", onClick: () => setPan((value) => ({ ...value, y: value.y - 24 })), "aria-label": "Pan up", children: "Up" }),
+      /* @__PURE__ */ (0, import_jsx_runtime50.jsx)("button", { type: "button", onClick: () => setPan((value) => ({ ...value, y: value.y + 24 })), "aria-label": "Pan down", children: "Down" }),
+      /* @__PURE__ */ (0, import_jsx_runtime50.jsx)("button", { type: "button", onClick: () => setPan((value) => ({ ...value, x: value.x + 24 })), "aria-label": "Pan right", children: "Right" }),
+      /* @__PURE__ */ (0, import_jsx_runtime50.jsx)("button", { type: "button", onClick: () => setZoom((value) => Math.min(2, Number((value + 0.2).toFixed(1)))), "aria-label": "Zoom in", children: "Zoom in" }),
+      /* @__PURE__ */ (0, import_jsx_runtime50.jsx)("button", { type: "button", onClick: () => setZoom((value) => Math.max(0.5, Number((value - 0.2).toFixed(1)))), "aria-label": "Zoom out", children: "Zoom out" }),
+      /* @__PURE__ */ (0, import_jsx_runtime50.jsx)("button", { type: "button", onClick: reset, children: "Reset view" }),
+      /* @__PURE__ */ (0, import_jsx_runtime50.jsxs)("span", { "aria-live": "polite", children: [
+        "Zoom ",
+        Math.round(zoom * 100),
+        "%"
+      ] })
+    ] }),
+    bounded.omittedNodeCount > 0 && /* @__PURE__ */ (0, import_jsx_runtime50.jsxs)("p", { className: "uix-relationship-graph__bounded", role: "status", children: [
+      "Showing ",
+      bounded.nodes.length,
+      " nodes; ",
+      bounded.omittedNodeCount,
+      " outside this bounded neighborhood."
+    ] }),
+    /* @__PURE__ */ (0, import_jsx_runtime50.jsx)("div", { className: "uix-relationship-graph__visual", children: /* @__PURE__ */ (0, import_jsx_runtime50.jsx)("svg", { ref: svgRef, viewBox: "0 0 600 400", role: "group", "aria-label": `Graph with ${bounded.nodes.length} nodes and ${bounded.edges.length} relationships`, children: /* @__PURE__ */ (0, import_jsx_runtime50.jsxs)("g", { transform: `translate(${pan.x} ${pan.y}) scale(${zoom})`, children: [
+      bounded.edges.map((edge) => {
+        const source = positionedById.get(edge.source);
+        const target = positionedById.get(edge.target);
+        return /* @__PURE__ */ (0, import_jsx_runtime50.jsx)("line", { x1: source.x * 6, y1: source.y * 4, x2: target.x * 6, y2: target.y * 4, className: "uix-relationship-graph__edge", "data-highlighted": highlightedEdgeIds.has(edge.id) || void 0, "data-conflicted": conflictedEdgeIds.has(edge.id) || void 0, children: /* @__PURE__ */ (0, import_jsx_runtime50.jsx)("title", { children: edge.label ?? edge.type ?? "Relationship" }) }, edge.id);
+      }),
+      positioned.map((node) => /* @__PURE__ */ (0, import_jsx_runtime50.jsxs)(
+        "g",
+        {
+          transform: `translate(${node.x * 6} ${node.y * 4})`,
+          role: "button",
+          "aria-label": `${node.label}${node.type ? `, ${node.type}` : ""}${conflictedNodeIds.has(node.id) ? ", conflict" : ""}`,
+          tabIndex: focusedId === node.id ? 0 : -1,
+          "data-node-id": node.id,
+          className: "uix-relationship-graph__node",
+          "data-selected": selectedId === node.id || void 0,
+          "data-highlighted": highlightedNodeIds.has(node.id) || void 0,
+          "data-conflicted": conflictedNodeIds.has(node.id) || void 0,
+          onFocus: () => setFocusedId(node.id),
+          onKeyDown: (event) => onNodeKeyDown(event, node.id),
+          onClick: () => select(node.id),
+          children: [
+            /* @__PURE__ */ (0, import_jsx_runtime50.jsx)("rect", { x: "-55", y: "-18", width: "110", height: "36", rx: "8" }),
+            /* @__PURE__ */ (0, import_jsx_runtime50.jsx)("text", { textAnchor: "middle", dominantBaseline: "middle", children: node.label.length > 16 ? `${node.label.slice(0, 15)}\u2026` : node.label })
+          ]
+        },
+        node.id
+      ))
+    ] }) }) }),
+    legend.length > 0 && /* @__PURE__ */ (0, import_jsx_runtime50.jsx)("ul", { className: "uix-relationship-graph__legend", "aria-label": "Relationship types", children: legend.map((item) => /* @__PURE__ */ (0, import_jsx_runtime50.jsx)("li", { "data-type": item.id, children: item.label }, item.id)) }),
+    /* @__PURE__ */ (0, import_jsx_runtime50.jsxs)("div", { className: "uix-relationship-graph__list", role: "region", "aria-label": "Accessible relationship list", children: [
+      /* @__PURE__ */ (0, import_jsx_runtime50.jsx)("h3", { children: "Relationship list" }),
+      /* @__PURE__ */ (0, import_jsx_runtime50.jsx)("ul", { children: bounded.nodes.map((node) => {
+        const neighbors = relationshipNeighbors(node.id, bounded.edges).map((id) => bounded.nodes.find((item) => item.id === id)?.label ?? id);
+        return /* @__PURE__ */ (0, import_jsx_runtime50.jsxs)("li", { "data-selected": selectedId === node.id || void 0, children: [
+          /* @__PURE__ */ (0, import_jsx_runtime50.jsxs)("button", { type: "button", onClick: () => select(node.id), "aria-pressed": selectedId === node.id, children: [
+            /* @__PURE__ */ (0, import_jsx_runtime50.jsx)("strong", { children: node.label }),
+            node.type && /* @__PURE__ */ (0, import_jsx_runtime50.jsx)("span", { children: node.type }),
+            /* @__PURE__ */ (0, import_jsx_runtime50.jsx)("span", { children: neighbors.length ? `Connected to ${neighbors.join(", ")}` : "No visible connections" })
+          ] }),
+          /* @__PURE__ */ (0, import_jsx_runtime50.jsxs)("span", { className: "uix-relationship-graph__list-actions", children: [
+            onExpandNeighbors && /* @__PURE__ */ (0, import_jsx_runtime50.jsx)("button", { type: "button", onClick: () => onExpandNeighbors(node), children: "Expand neighbors" }),
+            onOpenDetails && /* @__PURE__ */ (0, import_jsx_runtime50.jsx)("button", { type: "button", onClick: () => onOpenDetails(node), children: "Open details" })
+          ] })
+        ] }, node.id);
+      }) })
+    ] })
+  ] });
+}
+
+// src/components/MatchReview.tsx
+var import_react27 = require("react");
+var import_jsx_runtime51 = require("react/jsx-runtime");
+var valueText = (value) => value == null ? "\u2014" : typeof value === "string" ? value : JSON.stringify(value);
+function MatchReview({
+  incoming,
+  incomingLabel = "Incoming record",
+  fields,
+  candidates,
+  selectedIds,
+  onSelectionChange,
+  onDecision,
+  onBulkDecision,
+  loading,
+  error,
+  onRetry,
+  className
+}) {
+  const [internalSelection, setInternalSelection] = (0, import_react27.useState)(/* @__PURE__ */ new Set());
+  const [announcement, setAnnouncement] = (0, import_react27.useState)("");
+  const [bulkPending, setBulkPending] = (0, import_react27.useState)(false);
+  const selection = selectedIds ?? internalSelection;
+  const pending = (0, import_react27.useMemo)(() => candidates.filter((candidate) => candidate.status !== "resolved"), [candidates]);
+  const setSelection = (next) => {
+    if (selectedIds === void 0) setInternalSelection(next);
+    onSelectionChange?.(next);
+  };
+  const toggle = (id) => {
+    const next = new Set(selection);
+    if (next.has(id)) next.delete(id);
+    else next.add(id);
+    setSelection(next);
+  };
+  const runBulk = async (action) => {
+    if (!onBulkDecision || selection.size === 0 || bulkPending) return;
+    const ids = [...selection];
+    setBulkPending(true);
+    setAnnouncement(`${action === "accept" ? "Accepting" : "Dismissing"} ${ids.length} candidate${ids.length === 1 ? "" : "s"}\u2026`);
+    try {
+      const result = await onBulkDecision(ids, action);
+      const succeeded = result?.succeeded ?? ids.length;
+      const failed = result?.failed ?? 0;
+      setAnnouncement(`${succeeded} candidate${succeeded === 1 ? "" : "s"} ${action === "accept" ? "accepted" : "dismissed"}${failed ? `; ${failed} failed` : ""}.`);
+      if (!failed) setSelection(/* @__PURE__ */ new Set());
+    } catch {
+      setAnnouncement(`Bulk ${action} failed. Try again.`);
+    } finally {
+      setBulkPending(false);
+    }
+  };
+  if (loading) return /* @__PURE__ */ (0, import_jsx_runtime51.jsx)("div", { className: cx("uix-match-review uix-match-review--state", className), role: "status", children: "Loading match candidates\u2026" });
+  if (error) return /* @__PURE__ */ (0, import_jsx_runtime51.jsxs)("div", { className: cx("uix-match-review uix-match-review--state", className), role: "alert", children: [
+    /* @__PURE__ */ (0, import_jsx_runtime51.jsx)("p", { children: error }),
+    onRetry && /* @__PURE__ */ (0, import_jsx_runtime51.jsx)("button", { type: "button", className: "uix-btn uix-btn--secondary", onClick: onRetry, children: "Try again" })
+  ] });
+  if (candidates.length === 0) return /* @__PURE__ */ (0, import_jsx_runtime51.jsxs)("div", { className: cx("uix-match-review uix-match-review--state", className), children: [
+    /* @__PURE__ */ (0, import_jsx_runtime51.jsx)("p", { children: "No candidate matches found." }),
+    /* @__PURE__ */ (0, import_jsx_runtime51.jsx)("p", { children: "Choose another record source or continue without a match." })
+  ] });
+  return /* @__PURE__ */ (0, import_jsx_runtime51.jsxs)("section", { className: cx("uix-match-review", className), "aria-label": "Match review", children: [
+    /* @__PURE__ */ (0, import_jsx_runtime51.jsxs)("div", { className: "uix-match-review__summary", children: [
+      /* @__PURE__ */ (0, import_jsx_runtime51.jsxs)("div", { children: [
+        /* @__PURE__ */ (0, import_jsx_runtime51.jsx)("strong", { children: incomingLabel }),
+        /* @__PURE__ */ (0, import_jsx_runtime51.jsxs)("span", { children: [
+          pending.length,
+          " pending of ",
+          candidates.length
+        ] })
+      ] }),
+      /* @__PURE__ */ (0, import_jsx_runtime51.jsx)("div", { className: "uix-match-review__incoming", children: fields.map((field) => /* @__PURE__ */ (0, import_jsx_runtime51.jsxs)("span", { children: [
+        /* @__PURE__ */ (0, import_jsx_runtime51.jsx)("b", { children: field.label }),
+        field.render?.(incoming[field.id], incoming) ?? valueText(incoming[field.id])
+      ] }, field.id)) })
+    ] }),
+    onBulkDecision && /* @__PURE__ */ (0, import_jsx_runtime51.jsxs)("div", { className: "uix-match-review__bulk", "aria-label": "Bulk candidate actions", children: [
+      /* @__PURE__ */ (0, import_jsx_runtime51.jsxs)("span", { children: [
+        selection.size,
+        " selected"
+      ] }),
+      /* @__PURE__ */ (0, import_jsx_runtime51.jsx)("button", { type: "button", className: "uix-btn uix-btn--secondary uix-btn--sm", disabled: selection.size === 0 || bulkPending, onClick: () => void runBulk("accept"), children: bulkPending ? "Applying\u2026" : "Accept selected" }),
+      /* @__PURE__ */ (0, import_jsx_runtime51.jsx)("button", { type: "button", className: "uix-btn uix-btn--ghost uix-btn--sm", disabled: selection.size === 0 || bulkPending, onClick: () => void runBulk("dismiss"), children: bulkPending ? "Applying\u2026" : "Dismiss selected" })
+    ] }),
+    /* @__PURE__ */ (0, import_jsx_runtime51.jsx)("div", { className: "uix-match-review__table-wrap", children: /* @__PURE__ */ (0, import_jsx_runtime51.jsxs)("table", { className: "uix-table uix-match-review__table", children: [
+      /* @__PURE__ */ (0, import_jsx_runtime51.jsx)("caption", { className: "uix-visually-hidden", children: "Candidate matches and available decisions" }),
+      /* @__PURE__ */ (0, import_jsx_runtime51.jsx)("thead", { children: /* @__PURE__ */ (0, import_jsx_runtime51.jsxs)("tr", { children: [
+        /* @__PURE__ */ (0, import_jsx_runtime51.jsx)("th", { scope: "col", children: /* @__PURE__ */ (0, import_jsx_runtime51.jsx)("span", { className: "uix-visually-hidden", children: "Select" }) }),
+        /* @__PURE__ */ (0, import_jsx_runtime51.jsx)("th", { scope: "col", children: "Confidence" }),
+        fields.map((field) => /* @__PURE__ */ (0, import_jsx_runtime51.jsx)("th", { scope: "col", children: field.label }, field.id)),
+        /* @__PURE__ */ (0, import_jsx_runtime51.jsx)("th", { scope: "col", children: "Status" }),
+        /* @__PURE__ */ (0, import_jsx_runtime51.jsx)("th", { scope: "col", children: "Actions" })
+      ] }) }),
+      /* @__PURE__ */ (0, import_jsx_runtime51.jsx)("tbody", { children: candidates.map((candidate) => {
+        const resolved = candidate.status === "resolved";
+        return /* @__PURE__ */ (0, import_jsx_runtime51.jsxs)("tr", { "data-status": candidate.status ?? "pending", children: [
+          /* @__PURE__ */ (0, import_jsx_runtime51.jsx)("td", { children: /* @__PURE__ */ (0, import_jsx_runtime51.jsx)("input", { type: "checkbox", checked: selection.has(candidate.id), onChange: () => toggle(candidate.id), "aria-label": `Select candidate ${candidate.id}` }) }),
+          /* @__PURE__ */ (0, import_jsx_runtime51.jsx)("td", { children: /* @__PURE__ */ (0, import_jsx_runtime51.jsx)("span", { className: "uix-match-review__confidence", children: candidate.confidence == null ? "Not scored" : `${Math.round(candidate.confidence * 100)}%` }) }),
+          fields.map((field) => /* @__PURE__ */ (0, import_jsx_runtime51.jsx)("td", { children: field.render?.(candidate.record[field.id], candidate.record) ?? valueText(candidate.record[field.id]) }, field.id)),
+          /* @__PURE__ */ (0, import_jsx_runtime51.jsx)("td", { children: /* @__PURE__ */ (0, import_jsx_runtime51.jsx)(StatusPill, { tone: resolved ? "success" : "warning", children: resolved ? candidate.decision ?? "Resolved" : "Pending" }) }),
+          /* @__PURE__ */ (0, import_jsx_runtime51.jsx)("td", { children: /* @__PURE__ */ (0, import_jsx_runtime51.jsx)("div", { className: "uix-match-review__actions", children: ["accept", "dismiss", "split", "pick-other"].map((action) => /* @__PURE__ */ (0, import_jsx_runtime51.jsx)(
+            "button",
+            {
+              type: "button",
+              className: "uix-btn uix-btn--ghost uix-btn--sm",
+              disabled: resolved,
+              onClick: () => onDecision(candidate.id, action),
+              children: action === "pick-other" ? "Pick other" : `${action[0].toUpperCase()}${action.slice(1)}`
+            },
+            action
+          )) }) })
+        ] }, candidate.id);
+      }) })
+    ] }) }),
+    /* @__PURE__ */ (0, import_jsx_runtime51.jsx)("p", { className: "uix-visually-hidden", "aria-live": "polite", children: announcement })
+  ] });
+}
+
+// src/components/MetricInput.tsx
+var import_react28 = require("react");
+
+// src/metric-model.ts
+function decimals(value) {
+  const text = String(value).toLowerCase();
+  if (text.includes("e-")) return Number(text.split("e-")[1]);
+  return text.includes(".") ? text.split(".")[1].length : 0;
+}
+function clampMetricValue(value, min, max) {
+  return Math.min(max ?? Number.POSITIVE_INFINITY, Math.max(min ?? Number.NEGATIVE_INFINITY, value));
+}
+function stepMetricValue(value, direction, options = {}) {
+  const step = options.step && options.step > 0 ? options.step : 1;
+  const base = value ?? options.min ?? 0;
+  const precision = Math.max(decimals(base), decimals(step), decimals(options.min ?? 0), decimals(options.max ?? 0));
+  const next = Number((base + direction * step).toFixed(precision));
+  return clampMetricValue(next, options.min, options.max);
+}
+function parseMetricValue(value) {
+  if (value.trim() === "") return null;
+  const parsed = Number(value);
+  return Number.isFinite(parsed) ? parsed : null;
+}
+
+// src/components/MetricInput.tsx
+var import_jsx_runtime52 = require("react/jsx-runtime");
+var defaultMetricFormat = (input) => input == null ? "" : String(input);
+function MetricInput({
+  value,
+  onValueChange,
+  min,
+  max,
+  step = 1,
+  unit,
+  label,
+  invalid,
+  errorMessage,
+  disabled,
+  readOnly,
+  parse = parseMetricValue,
+  format = defaultMetricFormat,
+  className,
+  id: providedId
+}) {
+  const generatedId = (0, import_react28.useId)();
+  const id = providedId ?? generatedId;
+  const errorId = `${id}-error`;
+  const [text, setText] = (0, import_react28.useState)(() => format(value));
+  (0, import_react28.useEffect)(() => setText(format(value)), [value, format]);
+  const commit = (input) => {
+    const parsed = parse(input);
+    if (input.trim() === "" || parsed !== null) {
+      onValueChange(parsed === null ? null : clampMetricValue(parsed, min, max));
+    }
+  };
+  const stepBy = (direction) => {
+    const next = stepMetricValue(value, direction, { min, max, step });
+    onValueChange(next);
+    setText(format(next));
+  };
+  const onKeyDown = (event) => {
+    if (event.key === "ArrowUp" || event.key === "ArrowDown") {
+      event.preventDefault();
+      stepBy(event.key === "ArrowUp" ? 1 : -1);
+    }
+  };
+  const onChange = (event) => {
+    setText(event.currentTarget.value);
+    commit(event.currentTarget.value);
+  };
+  const onBlur = (event) => {
+    const parsed = parse(event.currentTarget.value);
+    setText(parsed === null && event.currentTarget.value.trim() !== "" ? format(value) : format(parsed));
+  };
+  return /* @__PURE__ */ (0, import_jsx_runtime52.jsxs)("div", { className: cx("uix-metric-input", invalid && "uix-metric-input--invalid", className), children: [
+    /* @__PURE__ */ (0, import_jsx_runtime52.jsx)("label", { className: "uix-field__label", htmlFor: id, children: label }),
+    /* @__PURE__ */ (0, import_jsx_runtime52.jsxs)("div", { className: "uix-metric-input__control", children: [
+      /* @__PURE__ */ (0, import_jsx_runtime52.jsx)(
+        Input,
+        {
+          id,
+          value: text,
+          onChange,
+          onBlur,
+          onKeyDown,
+          inputMode: "decimal",
+          role: "spinbutton",
+          "aria-valuenow": value ?? void 0,
+          "aria-valuemin": min,
+          "aria-valuemax": max,
+          "aria-describedby": invalid && errorMessage ? errorId : void 0,
+          invalid,
+          disabled,
+          readOnly
+        }
+      ),
+      unit && /* @__PURE__ */ (0, import_jsx_runtime52.jsx)("span", { className: "uix-metric-input__unit", "aria-hidden": "true", children: unit }),
+      /* @__PURE__ */ (0, import_jsx_runtime52.jsxs)("span", { className: "uix-metric-input__steps", children: [
+        /* @__PURE__ */ (0, import_jsx_runtime52.jsx)("button", { type: "button", className: "uix-metric-input__step", onClick: () => stepBy(1), disabled: disabled || readOnly, "aria-label": `Increase ${label}`, children: "+" }),
+        /* @__PURE__ */ (0, import_jsx_runtime52.jsx)("button", { type: "button", className: "uix-metric-input__step", onClick: () => stepBy(-1), disabled: disabled || readOnly, "aria-label": `Decrease ${label}`, children: "\u2212" })
+      ] })
+    ] }),
+    unit && /* @__PURE__ */ (0, import_jsx_runtime52.jsxs)("span", { className: "uix-visually-hidden", children: [
+      "Unit: ",
+      unit
+    ] }),
+    invalid && errorMessage && /* @__PURE__ */ (0, import_jsx_runtime52.jsx)("span", { id: errorId, className: "uix-field__error", children: errorMessage })
+  ] });
+}
+
+// src/components/LicensePositionBar.tsx
+var import_jsx_runtime53 = require("react/jsx-runtime");
+var defaultCapacityFormat = (value) => new Intl.NumberFormat().format(value);
+function LicensePositionBar({
+  consumed,
+  entitled,
+  consumedLabel = "Consumed",
+  entitledLabel = "Entitled",
+  availableLabel = "available",
+  overLabel = "over limit",
+  unit = "",
+  formatValue = defaultCapacityFormat,
+  className,
+  ...props
+}) {
+  const safeConsumed = Math.max(0, consumed);
+  const safeEntitled = Math.max(0, entitled);
+  const over = Math.max(0, safeConsumed - safeEntitled);
+  const available = Math.max(0, safeEntitled - safeConsumed);
+  const percent = safeEntitled === 0 ? safeConsumed > 0 ? 100 : 0 : safeConsumed / safeEntitled * 100;
+  const format = (value) => `${formatValue(value)}${unit ? ` ${unit}` : ""}`;
+  const summary = `${consumedLabel}: ${format(safeConsumed)}. ${entitledLabel}: ${format(safeEntitled)}. ${over > 0 ? `${format(over)} ${overLabel}` : `${format(available)} ${availableLabel}`}.`;
+  return /* @__PURE__ */ (0, import_jsx_runtime53.jsxs)("div", { className: cx("uix-license-position", over > 0 && "uix-license-position--over", className), ...props, children: [
+    /* @__PURE__ */ (0, import_jsx_runtime53.jsxs)("div", { className: "uix-license-position__header", children: [
+      /* @__PURE__ */ (0, import_jsx_runtime53.jsxs)("span", { className: "uix-license-position__value", children: [
+        format(safeConsumed),
+        " / ",
+        format(safeEntitled)
+      ] }),
+      /* @__PURE__ */ (0, import_jsx_runtime53.jsx)(StatusPill, { tone: over > 0 ? "danger" : percent >= 80 ? "warning" : "success", children: over > 0 ? `${format(over)} ${overLabel}` : `${format(available)} ${availableLabel}` })
+    ] }),
+    /* @__PURE__ */ (0, import_jsx_runtime53.jsxs)("div", { className: "uix-license-position__track", children: [
+      /* @__PURE__ */ (0, import_jsx_runtime53.jsx)(Meter, { value: Math.min(100, percent), tone: over > 0 ? "danger" : percent >= 80 ? "warning" : "success", "aria-label": summary, "aria-valuetext": summary }),
+      over > 0 && /* @__PURE__ */ (0, import_jsx_runtime53.jsx)(
+        "span",
+        {
+          className: "uix-license-position__overflow",
+          style: { width: `${Math.min(100, safeEntitled === 0 ? 100 : over / safeEntitled * 100)}%` },
+          "aria-hidden": "true"
+        }
+      )
+    ] }),
+    /* @__PURE__ */ (0, import_jsx_runtime53.jsx)("span", { className: "uix-visually-hidden", children: summary })
+  ] });
+}
+
+// src/components/BrandProfiles.tsx
+var import_react30 = require("react");
+
+// src/color-model.ts
+var clamp2 = (value, min, max) => Math.min(max, Math.max(min, value));
+function normalizeHex(value) {
+  const raw = value.trim().replace(/^#/, "");
+  if (/^[\da-f]{3}$/i.test(raw)) return `#${raw.split("").map((char) => char + char).join("").toUpperCase()}`;
+  if (/^[\da-f]{6}$/i.test(raw)) return `#${raw.toUpperCase()}`;
+  return void 0;
+}
+function hexToRgb(value) {
+  const hex = normalizeHex(value);
+  if (!hex) return void 0;
+  return {
+    r: Number.parseInt(hex.slice(1, 3), 16),
+    g: Number.parseInt(hex.slice(3, 5), 16),
+    b: Number.parseInt(hex.slice(5, 7), 16)
+  };
+}
+function rgbToHex({ r, g, b }) {
+  return `#${[r, g, b].map((value) => Math.round(clamp2(value, 0, 255)).toString(16).padStart(2, "0")).join("").toUpperCase()}`;
+}
+function rgbToHsv({ r, g, b }) {
+  const values = [r, g, b].map((value) => clamp2(value, 0, 255) / 255);
+  const max = Math.max(...values);
+  const min = Math.min(...values);
+  const delta = max - min;
+  let h = 0;
+  if (delta !== 0) {
+    if (max === values[0]) h = 60 * ((values[1] - values[2]) / delta % 6);
+    else if (max === values[1]) h = 60 * ((values[2] - values[0]) / delta + 2);
+    else h = 60 * ((values[0] - values[1]) / delta + 4);
+  }
+  if (h < 0) h += 360;
+  return { h, s: max === 0 ? 0 : delta / max, v: max };
+}
+function hsvToRgb({ h, s, v }) {
+  const hue = (h % 360 + 360) % 360;
+  const sat = clamp2(s, 0, 1);
+  const value = clamp2(v, 0, 1);
+  const chroma = value * sat;
+  const x = chroma * (1 - Math.abs(hue / 60 % 2 - 1));
+  const m = value - chroma;
+  const sector = Math.floor(hue / 60);
+  const rgb = sector === 0 ? [chroma, x, 0] : sector === 1 ? [x, chroma, 0] : sector === 2 ? [0, chroma, x] : sector === 3 ? [0, x, chroma] : sector === 4 ? [x, 0, chroma] : [chroma, 0, x];
+  return { r: (rgb[0] + m) * 255, g: (rgb[1] + m) * 255, b: (rgb[2] + m) * 255 };
+}
+function hsvToHex(value) {
+  return rgbToHex(hsvToRgb(value));
+}
+function relativeLuminance({ r, g, b }) {
+  const linear = [r, g, b].map((channel) => {
+    const value = channel / 255;
+    return value <= 0.04045 ? value / 12.92 : ((value + 0.055) / 1.055) ** 2.4;
+  });
+  return 0.2126 * linear[0] + 0.7152 * linear[1] + 0.0722 * linear[2];
+}
+function contrastRatio(background, foreground) {
+  const bg = hexToRgb(background);
+  const fg = hexToRgb(foreground);
+  if (!bg || !fg) return void 0;
+  const [light, dark] = [relativeLuminance(bg), relativeLuminance(fg)].sort((a, b) => b - a);
+  return (light + 0.05) / (dark + 0.05);
+}
+function meetsContrast(background, foreground, minimum = 4.5) {
+  return (contrastRatio(background, foreground) ?? 0) >= minimum;
+}
+
+// src/components/ColorPicker.tsx
+var import_react29 = require("react");
+var import_jsx_runtime54 = require("react/jsx-runtime");
+var EMPTY_COLORS = [];
+function ColorPicker({
+  value,
+  onChange,
+  foreground,
+  presets = EMPTY_COLORS,
+  recent = EMPTY_COLORS,
+  minimumContrast = 4.5,
+  label = "Choose color",
+  disabled,
+  className
+}) {
+  const id = (0, import_react29.useId)();
+  const triggerRef = (0, import_react29.useRef)(null);
+  const dialogRef = (0, import_react29.useRef)(null);
+  const [open, setOpen] = (0, import_react29.useState)(false);
+  const normalized = normalizeHex(value) ?? "#000000";
+  const [hexText, setHexText] = (0, import_react29.useState)(normalized);
+  const hsv = (0, import_react29.useMemo)(() => rgbToHsv(hexToRgb(normalized)), [normalized]);
+  const ratio = contrastRatio(normalized, foreground) ?? 0;
+  const passes = ratio >= minimumContrast;
+  (0, import_react29.useEffect)(() => setHexText(normalized), [normalized]);
+  (0, import_react29.useEffect)(() => {
+    if (!open) return;
+    const dialog = dialogRef.current;
+    dialog?.querySelector("input,button")?.focus();
+    const onPointer = (event) => {
+      if (!dialog?.contains(event.target) && !triggerRef.current?.contains(event.target)) setOpen(false);
+    };
+    document.addEventListener("mousedown", onPointer);
+    return () => document.removeEventListener("mousedown", onPointer);
+  }, [open]);
+  const close = () => {
+    setOpen(false);
+    requestAnimationFrame(() => triggerRef.current?.focus());
+  };
+  const onDialogKeyDown = (event) => {
+    if (event.key === "Escape") {
+      event.preventDefault();
+      close();
+      return;
+    }
+    if (event.key !== "Tab") return;
+    const focusable = Array.from(dialogRef.current?.querySelectorAll('button:not([disabled]),input:not([disabled]),[tabindex="0"]') ?? []);
+    if (!focusable.length) return;
+    const first = focusable[0];
+    const last = focusable[focusable.length - 1];
+    if (event.shiftKey && document.activeElement === first) {
+      event.preventDefault();
+      last.focus();
+    } else if (!event.shiftKey && document.activeElement === last) {
+      event.preventDefault();
+      first.focus();
+    }
+  };
+  const updateHsv = (part) => onChange(hsvToHex({ ...hsv, ...part }));
+  const commitHex = () => {
+    const next = normalizeHex(hexText);
+    if (next) onChange(next);
+  };
+  const choose = (candidate) => {
+    const next = normalizeHex(candidate);
+    if (next) onChange(next);
+  };
+  const sampleStyle = { backgroundColor: normalized };
+  return /* @__PURE__ */ (0, import_jsx_runtime54.jsxs)("div", { className: cx("uix-color-picker", className), children: [
+    /* @__PURE__ */ (0, import_jsx_runtime54.jsxs)(
+      "button",
+      {
+        ref: triggerRef,
+        type: "button",
+        className: "uix-color-picker__trigger",
+        "aria-label": `${label}: ${normalized}`,
+        "aria-expanded": open,
+        "aria-controls": `${id}-dialog`,
+        onClick: () => setOpen((current) => !current),
+        disabled,
+        children: [
+          /* @__PURE__ */ (0, import_jsx_runtime54.jsx)("span", { className: "uix-color-picker__swatch", style: sampleStyle, "aria-hidden": "true" }),
+          /* @__PURE__ */ (0, import_jsx_runtime54.jsx)("span", { children: normalized })
+        ]
+      }
+    ),
+    open && /* @__PURE__ */ (0, import_jsx_runtime54.jsxs)(
+      "div",
+      {
+        ref: dialogRef,
+        id: `${id}-dialog`,
+        role: "dialog",
+        "aria-modal": "true",
+        "aria-label": label,
+        className: "uix-color-picker__popover",
+        onKeyDown: onDialogKeyDown,
+        children: [
+          /* @__PURE__ */ (0, import_jsx_runtime54.jsx)("div", { className: "uix-color-picker__preview", style: sampleStyle, children: /* @__PURE__ */ (0, import_jsx_runtime54.jsx)("span", { style: { color: foreground }, children: "Aa" }) }),
+          /* @__PURE__ */ (0, import_jsx_runtime54.jsxs)("label", { className: "uix-color-picker__range", children: [
+            "Hue ",
+            /* @__PURE__ */ (0, import_jsx_runtime54.jsxs)("span", { children: [
+              Math.round(hsv.h),
+              "\xB0"
+            ] }),
+            /* @__PURE__ */ (0, import_jsx_runtime54.jsx)("input", { type: "range", min: "0", max: "359", value: Math.round(hsv.h), onChange: (event) => updateHsv({ h: Number(event.currentTarget.value) }) })
+          ] }),
+          /* @__PURE__ */ (0, import_jsx_runtime54.jsxs)("label", { className: "uix-color-picker__range", children: [
+            "Saturation ",
+            /* @__PURE__ */ (0, import_jsx_runtime54.jsxs)("span", { children: [
+              Math.round(hsv.s * 100),
+              "%"
+            ] }),
+            /* @__PURE__ */ (0, import_jsx_runtime54.jsx)("input", { type: "range", min: "0", max: "100", value: Math.round(hsv.s * 100), onChange: (event) => updateHsv({ s: Number(event.currentTarget.value) / 100 }) })
+          ] }),
+          /* @__PURE__ */ (0, import_jsx_runtime54.jsxs)("label", { className: "uix-color-picker__range", children: [
+            "Brightness ",
+            /* @__PURE__ */ (0, import_jsx_runtime54.jsxs)("span", { children: [
+              Math.round(hsv.v * 100),
+              "%"
+            ] }),
+            /* @__PURE__ */ (0, import_jsx_runtime54.jsx)("input", { type: "range", min: "0", max: "100", value: Math.round(hsv.v * 100), onChange: (event) => updateHsv({ v: Number(event.currentTarget.value) / 100 }) })
+          ] }),
+          /* @__PURE__ */ (0, import_jsx_runtime54.jsxs)("label", { className: "uix-color-picker__hex", children: [
+            "Hex",
+            /* @__PURE__ */ (0, import_jsx_runtime54.jsxs)("span", { className: "uix-color-picker__hex-row", children: [
+              /* @__PURE__ */ (0, import_jsx_runtime54.jsx)("input", { className: "uix-input", value: hexText, onChange: (event) => setHexText(event.currentTarget.value), onBlur: commitHex, onKeyDown: (event) => {
+                if (event.key === "Enter") commitHex();
+              }, "aria-invalid": !normalizeHex(hexText) }),
+              /* @__PURE__ */ (0, import_jsx_runtime54.jsx)("button", { type: "button", className: "uix-btn uix-btn--secondary uix-btn--sm", onClick: commitHex, disabled: !normalizeHex(hexText), children: "Set" })
+            ] })
+          ] }),
+          (presets.length > 0 || recent.length > 0) && /* @__PURE__ */ (0, import_jsx_runtime54.jsxs)("div", { className: "uix-color-picker__palettes", children: [
+            presets.length > 0 && /* @__PURE__ */ (0, import_jsx_runtime54.jsxs)("fieldset", { children: [
+              /* @__PURE__ */ (0, import_jsx_runtime54.jsx)("legend", { children: "Presets" }),
+              /* @__PURE__ */ (0, import_jsx_runtime54.jsx)("div", { children: presets.map((color) => /* @__PURE__ */ (0, import_jsx_runtime54.jsx)("button", { type: "button", className: "uix-color-picker__preset", style: { backgroundColor: normalizeHex(color) ?? color }, onClick: () => choose(color), "aria-label": `Use preset ${color}` }, color)) })
+            ] }),
+            recent.length > 0 && /* @__PURE__ */ (0, import_jsx_runtime54.jsxs)("fieldset", { children: [
+              /* @__PURE__ */ (0, import_jsx_runtime54.jsx)("legend", { children: "Recent" }),
+              /* @__PURE__ */ (0, import_jsx_runtime54.jsx)("div", { children: recent.map((color) => /* @__PURE__ */ (0, import_jsx_runtime54.jsx)("button", { type: "button", className: "uix-color-picker__preset", style: { backgroundColor: normalizeHex(color) ?? color }, onClick: () => choose(color), "aria-label": `Use recent color ${color}` }, color)) })
+            ] })
+          ] }),
+          /* @__PURE__ */ (0, import_jsx_runtime54.jsxs)("p", { className: cx("uix-color-picker__contrast", passes ? "uix-color-picker__contrast--pass" : "uix-color-picker__contrast--fail"), role: "status", "aria-live": "polite", children: [
+            "Contrast ",
+            ratio.toFixed(2),
+            ":1 \u2014 ",
+            passes ? `passes WCAG AA (${minimumContrast}:1)` : `does not meet WCAG AA (${minimumContrast}:1)`
+          ] }),
+          /* @__PURE__ */ (0, import_jsx_runtime54.jsx)("button", { type: "button", className: "uix-btn uix-btn--primary uix-btn--sm", onClick: close, children: "Done" })
+        ]
+      }
+    )
+  ] });
+}
+
+// src/components/BrandProfiles.tsx
+var import_jsx_runtime55 = require("react/jsx-runtime");
+var PROFILE_PROPERTIES = {
+  brand: "--uix-brand",
+  brandForeground: "--uix-brand-fg",
+  sans: "--uix-font-sans",
+  heading: "--uix-font-heading",
+  mono: "--uix-font-mono"
+};
+var EMPTY_PROFILES = [];
+var EMPTY_COLORS2 = [];
+function applyBrandProfile(profile, target) {
+  const element = target ?? (typeof document === "undefined" ? void 0 : document.documentElement);
+  if (!element) return void 0;
+  const brand = normalizeHex(profile.brand);
+  const foreground = normalizeHex(profile.brandForeground);
+  if (!brand || !foreground) throw new TypeError("Brand profiles require valid hex brand and foreground colors.");
+  const properties = {};
+  Object.values(PROFILE_PROPERTIES).forEach((property) => {
+    properties[property] = element.style.getPropertyValue(property);
+  });
+  const snapshot = {
+    profileId: element.dataset.uixBrandProfile,
+    properties,
+    logoSrc: element.dataset.uixBrandLogoSrc,
+    logoAlt: element.dataset.uixBrandLogoAlt
+  };
+  element.style.setProperty(PROFILE_PROPERTIES.brand, brand);
+  element.style.setProperty(PROFILE_PROPERTIES.brandForeground, foreground);
+  const typography = profile.typography ?? {};
+  for (const [key, property] of Object.entries({ sans: PROFILE_PROPERTIES.sans, heading: PROFILE_PROPERTIES.heading, mono: PROFILE_PROPERTIES.mono })) {
+    const value = typography[key];
+    if (value) element.style.setProperty(property, value);
+    else element.style.removeProperty(property);
+  }
+  element.dataset.uixBrandProfile = profile.id;
+  if (profile.logo) {
+    element.dataset.uixBrandLogoSrc = profile.logo.src;
+    element.dataset.uixBrandLogoAlt = profile.logo.alt;
+  } else {
+    delete element.dataset.uixBrandLogoSrc;
+    delete element.dataset.uixBrandLogoAlt;
+  }
+  return snapshot;
+}
+function restoreBrandProfile(snapshot, target) {
+  const element = target ?? (typeof document === "undefined" ? void 0 : document.documentElement);
+  if (!element) return;
+  Object.entries(snapshot.properties).forEach(([property, value]) => {
+    if (value) element.style.setProperty(property, value);
+    else element.style.removeProperty(property);
+  });
+  if (snapshot.profileId) element.dataset.uixBrandProfile = snapshot.profileId;
+  else delete element.dataset.uixBrandProfile;
+  if (snapshot.logoSrc) element.dataset.uixBrandLogoSrc = snapshot.logoSrc;
+  else delete element.dataset.uixBrandLogoSrc;
+  if (snapshot.logoAlt) element.dataset.uixBrandLogoAlt = snapshot.logoAlt;
+  else delete element.dataset.uixBrandLogoAlt;
+}
+function BrandProfileEditor({
+  value,
+  onChange,
+  profiles = EMPTY_PROFILES,
+  onSelectProfile,
+  onApply,
+  applyTarget,
+  onLogoFile,
+  colorPresets = EMPTY_COLORS2,
+  className
+}) {
+  const [announcement, setAnnouncement] = (0, import_react30.useState)("");
+  const update = (patch) => onChange({ ...value, ...patch });
+  const apply = () => {
+    if (applyTarget !== null) applyBrandProfile(value, applyTarget);
+    onApply?.(value);
+    setAnnouncement(`${value.name} applied.`);
+  };
+  const onFile = (event) => {
+    const file = event.currentTarget.files?.[0];
+    if (file) onLogoFile?.(file);
+  };
+  const previewStyle = {
+    "--uix-brand": normalizeHex(value.brand) ?? value.brand,
+    "--uix-brand-fg": normalizeHex(value.brandForeground) ?? value.brandForeground,
+    ...value.typography?.sans ? { "--uix-font-sans": value.typography.sans } : {},
+    ...value.typography?.heading ? { "--uix-font-heading": value.typography.heading } : {}
+  };
+  return /* @__PURE__ */ (0, import_jsx_runtime55.jsxs)("section", { className: cx("uix-brand-profiles", className), "aria-label": "Brand profile editor", children: [
+    /* @__PURE__ */ (0, import_jsx_runtime55.jsxs)("div", { className: "uix-brand-profiles__form", children: [
+      profiles.length > 0 && /* @__PURE__ */ (0, import_jsx_runtime55.jsxs)("label", { className: "uix-field__label", children: [
+        "Profile",
+        /* @__PURE__ */ (0, import_jsx_runtime55.jsx)("select", { className: "uix-select", value: value.id, onChange: (event) => {
+          const selected = profiles.find((profile) => profile.id === event.currentTarget.value);
+          if (selected) onSelectProfile?.(selected);
+        }, children: profiles.map((profile) => /* @__PURE__ */ (0, import_jsx_runtime55.jsx)("option", { value: profile.id, children: profile.name }, profile.id)) })
+      ] }),
+      /* @__PURE__ */ (0, import_jsx_runtime55.jsxs)("label", { className: "uix-field__label", children: [
+        "Name",
+        /* @__PURE__ */ (0, import_jsx_runtime55.jsx)("input", { className: "uix-input", value: value.name, onChange: (event) => update({ name: event.currentTarget.value }) })
+      ] }),
+      /* @__PURE__ */ (0, import_jsx_runtime55.jsxs)("div", { className: "uix-brand-profiles__colors", children: [
+        /* @__PURE__ */ (0, import_jsx_runtime55.jsxs)("label", { children: [
+          "Brand",
+          /* @__PURE__ */ (0, import_jsx_runtime55.jsx)(ColorPicker, { label: "Brand color", value: value.brand, foreground: value.brandForeground, presets: colorPresets, onChange: (brand) => update({ brand }) })
+        ] }),
+        /* @__PURE__ */ (0, import_jsx_runtime55.jsxs)("label", { children: [
+          "On brand",
+          /* @__PURE__ */ (0, import_jsx_runtime55.jsx)(ColorPicker, { label: "Brand foreground color", value: value.brandForeground, foreground: value.brand, presets: colorPresets, onChange: (brandForeground) => update({ brandForeground }) })
+        ] })
+      ] }),
+      /* @__PURE__ */ (0, import_jsx_runtime55.jsxs)("label", { className: "uix-field__label", children: [
+        "Body font",
+        /* @__PURE__ */ (0, import_jsx_runtime55.jsx)("input", { className: "uix-input", value: value.typography?.sans ?? "", onChange: (event) => update({ typography: { ...value.typography, sans: event.currentTarget.value || void 0 } }) })
+      ] }),
+      /* @__PURE__ */ (0, import_jsx_runtime55.jsxs)("label", { className: "uix-field__label", children: [
+        "Heading font",
+        /* @__PURE__ */ (0, import_jsx_runtime55.jsx)("input", { className: "uix-input", value: value.typography?.heading ?? "", onChange: (event) => update({ typography: { ...value.typography, heading: event.currentTarget.value || void 0 } }) })
+      ] }),
+      /* @__PURE__ */ (0, import_jsx_runtime55.jsxs)("label", { className: "uix-file-upload uix-brand-profiles__upload", children: [
+        "Logo file",
+        /* @__PURE__ */ (0, import_jsx_runtime55.jsx)("input", { type: "file", accept: "image/*", onChange: onFile })
+      ] }),
+      /* @__PURE__ */ (0, import_jsx_runtime55.jsx)("button", { type: "button", className: "uix-btn uix-btn--primary", onClick: apply, children: "Apply profile" }),
+      /* @__PURE__ */ (0, import_jsx_runtime55.jsx)("span", { className: "uix-visually-hidden", "aria-live": "polite", children: announcement })
+    ] }),
+    /* @__PURE__ */ (0, import_jsx_runtime55.jsxs)("div", { className: "uix-brand-profiles__preview", style: previewStyle, "aria-label": `Live preview of ${value.name}`, children: [
+      /* @__PURE__ */ (0, import_jsx_runtime55.jsxs)("div", { className: "uix-brand-profiles__preview-header", children: [
+        value.logo ? /* @__PURE__ */ (0, import_jsx_runtime55.jsx)("img", { src: value.logo.src, alt: value.logo.alt }) : /* @__PURE__ */ (0, import_jsx_runtime55.jsx)("span", { className: "uix-brand-profiles__logo-placeholder", children: "Logo" }),
+        /* @__PURE__ */ (0, import_jsx_runtime55.jsx)("strong", { children: value.name || "Brand preview" })
+      ] }),
+      /* @__PURE__ */ (0, import_jsx_runtime55.jsxs)("div", { className: "uix-brand-profiles__preview-body", children: [
+        /* @__PURE__ */ (0, import_jsx_runtime55.jsx)("h3", { children: "Readable, serializable branding" }),
+        /* @__PURE__ */ (0, import_jsx_runtime55.jsx)("p", { children: "Accent, links, rings, and muted states continue through the existing UIx token chain." }),
+        /* @__PURE__ */ (0, import_jsx_runtime55.jsx)("button", { type: "button", className: "uix-btn uix-btn--primary", children: "Primary action" }),
+        /* @__PURE__ */ (0, import_jsx_runtime55.jsx)("a", { href: "#brand-profile-preview", children: "Preview link" })
+      ] })
+    ] })
+  ] });
+}
+var BrandProfiles = BrandProfileEditor;
+
+// src/components/DiffViewer.tsx
+var import_react31 = require("react");
+
+// src/diff-model.ts
+function isJsonObject(value) {
+  return value !== null && typeof value === "object" && !Array.isArray(value);
+}
+function jsonEqual(a, b) {
+  if (a === b) return true;
+  if (Array.isArray(a) && Array.isArray(b)) {
+    return a.length === b.length && a.every((value, index) => jsonEqual(value, b[index]));
+  }
+  if (isJsonObject(a) && isJsonObject(b)) {
+    const aKeys = Object.keys(a).sort();
+    const bKeys = Object.keys(b).sort();
+    return aKeys.length === bKeys.length && aKeys.every((key, index) => key === bKeys[index] && jsonEqual(a[key], b[key]));
+  }
+  return false;
+}
+function classify(base, current, incoming) {
+  if (base === void 0) return "added";
+  if (incoming === void 0) return "removed";
+  const currentChanged = !jsonEqual(base, current);
+  const incomingChanged = !jsonEqual(base, incoming);
+  if (currentChanged && incomingChanged && !jsonEqual(current, incoming)) return "conflicted";
+  return "changed";
+}
+function buildThreeWayDiff(base, current, incoming, path = "$") {
+  if (jsonEqual(current, incoming)) return [];
+  if (isJsonObject(base) || isJsonObject(current) || isJsonObject(incoming)) {
+    const objects = [base, current, incoming].filter(isJsonObject);
+    const keys = [...new Set(objects.flatMap((value) => Object.keys(value)))].sort();
+    return keys.flatMap((key) => buildThreeWayDiff(
+      isJsonObject(base) ? base[key] : void 0,
+      isJsonObject(current) ? current[key] : void 0,
+      isJsonObject(incoming) ? incoming[key] : void 0,
+      `${path}.${key}`
+    ));
+  }
+  return [{ path, kind: classify(base, current, incoming), base, current, incoming }];
+}
+function summarizeDiff(entries, resolutions = {}) {
+  const summary = { added: 0, removed: 0, changed: 0, conflicted: 0, resolved: 0, pending: 0 };
+  entries.forEach((entry) => {
+    summary[entry.kind] += 1;
+    if ((resolutions[entry.path] ?? "pending") === "pending") summary.pending += 1;
+    else summary.resolved += 1;
+  });
+  return summary;
+}
+
+// src/components/DiffViewer.tsx
+var import_jsx_runtime56 = require("react/jsx-runtime");
+var GROUPS = [
+  { kind: "conflicted", label: "Conflicted" },
+  { kind: "changed", label: "Changed" },
+  { kind: "added", label: "Added" },
+  { kind: "removed", label: "Removed" }
+];
+var DEFAULT_LABELS = {};
+var renderValue = (value) => value === void 0 ? "Not present" : JSON.stringify(value, null, 2);
+function DiffViewer({
+  base,
+  current,
+  incoming,
+  entries: providedEntries,
+  resolutions: controlledResolutions,
+  onResolutionChange,
+  labels = DEFAULT_LABELS,
+  className
+}) {
+  const id = (0, import_react31.useId)();
+  const entries = (0, import_react31.useMemo)(() => providedEntries ?? buildThreeWayDiff(base, current, incoming), [providedEntries, base, current, incoming]);
+  const [internalResolutions, setInternalResolutions] = (0, import_react31.useState)({});
+  const resolutions = controlledResolutions ?? internalResolutions;
+  const summary = summarizeDiff(entries, resolutions);
+  const resolve2 = (path, resolution) => {
+    if (controlledResolutions === void 0) setInternalResolutions((currentState) => ({ ...currentState, [path]: resolution }));
+    onResolutionChange?.(path, resolution);
+  };
+  if (entries.length === 0) return /* @__PURE__ */ (0, import_jsx_runtime56.jsxs)("section", { className: cx("uix-diff-viewer uix-diff-viewer--empty", className), "aria-label": "Configuration differences", children: [
+    /* @__PURE__ */ (0, import_jsx_runtime56.jsx)("h3", { children: "No differences" }),
+    /* @__PURE__ */ (0, import_jsx_runtime56.jsx)("p", { children: "Base, current, and incoming values are aligned." })
+  ] });
+  return /* @__PURE__ */ (0, import_jsx_runtime56.jsxs)("section", { className: cx("uix-diff-viewer", className), "aria-label": "Configuration differences", children: [
+    /* @__PURE__ */ (0, import_jsx_runtime56.jsxs)("div", { className: "uix-diff-viewer__summary", "aria-label": "Difference summary", children: [
+      GROUPS.map((group) => /* @__PURE__ */ (0, import_jsx_runtime56.jsxs)("span", { children: [
+        /* @__PURE__ */ (0, import_jsx_runtime56.jsx)("b", { children: summary[group.kind] }),
+        " ",
+        group.label.toLowerCase()
+      ] }, group.kind)),
+      /* @__PURE__ */ (0, import_jsx_runtime56.jsxs)("span", { children: [
+        /* @__PURE__ */ (0, import_jsx_runtime56.jsx)("b", { children: summary.resolved }),
+        " resolved"
+      ] }),
+      /* @__PURE__ */ (0, import_jsx_runtime56.jsxs)("span", { children: [
+        /* @__PURE__ */ (0, import_jsx_runtime56.jsx)("b", { children: summary.pending }),
+        " pending"
+      ] })
+    ] }),
+    GROUPS.map((group) => {
+      const grouped = entries.filter((entry) => entry.kind === group.kind);
+      if (!grouped.length) return null;
+      return /* @__PURE__ */ (0, import_jsx_runtime56.jsxs)("section", { className: "uix-diff-viewer__group", "aria-labelledby": `${id}-${group.kind}`, children: [
+        /* @__PURE__ */ (0, import_jsx_runtime56.jsxs)("h3", { id: `${id}-${group.kind}`, children: [
+          group.label,
+          " ",
+          /* @__PURE__ */ (0, import_jsx_runtime56.jsx)("span", { children: grouped.length })
+        ] }),
+        grouped.map((entry) => {
+          const resolution = resolutions[entry.path] ?? "pending";
+          return /* @__PURE__ */ (0, import_jsx_runtime56.jsxs)("details", { className: "uix-diff-viewer__entry", "data-kind": entry.kind, open: entry.kind === "conflicted", children: [
+            /* @__PURE__ */ (0, import_jsx_runtime56.jsxs)("summary", { children: [
+              /* @__PURE__ */ (0, import_jsx_runtime56.jsx)("code", { children: entry.path }),
+              /* @__PURE__ */ (0, import_jsx_runtime56.jsx)(StatusPill, { tone: resolution === "pending" ? "warning" : "success", children: resolution })
+            ] }),
+            /* @__PURE__ */ (0, import_jsx_runtime56.jsx)("div", { className: "uix-diff-viewer__versions", children: ["base", "current", "incoming"].map((version) => /* @__PURE__ */ (0, import_jsx_runtime56.jsxs)("div", { role: "region", "aria-label": `${labels[version] ?? `${version[0].toUpperCase()}${version.slice(1)}`} value for ${entry.path}`, children: [
+              /* @__PURE__ */ (0, import_jsx_runtime56.jsx)("strong", { children: labels[version] ?? `${version[0].toUpperCase()}${version.slice(1)}` }),
+              /* @__PURE__ */ (0, import_jsx_runtime56.jsx)("pre", { children: renderValue(entry[version]) })
+            ] }, version)) }),
+            /* @__PURE__ */ (0, import_jsx_runtime56.jsxs)("div", { className: "uix-diff-viewer__actions", "aria-label": `Resolve ${entry.path}`, children: [
+              /* @__PURE__ */ (0, import_jsx_runtime56.jsx)("button", { type: "button", className: "uix-btn uix-btn--primary uix-btn--sm", "aria-pressed": resolution === "accept", onClick: () => resolve2(entry.path, "accept"), children: "Accept incoming" }),
+              /* @__PURE__ */ (0, import_jsx_runtime56.jsx)("button", { type: "button", className: "uix-btn uix-btn--secondary uix-btn--sm", "aria-pressed": resolution === "skip", onClick: () => resolve2(entry.path, "skip"), children: "Keep current" }),
+              /* @__PURE__ */ (0, import_jsx_runtime56.jsx)("button", { type: "button", className: "uix-btn uix-btn--ghost uix-btn--sm", "aria-pressed": resolution === "pending", onClick: () => resolve2(entry.path, "pending"), children: "Mark pending" })
+            ] })
+          ] }, entry.path);
+        })
+      ] }, group.kind);
+    }),
+    /* @__PURE__ */ (0, import_jsx_runtime56.jsxs)("p", { className: "uix-visually-hidden", "aria-live": "polite", children: [
+      summary.resolved,
+      " of ",
+      entries.length,
+      " differences resolved."
+    ] })
+  ] });
+}
 // Annotate the CommonJS export names for ESM import in node:
 0 && (module.exports = {
   Alert,
   AppShell,
   Avatar,
   AvatarGroup,
+  BrandProfileEditor,
+  BrandProfiles,
+  BuilderCanvas,
   BulkBar,
   Button,
   ButtonGroup,
@@ -2562,6 +4265,7 @@ function StatusRow({ indicator, name, meta, className, ...props }) {
   CellStrong,
   CellSub,
   Checkbox,
+  ColorPicker,
   CommandGroup,
   CommandItem,
   CommandPalette,
@@ -2571,9 +4275,11 @@ function StatusRow({ indicator, name, meta, className, ...props }) {
   ComposerBar,
   ContentList,
   ContentListItem,
+  DateRangePicker,
   DescriptionItem,
   DescriptionList,
   DetailLayout,
+  DiffViewer,
   Drawer,
   EmptyState,
   ErrorState,
@@ -2594,11 +4300,14 @@ function StatusRow({ indicator, name, meta, className, ...props }) {
   KanbanCard,
   KanbanColumn,
   Label,
+  LicensePositionBar,
   List,
   ListItem,
   LoadingState,
   Mark,
+  MatchReview,
   Meter,
+  MetricInput,
   Modal,
   NavFavourites,
   NavGroup,
@@ -2615,9 +4324,12 @@ function StatusRow({ indicator, name, meta, className, ...props }) {
   Prose,
   Radio,
   RadioGroup,
+  RelationshipGraph,
   ResourceGrid,
   RowAction,
   RowActions,
+  RuleBuilder,
+  SchedulingCalendar,
   SectionHead,
   Segmented,
   SegmentedOption,
@@ -2648,29 +4360,68 @@ function StatusRow({ indicator, name, meta, className, ...props }) {
   Tr,
   Tree,
   UserChip,
+  addCalendarDays,
+  addCalendarMonths,
+  appendRuleNode,
+  applyBrandProfile,
   applyFilters,
+  boundRelationshipGraph,
+  buildMonthGrid,
+  buildThreeWayDiff,
+  clampMetricValue,
   clampWidth,
   computePosition,
+  contrastRatio,
   cx,
+  enumerateDateSpan,
+  findRuleNodeDepth,
   flattenTree,
+  hexToRgb,
   highlightSegments,
+  hsvToHex,
+  hsvToRgb,
+  isDateInRange,
+  isDateUnavailable,
+  isRuleGroup,
+  layoutRelationshipGraph,
+  mapRuleGroup,
   matchFilter,
+  meetsContrast,
   mergePinned,
+  moveRuleNode,
   multiSort,
   nextSortDir,
+  normalizeHex,
+  parseMetricValue,
   parseView,
+  relationshipNeighbors,
+  removeRuleNode,
   reorder,
+  restoreBrandProfile,
+  rgbToHex,
+  rgbToHsv,
+  ruleDepth,
   searchRows,
   selectAllState,
+  selectRangeDate,
   serializeView,
   shouldVirtualize,
+  startOfMonth,
+  stepMetricValue,
+  summarizeDiff,
+  summarizeRule,
+  toDateKey,
   toggleId,
   togglePage,
   toggleSort,
+  traverseRelationshipNode,
   treeNav,
   useAnchoredPosition,
   useDialog,
   useTable,
   useVirtualRows,
-  virtualWindow
+  validateRuleDefinition,
+  virtualWindow,
+  zonedDateKey,
+  zonedDateSpan
 });