@wipco/sdui 0.1.0 → 0.3.0

package/dist/chunk-MOIU7MUA.js

@@ -0,0 +1,282 @@
+import { includesLooseSearch } from './chunk-KADFN76X.js';
+import { Icon, Button, Input, Spinner } from './chunk-ZUCI34QY.js';
+import { useId, useRef, useState, useEffect, useMemo } from 'react';
+import { jsxs, jsx } from 'react/jsx-runtime';
+
+function isRecord(value) {
+  return typeof value === "object" && value !== null && !Array.isArray(value);
+}
+function toAutocompleteOptions(payload) {
+  if (Array.isArray(payload)) return payload.filter(isRecord);
+  if (isRecord(payload)) {
+    for (const key of ["items", "data", "results", "rows"]) {
+      const inner = payload[key];
+      if (Array.isArray(inner)) return inner.filter(isRecord);
+    }
+  }
+  return [];
+}
+function pickText(option, key) {
+  if (!key) return "";
+  const raw = option[key];
+  if (raw === null || raw === void 0) return "";
+  return String(raw);
+}
+var ellipsisStyle = {
+  display: "block",
+  overflow: "hidden",
+  textOverflow: "ellipsis",
+  whiteSpace: "nowrap"
+};
+var statusRowStyle = {
+  padding: "var(--wp-space-2) var(--wp-space-3)"
+};
+function AutocompleteField({
+  search,
+  options,
+  labelKey = "label",
+  valueKey = "value",
+  subKey,
+  value,
+  selectedLabel,
+  onChange,
+  placeholder = "\uAC80\uC0C9\uC5B4 \uC785\uB825",
+  minChars = 1,
+  debounceMs = 300,
+  invalid = false,
+  disabled = false
+}) {
+  const listId = useId();
+  const hostRef = useRef(null);
+  const seqRef = useRef(0);
+  const optionsRef = useRef(options);
+  optionsRef.current = options;
+  const searchRef = useRef(search);
+  searchRef.current = search;
+  const hasSearch = search !== void 0;
+  const isControlled = value !== void 0;
+  const [internalValue, setInternalValue] = useState("");
+  const committed = (isControlled ? value : internalValue) ?? "";
+  const hasSelection = committed !== "";
+  const [picked, setPicked] = useState(null);
+  const [query, setQuery] = useState("");
+  const [open, setOpen] = useState(false);
+  const [status, setStatus] = useState("idle");
+  const [results, setResults] = useState([]);
+  const [activeIndex, setActiveIndex] = useState(0);
+  const [focusPending, setFocusPending] = useState(false);
+  useEffect(() => {
+    if (disabled || hasSelection) return;
+    const keyword = query.trim();
+    if (keyword.length < minChars) {
+      seqRef.current += 1;
+      setStatus("idle");
+      setResults([]);
+      setOpen(false);
+      return;
+    }
+    setStatus("loading");
+    setOpen(true);
+    const seq = ++seqRef.current;
+    const controller = new AbortController();
+    const timer = setTimeout(() => {
+      const run = searchRef.current;
+      if (run) {
+        run(keyword, controller.signal).then((payload) => {
+          if (seqRef.current !== seq) return;
+          const next = Array.isArray(payload) ? { options: payload } : payload;
+          setResults(Array.isArray(next.options) ? next.options : []);
+          setActiveIndex(0);
+          setStatus(next.status === "offline" ? "offline" : "ready");
+        }).catch(() => {
+          if (controller.signal.aborted || seqRef.current !== seq) return;
+          setResults([]);
+          setStatus("error");
+        });
+        return;
+      }
+      const filtered = (optionsRef.current ?? []).filter(
+        (option) => includesLooseSearch(`${pickText(option, labelKey)} ${pickText(option, subKey)}`, keyword)
+      );
+      if (seqRef.current !== seq) return;
+      setResults(filtered);
+      setActiveIndex(0);
+      setStatus("ready");
+    }, debounceMs);
+    return () => {
+      clearTimeout(timer);
+      controller.abort();
+    };
+  }, [query, hasSearch, labelKey, subKey, minChars, debounceMs, disabled, hasSelection]);
+  useEffect(() => {
+    if (!open) return;
+    const closeOnOutsideClick = (event) => {
+      if (event.target instanceof Node && hostRef.current?.contains(event.target)) return;
+      setOpen(false);
+    };
+    const closeOnEscape = (event) => {
+      if (event.key === "Escape") setOpen(false);
+    };
+    document.addEventListener("pointerdown", closeOnOutsideClick);
+    document.addEventListener("keydown", closeOnEscape);
+    return () => {
+      document.removeEventListener("pointerdown", closeOnOutsideClick);
+      document.removeEventListener("keydown", closeOnEscape);
+    };
+  }, [open]);
+  useEffect(() => {
+    if (!focusPending || hasSelection) return;
+    hostRef.current?.querySelector("input")?.focus();
+    setFocusPending(false);
+  }, [focusPending, hasSelection]);
+  const selectOption = (option) => {
+    const nextValue = pickText(option, valueKey);
+    setPicked(option);
+    if (!isControlled) setInternalValue(nextValue);
+    setQuery("");
+    setOpen(false);
+    setStatus("idle");
+    setResults([]);
+    onChange?.(nextValue, option);
+  };
+  const clearSelection = () => {
+    setPicked(null);
+    if (!isControlled) setInternalValue("");
+    setQuery("");
+    setStatus("idle");
+    setResults([]);
+    setFocusPending(true);
+    onChange?.(null);
+  };
+  const handleKeyDown = (event) => {
+    if (event.key === "ArrowDown" || event.key === "ArrowUp") {
+      event.preventDefault();
+      if (!open || results.length === 0) return;
+      setActiveIndex((index) => {
+        const delta = event.key === "ArrowDown" ? 1 : -1;
+        return (index + delta + results.length) % results.length;
+      });
+      return;
+    }
+    if (event.key === "Enter") {
+      if (!open) return;
+      event.preventDefault();
+      const active = status === "ready" ? results[activeIndex] : void 0;
+      if (active) selectOption(active);
+      return;
+    }
+    if (event.key === "Escape") setOpen(false);
+  };
+  const staticMatch = useMemo(() => {
+    if (!hasSelection) return null;
+    return (options ?? []).find((option) => pickText(option, valueKey) === committed) ?? null;
+  }, [options, valueKey, committed, hasSelection]);
+  const pickedMatches = picked !== null && pickText(picked, valueKey) === committed;
+  const cardOption = pickedMatches ? picked : staticMatch;
+  const cardLabel = (pickedMatches ? pickText(picked, labelKey) : "") || selectedLabel || (cardOption ? pickText(cardOption, labelKey) : "") || committed;
+  const cardSub = cardOption ? pickText(cardOption, subKey) : "";
+  if (hasSelection) {
+    return /* @__PURE__ */ jsxs(
+      "div",
+      {
+        ref: hostRef,
+        className: "wp-row wp-row--between",
+        style: {
+          border: `var(--wp-border-w) solid ${invalid ? "var(--wp-border-danger)" : "var(--wp-border-subtle)"}`,
+          borderRadius: "var(--wp-radius-control)",
+          background: "var(--wp-surface-card)",
+          padding: "var(--wp-space-2) var(--wp-space-3)"
+        },
+        children: [
+          /* @__PURE__ */ jsxs("div", { className: "wp-row", style: { minWidth: 0 }, children: [
+            /* @__PURE__ */ jsx(
+              Icon,
+              {
+                name: "circle-check",
+                size: 18,
+                title: "\uC120\uD0DD\uB428",
+                style: { color: "var(--wp-text-success)", flex: "none" }
+              }
+            ),
+            /* @__PURE__ */ jsxs("div", { style: { minWidth: 0 }, children: [
+              /* @__PURE__ */ jsx("div", { className: "wp-body", style: ellipsisStyle, children: cardLabel }),
+              cardSub ? /* @__PURE__ */ jsx("div", { className: "wp-caption", style: ellipsisStyle, children: cardSub }) : null
+            ] })
+          ] }),
+          /* @__PURE__ */ jsx(Button, { type: "button", variant: "ghost", size: "sm", disabled, onClick: clearSelection, children: "\uBCC0\uACBD" })
+        ]
+      }
+    );
+  }
+  const showActiveDescendant = open && status === "ready" && results.length > 0;
+  return /* @__PURE__ */ jsxs("div", { ref: hostRef, className: "erp-popover-host", children: [
+    /* @__PURE__ */ jsx(
+      Input,
+      {
+        role: "combobox",
+        "aria-expanded": open,
+        "aria-controls": listId,
+        "aria-autocomplete": "list",
+        "aria-activedescendant": showActiveDescendant ? `${listId}-opt-${activeIndex}` : void 0,
+        icon: "search",
+        invalid,
+        disabled,
+        placeholder,
+        value: query,
+        onChange: (event) => setQuery(event.target.value),
+        onFocus: () => {
+          if (query.trim().length >= minChars) setOpen(true);
+        },
+        onKeyDown: handleKeyDown
+      }
+    ),
+    open ? /* @__PURE__ */ jsx("div", { className: "erp-popover erp-popover--left", style: { width: "100%" }, children: /* @__PURE__ */ jsx(
+      "div",
+      {
+        id: listId,
+        role: "listbox",
+        className: "erp-popover__body",
+        style: { maxHeight: 280, padding: "var(--wp-space-1)" },
+        children: status === "loading" ? /* @__PURE__ */ jsx("div", { className: "wp-row", style: statusRowStyle, children: /* @__PURE__ */ jsx(Spinner, { size: "sm", label: "\uAC80\uC0C9 \uC911\u2026" }) }) : status === "offline" ? /* @__PURE__ */ jsxs("div", { className: "wp-row", style: statusRowStyle, children: [
+          /* @__PURE__ */ jsx(Icon, { name: "unplug", size: 16, style: { color: "var(--wp-text-muted)", flex: "none" } }),
+          /* @__PURE__ */ jsx("span", { className: "wp-caption", children: "\uBC31\uC5D4\uB4DC \uBBF8\uC5F0\uB3D9 \u2014 \uAC80\uC0C9 \uACB0\uACFC\uB97C \uBD88\uB7EC\uC62C \uC218 \uC5C6\uC2B5\uB2C8\uB2E4" })
+        ] }) : status === "error" ? /* @__PURE__ */ jsxs("div", { className: "wp-row", style: statusRowStyle, children: [
+          /* @__PURE__ */ jsx(Icon, { name: "circle-alert", size: 16, style: { color: "var(--wp-text-danger)", flex: "none" } }),
+          /* @__PURE__ */ jsx("span", { className: "wp-caption", children: "\uAC80\uC0C9 \uC2E4\uD328 \u2014 \uC7A0\uC2DC \uD6C4 \uB2E4\uC2DC \uC2DC\uB3C4\uD574 \uC8FC\uC138\uC694" })
+        ] }) : results.length === 0 ? /* @__PURE__ */ jsx("div", { className: "wp-caption", style: statusRowStyle, children: "\uACB0\uACFC \uC5C6\uC74C" }) : results.map((option, index) => {
+          const optionSub = pickText(option, subKey);
+          return /* @__PURE__ */ jsxs(
+            "button",
+            {
+              id: `${listId}-opt-${index}`,
+              type: "button",
+              role: "option",
+              "aria-selected": index === activeIndex,
+              onClick: () => selectOption(option),
+              onPointerEnter: () => setActiveIndex(index),
+              style: {
+                display: "block",
+                width: "100%",
+                textAlign: "left",
+                padding: "var(--wp-space-2) var(--wp-space-3)",
+                border: 0,
+                borderRadius: "var(--wp-radius-sm)",
+                background: index === activeIndex ? "var(--wp-surface-hover)" : "transparent",
+                color: "var(--wp-text-default)",
+                font: "inherit",
+                cursor: "pointer"
+              },
+              children: [
+                /* @__PURE__ */ jsx("span", { className: "wp-body-sm", style: ellipsisStyle, children: pickText(option, labelKey) || pickText(option, valueKey) }),
+                optionSub ? /* @__PURE__ */ jsx("span", { className: "wp-caption", style: ellipsisStyle, children: optionSub }) : null
+              ]
+            },
+            `${pickText(option, valueKey)}-${index}`
+          );
+        })
+      }
+    ) }) : null
+  ] });
+}
+
+export { AutocompleteField, toAutocompleteOptions };

