@feedmepos/mf-connect 0.1.98-beta.84 → 0.1.98-beta.85

package/dist/WhatsappBot-CSy_Z1bz.js

@@ -0,0 +1,581 @@
+import { defineComponent as M, ref as B, computed as H, watch as R, onBeforeUnmount as K, resolveComponent as b, openBlock as n, createElementBlock as m, createElementVNode as o, normalizeClass as U, unref as e, toDisplayString as r, createBlock as A, withCtx as S, createTextVNode as z, createVNode as k, createCommentVNode as j, withModifiers as ae, Fragment as Q, renderList as q, useModel as se, mergeProps as le, createSlots as re } from "vue";
+import { u as G } from "./vue-i18n-BJ_ZHWvK.js";
+import { useRouter as ce } from "vue-router";
+import { S as N, a as ie } from "./index-Cfr0vxa5.js";
+import { w as L } from "./index-Cq0kWJ_W.js";
+import { u as ue, _ as pe, w as de } from "./WhatsappAccountStatusLabel.vue_vue_type_script_setup_true_lang-D25DVRXA.js";
+import { R as T } from "./app-BiUEivOU.js";
+import { b as me } from "./browser-BSAOEeIM.js";
+const fe = { class: "flex items-center gap-[12px]" }, xe = ["src"], ve = { key: 1 }, he = { class: "min-w-0 flex-1" }, _e = ["title"], ge = { key: 1 }, ye = { class: "text-[14px] leading-[20px] text-fm-color-typo-secondary break-all" }, be = { class: "relative z-10 flex shrink-0 items-center gap-[12px]" }, we = ["aria-label", "title", "disabled", "aria-busy"], Be = { class: "flex items-center justify-between flex-wrap gap-[8px] border-t border-fm-color-neutral-gray-100 pt-[12px]" }, Te = {
+  key: 0,
+  class: "text-[12px] text-fm-color-typo-secondary"
+}, ke = {
+  key: 0,
+  role: "alert",
+  class: "text-[14px] text-fm-color-typo-error"
+}, Ae = /* @__PURE__ */ M({
+  __name: "WhatsappAccountCard",
+  props: {
+    account: {}
+  },
+  emits: ["removed"],
+  setup(I, { emit: i }) {
+    const a = I, f = i, { t: x, locale: u } = G(), l = B(!1), h = B("");
+    let v;
+    const {
+      name: $,
+      phoneNumber: C,
+      initials: g,
+      state: F,
+      avatarColor: E,
+      profilePictureUrl: _,
+      profilePictureFailed: c
+    } = ue(() => a.account), p = H(() => F.value === "connected"), d = H(() => ({
+      name: T["$connect-WHATSAPP_ACCOUNT"],
+      params: { clientId: a.account.clientId }
+    }));
+    function W(P) {
+      return new Intl.DateTimeFormat(u.value, {
+        year: "numeric",
+        month: "short",
+        day: "numeric"
+      }).format(new Date(P));
+    }
+    async function O() {
+      if (l.value) return;
+      const P = N.getBusinessId();
+      if (!P) {
+        h.value = x("connect.whatsappBot.errors.selectBusiness");
+        return;
+      }
+      const s = a.account.clientId, t = new AbortController();
+      v = t, l.value = !0, h.value = "";
+      try {
+        await L.deleteClient(P, s, t.signal), t.signal.aborted || f("removed", s);
+      } catch {
+        t.signal.aborted || (h.value = x("connect.whatsappBot.errors.removeAccount"));
+      } finally {
+        v === t && (v = void 0, l.value = !1);
+      }
+    }
+    function w() {
+      v == null || v.abort(), v = void 0, l.value = !1, h.value = "";
+    }
+    return R(() => N.getBusinessId(), w), K(w), (P, s) => {
+      const t = b("RouterLink"), y = b("FmIcon"), V = b("FmCircularProgress");
+      return n(), m("li", null, [
+        o("div", {
+          class: U(["relative h-full border border-fm-color-neutral-gray-100 rounded-[16px] p-[20px] flex flex-col gap-[16px] bg-fm-color-neutral-white text-fm-color-typo-primary", {
+            "cursor-pointer transition-shadow hover:border-fm-color-neutral-gray-200 hover:fm-shadow-light-100": p.value
+          }])
+        }, [
+          o("div", fe, [
+            o("div", {
+              "aria-hidden": "true",
+              class: U(["w-[48px] h-[48px] rounded-full overflow-hidden shrink-0 flex items-center justify-center text-[16px] font-semibold text-fm-color-typo-white", e(E)])
+            }, [
+              e(_) && !e(c) ? (n(), m("img", {
+                key: 0,
+                src: e(_),
+                alt: "",
+                class: "w-full h-full object-cover",
+                referrerpolicy: "no-referrer",
+                onError: s[0] || (s[0] = (Z) => c.value = !0)
+              }, null, 40, xe)) : (n(), m("span", ve, r(e(g)), 1))
+            ], 2),
+            o("div", he, [
+              o("h2", {
+                class: "text-[16px] leading-[24px] font-semibold truncate",
+                title: e($)
+              }, [
+                p.value ? (n(), A(t, {
+                  key: 0,
+                  to: d.value,
+                  class: "text-inherit no-underline after:absolute after:inset-0 after:rounded-[16px] focus-visible:outline-none focus-visible:after:ring-[2px] focus-visible:after:ring-fm-color-primary focus-visible:after:ring-offset-[2px]"
+                }, {
+                  default: S(() => [
+                    z(r(e($)), 1)
+                  ]),
+                  _: 1
+                }, 8, ["to"])) : (n(), m("span", ge, r(e($)), 1))
+              ], 8, _e),
+              o("p", ye, r(e(C)), 1)
+            ]),
+            o("div", be, [
+              p.value ? (n(), A(t, {
+                key: 0,
+                to: d.value,
+                "aria-label": e(x)("connect.common.edit"),
+                title: e(x)("connect.common.edit"),
+                class: "w-[32px] h-[32px] flex items-center justify-center rounded-[8px] text-fm-color-typo-tertiary no-underline transition-colors hover:bg-fm-color-neutral-gray-100 hover:text-fm-color-typo-primary focus-visible:outline-none focus-visible:ring-[2px] focus-visible:ring-fm-color-primary"
+              }, {
+                default: S(() => [
+                  k(y, {
+                    name: "edit",
+                    size: "sm",
+                    outline: "",
+                    "aria-hidden": "true"
+                  })
+                ]),
+                _: 1
+              }, 8, ["to", "aria-label", "title"])) : j("", !0),
+              o("button", {
+                type: "button",
+                "aria-label": e(x)("connect.common.remove"),
+                title: e(x)("connect.common.remove"),
+                disabled: l.value,
+                "aria-busy": l.value,
+                class: "w-[32px] h-[32px] flex items-center justify-center rounded-[8px] text-fm-color-typo-tertiary transition-colors hover:bg-fm-color-system-error-100 hover:text-fm-color-typo-error focus-visible:outline-none focus-visible:ring-[2px] focus-visible:ring-fm-color-primary disabled:cursor-wait disabled:opacity-50",
+                onClick: ae(O, ["stop"])
+              }, [
+                l.value ? (n(), A(V, {
+                  key: 0,
+                  size: "md",
+                  "aria-hidden": "true"
+                })) : (n(), A(y, {
+                  key: 1,
+                  name: "delete",
+                  size: "sm",
+                  outline: "",
+                  "aria-hidden": "true"
+                }))
+              ], 8, we)
+            ])
+          ]),
+          o("div", Be, [
+            k(pe, { state: e(F) }, null, 8, ["state"]),
+            p.value && I.account.connectedAt ? (n(), m("span", Te, r(e(x)("connect.whatsappBot.connectedSince", {
+              date: W(I.account.connectedAt)
+            })), 1)) : j("", !0)
+          ]),
+          h.value ? (n(), m("p", ke, r(h.value), 1)) : j("", !0)
+        ], 2)
+      ]);
+    };
+  }
+}), $e = { class: "mt-[24px] grid grid-cols-[repeat(auto-fill,minmax(280px,1fr))] xs:grid-cols-1 gap-[16px]" }, Ce = /* @__PURE__ */ M({
+  __name: "WhatsappAccountList",
+  props: {
+    accounts: {}
+  },
+  emits: ["removed"],
+  setup(I, { emit: i }) {
+    const a = i;
+    return (f, x) => (n(), m("ul", $e, [
+      (n(!0), m(Q, null, q(I.accounts, (u) => (n(), A(Ae, {
+        key: u.clientId,
+        account: u,
+        onRemoved: x[0] || (x[0] = (l) => a("removed", l))
+      }, null, 8, ["account"]))), 128))
+    ]));
+  }
+}), Pe = { class: "text-[18px] font-semibold" }, Se = {
+  key: 0,
+  role: "status",
+  class: "flex flex-col items-center text-center gap-[8px] px-[8px] py-[40px]"
+}, Ie = { class: "text-[18px] font-semibold" }, Fe = { class: "text-[14px] text-fm-color-typo-secondary break-all" }, Ee = {
+  key: 1,
+  class: "grid grid-cols-[minmax(0,1fr)_232px] xs:grid-cols-1 gap-[32px] p-[8px] xs:p-[0px]"
+}, We = { class: "flex flex-col gap-[20px] text-[14px] leading-[20px]" }, Ve = { class: "text-fm-color-typo-secondary" }, De = { class: "flex flex-col gap-[14px]" }, je = { class: "w-[22px] h-[22px] shrink-0 rounded-full bg-fm-color-neutral-gray-100 flex items-center justify-center text-[12px] font-semibold" }, Ne = { key: 0 }, Oe = { class: "font-semibold" }, He = { class: "font-semibold" }, Le = { class: "font-semibold" }, Me = { class: "font-semibold" }, Re = { key: 3 }, Ue = { class: "text-[12px] leading-[16px] text-fm-color-typo-secondary" }, ze = { class: "relative w-[232px] h-[232px] xs:justify-self-center border border-fm-color-neutral-gray-100 rounded-xl flex items-center justify-center overflow-hidden" }, Ge = {
+  key: 0,
+  role: "status",
+  class: "flex flex-col items-center gap-[12px] text-[13px]"
+}, Ke = {
+  key: 1,
+  class: "flex flex-col items-center text-center gap-[12px] p-[12px]"
+}, Qe = {
+  role: "alert",
+  class: "text-[14px] text-fm-color-typo-error"
+}, Ze = ["src", "alt"], Je = {
+  key: 3,
+  role: "status",
+  "aria-live": "polite",
+  class: "absolute inset-0 bg-fm-color-neutral-white/90 flex flex-col items-center justify-center gap-[10px] text-[13px] font-medium"
+}, Xe = /* @__PURE__ */ M({
+  __name: "WhatsappConnectDialog",
+  props: {
+    modelValue: { type: Boolean, required: !0 },
+    modelModifiers: {}
+  },
+  emits: ["update:modelValue"],
+  setup(I) {
+    const i = se(I, "modelValue"), { t: a } = G(), f = B(""), x = B(!1), u = B(""), l = B(!1), h = B();
+    let v, $, C;
+    function g() {
+      v == null || v.abort(), clearTimeout($), $ = void 0, clearTimeout(C), C = void 0;
+    }
+    async function F(_, c, p) {
+      if (!p.aborted) {
+        try {
+          const d = await L.getClient(_, c, p);
+          if (p.aborted) return;
+          if (l.value = d.status === "connected" || d.status === "connecting" && d.connectedAt !== null, d.status === "connected" && d.connectedAt !== null && d.profileStatus === "ready") {
+            g(), l.value = !1, h.value = d, C = setTimeout(() => {
+              i.value = !1;
+            }, 1800);
+            return;
+          }
+          if (d.status === "disconnected") {
+            g(), l.value = !1, f.value = "", u.value = a("connect.whatsappBot.errors.qrExpired");
+            return;
+          }
+        } catch (d) {
+          if (p.aborted) return;
+          if (d instanceof ie && d.status === 409) {
+            g(), l.value = !1, f.value = "", u.value = a("connect.whatsappBot.errors.accountAlreadyLinked");
+            return;
+          }
+        }
+        p.aborted || ($ = setTimeout(() => {
+          F(_, c, p);
+        }, 2e3));
+      }
+    }
+    async function E() {
+      g();
+      const _ = new AbortController();
+      v = _, f.value = "", u.value = "", l.value = !1, h.value = void 0, x.value = !0;
+      try {
+        const c = N.getBusinessId();
+        if (!c)
+          throw new Error(a("connect.whatsappBot.errors.selectBusiness"));
+        const p = await L.createClient(
+          c,
+          _.signal
+        ), d = await me.toDataURL(p.qr, {
+          width: 224,
+          margin: 2,
+          errorCorrectionLevel: "M"
+        });
+        _.signal.aborted || (f.value = d, F(c, p.clientId, _.signal));
+      } catch (c) {
+        _.signal.aborted || (u.value = c instanceof Error ? c.message : a("connect.whatsappBot.errors.loadQr"));
+      } finally {
+        _.signal.aborted || (x.value = !1);
+      }
+    }
+    return R(
+      i,
+      (_) => {
+        _ ? E() : g();
+      },
+      { immediate: !0 }
+    ), K(g), (_, c) => {
+      const p = b("i18n-t"), d = b("FmCircularProgress"), W = b("FmButton"), O = b("FmDialog");
+      return n(), A(O, {
+        modelValue: i.value,
+        "onUpdate:modelValue": c[0] || (c[0] = (w) => i.value = w),
+        "min-width": "min(720px, calc(100% - 32px))",
+        "max-width": "720px",
+        "max-height": "90vh",
+        "dismiss-away": ""
+      }, {
+        "dialog-header": S(() => [
+          o("h2", Pe, r(e(a)("connect.whatsappBot.connectAccount")), 1)
+        ]),
+        default: S(() => {
+          var w, P, s;
+          return [
+            h.value ? (n(), m("div", Se, [
+              c[1] || (c[1] = o("div", {
+                "aria-hidden": "true",
+                class: "w-[64px] h-[64px] rounded-full bg-fm-color-system-success-100 text-fm-color-typo-success flex items-center justify-center mb-[8px]"
+              }, [
+                o("svg", {
+                  width: "32",
+                  height: "32",
+                  viewBox: "0 0 24 24",
+                  fill: "none",
+                  stroke: "currentColor",
+                  "stroke-width": "2.2",
+                  "stroke-linecap": "round",
+                  "stroke-linejoin": "round"
+                }, [
+                  o("path", { d: "M20 6 9 17l-5-5" })
+                ])
+              ], -1)),
+              o("h3", Ie, r(e(a)("connect.whatsappBot.accountConnected")), 1),
+              o("p", Fe, r(((w = h.value.account) == null ? void 0 : w.businessName) || ((P = h.value.account) == null ? void 0 : P.name) || e(a)("connect.whatsappBot.unnamedAccount")) + " · " + r(((s = h.value.account) == null ? void 0 : s.phoneNumber) || e(a)("connect.whatsappBot.phoneUnavailable")), 1)
+            ])) : (n(), m("div", Ee, [
+              o("div", We, [
+                o("p", Ve, r(e(a)("connect.whatsappBot.scanDescription")), 1),
+                o("ol", De, [
+                  (n(), m(Q, null, q(4, (t) => o("li", {
+                    key: t,
+                    class: "flex gap-[12px]"
+                  }, [
+                    o("span", je, r(t), 1),
+                    t === 1 ? (n(), m("span", Ne, r(e(a)("connect.whatsappBot.steps.openApp")), 1)) : t === 2 ? (n(), A(p, {
+                      key: 1,
+                      keypath: "connect.whatsappBot.steps.openSettings",
+                      tag: "span",
+                      scope: "global"
+                    }, {
+                      menu: S(() => [
+                        o("b", Oe, r(e(a)("connect.whatsappBot.menu")), 1)
+                      ]),
+                      settings: S(() => [
+                        o("b", He, r(e(a)("connect.whatsappBot.settings")), 1)
+                      ]),
+                      _: 1
+                    })) : t === 3 ? (n(), A(p, {
+                      key: 2,
+                      keypath: "connect.whatsappBot.steps.linkDevice",
+                      tag: "span",
+                      scope: "global"
+                    }, {
+                      linkedDevices: S(() => [
+                        o("b", Le, r(e(a)("connect.whatsappBot.linkedDevices")), 1)
+                      ]),
+                      linkDevice: S(() => [
+                        o("b", Me, r(e(a)("connect.whatsappBot.linkDevice")), 1)
+                      ]),
+                      _: 1
+                    })) : (n(), m("span", Re, r(e(a)("connect.whatsappBot.steps.scanQr")), 1))
+                  ])), 64))
+                ]),
+                o("p", Ue, r(e(a)("connect.whatsappBot.connectionNote")), 1)
+              ]),
+              o("div", ze, [
+                x.value ? (n(), m("div", Ge, [
+                  k(d),
+                  z(r(e(a)("connect.whatsappBot.generatingQr")), 1)
+                ])) : u.value ? (n(), m("div", Ke, [
+                  o("p", Qe, r(u.value), 1),
+                  k(W, {
+                    label: e(a)("connect.whatsappBot.tryAgain"),
+                    "prepend-icon": "refresh",
+                    onClick: E
+                  }, null, 8, ["label"])
+                ])) : f.value ? (n(), m("img", {
+                  key: 2,
+                  src: f.value,
+                  alt: e(a)("connect.whatsappBot.qrAlt"),
+                  width: "224",
+                  height: "224",
+                  class: U({ "opacity-20": l.value })
+                }, null, 10, Ze)) : j("", !0),
+                l.value ? (n(), m("div", Je, [
+                  k(d),
+                  z(" " + r(e(a)("connect.whatsappBot.connecting")), 1)
+                ])) : j("", !0)
+              ])
+            ]))
+          ];
+        }),
+        _: 1
+      }, 8, ["modelValue"]);
+    };
+  }
+}), Ye = { class: "mt-[24px] border border-fm-color-neutral-gray-200 rounded-[16px] px-[24px] py-[56px] flex flex-col items-center text-center gap-[8px]" }, qe = { class: "text-[20px] leading-[28px] font-bold" }, et = { class: "text-[14px] leading-[20px] text-fm-color-typo-secondary max-w-[420px]" }, tt = /* @__PURE__ */ M({
+  __name: "WhatsappEmptyState",
+  emits: ["connect"],
+  setup(I, { emit: i }) {
+    const a = i, { t: f } = G();
+    return (x, u) => {
+      const l = b("FmButton");
+      return n(), m("div", Ye, [
+        u[1] || (u[1] = o("div", { class: "w-[72px] h-[72px] rounded-full bg-fm-color-primary-oats text-fm-color-primary flex items-center justify-center mb-[12px]" }, [
+          o("svg", {
+            width: "34",
+            height: "34",
+            viewBox: "0 0 24 24",
+            fill: "none",
+            stroke: "currentColor",
+            "stroke-width": "1.6",
+            "stroke-linecap": "round",
+            "stroke-linejoin": "round",
+            "aria-hidden": "true"
+          }, [
+            o("path", { d: "M7.9 20A9 9 0 1 0 4 16.1L2 22Z" }),
+            o("path", { d: "M9 10h.01M12 10h.01M15 10h.01" })
+          ])
+        ], -1)),
+        o("h2", qe, r(e(f)("connect.whatsappBot.emptyTitle")), 1),
+        o("p", et, r(e(f)("connect.whatsappBot.emptyDescription")), 1),
+        k(l, {
+          class: "mt-[16px]",
+          label: e(f)("connect.whatsappBot.connectAccountCta"),
+          "prepend-icon": "add",
+          onClick: u[0] || (u[0] = (h) => a("connect"))
+        }, null, 8, ["label"])
+      ]);
+    };
+  }
+}), ot = { class: "px-[24px] xs:px-[12px] pt-[20px] pb-[40px] text-fm-color-typo-primary" }, nt = { class: "flex items-center justify-between gap-[16px] flex-wrap min-h-[40px]" }, at = { class: "flex items-center gap-8" }, st = { class: "text-[24px] leading-[32px] font-semibold tracking-[-0.01em]" }, lt = {
+  key: 2,
+  role: "status",
+  class: "mt-[24px] py-[56px] flex flex-col items-center gap-[12px] text-[14px] text-fm-color-typo-secondary"
+}, rt = {
+  key: 3,
+  class: "mt-[24px] border border-fm-color-neutral-gray-200 rounded-[16px] px-[24px] py-[56px] flex flex-col items-center text-center gap-[16px]"
+}, ct = {
+  role: "alert",
+  class: "text-[14px] text-fm-color-typo-error"
+}, ht = /* @__PURE__ */ M({
+  __name: "WhatsappBot",
+  setup(I) {
+    const { t: i } = G(), a = ce(), f = B([]), x = B(!0), u = B("");
+    let l, h;
+    const v = B([]), $ = B(!0), C = B("");
+    let g, F;
+    const E = H(
+      () => f.value.filter((s) => de(s) !== void 0)
+    ), _ = H(() => [
+      {
+        label: i("connect.whatsappBot.accounts"),
+        value: T["$connect-WHATSAPP_BOT"],
+        badge: E.value.length
+      },
+      {
+        label: i("connect.whatsappBot.settings"),
+        value: T["$connect-WHATSAPP_BOT_SETTINGS"]
+      },
+      {
+        label: i("connect.whatsappBot.tickets.title"),
+        value: T["$connect-WHATSAPP_BOT_TICKETS"],
+        badge: v.value.length
+      }
+    ]), c = H(() => {
+      const s = a.currentRoute.value.name;
+      return s === T["$connect-WHATSAPP_BOT_SETTINGS"] || s === T["$connect-WHATSAPP_BOT_TICKETS"] ? s : T["$connect-WHATSAPP_BOT"];
+    });
+    async function p(s = !1) {
+      clearTimeout(F), g == null || g.abort();
+      const t = new AbortController();
+      g = t, s || ($.value = !0, C.value = "");
+      try {
+        const y = N.getBusinessId();
+        if (!y)
+          throw new Error(i("connect.whatsappBot.errors.selectBusiness"));
+        const V = await L.listTickets(y, t.signal);
+        t.signal.aborted || (v.value = V, C.value = "");
+      } catch (y) {
+        t.signal.aborted || (C.value = y instanceof Error ? y.message : i("connect.whatsappBot.tickets.loadError"));
+      } finally {
+        t.signal.aborted || ($.value = !1, F = setTimeout(() => void p(!0), 1e4));
+      }
+    }
+    function d(s) {
+      v.value = v.value.filter((t) => t.id !== s), p(!0);
+    }
+    async function W(s = !1) {
+      clearTimeout(h), l == null || l.abort();
+      const t = new AbortController();
+      l = t, s || (x.value = !0, u.value = "");
+      try {
+        const y = N.getBusinessId();
+        if (!y)
+          throw new Error(i("connect.whatsappBot.errors.selectBusiness"));
+        const V = await L.listClients(y, t.signal);
+        t.signal.aborted || (f.value = V, u.value = "");
+      } catch (y) {
+        !t.signal.aborted && !s && (u.value = y instanceof Error ? y.message : i("connect.whatsappBot.errors.loadSessions"));
+      } finally {
+        t.signal.aborted || (x.value = !1, h = setTimeout(() => void W(!0), 1e4));
+      }
+    }
+    function O(s) {
+      f.value = f.value.filter(
+        (t) => t.clientId !== s
+      ), W(!0);
+    }
+    const w = B(!1);
+    function P(s) {
+      (s === T["$connect-WHATSAPP_BOT"] || s === T["$connect-WHATSAPP_BOT_SETTINGS"] || s === T["$connect-WHATSAPP_BOT_TICKETS"]) && a.push({ name: s });
+    }
+    return R(w, (s) => {
+      s || W();
+    }), R(
+      () => N.getBusinessId(),
+      () => {
+        w.value = !1, f.value = [], v.value = [], W(), p();
+      },
+      { immediate: !0 }
+    ), K(() => {
+      l == null || l.abort(), clearTimeout(h), g == null || g.abort(), clearTimeout(F);
+    }), (s, t) => {
+      const y = b("FmPill"), V = b("FmButton"), Z = b("FmBadge"), ee = b("FmTab"), te = b("FmTabs"), J = b("RouterView"), oe = b("FmCircularProgress");
+      return n(), m(Q, null, [
+        o("div", ot, [
+          o("div", nt, [
+            o("div", at, [
+              o("h1", st, r(e(i)("connect.navigation.whatsappBot")), 1),
+              k(y, { variant: "beta" })
+            ]),
+            c.value === e(T)["$connect-WHATSAPP_BOT"] && E.value.length ? (n(), A(V, {
+              key: 0,
+              label: e(i)("connect.whatsappBot.connectAccountCta"),
+              "prepend-icon": "add",
+              onClick: t[0] || (t[0] = (D) => w.value = !0)
+            }, null, 8, ["label"])) : j("", !0)
+          ]),
+          k(te, {
+            "model-value": c.value,
+            items: _.value,
+            role: "tablist",
+            "aria-label": e(i)("connect.navigation.whatsappBot"),
+            class: "mt-[16px] border-b border-fm-color-neutral-gray-100"
+          }, {
+            default: S(({ label: D, value: X, badge: Y, tabsProps: ne }) => [
+              k(ee, le(ne, {
+                "model-value": c.value,
+                label: D,
+                value: X,
+                "onUpdate:modelValue": P
+              }), re({ _: 2 }, [
+                Y ? {
+                  name: "append",
+                  fn: S(() => [
+                    k(Z, {
+                      value: Y,
+                      variant: "neutral",
+                      inline: "",
+                      class: U(
+                        c.value === X ? "bg-fm-color-primary-oats text-fm-color-primary" : "bg-fm-color-neutral-gray-100 text-fm-color-typo-secondary"
+                      )
+                    }, null, 8, ["value", "class"])
+                  ]),
+                  key: "0"
+                } : void 0
+              ]), 1040, ["model-value", "label", "value"])
+            ]),
+            _: 1
+          }, 8, ["model-value", "items", "aria-label"]),
+          c.value === e(T)["$connect-WHATSAPP_BOT_SETTINGS"] ? (n(), A(J, { key: 0 })) : c.value === e(T)["$connect-WHATSAPP_BOT_TICKETS"] ? (n(), A(J, {
+            key: 1,
+            tickets: v.value,
+            loading: $.value,
+            error: C.value,
+            onRetry: t[1] || (t[1] = (D) => p()),
+            onResolved: d
+          }, null, 8, ["tickets", "loading", "error"])) : x.value ? (n(), m("div", lt, [
+            k(oe),
+            z(" " + r(e(i)("connect.whatsappBot.loadingSessions")), 1)
+          ])) : u.value ? (n(), m("div", rt, [
+            o("p", ct, r(u.value), 1),
+            k(V, {
+              label: e(i)("connect.whatsappBot.tryAgain"),
+              "prepend-icon": "refresh",
+              onClick: t[2] || (t[2] = (D) => W())
+            }, null, 8, ["label"])
+          ])) : E.value.length ? (n(), A(Ce, {
+            key: 4,
+            accounts: E.value,
+            onRemoved: O
+          }, null, 8, ["accounts"])) : (n(), A(tt, {
+            key: 5,
+            onConnect: t[3] || (t[3] = (D) => w.value = !0)
+          }))
+        ]),
+        k(Xe, {
+          modelValue: w.value,
+          "onUpdate:modelValue": t[4] || (t[4] = (D) => w.value = D)
+        }, null, 8, ["modelValue"])
+      ], 64);
+    };
+  }
+});
+export {
+  ht as default
+};

