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

package/dist/Unit-Bn5UzMp1.js

@@ -0,0 +1,385 @@
+import { defineComponent as W, computed as f, ref as me, shallowRef as G, h as re, withModifiers as de, onUnmounted as ce, resolveComponent as g, openBlock as c, createBlock as M, unref as e, withCtx as S, createElementBlock as x, toDisplayString as V, Fragment as H, createElementVNode as d, createVNode as i, createCommentVNode as U, mergeProps as $, renderList as ve } from "vue";
+import { useI18n as pe } from "@feedmepos/mf-common";
+import { useDialog as be, components as J, FmButtonVariant as fe } from "@feedmepos/ui-library";
+import { _ as ye } from "./index.vue_vue_type_script_setup_true_lang-CGPDazqs.js";
+import { _ as _e } from "./ListCountTag.vue_vue_type_script_setup_true_lang-0bjk8Aly.js";
+import { _ as ge } from "./PageLayout.vue_vue_type_script_setup_true_lang-B3szUH39.js";
+import { u as he } from "./useActionFeedback-DoFeBFpl.js";
+import { u as ke } from "./useEditorValidation-Ctef5Bxt.js";
+import { b as xe, u as we, a as Fe } from "./provide-Tmjfji09.js";
+const Ce = {
+  key: 0,
+  class: "flex-1 flex justify-between gap-8 pl-8"
+}, Se = { class: "flex items-center" }, Ve = {
+  key: 0,
+  role: "alert",
+  class: "text-fm-color-typo-secondary"
+}, Me = {
+  key: 1,
+  class: "text-fm-color-typo-secondary"
+}, $e = { class: "flex justify-end items-center" }, Ie = { class: "w-[320px]" }, Ne = { class: "fm-typo-en-title-md-600" }, Ue = { class: "pt-8 space-y-40" }, Ee = { class: "flex flex-row gap-16" }, je = { class: "flex justify-between items-center" }, Ae = { class: "fm-typo-en-body-md-600" }, Be = { class: "flex flex-row gap-8" }, Pe = { class: "fm-typo-en-body-sm-400 text-fm-color-typo-secondary" }, ze = { class: "flex gap-8 items-center justify-start" }, De = /* @__PURE__ */ W({
+  __name: "UnitList",
+  props: {
+    sdk: {}
+  },
+  setup(E) {
+    const y = E, { t } = pe(), h = xe(), j = be(), { run: A } = he(), v = we(y.sdk.unit.list), r = f(
+      () => v.value.status === "ready" ? v.value.value : null
+    ), X = f(() => {
+      var a;
+      return ((a = r.value) == null ? void 0 : a.query) ?? "";
+    }), Y = f(() => {
+      var a;
+      return [...((a = r.value) == null ? void 0 : a.rows) ?? []];
+    }), p = me(!1), n = G(y.sdk.unit.editor()), w = G(
+      n.value.get()
+    );
+    let I = n.value.subscribe(
+      (a) => {
+        w.value = a;
+      }
+    );
+    const o = f(
+      () => w.value.status === "ready" ? w.value.value : null
+    ), b = ke(() => n.value), B = f(
+      () => o.value ? b.issue(o.value.fieldIssues, "name") ?? o.value.nameIssue : null
+    ), P = f(
+      () => o.value ? b.issue(o.value.fieldIssues, "symbol") ?? o.value.symbolIssue : null
+    );
+    function z(a) {
+      var _;
+      const l = a == null ? void 0 : a.match(/^(measurementName|measurementSymbol):(\d+)$/), u = l ? (_ = o.value) == null ? void 0 : _.measurements[Number(l[2]) - 1] : void 0;
+      return l && u ? `${l[1]}:${u.id}` : a;
+    }
+    const Z = f(
+      () => {
+        var a;
+        return Object.fromEntries(
+          Object.entries(((a = o.value) == null ? void 0 : a.fieldIssues) ?? {}).map(
+            ([l, u]) => [z(l), u]
+          )
+        );
+      }
+    );
+    function D(a, l, u) {
+      const _ = b.issue(Z.value, `${l}:${a}`) ?? u;
+      return _ ? [h(_)] : [];
+    }
+    function O(a) {
+      I(), n.value.dispose(), n.value = y.sdk.unit.editor(a), w.value = n.value.get(), I = n.value.subscribe(
+        (l) => {
+          w.value = l;
+        }
+      );
+    }
+    function R() {
+      var a;
+      ((a = r.value) == null ? void 0 : a.create.state) === "allowed" && (O(), p.value = !0);
+    }
+    function ee(a) {
+      O(a.id), p.value = !0;
+    }
+    async function ae() {
+      (await A(
+        () => b.submit(async () => {
+          const l = await n.value.submit();
+          return l.kind === "rejected" ? {
+            ...l,
+            issues: l.issues.map((u) => ({
+              ...u,
+              field: z(u.field)
+            }))
+          } : l;
+        }),
+        {
+          // `submit()` publishes `submitting` synchronously only when it will
+          // actually perform a write. A required-field rejection is decided locally
+          // and issues no request, and legacy showed no spinner for it — the frozen
+          // `unit/create/validation-rejected` and `unit/update/validation-rejected`
+          // groups record the inline message and no snackbar at all.
+          showLoading: () => {
+            var l;
+            return ((l = o.value) == null ? void 0 : l.status) === "submitting";
+          },
+          // The SDK returns the name it stored, so the toast renders the value that
+          // was actually written rather than a second trim of the draft.
+          successMessage: (l) => t("menu.unit.form.saved", { name: l.name })
+        }
+      )).kind === "success" && (p.value = !1);
+    }
+    function te() {
+      var a;
+      if (!((a = o.value) != null && a.dirty)) {
+        p.value = !1;
+        return;
+      }
+      j.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(() => {
+        p.value = !1;
+      });
+    }
+    function le(a) {
+      a.remove.state === "allowed" && j.open({
+        title: t("menu.common.dialog.remove.unit.title"),
+        message: t("menu.common.dialog.remove.unit.message", {
+          name: a.name
+        }),
+        primaryActions: {
+          text: t("menu.common.actions.remove"),
+          close: !0,
+          variant: fe.Destructive
+        },
+        secondaryActions: {
+          text: t("menu.common.actions.cancel"),
+          close: !0
+        }
+      }).onPrimary(async () => {
+        await A(() => y.sdk.unit.remove(a.id), {
+          successMessage: t("menu.unit.form.removed", { name: a.name })
+        });
+      });
+    }
+    const se = f(() => [
+      {
+        accessorKey: "name",
+        header: () => t("menu.unit.columns.name"),
+        enableSorting: !1
+      },
+      {
+        accessorKey: "symbol",
+        header: () => t("menu.unit.columns.symbol"),
+        enableSorting: !1
+      },
+      {
+        id: "actions",
+        size: 52,
+        meta: { cellClass: "pl-16", headerContentClass: "-mx-16" },
+        header: "",
+        cell: (a) => re(J.FmButton, {
+          icon: "delete",
+          variant: "tertiary",
+          textColor: "neutral-gray-400",
+          disabled: a.row.original.remove.state !== "allowed",
+          "aria-label": t("menu.common.actions.delete"),
+          onClick: de(
+            () => le(a.row.original),
+            ["stop", "prevent"]
+          )
+        })
+      }
+    ]);
+    return ce(() => {
+      I(), n.value.dispose();
+    }), (a, l) => {
+      const u = g("FmButton"), _ = g("FmCircularProgress"), oe = g("FmSearch"), ne = g("FmTable"), F = g("FmTextField"), ue = g("FmStepperField"), ie = g("FmSideSheet");
+      return c(), M(ge, {
+        "data-visual-root": "unit",
+        heading: e(t)("menu.unit.title")
+      }, {
+        "append-heading": S(() => [
+          e(v).status === "ready" && r.value ? (c(), x("div", Ce, [
+            d("div", Se, [
+              i(_e, {
+                value: r.value.totalCount
+              }, null, 8, ["value"])
+            ]),
+            r.value.totalCount > 0 ? (c(), M(u, {
+              key: 0,
+              disabled: r.value.create.state !== "allowed",
+              label: e(t)("menu.unit.add"),
+              "prepend-icon": "add",
+              onClick: R
+            }, null, 8, ["disabled", "label"])) : U("", !0)
+          ])) : U("", !0)
+        ]),
+        default: S(() => [
+          e(v).status === "error" ? (c(), x("p", Ve, V(e(h)(e(v).error.message)), 1)) : e(v).status === "unavailable" ? (c(), x("p", Me, V(e(h)(e(v).reason)), 1)) : e(v).status === "loading" ? (c(), M(_, { key: 2 })) : r.value && r.value.totalCount === 0 ? (c(), M(e(ye), {
+            key: 3,
+            action: { text: e(t)("menu.unit.add"), callback: R },
+            title: e(t)("menu.unit.empty.title"),
+            subtitle: e(t)("menu.unit.empty.subtitle")
+          }, null, 8, ["action", "title", "subtitle"])) : r.value ? (c(), x(H, { key: 4 }, [
+            d("div", $e, [
+              d("div", Ie, [
+                i(oe, {
+                  autofocus: "",
+                  class: "mb-8",
+                  "model-value": X.value,
+                  placeholder: e(t)("menu.unit.table.search.placeholder"),
+                  "onUpdate:modelValue": y.sdk.unit.search
+                }, null, 8, ["model-value", "placeholder", "onUpdate:modelValue"])
+              ])
+            ]),
+            i(ne, {
+              "column-defs": se.value,
+              "hide-footer": "",
+              "page-size": Math.max(r.value.rows.length, 1),
+              "pin-header-row": "",
+              "row-data": Y.value,
+              "shrink-at": !1,
+              onRowClick: l[0] || (l[0] = (m) => ee(m.original))
+            }, null, 8, ["column-defs", "page-size", "row-data"])
+          ], 64)) : U("", !0),
+          i(ie, {
+            modelValue: p.value,
+            "onUpdate:modelValue": l[4] || (l[4] = (m) => p.value = m),
+            "is-container": e(J).FmForm,
+            "is-container-props": { onValidationSuccess: ae },
+            "max-width": 560,
+            "onOn:clickedAway": te
+          }, {
+            "side-sheet-header": S(() => {
+              var m;
+              return [
+                d("p", Ne, V(((m = o.value) == null ? void 0 : m.mode) === "update" ? e(t)("menu.unit.update") : e(t)("menu.unit.add")), 1)
+              ];
+            }),
+            "side-sheet-footer": S(() => {
+              var m, C;
+              return [
+                d("div", ze, [
+                  i(u, {
+                    disabled: ((m = o.value) == null ? void 0 : m.submit.state) !== "allowed",
+                    label: ((C = o.value) == null ? void 0 : C.mode) === "update" ? e(t)("menu.common.actions.update") : e(t)("menu.common.actions.add"),
+                    size: "lg",
+                    type: "submit",
+                    variant: "primary"
+                  }, null, 8, ["disabled", "label"]),
+                  i(u, {
+                    label: e(t)("menu.common.actions.cancel"),
+                    size: "lg",
+                    variant: "tertiary",
+                    onClick: l[3] || (l[3] = (N) => p.value = !1)
+                  }, null, 8, ["label"])
+                ])
+              ];
+            }),
+            default: S(() => {
+              var m, C, N, T, L, K, q;
+              return [
+                d("div", Ue, [
+                  d("div", Ee, [
+                    i(F, $({
+                      class: "flex-2",
+                      "error-messages": B.value ? [e(h)(B.value)] : [],
+                      label: e(t)("menu.unit.columns.name"),
+                      "model-value": ((m = o.value) == null ? void 0 : m.name) ?? ""
+                    }, e(b).field("name", n.value.setName)), null, 16, ["error-messages", "label", "model-value"]),
+                    i(F, $({
+                      class: "flex-1",
+                      "error-messages": P.value ? [e(h)(P.value)] : [],
+                      label: e(t)("menu.unit.columns.symbol"),
+                      "model-value": ((C = o.value) == null ? void 0 : C.symbol) ?? ""
+                    }, e(b).field("symbol", n.value.setSymbol)), null, 16, ["error-messages", "label", "model-value"])
+                  ]),
+                  i(ue, {
+                    label: e(t)("menu.unit.precision"),
+                    max: (N = o.value) == null ? void 0 : N.precisionMax,
+                    min: (T = o.value) == null ? void 0 : T.precisionMin,
+                    "model-value": ((L = o.value) == null ? void 0 : L.precision) ?? 0,
+                    placeholder: e(t)("menu.unit.precision_placeholder"),
+                    step: 1,
+                    "onUpdate:modelValue": l[1] || (l[1] = (s) => n.value.setPrecision(Number(s)))
+                  }, null, 8, ["label", "max", "min", "model-value", "placeholder"]),
+                  i(u, {
+                    disabled: ((K = o.value) == null ? void 0 : K.addMeasurement.state) !== "allowed",
+                    label: e(t)("menu.unit.measurement.add"),
+                    variant: "secondary",
+                    onClick: l[2] || (l[2] = (s) => n.value.addMeasurement())
+                  }, null, 8, ["disabled", "label"]),
+                  (c(!0), x(H, null, ve(((q = o.value) == null ? void 0 : q.measurements) ?? [], (s) => {
+                    var Q;
+                    return c(), x("div", {
+                      key: s.id,
+                      class: "flex flex-col gap-8"
+                    }, [
+                      d("div", je, [
+                        d("p", Ae, V(e(t)("menu.unit.measurement.title", {
+                          number: s.position
+                        })), 1),
+                        i(u, {
+                          "aria-label": e(t)("menu.unit.measurement.remove", {
+                            number: s.position
+                          }),
+                          disabled: s.remove.state !== "allowed",
+                          icon: "delete",
+                          variant: "secondary",
+                          onClick: (k) => n.value.removeMeasurement(s.id)
+                        }, null, 8, ["aria-label", "disabled", "onClick"])
+                      ]),
+                      d("div", Be, [
+                        i(F, $(
+                          {
+                            "error-messages": D(
+                              s.id,
+                              "measurementName",
+                              s.nameIssue
+                            ),
+                            label: e(t)("menu.unit.measurement.name"),
+                            "model-value": s.name
+                          },
+                          { ref_for: !0 },
+                          e(b).field(
+                            `measurementName:${s.id}`,
+                            (k) => n.value.setMeasurementName(s.id, k)
+                          )
+                        ), null, 16, ["error-messages", "label", "model-value"]),
+                        i(F, $(
+                          {
+                            "error-messages": D(
+                              s.id,
+                              "measurementSymbol",
+                              s.symbolIssue
+                            ),
+                            label: e(t)("menu.unit.measurement.symbol"),
+                            "model-value": s.symbol
+                          },
+                          { ref_for: !0 },
+                          e(b).field(
+                            `measurementSymbol:${s.id}`,
+                            (k) => n.value.setMeasurementSymbol(s.id, k)
+                          )
+                        ), null, 16, ["error-messages", "label", "model-value"])
+                      ]),
+                      i(F, {
+                        label: e(t)("menu.unit.measurement.conversion"),
+                        "model-value": s.conversion,
+                        "onUpdate:modelValue": (k) => n.value.setMeasurementConversion(s.id, k)
+                      }, null, 8, ["label", "model-value", "onUpdate:modelValue"]),
+                      d("p", Pe, V(e(t)("menu.unit.measurement.preview_line", {
+                        name: s.name,
+                        value: s.conversionValue,
+                        unit: ((Q = o.value) == null ? void 0 : Q.name) ?? ""
+                      })), 1)
+                    ]);
+                  }), 128))
+                ])
+              ];
+            }),
+            _: 1
+          }, 8, ["modelValue", "is-container", "is-container-props"])
+        ]),
+        _: 1
+      }, 8, ["heading"]);
+    };
+  }
+}), Je = /* @__PURE__ */ W({
+  __name: "Unit",
+  setup(E) {
+    const y = Fe();
+    return (t, h) => (c(), M(De, { sdk: e(y) }, null, 8, ["sdk"]));
+  }
+});
+export {
+  Je as default
+};