package/dist/chunk-MSAV4J4I.js

@@ -0,0 +1,77 @@
+import { Disclosure } from './chunk-WNYWTFGW.js';
+import { Icon } from './chunk-ZUCI34QY.js';
+import { jsx, jsxs } from 'react/jsx-runtime';
+
+var TYPE_META = {
+  create: { icon: "plus", tone: "success" },
+  update: { icon: "pencil", tone: "info" },
+  delete: { icon: "trash-2", tone: "danger" },
+  info: { icon: "info", tone: "neutral" }
+};
+var TIMELINE_CSS = `
+.erp-timeline{list-style:none;margin:0;padding:0;display:flex;flex-direction:column;min-width:0}
+.erp-timeline__item{display:flex;gap:var(--wp-space-3);min-width:0}
+.erp-timeline__rail{display:flex;flex-direction:column;align-items:center;flex:none;width:28px}
+.erp-timeline__dot{display:inline-flex;align-items:center;justify-content:center;width:28px;height:28px;border-radius:50%;border:var(--wp-border-w) solid transparent;flex:none}
+.erp-timeline__dot--success{background:var(--wp-status-success-bg);border-color:var(--wp-status-success-border);color:var(--wp-status-success-fg)}
+.erp-timeline__dot--info{background:var(--wp-status-info-bg);border-color:var(--wp-status-info-border);color:var(--wp-status-info-fg)}
+.erp-timeline__dot--danger{background:var(--wp-status-danger-bg);border-color:var(--wp-status-danger-border);color:var(--wp-status-danger-fg)}
+.erp-timeline__dot--neutral{background:var(--wp-status-neutral-bg);border-color:var(--wp-status-neutral-border);color:var(--wp-status-neutral-fg)}
+.erp-timeline__line{flex:1 1 auto;width:2px;min-height:var(--wp-space-3);margin:var(--wp-space-1) 0;background:var(--wp-border-subtle);border-radius:var(--wp-radius-pill)}
+.erp-timeline__body{flex:1 1 auto;min-width:0;padding-bottom:var(--wp-space-5)}
+.erp-timeline__item:last-child .erp-timeline__body{padding-bottom:0}
+.erp-timeline__head{display:flex;align-items:center;gap:var(--wp-space-2);min-height:28px}
+.erp-timeline__title{flex:1 1 auto;min-width:0;font-size:var(--wp-size-sm);font-weight:var(--wp-weight-medium);color:var(--wp-text-strong);overflow-wrap:anywhere}
+.erp-timeline__time{flex:none;white-space:nowrap;font-variant-numeric:tabular-nums}
+.erp-timeline__desc{margin-top:var(--wp-space-1);font-size:var(--wp-size-sm);color:var(--wp-text-muted);overflow-wrap:anywhere}
+.erp-timeline__payload{margin-top:var(--wp-space-1)}
+.erp-timeline__pre{margin:0;padding:var(--wp-space-2) var(--wp-space-3);background:var(--wp-surface-sunken);border:var(--wp-border-w) solid var(--wp-border-subtle);border-radius:var(--wp-radius-sm);color:var(--wp-text-default);overflow-x:auto;white-space:pre}
+.erp-timeline__actions{display:flex;justify-content:flex-end;align-items:center;gap:var(--wp-space-2);margin-top:var(--wp-space-2)}
+`;
+function TimelineStyles() {
+  return /* @__PURE__ */ jsx("style", { href: "erp-timeline", precedence: "medium", children: TIMELINE_CSS });
+}
+function formatPayload(payload) {
+  try {
+    return JSON.stringify(payload, null, 2) ?? String(payload);
+  } catch {
+    return String(payload);
+  }
+}
+function Timeline({ items, maxHeight }) {
+  if (items.length === 0) {
+    return /* @__PURE__ */ jsx("p", { className: "wp-caption", style: { margin: 0, padding: "var(--wp-space-2) 0" }, children: "\uD45C\uC2DC\uD560 \uC774\uB825\uC774 \uC5C6\uC2B5\uB2C8\uB2E4." });
+  }
+  return /* @__PURE__ */ jsxs(
+    "ol",
+    {
+      className: "erp-timeline",
+      style: maxHeight !== void 0 ? { maxHeight, overflowY: "auto", paddingRight: "var(--wp-space-1)" } : void 0,
+      children: [
+        /* @__PURE__ */ jsx(TimelineStyles, {}),
+        items.map((item, index) => {
+          const meta = TYPE_META[item.type ?? "info"];
+          const isLast = index === items.length - 1;
+          const hasPayload = item.payload !== void 0 && item.payload !== null;
+          return /* @__PURE__ */ jsxs("li", { className: "erp-timeline__item", children: [
+            /* @__PURE__ */ jsxs("div", { className: "erp-timeline__rail", "aria-hidden": "true", children: [
+              /* @__PURE__ */ jsx("span", { className: `erp-timeline__dot erp-timeline__dot--${meta.tone}`, children: /* @__PURE__ */ jsx(Icon, { name: meta.icon, size: 16 }) }),
+              !isLast ? /* @__PURE__ */ jsx("span", { className: "erp-timeline__line" }) : null
+            ] }),
+            /* @__PURE__ */ jsxs("div", { className: "erp-timeline__body", children: [
+              /* @__PURE__ */ jsxs("div", { className: "erp-timeline__head", children: [
+                /* @__PURE__ */ jsx("div", { className: "erp-timeline__title", children: item.title }),
+                item.time !== void 0 && item.time !== "" ? /* @__PURE__ */ jsx("span", { className: "wp-caption erp-timeline__time", children: item.time }) : null
+              ] }),
+              item.description !== void 0 && item.description !== null ? /* @__PURE__ */ jsx("div", { className: "erp-timeline__desc", children: item.description }) : null,
+              hasPayload ? /* @__PURE__ */ jsx("div", { className: "erp-timeline__payload", children: /* @__PURE__ */ jsx(Disclosure, { summary: /* @__PURE__ */ jsx("span", { className: "wp-caption", children: "\uD398\uC774\uB85C\uB4DC" }), children: /* @__PURE__ */ jsx("pre", { className: "wp-mono-xs erp-timeline__pre", children: formatPayload(item.payload) }) }) }) : null,
+              item.actions !== void 0 && item.actions !== null ? /* @__PURE__ */ jsx("div", { className: "erp-timeline__actions", children: item.actions }) : null
+            ] })
+          ] }, item.id);
+        })
+      ]
+    }
+  );
+}
+
+export { Timeline };

