@wipco/sdui 0.26.0 → 0.27.0

package/dist/chunk-ZDRERW4G.js

@@ -0,0 +1,359 @@
+import { TagMultiSelect } from './chunk-QDEZXA34.js';
+import { ApprovalLineEditor, stepTypeIcon, stepLabel } from './chunk-SAPJVLZM.js';
+import { useSduiAdapter, hostFetchOf, defaultAdapter } from './chunk-DVOPZFQS.js';
+import { Card, Icon, Input, IconButton, Field, Button, Badge } from './chunk-WIDDHR7L.js';
+import { boxed } from './chunk-SAN4IX6N.js';
+import React, { useState, useEffect } from 'react';
+import { jsxs, jsx } from 'react/jsx-runtime';
+
+function facetsFrom(rows) {
+  const titles = /* @__PURE__ */ new Set();
+  const grades = /* @__PURE__ */ new Set();
+  if (Array.isArray(rows)) {
+    for (const row of rows) {
+      if (typeof row !== "object" || row === null) continue;
+      const title = row.job_title;
+      const grade = row.grade;
+      if (typeof title === "string" && title.trim()) titles.add(title.trim());
+      if (typeof grade === "string" && grade.trim()) grades.add(grade.trim());
+    }
+  }
+  const ko = (a, b) => a.localeCompare(b, "ko");
+  return { titles: [...titles].sort(ko), grades: [...grades].sort(ko) };
+}
+var uidCounter = 0;
+var uid = (prefix) => `${prefix}-${Date.now()}-${++uidCounter}`;
+var describeScope = (override) => {
+  const identityParts = [];
+  if (override.jobTitles.length > 0) identityParts.push(`\uC9C1\uCC45 ${override.jobTitles.join(", ")}`);
+  if (override.grades.length > 0) identityParts.push(`\uC9C1\uAE09 ${override.grades.join(", ")}`);
+  const legacyEntities = override.entityTypes ?? [];
+  const identityPart = identityParts.length > 0 ? identityParts.join(" \uB610\uB294 ") : legacyEntities.length > 0 ? "\uC9C1\uCC45\xB7\uC9C1\uAE09 \uC870\uAC74 \uC5C6\uC74C (\uC804 \uC9C1\uC6D0 \uC801\uC6A9)" : "\uC9C1\uCC45\xB7\uC9C1\uAE09 \uC870\uAC74 \uC5C6\uC74C (\uB9E4\uCE6D\uB418\uC9C0 \uC54A\uC2B5\uB2C8\uB2E4)";
+  if (legacyEntities.length === 0) return identityPart;
+  return `${identityPart} \xB7 \uC5C5\uBB34\uC720\uD615 ${legacyEntities.join(", ")} \uD55C\uC815`;
+};
+var withSelected = (options, selected) => [...options, ...selected.filter((value) => !options.includes(value))].map((value) => ({
+  value,
+  label: value
+}));
+var orderCircleStyle = {
+  display: "inline-flex",
+  alignItems: "center",
+  justifyContent: "center",
+  width: 28,
+  height: 28,
+  flex: "none",
+  borderRadius: "var(--wp-radius-pill)",
+  background: "var(--wp-surface-brand-tint)",
+  color: "var(--wp-text-brand)"
+};
+function StepSummary({ steps }) {
+  if (steps.length === 0) {
+    return /* @__PURE__ */ jsx("span", { className: "wp-caption", children: "\uACB0\uC7AC \uB2E8\uACC4\uAC00 \uC5C6\uC2B5\uB2C8\uB2E4 \u2014 \uB9E4\uCE6D \uC2DC \uC790\uB3D9 \uC2B9\uC778\uB429\uB2C8\uB2E4." });
+  }
+  return /* @__PURE__ */ jsx("div", { className: "wp-row", style: { flexWrap: "wrap", gap: "var(--wp-space-1)" }, children: steps.map((step, index) => /* @__PURE__ */ jsxs(React.Fragment, { children: [
+    /* @__PURE__ */ jsxs(Badge, { tone: "neutral", children: [
+      /* @__PURE__ */ jsx(
+        Icon,
+        {
+          name: stepTypeIcon(step.type),
+          size: 12,
+          style: { marginRight: "var(--wp-space-1)" }
+        }
+      ),
+      stepLabel(step)
+    ] }),
+    index < steps.length - 1 ? /* @__PURE__ */ jsx(Icon, { name: "arrow-right", size: 12, style: { color: "var(--wp-text-muted)", flex: "none" } }) : null
+  ] }, step.id)) });
+}
+function ApprovalOverridesEditorImpl({
+  value,
+  onChange,
+  jobTitleOptions,
+  gradeOptions,
+  facetsEndpoint,
+  searchEndpoint,
+  groupSearchEndpoint,
+  searchOptions,
+  disabled = false
+}) {
+  const adapter = useSduiAdapter();
+  const api = hostFetchOf(adapter) ?? defaultAdapter.fetch;
+  const overrides = value ?? [];
+  const [fetchedFacets, setFetchedFacets] = useState(
+    null
+  );
+  useEffect(() => {
+    if (!facetsEndpoint) return;
+    let alive = true;
+    api(facetsEndpoint, { method: "GET" }).then((response) => {
+      if (!alive) return;
+      const body = response;
+      const rows = Array.isArray(response) ? response : body?.data ?? [];
+      setFetchedFacets(facetsFrom(rows));
+    }).catch(() => {
+    });
+    return () => {
+      alive = false;
+    };
+  }, [facetsEndpoint]);
+  const mergedTitles = [
+    ...jobTitleOptions ?? [],
+    ...(fetchedFacets?.titles ?? []).filter((t) => !(jobTitleOptions ?? []).includes(t))
+  ];
+  const mergedGrades = [
+    ...gradeOptions ?? [],
+    ...(fetchedFacets?.grades ?? []).filter((g) => !(gradeOptions ?? []).includes(g))
+  ];
+  const updateOverride = (id, patch) => {
+    onChange?.(
+      overrides.map((override) => override.id === id ? { ...override, ...patch } : override)
+    );
+  };
+  const addOverride = () => {
+    onChange?.([...overrides, { id: uid("line"), name: "", jobTitles: [], grades: [], steps: [] }]);
+  };
+  const removeOverride = (id) => {
+    onChange?.(overrides.filter((override) => override.id !== id));
+  };
+  const duplicateOverride = (index) => {
+    const source = overrides[index];
+    if (!source) return;
+    const copy = {
+      ...source,
+      id: uid("line"),
+      name: source.name.trim() ? `${source.name} (\uBCF5\uC0AC\uBCF8)` : "",
+      jobTitles: [...source.jobTitles],
+      grades: [...source.grades],
+      steps: source.steps.map((step) => ({
+        ...step,
+        id: uid("step"),
+        customApprovers: step.customApprovers?.map((approver) => ({ ...approver }))
+      }))
+    };
+    const next = [...overrides];
+    next.splice(index + 1, 0, copy);
+    onChange?.(next);
+  };
+  const moveOverride = (index, direction) => {
+    const target = index + direction;
+    if (target < 0 || target >= overrides.length) return;
+    const next = [...overrides];
+    [next[index], next[target]] = [next[target], next[index]];
+    onChange?.(next);
+  };
+  const [dragIndex, setDragIndex] = useState(null);
+  const [dropIndex, setDropIndex] = useState(null);
+  const finishDrag = () => {
+    if (dragIndex !== null && dropIndex !== null && dragIndex !== dropIndex) {
+      const next = [...overrides];
+      const [moved] = next.splice(dragIndex, 1);
+      next.splice(dropIndex, 0, moved);
+      onChange?.(next);
+    }
+    setDragIndex(null);
+    setDropIndex(null);
+  };
+  return /* @__PURE__ */ jsxs("div", { className: "wp-col", style: { gap: "var(--wp-space-3)" }, children: [
+    /* @__PURE__ */ jsx("span", { className: "wp-caption", children: "\uC694\uCCAD\uC790\uC758 \uC9C1\uCC45\xB7\uC9C1\uAE09\uC5D0 \uB530\uB77C \uAE30\uBCF8 \uACB0\uC7AC\uC120 \uB300\uC2E0 \uC801\uC6A9\uD560 \uACB0\uC7AC\uB77C\uC778\uC785\uB2C8\uB2E4. \uC9C1\uCC45\uACFC \uC9C1\uAE09 \uC911 \uD558\uB098\uB9CC \uB9DE\uC544\uB3C4 \uC801\uC6A9\uB418\uBA70, \uC704\uC5D0\uC11C\uBD80\uD130 \uBA3C\uC800 \uB9E4\uCE6D\uB418\uB294 \uACB0\uC7AC\uB77C\uC778\uC774 \uC6B0\uC120 \uC801\uC6A9\uB429\uB2C8\uB2E4." }),
+    overrides.length === 0 ? /* @__PURE__ */ jsx(
+      "div",
+      {
+        className: "wp-body-sm",
+        style: {
+          border: "var(--wp-border-w) dashed var(--wp-border-default)",
+          borderRadius: "var(--wp-radius-lg)",
+          padding: "var(--wp-space-4)",
+          textAlign: "center",
+          color: "var(--wp-text-muted)"
+        },
+        children: "\uC124\uC815\uB41C \uC9C1\uAE09/\uC9C1\uCC45\uBCC4 \uACB0\uC7AC\uB77C\uC778\uC774 \uC5C6\uC2B5\uB2C8\uB2E4."
+      }
+    ) : overrides.map((override, index) => /* @__PURE__ */ jsx(
+      Card,
+      {
+        padding: "tight",
+        style: {
+          // 드롭 목적지 표시 — 삽입될 자리의 카드 위에 브랜드 선을 긋는다.
+          boxShadow: dropIndex === index && dragIndex !== null && dragIndex !== index ? "0 calc(-1 * var(--wp-space-1)) 0 0 var(--wp-border-brand)" : void 0,
+          opacity: dragIndex === index ? 0.5 : void 0
+        },
+        onDragOver: (event) => {
+          if (dragIndex === null) return;
+          event.preventDefault();
+          if (dropIndex !== index) setDropIndex(index);
+        },
+        onDrop: (event) => {
+          event.preventDefault();
+          finishDrag();
+        },
+        children: /* @__PURE__ */ jsxs("div", { className: "wp-col", style: { gap: "var(--wp-space-3)" }, children: [
+          /* @__PURE__ */ jsxs("div", { className: "wp-row", style: { alignItems: "center" }, children: [
+            /* @__PURE__ */ jsx(
+              "span",
+              {
+                draggable: !disabled,
+                "aria-hidden": true,
+                title: "\uB04C\uC5B4\uC11C \uC6B0\uC120\uC21C\uC704 \uBCC0\uACBD",
+                style: {
+                  cursor: disabled ? "default" : "grab",
+                  color: "var(--wp-text-muted)",
+                  display: "inline-flex",
+                  flex: "none",
+                  touchAction: "none"
+                },
+                onDragStart: (event) => {
+                  event.dataTransfer.setData("text/plain", String(index));
+                  event.dataTransfer.effectAllowed = "move";
+                  setDragIndex(index);
+                },
+                onDragEnd: () => {
+                  setDragIndex(null);
+                  setDropIndex(null);
+                },
+                children: /* @__PURE__ */ jsx(Icon, { name: "grip-vertical", size: 16 })
+              }
+            ),
+            /* @__PURE__ */ jsx("span", { className: "wp-body-sm", style: orderCircleStyle, title: "\uB9E4\uCE6D \uC6B0\uC120\uC21C\uC704", children: index + 1 }),
+            /* @__PURE__ */ jsx("div", { style: { flex: 1, minWidth: 0 }, children: /* @__PURE__ */ jsx(
+              Input,
+              {
+                "aria-label": "\uACB0\uC7AC\uB77C\uC778 \uC774\uB984",
+                value: override.name,
+                disabled,
+                placeholder: "\uC608: \uD300\uC7A5 \uC2B9\uC778 \uC0DD\uB7B5 \uB77C\uC778",
+                onChange: (event) => updateOverride(override.id, { name: event.target.value })
+              }
+            ) }),
+            /* @__PURE__ */ jsxs("div", { className: "wp-row", style: { flex: "none", gap: "var(--wp-space-1)" }, children: [
+              /* @__PURE__ */ jsx(
+                IconButton,
+                {
+                  type: "button",
+                  icon: "chevron-up",
+                  label: "\uC6B0\uC120\uC21C\uC704 \uC62C\uB9AC\uAE30",
+                  size: "sm",
+                  disabled: disabled || index === 0,
+                  onClick: () => moveOverride(index, -1)
+                }
+              ),
+              /* @__PURE__ */ jsx(
+                IconButton,
+                {
+                  type: "button",
+                  icon: "chevron-down",
+                  label: "\uC6B0\uC120\uC21C\uC704 \uB0B4\uB9AC\uAE30",
+                  size: "sm",
+                  disabled: disabled || index === overrides.length - 1,
+                  onClick: () => moveOverride(index, 1)
+                }
+              ),
+              /* @__PURE__ */ jsx(
+                IconButton,
+                {
+                  type: "button",
+                  icon: "copy",
+                  label: "\uACB0\uC7AC\uB77C\uC778 \uBCF5\uC81C",
+                  size: "sm",
+                  disabled,
+                  onClick: () => duplicateOverride(index)
+                }
+              ),
+              /* @__PURE__ */ jsx(
+                IconButton,
+                {
+                  type: "button",
+                  icon: "trash-2",
+                  label: "\uACB0\uC7AC\uB77C\uC778 \uC0AD\uC81C",
+                  variant: "danger",
+                  size: "sm",
+                  disabled,
+                  onClick: () => removeOverride(override.id)
+                }
+              )
+            ] })
+          ] }),
+          /* @__PURE__ */ jsxs("div", { className: "wp-col", style: { gap: "var(--wp-space-1)" }, children: [
+            /* @__PURE__ */ jsx("span", { className: "wp-caption", children: describeScope(override) }),
+            /* @__PURE__ */ jsx(StepSummary, { steps: override.steps })
+          ] }),
+          /* @__PURE__ */ jsx(
+            Field,
+            {
+              label: "\uC801\uC6A9 \uC9C1\uCC45",
+              hint: "\uC120\uD0DD\uD55C \uC9C1\uCC45 \uC911 \uD558\uB098\uB77C\uB3C4 \uC77C\uCE58\uD558\uBA74 \uC774 \uACB0\uC7AC\uB77C\uC778\uC774 \uC801\uC6A9\uB429\uB2C8\uB2E4.",
+              children: /* @__PURE__ */ jsx(
+                TagMultiSelect,
+                {
+                  options: withSelected(mergedTitles, override.jobTitles),
+                  values: override.jobTitles,
+                  disabled,
+                  emptyText: "\uC120\uD0DD \uAC00\uB2A5\uD55C \uC9C1\uCC45\uC774 \uC5C6\uC2B5\uB2C8\uB2E4.",
+                  onChange: (jobTitles) => updateOverride(override.id, { jobTitles })
+                }
+              )
+            }
+          ),
+          /* @__PURE__ */ jsx(
+            Field,
+            {
+              label: "\uC801\uC6A9 \uC9C1\uAE09",
+              hint: "\uC9C1\uCC45 \uC870\uAC74\uACFC OR \u2014 \uC9C1\uAE09\uB9CC \uC77C\uCE58\uD574\uB3C4 \uC801\uC6A9\uB429\uB2C8\uB2E4.",
+              children: /* @__PURE__ */ jsx(
+                TagMultiSelect,
+                {
+                  options: withSelected(mergedGrades, override.grades),
+                  values: override.grades,
+                  disabled,
+                  emptyText: "\uC120\uD0DD \uAC00\uB2A5\uD55C \uC9C1\uAE09\uC774 \uC5C6\uC2B5\uB2C8\uB2E4.",
+                  onChange: (grades) => updateOverride(override.id, { grades })
+                }
+              )
+            }
+          ),
+          /* @__PURE__ */ jsxs(
+            "div",
+            {
+              className: "wp-col",
+              style: {
+                gap: "var(--wp-space-2)",
+                borderTop: "var(--wp-border-w) solid var(--wp-divider)",
+                paddingTop: "var(--wp-space-3)"
+              },
+              children: [
+                /* @__PURE__ */ jsx("span", { className: "wp-label", children: "\uC774 \uACB0\uC7AC\uB77C\uC778\uC758 \uACB0\uC7AC \uB2E8\uACC4" }),
+                /* @__PURE__ */ jsx(
+                  ApprovalLineEditor,
+                  {
+                    value: override.steps,
+                    onChange: (steps) => updateOverride(override.id, { steps }),
+                    searchEndpoint,
+                    groupSearchEndpoint,
+                    options: searchOptions,
+                    disabled
+                  }
+                )
+              ]
+            }
+          )
+        ] })
+      },
+      override.id
+    )),
+    /* @__PURE__ */ jsx("div", { className: "wp-row", children: /* @__PURE__ */ jsx(
+      Button,
+      {
+        type: "button",
+        variant: "secondary",
+        icon: "plus",
+        disabled,
+        title: disabled ? "\uBE44\uD65C\uC131\uD654\uB428" : void 0,
+        onClick: addOverride,
+        children: "\uACB0\uC7AC\uB77C\uC778 \uCD94\uAC00"
+      }
+    ) })
+  ] });
+}
+var ApprovalOverridesEditor = boxed(ApprovalOverridesEditorImpl, "ApprovalOverridesEditor");
+
+export { ApprovalOverridesEditor };

