@feedmepos/mf-hrm-portal 1.1.3-dev → 1.1.3-dev.10

package/dist/TeamMemberList-BDB9zWwa.js

@@ -0,0 +1,965 @@
+import { defineComponent as le, ref as x, resolveComponent as h, createBlock as I, openBlock as f, withCtx as E, createElementVNode as i, renderSlot as ve, createCommentVNode as q, withModifiers as we, nextTick as ke, createElementBlock as L, normalizeClass as $e, createTextVNode as Pe, toDisplayString as B, computed as P, Fragment as ie, renderList as be, createVNode as u, unref as r, watch as Ie, isRef as ye, createSlots as Oe } from "vue";
+import { useI18n as ue, useCoreStore as me, baseClientInstance as _e, RestaurantSelector as ge } from "@feedmepos/mf-common";
+import { useBreakpoints as Re, useSnackbar as Me, useDialog as Ae, components as Ve } from "@feedmepos/ui-library";
+import { _ as Ee, S as xe } from "./SelectFilter-NbXrJ4iH.js";
+import { s as Le, w as je, _ as Te } from "./app-C04LPGZa.js";
+import { _ as ze } from "./index.vue_vue_type_script_setup_true_lang-Vc5ARO29.js";
+import { u as Ce } from "./useSearch-B6WK1LBB.js";
+import { u as Ke } from "./useLoading-gYEFsA3E.js";
+import { g as Fe, l as Ne, u as Be, m as qe, n as Ge, o as ce, v as Ue, w as We, x as Je, y as Qe, t as pe } from "./index-CIz_Nsy5.js";
+import "./index-DGq_eY85.js";
+import { u as De } from "./useAppStore-CWtHdJdl.js";
+/* empty css                                                                            */
+import { _ as Xe, a as Ye } from "./PortalPermissionEditor.vue_vue_type_script_setup_true_lang-nbk54pp5.js";
+import { u as Ze } from "./team-CSB4_BXX.js";
+const He = /* @__PURE__ */ le({
+  __name: "BottomSheetMenu",
+  setup(l) {
+    const c = x(!1);
+    async function e() {
+      await ke(), c.value = !c.value;
+    }
+    return (b, m) => {
+      const D = h("FmButton"), R = h("FmBottomSheet");
+      return f(), I(R, {
+        modelValue: c.value,
+        "onUpdate:modelValue": m[1] || (m[1] = (y) => c.value = y),
+        "dismiss-away": "",
+        "no-header": "",
+        "z-index": 110
+      }, {
+        "bottom-sheet-button": E(() => [
+          b.$slots.button ? q("", !0) : (f(), I(D, {
+            key: 0,
+            icon: "more_vert",
+            variant: "tertiary",
+            onClick: we(e, ["stop"])
+          })),
+          ve(b.$slots, "button")
+        ]),
+        default: E(() => [
+          i("div", {
+            onClick: m[0] || (m[0] = (y) => c.value = !1)
+          }, [
+            ve(b.$slots, "default")
+          ])
+        ]),
+        _: 3
+      }, 8, ["modelValue"]);
+    };
+  }
+}), et = { class: "py-8 px-12 hover:bg-fm-color-neutral-gray-100" }, tt = /* @__PURE__ */ le({
+  __name: "BottomSheetMenuItem",
+  props: {
+    label: {},
+    icon: {},
+    disabled: { type: Boolean },
+    itemClass: {}
+  },
+  setup(l) {
+    const c = l;
+    return (e, b) => {
+      const m = h("FmIcon");
+      return f(), L("div", et, [
+        e.$slots.content ? q("", !0) : (f(), L("div", {
+          key: 0,
+          class: $e(["flex items-center", {
+            "text-fm-color-typo-disabled": c.disabled,
+            "cursor-pointer": !c.disabled,
+            "cursor-not-allowed": c.disabled,
+            [c.itemClass || ""]: c.itemClass && !c.disabled
+          }])
+        }, [
+          l.icon ? (f(), I(m, {
+            key: 0,
+            name: l.icon
+          }, null, 8, ["name"])) : q("", !0),
+          Pe(" " + B(l.label), 1)
+        ], 2)),
+        ve(e.$slots, "content")
+      ]);
+    };
+  }
+}), st = /* @__PURE__ */ le({
+  __name: "ResponsiveContextMenu",
+  props: {
+    items: {}
+  },
+  setup(l) {
+    const c = Re(), e = P(() => c.breakpoints.value.xs);
+    return (b, m) => {
+      const D = h("FmButton"), R = h("FmMenuItem"), y = h("FmMenu");
+      return e.value ? (f(), I(He, { key: 0 }, {
+        default: E(() => [
+          (f(!0), L(ie, null, be(l.items, ({ icon: v, label: p, disabled: g, itemClass: M, onClick: C }) => (f(), I(tt, {
+            key: p,
+            icon: v,
+            label: p,
+            disabled: g,
+            itemClass: M,
+            onClick: () => {
+              !g && (C == null || C());
+            }
+          }, null, 8, ["icon", "label", "disabled", "itemClass", "onClick"]))), 128))
+        ]),
+        _: 1
+      })) : (f(), I(y, {
+        key: 1,
+        "stop-click-propagation": "",
+        shift: !0
+      }, {
+        "menu-button": E(() => [
+          u(D, {
+            type: "button",
+            variant: "tertiary",
+            icon: "more_vert",
+            "text-color": "neutral-gray-400",
+            size: "md"
+          })
+        ]),
+        default: E(() => [
+          (f(!0), L(ie, null, be(l.items, ({ label: v, disabled: p, itemClass: g, onClick: M }) => (f(), I(R, {
+            key: v,
+            disabled: p,
+            label: v,
+            onClick: () => {
+              !p && (M == null || M());
+            }
+          }, {
+            label: E(() => [
+              i("span", {
+                class: $e(p ? "text-fm-color-typo-disabled" : g)
+              }, B(v), 3)
+            ]),
+            _: 2
+          }, 1032, ["disabled", "label", "onClick"]))), 128))
+        ]),
+        _: 1
+      }));
+    };
+  }
+});
+var re = /* @__PURE__ */ ((l) => (l.Update = "Update", l.Remove = "Remove", l))(re || {});
+const lt = { class: "w-full flex flex-col gap-16" }, at = { class: "flex items-center gap-16" }, ot = { class: "space-y-4 min-w-0 flex-1" }, nt = { class: "text-fm-color-typo-secondary fm-typo-en-body-lg-400" }, rt = { class: "fm-typo-en-body-lg-600 truncate" }, it = { class: "w-full flex gap-16 items-center" }, mt = { class: "flex-1 flex flex-col gap-4 min-w-0" }, ut = { class: "text-fm-color-typo-secondary fm-typo-en-body-lg-400" }, dt = { class: "fm-typo-en-body-lg-600 truncate" }, ct = { class: "flex-1 flex flex-col gap-4 min-w-0" }, pt = { class: "text-fm-color-typo-secondary fm-typo-en-body-lg-400" }, ft = { class: "fm-typo-en-body-lg-600 truncate" }, vt = /* @__PURE__ */ le({
+  __name: "MemberInfo",
+  props: {
+    data: {}
+  },
+  setup(l) {
+    const { t: c } = ue();
+    return (e, b) => {
+      const m = h("FmAvatar");
+      return f(), L("div", lt, [
+        i("div", at, [
+          u(m, {
+            size: "xl",
+            initials: l.data.name
+          }, null, 8, ["initials"]),
+          i("div", ot, [
+            i("p", nt, B(r(c)("team.memberForm.memberInfo.memberName")), 1),
+            i("p", rt, B(l.data.name || "--"), 1)
+          ])
+        ]),
+        i("div", it, [
+          i("div", mt, [
+            i("p", ut, B(r(c)("team.memberForm.memberInfo.mobileNumber")), 1),
+            i("p", dt, B(l.data.phoneNumber || "--"), 1)
+          ]),
+          i("div", ct, [
+            i("p", pt, B(r(c)("team.memberForm.memberInfo.emailAddress")), 1),
+            i("p", ft, B(l.data.email || "--"), 1)
+          ])
+        ])
+      ]);
+    };
+  }
+}), Se = {
+  async readPermissionUserByPhoneNo(l) {
+    var e;
+    const { currentBusiness: c } = me();
+    return Fe(
+      await _e("/").get(`/user/b/${(e = c.value) == null ? void 0 : e._id}/phone/${l}`)
+    );
+  },
+  async readPermissionUserByEmail(l) {
+    var e;
+    const { currentBusiness: c } = me();
+    return Fe(
+      await _e("/").get(`/user/b/${(e = c.value) == null ? void 0 : e._id}/email/${l}`)
+    );
+  }
+}, bt = { class: "flex flex-col gap-24 w-full" }, yt = {
+  key: 0,
+  class: "flex flex-col gap-8"
+}, ht = { class: "user-info-icon user-info-icon--lg" }, _t = { class: "flex-1 overflow-hidden" }, gt = { class: "profile-displayName" }, Vt = { class: "profile-email" }, xt = { class: "profile-phone" }, Ft = { key: 2 }, Ut = /* @__PURE__ */ le({
+  __name: "PortalUserSearcher",
+  emits: ["invite"],
+  setup(l, { emit: c }) {
+    const e = c, { t: b } = ue(), m = Me(), D = me(), R = x("phone"), y = x(""), v = x(""), p = x();
+    async function g() {
+      if (!y.value && !v.value) {
+        m.open({
+          type: "error",
+          title: b("team.memberForm.searchUser.emptyError")
+        });
+        return;
+      }
+      const V = R.value === "phone" ? await Se.readPermissionUserByPhoneNo(y.value.replace(/ /g, "")) : await Se.readPermissionUserByEmail(v.value);
+      V || m.open({
+        type: "error",
+        title: b("team.memberForm.searchUser.userNotFound")
+      }), p.value = V;
+    }
+    const M = P(() => {
+      var U;
+      let V = ((U = p.value) == null ? void 0 : U.displayName) ?? "";
+      V || (V = "Feed Me");
+      const [F, j] = V.split(" ");
+      return j ? `${F[0]}${j[0]}` : F.slice(0, 2);
+    }), C = x(!1);
+    function ae(V) {
+      e("invite", V), C.value = !0;
+    }
+    function oe() {
+      C.value = !1;
+    }
+    return (V, F) => {
+      var _, O, T;
+      const j = h("FmRadio"), U = h("FmPhoneNumber"), Q = h("FmTextField"), a = h("FmRadioGroup"), n = h("FmButton");
+      return f(), L("div", bt, [
+        C.value ? q("", !0) : (f(), L("div", yt, [
+          u(a, {
+            modelValue: R.value,
+            "onUpdate:modelValue": F[2] || (F[2] = (k) => R.value = k)
+          }, {
+            default: E(() => [
+              u(j, {
+                value: "phone",
+                label: r(b)("team.memberForm.searchUser.phoneNumber")
+              }, null, 8, ["label"]),
+              R.value === "phone" ? (f(), I(U, {
+                key: 0,
+                modelValue: y.value,
+                "onUpdate:modelValue": F[0] || (F[0] = (k) => y.value = k),
+                "extra-country-codes": r(D).enabledCountries.value,
+                class: "ml-8"
+              }, null, 8, ["modelValue", "extra-country-codes"])) : q("", !0),
+              u(j, {
+                value: "email",
+                label: r(b)("team.memberForm.searchUser.email")
+              }, null, 8, ["label"]),
+              R.value === "email" ? (f(), I(Q, {
+                key: 1,
+                modelValue: v.value,
+                "onUpdate:modelValue": F[1] || (F[1] = (k) => v.value = k),
+                placeholder: r(b)("team.memberForm.searchUser.emailPlaceholder"),
+                class: "ml-8"
+              }, null, 8, ["modelValue", "placeholder"])) : q("", !0)
+            ]),
+            _: 1
+          }, 8, ["modelValue"]),
+          u(n, {
+            label: r(b)("team.memberForm.searchUser.search"),
+            variant: "secondary",
+            onClick: g
+          }, null, 8, ["label"])
+        ])),
+        p.value ? (f(), L("div", {
+          key: 1,
+          class: "profile-menu--profile cursor-pointer hover:bg-fm-color-opacity-sm",
+          onClick: F[3] || (F[3] = (k) => ae(p.value))
+        }, [
+          i("div", ht, B(M.value), 1),
+          i("div", _t, [
+            i("p", gt, B((_ = p.value) == null ? void 0 : _.displayName), 1),
+            i("p", Vt, B((O = p.value) == null ? void 0 : O.email), 1),
+            i("p", xt, B((T = p.value) == null ? void 0 : T.phoneNumber), 1)
+          ])
+        ])) : q("", !0),
+        C.value ? (f(), L("div", Ft, [
+          u(n, {
+            label: r(b)("team.memberForm.searchUser.changeUser"),
+            variant: "secondary",
+            onClick: oe
+          }, null, 8, ["label"])
+        ])) : q("", !0)
+      ]);
+    };
+  }
+}), St = /* @__PURE__ */ Ee(Ut, [["__scopeId", "data-v-c2c7ed35"]]), wt = { class: "flex flex-col gap-40" }, kt = { class: "flex items-center" }, $t = { class: "flex-1 flex flex-col" }, Pt = { class: "fm-typo-en-title-sm-600" }, It = { class: "fm-typo-en-body-md-400 text-fm-color-typo-secondary" }, Rt = { class: "flex flex-row gap-16" }, Mt = { class: "flex flex-col gap-8" }, Ct = { class: "fm-typo-en-body-lg-400" }, Nt = { class: "p-16 fm-corner-radius-lg border border-fm-color-neutral-gray-200" }, fe = 4, Bt = /* @__PURE__ */ le({
+  __name: "TeamMemberMasterUser",
+  props: {
+    modelValue: {
+      type: Object,
+      default: void 0
+    },
+    fallbackName: {
+      type: String,
+      required: !0
+    },
+    fallbackPasscode: {
+      type: String,
+      default: void 0
+    },
+    restaurants: {
+      type: Array,
+      required: !0
+    },
+    roles: {
+      type: Array,
+      required: !0
+    }
+  },
+  emits: ["update:model-value"],
+  setup(l, { emit: c }) {
+    const e = l, b = c, { t: m } = ue(), { searchKey: D, filter: R } = Ce(""), y = x(!0), v = x([]), p = P(() => {
+      const a = {};
+      return e.roles.forEach((n) => {
+        a[n.value] = n.label;
+      }), a;
+    }), g = P(() => {
+      var n;
+      const a = {};
+      return (n = e.modelValue) == null || n.roles.forEach((_) => {
+        a[_.restaurantId] = _.roleId;
+      }), a;
+    }), M = P(() => e.restaurants.filter((a) => R([a.profile.name, a.profile.code, ae(a._id)])).map((a) => ({
+      label: `${a.profile.code ? a.profile.code + "-" : ""}${a.profile.name}`,
+      value: a._id,
+      slot: `checkbox-${a._id}-bottom`,
+      disable: e.roles.filter((n) => !n.disabled).length === 0,
+      roleOptions: e.roles
+    }))), C = P(() => {
+      const a = e.roles.find((n) => !n.disabled);
+      return a ? a.value : null;
+    });
+    function ae(a) {
+      const n = g.value[a] ?? "";
+      return p.value[n] || "";
+    }
+    function oe(a) {
+      a ? e.modelValue || b("update:model-value", {
+        code: "",
+        name: e.fallbackName,
+        roles: [],
+        passcode: e.fallbackPasscode || ""
+      }) : b("update:model-value", void 0);
+    }
+    function V(a, n) {
+      if (!e.modelValue || a === "passcode" && e.modelValue.passcode === n)
+        return;
+      const _ = Ne(e.modelValue);
+      _[a] = n, b("update:model-value", _);
+    }
+    function F(a) {
+      V(
+        "roles",
+        a.map((n) => {
+          var T, k, Y;
+          const _ = (k = (T = M.value.find((z) => z.value === n)) == null ? void 0 : T.roleOptions.find((z) => !z.disabled)) == null ? void 0 : k.value, O = (Y = e.modelValue) == null ? void 0 : Y.roles.find((z) => z.restaurantId === n);
+          return {
+            restaurantId: n,
+            roleId: (O == null ? void 0 : O.roleId) || _
+          };
+        })
+      );
+    }
+    function j(a, n) {
+      V("roles", [
+        ...e.modelValue.roles.filter(
+          (_) => _.restaurantId !== a
+        ),
+        {
+          restaurantId: a,
+          roleId: n
+        }
+      ]);
+    }
+    function U() {
+      y.value && (y.value = !1, v.value = [], V("passcode", ""));
+    }
+    Ie(
+      () => {
+        var a;
+        return (a = e.modelValue) == null ? void 0 : a.passcode;
+      },
+      (a) => {
+        a && a.length === fe ? (v.value = a.split(""), y.value = !0) : (v.value = [], y.value = !1);
+      },
+      { immediate: !0 }
+    );
+    const Q = P({
+      get: () => {
+        var a;
+        return ((a = e.modelValue) == null ? void 0 : a.roles) ?? [];
+      },
+      set: () => {
+      }
+    });
+    return (a, n) => {
+      const _ = h("FmSwitch"), O = h("FmTextField"), T = h("FmPinField"), k = h("FmFormGroup"), Y = h("FmSearch"), z = h("FmSelect");
+      return f(), L("div", wt, [
+        i("div", kt, [
+          i("div", $t, [
+            i("div", Pt, B(r(m)("team.memberForm.masterUser.title")), 1),
+            i("div", It, B(r(m)("team.memberForm.masterUser.sublabel")), 1)
+          ]),
+          i("div", null, [
+            u(_, {
+              "model-value": !!l.modelValue,
+              value: "master-user",
+              "onUpdate:modelValue": oe
+            }, null, 8, ["model-value"])
+          ])
+        ]),
+        l.modelValue ? (f(), L(ie, { key: 0 }, [
+          i("div", Rt, [
+            u(O, {
+              "model-value": l.modelValue.code,
+              label: r(m)("team.memberForm.masterUser.code"),
+              "onUpdate:modelValue": n[0] || (n[0] = (s) => V("code", s))
+            }, null, 8, ["model-value", "label"]),
+            u(O, {
+              "model-value": l.modelValue.name,
+              class: "w-full",
+              label: r(m)("team.memberForm.masterUser.name"),
+              rules: [(s) => !!s || r(m)("team.memberForm.masterUser.nameEmptyError")],
+              "onUpdate:modelValue": n[1] || (n[1] = (s) => V("name", s))
+            }, null, 8, ["model-value", "label", "rules"])
+          ]),
+          i("div", Mt, [
+            i("div", Ct, B(r(m)("team.memberForm.masterUser.passcode")), 1),
+            u(k, {
+              modelValue: v.value,
+              "onUpdate:modelValue": n[4] || (n[4] = (s) => v.value = s),
+              rules: [
+                (s) => (s == null ? void 0 : s.filter((d) => !!d).length) !== fe ? r(m)("team.memberForm.masterUser.passcodeRequired") : !0
+              ]
+            }, {
+              default: E(() => [
+                (f(), I(T, {
+                  key: `pin-field-${y.value}`,
+                  modelValue: v.value,
+                  "onUpdate:modelValue": n[2] || (n[2] = (s) => v.value = s),
+                  length: fe,
+                  masked: y.value,
+                  onComplete: n[3] || (n[3] = (s) => V("passcode", s)),
+                  onFocus: U
+                }, null, 8, ["modelValue", "masked"]))
+              ]),
+              _: 1
+            }, 8, ["modelValue", "rules"])
+          ]),
+          u(k, {
+            modelValue: Q.value,
+            "onUpdate:modelValue": n[6] || (n[6] = (s) => Q.value = s),
+            rules: [
+              (s) => !s || s.length === 0 ? r(m)("team.memberForm.masterUser.restaurantRequired") : s.some((d) => !d.roleId) ? r(m)("team.memberForm.masterUser.roleRequired") : !0
+            ]
+          }, {
+            default: E(() => [
+              i("div", Nt, [
+                u(Y, {
+                  modelValue: r(D),
+                  "onUpdate:modelValue": n[5] || (n[5] = (s) => ye(D) ? D.value = s : null),
+                  placeholder: r(m)("team.memberForm.posRole.placeholder"),
+                  class: "mb-16"
+                }, null, 8, ["modelValue", "placeholder"]),
+                u(Xe, {
+                  "model-value": l.modelValue.roles.map((s) => s.restaurantId),
+                  options: M.value,
+                  min: 1,
+                  title: r(m)("team.memberForm.masterUser.role"),
+                  "onUpdate:modelValue": F
+                }, Oe({ _: 2 }, [
+                  be(M.value, (s) => ({
+                    name: s.slot,
+                    fn: E(() => {
+                      var d;
+                      return [
+                        i("div", null, [
+                          u(z, {
+                            "model-value": ((d = l.modelValue.roles.find((S) => S.restaurantId === s.value)) == null ? void 0 : d.roleId) || C.value,
+                            items: s.roleOptions,
+                            "onUpdate:modelValue": (S) => j(s.value, S)
+                          }, null, 8, ["model-value", "items", "onUpdate:modelValue"])
+                        ])
+                      ];
+                    })
+                  }))
+                ]), 1032, ["model-value", "options", "title"])
+              ])
+            ]),
+            _: 1
+          }, 8, ["modelValue", "rules"])
+        ], 64)) : q("", !0)
+      ]);
+    };
+  }
+}), Dt = { class: "flex flex-col gap-32" }, Ot = { class: "flex w-full" }, At = /* @__PURE__ */ le({
+  __name: "AddMemberForm",
+  props: {
+    initialValue: {
+      type: Object
+    },
+    roleErrorMessage: {
+      type: String,
+      default: ""
+    }
+  },
+  setup(l, { expose: c }) {
+    var k, Y, z;
+    const e = l, { t: b } = ue(), m = x(), D = Be(), R = P(
+      () => D.permissionSets.value.map((s) => ({
+        label: s.name,
+        value: s.id
+      }))
+    ), y = x(((k = e.initialValue) == null ? void 0 : k.permissionSetIds) || []), v = P(
+      () => qe(y.value, D.permissionSets.value)
+    ), p = x((Y = e.initialValue) == null ? void 0 : Y.posUser), g = x(
+      Ge(
+        ce(v.value),
+        ((z = e.initialValue) == null ? void 0 : z.permissions) || []
+      )
+    ), { restaurants: M } = me(), C = De().roles, ae = P(() => Ue(g.value)), oe = P(() => {
+      const s = ae.value;
+      return C.value.map(
+        (d) => ({
+          label: d.name,
+          value: d._id,
+          disabled: !!s && !s.includes(d._id)
+        })
+      );
+    });
+    function V(s) {
+      m.value = s;
+    }
+    function F(s) {
+      p.value = n(p.value, s);
+    }
+    function j() {
+      const s = ce(v.value), d = We(g.value);
+      return Je(s, d);
+    }
+    function U() {
+      var S, G, N, X, se, ne, Z, H, K, de;
+      const s = j(), d = g.value.filter((ee) => !ee.inverted);
+      return {
+        email: ((S = m.value) == null ? void 0 : S.email) ?? void 0,
+        phoneNumber: ((G = m.value) == null ? void 0 : G.phoneNumber) ?? void 0,
+        customPermissions: s,
+        // Deprecated: keep for backward compatibility, will be removed in the future
+        permissions: d.map((ee) => ({
+          ...ee,
+          subject: Le(ee.subject)
+        })),
+        permissionSetIds: y.value,
+        name: ((N = m.value) == null ? void 0 : N.displayName) || ((X = e.initialValue) == null ? void 0 : X.name) || "",
+        posUser: p.value ? {
+          ...p.value,
+          name: p.value.name || ((ne = (se = e.initialValue) == null ? void 0 : se.posUser) == null ? void 0 : ne.name) || ((Z = e.initialValue) == null ? void 0 : Z.name) || ((H = m.value) == null ? void 0 : H.displayName) || "",
+          code: p.value.code || ((de = (K = e.initialValue) == null ? void 0 : K.posUser) == null ? void 0 : de.code) || "",
+          passcode: p.value.passcode,
+          roles: p.value.roles.filter((ee) => !!ee.roleId)
+        } : void 0
+      };
+    }
+    const Q = x();
+    function a() {
+      g.value = ce(v.value);
+    }
+    function n(s, d) {
+      if (!s) return;
+      const S = Ue(d);
+      if (!S) return s;
+      const G = Ne(s);
+      return G.roles = G.roles.reduce((N, X) => (S.includes(X.roleId) && N.push(X), N), []), G;
+    }
+    async function _() {
+      await ke(), Q.value && Q.value.$el.scrollIntoView({ behavior: "smooth", block: "start" });
+    }
+    const O = x();
+    async function T() {
+      return (await O.value.validateInputsWithoutSubmit()).length ? null : U();
+    }
+    return c({
+      readFormData: U,
+      validate: T
+    }), (s, d) => {
+      const S = h("FmSelect"), G = h("FmForm");
+      return f(), I(G, {
+        ref_key: "formRef",
+        ref: O,
+        class: "mx-4"
+      }, {
+        default: E(() => {
+          var N, X, se, ne, Z, H;
+          return [
+            i("div", Dt, [
+              i("div", Ot, [
+                l.initialValue ? (f(), I(vt, {
+                  key: 1,
+                  data: l.initialValue
+                }, null, 8, ["data"])) : (f(), I(St, {
+                  key: 0,
+                  onInvite: d[0] || (d[0] = (K) => V(K))
+                }))
+              ]),
+              m.value || l.initialValue ? (f(), L(ie, { key: 0 }, [
+                (N = l.initialValue) != null && N.isOwner ? q("", !0) : (f(), I(S, {
+                  key: 0,
+                  modelValue: y.value,
+                  "onUpdate:modelValue": [
+                    d[1] || (d[1] = (K) => y.value = K),
+                    a
+                  ],
+                  multiselect: "",
+                  searchable: "",
+                  "search-debounce": 300,
+                  items: R.value,
+                  label: r(b)("team.memberForm.permissionSet.title"),
+                  placeholder: r(b)("team.memberForm.permissionSet.selectPlaceholder")
+                }, null, 8, ["modelValue", "items", "label", "placeholder"])),
+                (X = l.initialValue) != null && X.isOwner ? q("", !0) : (f(), I(Ye, {
+                  key: 1,
+                  modelValue: g.value,
+                  "onUpdate:modelValue": d[2] || (d[2] = (K) => g.value = K),
+                  "inherit-permissions": v.value,
+                  onPermissionChanged: F
+                }, null, 8, ["modelValue", "inherit-permissions"])),
+                u(Bt, {
+                  ref_key: "masterUserContentRef",
+                  ref: Q,
+                  modelValue: p.value,
+                  "onUpdate:modelValue": [
+                    d[3] || (d[3] = (K) => p.value = K),
+                    _
+                  ],
+                  "fallback-name": ((se = l.initialValue) == null ? void 0 : se.name) || ((ne = m.value) == null ? void 0 : ne.displayName) || "",
+                  "fallback-passcode": (H = (Z = l.initialValue) == null ? void 0 : Z.posUser) == null ? void 0 : H.passcode,
+                  roles: oe.value,
+                  restaurants: r(M)
+                }, null, 8, ["modelValue", "fallback-name", "fallback-passcode", "roles", "restaurants"])
+              ], 64)) : q("", !0)
+            ])
+          ];
+        }),
+        _: 1
+      }, 512);
+    };
+  }
+}), Et = {
+  class: "space-y-24"
+}, Lt = {
+  class: "space-y-8"
+}, jt = {
+  class: "xs:hidden flex w-full items-start justify-between px-16"
+}, Tt = {
+  class: "flex items-start gap-8"
+}, zt = {
+  class: "space-y-4 hidden xs:block px-16"
+}, Kt = {
+  class: "flex items-start gap-8"
+}, qt = {
+  class: "flex items-center justify-start gap-8"
+};
+var J = /* @__PURE__ */ function(l) {
+  return l[l.ADD = 0] = "ADD", l[l.UPDATE = 1] = "UPDATE", l[l.CLOSED = 2] = "CLOSED", l;
+}(J || {});
+const ns = /* @__PURE__ */ le({
+  __name: "TeamMemberList",
+  setup(l, {
+    expose: c
+  }) {
+    const {
+      t: e
+    } = ue(), b = me(), m = De(), D = Me(), R = Ke(D), y = Be(), v = Qe(), p = Ze(), g = x(!0), M = ({
+      member: t,
+      className: o = ""
+    }) => {
+      const $ = {
+        label: e("common.update"),
+        onClick: () => F(re.Update, t)
+      }, te = {
+        label: e("common.remove"),
+        onClick: () => F(re.Remove, t),
+        itemClass: "text-fm-color-typo-error"
+      }, W = t.doc.isOwner ? [$] : [$, te];
+      return u(st, {
+        class: o,
+        items: W
+      }, null);
+    }, C = (t) => t.doc.isOwner ? e("team.labels.businessOwner") : t.restaurants.join(", "), ae = [{
+      accessorKey: "name",
+      header: () => e("team.table.columns.name"),
+      enableSorting: !1
+    }, {
+      accessorKey: "phoneNumber",
+      header: () => e("team.table.columns.phoneNumber"),
+      enableSorting: !1
+    }, {
+      accessorKey: "restaurant",
+      header: () => e("team.table.columns.restaurant"),
+      enableSorting: !1,
+      cell(t) {
+        const o = t.row.original;
+        return C(o);
+      }
+    }, {
+      accessorKey: "assignedRoles",
+      header: () => e("team.table.columns.assignedRoles"),
+      enableSorting: !1,
+      cell(t) {
+        const o = t.row.original, $ = v.getPermissionAssignmentByUserId(o.id), te = ($ == null ? void 0 : $.permissionSetIds) || o.doc.permissionSetIds || [];
+        return y.permissionSets.value.filter((A) => te.includes(A.id)).map((A) => A.name).join(", ");
+      }
+    }, {
+      accessorKey: "permission",
+      header: () => e("team.table.columns.permission"),
+      enableSorting: !1,
+      cell(t) {
+        const o = t.row.original;
+        return oe(o);
+      },
+      meta: {
+        width: "200px"
+      }
+    }, {
+      id: "action",
+      meta: {
+        cellClass: "pl-16",
+        headerContentClass: "-mx-16"
+      },
+      cell(t) {
+        const o = t.row.original;
+        return M({
+          member: o,
+          className: "flex justify-end w-full"
+        });
+      },
+      enableSorting: !1
+    }];
+    function oe(t) {
+      if (t.doc.isOwner)
+        return e("team.labels.businessOwner");
+      const o = u(Ve.FmTooltip, {
+        variant: "plain",
+        placement: "top"
+      }, {
+        default: () => u(Ve.FmIcon, {
+          name: "info",
+          class: "cursor-pointer text-fm-color-neutral-gray-300"
+        }, null),
+        content: () => u("div", null, [e("team.labels.permission"), t.permissionLabels.map(($) => u("div", null, [Pe("- "), $]))])
+      });
+      return u("div", {
+        class: "flex flex-row items-center gap-8"
+      }, [u("span", null, [e("team.labels.allowed", {
+        count: t.permissionLabels.length
+      })]), t.permissionLabels.length > 0 && o]);
+    }
+    function V(t) {
+      var W, A, w, he;
+      const o = v.getPermissionAssignmentByUserId(t.id), $ = (o == null ? void 0 : o.customPermissions) || t.permissions || [], te = (o == null ? void 0 : o.permissionSetIds) || [];
+      return {
+        id: t.id,
+        isOwner: t.doc.isOwner,
+        name: t.name,
+        phoneNumber: t.phoneNumber,
+        email: t.email,
+        permissions: $,
+        permissionSetIds: te,
+        posUser: t.doc.posUser ? {
+          code: ((W = t.doc.posUser) == null ? void 0 : W.code) ?? "",
+          name: ((A = t.doc.posUser) == null ? void 0 : A.name) ?? t.name,
+          passcode: ((w = t.doc.posUser) == null ? void 0 : w.passcode) ?? "",
+          roles: ((he = t.doc.posUser) == null ? void 0 : he.roles) ?? []
+        } : void 0
+      };
+    }
+    const F = (t, o) => {
+      if (t == re.Update) {
+        const $ = V(o);
+        _.value = $, U.value = J.UPDATE;
+      }
+      t == re.Remove && Y(o);
+    }, j = Ae(), U = x(J.CLOSED), Q = P(() => U.value !== J.CLOSED), a = P(() => U.value === J.ADD ? e("common.add") : e("common.update")), n = P(() => U.value === J.ADD ? e("team.actions.addMember") : e("team.actions.updateMember")), _ = x();
+    function O(t) {
+      t || (U.value = J.CLOSED);
+    }
+    function T() {
+      U.value = J.CLOSED;
+    }
+    const {
+      breakpoints: k
+    } = Re(), Y = (t) => {
+      j.open({
+        title: e("team.actions.removeMember"),
+        message: e("team.removeMember.confirmationMessage", {
+          memberName: t.name
+        }),
+        minWidth: k.value.lg ? 588 : 0,
+        primaryActions: {
+          text: "Remove",
+          close: !1,
+          variant: "destructive"
+        },
+        secondaryActions: {
+          text: "Cancel",
+          close: !0
+        }
+      }).onPrimary(async () => {
+        await R.minor(async () => {
+          await pe.deleteTeamMember(t.id), await Z();
+        }, {
+          successMessage: e("team.removeMember.successMessage", {
+            memberName: t.name
+          })
+        }), j.close();
+      });
+    }, z = () => {
+      _.value = null, U.value = J.ADD;
+    }, s = P(() => p.members), d = x(), S = x(), G = P(() => Object.values(je).map((t) => ({
+      label: t.label,
+      value: t.subject
+    }))), {
+      searchKey: N,
+      filter: X
+    } = Ce(""), se = P(() => s.value.filter((t) => {
+      var W;
+      const o = !d.value || t.managableRestaurantIds.some((A) => d.value.includes(A)), $ = ((W = t.permissions) == null ? void 0 : W.map((A) => A.subject).flat().filter(Boolean)) || [], te = !S.value || $.some((A) => S.value.includes(A));
+      return o && te && X([t.name, t.phoneNumber, C(t)]);
+    }));
+    async function ne() {
+      await m.readRoles();
+    }
+    async function Z() {
+      g.value = !0;
+      try {
+        await p.readTeamMembers();
+      } finally {
+        g.value = !1;
+      }
+    }
+    const H = x();
+    async function K() {
+      if (!H.value) return;
+      const t = await H.value.validate();
+      if (!t) return;
+      const o = U.value === J.ADD;
+      await R.minor(async () => {
+        await (o ? pe.createTeamMember(t) : pe.updateTeamMember(_.value.id, t)), T(), await ee(), await Z();
+      }, {
+        successMessage: o ? e("team.addMember.successMessage", {
+          memberName: t.name
+        }) : e("team.updateMember.successMessage", {
+          memberName: t.name
+        })
+      }), U.value = J.CLOSED;
+    }
+    async function de() {
+      await y.readPermissionSets();
+    }
+    async function ee() {
+      await v.readPermissionAssignments();
+    }
+    return Ie(b.currentBusiness, async () => {
+      var t;
+      (t = b.currentBusiness.value) != null && t._id && (await de(), await ee(), Z(), ne());
+    }, {
+      immediate: !0
+    }), c({
+      create: z
+    }), (t, o) => {
+      const $ = h("FmSearch"), te = h("FmTable"), W = h("FmButton"), A = h("FmSideSheet");
+      return f(), L(ie, null, [i("div", Et, [i("div", Lt, [i("div", jt, [i("div", Tt, [u(r(ge), {
+        modelValue: d.value,
+        "onUpdate:modelValue": o[0] || (o[0] = (w) => d.value = w),
+        "managable-only": !1,
+        multiple: "",
+        variant: "dark",
+        class: "!w-auto"
+      }, null, 8, ["modelValue"]), u(xe, {
+        modelValue: S.value,
+        "onUpdate:modelValue": o[1] || (o[1] = (w) => S.value = w),
+        multiple: "",
+        variant: "dark",
+        items: G.value,
+        "selected-prefix": r(e)("team.filter.selected_permission_prefix"),
+        placeholder: r(e)("team.filter.permission_placeholder")
+      }, null, 8, ["modelValue", "items", "selected-prefix", "placeholder"])]), u($, {
+        modelValue: r(N),
+        "onUpdate:modelValue": o[2] || (o[2] = (w) => ye(N) ? N.value = w : null),
+        class: "w-[320px] xs:w-full xs:mt-8",
+        autofocus: "",
+        placeholder: r(e)("team.search.placeholder")
+      }, null, 8, ["modelValue", "placeholder"])]), i("div", zt, [u($, {
+        modelValue: r(N),
+        "onUpdate:modelValue": o[3] || (o[3] = (w) => ye(N) ? N.value = w : null),
+        class: "w-[320px] xs:w-full xs:mt-8",
+        autofocus: "",
+        placeholder: r(e)("team.search.placeholder")
+      }, null, 8, ["modelValue", "placeholder"]), i("div", Kt, [u(r(ge), {
+        modelValue: d.value,
+        "onUpdate:modelValue": o[4] || (o[4] = (w) => d.value = w),
+        "managable-only": !1,
+        multiple: "",
+        variant: "dark",
+        class: "!w-auto"
+      }, null, 8, ["modelValue"]), u(xe, {
+        modelValue: S.value,
+        "onUpdate:modelValue": o[5] || (o[5] = (w) => S.value = w),
+        multiple: "",
+        variant: "dark",
+        items: G.value,
+        "selected-prefix": r(e)("team.filter.selected_permission_prefix"),
+        placeholder: r(e)("team.filter.permission_placeholder")
+      }, null, 8, ["modelValue", "items", "selected-prefix", "placeholder"])])]), s.value.length === 0 && !g.value ? (f(), I(r(ze), {
+        key: 0,
+        title: r(e)("team.emptyState.title"),
+        subtitle: r(e)("team.emptyState.description")
+      }, null, 8, ["title", "subtitle"])) : (f(), I(Te, {
+        key: 1
+      }, {
+        default: E(() => [u(te, {
+          "column-defs": ae,
+          "row-data": se.value,
+          "page-size": se.value.length,
+          loading: g.value,
+          "pin-header-row": "",
+          "hide-footer": "",
+          onRowClick: o[6] || (o[6] = (w) => F(r(re).Update, w.original))
+        }, null, 8, ["row-data", "page-size", "loading"])]),
+        _: 1
+      }))])]), u(A, {
+        header: n.value,
+        "model-value": Q.value,
+        "max-width": 560,
+        "dismiss-away": "",
+        "onUpdate:modelValue": o[7] || (o[7] = (w) => O(w))
+      }, {
+        "side-sheet-footer": E(() => [i("div", qt, [u(W, {
+          label: a.value,
+          size: "md",
+          variant: "primary",
+          onClick: we(K, ["prevent"])
+        }, null, 8, ["label"]), u(W, {
+          label: r(e)("common.cancel"),
+          size: "md",
+          variant: "secondary",
+          onClick: T
+        }, null, 8, ["label"])])]),
+        default: E(() => [u(At, {
+          ref_key: "memberForm",
+          ref: H,
+          initialValue: _.value,
+          class: "gap-8"
+        }, null, 8, ["initialValue"])]),
+        _: 1
+      }, 8, ["header", "model-value"])], 64);
+    };
+  }
+});
+export {
+  ns as default
+};