@feedmepos/mf-menu-portal 1.0.4-dev.4 → 1.0.5-dev.1

package/dist/GroupList.vue_vue_type_script_setup_true_lang-DNTVfY2d.js

@@ -0,0 +1,1996 @@
+import { defineComponent as wl, ref as O, watch as Ge, resolveComponent as C, openBlock as i, createBlock as k, withCtx as d, createElementVNode as r, createVNode as s, normalizeClass as xe, toDisplayString as _, unref as t, createElementBlock as v, Fragment as S, renderList as N, createCommentVNode as y, defineAsyncComponent as jl, computed as V, shallowRef as B, h as p, withModifiers as W, onUnmounted as Kl, renderSlot as we, withDirectives as ql, mergeProps as ul, nextTick as Yl } from "vue";
+import { useI18n as hl, CustomAttributesForm as dl } from "@feedmepos/mf-common";
+import { useBreakpoints as Hl, useDialog as Ql, useSnackbar as Jl, components as h, SnackbarPosition as Wl, FmButtonVariant as ml } from "@feedmepos/ui-library";
+import { _ as Xl } from "./ApplyProduct.vue_vue_type_script_setup_true_lang-CPh1GBw9.js";
+import { _ as cl } from "./index.vue_vue_type_script_setup_true_lang-CGPDazqs.js";
+import { a as Zl, b as pl, _ as ne } from "./TranslationLanguageSelector.vue_vue_type_script_setup_true_lang-BJZ6VcrT.js";
+import { A as Re, _ as vl } from "./LinkProductSideSheet.vue_vue_type_script_setup_true_lang-Cb6nO43H.js";
+import { a as bl, _ as he } from "./vuedraggable-CBtQLb_S.js";
+import { _ as gl } from "./FormItem.vue_vue_type_script_setup_true_lang-C2S6QCyR.js";
+import { _ as ea, a as la, c as aa, F as yl, b as ta, e as oa, d as na } from "./ProductGroupCreateSheet.vue_vue_type_script_setup_true_lang-CEliG36Z.js";
+import { _ as sa } from "./ListCountTag.vue_vue_type_script_setup_true_lang-0bjk8Aly.js";
+import { _ as ia } from "./PageLayout.vue_vue_type_script_setup_true_lang-DrhsROXo.js";
+import { _ as ra } from "./PhoneFab.vue_vue_type_script_setup_true_lang-CipbTqbp.js";
+import { _ as fl } from "./ProductAttributeFilter.vue_vue_type_script_setup_true_lang-DoHQeOHy.js";
+import { _ as ua } from "./ProductChipSummary.vue_vue_type_script_setup_true_lang-D9v88xZs.js";
+import { _ as _l } from "./ProductFilterMenu.vue_vue_type_script_setup_true_lang-Cgc0Ms_n.js";
+import { _ as da } from "./TranslationSideSheet.vue_vue_type_script_setup_true_lang-B0j2PNih.js";
+import { u as ma } from "./useActionFeedback-CElXij1W.js";
+import { u as ca } from "./useEditorValidation-Ctef5Bxt.js";
+import { b as pa, u as kl } from "./provide-BGLSDsuJ.js";
+import { v as va } from "./tableSemantics-C9WFO_I_.js";
+const ba = { class: "option-translation-sheet-marker sr-only" }, ga = { class: "fm-typo-en-title-md-600" }, ya = { class: "pt-8 space-y-24" }, fa = { class: "flex flex-col gap-16 border p-16 rounded-lg" }, _a = ["aria-expanded"], ka = { class: "fm-typo-en-body-lg-600" }, wa = {
+  key: 0,
+  class: "flex flex-col gap-32 pl-32"
+}, ha = { class: "fm-typo-en-body-sm-600 text-fm-color-typo-secondary border inline-block rounded-full px-8 py-4 mb-8" }, xa = {
+  key: 0,
+  class: "space-y-8"
+}, Fa = { class: "fm-typo-en-body-sm-600 text-fm-color-typo-secondary border inline-block rounded-full px-8 py-4 mb-8" }, Ca = { class: "flex w-[100px] items-center gap-8" }, $a = { class: "fm-typo-en-body-md-400" }, Va = { class: "flex-1" }, Oa = { class: "flex flex-col gap-16 border p-16 rounded-lg" }, Pa = ["aria-expanded"], Sa = { class: "fm-typo-en-body-lg-600" }, Ta = {
+  key: 0,
+  class: "flex flex-col gap-32 pl-32"
+}, Ua = { class: "fm-typo-en-body-md-600 text-fm-color-primary border border-fm-color-primary inline-block rounded-md px-8 py-4" }, Ia = { class: "space-y-32" }, Aa = { class: "fm-typo-en-body-sm-600 text-fm-color-typo-secondary border inline-block rounded-full px-8 py-4 mb-4" }, Na = { class: "-mt-px" }, La = {
+  key: 0,
+  class: "space-y-8"
+}, Da = { class: "fm-typo-en-body-sm-600 text-fm-color-typo-secondary border inline-block rounded-full px-8 py-4 mb-4" }, Ea = { class: "flex w-[100px] items-center gap-8" }, za = { class: "fm-typo-en-body-md-400" }, Ba = { class: "flex-1" }, Ma = { class: "flex gap-8 items-center justify-start" }, Ra = /* @__PURE__ */ wl({
+  __name: "GroupTranslationSideSheet",
+  props: {
+    modelValue: { type: Boolean },
+    view: {},
+    session: {}
+  },
+  emits: ["save", "discard"],
+  setup(Fe, { emit: Ce }) {
+    const se = Fe, L = Ce, { t: b } = hl(), l = O(!1), T = O(!0);
+    return Ge(
+      () => se.modelValue,
+      ($) => {
+        $ && (l.value = !1, T.value = !0);
+      },
+      { immediate: !0 }
+    ), ($, w) => {
+      const R = C("FmIcon"), ie = C("FmTextField"), D = C("FmButton"), I = C("FmSideSheet");
+      return i(), k(I, {
+        "model-value": $.modelValue,
+        "max-width": 720,
+        "z-index": 200,
+        "is-container-props": { class: "group-translation-sheet" },
+        "onOn:clickedAway": w[6] || (w[6] = (f) => L("discard")),
+        "onUpdate:modelValue": w[7] || (w[7] = (f) => !f && L("discard"))
+      }, {
+        "side-sheet-header": d(() => [
+          r("span", ba, _(t(b)("menu.group.translation.translate_options")), 1),
+          r("p", ga, _(t(b)("menu.group.translation.title")), 1)
+        ]),
+        "side-sheet-footer": d(() => [
+          r("div", Ma, [
+            s(D, {
+              label: t(b)("menu.common.actions.save"),
+              size: "lg",
+              variant: "primary",
+              onClick: w[4] || (w[4] = (f) => L("save"))
+            }, null, 8, ["label"]),
+            s(D, {
+              label: t(b)("menu.common.actions.cancel"),
+              size: "lg",
+              variant: "tertiary",
+              onClick: w[5] || (w[5] = (f) => L("discard"))
+            }, null, 8, ["label"])
+          ])
+        ]),
+        default: d(() => [
+          r("div", ya, [
+            s(Zl, {
+              selected: $.view.optionTranslationView.locales,
+              available: $.view.optionTranslationView.availableLocales,
+              "menu-z-index": 201,
+              onAdd: w[0] || (w[0] = (f) => $.session.addOptionTranslationLocale(f)),
+              onRemove: w[1] || (w[1] = (f) => $.session.removeOptionTranslationLocale(f))
+            }, null, 8, ["selected", "available"]),
+            r("div", fa, [
+              r("button", {
+                type: "button",
+                class: "flex items-center gap-16 cursor-pointer appearance-none border-0 bg-transparent p-0 text-left",
+                "aria-expanded": l.value,
+                onClick: w[2] || (w[2] = (f) => l.value = !l.value)
+              }, [
+                s(R, {
+                  name: "keyboard_arrow_down",
+                  class: xe([
+                    "transition-transform",
+                    l.value ? "transform rotate-180" : ""
+                  ])
+                }, null, 8, ["class"]),
+                r("p", ka, _(t(b)("menu.group.translation.group_name")), 1)
+              ], 8, _a),
+              l.value ? (i(), v("div", wa, [
+                r("div", null, [
+                  r("p", ha, _(t(b)("menu.group.translation.default")), 1),
+                  s(ie, {
+                    "model-value": $.view.name,
+                    readonly: ""
+                  }, null, 8, ["model-value"])
+                ]),
+                $.view.optionTranslationView.groupNameTranslations.length > 0 ? (i(), v("div", xa, [
+                  r("p", Fa, _(t(b)("menu.group.translation.translation")), 1),
+                  (i(!0), v(S, null, N($.view.optionTranslationView.groupNameTranslations, (f) => (i(), v("div", {
+                    key: f.code,
+                    class: "flex gap-16 items-center"
+                  }, [
+                    r("div", Ca, [
+                      s(pl, {
+                        code: f.code
+                      }, null, 8, ["code"]),
+                      r("span", $a, _(f.label), 1)
+                    ]),
+                    r("div", Va, [
+                      s(ne, {
+                        "model-value": f.value,
+                        readonly: ""
+                      }, null, 8, ["model-value"])
+                    ])
+                  ]))), 128))
+                ])) : y("", !0)
+              ])) : y("", !0)
+            ]),
+            r("div", Oa, [
+              r("button", {
+                type: "button",
+                class: "flex items-center gap-16 cursor-pointer appearance-none border-0 bg-transparent p-0 text-left",
+                "aria-expanded": T.value,
+                onClick: w[3] || (w[3] = (f) => T.value = !T.value)
+              }, [
+                s(R, {
+                  name: "keyboard_arrow_down",
+                  class: xe([
+                    "transition-transform",
+                    T.value ? "transform rotate-180" : ""
+                  ])
+                }, null, 8, ["class"]),
+                r("p", Sa, _(t(b)("menu.group.translation.product_name")), 1)
+              ], 8, Pa),
+              T.value ? (i(), v("div", Ta, [
+                (i(!0), v(S, null, N($.view.optionTranslationView.options, (f, A) => (i(), v("div", {
+                  key: f.id,
+                  class: "space-y-8"
+                }, [
+                  r("p", Ua, _(t(b)("menu.group.translation.option", { number: A + 1 })), 1),
+                  r("div", Ia, [
+                    r("div", null, [
+                      r("p", Aa, _(t(b)("menu.group.translation.default")), 1),
+                      r("div", Na, [
+                        s(ne, {
+                          "model-value": f.name,
+                          placeholder: f.placeholder,
+                          "aria-label": t(b)("menu.group.translation.option_default", {
+                            number: A + 1
+                          }),
+                          "onUpdate:modelValue": (P) => $.session.setOptionName(f.id, P, f.target)
+                        }, null, 8, ["model-value", "placeholder", "aria-label", "onUpdate:modelValue"])
+                      ])
+                    ]),
+                    $.view.optionTranslationLocales.length > 0 ? (i(), v("div", La, [
+                      r("p", Da, _(t(b)("menu.group.translation.translation")), 1),
+                      (i(!0), v(S, null, N(f.translations, (P) => (i(), v("div", {
+                        key: P.code,
+                        class: "flex gap-16 items-center"
+                      }, [
+                        r("div", Ea, [
+                          s(pl, {
+                            code: P.code
+                          }, null, 8, ["code"]),
+                          r("span", za, _(P.label), 1)
+                        ]),
+                        r("div", Ba, [
+                          s(ne, {
+                            "model-value": P.value,
+                            placeholder: f.name,
+                            "aria-label": t(b)("menu.group.translation.option_translation", {
+                              number: A + 1,
+                              language: P.label
+                            }),
+                            "onUpdate:modelValue": (re) => $.session.setOptionTranslation(
+                              f.id,
+                              P.code,
+                              re
+                            )
+                          }, null, 8, ["model-value", "placeholder", "aria-label", "onUpdate:modelValue"])
+                        ])
+                      ]))), 128))
+                    ])) : y("", !0)
+                  ])
+                ]))), 128))
+              ])) : y("", !0)
+            ])
+          ])
+        ]),
+        _: 1
+      }, 8, ["model-value"]);
+    };
+  }
+}), Ga = {
+  key: 0,
+  class: "flex-1 flex justify-between gap-8 pl-8"
+}, ja = { class: "flex items-center" }, Ka = {
+  key: 1,
+  class: "flex items-center gap-8 ml-auto"
+}, qa = {
+  key: 0,
+  class: "text-fm-color-typo-secondary",
+  role: "alert"
+}, Ya = {
+  key: 1,
+  "data-menu-state": "unavailable"
+}, Ha = { class: "flex justify-between items-center gap-8 mt-16 mb-8" }, Qa = ["aria-label"], Ja = {
+  key: 1,
+  "aria-hidden": "true"
+}, Wa = { class: "w-[320px]" }, Xa = { class: "px-16 py-8" }, Za = {
+  class: "py-8 px-16",
+  "data-testid": "group-phone-filters"
+}, et = ["aria-label"], lt = ["onClick"], at = {
+  key: 0,
+  class: "px-16 py-8"
+}, tt = {
+  class: "flex-1 overflow-scroll divide-y divide-fm-color-neutral-gray-100 pb-64",
+  "data-testid": "group-phone-list"
+}, ot = { class: "flex items-center flex-1 min-w-0" }, nt = { class: "flex-1 space-y-4 min-w-0" }, st = { class: "fm-typo-en-body-lg-600 break-words" }, it = {
+  key: 0,
+  class: "fm-typo-en-body-md-400 text-fm-color-typo-secondary"
+}, rt = { class: "fm-typo-en-body-md-400 text-fm-color-typo-secondary" }, ut = ["aria-disabled", "onClick"], dt = { class: "fm-typo-en-title-md-600" }, mt = { class: "space-y-32 pt-8" }, ct = { class: "space-y-16" }, pt = {
+  key: 0,
+  class: "flex gap-8 rounded-md bg-fm-color-system-warning-100 p-12"
+}, vt = { class: "space-y-4" }, bt = { class: "fm-typo-en-body-md-400 text-fm-color-system-warning-400" }, gt = { class: "fm-typo-en-body-md-400 text-fm-color-system-warning-400" }, yt = { key: 0 }, ft = { key: 1 }, _t = { class: "xs:overflow-x-scroll" }, kt = { class: "xs:min-w-[640px]" }, wt = { class: "flex gap-8 items-center justify-start" }, ht = {
+  key: 0,
+  role: "alert"
+}, xt = {
+  key: 1,
+  "data-menu-state": "unavailable"
+}, Ft = { class: "flex gap-8 items-center justify-start" }, Ct = { class: "fm-typo-en-title-md-600" }, $t = { class: "space-y-32 pt-8" }, Vt = { class: "xs:overflow-x-scroll" }, Ot = { class: "xs:min-w-[640px]" }, Pt = { class: "flex gap-8" }, Wt = /* @__PURE__ */ wl({
+  __name: "GroupList",
+  props: {
+    sdk: {},
+    catalogPage: { type: Boolean, default: !1 },
+    heading: { default: "" },
+    inCatalogEditor: { type: Boolean, default: !1 }
+  },
+  setup(Fe) {
+    const Ce = jl(
+      () => import("./ProductInventoryDialog-EDlrXupB.js")
+    ), se = ["NORMAL", "PRODUCT", "DYNAMIC"], L = {
+      NORMAL: "menu.group.type.normal",
+      PRODUCT: "menu.group.type.product",
+      DYNAMIC: "menu.group.type.dynamic"
+    }, b = Fe, { t: l, n: T } = hl(), { breakpoints: $ } = Hl(), w = V(() => $.value.xs), R = O(!1);
+    function ie(e) {
+      b.sdk.group.setTypeFilter(e), R.value = !1;
+    }
+    const D = O(null), I = pa(), f = Ql(), A = O(!1), P = O(
+      null
+    );
+    async function re() {
+      var e;
+      A.value = !A.value, A.value && (await Yl(), (e = P.value) == null || e.toggleProperty(!0));
+    }
+    function $e(e) {
+      if (!e) return "";
+      const a = T(0, {
+        useGrouping: !1,
+        minimumFractionDigits: 0,
+        maximumFractionDigits: 0
+      });
+      return T(0, {
+        style: "currency",
+        currency: e,
+        currencyDisplay: "narrowSymbol",
+        useGrouping: !1,
+        minimumFractionDigits: 0,
+        maximumFractionDigits: 0
+      }).replace(a, "").trim() || e;
+    }
+    const { run: G } = ma(), xl = Jl(), j = kl(b.sdk.group.list), u = V(
+      () => j.value.status === "ready" ? j.value.value : null
+    ), je = V(() => {
+      var e;
+      return [
+        { label: l("menu.common.labels.summary"), value: null },
+        ...(((e = u.value) == null ? void 0 : e.scope.schedulerOptions) ?? []).map((a) => ({
+          label: a.label,
+          value: a.id
+        }))
+      ];
+    }), ue = O(!1), K = O(!1), q = O(!1), Ve = O(!1), Y = O(!1), M = B(null), U = B({
+      status: "loading"
+    });
+    let Oe = () => {
+    };
+    const X = B(null), Z = B(null), Pe = O(""), H = O(!1), Q = O(!1), Ke = kl(
+      b.sdk.linkProduct.catalogue
+    ), qe = V(
+      () => Ke.value.status === "ready" ? Ke.value.value : null
+    ), de = B(null), m = B(b.sdk.group.editor()), ee = B(
+      m.value.get()
+    );
+    let Se = m.value.subscribe(
+      (e) => ee.value = e
+    );
+    const n = V(
+      () => ee.value.status === "ready" ? ee.value.value : null
+    ), J = ca(() => m.value), me = V(
+      () => n.value ? J.issue(n.value.fieldIssues, "name") ?? n.value.nameIssue : null
+    ), Ye = V(() => {
+      const e = n.value;
+      return e ? [
+        ...J.issues(e.fieldIssues, "bounds"),
+        ...J.issues(e.fieldIssues, "options"),
+        ...e.issues.filter(
+          (a) => a.field !== "name" && a.field !== "bounds" && a.field !== "options"
+        )
+      ] : [];
+    }), ce = O({}), Te = V(() => {
+      var e;
+      return (((e = n.value) == null ? void 0 : e.options) ?? []).map((a) => ({
+        ...a,
+        subRows: a.variants
+      }));
+    }), Fl = V(
+      () => Math.max(
+        Te.value.reduce(
+          (e, a) => e + 1 + a.subRows.length,
+          0
+        ),
+        1
+      )
+    ), E = V(
+      () => U.value.status === "ready" ? U.value.value : null
+    );
+    Ge(
+      () => U.value.status,
+      (e) => {
+        e !== "ready" && (Y.value = !1);
+      }
+    );
+    function Cl(e, a) {
+      return e === null ? "" : T(e, {
+        style: "currency",
+        currency: a,
+        currencyDisplay: "narrowSymbol"
+      }).replaceAll(/\s/g, "");
+    }
+    const $l = V(() => [
+      { label: l("menu.order.from.options.all"), value: "ALL" },
+      { label: l("menu.order.from.options.pos_only"), value: "POS_ONLY" },
+      { label: l("menu.order.from.options.none"), value: "NONE" }
+    ]);
+    function He(e) {
+      return Object.fromEntries(
+        Object.entries(e).map(([a, c]) => [a, [...c]])
+      );
+    }
+    function Ue() {
+      var e;
+      (e = X.value) == null || e.dispose(), X.value = null;
+    }
+    function Qe(e, a) {
+      Ue(), X.value = m.value.pricingEditor(
+        e.id,
+        a,
+        e.target
+      );
+    }
+    async function Vl(e) {
+      return (await G(() => b.sdk.priceTier.create(e), {
+        successMessage: l("menu.price_tier.add_price_group_success")
+      })).kind === "success";
+    }
+    function Ie() {
+      var e;
+      (e = Z.value) == null || e.dispose(), Z.value = null, Pe.value = "";
+    }
+    function Ol(e) {
+      Ie(), Pe.value = e.name || e.placeholder, Z.value = m.value.inventoryEditor(
+        e.id,
+        e.target
+      );
+    }
+    function Pl() {
+      var e, a;
+      ((a = (e = n.value) == null ? void 0 : e.translation) == null ? void 0 : a.state) === "allowed" && (m.value.beginOptionTranslationEdit(), H.value = !0);
+    }
+    function Je() {
+      var e, a;
+      ((a = (e = n.value) == null ? void 0 : e.translation) == null ? void 0 : a.state) === "allowed" && (m.value.beginGroupTranslationEdit(), Q.value = !0);
+    }
+    function Sl() {
+      m.value.saveGroupTranslationEdit(), Q.value = !1;
+    }
+    function pe() {
+      m.value.discardGroupTranslationEdit(), Q.value = !1;
+    }
+    function Tl() {
+      m.value.saveOptionTranslationEdit(), H.value = !1;
+    }
+    function Ae() {
+      m.value.discardOptionTranslationEdit(), H.value = !1;
+    }
+    const Ne = V(() => [
+      {
+        accessorKey: "isDefault",
+        size: 35,
+        header: () => l("menu.group.option.is_default"),
+        enableSorting: !1,
+        cell: (e) => p(h.FmCheckbox, {
+          modelValue: e.row.original.isDefault,
+          value: "default",
+          disabled: e.row.original.editDefault.state !== "allowed",
+          "aria-label": l("menu.group.a11y.row", {
+            label: l("menu.group.option.is_default"),
+            index: e.row.index + 1
+          }),
+          "onUpdate:modelValue": (a) => m.value.setOptionDefault(
+            e.row.original.id,
+            a,
+            e.row.original.target
+          )
+        })
+      },
+      {
+        accessorKey: "code",
+        size: 100,
+        header: () => l("menu.group.option.code"),
+        enableSorting: !1,
+        cell: (e) => p("div", { class: "break-all max-w-[100px]" }, e.row.original.code)
+      },
+      {
+        accessorKey: "name",
+        header: () => {
+          var e, a;
+          return p("div", { class: "flex items-center w-full gap-8" }, [
+            p("span", l("menu.group.option.product_title")),
+            p(h.FmButton, {
+              "aria-label": l("menu.group.translation.translate_options"),
+              disabled: ((a = (e = n.value) == null ? void 0 : e.translation) == null ? void 0 : a.state) !== "allowed",
+              icon: "g_translate",
+              textColor: "neutral-gray-400",
+              variant: "tertiary",
+              onClick: Pl
+            })
+          ]);
+        },
+        enableSorting: !1,
+        cell: (e) => {
+          const a = e.row.original, c = [a.code, a.name || a.placeholder].filter(Boolean).join(" "), x = e.row.getIsExpanded();
+          return p("div", { class: "flex items-center gap-8" }, [
+            ...e.row.getCanExpand() ? [
+              p(h.FmButton, {
+                // Down while collapsed, up once expanded, as TakeawayList.
+                icon: "keyboard_arrow_up",
+                class: x ? "" : "rotate-180",
+                "aria-label": x ? l("menu.apply_product.table.collapse_combinations", {
+                  name: c
+                }) : l("menu.apply_product.table.expand_combinations", {
+                  name: c
+                }),
+                variant: "tertiary",
+                onClick: e.row.getToggleExpandedHandler()
+              })
+            ] : [],
+            p(h.FmTextField, {
+              class: "min-w-[300px]",
+              modelValue: a.name,
+              placeholder: a.placeholder,
+              disabled: a.edit.state !== "allowed",
+              "aria-label": l("menu.group.a11y.row", {
+                label: l("menu.group.option.product_title"),
+                index: e.row.index + 1
+              }),
+              "onUpdate:modelValue": (F) => m.value.setOptionName(a.id, F, a.target)
+            })
+          ]);
+        }
+      },
+      {
+        accessorKey: "priceAmount",
+        size: 400,
+        header: () => {
+          var e;
+          return l("menu.group.option.price", {
+            symbol: $e((e = n.value) == null ? void 0 : e.currencyCode)
+          });
+        },
+        enableSorting: !1,
+        cell: (e) => p("div", { class: "flex items-center gap-8" }, [
+          p(ea, {
+            class: "min-w-[88px]",
+            modelValue: e.row.original.priceAmount,
+            // An override or variant row shows the price it inherits, and
+            // clearing it hands the row back to that price (legacy
+            // OptionTable `fallbackPrice`).
+            placeholder: Cl(
+              e.row.original.inheritedPriceAmount,
+              e.row.original.currency
+            ),
+            disabled: e.row.original.edit.state !== "allowed",
+            // Legacy exposes the first option price as the form's plain
+            // "Price (RM)" field. Keep that stable semantic control for the
+            // catalog editor, while later rows remain uniquely named.
+            "aria-label": e.row.index === 0 ? l("menu.group.option.price", {
+              symbol: $e(e.row.original.currency)
+            }) : l("menu.group.a11y.row", {
+              label: l("menu.group.option.price", {
+                symbol: $e(e.row.original.currency)
+              }),
+              index: e.row.index + 1
+            }),
+            "onUpdate:modelValue": (a) => m.value.setOptionPrice(
+              e.row.original.id,
+              a,
+              e.row.original.target
+            )
+          }),
+          // A row that cannot sell keeps its pricing controls, disabled, as the
+          // nested editor's rows do; only a V3 menu has none.
+          ...e.row.original.editPricing.state !== "hidden" ? [
+            p("div", { class: "flex items-center gap-4" }, [
+              p(
+                h.FmButton,
+                {
+                  variant: "plain",
+                  label: l(
+                    "menu.product.form.member_price.configure.title"
+                  ),
+                  "aria-label": l("menu.group.a11y.row", {
+                    label: l(
+                      "menu.product.form.member_price.configure.title"
+                    ),
+                    index: e.row.index + 1
+                  }),
+                  disabled: e.row.original.editPricing.state !== "allowed",
+                  onClick: () => Qe(e.row.original, "members")
+                },
+                {
+                  default: () => p(
+                    "span",
+                    { class: "underline line-clamp-2 break-all" },
+                    e.row.original.memberPriceCount ? l(
+                      "menu.product.form.member_price.configure.title_with_tier",
+                      { num: e.row.original.memberPriceCount }
+                    ) : l(
+                      "menu.product.form.member_price.configure.title"
+                    )
+                  )
+                }
+              ),
+              p(la, {
+                prices: e.row.original.memberPrices
+              })
+            ])
+          ] : []
+        ])
+      },
+      {
+        accessorKey: "orderFrom",
+        size: 100,
+        header: () => l("menu.common.labels.order_from"),
+        enableSorting: !1,
+        cell: (e) => {
+          const a = e.row.original.edit, c = p(h.FmSelect, {
+            // An inheriting row shows the availability it inherits, as legacy's
+            // OrderFrom field shows its `fallback`; nothing is written until
+            // the merchant picks one.
+            modelValue: e.row.original.orderFrom ?? e.row.original.inheritedOrderFrom,
+            items: $l.value,
+            disabled: a.state !== "allowed",
+            "aria-label": l("menu.group.a11y.row", {
+              label: l("menu.common.labels.order_from"),
+              index: e.row.index + 1
+            }),
+            "onUpdate:modelValue": (F) => {
+              F && m.value.setOptionOrderFrom(
+                e.row.original.id,
+                F,
+                e.row.original.target
+              );
+            }
+          }), x = e.row.original.unavailableInCatalog;
+          return !x || a.state !== "disabled" ? c : p("div", { class: "flex items-center gap-4" }, [
+            c,
+            p(
+              h.FmTooltip,
+              {
+                content: I(a.reason),
+                placement: "top",
+                zIndex: 999
+              },
+              () => p(h.FmIcon, {
+                name: x === "NOT_FOR_SALE" ? "block" : "link_off",
+                size: "sm",
+                color: "system-warning-400"
+              })
+            )
+          ]);
+        }
+      },
+      {
+        id: "actions",
+        size: 80,
+        header: "",
+        enableSorting: !1,
+        meta: { cellClass: "" },
+        cell: (e) => p("div", { class: "flex items-center justify-end" }, [
+          ...e.row.original.editPriceTiers.state !== "hidden" ? [
+            p(aa, {
+              configured: e.row.original.hasPriceTiers,
+              disabled: e.row.original.editPriceTiers.state !== "allowed",
+              label: l("menu.group.a11y.row", {
+                label: l("menu.price_tier.price_tier_config"),
+                index: e.row.index + 1
+              }),
+              onOpen: () => Qe(e.row.original, "tiers")
+            })
+          ] : [],
+          p(h.FmButton, {
+            icon: "inventory_2",
+            overwriteIconOutline: e.row.original.inventory.bindings.length ? "filled" : "outline",
+            variant: "tertiary",
+            textColor: "neutral-gray-400",
+            disabled: e.row.original.edit.state !== "allowed",
+            "aria-label": l("menu.group.a11y.row", {
+              label: l("menu.inventory.title"),
+              index: e.row.index + 1
+            }),
+            onClick: () => Ol(e.row.original)
+          }),
+          ...e.row.original.nestedGroupCount ? [
+            p(
+              h.FmBadge,
+              {
+                class: "bg-fm-color-primary text-fm-color-neutral-white !right-0 !top-0",
+                value: e.row.original.nestedGroupCount
+              },
+              {
+                default: () => p(h.FmButton, {
+                  "aria-label": l("menu.group.a11y.row", {
+                    label: l("menu.group.nested.title"),
+                    index: e.row.index + 1
+                  }),
+                  icon: "arrow_split",
+                  textColor: "neutral-gray-400",
+                  variant: "tertiary",
+                  disabled: e.row.original.edit.state !== "allowed",
+                  onClick: () => Dl(
+                    e.row.original.id,
+                    e.row.original.target
+                  )
+                })
+              }
+            )
+          ] : [
+            p(h.FmButton, {
+              "aria-label": l("menu.group.a11y.row", {
+                label: l("menu.group.nested.title"),
+                index: e.row.index + 1
+              }),
+              disabled: !0,
+              icon: "arrow_split",
+              textColor: "neutral-gray-400",
+              variant: "tertiary"
+            })
+          ],
+          p(h.FmButton, {
+            "aria-label": l("menu.group.a11y.row", {
+              label: l("menu.common.actions.delete"),
+              index: e.row.index + 1
+            }),
+            icon: "delete",
+            variant: "tertiary",
+            // The SDK decides which row may delete (a combination row may
+            // not); the button only renders that and forwards the row target.
+            disabled: e.row.original.remove.state !== "allowed",
+            onClick: () => {
+              e.row.original.remove.state === "allowed" && m.value.removeOption(
+                e.row.original.id,
+                e.row.original.target
+              );
+            }
+          })
+        ])
+      }
+    ]), Ul = V(
+      () => {
+        var e;
+        return (e = n.value) != null && e.options.length ? Ne.value : Ne.value.slice(0, 4);
+      }
+    );
+    function We(e) {
+      Se(), m.value.dispose(), ce.value = {}, m.value = b.sdk.group.editor(e), ee.value = m.value.get(), Se = m.value.subscribe(
+        (a) => ee.value = a
+      );
+    }
+    const Le = V(() => {
+      var e;
+      return ((e = u.value) == null ? void 0 : e.showType) === !0;
+    });
+    function De() {
+      var e;
+      if (((e = u.value) == null ? void 0 : e.create.state) === "allowed") {
+        if (Le.value) {
+          K.value = !0;
+          return;
+        }
+        We(), K.value = !0;
+      }
+    }
+    function Xe(e) {
+      e.update.state === "allowed" && (We(e.id), ue.value = !0);
+    }
+    function Il(e) {
+      xl.open({
+        type: "success",
+        title: l("menu.product.manager.action.saved", { name: e }),
+        position: Wl.BOTTOM
+      });
+    }
+    function ve() {
+      be(), Q.value && pe(), H.value && Ae(), ue.value = !1, K.value = !1, q.value = !1;
+    }
+    function le() {
+      var e;
+      Oe(), Oe = () => {
+      }, (e = M.value) == null || e.dispose(), M.value = null, Ve.value = !1, Y.value = !1;
+    }
+    function Al(e) {
+      m.value.setOptionLinks(e), ce.value = {}, q.value = !1;
+    }
+    function Nl(e) {
+      var a;
+      (a = M.value) == null || a.setLinkedProducts(e), Y.value = !1;
+    }
+    function Ze(e) {
+      le();
+      const a = b.sdk.group.applyProduct(e.id);
+      a && (M.value = a, U.value = a.get(), Oe = a.subscribe(
+        (c) => U.value = c
+      ), Ve.value = !0);
+    }
+    async function Ll() {
+      var a;
+      (await G(
+        () => M.value.submit(),
+        {
+          successMessage: l("menu.variant.form.saved", {
+            name: ((a = E.value) == null ? void 0 : a.groupName) ?? ""
+          }),
+          showLoading: () => {
+            var c;
+            return ((c = E.value) == null ? void 0 : c.status) === "submitting";
+          }
+        }
+      )).kind === "success" && le();
+    }
+    function be() {
+      var e;
+      (e = de.value) == null || e.dispose(), de.value = null;
+    }
+    function Dl(e, a) {
+      be(), de.value = m.value.nestedOverrides(e, a);
+    }
+    async function el() {
+      var x, F, z, ae;
+      const e = ((x = n.value) == null ? void 0 : x.name) ?? "", a = (F = u.value) != null && F.scope.schedulerId ? u.value.scope.schedulerLabel ?? e : b.catalogPage && (((z = u.value) == null ? void 0 : z.scope.catalogLabel) ?? b.heading) || e;
+      (await G(
+        () => J.submit(() => m.value.submit()),
+        {
+          // A catalog's Group editor still writes the default-menu group, but the
+          // legacy shell attributes the completed action to the active catalog.
+          successMessage: b.catalogPage || (ae = u.value) != null && ae.scope.schedulerId ? l("menu.catalog.saved", { name: a }) : l("menu.variant.form.saved", { name: a }),
+          // submit() publishes `submitting` synchronously only when it will perform
+          // a write. Local required-name rejection must not flash a loading toast;
+          // the approved required-field baseline contains only the field issue.
+          showLoading: () => {
+            var ye;
+            return ((ye = n.value) == null ? void 0 : ye.status) === "submitting";
+          }
+        }
+      )).kind === "success" && ve();
+    }
+    function El(e) {
+      e.duplicate.state === "allowed" && f.open({
+        title: l("menu.group.actions.duplicate.title"),
+        message: l("menu.group.actions.duplicate.message", { name: e.name }),
+        primaryActions: {
+          text: l("menu.common.actions.yes"),
+          close: !0,
+          variant: ml.Primary
+        },
+        secondaryActions: {
+          text: l("menu.common.actions.cancel"),
+          close: !0
+        }
+      }).onPrimary(async () => {
+        await G(() => b.sdk.group.duplicate(e.id), {
+          // Legacy names the SOURCE group here, not the clone: `duplicateGroup`
+          // passes `res.group.name` to `updateMenu`, and only `req.data.name`
+          // carries the ` clone` suffix (portal manager/menu/group.ts:365 @
+          // 7dfeb122). Re-observed against the real portal on 2026-08-19 — the
+          // toast reads "Set saved" while the created row reads "Set clone" —
+          // and the baseline was refreshed with the user's approval after having
+          // frozen the row's name as the toast text.
+          //
+          // `row.name` is the row the user acted on, so this is not the domain
+          // rule the SDK owns; the clone's own name still comes back on the ref
+          // for any caller that needs the created entity.
+          successMessage: l("menu.variant.form.saved", { name: e.name })
+        });
+      });
+    }
+    function zl(e) {
+      e.remove.state === "allowed" && f.open({
+        title: l("menu.group.dialogs.delete.title"),
+        // Mirrors the legacy dialog's structure rather than composing a
+        // sentence here: message, then — only when something is linked — the
+        // warning heading and the affected names as a list
+        // (`portal .../GroupManager/DeleteGroupDialog.vue` @ `7dfeb122`). Each
+        // t() returns a complete string, so nothing is interpolated or
+        // assembled by a template expression (ADR-0003 §3). The names are what
+        // the frozen `group/delete/linked-confirmation` text ends in ("… will
+        // be unlinked: Hot Pot"); concatenating the two keys instead left the
+        // sentence on a dangling colon.
+        //
+        // These are the APPLIED items — the menu items referencing this group,
+        // which the delete unlinks — not the group's own option products. The
+        // frozen text names one item for "Add on", a group holding three
+        // options, so the two are not interchangeable.
+        contentComponent: p("div", { class: "space-y-4" }, [
+          p("p", l("menu.group.dialogs.delete.message", { name: e.name })),
+          ...e.appliedItemNames.length ? [
+            p("div", [
+              p(
+                "p",
+                { class: "text-fm-color-typo-secondary mb-2" },
+                l("menu.group.dialogs.delete.unlink_warning", {
+                  count: e.appliedItemNames.length
+                })
+              ),
+              // FmList/FmListItem, the ADR-0003 §1 component of record.
+              // An earlier revision of this slice hand-rolled a
+              // `list-disc` <ul> because legacy's hollow disc differs from
+              // FmListItem's filled `fiber_manual_record` prepend and the
+              // 431px cost failed `group/v3-delete/linked-confirmation`.
+              // ADR-0003 §5 refuses that reasoning outright — a diff that
+              // cannot be closed while complying with §§1-4 is a finding to
+              // report, never a licence to hand-roll — and the raw list
+              // also falsified the premise of the V4 case's own approved
+              // region, which reads "the list is now implemented with the
+              // required design-system FmList/FmListItem primitives".
+              // Restored to FmList; the marker variance against legacy's
+              // hollow disc is an approved difference on this dialog.
+              p(
+                h.FmList,
+                { class: "text-fm-color-typo-secondary ml-4" },
+                {
+                  default: () => e.appliedItemNames.map(
+                    (a) => p(
+                      h.FmListItem,
+                      {
+                        key: a,
+                        class: "!p-0 !gap-4",
+                        clickable: !1
+                      },
+                      {
+                        default: () => p(
+                          "span",
+                          {
+                            class: "fm-typo-en-body-lg-400 text-fm-color-typo-secondary"
+                          },
+                          a
+                        ),
+                        prepend: () => p(h.FmIcon, {
+                          color: "neutral-gray-400",
+                          name: "fiber_manual_record",
+                          size: "sm"
+                        })
+                      }
+                    )
+                  )
+                }
+              )
+            ])
+          ] : []
+        ]),
+        primaryActions: {
+          text: l("menu.common.actions.delete"),
+          close: !0,
+          variant: ml.Destructive
+        },
+        secondaryActions: {
+          text: l("menu.common.actions.cancel"),
+          close: !0
+        }
+      }).onPrimary(async () => {
+        await G(() => b.sdk.group.remove(e.id), {
+          // "removed", like every other module's delete. Legacy read
+          // "<name> saved" here only because its `deleteGroup` omitted
+          // `updateMenu`'s `isDelete` flag; parity with that copied the bug
+          // (ITS-003100), and the legacy app is fixed the same way.
+          successMessage: l("menu.variant.form.removed", { name: e.name })
+        });
+      });
+    }
+    const ge = B([]);
+    Ge(
+      () => {
+        var e;
+        return (e = u.value) == null ? void 0 : e.rows;
+      },
+      (e) => {
+        e && (ge.value = [...e]);
+      },
+      { immediate: !0 }
+    );
+    const Bl = V(
+      () => {
+        var e;
+        return (
+          // `showReorderHandle`, not `reorder.state`: the affordance's existence and
+          // the write's acceptance are two different questions, and the SDK answers
+          // both. Binding the handle to `reorder` deleted FmTable's 60px drag column
+          // whenever a filter narrowed the list — and again on every in-flight write
+          // — which moved every other column 110px; `group/list/search-ege` shipped
+          // that shift, and the V3 list's first legacy frame reported 4768 differing
+          // pixels. Reading `reorder.reason.code` to tell those refusals apart put
+          // the same rule in two places coupled by a message string; the rule is
+          // the SDK's.
+          (e = u.value) != null && e.showReorderHandle ? () => {
+            var a;
+            return ((a = u.value) == null ? void 0 : a.reorder.state) === "allowed";
+          } : !1
+        );
+      }
+    );
+    async function Ml(e) {
+      var x;
+      const a = ge.value;
+      (await G(
+        () => b.sdk.group.reorder(e.map((F) => F.id)),
+        {
+          successMessage: l("menu.group.reorder.success")
+        }
+      )).kind !== "success" && (ge.value = [...((x = u.value) == null ? void 0 : x.rows) ?? a]);
+    }
+    function ll(e) {
+      return [
+        {
+          id: "edit",
+          label: l("menu.common.actions.edit"),
+          disabled: e.update.state !== "allowed",
+          danger: !1,
+          run: () => Xe(e)
+        },
+        {
+          id: "apply-product",
+          label: l("menu.group.actions.apply_product"),
+          disabled: !1,
+          danger: !1,
+          run: () => Ze(e)
+        },
+        {
+          id: "duplicate",
+          label: l("menu.group.actions.duplicate_action"),
+          disabled: e.duplicate.state !== "allowed",
+          danger: !1,
+          run: () => El(e)
+        },
+        {
+          id: "delete",
+          label: l("menu.common.actions.delete"),
+          disabled: e.remove.state !== "allowed",
+          // `itemClass: "text-fm-color-typo-error"` in legacy; the phone sheet
+          // below draws it.
+          danger: !0,
+          run: () => zl(e)
+        }
+      ];
+    }
+    function Rl(e) {
+      D.value = null, e.disabled || e.run();
+    }
+    const Gl = V(() => {
+      var e;
+      return [
+        {
+          accessorKey: "name",
+          header: () => l("menu.group.list.columns.name"),
+          enableSorting: !1
+        },
+        {
+          accessorKey: "optionProducts",
+          header: () => l("menu.group.list.columns.products"),
+          enableSorting: !1,
+          // Legacy's own cell (`portal views/Catalog/Edit/Group.vue:427-437`): one
+          // entry per distinct item, suffixed `(N variant)` when that item
+          // contributes more than one variant row, and capped at five with an
+          // `& N more` tail. The SDK collapses and counts; the counted nouns are
+          // localized here, because this is the layer with an i18n instance
+          // (ADR-0003 §3) — nothing is assembled from a template expression.
+          cell: (a) => {
+            const c = a.row.original.optionProducts.map(
+              (F) => F.variantCount > 1 ? l("menu.group.list.product_variants", {
+                name: F.name,
+                variants: l("menu.group.list.variants", {
+                  count: F.variantCount
+                })
+              }) : F.name
+            ), x = c.slice(0, 5).reduce(
+              (F, z) => F ? l("menu.group.list.join_products", { list: F, item: z }) : z,
+              ""
+            );
+            return c.length > 5 ? l("menu.group.list.products_more", {
+              products: x,
+              more: l("menu.group.list.more_items", {
+                count: c.length - 5
+              })
+            }) : x;
+          }
+        },
+        {
+          // V3 only. Legacy declares this column unconditionally and hides it
+          // through `columnVisibility.type = rule.group.type`
+          // (`portal views/Catalog/Edit/Group.vue:505-509`), which is the version
+          // flag, so a V4 business renders the same table without it. It sits
+          // between "Products" and "Applied products" because that is legacy's
+          // declaration order (`:406` name, `:424` items, `:441` type, `:458`
+          // tagging, `:473` itemsLinked) and carries legacy's own 80px width. A
+          // type that maps to nothing renders "-" (`:451`).
+          id: "type",
+          header: () => l("menu.group.list.columns.type"),
+          enableSorting: !1,
+          meta: { width: "80px" },
+          cell: (a) => {
+            const c = Re[a.row.original.type];
+            return l(c || "menu.common.labels.unknown");
+          }
+        },
+        ...(e = u.value) != null && e.attributeColumnVisible ? [
+          {
+            id: "tagging",
+            accessorKey: "attributeTags",
+            header: () => l("menu.product.table.columns.tagging"),
+            enableSorting: !1,
+            size: 140,
+            cell: (a) => p(ua, {
+              kind: "tagging",
+              chips: a.row.original.attributeTags
+            })
+          }
+        ] : [],
+        {
+          // Legacy's third column, and the one this table shipped without: the
+          // frozen visual baseline (human-approved-legacy-chrome) carries
+          // "Applied products" with an "N items linked" cell per row, and both keys
+          // were already in every locale — only the column def was missing, which
+          // is why the list diffed at 0.56% with the Products column wrapping into
+          // the space this should occupy.
+          //
+          // Legacy does not pluralise ("1 items linked"), and the count goes through
+          // the i18n layer rather than being assembled here (ADR-0003 §3).
+          id: "appliedProducts",
+          header: () => l("menu.group.list.columns.applied_products"),
+          enableSorting: !1,
+          cell: (a) => p(
+            h.FmButton,
+            {
+              // This is the design-system button equivalent of legacy's clickable
+              // dashed text trigger. Its compact neutral treatment preserves the
+              // table-cell geometry while retaining native button semantics.
+              class: "w-fit !min-h-0 !px-0 !py-0 !font-normal border-b border-dashed !border-fm-color-neutral-gray-300 hover:!border-fm-color-neutral-gray-400",
+              borderColor: "neutral-gray-300",
+              label: l("menu.group.list.items_linked", {
+                count: a.row.original.appliedItemNames.length
+              }),
+              // Keep the legacy rendered count while adding the row name to the
+              // accessible control name so equal counts remain distinguishable.
+              "aria-label": l("menu.common.labels.a11y_labelled_name", {
+                label: l("menu.group.list.items_linked", {
+                  count: a.row.original.appliedItemNames.length
+                }),
+                name: a.row.original.name
+              }),
+              textColor: "typo-primary",
+              variant: "plain",
+              onClick: W(
+                () => Ze(a.row.original),
+                ["stop", "prevent"]
+              )
+            },
+            {
+              // FmButton's default label is body-lg 600. Legacy's compact table
+              // trigger is body-md 400, so use its supported content slot while
+              // retaining the library's button and accessibility behaviour.
+              default: () => p(
+                "span",
+                { class: "fm-typo-en-body-md-400" },
+                l("menu.group.list.items_linked", {
+                  count: a.row.original.appliedItemNames.length
+                })
+              )
+            }
+          )
+        },
+        {
+          // Keep the legacy row-action shell: one overflow trigger containing the
+          // approved intents, including the now-observed apply-product path.
+          id: "actions",
+          header: "",
+          meta: { cellClass: "pl-16", headerContentClass: "-mx-16" },
+          cell: (a) => {
+            const c = a.row.original;
+            return p(
+              "div",
+              { class: "flex justify-end" },
+              p(
+                h.FmMenu,
+                {
+                  closeOnClick: !0,
+                  placement: "bottom-end",
+                  stopClickPropagation: !0,
+                  onClick: W(() => {
+                  }, ["stop"])
+                },
+                {
+                  "menu-button": () => p(h.FmButton, {
+                    type: "button",
+                    variant: "tertiary",
+                    icon: "more_vert",
+                    "aria-label": l("menu.common.labels.a11y_labelled_name", {
+                      label: l("menu.group.a11y.actions"),
+                      name: c.name
+                    })
+                  }),
+                  default: () => ll(c).map(
+                    (x) => p(h.FmMenuItem, {
+                      key: x.id,
+                      label: x.label,
+                      disabled: x.disabled,
+                      onClick: W(x.run, ["stop", "prevent"])
+                    })
+                  )
+                }
+              )
+            );
+          }
+        }
+      ];
+    });
+    return Kl(() => {
+      b.sdk.group.setAttributeFilter(null), le(), Ue(), Ie(), Q.value && pe(), H.value && Ae(), be(), Se(), m.value.dispose();
+    }), (e, a) => {
+      const c = C("FmButton"), x = C("FmCircularProgress"), F = C("FmIcon"), z = C("FmChip"), ae = C("FmMenuItem"), ye = C("FmMenu"), al = C("FmSearch"), Ee = C("FmTable"), tl = C("FmBottomSheet"), ol = C("FmTooltip"), fe = C("FmStepperField"), _e = C("FmFormGroup"), ze = C("FmSwitch"), Be = C("FmSideSheet");
+      return i(), k(ia, {
+        heading: e.heading || t(l)("menu.group.title")
+      }, {
+        "prepend-heading": d(() => [
+          we(e.$slots, "prepend-heading")
+        ]),
+        "append-heading": d(() => {
+          var te;
+          return [
+            !e.catalogPage && !(w.value && e.inCatalogEditor) ? (i(), v("div", Ga, [
+              r("div", ja, [
+                s(sa, {
+                  value: t(T)(((te = u.value) == null ? void 0 : te.filteredCount) ?? 0)
+                }, null, 8, ["value"])
+              ]),
+              u.value && u.value.filteredCount > 0 && !w.value ? (i(), k(c, {
+                key: 0,
+                disabled: u.value.create.state !== "allowed",
+                label: t(l)("menu.group.actions.add"),
+                "prepend-icon": "add",
+                onClick: De
+              }, null, 8, ["disabled", "label"])) : y("", !0)
+            ])) : y("", !0),
+            e.catalogPage ? (i(), v("div", Ka, [
+              we(e.$slots, "append-heading")
+            ])) : we(e.$slots, "append-heading", { key: 2 })
+          ];
+        }),
+        default: d(() => {
+          var te, nl, sl, il, rl;
+          return [
+            we(e.$slots, "navigation"),
+            t(j).status === "error" ? (i(), v("p", qa, _(t(I)(t(j).error.message)), 1)) : t(j).status === "unavailable" ? (i(), v("div", Ya, [
+              s(t(cl), {
+                title: t(l)("menu.group.empty.title"),
+                subtitle: t(l)("menu.group.empty.subtitle")
+              }, null, 8, ["title", "subtitle"])
+            ])) : t(j).status === "loading" ? (i(), k(x, { key: 2 })) : u.value && u.value.totalCount === 0 ? (i(), k(t(cl), {
+              key: 3,
+              class: "xs:pt-24",
+              action: u.value.create.state === "allowed" ? { text: t(l)("menu.group.actions.add"), callback: De } : void 0,
+              title: t(l)("menu.group.empty.title"),
+              subtitle: t(l)("menu.group.empty.subtitle")
+            }, null, 8, ["action", "title", "subtitle"])) : u.value ? (i(), v(S, { key: 4 }, [
+              w.value ? (i(), v(S, { key: 1 }, [
+                r("div", Xa, [
+                  s(al, {
+                    autofocus: "",
+                    "model-value": u.value.query,
+                    placeholder: t(l)("menu.group.search.placeholder"),
+                    "aria-label": t(l)("menu.common.labels.search_groups"),
+                    "onUpdate:modelValue": b.sdk.group.search
+                  }, null, 8, ["model-value", "placeholder", "aria-label", "onUpdate:modelValue"])
+                ]),
+                a[28] || (a[28] = r("div", { class: "bg-fm-color-neutral-gray-100 w-full h-px rounded-md" }, null, -1)),
+                r("div", Za, [
+                  u.value.scope.schedulerSelector.state === "allowed" ? (i(), k(_l, {
+                    key: 0,
+                    "full-width": "",
+                    options: je.value,
+                    "model-value": u.value.scope.schedulerId,
+                    title: t(l)("menu.common.labels.scheduler_title", {
+                      label: u.value.scope.schedulerLabel ?? t(l)("menu.common.labels.summary")
+                    }),
+                    "onUpdate:modelValue": a[4] || (a[4] = (o) => e.sdk.item.selectScope({
+                      catalogId: u.value.scope.catalogId,
+                      schedulerId: o
+                    }))
+                  }, {
+                    default: d(() => [
+                      u.value.attributeFilterVisible ? (i(), v("button", {
+                        key: 0,
+                        type: "button",
+                        class: "pl-8 flex items-center justify-center border-l border-fm-color-neutral-gray-200",
+                        "aria-label": t(l)("menu.product.attributes.filter"),
+                        onClick: W(re, ["stop"])
+                      }, [
+                        s(F, {
+                          name: "filter_alt",
+                          outline: "",
+                          color: "neutral-gray-400",
+                          size: "sm"
+                        })
+                      ], 8, et)) : y("", !0)
+                    ]),
+                    _: 1
+                  }, 8, ["options", "model-value", "title"])) : y("", !0),
+                  u.value.showType ? (i(), k(tl, {
+                    key: 1,
+                    modelValue: R.value,
+                    "onUpdate:modelValue": a[6] || (a[6] = (o) => R.value = o)
+                  }, {
+                    "bottom-sheet-button": d(() => [
+                      s(z, {
+                        class: "text-fm-color-typo-secondary",
+                        label: t(l)("menu.group.type.title", {
+                          type: u.value.typeFilter ? t(l)(t(Re)[u.value.typeFilter]) : t(l)("menu.common.labels.all")
+                        }),
+                        "right-icon": "keyboard_arrow_down"
+                      }, null, 8, ["label"])
+                    ]),
+                    default: d(() => [
+                      r("div", null, [
+                        r("div", {
+                          class: "px-16 py-8",
+                          role: "button",
+                          onClick: a[5] || (a[5] = (o) => ie(null))
+                        }, _(t(l)("menu.group.type.all")), 1),
+                        (i(), v(S, null, N(se, (o) => r("div", {
+                          key: o,
+                          class: "px-16 py-8",
+                          role: "button",
+                          onClick: (g) => ie(o)
+                        }, _(t(l)(L[o])), 9, lt)), 64))
+                      ])
+                    ]),
+                    _: 1
+                  }, 8, ["modelValue"])) : y("", !0)
+                ]),
+                A.value ? (i(), v("div", at, [
+                  s(fl, {
+                    ref_key: "filterControl",
+                    ref: P,
+                    entity: "group",
+                    attributes: u.value.attributeOptions,
+                    rule: u.value.attributeRule,
+                    "onUpdate:rule": a[7] || (a[7] = (o) => b.sdk.group.setAttributeFilter(o))
+                  }, null, 8, ["attributes", "rule"])
+                ])) : y("", !0),
+                r("div", tt, [
+                  (i(!0), v(S, null, N(u.value.rows, (o) => (i(), v("div", {
+                    key: o.id,
+                    class: "py-12 px-16 flex space-x-16 items-center",
+                    "data-testid": "group-phone-card"
+                  }, [
+                    r("div", ot, [
+                      r("div", nt, [
+                        r("p", st, _(o.name), 1),
+                        r("div", null, [
+                          u.value.showType ? (i(), v("p", it, _(t(l)(L[o.type])), 1)) : y("", !0),
+                          r("p", rt, _(t(l)("menu.group.list.products_linked", {
+                            count: o.appliedItemNames.length
+                          })), 1)
+                        ])
+                      ]),
+                      s(tl, {
+                        "model-value": D.value === o.id,
+                        "dismiss-away": "",
+                        "no-header": "",
+                        "z-index": 110,
+                        "onUpdate:modelValue": (g) => D.value = g ? o.id : null
+                      }, {
+                        "bottom-sheet-button": d(() => [
+                          s(c, {
+                            icon: "more_vert",
+                            variant: "tertiary",
+                            "aria-label": t(l)("menu.common.labels.a11y_labelled_name", {
+                              label: t(l)("menu.group.a11y.actions"),
+                              name: o.name
+                            }),
+                            onClick: W((g) => D.value = D.value === o.id ? null : o.id, ["stop"])
+                          }, null, 8, ["aria-label", "onClick"])
+                        ]),
+                        default: d(() => [
+                          r("div", null, [
+                            (i(!0), v(S, null, N(ll(o), (g) => (i(), v("div", {
+                              key: g.id,
+                              class: "py-8 px-12 hover:bg-fm-color-neutral-gray-100",
+                              role: "menuitem",
+                              "aria-disabled": g.disabled,
+                              onClick: (Me) => Rl(g)
+                            }, [
+                              r("div", {
+                                class: xe(["flex items-center", {
+                                  "text-fm-color-typo-disabled cursor-not-allowed": g.disabled,
+                                  "cursor-pointer": !g.disabled,
+                                  "text-fm-color-typo-error": g.danger && !g.disabled
+                                }])
+                              }, _(g.label), 3)
+                            ], 8, ut))), 128))
+                          ])
+                        ]),
+                        _: 2
+                      }, 1032, ["model-value", "onUpdate:modelValue"])
+                    ])
+                  ]))), 128))
+                ])
+              ], 64)) : (i(), v(S, { key: 0 }, [
+                r("div", Ha, [
+                  u.value.scope.schedulerSelector.state === "allowed" ? (i(), k(_l, {
+                    key: 0,
+                    options: je.value,
+                    "model-value": u.value.scope.schedulerId,
+                    title: t(l)("menu.common.labels.scheduler_title", {
+                      label: u.value.scope.schedulerLabel ?? t(l)("menu.common.labels.summary")
+                    }),
+                    "onUpdate:modelValue": a[0] || (a[0] = (o) => e.sdk.item.selectScope({
+                      catalogId: u.value.scope.catalogId,
+                      schedulerId: o
+                    }))
+                  }, {
+                    default: d(() => [
+                      u.value.attributeFilterVisible ? (i(), v("button", {
+                        key: 0,
+                        type: "button",
+                        class: "pl-8 flex items-center justify-center border-l border-fm-color-neutral-gray-200",
+                        "aria-label": t(l)("menu.product.attributes.filter"),
+                        onClick: W(re, ["stop"])
+                      }, [
+                        s(F, {
+                          name: "filter_alt",
+                          outline: "",
+                          color: "neutral-gray-400",
+                          size: "sm"
+                        })
+                      ], 8, Qa)) : y("", !0)
+                    ]),
+                    _: 1
+                  }, 8, ["options", "model-value", "title"])) : u.value.showType ? y("", !0) : (i(), v("div", Ja)),
+                  u.value.showType ? (i(), k(ye, {
+                    key: 2,
+                    "close-on-click": ""
+                  }, {
+                    "menu-button": d(() => [
+                      s(z, {
+                        class: "text-fm-color-typo-secondary",
+                        label: t(l)("menu.group.type.title", {
+                          type: u.value.typeFilter ? t(l)(t(Re)[u.value.typeFilter]) : t(l)("menu.common.labels.all")
+                        }),
+                        "right-icon": "keyboard_arrow_down"
+                      }, null, 8, ["label"])
+                    ]),
+                    default: d(() => [
+                      s(ae, {
+                        class: "px-16 py-8",
+                        label: t(l)("menu.group.type.all"),
+                        onClick: a[1] || (a[1] = (o) => b.sdk.group.setTypeFilter(null))
+                      }, null, 8, ["label"]),
+                      (i(), v(S, null, N(se, (o) => s(ae, {
+                        key: o,
+                        class: "px-16 py-8",
+                        label: t(l)(L[o]),
+                        onClick: (g) => b.sdk.group.setTypeFilter(o)
+                      }, null, 8, ["label", "onClick"])), 64))
+                    ]),
+                    _: 1
+                  })) : y("", !0),
+                  r("div", Wa, [
+                    s(al, {
+                      autofocus: "",
+                      "model-value": u.value.query,
+                      placeholder: t(l)("menu.group.search.placeholder"),
+                      "aria-label": t(l)("menu.common.labels.search_groups"),
+                      "onUpdate:modelValue": b.sdk.group.search
+                    }, null, 8, ["model-value", "placeholder", "aria-label", "onUpdate:modelValue"])
+                  ])
+                ]),
+                A.value ? (i(), k(fl, {
+                  key: 0,
+                  ref_key: "filterControl",
+                  ref: P,
+                  entity: "group",
+                  attributes: u.value.attributeOptions,
+                  rule: u.value.attributeRule,
+                  "onUpdate:rule": a[2] || (a[2] = (o) => b.sdk.group.setAttributeFilter(o))
+                }, null, 8, ["attributes", "rule"])) : y("", !0),
+                ql(s(Ee, {
+                  "column-defs": Gl.value,
+                  "column-visibility": { type: u.value.showType },
+                  draggable: Bl.value,
+                  "page-size": u.value.rows.length,
+                  "row-data": ge.value,
+                  "shrink-at": !1,
+                  "hide-footer": "",
+                  "pin-header-row": "",
+                  onDndChanged: Ml,
+                  onRowClick: a[3] || (a[3] = (o) => Xe(o.original))
+                }, null, 8, ["column-defs", "column-visibility", "draggable", "page-size", "row-data"]), [
+                  [t(va), t(l)("menu.group.list.columns.name")]
+                ])
+              ], 64)),
+              w.value && !e.catalogPage && !e.inCatalogEditor && u.value.filteredCount > 0 ? (i(), k(ra, { key: 2 }, {
+                default: d(() => [
+                  s(c, {
+                    disabled: u.value.create.state !== "allowed",
+                    label: t(l)("menu.group.actions.add"),
+                    "prepend-icon": "add",
+                    variant: "fab",
+                    onClick: De
+                  }, null, 8, ["disabled", "label"])
+                ]),
+                _: 1
+              })) : y("", !0)
+            ], 64)) : y("", !0),
+            ((te = n.value) == null ? void 0 : te.mode) === "update" ? (i(), k(Be, {
+              key: 5,
+              modelValue: ue.value,
+              "onUpdate:modelValue": a[14] || (a[14] = (o) => ue.value = o),
+              "is-container": t(h).FmForm,
+              "is-container-props": { onValidationSuccess: el },
+              "max-width": 800
+            }, {
+              "side-sheet-header": d(() => [
+                r("p", dt, _(t(l)("menu.group.update")), 1)
+              ]),
+              "side-sheet-footer": d(() => [
+                r("div", wt, [
+                  s(c, {
+                    disabled: n.value.submit.state !== "allowed",
+                    label: t(l)("menu.common.actions.update"),
+                    size: "lg",
+                    type: "submit"
+                  }, null, 8, ["disabled", "label"]),
+                  s(c, {
+                    label: t(l)("menu.common.actions.cancel"),
+                    size: "lg",
+                    variant: "tertiary",
+                    onClick: ve
+                  }, null, 8, ["label"])
+                ])
+              ]),
+              default: d(() => [
+                r("div", mt, [
+                  s(bl, null, {
+                    default: d(() => {
+                      var o;
+                      return [
+                        s(ne, ul({
+                          autofocus: "",
+                          disabled: n.value.fields.name.state !== "allowed",
+                          "error-messages": me.value ? [t(I)(me.value)] : [],
+                          label: t(l)("menu.common.labels.group_name"),
+                          "model-value": n.value.name
+                        }, t(J).field("name", m.value.setName)), {
+                          append: d(() => [
+                            s(ol, {
+                              placement: "top",
+                              variant: "plain",
+                              "z-index": 999
+                            }, {
+                              default: d(() => [
+                                s(c, {
+                                  "aria-label": t(l)("menu.group.translation.translate_name"),
+                                  disabled: n.value.fields.name.state !== "allowed",
+                                  icon: "g_translate",
+                                  variant: "tertiary",
+                                  onClick: Je
+                                }, null, 8, ["aria-label", "disabled"])
+                              ]),
+                              _: 1
+                            })
+                          ]),
+                          _: 1
+                        }, 16, ["disabled", "error-messages", "label", "model-value"]),
+                        s(_e, {
+                          "model-value": `${n.value.min} ${n.value.max}`
+                        }, {
+                          default: d(() => [
+                            s(yl, null, {
+                              default: d(() => [
+                                s(fe, {
+                                  class: "flex-1",
+                                  disabled: n.value.fields.bounds.state !== "allowed",
+                                  "helper-text": n.value.hidden ? t(l)("menu.common.labels.min_locked_while_hidden") : void 0,
+                                  label: t(l)("menu.common.labels.min_select"),
+                                  min: 0,
+                                  "model-value": n.value.min,
+                                  "onUpdate:modelValue": m.value.setMin
+                                }, null, 8, ["disabled", "helper-text", "label", "model-value", "onUpdate:modelValue"]),
+                                s(fe, {
+                                  class: "flex-1",
+                                  disabled: n.value.fields.bounds.state !== "allowed",
+                                  label: t(l)("menu.common.labels.max_select"),
+                                  min: n.value.min,
+                                  "model-value": n.value.max,
+                                  "onUpdate:modelValue": m.value.setMax
+                                }, null, 8, ["disabled", "label", "min", "model-value", "onUpdate:modelValue"])
+                              ]),
+                              _: 1
+                            })
+                          ]),
+                          _: 1
+                        }, 8, ["model-value"]),
+                        s(gl, {
+                          label: t(l)("menu.common.labels.configuration")
+                        }, {
+                          default: d(() => [
+                            r("div", ct, [
+                              s(ze, {
+                                disabled: n.value.fields.stackable.state !== "allowed",
+                                label: t(l)("menu.common.labels.stackable"),
+                                "label-placement": "right",
+                                "model-value": n.value.stackable,
+                                sublabel: t(l)("menu.common.labels.stackable_sublabel"),
+                                "onUpdate:modelValue": m.value.setStackable
+                              }, null, 8, ["disabled", "label", "model-value", "sublabel", "onUpdate:modelValue"]),
+                              n.value.hide.state !== "hidden" ? (i(), k(ze, {
+                                key: 0,
+                                disabled: n.value.hide.state !== "allowed",
+                                label: t(l)("menu.common.labels.hide_group"),
+                                "label-placement": "right",
+                                "model-value": n.value.hidden,
+                                sublabel: t(l)("menu.common.labels.hide_group_sublabel_catalog"),
+                                "onUpdate:modelValue": a[8] || (a[8] = (g) => m.value.setHidden(!!g))
+                              }, null, 8, ["disabled", "label", "model-value", "sublabel"])) : y("", !0)
+                            ])
+                          ]),
+                          _: 1
+                        }, 8, ["label"]),
+                        (o = n.value.tagging) != null && o.visible ? (i(), k(he, {
+                          key: 0,
+                          "sub-title": t(l)("menu.group.form.tagging.subtitle"),
+                          title: t(l)("menu.group.form.tagging.title")
+                        }, {
+                          default: d(() => [
+                            s(t(dl), {
+                              entity: "group",
+                              "model-value": n.value.customAttributes ?? {},
+                              "value-options": He(n.value.attributeValueOptions),
+                              "onUpdate:modelValue": a[9] || (a[9] = (g) => m.value.setCustomAttributes(g ?? null))
+                            }, null, 8, ["model-value", "value-options"])
+                          ]),
+                          _: 1
+                        }, 8, ["sub-title", "title"])) : y("", !0)
+                      ];
+                    }),
+                    _: 1
+                  }),
+                  n.value.hidden ? (i(), v("div", pt, [
+                    s(F, {
+                      class: "shrink-0",
+                      color: "system-warning-400",
+                      name: "visibility_off",
+                      outline: "",
+                      size: "sm"
+                    }),
+                    r("div", vt, [
+                      r("p", bt, _(t(l)("menu.common.labels.hide_group_notice")), 1),
+                      r("p", gt, _(t(l)("menu.common.labels.hide_group_notice_reset")), 1)
+                    ])
+                  ])) : y("", !0),
+                  s(_e, {
+                    class: xe(
+                      n.value.hidden ? "opacity-50 pointer-events-none" : void 0
+                    ),
+                    inert: n.value.hidden || void 0,
+                    tag: "div",
+                    "helper-text": t(l)("menu.common.validation.default_items_tip", {
+                      count: n.value.options.filter((o) => o.isDefault).length,
+                      max: n.value.max
+                    }),
+                    "model-value": n.value.options
+                  }, {
+                    default: d(() => [
+                      s(he, {
+                        class: "mb-8",
+                        "sub-title": n.value.linkOptions.state !== "hidden" ? t(l)("menu.group.option.subtitle") : "",
+                        title: t(l)("menu.group.option.title")
+                      }, {
+                        "append-title": d(() => [
+                          n.value.linkOptions.state !== "hidden" ? (i(), v("div", yt, [
+                            s(c, {
+                              disabled: n.value.linkOptions.state !== "allowed",
+                              "border-color": "primary",
+                              label: t(l)("menu.group.option.link_products"),
+                              "prepend-icon": "link",
+                              "text-color": "primary",
+                              variant: "secondary",
+                              onClick: a[10] || (a[10] = (o) => q.value = !0)
+                            }, null, 8, ["disabled", "label"])
+                          ])) : n.value.addOption.state !== "hidden" ? (i(), v("div", ft, [
+                            s(c, {
+                              disabled: n.value.addOption.state !== "allowed",
+                              "border-color": "primary",
+                              label: t(l)("menu.group.option.add_option"),
+                              "prepend-icon": "add",
+                              "text-color": "primary",
+                              variant: "secondary",
+                              onClick: a[11] || (a[11] = (o) => m.value.addOption())
+                            }, null, 8, ["disabled", "label"])
+                          ])) : y("", !0)
+                        ]),
+                        default: d(() => [
+                          r("div", _t, [
+                            r("div", kt, [
+                              s(Ee, {
+                                "column-defs": Ne.value,
+                                draggable: !w.value && Te.value.length > 1,
+                                "expanded-state": ce.value,
+                                "get-row-can-expand": (o) => o.depth === 0 && o.original.variants.length > 0,
+                                "get-row-id": (o) => o.target === "base" ? o.id : `${o.id}:${o.target}`,
+                                "page-size": Fl.value,
+                                "row-data": Te.value,
+                                "shrink-at": !1,
+                                "hide-footer": "",
+                                "onUpdate:expandedState": a[12] || (a[12] = (o) => ce.value = o),
+                                onDndChanged: a[13] || (a[13] = (o) => m.value.reorderOptions(
+                                  o.map((g) => g.id)
+                                ))
+                              }, null, 8, ["column-defs", "draggable", "expanded-state", "get-row-can-expand", "get-row-id", "page-size", "row-data"])
+                            ])
+                          ])
+                        ]),
+                        _: 1
+                      }, 8, ["sub-title", "title"])
+                    ]),
+                    _: 1
+                  }, 8, ["class", "inert", "helper-text", "model-value"]),
+                  (i(!0), v(S, null, N(Ye.value, (o, g) => (i(), v("p", {
+                    key: `${o.code}-${g}`,
+                    class: "fm-typo-en-body-sm-400 text-fm-color-status-error",
+                    role: "alert"
+                  }, _(t(I)(o)), 1))), 128))
+                ])
+              ]),
+              _: 1
+            }, 8, ["modelValue", "is-container", "is-container-props"])) : y("", !0),
+            s(Be, {
+              "model-value": Ve.value,
+              "is-container": t(h).FmForm,
+              "is-container-props": { onValidationSuccess: Ll },
+              "max-width": 560,
+              "onUpdate:modelValue": a[18] || (a[18] = (o) => !o && le())
+            }, {
+              "side-sheet-footer": d(() => {
+                var o;
+                return [
+                  r("div", Ft, [
+                    s(c, {
+                      disabled: ((o = E.value) == null ? void 0 : o.submit.state) !== "allowed",
+                      label: t(l)("menu.common.actions.save"),
+                      size: "lg",
+                      type: "submit"
+                    }, null, 8, ["disabled", "label"]),
+                    s(c, {
+                      label: t(l)("menu.common.actions.cancel"),
+                      size: "lg",
+                      variant: "tertiary",
+                      onClick: le
+                    }, null, 8, ["label"])
+                  ])
+                ];
+              }),
+              default: d(() => {
+                var o, g, Me;
+                return [
+                  U.value.status === "error" ? (i(), v("p", ht, _(t(I)(U.value.error.message)), 1)) : U.value.status === "unavailable" ? (i(), v("p", xt, _(t(I)(U.value.reason)), 1)) : U.value.status === "loading" ? (i(), k(x, { key: 2 })) : E.value ? (i(), k(Xl, {
+                    key: 3,
+                    "applied-count": ((o = E.value) == null ? void 0 : o.appliedProductCount) ?? 0,
+                    groups: ((g = E.value) == null ? void 0 : g.linkedGroups) ?? [],
+                    query: ((Me = E.value) == null ? void 0 : Me.linkedProductQuery) ?? "",
+                    title: t(l)("menu.group.option.title"),
+                    onUnapply: a[16] || (a[16] = (ke) => {
+                      var oe;
+                      return (oe = M.value) == null ? void 0 : oe.unlinkProduct(ke);
+                    }),
+                    "onUpdate:query": a[17] || (a[17] = (ke) => {
+                      var oe;
+                      return (oe = M.value) == null ? void 0 : oe.setLinkedProductQuery(ke);
+                    })
+                  }, {
+                    "append-title": d(() => [
+                      s(c, {
+                        label: t(l)("menu.group.actions.apply_product"),
+                        "prepend-icon": "link",
+                        variant: "secondary",
+                        onClick: a[15] || (a[15] = (ke) => Y.value = !0)
+                      }, null, 8, ["label"])
+                    ]),
+                    _: 1
+                  }, 8, ["applied-count", "groups", "query", "title"])) : y("", !0)
+                ];
+              }),
+              _: 1
+            }, 8, ["model-value", "is-container", "is-container-props"]),
+            U.value.status === "ready" ? (i(), k(vl, {
+              key: 6,
+              modelValue: Y.value,
+              "onUpdate:modelValue": a[19] || (a[19] = (o) => Y.value = o),
+              catalogue: qe.value,
+              "selected-product-ids": ((nl = E.value) == null ? void 0 : nl.linkedProductIds) ?? [],
+              title: t(l)("menu.common.actions.link_product"),
+              onSubmit: Nl
+            }, null, 8, ["modelValue", "catalogue", "selected-product-ids", "title"])) : y("", !0),
+            s(vl, {
+              modelValue: q.value,
+              "onUpdate:modelValue": a[20] || (a[20] = (o) => q.value = o),
+              catalogue: qe.value,
+              "selected-products": ((sl = n.value) == null ? void 0 : sl.optionLinks) ?? [],
+              "select-variant": !0,
+              title: t(l)("menu.group.option.link_products"),
+              onSubmitLinks: Al
+            }, null, 8, ["modelValue", "catalogue", "selected-products", "title"]),
+            Q.value && n.value ? (i(), k(da, {
+              key: 7,
+              dirty: n.value.translationDirty,
+              "model-value": !0,
+              name: n.value.name,
+              "name-locale": n.value.nameLocale,
+              "name-section-label": t(l)("menu.common.translation.name_section", {
+                entity: t(l)("menu.group.title")
+              }),
+              "supported-locales": n.value.supportedLocales,
+              title: t(l)("menu.group.translation.title"),
+              onDiscard: pe,
+              onSave: Sl,
+              "onUpdate:modelValue": a[21] || (a[21] = (o) => !o && pe()),
+              "onUpdate:name": a[22] || (a[22] = (o) => m.value.setName(o)),
+              "onUpdate:nameLocale": a[23] || (a[23] = (o) => m.value.setNameLocale(o))
+            }, null, 8, ["dirty", "name", "name-locale", "name-section-label", "supported-locales", "title"])) : y("", !0),
+            n.value ? (i(), k(Ra, {
+              key: 8,
+              "model-value": H.value,
+              session: m.value,
+              view: n.value,
+              onDiscard: Ae,
+              onSave: Tl
+            }, null, 8, ["model-value", "session", "view"])) : y("", !0),
+            X.value ? (i(), k(ta, {
+              key: 9,
+              session: X.value,
+              "on-create-price-group": Vl,
+              onClose: Ue
+            }, null, 8, ["session"])) : y("", !0),
+            Z.value ? (i(), k(t(Ce), {
+              key: 10,
+              "product-name": Pe.value,
+              session: Z.value,
+              onClose: Ie
+            }, null, 8, ["product-name", "session"])) : y("", !0),
+            s(oa, {
+              sdk: b.sdk,
+              session: de.value,
+              "currency-code": (il = n.value) == null ? void 0 : il.currencyCode,
+              onClose: be
+            }, null, 8, ["sdk", "session", "currency-code"]),
+            K.value && Le.value ? (i(), k(na, {
+              key: 11,
+              sdk: b.sdk,
+              onClose: ve,
+              onCreated: Il
+            }, null, 8, ["sdk"])) : y("", !0),
+            ((rl = n.value) == null ? void 0 : rl.mode) === "create" && !Le.value ? (i(), k(Be, {
+              key: 12,
+              modelValue: K.value,
+              "onUpdate:modelValue": a[27] || (a[27] = (o) => K.value = o),
+              "is-container": t(h).FmForm,
+              "is-container-props": { onValidationSuccess: el },
+              "max-width": 800
+            }, {
+              "side-sheet-header": d(() => [
+                r("p", Ct, _(t(l)("menu.group.add")), 1)
+              ]),
+              "side-sheet-footer": d(() => [
+                r("div", Pt, [
+                  s(c, {
+                    disabled: n.value.submit.state !== "allowed",
+                    label: t(l)("menu.common.actions.add"),
+                    size: "lg",
+                    type: "submit"
+                  }, null, 8, ["disabled", "label"]),
+                  s(c, {
+                    label: t(l)("menu.common.actions.cancel"),
+                    size: "lg",
+                    variant: "tertiary",
+                    onClick: ve
+                  }, null, 8, ["label"])
+                ])
+              ]),
+              default: d(() => [
+                r("div", $t, [
+                  s(bl, null, {
+                    default: d(() => {
+                      var o;
+                      return [
+                        s(ne, ul({
+                          autofocus: "",
+                          "error-messages": me.value ? [t(I)(me.value)] : [],
+                          label: t(l)("menu.common.labels.group_name"),
+                          "model-value": n.value.name
+                        }, t(J).field("name", m.value.setName)), {
+                          append: d(() => [
+                            s(ol, {
+                              placement: "top",
+                              variant: "plain",
+                              "z-index": 999
+                            }, {
+                              default: d(() => {
+                                var g;
+                                return [
+                                  s(c, {
+                                    "aria-label": t(l)("menu.group.translation.translate_name"),
+                                    disabled: ((g = n.value.translation) == null ? void 0 : g.state) !== "allowed",
+                                    icon: "g_translate",
+                                    variant: "tertiary",
+                                    onClick: Je
+                                  }, null, 8, ["aria-label", "disabled"])
+                                ];
+                              }),
+                              _: 1
+                            })
+                          ]),
+                          _: 1
+                        }, 16, ["error-messages", "label", "model-value"]),
+                        s(_e, {
+                          "model-value": `${n.value.min} ${n.value.max}`
+                        }, {
+                          default: d(() => [
+                            s(yl, null, {
+                              default: d(() => [
+                                s(fe, {
+                                  class: "flex-1",
+                                  label: t(l)("menu.common.labels.min_select"),
+                                  min: 0,
+                                  "model-value": n.value.min,
+                                  "onUpdate:modelValue": m.value.setMin
+                                }, null, 8, ["label", "model-value", "onUpdate:modelValue"]),
+                                s(fe, {
+                                  class: "flex-1",
+                                  label: t(l)("menu.common.labels.max_select"),
+                                  min: n.value.min,
+                                  "model-value": n.value.max,
+                                  "onUpdate:modelValue": m.value.setMax
+                                }, null, 8, ["label", "min", "model-value", "onUpdate:modelValue"])
+                              ]),
+                              _: 1
+                            })
+                          ]),
+                          _: 1
+                        }, 8, ["model-value"]),
+                        s(gl, {
+                          label: t(l)("menu.common.labels.configuration")
+                        }, {
+                          default: d(() => [
+                            s(ze, {
+                              label: t(l)("menu.common.labels.stackable"),
+                              "label-placement": "right",
+                              "model-value": n.value.stackable,
+                              sublabel: t(l)("menu.common.labels.stackable_sublabel"),
+                              "onUpdate:modelValue": m.value.setStackable
+                            }, null, 8, ["label", "model-value", "sublabel", "onUpdate:modelValue"])
+                          ]),
+                          _: 1
+                        }, 8, ["label"]),
+                        (o = n.value.tagging) != null && o.visible ? (i(), k(he, {
+                          key: 0,
+                          "sub-title": t(l)("menu.group.form.tagging.subtitle"),
+                          title: t(l)("menu.group.form.tagging.title")
+                        }, {
+                          default: d(() => [
+                            s(t(dl), {
+                              entity: "group",
+                              "model-value": n.value.customAttributes ?? {},
+                              "value-options": He(n.value.attributeValueOptions),
+                              "onUpdate:modelValue": a[24] || (a[24] = (g) => m.value.setCustomAttributes(g ?? null))
+                            }, null, 8, ["model-value", "value-options"])
+                          ]),
+                          _: 1
+                        }, 8, ["sub-title", "title"])) : y("", !0)
+                      ];
+                    }),
+                    _: 1
+                  }),
+                  s(_e, {
+                    tag: "div",
+                    "helper-text": t(l)("menu.common.validation.default_items_tip", {
+                      count: n.value.options.filter((o) => o.isDefault).length,
+                      max: n.value.max
+                    }),
+                    "model-value": n.value.options
+                  }, {
+                    default: d(() => [
+                      s(he, {
+                        class: "mb-8",
+                        "sub-title": t(l)("menu.group.option.subtitle"),
+                        title: t(l)("menu.group.option.title")
+                      }, {
+                        "append-title": d(() => [
+                          r("div", null, [
+                            s(c, {
+                              "border-color": "primary",
+                              label: t(l)("menu.group.option.link_products"),
+                              "prepend-icon": "link",
+                              "text-color": "primary",
+                              variant: "secondary",
+                              onClick: a[25] || (a[25] = (o) => q.value = !0)
+                            }, null, 8, ["label"])
+                          ])
+                        ]),
+                        default: d(() => [
+                          r("div", Vt, [
+                            r("div", Ot, [
+                              s(Ee, {
+                                "column-defs": Ul.value,
+                                draggable: !w.value && n.value.options.length > 1,
+                                "page-size": Math.max(n.value.options.length, 1),
+                                "row-data": [...n.value.options],
+                                "shrink-at": !1,
+                                "hide-footer": "",
+                                onDndChanged: a[26] || (a[26] = (o) => m.value.reorderOptions(
+                                  o.map((g) => g.id)
+                                ))
+                              }, null, 8, ["column-defs", "draggable", "page-size", "row-data"])
+                            ])
+                          ])
+                        ]),
+                        _: 1
+                      }, 8, ["sub-title", "title"])
+                    ]),
+                    _: 1
+                  }, 8, ["helper-text", "model-value"]),
+                  (i(!0), v(S, null, N(Ye.value, (o, g) => (i(), v("p", {
+                    key: `${o.code}-${g}`,
+                    class: "fm-typo-en-body-sm-400 text-fm-color-status-error",
+                    role: "alert"
+                  }, _(t(I)(o)), 1))), 128))
+                ])
+              ]),
+              _: 1
+            }, 8, ["modelValue", "is-container", "is-container-props"])) : y("", !0)
+          ];
+        }),
+        _: 3
+      }, 8, ["heading"]);
+    };
+  }
+});
+export {
+  Wt as _
+};