package/dist/meta.d.ts

@@ -425,6 +425,8 @@ declare const richComponentMeta: {
 
 declare const ApprovalStepperMeta: SduiComponentMeta;
 declare const RankBoardMeta: SduiComponentMeta;
+declare const ApprovalLineEditorMeta: SduiComponentMeta;
+declare const ApprovalOverridesEditorMeta: SduiComponentMeta;
 declare const AutocompleteFieldMeta: SduiComponentMeta;
 declare const InlineEditMeta: SduiComponentMeta;
 declare const JsonFieldMeta: SduiComponentMeta;
@@ -458,6 +460,8 @@ declare const StripMeta: SduiComponentMeta;
  * 프롭을 못 그린다.
  */
 declare const widgetComponentMeta: {
+    ApprovalLineEditor: SduiComponentMeta;
+    ApprovalOverridesEditor: SduiComponentMeta;
     ApprovalStepper: SduiComponentMeta;
     RankBoard: SduiComponentMeta;
     AutocompleteField: SduiComponentMeta;
@@ -592,4 +596,4 @@ declare function paletteGroups(catalog?: Record<string, SduiComponentMeta>): Arr
     items: SduiComponentMeta[];
 }>;
 
-export { ActionsMeta, AlertMeta, ApprovalStepperMeta, AutocompleteFieldMeta, AvatarMeta, BadgeMeta, BreadcrumbMeta, ButtonMeta, CanMeta, CardMeta, ChartMeta, CheckboxMeta, ColMeta, ColumnBoardMeta, DatePickerMeta, DateRangePickerMeta, DialogMeta, DiffViewMeta, DisclosureMeta, DividerMeta, EmptyStateMeta, EventCalendarMeta, FieldMeta, ForEachMeta, FormMeta, FragmentMeta, GridMeta, IconButtonMeta, IconMeta, ImageLightboxMeta, InlineEditMeta, InputMeta, JsonFieldMeta, KeyValueListMeta, LiveClockMeta, MapPreviewMeta, OrgChartMeta, PageHeadMeta, PaginationMeta, PeriodFilterMeta, PrintSheetMeta, ProgressBarMeta, RadioMeta, RankBoardMeta, RecordSheetMeta, RemoteSearchResultsMeta, RowMeta, SDUI_CATEGORIES, SELF_AXIS_PROPS, type SduiCategory, type SduiChildrenMeta, type SduiComponentMeta, type SduiDomMeta, type SduiEnumOption, type SduiPropGroup, type SduiPropKind, type SduiPropMeta, type SduiResizeMeta, type SduiSlotMeta, SearchResultsMeta, SearchableMultiPickerMeta, SectionMeta, SecureScreenMeta, SegmentedControlMeta, SelectMeta, ShowMeta, SidebarNavMeta, SortHandleMeta, SortableListMeta, SpacerMeta, SpinnerMeta, StackedMeterMeta, StatCardMeta, StripMeta, SummaryTableMeta, SwitchMeta, TableMeta, TabsMeta, TagMeta, TagMultiSelectMeta, TextMeta, TextareaMeta, TimePickerMeta, TimelineMeta, ToastMeta, TooltipMeta, TreePickerMeta, TreeViewMeta, allComponentMeta, builtinComponentMeta, coreComponentMeta, dsComponentMeta, getComponentMeta, paletteGroups, richComponentMeta, slotNamesOf, widgetComponentMeta, withSelfAxis, withSelfAxisAll };
+export { ActionsMeta, AlertMeta, ApprovalLineEditorMeta, ApprovalOverridesEditorMeta, ApprovalStepperMeta, AutocompleteFieldMeta, AvatarMeta, BadgeMeta, BreadcrumbMeta, ButtonMeta, CanMeta, CardMeta, ChartMeta, CheckboxMeta, ColMeta, ColumnBoardMeta, DatePickerMeta, DateRangePickerMeta, DialogMeta, DiffViewMeta, DisclosureMeta, DividerMeta, EmptyStateMeta, EventCalendarMeta, FieldMeta, ForEachMeta, FormMeta, FragmentMeta, GridMeta, IconButtonMeta, IconMeta, ImageLightboxMeta, InlineEditMeta, InputMeta, JsonFieldMeta, KeyValueListMeta, LiveClockMeta, MapPreviewMeta, OrgChartMeta, PageHeadMeta, PaginationMeta, PeriodFilterMeta, PrintSheetMeta, ProgressBarMeta, RadioMeta, RankBoardMeta, RecordSheetMeta, RemoteSearchResultsMeta, RowMeta, SDUI_CATEGORIES, SELF_AXIS_PROPS, type SduiCategory, type SduiChildrenMeta, type SduiComponentMeta, type SduiDomMeta, type SduiEnumOption, type SduiPropGroup, type SduiPropKind, type SduiPropMeta, type SduiResizeMeta, type SduiSlotMeta, SearchResultsMeta, SearchableMultiPickerMeta, SectionMeta, SecureScreenMeta, SegmentedControlMeta, SelectMeta, ShowMeta, SidebarNavMeta, SortHandleMeta, SortableListMeta, SpacerMeta, SpinnerMeta, StackedMeterMeta, StatCardMeta, StripMeta, SummaryTableMeta, SwitchMeta, TableMeta, TabsMeta, TagMeta, TagMultiSelectMeta, TextMeta, TextareaMeta, TimePickerMeta, TimelineMeta, ToastMeta, TooltipMeta, TreePickerMeta, TreeViewMeta, allComponentMeta, builtinComponentMeta, coreComponentMeta, dsComponentMeta, getComponentMeta, paletteGroups, richComponentMeta, slotNamesOf, widgetComponentMeta, withSelfAxis, withSelfAxisAll };

package/dist/meta.js

@@ -3416,6 +3416,256 @@ var RankBoardMeta = {
   },
   resize: { kind: "none" }
 };
