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

package/dist/ProductVariantTranslationSheet.vue_vue_type_script_setup_true_lang-ClG3Prfm.js

@@ -0,0 +1,218 @@
+import { defineComponent as D, computed as P, ref as U, resolveComponent as k, openBlock as r, createBlock as R, withCtx as V, createElementBlock as i, createVNode as d, createElementVNode as a, normalizeClass as F, toDisplayString as m, unref as t, Fragment as w, renderList as C, createCommentVNode as _ } from "vue";
+import { a as j, _ as x, b as z } from "./TranslationLanguageSelector.vue_vue_type_script_setup_true_lang-BJZ6VcrT.js";
+import { useI18n as M } from "@feedmepos/mf-common";
+import { useDialog as T } from "@feedmepos/ui-library";
+import { u as q } from "./provide-Tmjfji09.js";
+const G = { class: "fm-typo-en-title-md-600" }, H = {
+  key: 0,
+  class: "pt-8 space-y-24"
+}, J = { class: "flex flex-col gap-16 border p-16 rounded-lg" }, K = ["aria-expanded"], Q = { class: "fm-typo-en-body-lg-600" }, W = {
+  key: 0,
+  class: "flex flex-col gap-32 pl-32"
+}, X = { class: "fm-typo-en-body-sm-600 text-fm-color-typo-secondary border inline-block rounded-full px-8 py-4 mb-8" }, Y = {
+  key: 0,
+  class: "space-y-8"
+}, Z = { class: "fm-typo-en-body-sm-600 text-fm-color-typo-secondary border inline-block rounded-full px-8 py-4 mb-8" }, ee = { class: "flex w-[100px] items-center gap-8" }, ae = { class: "fm-typo-en-body-md-400" }, oe = { class: "flex-1" }, le = { class: "flex flex-col gap-16 border p-16 rounded-lg" }, ne = ["aria-expanded"], te = { class: "fm-typo-en-body-lg-600" }, se = {
+  key: 0,
+  class: "flex flex-col gap-32 pl-32"
+}, re = { class: "fm-typo-en-body-md-600 text-fm-color-primary border border-fm-color-primary inline-block rounded-md px-8 py-4" }, ie = { class: "space-y-32" }, de = { class: "fm-typo-en-body-sm-600 text-fm-color-typo-secondary border inline-block rounded-full px-8 py-4 mb-4" }, me = { class: "-mt-px" }, ce = {
+  key: 0,
+  class: "space-y-8"
+}, ue = { class: "fm-typo-en-body-sm-600 text-fm-color-typo-secondary border inline-block rounded-full px-8 py-4 mb-4" }, pe = { class: "flex w-[100px] items-center gap-8" }, ve = { class: "fm-typo-en-body-md-400" }, fe = { class: "flex-1" }, _e = { class: "flex gap-8 items-center justify-start" }, ke = /* @__PURE__ */ D({
+  __name: "ProductVariantTranslationSheet",
+  props: {
+    session: {},
+    expandedSection: {}
+  },
+  emits: ["close", "save"],
+  setup(B, { emit: $ }) {
+    const g = B, y = $, { t: o } = M(), A = T(), L = q(g.session), l = P(
+      () => L.value.status === "ready" ? L.value.value : null
+    ), h = (s) => {
+      var n, f;
+      return ((f = (n = l.value) == null ? void 0 : n.supportedLocales.find((b) => b.code === s)) == null ? void 0 : f.name) ?? s;
+    }, p = U(g.expandedSection === "variant"), v = U(g.expandedSection === "options");
+    function S() {
+      var s;
+      if (!((s = l.value) != null && s.dirty)) {
+        y("close");
+        return;
+      }
+      A.open({
+        title: o("menu.common.dialog.dismiss.title"),
+        zIndex: 201,
+        message: o("menu.common.dialog.dismiss.message"),
+        primaryActions: {
+          text: o("menu.common.dialog.dismiss.discard"),
+          close: !0,
+          variant: "primary"
+        },
+        secondaryActions: {
+          text: o("menu.common.actions.cancel"),
+          close: !0
+        }
+      }).onPrimary(() => y("close"));
+    }
+    function E() {
+      y("save");
+    }
+    return (s, n) => {
+      const f = k("FmIcon"), b = k("FmButton"), I = k("FmSideSheet");
+      return r(), R(I, {
+        "is-container-props": { class: "variant-translation-sheet" },
+        "model-value": !0,
+        "max-width": 720,
+        "onOn:clickedAway": S,
+        "onUpdate:modelValue": n[5] || (n[5] = (e) => e || y("close"))
+      }, {
+        "side-sheet-header": V(() => [
+          a("p", G, m(t(o)("menu.variant.form.translation.title")), 1)
+        ]),
+        "side-sheet-footer": V(() => [
+          a("div", _e, [
+            d(b, {
+              label: t(o)("menu.common.actions.save"),
+              size: "lg",
+              variant: "primary",
+              onClick: E
+            }, null, 8, ["label"]),
+            d(b, {
+              label: t(o)("menu.common.actions.cancel"),
+              size: "lg",
+              variant: "tertiary",
+              onClick: S
+            }, null, 8, ["label"])
+          ])
+        ]),
+        default: V(() => [
+          l.value ? (r(), i("div", H, [
+            d(j, {
+              selected: l.value.locales.map((e) => ({
+                code: e,
+                name: h(e)
+              })),
+              available: l.value.supportedLocales.filter(
+                (e) => !l.value.locales.includes(e.code)
+              ),
+              "menu-z-index": 201,
+              onAdd: n[0] || (n[0] = (e) => s.session.setLocales([...l.value.locales, e])),
+              onRemove: n[1] || (n[1] = (e) => s.session.setLocales(l.value.locales.filter((u) => u !== e)))
+            }, null, 8, ["selected", "available"]),
+            a("div", J, [
+              a("button", {
+                class: "flex items-center gap-16 cursor-pointer",
+                type: "button",
+                "aria-expanded": p.value,
+                onClick: n[2] || (n[2] = (e) => p.value = !p.value)
+              }, [
+                d(f, {
+                  name: "keyboard_arrow_down",
+                  class: F(["transition-transform", { "transform rotate-180": p.value }])
+                }, null, 8, ["class"]),
+                a("p", Q, m(t(o)("menu.variant.form.translation.variant_name")), 1)
+              ], 8, K),
+              p.value ? (r(), i("div", W, [
+                a("div", null, [
+                  a("p", X, m(t(o)("menu.variant.form.translation.default")), 1),
+                  d(x, {
+                    "model-value": l.value.name,
+                    "aria-label": t(o)("menu.variant.form.translation.default_name"),
+                    "onUpdate:modelValue": n[3] || (n[3] = (e) => s.session.setName(e))
+                  }, null, 8, ["model-value", "aria-label"])
+                ]),
+                l.value.locales.length ? (r(), i("div", Y, [
+                  a("p", Z, m(t(o)("menu.variant.form.translation.translation")), 1),
+                  (r(!0), i(w, null, C(l.value.locales, (e) => (r(), i("div", {
+                    key: e,
+                    class: "flex gap-16 items-center"
+                  }, [
+                    a("div", ee, [
+                      d(z, { code: e }, null, 8, ["code"]),
+                      a("span", ae, m(h(e)), 1)
+                    ]),
+                    a("div", oe, [
+                      d(x, {
+                        "aria-label": t(o)("menu.variant.form.translation.name_translation", {
+                          language: e
+                        }),
+                        "model-value": l.value.nameLocale[e] ?? "",
+                        placeholder: l.value.name,
+                        "onUpdate:modelValue": (u) => s.session.setNameLocale(e, u)
+                      }, null, 8, ["aria-label", "model-value", "placeholder", "onUpdate:modelValue"])
+                    ])
+                  ]))), 128))
+                ])) : _("", !0)
+              ])) : _("", !0)
+            ]),
+            a("div", le, [
+              a("button", {
+                class: "flex items-center gap-16 cursor-pointer",
+                type: "button",
+                "aria-expanded": v.value,
+                onClick: n[4] || (n[4] = (e) => v.value = !v.value)
+              }, [
+                d(f, {
+                  name: "keyboard_arrow_down",
+                  class: F(["transition-transform", { "transform rotate-180": v.value }])
+                }, null, 8, ["class"]),
+                a("p", te, m(t(o)("menu.variant.form.translation.option_value")), 1)
+              ], 8, ne),
+              v.value ? (r(), i("div", se, [
+                (r(!0), i(w, null, C(l.value.options, (e, u) => (r(), i("div", {
+                  key: e.id,
+                  class: "space-y-8"
+                }, [
+                  a("p", re, m(t(o)("menu.variant.form.translation.option", { number: u + 1 })), 1),
+                  a("div", ie, [
+                    a("div", null, [
+                      a("p", de, m(t(o)("menu.variant.form.translation.default")), 1),
+                      a("div", me, [
+                        d(x, {
+                          "aria-label": t(o)("menu.variant.form.translation.option_default", {
+                            number: u + 1
+                          }),
+                          "model-value": e.name,
+                          "onUpdate:modelValue": (c) => s.session.setOptionName(e.id, c)
+                        }, null, 8, ["aria-label", "model-value", "onUpdate:modelValue"])
+                      ])
+                    ]),
+                    l.value.locales.length ? (r(), i("div", ce, [
+                      a("p", ue, m(t(o)("menu.variant.form.translation.translation")), 1),
+                      (r(!0), i(w, null, C(l.value.locales, (c) => {
+                        var N;
+                        return r(), i("div", {
+                          key: c,
+                          class: "flex gap-16 items-center"
+                        }, [
+                          a("div", pe, [
+                            d(z, { code: c }, null, 8, ["code"]),
+                            a("span", ve, m(h(c)), 1)
+                          ]),
+                          a("div", fe, [
+                            d(x, {
+                              "aria-label": t(o)("menu.variant.form.translation.option_translation", {
+                                number: u + 1,
+                                language: c
+                              }),
+                              "model-value": ((N = e.nameLocale) == null ? void 0 : N[c]) ?? "",
+                              placeholder: e.name,
+                              "onUpdate:modelValue": (O) => s.session.setOptionNameLocale(e.id, c, O)
+                            }, null, 8, ["aria-label", "model-value", "placeholder", "onUpdate:modelValue"])
+                          ])
+                        ]);
+                      }), 128))
+                    ])) : _("", !0)
+                  ])
+                ]))), 128))
+              ])) : _("", !0)
+            ])
+          ])) : _("", !0)
+        ]),
+        _: 1
+      });
+    };
+  }
+});
+export {
+  ke as _
+};