package/dist/{WhatsappBotSettings-BuKmIjV8.js → WhatsappBotSettings-CxcuCZ-V.js}

@@ -1,8 +1,8 @@
 import { defineComponent as W, mergeModels as U, useModel as O, resolveComponent as w, openBlock as d, createElementBlock as c, createElementVNode as i, toDisplayString as u, unref as e, createVNode as b, computed as F, Fragment as L, renderList as Q, normalizeClass as M, createTextVNode as P, createCommentVNode as S, withDirectives as oe, vModelRadio as le, ref as g, watch as j, onBeforeUnmount as ae, createBlock as se } from "vue";
-import { u as D } from "./vue-i18n-Bc5Ls0lk.js";
-import { F as Y, a as C, b as ne, c as re, d as ie, e as N, f as de } from "./index-DopAV1p0.js";
-import { S as ce } from "./index-BqBHO03o.js";
-import { w as J } from "./index-BaRq5efe.js";
+import { u as D } from "./vue-i18n-BJ_ZHWvK.js";
+import { F as Y, a as C, b as ne, c as re, d as ie, e as N, f as de } from "./index-DgkRREfK.js";
+import { S as ce } from "./index-Cfr0vxa5.js";
+import { w as J } from "./index-Cq0kWJ_W.js";
 const pe = { class: "flex flex-col gap-[16px]" }, ue = { class: "flex flex-col gap-[4px]" }, me = { class: "text-[16px] leading-[24px] font-semibold" }, ve = { class: "text-[14px] leading-[20px] text-fm-color-typo-secondary" }, xe = /* @__PURE__ */ W({
   __name: "BotInstructions",
   props: /* @__PURE__ */ U({