+var customApproverItem = [
+  { name: "id", kind: "string", label: "\uC2DD\uBCC4\uC790", required: true },
+  { name: "name", kind: "string", label: "\uD45C\uC2DC\uBA85", required: true },
+  {
+    name: "type",
+    kind: "enum",
+    label: "\uC885\uB958",
+    required: true,
+    options: [
+      { value: "user", label: "\uC9C1\uC6D0" },
+      { value: "group", label: "\uBD80\uC11C\xB7\uADF8\uB8F9" }
+    ]
+  }
+];
+var approvalLineStepItem = [
+  { name: "id", kind: "string", label: "\uC2A4\uD15D id", required: true },
+  {
+    name: "type",
+    kind: "enum",
+    label: "\uC720\uD615",
+    description: "\uC5C6\uC73C\uBA74 \uBC31\uC5D4\uB4DC\uAC00 custom\uC73C\uB85C \uCDE8\uAE09\uD55C\uB2E4(\uB9C8\uC774\uADF8\uB808\uC774\uC158 \uC774\uAD00 \uC2A4\uD15D \uD638\uD658).",
+    options: [
+      { value: "team_leader", label: "\uD300\uC7A5" },
+      { value: "division_head", label: "\uBCF8\uBD80\uC7A5\xB7\uC2E4\uC7A5" },
+      { value: "custom", label: "\uC0AC\uC6A9\uC790 \uC9C0\uC815" }
+    ]
+  },
+  {
+    name: "name",
+    kind: "string",
+    label: "\uD45C\uC2DC\uBA85",
+    description: "\uBC31\uC5D4\uB4DC\uAC00 \uACB0\uC7AC \uB2E8\uACC4 \uC124\uBA85\uC73C\uB85C \uADF8\uB300\uB85C \uC4F4\uB2E4. \uC5C6\uC73C\uBA74 type\uC73C\uB85C \uB300\uC2E0\uD55C\uB2E4."
+  },
+  {
+    name: "order",
+    kind: "number",
+    label: "\uC21C\uBC88",
+    required: true,
+    description: "1\uBD80\uD130. \uD3B8\uC9D1\uAE30\uAC00 \uAC12\uC744 \uBC14\uAFC0 \uB54C\uB9C8\uB2E4 1..n\uC73C\uB85C \uC815\uADDC\uD654\uD55C\uB2E4."
+  },
+  {
+    name: "customApprovers",
+    kind: "array",
+    label: "\uC9C0\uC815 \uACB0\uC7AC\uC790",
+    description: "type\uC774 custom\uC77C \uB54C\uB9CC \uC758\uBBF8\uAC00 \uC788\uB2E4. \uC2A4\uD399 \uB9AC\uD130\uB7F4\uC5D0\uB294 \uD55C \uBC88\uB3C4 \uB4F1\uC7A5\uD558\uC9C0 \uC54A\uC558\uACE0, \uD615\uD0DC\uC758 \uADFC\uAC70\uB294 \uC800\uC7A5 JSON \uACC4\uC57D\uC774\uB2E4.",
+    item: customApproverItem
+  }
+];
+var ApprovalLineEditorMeta = {
+  name: "ApprovalLineEditor",
+  label: "\uAE30\uBCF8 \uACB0\uC7AC\uC120 \uD3B8\uC9D1\uAE30",
+  category: "input",
+  icon: "route",
+  description: "\uACB0\uC7AC \uB2E8\uACC4\uB97C \uCD94\uAC00\xB7\uC0AD\uC81C\xB7\uC7AC\uC815\uB82C\uD558\uB294 controlled \uD3B8\uC9D1\uAE30. \uC800\uC7A5 JSON(approval_forms.default_steps)\uC758 \uD0A4\uB97C \uADF8\uB300\uB85C \uC4F4\uB2E4.",
+  props: [
+    {
+      name: "value",
+      kind: "array",
+      label: "\uACB0\uC7AC\uC120",
+      required: true,
+      bindable: true,
+      description: "\uC2A4\uD15D \uBC30\uC5F4. \uC2E4\uCE21 4/4\uAC00 \uC804\uBD80 $state \uBC14\uC778\uB529\uC774\uB2E4.",
+      group: "data",
+      item: approvalLineStepItem
+    },
+    {
+      name: "onChange",
+      kind: "action",
+      label: "\uACB0\uC7AC\uC120 \uBCC0\uACBD",
+      required: true,
+      eventArg: "order\uB97C 1..n\uC73C\uB85C \uC815\uADDC\uD654\uD55C \uC2A4\uD15D \uBC30\uC5F4",
+      group: "behavior"
+    },
+    // 실측 4/4 — 전부 setState + fromEvent
+    {
+      name: "options",
+      kind: "array",
+      label: "\uACB0\uC7AC\uC790 \uD6C4\uBCF4",
+      bindable: true,
+      description: "\uAC80\uC0C9 \uACBD\uB85C\uAC00 \uC5C6\uC744 \uB54C \uB85C\uCEEC \uAC80\uC0C9 \uB300\uC0C1.",
+      group: "data",
+      item: customApproverItem
+    },
+    // 실측 4/4 (원소 28개)
+    {
+      name: "searchEndpoint",
+      kind: "string",
+      label: "\uACB0\uC7AC\uC790 \uAC80\uC0C9 \uACBD\uB85C",
+      description: "GET {\uACBD\uB85C}?q=\u2026 \uB85C \uC9C1\uC6D0\xB7\uBD80\uC11C\uB97C \uD1B5\uD569 \uAC80\uC0C9\uD55C\uB2E4. \uC5C6\uC73C\uBA74 options\uB85C \uB85C\uCEEC \uAC80\uC0C9\uB9CC \uD55C\uB2E4.",
+      group: "data",
+      advanced: true
+    },
+    // 실측 0/4 — 구현에는 있다
+    {
+      name: "groupSearchEndpoint",
+      kind: "string",
+      label: "\uBD80\uC11C \uAC80\uC0C9 \uACBD\uB85C",
+      description: "\uC8FC\uBA74 searchEndpoint\uC640 \uBCD1\uB82C\uB85C \uC870\uD68C\uD574 \uACB0\uACFC\uB97C \uD569\uCE5C\uB2E4(v2\uC758 /employees + /departments \uBCD1\uB82C \uAC80\uC0C9\uACFC \uAC19\uC740 \uBAA8\uC591). \uC774 \uACBD\uB85C\uC758 \uC751\uB2F5\uC740 \uC804\uBD80 \uADF8\uB8F9\uC73C\uB85C \uCDE8\uAE09\uD55C\uB2E4.",
+      group: "data",
+      advanced: true
+    },
+    { name: "disabled", kind: "boolean", label: "\uBE44\uD65C\uC131", default: false, bindable: true, group: "behavior" }
+    // 실측 0/4
+  ],
+  children: { accepts: false },
+  dom: { element: "div" },
+  // 실측: 루트가 <div class="wp-col">
+  // 프리셋에 searchEndpoint를 넣지 않는다 — 소스가 `if (searchEndpoint)`로 감싸고 있어
+  // 미지정이면 fetch 경로 자체가 없다. default에 2스텝을 넣어 빈 상태가 아닌 모습을 보여 준다.
+  preset: {
+    component: "ApprovalLineEditor",
+    props: {
+      value: {
+        $state: "approvalLineForm.defaultSteps",
+        default: [
+          { id: "st1", name: "\uD300\uC7A5", type: "team_leader", order: 1 },
+          { id: "st2", name: "\uBCF8\uBD80\uC7A5", type: "division_head", order: 2 }
+        ]
+      },
+      onChange: { action: "setState", key: "approvalLineForm.defaultSteps", fromEvent: true },
+      options: [
+        { id: "u1", name: "\uAE40\uB3C4\uD604", type: "user" },
+        { id: "u2", name: "\uC774\uC11C\uC5F0", type: "user" },
+        { id: "g1", name: "\uC778\uC0AC\uD300", type: "group" }
+      ]
+    }
+  },
+  resize: { kind: "none" }
+};
+var ApprovalOverridesEditorMeta = {
+  name: "ApprovalOverridesEditor",
+  label: "\uACB0\uC7AC\uC120 \uC624\uBC84\uB77C\uC774\uB4DC \uD3B8\uC9D1\uAE30",
+  category: "input",
+  icon: "layers",
+  description: "\uC9C1\uCC45\xB7\uC9C1\uAE09\uBCC4\uB85C \uAE30\uBCF8 \uACB0\uC7AC\uC120 \uB300\uC2E0 \uC801\uC6A9\uD560 \uACB0\uC7AC\uB77C\uC778 \uBAA9\uB85D. \uC9C1\uCC45\uACFC \uC9C1\uAE09\uC740 OR\uC774\uACE0, \uC704\uC5D0\uC11C\uBD80\uD130 \uBA3C\uC800 \uB9DE\uB294 \uAC83\uC774 \uC6B0\uC120\uD55C\uB2E4.",
+  props: [
+    {
+      name: "value",
+      kind: "array",
+      label: "\uC624\uBC84\uB77C\uC774\uB4DC \uBAA9\uB85D",
+      required: true,
+      bindable: true,
+      description: "\uC2E4\uCE21 2/2\uAC00 \uC804\uBD80 $state \uBC14\uC778\uB529\uC774\uACE0 default\uAC00 \uBE48 \uBC30\uC5F4\uC774\uB2E4. \uC6D0\uC18C \uB9AC\uD130\uB7F4\uC740 \uC2A4\uD399\uC5D0 \uD55C \uAC74\uB3C4 \uC5C6\uC5B4 \uD615\uD0DC\uC758 \uADFC\uAC70\uB294 \uC800\uC7A5 JSON \uACC4\uC57D(approval_forms.line_overrides)\uC774\uB2E4.",
+      group: "data",
+      item: [
+        { name: "id", kind: "string", label: "\uC2DD\uBCC4\uC790", required: true },
+        { name: "name", kind: "string", label: "\uADDC\uCE59 \uC774\uB984", required: true },
+        { name: "jobTitles", kind: "array", label: "\uC801\uC6A9 \uC9C1\uCC45", item: [], itemKind: "string" },
+        { name: "grades", kind: "array", label: "\uC801\uC6A9 \uC9C1\uAE09", item: [], itemKind: "string" },
+        {
+          name: "entityTypes",
+          kind: "array",
+          label: "\uC801\uC6A9 \uC5C5\uBB34\uC720\uD615(\uB808\uAC70\uC2DC)",
+          description: '\uB808\uAC70\uC2DC \uC774\uAD00 \uD0A4 \u2014 UI\uAC00 \uD3B8\uC9D1\uD558\uC9C0 \uC54A\uACE0 spread\uB85C \uBCF4\uC874\uB9CC \uD55C\uB2E4. \uB2E4\uB9CC \uC801\uC6A9 \uC870\uAC74\uC774\uB77C, \uC9C1\uCC45\xB7\uC9C1\uAE09\uC774 \uBAA8\uB450 \uBE44\uC5C8\uC744 \uB54C \uC774 \uAC12\uC758 \uC720\uBB34\uB85C "\uC804 \uC9C1\uC6D0 \uC801\uC6A9"\uACFC "\uB9E4\uCE6D \uC548 \uB428"\uC774 \uAC08\uB9B0\uB2E4.',
+          item: [],
+          itemKind: "string",
+          advanced: true
+        },
+        { name: "steps", kind: "array", label: "\uACB0\uC7AC\uC120", item: approvalLineStepItem }
+      ]
+    },
+    {
+      name: "onChange",
+      kind: "action",
+      label: "\uC624\uBC84\uB77C\uC774\uB4DC \uBCC0\uACBD",
+      required: true,
+      eventArg: "\uBCC0\uACBD\uB41C \uC624\uBC84\uB77C\uC774\uB4DC \uBC30\uC5F4(\uC54C \uC218 \uC5C6\uB294 \uD0A4\uB294 \uADF8\uB300\uB85C \uBCF4\uC874\uB41C\uB2E4)",
+      group: "behavior"
+    },
+    // 실측 2/2
+    {
+      name: "jobTitleOptions",
+      kind: "array",
+      label: "\uC9C1\uCC45 \uD6C4\uBCF4",
+      required: true,
+      bindable: true,
+      description: "\uC9C1\uC6D0 \uB370\uC774\uD130\uC5D0\uC11C distinct\uB85C \uBF51\uC740 \uBB38\uC790\uC5F4 \uBAA9\uB85D.",
+      group: "data",
+      item: [],
+      itemKind: "string"
+    },
+    // 실측 2/2 (원소 10개)
+    {
+      name: "gradeOptions",
+      kind: "array",
+      label: "\uC9C1\uAE09 \uD6C4\uBCF4",
+      required: true,
+      bindable: true,
+      group: "data",
+      item: [],
+      itemKind: "string"
+    },
+    // 실측 2/2 (원소 15개)
+    {
+      name: "searchOptions",
+      kind: "array",
+      label: "\uACB0\uC7AC\uC790 \uD6C4\uBCF4",
+      bindable: true,
+      description: "\uC911\uCCA9\uB41C \uACB0\uC7AC\uC120 \uD3B8\uC9D1\uAE30\uB85C \uADF8\uB300\uB85C \uC804\uB2EC\uB41C\uB2E4. \uAC80\uC0C9 \uACBD\uB85C\uAC00 \uC5C6\uC744 \uB54C\uC758 \uB85C\uCEEC \uAC80\uC0C9 \uB300\uC0C1.",
+      group: "data",
+      item: customApproverItem
+    },
+    // 실측 2/2 (원소 15개)
+    {
+      name: "facetsEndpoint",
+      kind: "string",
+      label: "\uC9C1\uCC45\xB7\uC9C1\uAE09 \uC635\uC158 \uACBD\uB85C",
+      description: "\uC9C1\uC6D0 \uBAA9\uB85D \uACBD\uB85C(\uC608: /employees?limit=500). \uC751\uB2F5\uC758 job_title\xB7grade\uB97C distinct \uCD94\uCD9C\uD574 \uC815\uC801 \uC635\uC158 \uBAA9\uB85D\uC5D0 \uD569\uCE5C\uB2E4 \u2014 v2\uAC00 \uD3B8\uC9D1\uAE30\uC5D0\uC11C \uC9C1\uC811 \uD558\uB358 \uC870\uD68C\uB2E4.",
+      group: "data",
+      advanced: true
+    },
+    {
+      name: "searchEndpoint",
+      kind: "string",
+      label: "\uACB0\uC7AC\uC790 \uAC80\uC0C9 \uACBD\uB85C",
+      description: "\uC911\uCCA9\uB41C \uACB0\uC7AC\uC120 \uD3B8\uC9D1\uAE30\uB85C \uADF8\uB300\uB85C \uC804\uB2EC\uB41C\uB2E4.",
+      group: "data",
+      advanced: true
+    },
+    // 실측 0/2
+    {
+      name: "groupSearchEndpoint",
+      kind: "string",
+      label: "\uBD80\uC11C \uAC80\uC0C9 \uACBD\uB85C",
+      description: "\uC911\uCCA9\uB41C \uACB0\uC7AC\uC120 \uD3B8\uC9D1\uAE30\uB85C \uADF8\uB300\uB85C \uC804\uB2EC\uB41C\uB2E4 \u2014 searchEndpoint\uC640 \uBCD1\uB82C \uC870\uD68C.",
+      group: "data",
+      advanced: true
+    },
+    { name: "disabled", kind: "boolean", label: "\uBE44\uD65C\uC131", default: false, bindable: true, group: "behavior" }
+    // 실측 0/2
+  ],
+  children: { accepts: false },
+  dom: { element: "div" },
+  // 실측: 루트가 <div class="wp-col">
+  // searchEndpoint 금지는 ApprovalLineEditor와 같은 이유다 — 중첩 편집기로 그대로 내려간다.
+  preset: {
+    component: "ApprovalOverridesEditor",
+    props: {
+      value: { $state: "approvalLineForm.lineOverrides", default: [] },
+      onChange: { action: "setState", key: "approvalLineForm.lineOverrides", fromEvent: true },
+      jobTitleOptions: ["\uBCF8\uBD80\uC7A5", "\uD300\uC7A5", "\uD30C\uD2B8\uC7A5"],
+      gradeOptions: ["\uC0AC\uC6D0", "\uB300\uB9AC", "\uACFC\uC7A5", "\uBD80\uC7A5"],
+      searchOptions: [
+        { id: "u1", name: "\uAE40\uB3C4\uD604", type: "user" },
+        { id: "g1", name: "\uC778\uC0AC\uD300", type: "group" }
+      ]
+    }
+  },
+  resize: { kind: "none" }
+};
 var AutocompleteFieldMeta = {
   name: "AutocompleteField",
   label: "\uC790\uB3D9\uC644\uC131",
@@ -4833,6 +5083,8 @@ var StripMeta = {
   resize: { kind: "none" }
 };
 var widgetComponentMeta = {
+  ApprovalLineEditor: ApprovalLineEditorMeta,
+  ApprovalOverridesEditor: ApprovalOverridesEditorMeta,
   ApprovalStepper: ApprovalStepperMeta,
   RankBoard: RankBoardMeta,
   AutocompleteField: AutocompleteFieldMeta,
@@ -4892,4 +5144,4 @@ function paletteGroups(catalog = allComponentMeta) {
   })).filter((group) => group.items.length > 0);
 }
 
