@feedmepos/mf-menu-portal 0.0.0-stage → 1.0.1-dev.1

package/dist/TreeEditorOpenner.vue_vue_type_script_setup_true_lang-BHxmPO7F.js

@@ -0,0 +1,1213 @@
+import { defineComponent as H, shallowRef as W, computed as x, watch as te, onBeforeUnmount as ne, openBlock as v, createElementBlock as S, createBlock as E, unref as e, toDisplayString as j, createVNode as y, resolveComponent as V, Fragment as Z, createCommentVNode as M, ref as P, withKeys as se, withModifiers as K, withCtx as z, createElementVNode as L, h as pe, onUnmounted as ve, mergeProps as fe, normalizeClass as X, renderList as oe, onMounted as ce, nextTick as ge, renderSlot as ye } from "vue";
+import { useI18n as Q } from "@feedmepos/mf-common";
+import { components as be, useSnackbar as _e, useDialog as ke } from "@feedmepos/ui-library";
+import { _ as we } from "./ProductImageEditorDialog.vue_vue_type_script_setup_true_lang-CUeYaXYg.js";
+import { u as he } from "./useActionFeedback-DoFeBFpl.js";
+import { e as ee, u as J, b as me, N as ie, f as Ce, a as xe } from "./provide-Tmjfji09.js";
+import { _ as $e, a as Ie } from "./ProductInlineCreateHost.vue_vue_type_script_setup_true_lang-CeYyZX7g.js";
+import { _ as ue } from "./ProductFilterMenu.vue_vue_type_script_setup_true_lang-Cgc0Ms_n.js";
+import { _ as de } from "./FormSection.vue_vue_type_script_setup_true_lang-pY-_msnM.js";
+import { _ as Fe } from "./TranslationLanguageSelector.vue_vue_type_script_setup_true_lang-BJZ6VcrT.js";
+import { _ as Se } from "./TranslationSideSheet.vue_vue_type_script_setup_true_lang-B0j2PNih.js";
+import { u as Te } from "./useEditorValidation-Ctef5Bxt.js";
+import { O as ze } from "./LinkProductSideSheet.vue_vue_type_script_setup_true_lang-D9jK-Fhn.js";
+import { _ as Ee } from "./CatalogLinkProductAction.vue_vue_type_script_setup_true_lang-BSMAIkQ2.js";
+const Re = { class: "h-full overflow-auto pl-[25px]" }, Be = {
+  key: 1,
+  class: "fm-typo-en-body-md-400 p-24 text-center text-fm-color-neutral-gray-400"
+}, Le = /* @__PURE__ */ H({
+  __name: "DetailPane",
+  props: {
+    selected: {}
+  },
+  setup(U, { expose: _ }) {
+    const t = U, o = ee(), { t: n } = Q(), p = W(null), f = W(null), s = W({ status: "loading" });
+    let w = null, $ = null;
+    const R = x(
+      () => s.value.status === "ready" ? s.value.value : null
+    );
+    function I() {
+      var a;
+      (a = p.value) == null || a.open("category");
+    }
+    function F() {
+      var m, h;
+      const a = (h = (m = t.selected) == null ? void 0 : m.selection) == null ? void 0 : h.itemId;
+      d(), a && k(a);
+    }
+    _({ openCategoryCreate: I, refreshSelected: F });
+    function d() {
+      var a;
+      w == null || w(), w = null, (a = f.value) == null || a.dispose(), f.value = null, s.value = { status: "loading" };
+    }
+    function g() {
+      d(), $ == null || $.dispose(), $ = null;
+    }
+    function k(a) {
+      $ ?? ($ = o.item.editorScope());
+      const m = o.item.editor(a);
+      f.value = m, s.value = m.get(), w = m.subscribe((h) => {
+        s.value = h;
+      });
+    }
+    function D(a) {
+      var h;
+      const m = ((h = R.value) == null ? void 0 : h.itemId) ?? null;
+      d(), $ == null || $.select(a), m && k(m);
+    }
+    return te(
+      () => t.selected,
+      (a) => {
+        var h;
+        if (a && !a.selectable) return;
+        const m = a == null ? void 0 : a.selection;
+        (m == null ? void 0 : m.itemId) !== ((h = R.value) == null ? void 0 : h.itemId) && (d(), m && k(m.itemId));
+      },
+      { immediate: !0 }
+    ), ne(g), (a, m) => {
+      var h, O, l;
+      return v(), S("div", Re, [
+        R.value && f.value ? (v(), E($e, {
+          key: 0,
+          sdk: e(o),
+          session: f.value,
+          view: R.value,
+          "tree-selection": (h = a.selected) == null ? void 0 : h.selection,
+          "item-breadcrumb": (O = a.selected) == null ? void 0 : O.itemBreadcrumb,
+          presentation: "tree",
+          onCreateEntity: m[0] || (m[0] = (i) => {
+            var T;
+            return (T = p.value) == null ? void 0 : T.open(i);
+          }),
+          onSelectScope: m[1] || (m[1] = (i) => D(i))
+        }, null, 8, ["sdk", "session", "view", "tree-selection", "item-breadcrumb"])) : (v(), S("p", Be, j(e(n)("menu.tree_editor.labels.please_select_a_product_to_edit")), 1)),
+        y(Ie, {
+          ref_key: "inlineCreate",
+          ref: p,
+          "item-id": ((l = R.value) == null ? void 0 : l.itemId) ?? null,
+          presentation: "tree",
+          sdk: e(o)
+        }, null, 8, ["item-id", "sdk"])
+      ]);
+    };
+  }
+}), De = /* @__PURE__ */ H({
+  __name: "EditorHistoryControls",
+  props: {
+    canUndo: { type: Boolean },
+    canRedo: { type: Boolean },
+    committing: { type: Boolean }
+  },
+  emits: ["undo", "redo"],
+  setup(U, { emit: _ }) {
+    const t = _, { t: o } = Q();
+    return (n, p) => {
+      const f = V("FmButton");
+      return v(), S(Z, null, [
+        y(f, {
+          "aria-label": e(o)("menu.tree_editor.actions.undo"),
+          disabled: !n.canUndo || n.committing,
+          icon: "undo",
+          variant: "tertiary",
+          onClick: p[0] || (p[0] = (s) => t("undo"))
+        }, null, 8, ["aria-label", "disabled"]),
+        y(f, {
+          "aria-label": e(o)("menu.tree_editor.actions.redo"),
+          disabled: !n.canRedo || n.committing,
+          icon: "redo",
+          variant: "tertiary",
+          onClick: p[1] || (p[1] = (s) => t("redo"))
+        }, null, 8, ["aria-label", "disabled"])
+      ], 64);
+    };
+  }
+}), Me = { class: "space-y-8" }, Ve = /* @__PURE__ */ H({
+  __name: "ScopeSwitcher",
+  setup(U) {
+    const _ = ee(), { t } = Q(), o = J(_.context.current), n = J(_.catalog.list), p = J(_.scheduler.list), f = J(_.tree.view), s = x(
+      () => o.value.status === "ready" ? o.value.value : { catalogId: null, schedulerId: null }
+    ), w = x(() => [
+      { label: t("menu.tree_editor.labels.main_catalog"), value: null },
+      ...n.value.status === "ready" ? n.value.value.rows.map((d) => ({
+        label: d.name,
+        value: d.id
+      })) : []
+    ]), $ = x(() => [
+      { label: t("menu.tree_editor.labels.all_time"), value: null },
+      ...p.value.status === "ready" ? p.value.value.rows.map((d) => ({
+        label: d.name,
+        value: d.id
+      })) : []
+    ]), R = x(() => {
+      const d = w.value.find(
+        (g) => g.value === s.value.catalogId
+      );
+      return t("menu.common.labels.a11y_labelled_name", {
+        label: t("menu.common.labels.catalog"),
+        name: (d == null ? void 0 : d.label) ?? t("menu.tree_editor.labels.main_catalog")
+      });
+    }), I = x(() => {
+      const d = $.value.find(
+        (g) => g.value === s.value.schedulerId
+      );
+      return t("menu.common.labels.a11y_labelled_name", {
+        label: t("menu.common.labels.scheduler"),
+        name: (d == null ? void 0 : d.label) ?? t("menu.tree_editor.labels.all_time")
+      });
+    }), F = x(
+      () => f.value.status === "ready" && f.value.value.schedulerScopeAvailable
+    );
+    return (d, g) => (v(), S("div", Me, [
+      y(ue, {
+        "model-value": s.value.catalogId,
+        options: w.value,
+        title: R.value,
+        "full-width": "",
+        "onUpdate:modelValue": g[0] || (g[0] = (k) => e(_).context.select({ catalogId: k }))
+      }, null, 8, ["model-value", "options", "title"]),
+      F.value ? (v(), E(ue, {
+        key: 0,
+        "model-value": s.value.schedulerId,
+        options: $.value,
+        title: I.value,
+        "full-width": "",
+        "onUpdate:modelValue": g[1] || (g[1] = (k) => e(_).context.select({ schedulerId: k }))
+      }, null, 8, ["model-value", "options", "title"])) : M("", !0)
+    ]));
+  }
+}), Ue = { key: 0 }, Ae = { class: "fm-typo-en-body-md-600 text-fm-color-neutral-gray-400" }, Oe = { class: "fm-typo-en-title-sm-600" }, Ne = { class: "max-h-[60vh] min-h-0 flex-1 overflow-y-auto" }, Pe = /* @__PURE__ */ H({
+  __name: "RestaurantAttributesFilter",
+  setup(U) {
+    const _ = ee(), { t } = Q(), o = J(_.tree.view), n = x(
+      () => o.value.status === "ready" ? o.value.value.restaurantFilter : null
+    ), p = P(!1), f = P({}), s = P({});
+    function w() {
+      var d;
+      (d = n.value) != null && d.available && (f.value = { ...n.value.selectedCustom }, s.value = { ...n.value.selectedStandard }, p.value = !0);
+    }
+    function $() {
+      _.tree.setRestaurantFilter({
+        custom: f.value,
+        standard: s.value
+      }), p.value = !1;
+    }
+    const R = x(
+      () => {
+        var d;
+        return (((d = n.value) == null ? void 0 : d.custom) ?? []).map((g) => ({ ...g, kind: "custom" }));
+      }
+    ), I = x(
+      () => {
+        var d;
+        return (((d = n.value) == null ? void 0 : d.standard) ?? []).map((g) => ({ ...g, kind: "standard" }));
+      }
+    ), F = [
+      {
+        header: () => t("portalshell.customAttributes.form.key"),
+        accessorKey: "key",
+        enableSorting: !1
+      },
+      {
+        header: () => t("portalshell.customAttributes.form.value"),
+        accessorKey: "values",
+        enableSorting: !1,
+        cell: (d) => {
+          const g = d.row.original, k = g.kind === "custom" ? f : s, D = t("menu.common.labels.a11y_labelled_name", {
+            label: t(
+              g.kind === "custom" ? "menu.link_product.rules.restaurant_custom_attributes_filter" : "menu.link_product.rules.restaurant_filter"
+            ),
+            name: g.key
+          }), a = (m) => {
+            var h;
+            m.el instanceof HTMLElement && ((h = m.el.querySelector("input")) == null || h.setAttribute("aria-label", D));
+          };
+          return pe(be.FmSelect, {
+            "aria-label": D,
+            modelValue: k.value[g.key] ?? null,
+            onVnodeMounted: a,
+            onVnodeUpdated: a,
+            placeholder: t("portalshell.customAttributes.form.valuePlaceholder"),
+            items: g.values.map((m) => ({ label: m, value: m })),
+            clearable: !0,
+            searchable: !0,
+            "onUpdate:modelValue": (m) => {
+              k.value = { ...k.value, [g.key]: m ?? "" };
+            }
+          });
+        }
+      }
+    ];
+    return (d, g) => {
+      var l;
+      const k = V("FmIcon"), D = V("FmChip"), a = V("FmTable"), m = V("FmSpacer"), h = V("FmButton"), O = V("FmDialog");
+      return (l = n.value) != null && l.available ? (v(), S("div", Ue, [
+        y(D, {
+          class: "w-full cursor-pointer justify-between",
+          role: "button",
+          tabindex: "0",
+          "aria-label": e(t)("menu.catalog.form.restaurant_attributes_title"),
+          onClick: w,
+          onKeydown: [
+            se(K(w, ["prevent"]), ["enter"]),
+            se(K(w, ["prevent"]), ["space"])
+          ]
+        }, {
+          default: z(() => [
+            L("span", Ae, j(e(t)("menu.catalog.form.restaurant_attributes_title")), 1),
+            y(k, {
+              color: "neutral-gray-400",
+              name: "launch",
+              size: "sm"
+            })
+          ]),
+          _: 1
+        }, 8, ["aria-label", "onKeydown"]),
+        y(O, {
+          modelValue: p.value,
+          "onUpdate:modelValue": g[1] || (g[1] = (i) => p.value = i),
+          overlay: !0,
+          "min-width": "min(calc(100% - 48px), 560px)"
+        }, {
+          "dialog-header": z(() => [
+            L("div", Oe, j(e(t)("menu.catalog.form.restaurant_attributes_title")), 1)
+          ]),
+          "dialog-footer": z(() => [
+            y(m),
+            y(h, {
+              label: e(t)("menu.common.actions.confirm"),
+              size: "lg",
+              type: "submit",
+              variant: "primary",
+              onClick: $
+            }, null, 8, ["label"]),
+            y(h, {
+              label: e(t)("menu.common.actions.cancel"),
+              size: "lg",
+              variant: "tertiary",
+              onClick: g[0] || (g[0] = (i) => p.value = !1)
+            }, null, 8, ["label"])
+          ]),
+          default: z(() => [
+            L("div", Ne, [
+              y(de, {
+                title: e(t)("menu.link_product.rules.restaurant_custom_attributes_filter")
+              }, {
+                default: z(() => [
+                  y(a, {
+                    "column-defs": F,
+                    "row-data": R.value,
+                    "shrink-at": !1,
+                    "page-size": R.value.length,
+                    "hide-footer": ""
+                  }, null, 8, ["row-data", "page-size"])
+                ]),
+                _: 1
+              }, 8, ["title"]),
+              y(de, {
+                title: e(t)("menu.link_product.rules.restaurant_filter")
+              }, {
+                default: z(() => [
+                  y(a, {
+                    "column-defs": F,
+                    "row-data": I.value,
+                    "shrink-at": !1,
+                    "page-size": I.value.length,
+                    "hide-footer": ""
+                  }, null, 8, ["row-data", "page-size"])
+                ]),
+                _: 1
+              }, 8, ["title"])
+            ])
+          ]),
+          _: 1
+        }, 8, ["modelValue"])
+      ])) : M("", !0);
+    };
+  }
+}), je = { class: "space-y-8" }, Ke = /* @__PURE__ */ H({
+  __name: "TreeFilter",
+  setup(U) {
+    const _ = ee(), { t } = Q(), o = P("");
+    let n;
+    return te(o, (p) => {
+      n && clearTimeout(n), n = setTimeout(() => _.tree.setQuery(p), 300);
+    }), ve(() => {
+      n && clearTimeout(n);
+    }), (p, f) => {
+      const s = V("FmSearch");
+      return v(), S("div", je, [
+        y(Ve),
+        y(Pe),
+        f[1] || (f[1] = L("div", { class: "h-[1px] bg-fm-color-neutral-gray-100" }, null, -1)),
+        y(s, {
+          modelValue: o.value,
+          "onUpdate:modelValue": f[0] || (f[0] = (w) => o.value = w),
+          placeholder: e(t)("menu.tree_editor.labels.search")
+        }, null, 8, ["modelValue", "placeholder"])
+      ]);
+    };
+  }
+}), He = { class: "fm-typo-en-title-sm-600" }, qe = /* @__PURE__ */ H({
+  __name: "CategoryRenameDialog",
+  props: {
+    categoryId: {}
+  },
+  emits: ["close"],
+  setup(U, { emit: _ }) {
+    const t = U, o = _, n = ee(), { t: p } = Q(), f = me(), s = W(null), w = W({
+      status: "loading"
+    }), $ = x(
+      () => w.value.status === "ready" ? w.value.value : null
+    ), R = Te(() => s.value), I = x(
+      () => $.value ? R.issue($.value.fieldIssues, "name") ?? $.value.nameIssue : null
+    );
+    let F = null;
+    const d = W(null), g = W(
+      null
+    ), k = x(
+      () => {
+        var C;
+        return ((C = g.value) == null ? void 0 : C.status) === "ready" ? g.value.value : null;
+      }
+    ), D = W(!1);
+    let a = null;
+    function m(C) {
+      var c;
+      a == null || a(), a = null, C && ((c = d.value) == null || c.dispose()), d.value = null, g.value = null, D.value = !1;
+    }
+    function h(C) {
+      var c, b;
+      m(!0), F == null || F(), F = null, C ? (c = s.value) == null || c.discard() : (b = s.value) == null || b.dispose(), s.value = null, w.value = { status: "loading" };
+    }
+    te(
+      () => t.categoryId,
+      (C) => {
+        if (s.value && h(!0), !C) return;
+        const c = n.category.editor(C);
+        s.value = c, w.value = c.get(), F = c.subscribe((b) => {
+          w.value = b;
+        });
+      },
+      { immediate: !0 }
+    ), ne(() => h(!0));
+    async function O() {
+      const C = s.value;
+      !C || (await R.submit(() => C.submit())).kind !== "success" || (h(!1), o("close"));
+    }
+    function l() {
+      h(!0), o("close");
+    }
+    function i() {
+      var b;
+      const C = s.value;
+      if (!C || ((b = $.value) == null ? void 0 : b.translation.state) !== "allowed") return;
+      m(!0);
+      const c = C.translationEditor();
+      d.value = c, g.value = c.get(), a = c.subscribe((Y) => {
+        g.value = Y;
+      }), D.value = !0;
+    }
+    function T(C) {
+      var Y;
+      const c = d.value, b = (Y = k.value) == null ? void 0 : Y.nameLocale;
+      if (!(!c || !b)) {
+        for (const q of Object.keys(b))
+          q in C || c.removeLocale(q);
+        for (const [q, u] of Object.entries(C))
+          q in b || c.addLocale(q), c.setNameLocale(q, u);
+      }
+    }
+    function N() {
+      const C = d.value;
+      C && C.apply().kind === "success" && m(!1);
+    }
+    return (C, c) => {
+      const b = V("FmButton"), Y = V("FmForm"), q = V("FmSpacer"), u = V("FmDialog");
+      return v(), S(Z, null, [
+        y(u, {
+          "model-value": C.categoryId !== null,
+          overlay: !0,
+          "min-width": "min(calc(100% - 48px), 480px)",
+          "onUpdate:modelValue": c[0] || (c[0] = (r) => !r && l())
+        }, {
+          "dialog-header": z(() => [
+            L("div", He, j(e(p)("menu.category.manager.dialog.update.title")), 1)
+          ]),
+          "dialog-footer": z(() => [
+            y(q),
+            y(b, {
+              label: e(p)("menu.common.actions.cancel"),
+              size: "md",
+              variant: "tertiary",
+              onClick: l
+            }, null, 8, ["label"]),
+            y(b, {
+              label: e(p)("menu.category.manager.dialog.update.action"),
+              size: "md",
+              variant: "primary"
+            }, null, 8, ["label"])
+          ]),
+          default: z(() => [
+            y(Y, { onValidationSuccess: O }, {
+              default: z(() => {
+                var r;
+                return [
+                  y(Fe, fe(
+                    {
+                      autofocus: "",
+                      "error-messages": I.value ? [e(f)(I.value)] : [],
+                      label: e(p)("menu.category.dialog.add.name.label"),
+                      placeholder: e(p)("menu.category.dialog.add.name.placeholder"),
+                      "model-value": ((r = $.value) == null ? void 0 : r.name) ?? ""
+                    },
+                    e(R).field("name", (B) => {
+                      var G;
+                      return (G = s.value) == null ? void 0 : G.setName(B);
+                    })
+                  ), {
+                    append: z(() => {
+                      var B;
+                      return [
+                        y(b, {
+                          "aria-label": e(p)("menu.common.translation.translation_label"),
+                          disabled: ((B = $.value) == null ? void 0 : B.translation.state) !== "allowed",
+                          icon: "g_translate",
+                          variant: "tertiary",
+                          onClick: i
+                        }, null, 8, ["aria-label", "disabled"])
+                      ];
+                    }),
+                    _: 1
+                  }, 16, ["error-messages", "label", "placeholder", "model-value"])
+                ];
+              }),
+              _: 1
+            })
+          ]),
+          _: 1
+        }, 8, ["model-value"]),
+        k.value ? (v(), E(Se, {
+          key: 0,
+          "model-value": D.value,
+          dirty: k.value.dirty,
+          name: k.value.name,
+          "name-locale": k.value.nameLocale,
+          "supported-locales": k.value.supportedLocales,
+          title: e(p)("menu.common.translation.sheet_title", {
+            entity: e(p)("menu.category.entity")
+          }),
+          "name-section-label": e(p)("menu.common.translation.name_section", {
+            entity: e(p)("menu.category.entity")
+          }),
+          "z-index": 200,
+          onDiscard: c[1] || (c[1] = (r) => m(!0)),
+          onSave: N,
+          "onUpdate:modelValue": c[2] || (c[2] = (r) => !r && m(!0)),
+          "onUpdate:name": c[3] || (c[3] = (r) => {
+            var B;
+            return (B = d.value) == null ? void 0 : B.setName(r);
+          }),
+          "onUpdate:nameLocale": T
+        }, null, 8, ["model-value", "dirty", "name", "name-locale", "supported-locales", "title", "name-section-label"])) : M("", !0)
+      ], 64);
+    };
+  }
+}), le = /* @__PURE__ */ H({
+  __name: "TextChip",
+  props: {
+    label: {},
+    variant: {},
+    border: { type: Boolean },
+    bold: { type: Boolean, default: !0 },
+    size: { default: "md" }
+  },
+  setup(U) {
+    const _ = U, t = {
+      neutral: "text-fm-color-typo-neutral bg-fm-color-neutral-gray-100",
+      primary: "text-fm-color-typo-primary bg-fm-color-system-primary-100",
+      secondary: "text-fm-color-typo-secondary bg-fm-color-system-secondary-100",
+      success: "text-fm-color-typo-success bg-fm-color-system-success-100",
+      warning: "text-fm-color-primary bg-fm-color-system-warning-100",
+      error: "text-fm-color-typo-error bg-fm-color-system-error-100",
+      info: "text-fm-color-typo-info bg-fm-color-system-info-100"
+    }, o = x(() => _.size === "xs" ? "text-[8px] tracking-wide leading-[10px] no-underline" : _.size === "sm" ? _.bold ? "fm-typo-en-body-sm-600" : "fm-typo-en-body-sm-400" : _.bold ? "fm-typo-en-body-md-600" : "fm-typo-en-body-md-400");
+    return (n, p) => (v(), S("span", {
+      class: X(["inline-block fm-corner-radius-md px-4 py-[2px] text-nowrap max-w-full", [
+        o.value,
+        t[n.variant],
+        n.border ? "border border-fm-color-neutral-gray-400" : ""
+      ]])
+    }, j(n.label), 3));
+  }
+}), We = ["aria-selected", "aria-expanded", "aria-label"], Qe = ["draggable", "data-node-id", "data-testid"], Ye = { class: "flex min-w-0 flex-1 items-center gap-4" }, Ge = { class: "flex min-w-0 items-center gap-4" }, Je = {
+  key: 2,
+  class: "w-24 shrink-0"
+}, Xe = { class: "flex shrink-0 items-center gap-4" }, Ze = { class: "tree-right-area relative flex shrink-0 items-center gap-4" }, et = { class: "absolute right-full flex items-center opacity-0 group-hover:static group-hover:opacity-100 focus-within:static focus-within:opacity-100" }, tt = {
+  key: 0,
+  role: "group"
+}, at = /* @__PURE__ */ H({
+  __name: "TreeRow",
+  props: {
+    node: {},
+    depth: {},
+    expanded: {},
+    selectedId: {},
+    draggingId: {},
+    currencySymbol: {}
+  },
+  emits: ["toggle", "select", "remove", "add-item", "rename", "catalog-link", "drag-start", "drag-end", "drop"],
+  setup(U, { emit: _ }) {
+    const t = U, o = _, { t: n, n: p } = Q(), f = x(() => t.expanded.has(t.node.id)), s = x(() => t.node.remove.state === "allowed"), w = x(() => t.node.kind === "item"), $ = x(() => t.node.addItem.state === "allowed"), R = x(() => {
+      var l;
+      return ((l = t.node.rename) == null ? void 0 : l.state) === "allowed";
+    }), I = x(
+      () => {
+        var l;
+        return ((l = t.node.linkToCatalog) == null ? void 0 : l.state) === "allowed";
+      }
+    ), F = x(
+      () => {
+        var l;
+        return ((l = t.node.unlinkFromCatalog) == null ? void 0 : l.state) === "allowed";
+      }
+    ), d = x(() => t.node.children.length > 0);
+    function g(l) {
+      o("catalog-link", { node: t.node, linked: l }), w.value && t.node.selectable && o("select", t.node);
+    }
+    const k = x(
+      () => t.node.labelMessage ? n(t.node.labelMessage.code) : t.node.label
+    ), D = x(() => {
+      const l = t.node.highlight.filter(Boolean);
+      if (!l.length) return [{ text: k.value, highlighted: !1 }];
+      const i = l.map((T) => T.replace(/[.*+?^${}()|[\]\\]/g, "\\$&")).join("|");
+      return k.value.split(new RegExp(`(${i})`, "gi")).map((T, N) => ({
+        text: T,
+        highlighted: N % 2 === 1
+      }));
+    }), a = x(() => k.value.trim()), m = x(
+      () => ["pl-12", "pl-32", "pl-[52px]", "pl-72", "pl-[92px]", "pl-112"][Math.min(t.depth, 5)]
+    ), h = x(() => t.node.kind === "category" || t.node.kind === "subCategory" ? "view_list" : t.node.kind === "group" ? "database" : t.node.kind === "variant" ? "lunch_dining" : "fastfood");
+    function O(l) {
+      const i = l.currentTarget.getBoundingClientRect(), T = (l.clientY - i.top) / i.height;
+      return T < 0.25 ? "before" : T > 0.75 ? "after" : d.value || t.node.kind !== "item" ? "inside" : "after";
+    }
+    return (l, i) => {
+      const T = V("FmIcon"), N = V("FmButton"), C = V("TreeRow", !0);
+      return v(), S("li", {
+        role: "treeitem",
+        "aria-selected": l.node.selectable ? l.selectedId === l.node.id : void 0,
+        "aria-expanded": d.value ? f.value : void 0,
+        "aria-label": a.value,
+        onClick: i[19] || (i[19] = K((c) => l.node.selectable && o("select", l.node), ["stop"]))
+      }, [
+        L("div", {
+          class: X(["tree-row group relative flex max-w-full select-none items-center gap-4 rounded min-h-[32px] py-4 pr-8 hover:bg-fm-color-opacity-sm", [
+            m.value,
+            l.node.selectable ? "cursor-pointer" : void 0,
+            l.selectedId === l.node.id ? "bg-fm-color-system-warning-100" : void 0
+          ]]),
+          draggable: l.node.draggable,
+          "data-node-id": l.node.id,
+          "data-testid": `tree-row-${l.node.id}`,
+          onDragstart: i[6] || (i[6] = (c) => o("drag-start", l.node)),
+          onDragend: i[7] || (i[7] = (c) => o("drag-end")),
+          onDragover: i[8] || (i[8] = K(() => {
+          }, ["prevent"])),
+          onDrop: i[9] || (i[9] = K((c) => o("drop", { node: l.node, position: O(c) }), ["prevent"]))
+        }, [
+          L("div", Ye, [
+            L("div", Ge, [
+              l.node.draggable ? (v(), E(T, {
+                key: 0,
+                class: "invisible absolute left-0 shrink-0 text-fm-color-neutral-gray-400 group-hover:visible",
+                name: "drag_indicator",
+                outline: "",
+                size: "sm"
+              })) : M("", !0),
+              d.value ? (v(), E(N, {
+                key: 1,
+                class: "shrink-0 !h-24 !w-24 !p-4",
+                label: a.value,
+                "aria-label": e(n)("menu.common.labels.a11y_labelled_name", {
+                  label: f.value ? e(n)("menu.tree_editor.actions.collapse_row") : e(n)("menu.tree_editor.actions.expand_row"),
+                  name: a.value
+                }),
+                size: "md",
+                variant: "tertiary",
+                onClick: i[0] || (i[0] = K((c) => o("toggle", l.node.id), ["stop"]))
+              }, {
+                default: z(() => [
+                  y(T, {
+                    name: f.value ? "expand_more" : "chevron_right",
+                    color: "neutral-gray-400",
+                    outline: "",
+                    size: "sm"
+                  }, null, 8, ["name"])
+                ]),
+                _: 1
+              }, 8, ["label", "aria-label"])) : (v(), S("span", Je)),
+              y(T, {
+                name: h.value,
+                class: "shrink-0 text-fm-color-neutral-gray-400",
+                outline: "",
+                size: "sm"
+              }, null, 8, ["name"]),
+              L("span", {
+                class: X([
+                  "fm-typo-en-body-md-400 min-w-0 flex-1 truncate",
+                  l.selectedId === l.node.id ? "text-fm-color-primary" : void 0
+                ])
+              }, [
+                (v(!0), S(Z, null, oe(D.value, (c, b) => (v(), S("span", {
+                  key: b,
+                  class: X(
+                    c.highlighted ? "bg-fm-color-system-warning-100" : void 0
+                  )
+                }, j(c.text), 3))), 128))
+              ], 2)
+            ]),
+            L("div", Xe, [
+              l.node.kind === "category" && l.node.itemCount > 0 ? (v(), E(le, {
+                key: 0,
+                label: e(n)("menu.tree_editor.labels.products", { count: l.node.itemCount }),
+                class: "shrink-0",
+                size: "xs",
+                variant: "neutral"
+              }, null, 8, ["label"])) : M("", !0),
+              w.value && l.node.groupCount > 0 ? (v(), E(le, {
+                key: 1,
+                label: e(n)("menu.tree_editor.labels.groups", { count: l.node.groupCount }),
+                class: "shrink-0",
+                size: "xs",
+                variant: "neutral"
+              }, null, 8, ["label"])) : M("", !0),
+              w.value && l.node.variantCount > 0 ? (v(), E(le, {
+                key: 2,
+                label: e(n)("menu.tree_editor.labels.variants", {
+                  count: l.node.variantCount
+                }),
+                class: "shrink-0",
+                size: "xs",
+                variant: "neutral"
+              }, null, 8, ["label"])) : M("", !0),
+              l.node.orderFrom ? (v(), E(le, {
+                key: 3,
+                label: e(n)(e(ze)[l.node.orderFrom]),
+                border: "",
+                class: "shrink-0",
+                size: "xs",
+                variant: "neutral"
+              }, null, 8, ["label"])) : M("", !0)
+            ])
+          ]),
+          L("div", Ze, [
+            L("div", et, [
+              $.value ? (v(), E(N, {
+                key: 0,
+                "aria-label": e(n)("menu.common.labels.a11y_labelled_name", {
+                  label: e(n)("menu.tree_editor.actions.add_product"),
+                  name: a.value
+                }),
+                class: "shrink-0 !h-24 !w-24 !p-4 opacity-0 focus-visible:opacity-100 group-hover:opacity-100",
+                label: a.value,
+                size: "md",
+                variant: "tertiary",
+                onClick: i[1] || (i[1] = K((c) => o("add-item", l.node), ["stop"]))
+              }, {
+                default: z(() => [
+                  y(T, {
+                    name: "add",
+                    color: "neutral-gray-400",
+                    outline: "",
+                    size: "sm"
+                  })
+                ]),
+                _: 1
+              }, 8, ["aria-label", "label"])) : M("", !0),
+              R.value ? (v(), E(N, {
+                key: 1,
+                "aria-label": e(n)("menu.common.labels.a11y_labelled_name", {
+                  label: e(n)("menu.tree_editor.actions.edit_category"),
+                  name: a.value
+                }),
+                class: "shrink-0 !h-24 !w-24 !p-4 opacity-0 focus-visible:opacity-100 group-hover:opacity-100",
+                label: a.value,
+                size: "md",
+                variant: "tertiary",
+                onClick: i[2] || (i[2] = K((c) => o("rename", l.node), ["stop"]))
+              }, {
+                default: z(() => [
+                  y(T, {
+                    name: "edit",
+                    color: "neutral-gray-400",
+                    outline: "",
+                    size: "sm"
+                  })
+                ]),
+                _: 1
+              }, 8, ["aria-label", "label"])) : M("", !0),
+              s.value ? (v(), E(N, {
+                key: 2,
+                "aria-label": e(n)("menu.common.labels.a11y_labelled_name", {
+                  label: w.value ? e(n)("menu.tree_editor.actions.delete_product") : e(n)("menu.tree_editor.actions.delete_category"),
+                  name: a.value
+                }),
+                class: "shrink-0 !h-24 !w-24 !p-4 opacity-0 focus-visible:opacity-100 group-hover:opacity-100",
+                label: a.value,
+                size: "md",
+                variant: "tertiary",
+                onClick: i[3] || (i[3] = K((c) => o("remove", l.node), ["stop"]))
+              }, {
+                default: z(() => [
+                  y(T, {
+                    name: "delete",
+                    color: "neutral-gray-400",
+                    outline: "",
+                    size: "sm"
+                  })
+                ]),
+                _: 1
+              }, 8, ["aria-label", "label"])) : M("", !0),
+              I.value ? (v(), E(N, {
+                key: 3,
+                "aria-label": e(n)("menu.common.labels.a11y_labelled_name", {
+                  label: w.value ? e(n)("menu.tree_editor.actions.link_product_to_catalog") : e(n)("menu.tree_editor.actions.link_category_to_catalog"),
+                  name: a.value
+                }),
+                class: "shrink-0 !h-24 !w-24 !p-4 opacity-0 focus-visible:opacity-100 group-hover:opacity-100",
+                label: a.value,
+                size: "md",
+                variant: "tertiary",
+                onClick: i[4] || (i[4] = K((c) => g(!0), ["stop"]))
+              }, {
+                default: z(() => [
+                  y(T, {
+                    name: "add_link",
+                    color: "neutral-gray-400",
+                    outline: "",
+                    size: "sm"
+                  })
+                ]),
+                _: 1
+              }, 8, ["aria-label", "label"])) : M("", !0),
+              F.value ? (v(), E(N, {
+                key: 4,
+                "aria-label": e(n)("menu.common.labels.a11y_labelled_name", {
+                  label: e(n)(
+                    "menu.tree_editor.actions.unlink_product_from_catalog"
+                  ),
+                  name: a.value
+                }),
+                class: "shrink-0 !h-24 !w-24 !p-4 opacity-0 focus-visible:opacity-100 group-hover:opacity-100",
+                label: a.value,
+                size: "md",
+                variant: "tertiary",
+                onClick: i[5] || (i[5] = K((c) => g(!1), ["stop"]))
+              }, {
+                default: z(() => [
+                  y(T, {
+                    name: "link_off",
+                    color: "neutral-gray-400",
+                    outline: "",
+                    size: "sm"
+                  })
+                ]),
+                _: 1
+              }, 8, ["aria-label", "label"])) : M("", !0)
+            ]),
+            l.node.price ? (v(), S("span", {
+              key: 0,
+              class: X([
+                "fm-typo-en-body-md-400 shrink-0",
+                l.node.priceTone === "primary" ? "text-fm-color-primary" : "text-fm-color-typo-secondary"
+              ])
+            }, j(l.currencySymbol) + j(e(p)(l.node.price.amount, {
+              minimumFractionDigits: l.node.price.precision,
+              maximumFractionDigits: l.node.price.precision
+            })), 3)) : M("", !0)
+          ])
+        ], 42, Qe),
+        f.value && d.value ? (v(), S("ul", tt, [
+          (v(!0), S(Z, null, oe(l.node.children, (c) => (v(), E(C, {
+            key: c.id,
+            depth: l.depth + 1,
+            "dragging-id": l.draggingId,
+            expanded: l.expanded,
+            "currency-symbol": l.currencySymbol,
+            node: c,
+            "selected-id": l.selectedId,
+            onAddItem: i[10] || (i[10] = (b) => o("add-item", b)),
+            onRename: i[11] || (i[11] = (b) => o("rename", b)),
+            onCatalogLink: i[12] || (i[12] = (b) => o("catalog-link", b)),
+            onRemove: i[13] || (i[13] = (b) => o("remove", b)),
+            onDragEnd: i[14] || (i[14] = (b) => o("drag-end")),
+            onDragStart: i[15] || (i[15] = (b) => o("drag-start", b)),
+            onDrop: i[16] || (i[16] = (b) => o("drop", b)),
+            onSelect: i[17] || (i[17] = (b) => o("select", b)),
+            onToggle: i[18] || (i[18] = (b) => o("toggle", b))
+          }, null, 8, ["depth", "dragging-id", "expanded", "currency-symbol", "node", "selected-id"]))), 128))
+        ])) : M("", !0)
+      ], 8, We);
+    };
+  }
+}), lt = { class: "relative flex h-full min-h-0 flex-col gap-4 p-8" }, nt = { class: "mt-12 flex items-center justify-between gap-4" }, ot = { class: "fm-typo-en-body-md-400 flex items-center" }, rt = { class: "ml-auto flex items-center" }, st = {
+  key: 1,
+  class: "fm-typo-en-body-md-400 p-16 text-fm-color-neutral-gray-400",
+  role: "alert"
+}, it = {
+  key: 2,
+  class: "fm-typo-en-body-md-400 p-16 text-fm-color-neutral-gray-400",
+  role: "status"
+}, ut = {
+  key: 3,
+  class: "fm-typo-en-body-md-400 p-16 text-fm-color-neutral-gray-400"
+}, dt = ["aria-label"], ct = {
+  key: 0,
+  class: "tree-overlay absolute inset-0 flex items-center justify-center bg-white/50"
+}, mt = /* @__PURE__ */ H({
+  __name: "TreePanel",
+  emits: ["select", "create-category"],
+  setup(U, { emit: _ }) {
+    const t = ee(), { t: o } = Q(), n = _e(), p = me(), f = _, s = J(t.tree.view), w = J(t.category.list), $ = x(
+      () => s.value.status === "ready" ? s.value.value : null
+    ), R = x(
+      () => w.value.status === "ready" && w.value.value.create.state === "allowed"
+    ), I = P(/* @__PURE__ */ new Set()), F = P(null), d = P(null), g = P(null), k = P(null), D = P(!1);
+    let a = null, m = null;
+    function h() {
+      const u = k.value;
+      D.value = !!u && u.scrollHeight > u.clientHeight + 1;
+    }
+    function O() {
+      var r;
+      const u = ((r = k.value) == null ? void 0 : r.querySelector('ul[role="tree"]')) ?? null;
+      u !== m && (m && (a == null || a.unobserve(m)), u && (a == null || a.observe(u)), m = u), h();
+    }
+    ce(() => {
+      a = new ResizeObserver(O), k.value && a.observe(k.value), O();
+    }), ne(() => a == null ? void 0 : a.disconnect()), te([$, I], async () => {
+      await ge(), O();
+    }), te(
+      () => {
+        var u;
+        return (u = $.value) == null ? void 0 : u.autoExpandIds;
+      },
+      (u) => {
+        if (!(u != null && u.length)) return;
+        const r = new Set(I.value);
+        for (const B of u) r.add(B);
+        I.value = r;
+      },
+      // The first published view can already carry a query's matches, so this has
+      // to run on mount rather than only on the next change.
+      { immediate: !0 }
+    );
+    function l(u) {
+      const r = new Set(I.value);
+      r.has(u) ? r.delete(u) : r.add(u), I.value = r;
+    }
+    function i() {
+      var u;
+      I.value = new Set(((u = $.value) == null ? void 0 : u.expandableIds) ?? []);
+    }
+    function T() {
+      I.value = /* @__PURE__ */ new Set();
+    }
+    function N(u) {
+      u.selectable && (F.value = u.id, f("select", u));
+    }
+    function C(u) {
+      const r = u.kind === "rejected" ? p(u.issues[0]) : u.kind === "failure" ? p(u.error.message) : null;
+      r !== null && n.open({
+        type: "error",
+        title: o("menu.tree_editor.feedback.update_failed"),
+        message: r
+      });
+    }
+    async function c(u) {
+      if (!u.entityId) return;
+      const r = u.kind === "item" ? await t.item.remove(u.entityId) : await t.category.remove(u.entityId);
+      C(r);
+    }
+    async function b(u) {
+      C(
+        await t.tree.setCatalogLink(u.node.id, u.linked)
+      );
+    }
+    async function Y(u) {
+      if (!u.entityId) return;
+      const r = t.item.editor(void 0, { loadInventoryCatalogue: !1 });
+      try {
+        r.setName(ie), r.setCategory(u.entityId);
+        const B = await r.submit();
+        if (B.kind === "success") {
+          const G = new Set(I.value);
+          G.add(u.id), I.value = G, n.open({
+            type: "success",
+            title: o("menu.tree_editor.feedback.product_created", {
+              name: ie
+            })
+          });
+          return;
+        }
+        C(B);
+      } finally {
+        r.dispose();
+      }
+    }
+    async function q(u) {
+      const r = d.value;
+      if (d.value = null, !r || r === u.node.id) return;
+      const B = await t.tree.rearrange({
+        draggedNodeId: r,
+        targetNodeId: u.node.id,
+        position: u.position
+      });
+      B.kind === "rejected" ? n.open({ message: o(B.issues[0].code), type: "warning" }) : C(B);
+    }
+    return (u, r) => {
+      const B = V("FmButton"), G = V("FmIcon"), re = V("FmCircularProgress");
+      return v(), S("div", lt, [
+        y(Ke),
+        L("div", nt, [
+          R.value ? (v(), E(B, {
+            key: 0,
+            label: e(o)("menu.tree_editor.actions.add_category"),
+            "prepend-icon": "add",
+            class: "!h-32 shrink-0 !gap-4 !px-8 !py-4",
+            "text-color": "primary",
+            variant: "plain",
+            onClick: r[0] || (r[0] = (ae) => f("create-category"))
+          }, {
+            default: z(() => [
+              L("span", ot, j(e(o)("menu.tree_editor.actions.add_category")), 1)
+            ]),
+            _: 1
+          }, 8, ["label"])) : (v(), E(Ee, {
+            key: 1,
+            sdk: e(t),
+            presentation: "tree"
+          }, null, 8, ["sdk"])),
+          L("div", rt, [
+            y(B, {
+              "aria-label": e(o)("menu.tree_editor.actions.expand_all"),
+              label: e(o)("menu.tree_editor.actions.expand_all"),
+              class: "shrink-0 !h-24 !w-24 !p-4",
+              variant: "tertiary",
+              onClick: i
+            }, {
+              default: z(() => [
+                y(G, {
+                  name: "expand_all",
+                  color: "neutral-gray-400",
+                  outline: "",
+                  size: "sm"
+                })
+              ]),
+              _: 1
+            }, 8, ["aria-label", "label"]),
+            y(B, {
+              "aria-label": e(o)("menu.tree_editor.actions.collapse_all"),
+              label: e(o)("menu.tree_editor.actions.collapse_all"),
+              class: "shrink-0 !h-24 !w-24 !p-4",
+              variant: "tertiary",
+              onClick: T
+            }, {
+              default: z(() => [
+                y(G, {
+                  name: "collapse_all",
+                  color: "neutral-gray-400",
+                  outline: "",
+                  size: "sm"
+                })
+              ]),
+              _: 1
+            }, 8, ["aria-label", "label"])
+          ])
+        ]),
+        L("div", {
+          ref_key: "scrollElement",
+          ref: k,
+          class: X(["menu-tree-scroll min-h-0 flex-1 overflow-auto", D.value ? "pr-[14px]" : void 0])
+        }, [
+          e(s).status === "loading" ? (v(), E(re, {
+            key: 0,
+            size: "lg"
+          })) : e(s).status === "error" ? (v(), S("p", st, j(e(p)(e(s).error.message)), 1)) : e(s).status === "unavailable" ? (v(), S("p", it, j(e(p)(e(s).reason)), 1)) : e(s).status === "ready" && e(s).value.nodes.length === 0 ? (v(), S("p", ut, j(e(o)("menu.tree_editor.labels.no_items")), 1)) : e(s).status === "ready" ? (v(), S("ul", {
+            key: 4,
+            "aria-label": e(o)("menu.tree_editor.labels.tree"),
+            role: "tree"
+          }, [
+            (v(!0), S(Z, null, oe(e(s).value.nodes, (ae) => (v(), E(at, {
+              key: ae.id,
+              depth: 0,
+              "dragging-id": d.value,
+              expanded: I.value,
+              node: ae,
+              "currency-symbol": e(s).value.currencySymbol,
+              "selected-id": F.value,
+              onAddItem: r[1] || (r[1] = (A) => Y(A)),
+              onRename: r[2] || (r[2] = (A) => g.value = A.entityId),
+              onCatalogLink: r[3] || (r[3] = (A) => b(A)),
+              onRemove: r[4] || (r[4] = (A) => c(A)),
+              onDragEnd: r[5] || (r[5] = (A) => d.value = null),
+              onDragStart: r[6] || (r[6] = (A) => d.value = A.id),
+              onDrop: r[7] || (r[7] = (A) => q(A)),
+              onSelect: r[8] || (r[8] = (A) => N(A)),
+              onToggle: r[9] || (r[9] = (A) => l(A))
+            }, null, 8, ["dragging-id", "expanded", "node", "currency-symbol", "selected-id"]))), 128))
+          ], 8, dt)) : M("", !0)
+        ], 2),
+        e(s).status === "ready" && e(s).stale ? (v(), S("div", ct, [
+          y(re, { size: "lg" })
+        ])) : M("", !0),
+        y(qe, {
+          "category-id": g.value,
+          onClose: r[10] || (r[10] = (ae) => g.value = null)
+        }, null, 8, ["category-id"])
+      ]);
+    };
+  }
+}), pt = { class: "-mx-24 flex min-h-0 flex-1" }, vt = ["aria-label"], ft = ["aria-label"], gt = /* @__PURE__ */ H({
+  __name: "MenuManagementEditor",
+  props: {
+    draft: {}
+  },
+  emits: ["close"],
+  setup(U, { emit: _ }) {
+    const t = U, o = _, { t: n } = Q(), { run: p } = he(), f = P(null), s = P(null);
+    function w() {
+      var a;
+      (a = s.value) == null || a.openCategoryCreate();
+    }
+    function $() {
+      var a;
+      t.draft.undo(), (a = s.value) == null || a.refreshSelected();
+    }
+    function R() {
+      var a;
+      t.draft.redo(), (a = s.value) == null || a.refreshSelected();
+    }
+    Ce(t.draft);
+    const I = J(t.draft.state), F = x(
+      () => I.value.status === "ready" ? I.value.value : {
+        dirty: !1,
+        canUndo: !1,
+        canRedo: !1,
+        committing: !1,
+        invalidated: !0
+      }
+    ), d = ke();
+    async function g() {
+      (await p(() => t.draft.commit(), {
+        loadingTitle: n("menu.tree_editor.feedback.saving"),
+        successMessage: n("menu.tree_editor.feedback.saved")
+      })).kind === "success" && o("close");
+    }
+    async function k() {
+      (await p(() => t.draft.discard(), {
+        showLoading: !1
+      })).kind === "success" && o("close");
+    }
+    function D() {
+      if (!F.value.dirty) return void k();
+      d.open({
+        title: n("menu.tree_editor.actions.confirm_discard_title"),
+        message: n("menu.tree_editor.actions.confirm_discard_message"),
+        primaryActions: {
+          text: n("menu.tree_editor.actions.discard"),
+          variant: "primary",
+          close: !0
+        },
+        secondaryActions: {
+          text: n("menu.tree_editor.actions.keep_editing"),
+          variant: "tertiary",
+          close: !0
+        }
+      }).onPrimary(() => void k());
+    }
+    return (a, m) => (v(), E(we, {
+      "primary-action": {
+        label: e(n)("menu.tree_editor.actions.save"),
+        disabled: F.value.committing
+      },
+      "secondary-actions": [
+        { label: e(n)("menu.tree_editor.actions.cancel"), click: D }
+      ],
+      show: !0,
+      title: e(n)("menu.tree_editor.title"),
+      onOnCancel: D,
+      onOnPrimary: g
+    }, {
+      "append-title": z(() => [
+        y(De, {
+          "can-redo": F.value.canRedo,
+          "can-undo": F.value.canUndo,
+          committing: F.value.committing,
+          onRedo: R,
+          onUndo: $
+        }, null, 8, ["can-redo", "can-undo", "committing"])
+      ]),
+      default: z(() => [
+        L("div", pt, [
+          L("aside", {
+            "aria-label": e(n)("menu.tree_editor.labels.tree"),
+            class: "w-[300px] shrink-0 overflow-hidden border-r bg-fm-color-neutral-white pl-24"
+          }, [
+            y(mt, {
+              onCreateCategory: w,
+              onSelect: m[0] || (m[0] = (h) => f.value = h)
+            })
+          ], 8, vt),
+          L("section", {
+            "aria-label": e(n)("menu.tree_editor.labels.detail"),
+            class: "min-h-0 min-w-0 flex-1 overflow-hidden pr-24",
+            "data-testid": "menu-management-editor-detail-host"
+          }, [
+            y(Le, {
+              ref_key: "detailPane",
+              ref: s,
+              selected: f.value
+            }, null, 8, ["selected"])
+          ], 8, ft)
+        ])
+      ]),
+      _: 1
+    }, 8, ["primary-action", "secondary-actions", "title"]));
+  }
+}), yt = "treeEditorOpen", Rt = /* @__PURE__ */ H({
+  __name: "TreeEditorOpenner",
+  props: {
+    canOpen: { type: Boolean },
+    listenForMessage: { type: Boolean, default: !0 }
+  },
+  setup(U) {
+    const _ = U, t = xe(), o = W(null);
+    function n() {
+      if (!_.canOpen || o.value) return;
+      const f = t.drafts.open();
+      f.kind === "success" && (o.value = f.value);
+    }
+    function p(f) {
+      var s;
+      _.canOpen && ((s = f.data) == null ? void 0 : s.type) === yt && n();
+    }
+    return ce(() => {
+      _.listenForMessage && window.addEventListener("message", p);
+    }), ne(() => {
+      var f;
+      _.listenForMessage && window.removeEventListener("message", p), (f = o.value) == null || f.dispose();
+    }), (f, s) => (v(), S(Z, null, [
+      ye(f.$slots, "default", { trigger: n }),
+      o.value ? (v(), E(gt, {
+        key: 0,
+        draft: o.value,
+        onClose: s[0] || (s[0] = (w) => o.value = null)
+      }, null, 8, ["draft"])) : M("", !0)
+    ], 64));
+  }
+});
+export {
+  Rt as _,
+  le as a
+};