package/dist/chunk-OOHHW4K4.js

@@ -0,0 +1,159 @@
+import { IconButton, Input } from './chunk-ZUCI34QY.js';
+import { useState, useRef, useEffect, useCallback } from 'react';
+import { jsxs, jsx } from 'react/jsx-runtime';
+
+var INLINE_EDIT_CSS = `
+.erp-inline-edit{display:inline-flex;align-items:center;gap:var(--wp-space-1);max-width:100%;min-width:0;vertical-align:middle}
+.erp-inline-edit__value{min-width:0;overflow:hidden;text-overflow:ellipsis;white-space:nowrap}
+.erp-inline-edit__pencil{opacity:0;transition:opacity var(--wp-duration-fast) var(--wp-ease-standard)}
+.erp-inline-edit:hover .erp-inline-edit__pencil,
+.erp-inline-edit:focus-within .erp-inline-edit__pencil{opacity:1}
+@media (hover:none){.erp-inline-edit__pencil{opacity:1}}
+.erp-inline-edit-editor{display:inline-flex;flex-direction:column;gap:var(--wp-space-half);max-width:100%;min-width:0;vertical-align:middle}
+.erp-inline-edit-editor__row{display:inline-flex;align-items:center;gap:var(--wp-space-1);min-width:0}
+.erp-inline-edit__spin svg{animation:erp-inline-edit-spin .8s linear infinite}
+@keyframes erp-inline-edit-spin{to{transform:rotate(360deg)}}
+`;
+function saveErrorMessage(err) {
+  const status = err?.status;
+  if (status === 503) return "\uBC31\uC5D4\uB4DC \uBBF8\uC5F0\uB3D9 \uC0C1\uD0DC\uB77C \uC800\uC7A5\uD560 \uC218 \uC5C6\uC2B5\uB2C8\uB2E4 (\uB370\uBAA8 \uBAA8\uB4DC)";
+  if (err instanceof Error && err.message) return err.message;
+  return "\uC800\uC7A5\uD558\uC9C0 \uBABB\uD588\uC2B5\uB2C8\uB2E4. \uB2E4\uC2DC \uC2DC\uB3C4\uD574 \uC8FC\uC138\uC694.";
+}
+function InlineEdit({
+  value,
+  onSave,
+  type = "text",
+  mono = false,
+  disabled = false,
+  emptyText = "\u2014"
+}) {
+  const [editing, setEditing] = useState(false);
+  const [draft, setDraft] = useState(value);
+  const [saving, setSaving] = useState(false);
+  const [saveError, setSaveError] = useState(null);
+  const viewHostRef = useRef(null);
+  const wasEditingRef = useRef(false);
+  useEffect(() => {
+    if (wasEditingRef.current && !editing) {
+      viewHostRef.current?.querySelector("button")?.focus();
+    }
+    wasEditingRef.current = editing;
+  }, [editing]);
+  const startEdit = useCallback(() => {
+    setDraft(value);
+    setSaveError(null);
+    setEditing(true);
+  }, [value]);
+  const cancelEdit = useCallback(() => {
+    if (saving) return;
+    setSaveError(null);
+    setEditing(false);
+  }, [saving]);
+  const confirmEdit = useCallback(async () => {
+    if (saving) return;
+    if (draft === value) {
+      setSaveError(null);
+      setEditing(false);
+      return;
+    }
+    setSaving(true);
+    setSaveError(null);
+    try {
+      await onSave(draft);
+      setEditing(false);
+    } catch (err) {
+      setSaveError(saveErrorMessage(err));
+    } finally {
+      setSaving(false);
+    }
+  }, [saving, draft, value, onSave]);
+  const handleKeyDown = useCallback(
+    (e) => {
+      if (saving) return;
+      if (e.key === "Enter") {
+        e.preventDefault();
+        void confirmEdit();
+      } else if (e.key === "Escape") {
+        e.preventDefault();
+        e.stopPropagation();
+        cancelEdit();
+      }
+    },
+    [saving, confirmEdit, cancelEdit]
+  );
+  const style = /* @__PURE__ */ jsx("style", { href: "erp-inline-edit", precedence: "default", children: INLINE_EDIT_CSS });
+  if (!editing) {
+    const isEmpty = value === "";
+    return /* @__PURE__ */ jsxs("span", { className: "erp-inline-edit", ref: viewHostRef, children: [
+      style,
+      /* @__PURE__ */ jsx(
+        "span",
+        {
+          className: "erp-inline-edit__value" + (mono ? " wp-mono" : ""),
+          style: isEmpty ? { color: "var(--wp-text-subtle)" } : void 0,
+          children: isEmpty ? emptyText : value
+        }
+      ),
+      /* @__PURE__ */ jsx(
+        IconButton,
+        {
+          className: "erp-inline-edit__pencil",
+          icon: "pencil",
+          label: disabled ? "\uC218\uC815\uD560 \uC218 \uC5C6\uC2B5\uB2C8\uB2E4" : "\uC218\uC815",
+          size: "xs",
+          variant: "ghost",
+          disabled,
+          onClick: startEdit
+        }
+      )
+    ] });
+  }
+  return /* @__PURE__ */ jsxs("span", { className: "erp-inline-edit-editor", children: [
+    style,
+    /* @__PURE__ */ jsxs("span", { className: "erp-inline-edit-editor__row", children: [
+      /* @__PURE__ */ jsx(
+        Input,
+        {
+          size: "sm",
+          type,
+          mono,
+          value: draft,
+          autoFocus: true,
+          disabled: saving,
+          invalid: saveError !== null,
+          "aria-label": "\uAC12 \uC218\uC815",
+          onFocus: (e) => e.currentTarget.select(),
+          onChange: (e) => setDraft(e.target.value),
+          onKeyDown: handleKeyDown
+        }
+      ),
+      /* @__PURE__ */ jsx(
+        IconButton,
+        {
+          className: saving ? "erp-inline-edit__spin" : "",
+          icon: saving ? "loader-circle" : "check",
+          label: saving ? "\uC800\uC7A5 \uC911\u2026" : "\uC800\uC7A5 (Enter)",
+          size: "xs",
+          variant: "ghost",
+          disabled: saving,
+          onClick: () => void confirmEdit()
+        }
+      ),
+      /* @__PURE__ */ jsx(
+        IconButton,
+        {
+          icon: "x",
+          label: "\uCDE8\uC18C (Esc)",
+          size: "xs",
+          variant: "ghost",
+          disabled: saving,
+          onClick: cancelEdit
+        }
+      )
+    ] }),
+    saveError !== null ? /* @__PURE__ */ jsx("span", { className: "wp-field__error", role: "alert", children: saveError }) : null
+  ] });
+}
+
+export { InlineEdit };