package/dist/Products-7vlFJB0P.js

@@ -0,0 +1,155 @@
+import { defineComponent as M, ref as B, computed as g, resolveComponent as U, openBlock as p, createBlock as F, unref as t, withCtx as _, createElementVNode as v, toDisplayString as y, createVNode as l, createElementBlock as $, Fragment as S, createCommentVNode as x } from "vue";
+import { _ as z } from "./ProductList.vue_vue_type_script_setup_true_lang-n_UYIwwt.js";
+import { useI18n as E } from "@feedmepos/mf-common";
+import { components as m } from "@feedmepos/ui-library";
+import { u as H } from "./useActionFeedback-DoFeBFpl.js";
+import { u as O } from "./useEditorValidation-Ctef5Bxt.js";
+import { b as P, u as D, a as R } from "./provide-Tmjfji09.js";
+const q = { class: "flex justify-end gap-8" }, G = /* @__PURE__ */ M({
+  __name: "V3ToV4MigrationConfirmDialog",
+  props: {
+    sdk: {}
+  },
+  emits: ["cancel", "submit"],
+  setup(f, { emit: r }) {
+    const i = f, c = m.FmButton, k = m.FmForm, u = m.FmTextField, d = r, { t: n } = E(), b = P(), { run: V } = H(), o = D(i.sdk.v3ToV4Migration.view), a = B(""), T = O(() => i.sdk.v3ToV4Migration), I = g(() => {
+      const e = i.sdk.v3ToV4Migration.validateConfirmation(a.value);
+      return e ? { confirmation: [e] } : {};
+    }), w = g(
+      () => T.issue(I.value, "confirmation")
+    );
+    function N(e) {
+      const s = e == null ? void 0 : e.inputEl;
+      s instanceof HTMLInputElement && s.setAttribute(
+        "aria-label",
+        n("menu.v3_to_v4_migration.confirmation.label")
+      );
+    }
+    const j = g(
+      () => o.value.status === "ready" ? o.value.value.status : "idle"
+    );
+    async function A() {
+      const e = i.sdk.v3ToV4Migration.validateConfirmation(a.value);
+      if (e) {
+        T.submit(
+          async () => ({ kind: "rejected", issues: [e] })
+        );
+        return;
+      }
+      d("submit"), (await V(
+        () => i.sdk.v3ToV4Migration.migrate(a.value),
+        {
+          showLoading: () => j.value === "submitting",
+          loadingTitle: n("menu.v3_to_v4_migration.pending"),
+          loadingMessage: n("menu.common.loading"),
+          successMessage: n("menu.v3_to_v4_migration.success")
+        }
+      )).kind === "success" && window.setTimeout(() => window.location.reload(), 2e3);
+    }
+    return (e, s) => {
+      const L = U("i18n-t");
+      return p(), F(t(k), {
+        class: "space-y-24 mb-24",
+        "on-validation-success": A
+      }, {
+        default: _(() => [
+          v("div", null, y(t(n)("menu.v3_to_v4_migration.description")), 1),
+          v("div", null, [
+            l(L, {
+              keypath: "menu.v3_to_v4_migration.confirmation.instruction",
+              tag: "span"
+            }, {
+              value: _(() => [
+                v("b", null, y(e.sdk.v3ToV4Migration.confirmationValue), 1)
+              ]),
+              _: 1
+            })
+          ]),
+          l(t(u), {
+            ref: N,
+            modelValue: a.value,
+            "onUpdate:modelValue": s[0] || (s[0] = (C) => a.value = C),
+            placeholder: e.sdk.v3ToV4Migration.confirmationValue,
+            "error-messages": w.value ? [t(b)(w.value)] : []
+          }, null, 8, ["modelValue", "placeholder", "error-messages"]),
+          v("div", q, [
+            l(t(c), {
+              type: "button",
+              variant: "secondary",
+              label: t(n)("menu.common.actions.cancel"),
+              onClick: s[1] || (s[1] = (C) => d("cancel"))
+            }, null, 8, ["label"]),
+            l(t(c), {
+              type: "submit",
+              label: t(n)("menu.common.actions.confirm")
+            }, null, 8, ["label"])
+          ])
+        ]),
+        _: 1
+      });
+    };
+  }
+}), J = /* @__PURE__ */ M({
+  __name: "V3ToV4MigrationBanner",
+  props: {
+    sdk: {}
+  },
+  setup(f) {
+    const r = f, i = m.FmButton, c = m.FmDialog, k = m.FmSnackbar, { t: u } = E(), d = D(r.sdk.v3ToV4Migration.view), n = B(!1), b = g(
+      () => d.value.status === "ready" && d.value.value.capability.state === "allowed"
+    );
+    return (V, o) => (p(), $(S, null, [
+      b.value ? (p(), F(t(k), {
+        key: 0,
+        "z-index": 0,
+        class: "!max-w-full",
+        variant: "info",
+        title: t(u)("menu.v3_to_v4_migration.notification.title"),
+        description: t(u)("menu.v3_to_v4_migration.notification.description")
+      }, {
+        actions: _(() => [
+          l(t(i), {
+            class: "!translate-y-2 !px-0",
+            variant: "plain",
+            "text-color": "system-info-300",
+            label: t(u)("menu.v3_to_v4_migration.notification.action"),
+            "aria-label": t(u)("menu.v3_to_v4_migration.notification.action"),
+            onClick: o[0] || (o[0] = (a) => n.value = !0)
+          }, null, 8, ["label", "aria-label"])
+        ]),
+        _: 1
+      }, 8, ["title", "description"])) : x("", !0),
+      l(t(c), {
+        "model-value": n.value,
+        overlay: !0,
+        "max-width": 560,
+        "onUpdate:modelValue": o[3] || (o[3] = (a) => n.value = a)
+      }, {
+        "dialog-header": _(() => [
+          v("span", null, y(t(u)("menu.v3_to_v4_migration.title")), 1)
+        ]),
+        default: _(() => [
+          n.value ? (p(), F(G, {
+            key: 0,
+            sdk: V.sdk,
+            onCancel: o[1] || (o[1] = (a) => n.value = !1),
+            onSubmit: o[2] || (o[2] = (a) => n.value = !1)
+          }, null, 8, ["sdk"])) : x("", !0)
+        ]),
+        _: 1
+      }, 8, ["model-value"])
+    ], 64));
+  }
+}), tt = /* @__PURE__ */ M({
+  __name: "Products",
+  setup(f) {
+    const r = R();
+    return (i, c) => (p(), $(S, null, [
+      l(J, { sdk: t(r) }, null, 8, ["sdk"]),
+      l(z, { sdk: t(r) }, null, 8, ["sdk"])
+    ], 64));
+  }
+});
+export {
+  tt as default
+};