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

package/dist/Ingredient-BHqz7kjQ.js

@@ -0,0 +1,463 @@
+import { defineComponent as ae, computed as p, ref as L, shallowRef as Y, h as Ue, withModifiers as Ve, onUnmounted as Be, resolveComponent as r, openBlock as m, createBlock as w, unref as e, withCtx as b, createElementBlock as f, toDisplayString as h, Fragment as U, createElementVNode as y, createVNode as u, createCommentVNode as V, mergeProps as Z, renderList as ee, createTextVNode as $e } from "vue";
+import { useRouter as Ae } from "vue-router";
+import { useI18n as Ne } from "@feedmepos/mf-common";
+import { useDialog as De, components as ne, FmButtonVariant as Le } from "@feedmepos/ui-library";
+import { _ as te } from "./index.vue_vue_type_script_setup_true_lang-CGPDazqs.js";
+import { _ as Ee } from "./BindingLinkDialog.vue_vue_type_script_setup_true_lang-BZVQRyRI.js";
+import { _ as le } from "./BindingTable.vue_vue_type_script_setup_true_lang-DBzjWI_6.js";
+import { _ as Te } from "./PageLayout.vue_vue_type_script_setup_true_lang-B3szUH39.js";
+import { u as ze } from "./useActionFeedback-DoFeBFpl.js";
+import { u as Re } from "./useEditorValidation-Ctef5Bxt.js";
+import { b as qe, u as Pe, a as Ke } from "./provide-Tmjfji09.js";
+const Oe = {
+  key: 0,
+  class: "flex-1 flex justify-between gap-8 pl-8"
+}, Qe = { class: "flex items-center" }, je = { class: "bg-fm-color-neutral-gray-100 rounded-md px-8 py-4" }, Ge = { class: "fm-typo-en-body-md-600" }, He = {
+  key: 0,
+  role: "alert",
+  class: "text-fm-color-typo-secondary"
+}, Je = {
+  key: 1,
+  class: "text-fm-color-typo-secondary"
+}, We = { class: "flex justify-end items-center" }, Xe = { class: "w-[320px]" }, Ye = { class: "fm-typo-en-title-md-600" }, Ze = {
+  key: 0,
+  class: "pt-8 flex flex-col gap-8"
+}, en = {
+  key: 1,
+  class: "pt-8 space-y-40"
+}, nn = { class: "flex flex-row gap-16" }, tn = { class: "overflow-x-hidden overflow-y-auto max-h-[300px]" }, ln = {
+  key: 0,
+  class: "fm-typo-en-body-sm-400 text-fm-color-system-error-500",
+  role: "alert"
+}, an = { class: "flex gap-8 items-center justify-start" }, on = /* @__PURE__ */ ae({
+  __name: "IngredientList",
+  props: {
+    sdk: {}
+  },
+  setup(E) {
+    const F = E, { t } = Ne(), x = qe(), T = De(), oe = Ae(), { run: z } = ze(), k = Pe(F.sdk.sku.list), v = p(
+      () => k.value.status === "ready" ? k.value.value : null
+    ), se = p(() => {
+      var n;
+      return ((n = v.value) == null ? void 0 : n.query) ?? "";
+    }), ue = p(() => {
+      var n;
+      return [...((n = v.value) == null ? void 0 : n.rows) ?? []];
+    }), g = L(!1), A = L(!1), B = L("recipe"), o = Y(F.sdk.sku.editor()), C = Y(
+      o.value.get()
+    );
+    let N = o.value.subscribe(
+      (n) => {
+        C.value = n;
+      }
+    );
+    const a = p(
+      () => C.value.status === "ready" ? C.value.value : null
+    ), d = Re(() => o.value), R = p(
+      () => a.value ? d.issue(a.value.fieldIssues, "name") ?? a.value.nameIssue : null
+    ), q = p(
+      () => a.value ? d.issue(a.value.fieldIssues, "code") ?? a.value.codeIssue : null
+    ), P = p(
+      () => a.value ? d.issue(a.value.fieldIssues, "convert") ?? a.value.formIssue : null
+    );
+    function K(n) {
+      var _;
+      const l = ((_ = a.value) == null ? void 0 : _.fieldIssues) ?? {};
+      return (n ?? []).map((I) => ({
+        ...I,
+        amountIssue: d.issue(l, `amount:${I.id}`) ?? I.amountIssue
+      }));
+    }
+    function O(n, l) {
+      d.field(
+        `amount:${n}`,
+        (_) => o.value.setBindingAmount(n, _)
+      )["onUpdate:modelValue"](l);
+    }
+    function Q(n) {
+      N(), o.value.dispose(), o.value = F.sdk.sku.editor(n), C.value = o.value.get(), N = o.value.subscribe(
+        (l) => {
+          C.value = l;
+        }
+      );
+    }
+    function j() {
+      var n;
+      ((n = v.value) == null ? void 0 : n.create.state) === "allowed" && (Q(), g.value = !0);
+    }
+    function ie(n) {
+      Q(n.id), g.value = !0;
+    }
+    async function me() {
+      (await z(
+        () => d.submit(() => o.value.submit()),
+        {
+          // A locally-decided rejection issues no request and legacy showed no
+          // spinner for it — the frozen `sku/create/validation-required` and
+          // `sku/create/duplicate-code` groups record an inline message and no
+          // snackbar at all.
+          showLoading: () => {
+            var l;
+            return ((l = a.value) == null ? void 0 : l.status) === "submitting";
+          },
+          successMessage: (l) => t("menu.sku.form.saved", { name: l.name })
+        }
+      )).kind === "success" && (g.value = !1);
+    }
+    function re() {
+      var n;
+      if (!((n = a.value) != null && n.dirty)) {
+        g.value = !1;
+        return;
+      }
+      T.open({
+        title: t("menu.common.dialog.dismiss.title"),
+        message: t("menu.common.dialog.dismiss.message"),
+        primaryActions: {
+          text: t("menu.common.dialog.dismiss.discard"),
+          close: !0
+        },
+        secondaryActions: {
+          text: t("menu.common.actions.cancel"),
+          close: !0
+        }
+      }).onPrimary(() => {
+        g.value = !1;
+      });
+    }
+    function de(n) {
+      n.remove.state === "allowed" && T.open({
+        title: t("menu.common.dialog.remove.ingredient.title"),
+        message: t("menu.common.dialog.remove.ingredient.message", {
+          name: n.name
+        }),
+        primaryActions: {
+          text: t("menu.common.actions.remove"),
+          close: !0,
+          variant: Le.Destructive
+        },
+        secondaryActions: {
+          text: t("menu.common.actions.cancel"),
+          close: !0
+        }
+      }).onPrimary(async () => {
+        await z(() => F.sdk.sku.remove(n.id), {
+          successMessage: t("menu.sku.form.removed", { name: n.name })
+        });
+      });
+    }
+    const ce = p(() => [
+      {
+        accessorKey: "code",
+        header: () => t("menu.ingredient.table.columns.code"),
+        enableSorting: !1
+      },
+      {
+        accessorKey: "name",
+        header: () => t("menu.ingredient.table.columns.name"),
+        enableSorting: !1
+      },
+      {
+        accessorKey: "unitName",
+        header: () => t("menu.ingredient.table.columns.unit"),
+        enableSorting: !1,
+        // The parenthesised pair is assembled by the i18n layer, never by a
+        // template expression (ADR-0003 §3).
+        cell: (n) => t("menu.sku.unit_option", {
+          name: n.row.original.unitName,
+          symbol: n.row.original.unitSymbol
+        })
+      },
+      {
+        id: "actions",
+        size: 52,
+        meta: { cellClass: "pl-16", headerContentClass: "-mx-16" },
+        header: "",
+        cell: (n) => Ue(ne.FmButton, {
+          icon: "delete",
+          variant: "tertiary",
+          textColor: "neutral-gray-400",
+          disabled: n.row.original.remove.state !== "allowed",
+          "aria-label": t("menu.common.actions.delete"),
+          onClick: Ve(
+            () => de(n.row.original),
+            ["stop", "prevent"]
+          )
+        })
+      }
+    ]), G = p(() => {
+      var n;
+      return ((n = a.value) == null ? void 0 : n.submit.state) !== "allowed";
+    }), ve = p(
+      () => {
+        var n, l;
+        return B.value === "recipe" ? ((n = a.value) == null ? void 0 : n.recipeCandidates) ?? [] : ((l = a.value) == null ? void 0 : l.ingredientCandidates) ?? [];
+      }
+    ), pe = p(
+      () => t("menu.inventory.binding.link.title", {
+        type: B.value === "recipe" ? t("menu.inventory.binding.link.recipe") : t("menu.inventory.binding.link.ingredient")
+      })
+    );
+    function be() {
+      g.value = !1, oe.push("/unit");
+    }
+    function H(n) {
+      B.value = n, o.value.setBindingCandidateQuery(""), A.value = !0;
+    }
+    return Be(() => {
+      N(), o.value.dispose();
+    }), (n, l) => {
+      const _ = r("FmButton"), I = r("FmCircularProgress"), fe = r("FmSearch"), ge = r("FmTable"), J = r("FmTextField"), ye = r("FmLabel"), ke = r("FmField"), _e = r("FmMenuHeader"), Fe = r("FmMenuDivider"), xe = r("FmMenuItem"), he = r("FmMenu"), we = r("FmFormGroup"), Ce = r("FmSwitch"), Ie = r("FmSelect"), Me = r("FmCard"), Se = r("FmSideSheet");
+      return m(), w(Te, {
+        "data-visual-root": "sku",
+        heading: e(t)("menu.ingredient.title")
+      }, {
+        "append-heading": b(() => [
+          e(k).status === "ready" && v.value ? (m(), f("div", Oe, [
+            y("div", Qe, [
+              y("div", je, [
+                y("p", Ge, h(v.value.totalCount), 1)
+              ])
+            ]),
+            v.value.totalCount > 0 ? (m(), w(_, {
+              key: 0,
+              disabled: v.value.create.state !== "allowed",
+              label: e(t)("menu.ingredient.actions.add"),
+              "prepend-icon": "add",
+              onClick: j
+            }, null, 8, ["disabled", "label"])) : V("", !0)
+          ])) : V("", !0)
+        ]),
+        default: b(() => {
+          var W;
+          return [
+            e(k).status === "error" ? (m(), f("p", He, h(e(x)(e(k).error.message)), 1)) : e(k).status === "unavailable" ? (m(), f("p", Je, h(e(x)(e(k).reason)), 1)) : e(k).status === "loading" ? (m(), w(I, { key: 2 })) : v.value && v.value.totalCount === 0 ? (m(), w(e(te), {
+              key: 3,
+              action: {
+                text: e(t)("menu.ingredient.empty.action"),
+                callback: j
+              },
+              title: e(t)("menu.ingredient.empty.title"),
+              subtitle: e(t)("menu.ingredient.empty.subtitle")
+            }, null, 8, ["action", "title", "subtitle"])) : v.value ? (m(), f(U, { key: 4 }, [
+              y("div", We, [
+                y("div", Xe, [
+                  u(fe, {
+                    autofocus: "",
+                    class: "mb-8",
+                    "model-value": se.value,
+                    placeholder: e(t)("menu.ingredient.table.search.placeholder"),
+                    "onUpdate:modelValue": F.sdk.sku.search
+                  }, null, 8, ["model-value", "placeholder", "onUpdate:modelValue"])
+                ])
+              ]),
+              u(ge, {
+                "column-defs": ce.value,
+                "hide-footer": "",
+                "page-size": Math.max(v.value.rows.length, 1),
+                "pin-header-row": "",
+                "row-data": ue.value,
+                "shrink-at": !1,
+                onRowClick: l[0] || (l[0] = (i) => ie(i.original))
+              }, null, 8, ["column-defs", "page-size", "row-data"])
+            ], 64)) : V("", !0),
+            u(Se, {
+              modelValue: g.value,
+              "onUpdate:modelValue": l[10] || (l[10] = (i) => g.value = i),
+              "is-container": e(ne).FmForm,
+              "is-container-props": { onValidationSuccess: me },
+              "max-width": 560,
+              "onOn:clickedAway": re
+            }, {
+              "side-sheet-header": b(() => {
+                var i;
+                return [
+                  y("p", Ye, h(((i = a.value) == null ? void 0 : i.mode) === "update" ? e(t)("menu.sku.update") : e(t)("menu.sku.add")), 1)
+                ];
+              }),
+              "side-sheet-footer": b(() => {
+                var i, M;
+                return [
+                  y("div", an, [
+                    u(_, {
+                      disabled: ((i = a.value) == null ? void 0 : i.submit.state) !== "allowed",
+                      label: ((M = a.value) == null ? void 0 : M.mode) === "update" ? e(t)("menu.common.actions.update") : e(t)("menu.common.actions.add"),
+                      size: "lg",
+                      type: "submit",
+                      variant: "primary"
+                    }, null, 8, ["disabled", "label"]),
+                    u(_, {
+                      label: e(t)("menu.common.actions.cancel"),
+                      size: "lg",
+                      variant: "tertiary",
+                      onClick: l[9] || (l[9] = (D) => g.value = !1)
+                    }, null, 8, ["label"])
+                  ])
+                ];
+              }),
+              default: b(() => {
+                var i, M, D, X;
+                return [
+                  (i = a.value) != null && i.noUnits ? (m(), f("div", Ze, [
+                    u(e(te), {
+                      action: { text: e(t)("menu.unit.add"), callback: be },
+                      title: e(t)("menu.sku.empty.no_unit"),
+                      subtitle: e(t)("menu.sku.empty.subtitle")
+                    }, null, 8, ["action", "title", "subtitle"])
+                  ])) : (m(), f("div", en, [
+                    y("div", nn, [
+                      u(J, Z({
+                        class: "flex-2",
+                        "error-messages": q.value ? [e(x)(q.value)] : [],
+                        label: e(t)("menu.sku.columns.code"),
+                        "model-value": ((M = a.value) == null ? void 0 : M.code) ?? ""
+                      }, e(d).field("code", o.value.setCode)), null, 16, ["error-messages", "label", "model-value"]),
+                      u(J, Z({
+                        class: "flex-1",
+                        "error-messages": R.value ? [e(x)(R.value)] : [],
+                        label: e(t)("menu.sku.columns.name"),
+                        "model-value": ((D = a.value) == null ? void 0 : D.name) ?? ""
+                      }, e(d).field("name", o.value.setName)), null, 16, ["error-messages", "label", "model-value"])
+                    ]),
+                    u(we, {
+                      class: "col-span-2",
+                      "label-mark": "required",
+                      "model-value": ((X = a.value) == null ? void 0 : X.selectedUnitName) ?? ""
+                    }, {
+                      label: b(() => [
+                        u(ye, {
+                          label: e(t)("menu.sku.columns.unit")
+                        }, null, 8, ["label"])
+                      ]),
+                      default: b(({ invalid: $ }) => [
+                        u(he, { "z-index": 101 }, {
+                          "menu-button": b(() => [
+                            u(ke, {
+                              class: "fm-typo-en-body-lg-400 text-fm-color-typo-primary",
+                              invalid: $,
+                              "append-icon": "expand_more"
+                            }, {
+                              default: b(() => [
+                                $e(h(a.value ? e(t)("menu.sku.unit_option", {
+                                  name: a.value.selectedUnitName,
+                                  symbol: a.value.selectedUnitSymbol
+                                }) : ""), 1)
+                              ]),
+                              _: 2
+                            }, 1032, ["invalid"])
+                          ]),
+                          default: b(() => {
+                            var S;
+                            return [
+                              y("div", tn, [
+                                (m(!0), f(U, null, ee(((S = a.value) == null ? void 0 : S.unitGroups) ?? [], (s) => (m(), f(U, {
+                                  key: s.unitId
+                                }, [
+                                  u(_e, {
+                                    label: s.name
+                                  }, null, 8, ["label"]),
+                                  u(Fe),
+                                  (m(!0), f(U, null, ee(s.options, (c) => (m(), w(xe, {
+                                    key: `${c.unitId}:${c.measurementId ?? "base"}`,
+                                    label: e(t)("menu.sku.unit_option", {
+                                      name: c.name,
+                                      symbol: c.symbol
+                                    }),
+                                    "model-value": c.selected,
+                                    "x-should-scroll-into": `${c.selected}`,
+                                    onClick: (sn) => o.value.selectUnit(
+                                      c.unitId,
+                                      c.measurementId
+                                    )
+                                  }, null, 8, ["label", "model-value", "x-should-scroll-into", "onClick"]))), 128))
+                                ], 64))), 128))
+                              ])
+                            ];
+                          }),
+                          _: 2
+                        }, 1024)
+                      ]),
+                      _: 1
+                    }, 8, ["model-value"]),
+                    u(Me, {
+                      variant: "outlined",
+                      class: "p-16 flex flex-col gap-16"
+                    }, {
+                      default: b(() => {
+                        var $, S;
+                        return [
+                          u(Ce, {
+                            value: "",
+                            label: e(t)("menu.sku.convertible.label"),
+                            "model-value": (($ = a.value) == null ? void 0 : $.convertible) ?? !1,
+                            sublabel: e(t)("menu.sku.convertible.sublabel"),
+                            "label-placement": "right",
+                            "onUpdate:modelValue": l[1] || (l[1] = (s) => (e(d).touch("convert"), o.value.setConvertible(s)))
+                          }, null, 8, ["label", "model-value", "sublabel"]),
+                          (S = a.value) != null && S.convertible ? (m(), f(U, { key: 0 }, [
+                            u(Ie, {
+                              items: a.value.convertOptions.map((s) => ({
+                                label: e(t)("menu.sku.convert_option", {
+                                  name: s.name,
+                                  symbol: s.symbol
+                                }),
+                                value: s.measurementId
+                              })),
+                              label: e(t)("menu.sku.convertible.convert_to"),
+                              "model-value": a.value.convertMeasurementId,
+                              "onUpdate:modelValue": l[2] || (l[2] = (s) => o.value.selectConvertMeasurement(s))
+                            }, null, 8, ["items", "label", "model-value"]),
+                            u(le, {
+                              kind: "recipe",
+                              disabled: G.value,
+                              rows: K(a.value.recipeBindings),
+                              onLink: l[3] || (l[3] = (s) => H("recipe")),
+                              onRemove: l[4] || (l[4] = (s) => (e(d).touch("convert"), o.value.removeBinding(s))),
+                              onUpdateAmount: O,
+                              onUpdateMeasurement: l[5] || (l[5] = (s, c) => o.value.setBindingMeasurement(s, c))
+                            }, null, 8, ["disabled", "rows"]),
+                            u(le, {
+                              kind: "ingredient",
+                              disabled: G.value,
+                              rows: K(a.value.ingredientBindings),
+                              onLink: l[6] || (l[6] = (s) => H("ingredient")),
+                              onRemove: l[7] || (l[7] = (s) => (e(d).touch("convert"), o.value.removeBinding(s))),
+                              onUpdateAmount: O,
+                              onUpdateMeasurement: l[8] || (l[8] = (s, c) => o.value.setBindingMeasurement(s, c))
+                            }, null, 8, ["disabled", "rows"]),
+                            P.value ? (m(), f("p", ln, h(e(x)(P.value)), 1)) : V("", !0)
+                          ], 64)) : V("", !0)
+                        ];
+                      }),
+                      _: 1
+                    })
+                  ]))
+                ];
+              }),
+              _: 1
+            }, 8, ["modelValue", "is-container", "is-container-props"]),
+            u(Ee, {
+              modelValue: A.value,
+              "onUpdate:modelValue": l[11] || (l[11] = (i) => A.value = i),
+              candidates: ve.value,
+              query: ((W = a.value) == null ? void 0 : W.bindingCandidateQuery) ?? "",
+              title: pe.value,
+              "onUpdate:query": l[12] || (l[12] = (i) => o.value.setBindingCandidateQuery(i)),
+              onSubmit: l[13] || (l[13] = (i) => (e(d).touch("convert"), o.value.linkBindings(B.value, i)))
+            }, null, 8, ["modelValue", "candidates", "query", "title"])
+          ];
+        }),
+        _: 1
+      }, 8, ["heading"]);
+    };
+  }
+}), kn = /* @__PURE__ */ ae({
+  __name: "Ingredient",
+  setup(E) {
+    const F = Ke();
+    return (t, x) => (m(), w(on, { sdk: e(F) }, null, 8, ["sdk"]));
+  }
+});
+export {
+  kn as default
+};