-export { ActionsMeta, AlertMeta, ApprovalStepperMeta, AutocompleteFieldMeta, AvatarMeta, BadgeMeta, BreadcrumbMeta, ButtonMeta, CanMeta, CardMeta, ChartMeta, CheckboxMeta, ColMeta, ColumnBoardMeta, DatePickerMeta, DateRangePickerMeta, DialogMeta, DiffViewMeta, DisclosureMeta, DividerMeta, EmptyStateMeta, EventCalendarMeta, FieldMeta, ForEachMeta, FormMeta, FragmentMeta, GridMeta, IconButtonMeta, IconMeta, ImageLightboxMeta, InlineEditMeta, InputMeta, JsonFieldMeta, KeyValueListMeta, LiveClockMeta, MapPreviewMeta, OrgChartMeta, PageHeadMeta, PaginationMeta, PeriodFilterMeta, PrintSheetMeta, ProgressBarMeta, RadioMeta, RankBoardMeta, RecordSheetMeta, RemoteSearchResultsMeta, RowMeta, SDUI_CATEGORIES, SELF_AXIS_PROPS, SearchResultsMeta, SearchableMultiPickerMeta, SectionMeta, SecureScreenMeta, SegmentedControlMeta, SelectMeta, ShowMeta, SidebarNavMeta, SortHandleMeta, SortableListMeta, SpacerMeta, SpinnerMeta, StackedMeterMeta, StatCardMeta, StripMeta, SummaryTableMeta, SwitchMeta, TableMeta, TabsMeta, TagMeta, TagMultiSelectMeta, TextMeta, TextareaMeta, TimePickerMeta, TimelineMeta, ToastMeta, TooltipMeta, TreePickerMeta, TreeViewMeta, allComponentMeta, builtinComponentMeta, coreComponentMeta, dsComponentMeta, getComponentMeta, paletteGroups, richComponentMeta, slotNamesOf, widgetComponentMeta, withSelfAxis, withSelfAxisAll };
+export { ActionsMeta, AlertMeta, ApprovalLineEditorMeta, ApprovalOverridesEditorMeta, ApprovalStepperMeta, AutocompleteFieldMeta, AvatarMeta, BadgeMeta, BreadcrumbMeta, ButtonMeta, CanMeta, CardMeta, ChartMeta, CheckboxMeta, ColMeta, ColumnBoardMeta, DatePickerMeta, DateRangePickerMeta, DialogMeta, DiffViewMeta, DisclosureMeta, DividerMeta, EmptyStateMeta, EventCalendarMeta, FieldMeta, ForEachMeta, FormMeta, FragmentMeta, GridMeta, IconButtonMeta, IconMeta, ImageLightboxMeta, InlineEditMeta, InputMeta, JsonFieldMeta, KeyValueListMeta, LiveClockMeta, MapPreviewMeta, OrgChartMeta, PageHeadMeta, PaginationMeta, PeriodFilterMeta, PrintSheetMeta, ProgressBarMeta, RadioMeta, RankBoardMeta, RecordSheetMeta, RemoteSearchResultsMeta, RowMeta, SDUI_CATEGORIES, SELF_AXIS_PROPS, SearchResultsMeta, SearchableMultiPickerMeta, SectionMeta, SecureScreenMeta, SegmentedControlMeta, SelectMeta, ShowMeta, SidebarNavMeta, SortHandleMeta, SortableListMeta, SpacerMeta, SpinnerMeta, StackedMeterMeta, StatCardMeta, StripMeta, SummaryTableMeta, SwitchMeta, TableMeta, TabsMeta, TagMeta, TagMultiSelectMeta, TextMeta, TextareaMeta, TimePickerMeta, TimelineMeta, ToastMeta, TooltipMeta, TreePickerMeta, TreeViewMeta, allComponentMeta, builtinComponentMeta, coreComponentMeta, dsComponentMeta, getComponentMeta, paletteGroups, richComponentMeta, slotNamesOf, widgetComponentMeta, withSelfAxis, withSelfAxisAll };