@feedmepos/mf-connect 0.1.0-beta.14 → 0.1.0-beta.15

package/dist/{Marketing-C75GsPO0.js → Marketing-Ca00_q-k.js}

@@ -1,139 +1,132 @@
-import { defineComponent as bt, mergeModels as Lt, useModel as Dt, ref as gt, onMounted as Gt, resolveComponent as ft, openBlock as Q, createBlock as vt, withCtx as pt, createElementVNode as Y, createVNode as ot, unref as X, createElementBlock as ut, Fragment as xt, renderList as Ot, normalizeClass as kt, toDisplayString as Tt, Transition as he, withDirectives as wt, renderSlot as ee, vShow as Pt, isRef as At, computed as Ct, watch as jt, resolveDirective as ce, createTextVNode as Kt, vModelText as te, createCommentVNode as Et, nextTick as ue, normalizeStyle as Ft, createStaticVNode as fe, h as de } from "vue";
-import { _ as ge } from "./campaign-CpzFl8Vr.js";
-import { useSnackbar as Nt, useDialog as me, components as pe } from "@feedmepos/ui-library";
-import { u as ie, p as ve } from "./loading-BiEkXHTA.js";
-import { defineStore as ye } from "pinia";
-import { F as $t } from "./index-BEE6Fe4T.js";
+import { ref as gt, reactive as he, defineComponent as bt, mergeModels as Lt, useModel as Dt, onMounted as Gt, resolveComponent as ft, openBlock as Q, createBlock as vt, withCtx as pt, createElementVNode as Y, createVNode as ot, unref as X, createElementBlock as ut, Fragment as xt, renderList as Ot, normalizeClass as kt, toDisplayString as Tt, Transition as ce, withDirectives as wt, renderSlot as ee, vShow as Pt, isRef as At, computed as Ct, watch as jt, resolveDirective as ue, createTextVNode as Kt, vModelText as te, createCommentVNode as Et, nextTick as fe, normalizeStyle as Ft, createStaticVNode as de, h as ge } from "vue";
+import { _ as me } from "./campaign-CpzFl8Vr.js";
+import { useSnackbar as Nt, useDialog as pe, components as ve } from "@feedmepos/ui-library";
+import { u as ie, p as ye } from "./loading-DyvR-Q2q.js";
+import { defineStore as _e } from "pinia";
+import { F as $t } from "./index-RKVC43XB.js";
 import { useCoreStore as Jt } from "@feedmepos/mf-common";
-import { g as Wt, S as ne, b as _e, r as qt } from "./index-CjUyqTlF.js";
-import { _ as Ce } from "./ImageInput.vue_vue_type_script_setup_true_lang-rWUkV9gn.js";
+import { g as Wt, S as ne, b as Ce, r as qt } from "./index-D5OipTW2.js";
+import { _ as xe } from "./ImageInput.vue_vue_type_script_setup_true_lang-rWUkV9gn.js";
 import { Y as Yt } from "./remy-vue-client-Cpppk9h-.js";
 import { s as re, c as zt } from "./index-CsaQJMAR.js";
-import { u as se } from "./campaign-DJhUnUbx.js";
-import { _ as xe } from "./_plugin-vue_export-helper-CHgC5LLL.js";
-import { h as be } from "./moment-BWErdI6_.js";
-import { u as Se } from "./vue-i18n-DA4uJ1Yi.js";
-var we = { authUrl: "https://portal-v2-dev.feedmeapi.com/", slackWebhookUrl: "https://hooks.slack.com/services/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", appUrl: "member.feedmedev.cc", crmUrl: "crm.feedmedev.cc", paymentPortalUrl: "https://portal.feedmedev.cc/payment/payout-account", marketingV1Portal: "https://marketing-v1.feedmedev.cc" };
+import { u as se } from "./campaign-DilFl2u4.js";
+import { _ as be } from "./_plugin-vue_export-helper-CHgC5LLL.js";
+import { h as Se } from "./moment-BWErdI6_.js";
+import { u as we } from "./vue-i18n-Dw456kF3.js";
+var Te = { authUrl: "https://portal-v2-dev.feedmeapi.com/", slackWebhookUrl: "https://hooks.slack.com/services/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", appUrl: "member.feedmedev.cc", crmUrl: "crm.feedmedev.cc", paymentPortalUrl: "https://portal.feedmedev.cc/payment/payout-account", marketingV1Portal: "https://marketing-v1.feedmedev.cc" };
 const Vt = () => {
-  const k = ne.getBusinessId();
-  if (!k) throw new Error("Invalid business ID");
-  return _e(`businesses/${k}/marketing-materials/`, {
-    url: we.backendUrl,
+  const P = ne.getBusinessId();
+  if (!P) throw new Error("Invalid business ID");
+  return Ce(`businesses/${P}/marketing-materials/`, {
+    url: Te.backendUrl,
     noIdRequired: !0
   });
 }, Ut = {
   async read() {
     return Wt(await Vt().get(""));
   },
-  async createMarketing(k) {
-    return Wt(await Vt().post("", k));
+  async createMarketing(P) {
+    return Wt(await Vt().post("", P));
   },
   // add id
-  async updateMarketing(k, f) {
+  async updateMarketing(P, f) {
     return Wt(
-      await Vt().put(k, f)
+      await Vt().put(P, f)
     );
   },
-  async deleteMarketing(k) {
-    return Wt(await Vt().delete(k));
+  async deleteMarketing(P) {
+    return Wt(await Vt().delete(P));
   }
-}, Bt = ye("mf-connect-marketing", {
-  state: () => {
-    var k, f;
-    return {
-      marketing: [],
-      defaultMarketing: {
-        _id: void 0,
-        business: ((f = (k = Jt().currentBusiness) == null ? void 0 : k.value) == null ? void 0 : f._id) ?? "",
-        name: "",
-        campaign: null,
-        keywords: "",
-        image: "",
-        headline: {
-          content: "",
-          key: void 0
-        },
-        assets: [
+}, Bt = _e("mf-connect-marketing", () => {
+  var tt, lt;
+  const P = gt([]), f = he({
+    _id: void 0,
+    business: ((lt = (tt = Jt().currentBusiness) == null ? void 0 : tt.value) == null ? void 0 : lt._id) ?? "",
+    name: "",
+    campaign: null,
+    keywords: "",
+    image: "",
+    headline: {
+      content: "",
+      key: void 0
+    },
+    assets: [
+      {
+        platform: $t.enum.FACEBOOK,
+        contents: [
           {
-            platform: $t.enum.FACEBOOK,
-            contents: [
-              {
-                type: "POST",
-                size: {
-                  width: 1920,
-                  height: 1080
-                },
-                images: []
-              },
-              {
-                type: "STORY",
-                size: {
-                  width: 1080,
-                  height: 1920
-                },
-                images: []
-              }
-            ]
+            type: "POST",
+            size: {
+              width: 1920,
+              height: 1080
+            },
+            images: []
           },
           {
-            platform: $t.enum.INSTAGRAM,
-            contents: [
-              {
-                type: "POST",
-                size: {
-                  width: 1080,
-                  height: 1080
-                },
-                images: []
-              },
-              {
-                type: "STORY",
-                size: {
-                  width: 1080,
-                  height: 1920
-                },
-                images: []
-              },
-              {
-                type: "REEL",
-                size: {
-                  width: 1080,
-                  height: 1920
-                },
-                images: []
-              }
-            ]
+            type: "STORY",
+            size: {
+              width: 1080,
+              height: 1920
+            },
+            images: []
+          }
+        ]
+      },
+      {
+        platform: $t.enum.INSTAGRAM,
+        contents: [
+          {
+            type: "POST",
+            size: {
+              width: 1080,
+              height: 1080
+            },
+            images: []
           },
           {
-            platform: $t.enum.BRAND_APP,
-            contents: [
-              {
-                type: "IMAGE",
-                size: {
-                  width: 1080,
-                  height: 1920
-                },
-                images: []
-              }
-            ]
+            type: "STORY",
+            size: {
+              width: 1080,
+              height: 1920
+            },
+            images: []
+          },
+          {
+            type: "REEL",
+            size: {
+              width: 1080,
+              height: 1920
+            },
+            images: []
           }
-        ],
-        captions: [{ language: "en", content: "" }]
+        ]
+      },
+      {
+        platform: $t.enum.BRAND_APP,
+        contents: [
+          {
+            type: "IMAGE",
+            size: {
+              width: 1080,
+              height: 1920
+            },
+            images: []
+          }
+        ]
       }
-    };
-  },
-  actions: {
-    async readMarketingMaterial() {
-      const k = await Ut.read();
-      this.marketing = k;
-    }
-  },
-  getters: {
-    state(k) {
-      return k;
-    }
+    ],
+    captions: [{ language: "en", content: "" }]
+  });
+  async function nt() {
+    const H = await Ut.read();
+    P.value = H;
   }
-}), Zt = "data:image/svg+xml,%3csvg%20width='24'%20height='24'%20viewBox='0%200%2024%2024'%20fill='none'%20xmlns='http://www.w3.org/2000/svg'%3e%3cpath%20d='M7.6%207.6C8.17076%206.94229%208.5%205.5%208.5%205.5C8.5%205.5%208.81356%206.87361%209.35714%207.5C9.92948%208.15953%2011.5%208.5%2011.5%208.5C11.5%208.5%209.92948%208.69761%209.35714%209.35714C8.81356%209.98354%208.5%2011.5%208.5%2011.5C8.5%2011.5%208.32076%2010.1888%207.75%209.59091C7.14905%208.96136%205.5%208.5%205.5%208.5C5.5%208.5%206.99905%208.29251%207.6%207.6Z'%20fill='%231C1C1E'/%3e%3cpath%20d='M12.2%2012.2C13.3415%2010.8846%2014%208%2014%208C14%208%2014.6271%2010.7472%2015.7143%2012C16.859%2013.3191%2020%2014%2020%2014C20%2014%2016.859%2014.3952%2015.7143%2015.7143C14.6271%2016.9671%2014%2020%2014%2020C14%2020%2013.6415%2017.3777%2012.5%2016.1818C11.2981%2014.9227%208%2014%208%2014C8%2014%2010.9981%2013.585%2012.2%2012.2Z'%20fill='%231C1C1E'/%3e%3cpath%20d='M7.6%207.6C8.17076%206.94229%208.5%205.5%208.5%205.5C8.5%205.5%208.81356%206.87361%209.35714%207.5C9.92948%208.15953%2011.5%208.5%2011.5%208.5C11.5%208.5%209.92948%208.69761%209.35714%209.35714C8.81356%209.98354%208.5%2011.5%208.5%2011.5C8.5%2011.5%208.32076%2010.1888%207.75%209.59091C7.14905%208.96136%205.5%208.5%205.5%208.5C5.5%208.5%206.99905%208.29251%207.6%207.6Z'%20stroke='%231C1C1E'%20stroke-width='1.5'%20stroke-linecap='round'%20stroke-linejoin='round'/%3e%3cpath%20d='M12.2%2012.2C13.3415%2010.8846%2014%208%2014%208C14%208%2014.6271%2010.7472%2015.7143%2012C16.859%2013.3191%2020%2014%2020%2014C20%2014%2016.859%2014.3952%2015.7143%2015.7143C14.6271%2016.9671%2014%2020%2014%2020C14%2020%2013.6415%2017.3777%2012.5%2016.1818C11.2981%2014.9227%208%2014%208%2014C8%2014%2010.9981%2013.585%2012.2%2012.2Z'%20stroke='%231C1C1E'%20stroke-width='1.5'%20stroke-linecap='round'%20stroke-linejoin='round'/%3e%3c/svg%3e", Te = { class: "flex gap-2" }, Oe = { class: "grid grid-cols-2 gap-x-[16px] gap-y-[24px]" }, ke = ["src"], Pe = { class: "p-[8px] absolute bottom-0 w-full bg-white fm-typo-en-body-lg-600" }, Ee = /* @__PURE__ */ bt({
+  return {
+    marketing: P,
+    defaultMarketing: f,
+    readMarketingMaterial: nt
+  };
+}), Zt = "data:image/svg+xml,%3csvg%20width='24'%20height='24'%20viewBox='0%200%2024%2024'%20fill='none'%20xmlns='http://www.w3.org/2000/svg'%3e%3cpath%20d='M7.6%207.6C8.17076%206.94229%208.5%205.5%208.5%205.5C8.5%205.5%208.81356%206.87361%209.35714%207.5C9.92948%208.15953%2011.5%208.5%2011.5%208.5C11.5%208.5%209.92948%208.69761%209.35714%209.35714C8.81356%209.98354%208.5%2011.5%208.5%2011.5C8.5%2011.5%208.32076%2010.1888%207.75%209.59091C7.14905%208.96136%205.5%208.5%205.5%208.5C5.5%208.5%206.99905%208.29251%207.6%207.6Z'%20fill='%231C1C1E'/%3e%3cpath%20d='M12.2%2012.2C13.3415%2010.8846%2014%208%2014%208C14%208%2014.6271%2010.7472%2015.7143%2012C16.859%2013.3191%2020%2014%2020%2014C20%2014%2016.859%2014.3952%2015.7143%2015.7143C14.6271%2016.9671%2014%2020%2014%2020C14%2020%2013.6415%2017.3777%2012.5%2016.1818C11.2981%2014.9227%208%2014%208%2014C8%2014%2010.9981%2013.585%2012.2%2012.2Z'%20fill='%231C1C1E'/%3e%3cpath%20d='M7.6%207.6C8.17076%206.94229%208.5%205.5%208.5%205.5C8.5%205.5%208.81356%206.87361%209.35714%207.5C9.92948%208.15953%2011.5%208.5%2011.5%208.5C11.5%208.5%209.92948%208.69761%209.35714%209.35714C8.81356%209.98354%208.5%2011.5%208.5%2011.5C8.5%2011.5%208.32076%2010.1888%207.75%209.59091C7.14905%208.96136%205.5%208.5%205.5%208.5C5.5%208.5%206.99905%208.29251%207.6%207.6Z'%20stroke='%231C1C1E'%20stroke-width='1.5'%20stroke-linecap='round'%20stroke-linejoin='round'/%3e%3cpath%20d='M12.2%2012.2C13.3415%2010.8846%2014%208%2014%208C14%208%2014.6271%2010.7472%2015.7143%2012C16.859%2013.3191%2020%2014%2020%2014C20%2014%2016.859%2014.3952%2015.7143%2015.7143C14.6271%2016.9671%2014%2020%2014%2020C14%2020%2013.6415%2017.3777%2012.5%2016.1818C11.2981%2014.9227%208%2014%208%2014C8%2014%2010.9981%2013.585%2012.2%2012.2Z'%20stroke='%231C1C1E'%20stroke-width='1.5'%20stroke-linecap='round'%20stroke-linejoin='round'/%3e%3c/svg%3e", Oe = { class: "flex gap-2" }, ke = { class: "grid grid-cols-2 gap-x-[16px] gap-y-[24px]" }, Pe = ["src"], Ee = { class: "p-[8px] absolute bottom-0 w-full bg-white fm-typo-en-body-lg-600" }, Me = /* @__PURE__ */ bt({
   __name: "ImageSideSheet",
   props: /* @__PURE__ */ Lt({
     imageRef: { type: [File, String] },
@@ -143,8 +136,8 @@ const Vt = () => {
     modelModifiers: {}
   }),
   emits: /* @__PURE__ */ Lt(["isOpen"], ["update:modelValue"]),
-  setup(k, { emit: f }) {
-    const nt = Dt(k, "modelValue"), it = k, lt = f, H = Nt(), J = gt(), c = gt([]);
+  setup(P, { emit: f }) {
+    const nt = Dt(P, "modelValue"), tt = P, lt = f, H = Nt(), J = gt(), c = gt([]);
     Gt(async () => {
       const o = await Yt.getMarketingMaterialThemes();
       o && (c.value = o);
@@ -154,7 +147,7 @@ const Vt = () => {
         H.open({ message: "Please select a theme.", type: "info" });
         return;
       }
-      if (!it.imageRef) {
+      if (!tt.imageRef) {
         H.open({ message: "Please upload an image.", type: "info" });
         return;
       }
@@ -166,13 +159,13 @@ const Vt = () => {
     return (o, e) => {
       const i = ft("FmButton"), t = ft("FmCard"), r = ft("FmSideSheet");
       return Q(), vt(r, {
-        "model-value": k.isOpen,
+        "model-value": P.isOpen,
         header: "Generate image",
         "max-width": 560,
         "onUpdate:modelValue": e[1] || (e[1] = (a) => lt("isOpen", a))
       }, {
         "side-sheet-footer": pt(() => [
-          Y("div", Te, [
+          Y("div", Oe, [
             ot(i, {
               label: "Generate",
               disabled: X(J) === void 0,
@@ -187,7 +180,7 @@ const Vt = () => {
         ]),
         default: pt(() => [
           e[2] || (e[2] = Y("p", { class: "fm-typo-en-title-sm-800" }, "Select theme", -1)),
-          Y("div", Oe, [
+          Y("div", ke, [
             (Q(!0), ut(xt, null, Ot(X(c), (a, n) => (Q(), vt(t, {
               variant: "outlined",
               key: `theme_${n}`,
@@ -202,8 +195,8 @@ const Vt = () => {
                   src: a.image,
                   style: { aspectRatio: 3 / 2, objectFit: "fill" },
                   class: "w-full h-full"
-                }, null, 8, ke),
-                Y("p", Pe, Tt(X(re)(a.key)), 1)
+                }, null, 8, Pe),
+                Y("p", Ee, Tt(X(re)(a.key)), 1)
               ]),
               _: 2
             }, 1032, ["class", "onClick"]))), 128))
@@ -213,7 +206,7 @@ const Vt = () => {
       }, 8, ["model-value"]);
     };
   }
-}), Me = /* @__PURE__ */ bt({
+}), Ae = /* @__PURE__ */ bt({
   __name: "SlideUpDown",
   props: {
     modelValue: {
@@ -223,9 +216,9 @@ const Vt = () => {
     modelModifiers: {}
   },
   emits: ["update:modelValue"],
-  setup(k) {
-    const f = Dt(k, "modelValue");
-    return (nt, it) => (Q(), vt(he, { name: "slide-fade" }, {
+  setup(P) {
+    const f = Dt(P, "modelValue");
+    return (nt, tt) => (Q(), vt(ce, { name: "slide-fade" }, {
       default: pt(() => [
         wt(Y("div", null, [
           ee(nt.$slots, "default")
@@ -236,7 +229,7 @@ const Vt = () => {
       _: 3
     }));
   }
-}), Ae = { class: "flex flex-row justify-center items-center p-[16px]" }, Fe = { class: "fm-typo-en-body-lg-600" }, De = { class: "pl-[32px]" }, Le = /* @__PURE__ */ bt({
+}), Fe = { class: "flex flex-row justify-center items-center p-[16px]" }, De = { class: "fm-typo-en-body-lg-600" }, Le = { class: "pl-[32px]" }, Ie = /* @__PURE__ */ bt({
   __name: "RewardDropDown",
   props: {
     type: { type: String, required: !0 },
@@ -245,13 +238,13 @@ const Vt = () => {
       required: !0
     }
   },
-  setup(k) {
-    const f = gt(!0), nt = k;
-    return (it, lt) => {
+  setup(P) {
+    const f = gt(!0), nt = P;
+    return (tt, lt) => {
       const H = ft("FmButton"), J = ft("FmRadio");
       return Q(), ut(xt, null, [
-        Y("div", Ae, [
-          Y("p", Fe, Tt(nt.type), 1),
+        Y("div", Fe, [
+          Y("p", De, Tt(nt.type), 1),
           lt[2] || (lt[2] = Y("div", { class: "grow" }, null, -1)),
           ot(H, {
             icon: X(f) ? "keyboard_arrow_up" : "keyboard_arrow_down",
@@ -259,13 +252,13 @@ const Vt = () => {
             onClick: lt[0] || (lt[0] = (c) => f.value = !X(f))
           }, null, 8, ["icon"])
         ]),
-        Y("div", De, [
-          ot(Me, {
+        Y("div", Le, [
+          ot(Ae, {
             modelValue: X(f),
             "onUpdate:modelValue": lt[1] || (lt[1] = (c) => At(f) ? f.value = c : null)
           }, {
             default: pt(() => [
-              (Q(!0), ut(xt, null, Ot(k.items, (c, s) => (Q(), vt(J, {
+              (Q(!0), ut(xt, null, Ot(P.items, (c, s) => (Q(), vt(J, {
                 key: `item_${s}`,
                 value: c._id,
                 label: c.name
@@ -277,7 +270,7 @@ const Vt = () => {
       ], 64);
     };
   }
-}), Ie = { class: "flex" }, je = { class: "py-[16px] px-[24px]" }, Re = { class: "flex flex-col gap-[40px] px-[24px] py-[16px]" }, Be = /* @__PURE__ */ bt({
+}), je = { class: "flex" }, Re = { class: "py-[16px] px-[24px]" }, Be = { class: "flex flex-col gap-[40px] px-[24px] py-[16px]" }, Xe = /* @__PURE__ */ bt({
   __name: "LinkRewardSideSheet",
   props: /* @__PURE__ */ Lt({
     campaigns: {
@@ -289,14 +282,14 @@ const Vt = () => {
     modelModifiers: {}
   }),
   emits: ["update:modelValue"],
-  setup(k) {
-    const f = k, nt = Ct(
+  setup(P) {
+    const f = P, nt = Ct(
       () => f.campaigns.filter(
         (e) => e.name.toLowerCase().indexOf(c.value) !== -1
       )
-    ), it = Ct(
+    ), tt = Ct(
       () => f.campaigns.reduce((e, i) => (e.hasOwnProperty(i.type) || (e[i.type] = i.type), e), {})
-    ), lt = Dt(k, "modelValue"), H = gt(lt.value), J = gt(!1), c = gt(""), s = Nt();
+    ), lt = Dt(P, "modelValue"), H = gt(lt.value), J = gt(!1), c = gt(""), s = Nt();
     function l() {
       if (H.value === "") {
         s.open({
@@ -337,7 +330,7 @@ const Vt = () => {
           })
         ]),
         "side-sheet-footer": pt(() => [
-          Y("div", Ie, [
+          Y("div", je, [
             ot(a, {
               label: "Add",
               disabled: lt.value === void 0,
@@ -351,7 +344,7 @@ const Vt = () => {
           ])
         ]),
         default: pt(() => [
-          Y("div", je, [
+          Y("div", Re, [
             ot(n, {
               modelValue: X(c),
               "onUpdate:modelValue": i[1] || (i[1] = (d) => At(c) ? c.value = d : null),
@@ -363,14 +356,14 @@ const Vt = () => {
             "onUpdate:modelValue": i[2] || (i[2] = (d) => At(H) ? H.value = d : null)
           }, {
             default: pt(() => [
-              Y("div", Re, [
-                (Q(!0), ut(xt, null, Ot(X(it), (d, g) => (Q(), vt(r, {
+              Y("div", Be, [
+                (Q(!0), ut(xt, null, Ot(X(tt), (d, g) => (Q(), vt(r, {
                   variant: "outlined",
                   key: `theme_${g}`,
                   class: "flex flex-col"
                 }, {
                   default: pt(() => [
-                    ot(Le, {
+                    ot(Ie, {
                       type: d,
                       items: X(nt).filter((m) => m.type === d)
                     }, null, 8, ["type", "items"])
@@ -386,7 +379,7 @@ const Vt = () => {
       }, 8, ["modelValue"]);
     };
   }
-}), Xe = { class: "flex gap-2" }, ze = { class: "grid grid-cols-2 gap-x-[16px] gap-y-[24px] pt-8" }, Ye = ["src"], We = { class: "p-[8px] absolute bottom-0 w-full bg-white fm-typo-en-body-lg-600" }, Ve = /* @__PURE__ */ bt({
+}), ze = { class: "flex gap-2" }, Ye = { class: "grid grid-cols-2 gap-x-[16px] gap-y-[24px] pt-8" }, We = ["src"], Ve = { class: "p-[8px] absolute bottom-0 w-full bg-white fm-typo-en-body-lg-600" }, He = /* @__PURE__ */ bt({
   __name: "HeadlineStyleSideSheet",
   props: /* @__PURE__ */ Lt({
     isOpen: { type: Boolean, required: !0, default: !1 },
@@ -400,28 +393,28 @@ const Vt = () => {
     modelModifiers: {}
   }),
   emits: /* @__PURE__ */ Lt(["isOpen"], ["update:modelValue"]),
-  setup(k, { emit: f }) {
-    const nt = Dt(k, "modelValue"), it = f, lt = Nt(), H = gt();
+  setup(P, { emit: f }) {
+    const nt = Dt(P, "modelValue"), tt = f, lt = Nt(), H = gt();
     function J() {
       if (H.value === void 0) {
         lt.open({ message: "Please select a style.", type: "info" });
         return;
       }
-      nt.value = H.value, it("isOpen", !1);
+      nt.value = H.value, tt("isOpen", !1);
     }
     function c() {
-      it("isOpen", !1);
+      tt("isOpen", !1);
     }
     return (s, l) => {
       const o = ft("FmButton"), e = ft("FmCard"), i = ft("FmSideSheet");
       return Q(), vt(i, {
-        "model-value": k.isOpen,
+        "model-value": P.isOpen,
         header: "Generate headline",
         "max-width": 560,
-        "onUpdate:modelValue": l[1] || (l[1] = (t) => it("isOpen", t))
+        "onUpdate:modelValue": l[1] || (l[1] = (t) => tt("isOpen", t))
       }, {
         "side-sheet-footer": pt(() => [
-          Y("div", Xe, [
+          Y("div", ze, [
             ot(o, {
               label: "Generate",
               disabled: X(H) === void 0,
@@ -436,8 +429,8 @@ const Vt = () => {
         ]),
         default: pt(() => [
           l[2] || (l[2] = Y("p", { class: "fm-typo-en-title-sm-800" }, "Select font style", -1)),
-          Y("div", ze, [
-            (Q(!0), ut(xt, null, Ot(k.styles, (t, r) => (Q(), vt(e, {
+          Y("div", Ye, [
+            (Q(!0), ut(xt, null, Ot(P.styles, (t, r) => (Q(), vt(e, {
               variant: "outlined",
               key: `style_${r}`,
               class: kt([
@@ -451,8 +444,8 @@ const Vt = () => {
                   src: t.image,
                   style: { aspectRatio: 3 / 2, objectFit: "fill" },
                   class: "w-full h-full"
-                }, null, 8, Ye),
-                Y("p", We, Tt(X(re)(t.key)), 1)
+                }, null, 8, We),
+                Y("p", Ve, Tt(X(re)(t.key)), 1)
               ]),
               _: 2
             }, 1032, ["class", "onClick"]))), 128))
@@ -462,17 +455,17 @@ const Vt = () => {
       }, 8, ["model-value"]);
     };
   }
-}), He = { class: "flex flex-col gap-[8px]" }, Ue = { class: "fm-typo-en-body-lg-400" }, Ge = { class: "fm-typo-en-body-md-400 text-fm-color-typo-secondary" }, Ne = { class: "flex w-[250px] h-[250px]" }, $e = { class: "flex flex-col gap-[8px]" }, qe = {
+}), Ue = { class: "flex flex-col gap-[8px]" }, Ge = { class: "fm-typo-en-body-lg-400" }, Ne = { class: "fm-typo-en-body-md-400 text-fm-color-typo-secondary" }, $e = { class: "flex w-[250px] h-[250px]" }, qe = { class: "flex flex-col gap-[8px]" }, Ke = {
   key: 1,
   src: Zt,
   class: "w-[24px] h-[24px]"
-}, Ke = { class: "flex flex-col gap-[8px]" }, Ze = {
+}, Ze = { class: "flex flex-col gap-[8px]" }, Je = {
   key: 1,
   class: "flex flex-row gap-4"
-}, Je = { class: "flex flex-col gap-[8px]" }, Qe = { class: "flex flex-row gap-4 justify-between" }, ti = {
+}, Qe = { class: "flex flex-col gap-[8px]" }, ti = { class: "flex flex-row gap-4 justify-between" }, ei = {
   key: 2,
   class: "flex flex-row gap-4"
-}, ei = ".png, .jpg, .jpeg", ii = /* @__PURE__ */ bt({
+}, ii = ".png, .jpg, .jpeg", ni = /* @__PURE__ */ bt({
   __name: "LeftSheet",
   props: /* @__PURE__ */ Lt({
     headlineStyles: {
@@ -497,12 +490,12 @@ const Vt = () => {
     isLoadingImageModifiers: {}
   }),
   emits: ["update:marketingMaterial", "update:captionIndex", "update:isLoadingImage"],
-  setup(k) {
-    const f = Dt(k, "marketingMaterial"), nt = Dt(k, "captionIndex"), it = Dt(k, "isLoadingImage"), lt = Ct(
+  setup(P) {
+    const f = Dt(P, "marketingMaterial"), nt = Dt(P, "captionIndex"), tt = Dt(P, "isLoadingImage"), lt = Ct(
       () => f.value.captions.map((p) => p.language)
     ), H = gt(""), J = gt(f.value.image), c = gt(!1), s = gt(!1), l = se(), { global: o } = ie;
     Gt(async () => {
-      it.value = !1, await o(async () => {
+      tt.value = !1, await o(async () => {
         await l.read();
       });
     });
@@ -510,7 +503,7 @@ const Vt = () => {
       (p) => f.value.campaign !== null && p._id === f.value.campaign
     ));
     function i() {
-      it.value || (c.value = !0);
+      tt.value || (c.value = !0);
     }
     async function t(p) {
       if (p === null) {
@@ -567,7 +560,7 @@ const Vt = () => {
           if (typeof J.value == "string" ? p = await fetch(J.value).then((w) => w.blob()).then((w) => new File([w], "image", { type: w.type })) : p = J.value, !p)
             return;
           try {
-            it.value = !0;
+            tt.value = !0;
             const v = await Yt.getMarketingMaterialAssets({
               image: p,
               themes: [H.value],
@@ -575,13 +568,13 @@ const Vt = () => {
             });
             f.value.assets = v.assets, f.value.image = v.raw;
           } finally {
-            it.value = !1;
+            tt.value = !1;
           }
         }
       },
       { immediate: !0 }
     ), (p, v) => {
-      const w = ft("FmTextField"), E = ft("FmButton"), L = ft("FmCard"), U = ft("FmCircularProgress"), q = ft("FmIcon"), Z = ce("ripple");
+      const w = ft("FmTextField"), E = ft("FmButton"), L = ft("FmCard"), U = ft("FmCircularProgress"), q = ft("FmIcon"), Z = ue("ripple");
       return Q(), vt(L, { class: "w-1/2 p-[24px] flex flex-col gap-[40px]" }, {
         default: pt(() => [
           ot(w, {
@@ -590,7 +583,7 @@ const Vt = () => {
             label: "Material name",
             placeholder: "Enter marketing name"
           }, null, 8, ["modelValue"]),
-          Y("div", He, [
+          Y("div", Ue, [
             v[13] || (v[13] = Y("p", { class: "fm-typo-en-title-sm-800" }, [
               Kt(" Link campaign "),
               Y("span", { class: "fm-typo-en-body-lg-400 text-fm-color-typo-secondary" }, "(optional)")
@@ -604,14 +597,14 @@ const Vt = () => {
                 var W, N;
                 return [
                   Y("div", null, [
-                    Y("p", Ue, Tt(X(zt)(((W = X(e)) == null ? void 0 : W.type) ?? "")), 1),
-                    Y("p", Ge, Tt((N = X(e)) == null ? void 0 : N.name), 1)
+                    Y("p", Ge, Tt(X(zt)(((W = X(e)) == null ? void 0 : W.type) ?? "")), 1),
+                    Y("p", Ne, Tt((N = X(e)) == null ? void 0 : N.name), 1)
                   ]),
                   v[12] || (v[12] = Y("div", { class: "grow" }, null, -1)),
                   ot(E, {
                     icon: "link_off",
                     variant: "tertiary",
-                    onClick: v[1] || (v[1] = (tt) => f.value.campaign = null)
+                    onClick: v[1] || (v[1] = (et) => f.value.campaign = null)
                   })
                 ];
               }),
@@ -619,7 +612,7 @@ const Vt = () => {
             }, 512), [
               [Pt, f.value.campaign !== null]
             ]),
-            wt(ot(Be, {
+            wt(ot(Xe, {
               modelValue: f.value.campaign,
               "onUpdate:modelValue": v[2] || (v[2] = (W) => f.value.campaign = W),
               campaigns: X(l).campaigns.all
@@ -627,36 +620,36 @@ const Vt = () => {
               [Pt, f.value.campaign === null]
             ])
           ]),
-          Y("div", Ne, [
-            ot(Ce, {
+          Y("div", $e, [
+            ot(xe, {
               label: "Upload your image",
-              accept: ei,
+              accept: ii,
               "aspect-ratio": "1/1",
               "recommended-size": "250px X 250px max size 8mb",
               thumbnail: f.value.image,
               "onUpdate:file": t
             }, null, 8, ["thumbnail"])
           ]),
-          Y("div", $e, [
+          Y("div", qe, [
             v[15] || (v[15] = Y("p", { class: "fm-typo-en-title-sm-800" }, "Generated image", -1)),
             v[16] || (v[16] = Y("p", { class: "fm-typo-en-body-lg-400 text-fm-color-typo-secondary" }, " Generated image will identify based on your uploaded image and selected theme. ", -1)),
             ot(L, {
               variant: "outlined",
-              class: kt(["px-[12px] py-[8px] gap-[8px] flex justify-center items-center hover:bg-fm-color-opacity-sm h-[36px] min-w-[200px] w-fit cursor-pointer relative", it.value ? "bg-white text-fm-color-typo-disabled" : ""]),
+              class: kt(["px-[12px] py-[8px] gap-[8px] flex justify-center items-center hover:bg-fm-color-opacity-sm h-[36px] min-w-[200px] w-fit cursor-pointer relative", tt.value ? "bg-white text-fm-color-typo-disabled" : ""]),
               onClick: i
             }, {
               default: pt(() => [
-                it.value ? (Q(), vt(U, {
+                tt.value ? (Q(), vt(U, {
                   key: 0,
                   size: "md"
-                })) : (Q(), ut("img", qe)),
+                })) : (Q(), ut("img", Ke)),
                 Y("p", {
-                  class: kt(["fm-typo-cn-body-lg-600", `${it.value ? "text-fm-color-typo-disabled" : ""}`])
+                  class: kt(["fm-typo-cn-body-lg-600", `${tt.value ? "text-fm-color-typo-disabled" : ""}`])
                 }, " Generated Image ", 2)
               ]),
               _: 1
             }, 8, ["class"]),
-            ot(Ee, {
+            ot(Me, {
               modelValue: X(H),
               "onUpdate:modelValue": v[3] || (v[3] = (W) => At(H) ? H.value = W : null),
               "image-ref": X(J),
@@ -664,7 +657,7 @@ const Vt = () => {
               onIsOpen: v[4] || (v[4] = (W) => c.value = W)
             }, null, 8, ["modelValue", "image-ref", "is-open"])
           ]),
-          Y("div", Ke, [
+          Y("div", Ze, [
             v[17] || (v[17] = Y("p", { class: "fm-typo-en-title-sm-800" }, "Generated headline", -1)),
             v[18] || (v[18] = Y("p", { class: "fm-typo-en-body-lg-400 text-fm-color-typo-secondary" }, " Generated headline will identify based on your marketing strategies and image. ", -1)),
             v[19] || (v[19] = Y("div", { class: "fm-typo-en-body-lg-400 flex gap-4 text-fm-color-typo-primary" }, " Headline ", -1)),
@@ -685,7 +678,7 @@ const Vt = () => {
                 X(m) ? (Q(), vt(U, {
                   key: 0,
                   size: "md"
-                })) : (Q(), ut("div", Ze, [
+                })) : (Q(), ut("div", Je, [
                   wt(ot(q, {
                     name: "image",
                     outline: "",
@@ -700,10 +693,10 @@ const Vt = () => {
                     onClick: n
                   })
                 ])),
-                ot(Ve, {
+                ot(He, {
                   modelValue: f.value.headline.key,
                   "onUpdate:modelValue": v[6] || (v[6] = (W) => f.value.headline.key = W),
-                  styles: k.headlineStyles,
+                  styles: P.headlineStyles,
                   "is-open": X(s),
                   onIsOpen: v[7] || (v[7] = (W) => s.value = W)
                 }, null, 8, ["modelValue", "styles", "is-open"])
@@ -711,7 +704,7 @@ const Vt = () => {
               _: 1
             }, 8, ["class"])
           ]),
-          Y("div", Je, [
+          Y("div", Qe, [
             v[20] || (v[20] = Y("p", { class: "fm-typo-en-title-sm-800" }, "Generated caption", -1)),
             v[21] || (v[21] = Y("p", { class: "fm-typo-en-body-lg-400 text-fm-color-typo-secondary" }, " Generated captions will identify based on your marketing strategies and image. ", -1)),
             ot(w, {
@@ -736,7 +729,7 @@ const Vt = () => {
                 }, null, 544), [
                   [te, f.value.captions[nt.value].content]
                 ]),
-                Y("div", Qe, [
+                Y("div", ti, [
                   X(g) ? (Q(), vt(U, {
                     key: 0,
                     size: "md"
@@ -746,7 +739,7 @@ const Vt = () => {
                     class: "w-[24px] h-[24px] cursor-pointer hover:bg-fm-color-opacity-sm rounded-xl",
                     onClick: a
                   })),
-                  X(lt).length > 1 ? (Q(), ut("div", ti, [
+                  X(lt).length > 1 ? (Q(), ut("div", ei, [
                     (Q(!0), ut(xt, null, Ot(X(lt), (W, N) => (Q(), vt(L, {
                       variant: "outlined",
                       class: "px-12 cursor-pointer",
@@ -769,15 +762,15 @@ const Vt = () => {
       });
     };
   }
-}), ni = "data:image/svg+xml,%3csvg%20width='21'%20height='14'%20viewBox='0%200%2021%2014'%20fill='none'%20xmlns='http://www.w3.org/2000/svg'%3e%3cg%20id='Group%2027'%3e%3ccircle%20id='Ellipse%209'%20cx='1.5'%20cy='7'%20r='1.5'%20fill='%23AEAEB2'/%3e%3cpath%20id='Vector'%20d='M14.5%200.5C10.9101%200.5%208%203.41006%208%207C8%2010.5899%2010.9101%2013.5%2014.5%2013.5C18.0899%2013.5%2021%2010.5899%2021%207C21%203.41006%2018.0899%200.5%2014.5%200.5ZM18.6935%206.14819V6.32982C18.6935%206.48367%2018.6065%206.62441%2018.4689%206.69308L18.0656%206.8949C18.0015%206.92696%2017.9301%206.94149%2017.8586%206.93703C17.7871%206.93256%2017.7181%206.90926%2017.6585%206.86948L17.1812%206.55129C17.1298%206.517%2017.0711%206.4949%2017.0098%206.48668C16.9485%206.47846%2016.8861%206.48433%2016.8274%206.50385L16.758%206.52692C16.5037%206.61157%2016.3999%206.91456%2016.5485%207.1376L16.8956%207.65812C16.9708%207.77109%2017.0976%207.83897%2017.2334%207.83897H17.4486C17.6729%207.83897%2017.8548%208.02087%2017.8548%208.24522V8.54244C17.8548%208.63024%2017.8263%208.71595%2017.7736%208.78619L17.2824%209.44091C17.2452%209.49071%2017.2198%209.54837%2017.2082%209.60944L17.0955%2010.2078C17.0793%2010.294%2017.0355%2010.3727%2016.9708%2010.4322C16.7224%2010.6596%2016.5024%2010.9162%2016.3155%2011.1964L15.974%2011.7088C15.9076%2011.8085%2015.8176%2011.8902%2015.7121%2011.9467C15.6065%2012.0032%2015.4886%2012.0328%2015.3689%2012.0328C15.0934%2012.0328%2014.8415%2011.8771%2014.7183%2011.6307C14.5747%2011.3435%2014.5%2011.0269%2014.5%2010.7058V9.92238C14.5%209.69802%2014.3181%209.51613%2014.0938%209.51613H13.4154C13.0357%209.51613%2012.6716%209.36516%2012.403%209.09677C12.1345%208.8282%2011.9837%208.46403%2011.9836%208.08429V7.71579C11.9836%207.26524%2012.1959%206.84091%2012.5563%206.57042L13.2792%206.02814C13.527%205.84227%2013.8285%205.74175%2014.1383%205.74167H14.1616C14.3839%205.74167%2014.6033%205.79331%2014.8019%205.8929L15.1877%206.08581C15.2842%206.13403%2015.3956%206.1419%2015.4978%206.10782L16.7378%205.6945C16.9037%205.63919%2017.0156%205.48403%2017.0156%205.30921C17.0156%205.08486%2016.8337%204.90296%2016.6094%204.90296H16.3449C16.2372%204.90296%2016.1339%204.86024%2016.0576%204.78397L15.8763%204.6026C15.8386%204.56487%2015.7938%204.53494%2015.7445%204.51452C15.6952%204.4941%2015.6424%204.4836%2015.589%204.48361H13.2288C13.0045%204.48361%2012.8226%204.30171%2012.8226%204.07736V3.96204C12.8226%203.77569%2012.9494%203.61319%2013.1303%203.56784L13.509%203.47323C13.607%203.44859%2013.6925%203.38857%2013.7486%203.30444L13.9603%202.98704C14.0356%202.87407%2014.1624%202.80619%2014.2982%202.80619H14.9327C15.1571%202.80619%2015.339%202.62429%2015.339%202.39994V1.83119C17.4153%202.16772%2019.083%203.72431%2019.5828%205.74194H19.0998C18.8754%205.74194%2018.6935%205.92383%2018.6935%206.14819Z'%20fill='%23AEAEB2'/%3e%3c/g%3e%3c/svg%3e";
+}), ri = "data:image/svg+xml,%3csvg%20width='21'%20height='14'%20viewBox='0%200%2021%2014'%20fill='none'%20xmlns='http://www.w3.org/2000/svg'%3e%3cg%20id='Group%2027'%3e%3ccircle%20id='Ellipse%209'%20cx='1.5'%20cy='7'%20r='1.5'%20fill='%23AEAEB2'/%3e%3cpath%20id='Vector'%20d='M14.5%200.5C10.9101%200.5%208%203.41006%208%207C8%2010.5899%2010.9101%2013.5%2014.5%2013.5C18.0899%2013.5%2021%2010.5899%2021%207C21%203.41006%2018.0899%200.5%2014.5%200.5ZM18.6935%206.14819V6.32982C18.6935%206.48367%2018.6065%206.62441%2018.4689%206.69308L18.0656%206.8949C18.0015%206.92696%2017.9301%206.94149%2017.8586%206.93703C17.7871%206.93256%2017.7181%206.90926%2017.6585%206.86948L17.1812%206.55129C17.1298%206.517%2017.0711%206.4949%2017.0098%206.48668C16.9485%206.47846%2016.8861%206.48433%2016.8274%206.50385L16.758%206.52692C16.5037%206.61157%2016.3999%206.91456%2016.5485%207.1376L16.8956%207.65812C16.9708%207.77109%2017.0976%207.83897%2017.2334%207.83897H17.4486C17.6729%207.83897%2017.8548%208.02087%2017.8548%208.24522V8.54244C17.8548%208.63024%2017.8263%208.71595%2017.7736%208.78619L17.2824%209.44091C17.2452%209.49071%2017.2198%209.54837%2017.2082%209.60944L17.0955%2010.2078C17.0793%2010.294%2017.0355%2010.3727%2016.9708%2010.4322C16.7224%2010.6596%2016.5024%2010.9162%2016.3155%2011.1964L15.974%2011.7088C15.9076%2011.8085%2015.8176%2011.8902%2015.7121%2011.9467C15.6065%2012.0032%2015.4886%2012.0328%2015.3689%2012.0328C15.0934%2012.0328%2014.8415%2011.8771%2014.7183%2011.6307C14.5747%2011.3435%2014.5%2011.0269%2014.5%2010.7058V9.92238C14.5%209.69802%2014.3181%209.51613%2014.0938%209.51613H13.4154C13.0357%209.51613%2012.6716%209.36516%2012.403%209.09677C12.1345%208.8282%2011.9837%208.46403%2011.9836%208.08429V7.71579C11.9836%207.26524%2012.1959%206.84091%2012.5563%206.57042L13.2792%206.02814C13.527%205.84227%2013.8285%205.74175%2014.1383%205.74167H14.1616C14.3839%205.74167%2014.6033%205.79331%2014.8019%205.8929L15.1877%206.08581C15.2842%206.13403%2015.3956%206.1419%2015.4978%206.10782L16.7378%205.6945C16.9037%205.63919%2017.0156%205.48403%2017.0156%205.30921C17.0156%205.08486%2016.8337%204.90296%2016.6094%204.90296H16.3449C16.2372%204.90296%2016.1339%204.86024%2016.0576%204.78397L15.8763%204.6026C15.8386%204.56487%2015.7938%204.53494%2015.7445%204.51452C15.6952%204.4941%2015.6424%204.4836%2015.589%204.48361H13.2288C13.0045%204.48361%2012.8226%204.30171%2012.8226%204.07736V3.96204C12.8226%203.77569%2012.9494%203.61319%2013.1303%203.56784L13.509%203.47323C13.607%203.44859%2013.6925%203.38857%2013.7486%203.30444L13.9603%202.98704C14.0356%202.87407%2014.1624%202.80619%2014.2982%202.80619H14.9327C15.1571%202.80619%2015.339%202.62429%2015.339%202.39994V1.83119C17.4153%202.16772%2019.083%203.72431%2019.5828%205.74194H19.0998C18.8754%205.74194%2018.6935%205.92383%2018.6935%206.14819Z'%20fill='%23AEAEB2'/%3e%3c/g%3e%3c/svg%3e";
 var Ht = {};
 /*! Fabric.js Copyright 2008-2015, Printio (Juriy Zaytsev, Maxim Chernyak) */
-(function(k) {
+(function(P) {
   var f = f || { version: "5.4.2" };
-  if (k.fabric = f, typeof document < "u" && typeof window < "u")
+  if (P.fabric = f, typeof document < "u" && typeof window < "u")
     document instanceof (typeof HTMLDocument < "u" ? HTMLDocument : Document) ? f.document = document : f.document = document.implementation.createHTMLDocument(""), f.window = window;
   else {
-    var nt = qt, it = new nt.JSDOM(
+    var nt = qt, tt = new nt.JSDOM(
       decodeURIComponent("%3C!DOCTYPE%20html%3E%3Chtml%3E%3Chead%3E%3C%2Fhead%3E%3Cbody%3E%3C%2Fbody%3E%3C%2Fhtml%3E"),
       {
         features: {
@@ -786,7 +779,7 @@ var Ht = {};
         resources: "usable"
       }
     ).window;
-    f.document = it.document, f.jsdomImplForWrapper = qt.implForWrapper, f.nodeCanvas = qt.Canvas, f.window = it, DOMParser = f.window.DOMParser;
+    f.document = tt.document, f.jsdomImplForWrapper = qt.implForWrapper, f.nodeCanvas = qt.Canvas, f.window = tt, DOMParser = f.window.DOMParser;
   }
   f.isTouchSupported = "ontouchstart" in f.window || "ontouchstart" in f.document || f.window && f.window.navigator && f.window.navigator.maxTouchPoints > 0, f.isLikelyNode = typeof Buffer < "u" && typeof window > "u", f.SHARED_ATTRIBUTES = [
     "display",
@@ -2004,7 +1997,7 @@ var Ht = {};
         return u;
       }
     };
-  }(k), function() {
+  }(P), function() {
     var c = Array.prototype.join, s = {
       m: 2,
       l: 2,
@@ -2019,8 +2012,8 @@ var Ht = {};
       m: "l",
       M: "L"
     };
-    function o(y, S, b, x, M, C, _, T, P, j, A) {
-      var z = f.util.cos(y), G = f.util.sin(y), $ = f.util.cos(S), F = f.util.sin(S), O = b * M * $ - x * C * F + _, I = x * M * $ + b * C * F + T, B = j + P * (-b * M * G - x * C * z), D = A + P * (-x * M * G + b * C * z), V = O + P * (b * M * F + x * C * $), K = I + P * (x * M * F - b * C * $);
+    function o(y, S, b, x, M, C, _, T, k, j, A) {
+      var z = f.util.cos(y), G = f.util.sin(y), $ = f.util.cos(S), F = f.util.sin(S), O = b * M * $ - x * C * F + _, I = x * M * $ + b * C * F + T, B = j + k * (-b * M * G - x * C * z), D = A + k * (-x * M * G + b * C * z), V = O + k * (b * M * F + x * C * $), K = I + k * (x * M * F - b * C * $);
       return [
         "C",
         B,
@@ -2032,7 +2025,7 @@ var Ht = {};
       ];
     }
     function e(y, S, b, x, M, C, _) {
-      var T = Math.PI, P = _ * T / 180, j = f.util.sin(P), A = f.util.cos(P), z = 0, G = 0;
+      var T = Math.PI, k = _ * T / 180, j = f.util.sin(k), A = f.util.cos(k), z = 0, G = 0;
       b = Math.abs(b), x = Math.abs(x);
       var $ = -A * y * 0.5 - j * S * 0.5, F = -A * S * 0.5 + j * y * 0.5, O = b * b, I = x * x, B = F * F, D = $ * $, V = O * I - O * B - I * D, K = 0;
       if (V < 0) {
@@ -2051,9 +2044,9 @@ var Ht = {};
       return C >= M ? C - M : 2 * Math.PI - (M - C);
     }
     function t(y, S, b, x, M, C, _, T) {
-      var P;
-      if (f.cachesBoundsOfCurve && (P = c.call(arguments), f.boundsOfCurveCache[P]))
-        return f.boundsOfCurveCache[P];
+      var k;
+      if (f.cachesBoundsOfCurve && (k = c.call(arguments), f.boundsOfCurveCache[k]))
+        return f.boundsOfCurveCache[k];
       var j = Math.sqrt, A = Math.min, z = Math.max, G = Math.abs, $ = [], F = [[], []], O, I, B, D, V, K, ht, rt;
       I = 6 * y - 12 * b + 6 * M, O = -3 * y + 9 * b - 9 * M + 3 * _, B = 3 * b - 3 * y;
       for (var R = 0; R < 2; ++R) {
@@ -2078,17 +2071,17 @@ var Ht = {};
           y: z.apply(null, F[1])
         }
       ];
-      return f.cachesBoundsOfCurve && (f.boundsOfCurveCache[P] = St), St;
+      return f.cachesBoundsOfCurve && (f.boundsOfCurveCache[k] = St), St;
     }
     function r(y, S, b) {
-      for (var x = b[1], M = b[2], C = b[3], _ = b[4], T = b[5], P = b[6], j = b[7], A = e(P - y, j - S, x, M, _, T, C), z = 0, G = A.length; z < G; z++)
+      for (var x = b[1], M = b[2], C = b[3], _ = b[4], T = b[5], k = b[6], j = b[7], A = e(k - y, j - S, x, M, _, T, C), z = 0, G = A.length; z < G; z++)
         A[z][1] += y, A[z][2] += S, A[z][3] += y, A[z][4] += S, A[z][5] += y, A[z][6] += S;
       return A;
     }
     function a(y) {
-      var S = 0, b = 0, x = y.length, M = 0, C = 0, _, T, P, j = [], A, z, G;
+      var S = 0, b = 0, x = y.length, M = 0, C = 0, _, T, k, j = [], A, z, G;
       for (T = 0; T < x; ++T) {
-        switch (P = !1, _ = y[T].slice(0), _[0]) {
+        switch (k = !1, _ = y[T].slice(0), _[0]) {
           case "l":
             _[0] = "L", _[1] += S, _[2] += b;
           case "L":
@@ -2132,14 +2125,14 @@ var Ht = {};
           case "a":
             _[0] = "A", _[6] += S, _[7] += b;
           case "A":
-            P = !0, j = j.concat(r(S, b, _)), S = _[6], b = _[7];
+            k = !0, j = j.concat(r(S, b, _)), S = _[6], b = _[7];
             break;
           case "z":
           case "Z":
             S = M, b = C;
             break;
         }
-        P || j.push(_), A = _[0];
+        k || j.push(_), A = _[0];
       }
       return j;
     }
@@ -2159,8 +2152,8 @@ var Ht = {};
       return (1 - y) * (1 - y) * (1 - y);
     }
     function m(y, S, b, x, M, C, _, T) {
-      return function(P) {
-        var j = h(P), A = u(P), z = d(P), G = g(P);
+      return function(k) {
+        var j = h(k), A = u(k), z = d(k), G = g(k);
         return {
           x: _ * j + M * A + b * z + y * G,
           y: T * j + C * A + x * z + S * G
@@ -2168,8 +2161,8 @@ var Ht = {};
       };
     }
     function p(y, S, b, x, M, C, _, T) {
-      return function(P) {
-        var j = 1 - P, A = 3 * j * j * (b - y) + 6 * j * P * (M - b) + 3 * P * P * (_ - M), z = 3 * j * j * (x - S) + 6 * j * P * (C - x) + 3 * P * P * (T - C);
+      return function(k) {
+        var j = 1 - k, A = 3 * j * j * (b - y) + 6 * j * k * (M - b) + 3 * k * k * (_ - M), z = 3 * j * j * (x - S) + 6 * j * k * (C - x) + 3 * k * k * (T - C);
         return Math.atan2(z, A);
       };
     }
@@ -2184,17 +2177,17 @@ var Ht = {};
     }
     function L(y, S, b, x, M, C) {
       return function(_) {
-        var T = v(_), P = w(_), j = E(_);
+        var T = v(_), k = w(_), j = E(_);
         return {
-          x: M * T + b * P + y * j,
-          y: C * T + x * P + S * j
+          x: M * T + b * k + y * j,
+          y: C * T + x * k + S * j
         };
       };
     }
     function U(y, S, b, x, M, C) {
       return function(_) {
-        var T = 1 - _, P = 2 * T * (b - y) + 2 * _ * (M - b), j = 2 * T * (x - S) + 2 * _ * (C - x);
-        return Math.atan2(j, P);
+        var T = 1 - _, k = 2 * T * (b - y) + 2 * _ * (M - b), j = 2 * T * (x - S) + 2 * _ * (C - x);
+        return Math.atan2(j, k);
       };
     }
     function q(y, S, b) {
@@ -2204,12 +2197,12 @@ var Ht = {};
       return C;
     }
     function Z(y, S) {
-      for (var b = 0, x = 0, M = y.iterator, C = { x: y.x, y: y.y }, _, T, P = 0.01, j = y.angleFinder, A; x < S && P > 1e-4; )
-        _ = M(b), A = b, T = n(C.x, C.y, _.x, _.y), T + x > S ? (b -= P, P /= 2) : (C = _, b += P, x += T);
+      for (var b = 0, x = 0, M = y.iterator, C = { x: y.x, y: y.y }, _, T, k = 0.01, j = y.angleFinder, A; x < S && k > 1e-4; )
+        _ = M(b), A = b, T = n(C.x, C.y, _.x, _.y), T + x > S ? (b -= k, k /= 2) : (C = _, b += k, x += T);
       return _.angle = j(A), _;
     }
     function W(y) {
-      for (var S = 0, b = y.length, x, M = 0, C = 0, _ = 0, T = 0, P = [], j, A, z, G = 0; G < b; G++) {
+      for (var S = 0, b = y.length, x, M = 0, C = 0, _ = 0, T = 0, k = [], j, A, z, G = 0; G < b; G++) {
         switch (x = y[G], A = {
           x: M,
           y: C,
@@ -2264,37 +2257,37 @@ var Ht = {};
             A.destX = _, A.destY = T, A.length = n(M, C, _, T), M = _, C = T;
             break;
         }
-        S += A.length, P.push(A);
+        S += A.length, k.push(A);
       }
-      return P.push({ length: S, x: M, y: C }), P;
+      return k.push({ length: S, x: M, y: C }), k;
     }
     function N(y, S, b) {
       b || (b = W(y));
       for (var x = 0; S - b[x].length > 0 && x < b.length - 2; )
         S -= b[x].length, x++;
-      var M = b[x], C = S / M.length, _ = M.command, T = y[x], P;
+      var M = b[x], C = S / M.length, _ = M.command, T = y[x], k;
       switch (_) {
         case "M":
           return { x: M.x, y: M.y, angle: 0 };
         case "Z":
         case "z":
-          return P = new f.Point(M.x, M.y).lerp(
+          return k = new f.Point(M.x, M.y).lerp(
             new f.Point(M.destX, M.destY),
             C
-          ), P.angle = Math.atan2(M.destY - M.y, M.destX - M.x), P;
+          ), k.angle = Math.atan2(M.destY - M.y, M.destX - M.x), k;
         case "L":
-          return P = new f.Point(M.x, M.y).lerp(
+          return k = new f.Point(M.x, M.y).lerp(
             new f.Point(T[1], T[2]),
             C
-          ), P.angle = Math.atan2(T[2] - M.y, T[1] - M.x), P;
+          ), k.angle = Math.atan2(T[2] - M.y, T[1] - M.x), k;
         case "C":
           return Z(M, S);
         case "Q":
           return Z(M, S);
       }
     }
-    function tt(y) {
-      var S = [], b = [], x, M, C = f.rePathCommand, _ = "[-+]?(?:\\d*\\.\\d+|\\d+\\.?)(?:[eE][-+]?\\d+)?\\s*", T = "(" + _ + ")" + f.commaWsp, P = "([01])" + f.commaWsp + "?", j = T + "?" + T + "?" + T + P + P + T + "?(" + _ + ")", A = new RegExp(j, "g"), z, G, $;
+    function et(y) {
+      var S = [], b = [], x, M, C = f.rePathCommand, _ = "[-+]?(?:\\d*\\.\\d+|\\d+\\.?)(?:[eE][-+]?\\d+)?\\s*", T = "(" + _ + ")" + f.commaWsp, k = "([01])" + f.commaWsp + "?", j = T + "?" + T + "?" + T + k + k + T + "?(" + _ + ")", A = new RegExp(j, "g"), z, G, $;
       if (!y || !y.match)
         return S;
       $ = y.match(/[mzlhvcsqta][^mzlhvcsqta]*/gi);
@@ -2320,17 +2313,17 @@ var Ht = {};
       return S;
     }
     function st(y, S) {
-      var b = [], x, M = new f.Point(y[0].x, y[0].y), C = new f.Point(y[1].x, y[1].y), _ = y.length, T = 1, P = 0, j = _ > 2;
-      for (S = S || 0, j && (T = y[2].x < C.x ? -1 : y[2].x === C.x ? 0 : 1, P = y[2].y < C.y ? -1 : y[2].y === C.y ? 0 : 1), b.push(["M", M.x - T * S, M.y - P * S]), x = 1; x < _; x++) {
+      var b = [], x, M = new f.Point(y[0].x, y[0].y), C = new f.Point(y[1].x, y[1].y), _ = y.length, T = 1, k = 0, j = _ > 2;
+      for (S = S || 0, j && (T = y[2].x < C.x ? -1 : y[2].x === C.x ? 0 : 1, k = y[2].y < C.y ? -1 : y[2].y === C.y ? 0 : 1), b.push(["M", M.x - T * S, M.y - k * S]), x = 1; x < _; x++) {
         if (!M.eq(C)) {
           var A = M.midPointFrom(C);
           b.push(["Q", M.x, M.y, A.x, A.y]);
         }
         M = y[x], x + 1 < y.length && (C = y[x + 1]);
       }
-      return j && (T = M.x > y[x - 2].x ? 1 : M.x === y[x - 2].x ? 0 : -1, P = M.y > y[x - 2].y ? 1 : M.y === y[x - 2].y ? 0 : -1), b.push(["L", M.x + T * S, M.y + P * S]), b;
+      return j && (T = M.x > y[x - 2].x ? 1 : M.x === y[x - 2].x ? 0 : -1, k = M.y > y[x - 2].y ? 1 : M.y === y[x - 2].y ? 0 : -1), b.push(["L", M.x + T * S, M.y + k * S]), b;
     }
-    function et(y, S, b) {
+    function it(y, S, b) {
       return b && (S = f.util.multiplyTransformMatrices(
         S,
         [1, 0, 0, 1, -b.x, -b.y]
@@ -2344,7 +2337,7 @@ var Ht = {};
       return y.map(function(S) {
         return S.join(" ");
       }).join(" ");
-    }, f.util.parsePath = tt, f.util.makePathSimpler = a, f.util.getSmoothPathFromPoints = st, f.util.getPathSegmentsInfo = W, f.util.getBoundsOfCurve = t, f.util.getPointOnPath = N, f.util.transformPath = et;
+    }, f.util.parsePath = et, f.util.makePathSimpler = a, f.util.getSmoothPathFromPoints = st, f.util.getPathSegmentsInfo = W, f.util.getBoundsOfCurve = t, f.util.getPointOnPath = N, f.util.transformPath = it;
   }(), function() {
     var c = Array.prototype.slice;
     function s(t, r) {
@@ -2732,10 +2725,10 @@ var Ht = {};
         completionRate: 0,
         durationRate: 0
       }), f.runningAnimations.push(d), a(function(m) {
-        var p = m || +/* @__PURE__ */ new Date(), v = h.duration || 500, w = p + v, E, L = h.onChange || o, U = h.abort || o, q = h.onComplete || o, Z = h.easing || e, W = "startValue" in h ? h.startValue.length > 0 : !1, N = "startValue" in h ? h.startValue : 0, tt = "endValue" in h ? h.endValue : 100, st = h.byValue || (W ? N.map(function(et, y) {
-          return tt[y] - N[y];
-        }) : tt - N);
-        h.onStart && h.onStart(), function et(y) {
+        var p = m || +/* @__PURE__ */ new Date(), v = h.duration || 500, w = p + v, E, L = h.onChange || o, U = h.abort || o, q = h.onComplete || o, Z = h.easing || e, W = "startValue" in h ? h.startValue.length > 0 : !1, N = "startValue" in h ? h.startValue : 0, et = "endValue" in h ? h.endValue : 100, st = h.byValue || (W ? N.map(function(it, y) {
+          return et[y] - N[y];
+        }) : et - N);
+        h.onStart && h.onStart(), function it(y) {
           E = y || +/* @__PURE__ */ new Date();
           var S = E > w ? v : E - p, b = S / v, x = W ? N.map(function(C, _) {
             return Z(S, N[_], st[_], v);
@@ -2746,10 +2739,10 @@ var Ht = {};
               return;
             }
             if (E > w) {
-              d.currentValue = W ? tt.slice() : tt, d.completionRate = 1, d.durationRate = 1, L(W ? tt.slice() : tt, 1, 1), q(tt, 1, 1), g();
+              d.currentValue = W ? et.slice() : et, d.completionRate = 1, d.durationRate = 1, L(W ? et.slice() : et, 1, 1), q(et, 1, 1), g();
               return;
             } else
-              L(x, M, b), a(et);
+              L(x, M, b), a(it);
           }
         }(p);
       }), d.cancel;
@@ -2900,14 +2893,14 @@ var Ht = {};
     function N(y, S, b, x, M) {
       return M === void 0 && (M = 1.70158), y /= x / 2, y < 1 ? b / 2 * (y * y * (((M *= 1.525) + 1) * y - M)) + S : b / 2 * ((y -= 2) * y * (((M *= 1.525) + 1) * y + M) + 2) + S;
     }
-    function tt(y, S, b, x) {
+    function et(y, S, b, x) {
       return b - st(x - y, 0, b, x) + S;
     }
     function st(y, S, b, x) {
       return (y /= x) < 1 / 2.75 ? b * (7.5625 * y * y) + S : y < 2 / 2.75 ? b * (7.5625 * (y -= 1.5 / 2.75) * y + 0.75) + S : y < 2.5 / 2.75 ? b * (7.5625 * (y -= 2.25 / 2.75) * y + 0.9375) + S : b * (7.5625 * (y -= 2.625 / 2.75) * y + 0.984375) + S;
     }
-    function et(y, S, b, x) {
-      return y < x / 2 ? tt(y * 2, 0, b, x) * 0.5 + S : st(y * 2 - x, 0, b, x) * 0.5 + b * 0.5 + S;
+    function it(y, S, b, x) {
+      return y < x / 2 ? et(y * 2, 0, b, x) * 0.5 + S : st(y * 2 - x, 0, b, x) * 0.5 + b * 0.5 + S;
     }
     f.util.ease = {
       /**
@@ -2961,9 +2954,9 @@ var Ht = {};
       easeInBack: Z,
       easeOutBack: W,
       easeInOutBack: N,
-      easeInBounce: tt,
+      easeInBounce: et,
       easeOutBounce: st,
-      easeInOutBounce: et
+      easeInOutBounce: it
     };
   }(), function(c) {
     var s = c.fabric || (c.fabric = {}), l = s.util.object.extend, o = s.util.object.clone, e = s.util.toFixed, i = s.util.parseUnit, t = s.util.multiplyTransformMatrices, r = [
@@ -3015,7 +3008,7 @@ var Ht = {};
     function p(C) {
       return C in u ? u[C] : C;
     }
-    function v(C, _, T, P) {
+    function v(C, _, T, k) {
       var j = Array.isArray(_), A;
       if ((C === "fill" || C === "stroke") && _ === "none")
         _ = "";
@@ -3036,7 +3029,7 @@ var Ht = {};
         else if (C === "textAnchor")
           _ = _ === "start" ? "left" : _ === "end" ? "right" : "center";
         else if (C === "charSpacing")
-          A = i(_, P) / P * 1e3;
+          A = i(_, k) / k * 1e3;
         else if (C === "paintFirst") {
           var z = _.indexOf("fill"), G = _.indexOf("stroke"), _ = "fill";
           (z > -1 && G > -1 && G < z || z === -1 && G > -1) && (_ = "stroke");
@@ -3045,7 +3038,7 @@ var Ht = {};
             return _;
           if (C === "imageSmoothing")
             return _ === "optimizeQuality";
-          A = j ? _.map(i) : i(_, P);
+          A = j ? _.map(i) : i(_, k);
         }
       }
       return !j && isNaN(A) ? _ : A;
@@ -3069,10 +3062,10 @@ var Ht = {};
       return C;
     }
     function L(C, _) {
-      var T, P = [], j, A, z;
+      var T, k = [], j, A, z;
       for (A = 0, z = _.length; A < z; A++)
-        T = _[A], j = C.getElementsByTagName(T), P = P.concat(Array.prototype.slice.call(j));
-      return P;
+        T = _[A], j = C.getElementsByTagName(T), k = k.concat(Array.prototype.slice.call(j));
+      return k;
     }
     s.parseTransformAttribute = function() {
       function C(R, at) {
@@ -3086,7 +3079,7 @@ var Ht = {};
       function T(R, at, ct) {
         R[ct] = Math.tan(s.util.degreesToRadians(at[0]));
       }
-      function P(R, at) {
+      function k(R, at) {
         R[4] = at[0], at.length === 2 && (R[5] = at[1]);
       }
       var j = s.iMatrix, A = s.reNum, z = s.commaWsp, G = "(?:(skewX)\\s*\\(\\s*(" + A + ")\\s*\\))", $ = "(?:(skewY)\\s*\\(\\s*(" + A + ")\\s*\\))", F = "(?:(rotate)\\s*\\(\\s*(" + A + ")(?:" + z + "(" + A + ")" + z + "(" + A + "))?\\s*\\))", O = "(?:(scale)\\s*\\(\\s*(" + A + ")(?:" + z + "(" + A + "))?\\s*\\))", I = "(?:(translate)\\s*\\(\\s*(" + A + ")(?:" + z + "(" + A + "))?\\s*\\))", B = "(?:(matrix)\\s*\\(\\s*(" + A + ")" + z + "(" + A + ")" + z + "(" + A + ")" + z + "(" + A + ")" + z + "(" + A + ")" + z + "(" + A + ")\\s*\\))", D = "(?:" + B + "|" + I + "|" + O + "|" + F + "|" + G + "|" + $ + ")", V = "(?:" + D + "(?:" + z + "*" + D + ")*)", K = "^\\s*(?:" + V + "?)\\s*$", ht = new RegExp(K), rt = new RegExp(D, "g");
@@ -3100,7 +3093,7 @@ var Ht = {};
           }), St = mt[1], _t = mt.slice(2).map(parseFloat);
           switch (St) {
             case "translate":
-              P(at, _t);
+              k(at, _t);
               break;
             case "rotate":
               _t[0] = s.util.degreesToRadians(_t[0]), C(at, _t);
@@ -3126,56 +3119,56 @@ var Ht = {};
       };
     }();
     function U(C, _) {
-      var T, P;
+      var T, k;
       C.replace(/;\s*$/, "").split(";").forEach(function(j) {
         var A = j.split(":");
-        T = A[0].trim().toLowerCase(), P = A[1].trim(), _[T] = P;
+        T = A[0].trim().toLowerCase(), k = A[1].trim(), _[T] = k;
       });
     }
     function q(C, _) {
-      var T, P;
+      var T, k;
       for (var j in C)
-        typeof C[j] > "u" || (T = j.toLowerCase(), P = C[j], _[T] = P);
+        typeof C[j] > "u" || (T = j.toLowerCase(), k = C[j], _[T] = k);
     }
     function Z(C, _) {
       var T = {};
-      for (var P in s.cssRules[_])
-        if (W(C, P.split(" ")))
-          for (var j in s.cssRules[_][P])
-            T[j] = s.cssRules[_][P][j];
+      for (var k in s.cssRules[_])
+        if (W(C, k.split(" ")))
+          for (var j in s.cssRules[_][k])
+            T[j] = s.cssRules[_][k][j];
       return T;
     }
     function W(C, _) {
-      var T, P = !0;
-      return T = tt(C, _.pop()), T && _.length && (P = N(C, _)), T && P && _.length === 0;
+      var T, k = !0;
+      return T = et(C, _.pop()), T && _.length && (k = N(C, _)), T && k && _.length === 0;
     }
     function N(C, _) {
-      for (var T, P = !0; C.parentNode && C.parentNode.nodeType === 1 && _.length; )
-        P && (T = _.pop()), C = C.parentNode, P = tt(C, T);
+      for (var T, k = !0; C.parentNode && C.parentNode.nodeType === 1 && _.length; )
+        k && (T = _.pop()), C = C.parentNode, k = et(C, T);
       return _.length === 0;
     }
-    function tt(C, _) {
-      var T = C.nodeName, P = C.getAttribute("class"), j = C.getAttribute("id"), A, z;
-      if (A = new RegExp("^" + T, "i"), _ = _.replace(A, ""), j && _.length && (A = new RegExp("#" + j + "(?![a-zA-Z\\-]+)", "i"), _ = _.replace(A, "")), P && _.length)
-        for (P = P.split(" "), z = P.length; z--; )
-          A = new RegExp("\\." + P[z] + "(?![a-zA-Z\\-]+)", "i"), _ = _.replace(A, "");
+    function et(C, _) {
+      var T = C.nodeName, k = C.getAttribute("class"), j = C.getAttribute("id"), A, z;
+      if (A = new RegExp("^" + T, "i"), _ = _.replace(A, ""), j && _.length && (A = new RegExp("#" + j + "(?![a-zA-Z\\-]+)", "i"), _ = _.replace(A, "")), k && _.length)
+        for (k = k.split(" "), z = k.length; z--; )
+          A = new RegExp("\\." + k[z] + "(?![a-zA-Z\\-]+)", "i"), _ = _.replace(A, "");
       return _.length === 0;
     }
     function st(C, _) {
       var T;
       if (C.getElementById && (T = C.getElementById(_)), T)
         return T;
-      var P, j, A, z = C.getElementsByTagName("*");
+      var k, j, A, z = C.getElementsByTagName("*");
       for (j = 0, A = z.length; j < A; j++)
-        if (P = z[j], _ === P.getAttribute("id"))
-          return P;
+        if (k = z[j], _ === k.getAttribute("id"))
+          return k;
     }
-    function et(C) {
+    function it(C) {
       for (var _ = L(C, ["use", "svg:use"]), T = 0; _.length && T < _.length; ) {
-        var P = _[T], j = P.getAttribute("xlink:href") || P.getAttribute("href");
+        var k = _[T], j = k.getAttribute("xlink:href") || k.getAttribute("href");
         if (j === null)
           return;
-        var A = j.slice(1), z = P.getAttribute("x") || 0, G = P.getAttribute("y") || 0, $ = st(C, A).cloneNode(!0), F = ($.getAttribute("transform") || "") + " translate(" + z + ", " + G + ")", O, I = _.length, B, D, V, K, ht = s.svgNS;
+        var A = j.slice(1), z = k.getAttribute("x") || 0, G = k.getAttribute("y") || 0, $ = st(C, A).cloneNode(!0), F = ($.getAttribute("transform") || "") + " translate(" + z + ", " + G + ")", O, I = _.length, B, D, V, K, ht = s.svgNS;
         if (S($), /^svg$/i.test($.nodeName)) {
           var rt = $.ownerDocument.createElementNS(ht, "g");
           for (D = 0, V = $.attributes, K = V.length; D < K; D++)
@@ -3184,9 +3177,9 @@ var Ht = {};
             rt.appendChild($.firstChild);
           $ = rt;
         }
-        for (D = 0, V = P.attributes, K = V.length; D < K; D++)
+        for (D = 0, V = k.attributes, K = V.length; D < K; D++)
           B = V.item(D), !(B.nodeName === "x" || B.nodeName === "y" || B.nodeName === "xlink:href" || B.nodeName === "href") && (B.nodeName === "transform" ? F = B.nodeValue + " " + F : $.setAttribute(B.nodeName, B.nodeValue));
-        $.setAttribute("transform", F), $.setAttribute("instantiated_by_use", "1"), $.removeAttribute("id"), O = P.parentNode, O.replaceChild($, P), _.length === I && T++;
+        $.setAttribute("transform", F), $.setAttribute("instantiated_by_use", "1"), $.removeAttribute("id"), O = k.parentNode, O.replaceChild($, k), _.length === I && T++;
       }
     }
     var y = new RegExp(
@@ -3195,14 +3188,14 @@ var Ht = {};
     function S(C) {
       if (!s.svgViewBoxElementsRegEx.test(C.nodeName))
         return {};
-      var _ = C.getAttribute("viewBox"), T = 1, P = 1, j = 0, A = 0, z, G, $, F, O = C.getAttribute("width"), I = C.getAttribute("height"), B = C.getAttribute("x") || 0, D = C.getAttribute("y") || 0, V = C.getAttribute("preserveAspectRatio") || "", K = !_ || !(_ = _.match(y)), ht = !O || !I || O === "100%" || I === "100%", rt = K && ht, R = {}, at = "", ct = 0, dt = 0;
+      var _ = C.getAttribute("viewBox"), T = 1, k = 1, j = 0, A = 0, z, G, $, F, O = C.getAttribute("width"), I = C.getAttribute("height"), B = C.getAttribute("x") || 0, D = C.getAttribute("y") || 0, V = C.getAttribute("preserveAspectRatio") || "", K = !_ || !(_ = _.match(y)), ht = !O || !I || O === "100%" || I === "100%", rt = K && ht, R = {}, at = "", ct = 0, dt = 0;
       if (R.width = 0, R.height = 0, R.toBeParsed = rt, K && (B || D) && C.parentNode && C.parentNode.nodeName !== "#document" && (at = " translate(" + i(B) + " " + i(D) + ") ", $ = (C.getAttribute("transform") || "") + at, C.setAttribute("transform", $), C.removeAttribute("x"), C.removeAttribute("y")), rt)
         return R;
       if (K)
         return R.width = i(O), R.height = i(I), R;
-      if (j = -parseFloat(_[1]), A = -parseFloat(_[2]), z = parseFloat(_[3]), G = parseFloat(_[4]), R.minX = j, R.minY = A, R.viewBoxWidth = z, R.viewBoxHeight = G, ht ? (R.width = z, R.height = G) : (R.width = i(O), R.height = i(I), T = R.width / z, P = R.height / G), V = s.util.parsePreserveAspectRatioAttribute(V), V.alignX !== "none" && (V.meetOrSlice === "meet" && (P = T = T > P ? P : T), V.meetOrSlice === "slice" && (P = T = T > P ? T : P), ct = R.width - z * T, dt = R.height - G * T, V.alignX === "Mid" && (ct /= 2), V.alignY === "Mid" && (dt /= 2), V.alignX === "Min" && (ct = 0), V.alignY === "Min" && (dt = 0)), T === 1 && P === 1 && j === 0 && A === 0 && B === 0 && D === 0)
+      if (j = -parseFloat(_[1]), A = -parseFloat(_[2]), z = parseFloat(_[3]), G = parseFloat(_[4]), R.minX = j, R.minY = A, R.viewBoxWidth = z, R.viewBoxHeight = G, ht ? (R.width = z, R.height = G) : (R.width = i(O), R.height = i(I), T = R.width / z, k = R.height / G), V = s.util.parsePreserveAspectRatioAttribute(V), V.alignX !== "none" && (V.meetOrSlice === "meet" && (k = T = T > k ? k : T), V.meetOrSlice === "slice" && (k = T = T > k ? T : k), ct = R.width - z * T, dt = R.height - G * T, V.alignX === "Mid" && (ct /= 2), V.alignY === "Mid" && (dt /= 2), V.alignX === "Min" && (ct = 0), V.alignY === "Min" && (dt = 0)), T === 1 && k === 1 && j === 0 && A === 0 && B === 0 && D === 0)
         return R;
-      if ((B || D) && C.parentNode.nodeName !== "#document" && (at = " translate(" + i(B) + " " + i(D) + ") "), $ = at + " matrix(" + T + " 0 0 " + P + " " + (j * T + ct) + " " + (A * P + dt) + ") ", C.nodeName === "svg") {
+      if ((B || D) && C.parentNode.nodeName !== "#document" && (at = " translate(" + i(B) + " " + i(D) + ") "), $ = at + " matrix(" + T + " 0 0 " + k + " " + (j * T + ct) + " " + (A * k + dt) + ") ", C.nodeName === "svg") {
         for (F = C.ownerDocument.createElementNS(s.svgNS, "g"); C.firstChild; )
           F.appendChild(C.firstChild);
         C.appendChild(F);
@@ -3216,11 +3209,11 @@ var Ht = {};
           return !0;
       return !1;
     }
-    s.parseSVGDocument = function(C, _, T, P) {
+    s.parseSVGDocument = function(C, _, T, k) {
       if (C) {
-        et(C);
+        it(C);
         var j = s.Object.__uid++, A, z, G = S(C), $ = s.util.toArray(C.getElementsByTagName("*"));
-        if (G.crossOrigin = P && P.crossOrigin, G.svgUid = j, $.length === 0 && s.isLikelyNode) {
+        if (G.crossOrigin = k && k.crossOrigin, G.svgUid = j, $.length === 0 && s.isLikelyNode) {
           $ = C.selectNodes('//*[name(.)!="svg"]');
           var F = [];
           for (A = 0, z = $.length; A < z; A++)
@@ -3244,17 +3237,17 @@ var Ht = {};
           });
         }), s.gradientDefs[j] = s.getGradientDefs(C), s.cssRules[j] = s.getCSSRules(C), s.clipPaths[j] = I, s.parseElements(O, function(B, D) {
           _ && (_(B, G, D, $), delete s.gradientDefs[j], delete s.cssRules[j], delete s.clipPaths[j]);
-        }, o(G), T, P);
+        }, o(G), T, k);
       }
     };
     function x(C, _) {
-      var T = ["gradientTransform", "x1", "x2", "y1", "y2", "gradientUnits", "cx", "cy", "r", "fx", "fy"], P = "xlink:href", j = _.getAttribute(P).slice(1), A = st(C, j);
-      if (A && A.getAttribute(P) && x(C, A), T.forEach(function(G) {
+      var T = ["gradientTransform", "x1", "x2", "y1", "y2", "gradientUnits", "cx", "cy", "r", "fx", "fy"], k = "xlink:href", j = _.getAttribute(k).slice(1), A = st(C, j);
+      if (A && A.getAttribute(k) && x(C, A), T.forEach(function(G) {
         A && !_.hasAttribute(G) && A.hasAttribute(G) && _.setAttribute(G, A.getAttribute(G));
       }), !_.children.length)
         for (var z = A.cloneNode(!0); z.firstChild; )
           _.appendChild(z.firstChild);
-      _.removeAttribute(P);
+      _.removeAttribute(k);
     }
     var M = new RegExp(
       "(normal|italic)?\\s*(normal|small-caps)?\\s*(normal|bold|bolder|lighter|100|200|300|400|500|600|700|800|900)?\\s*(" + s.reNum + "(?:px|cm|mm|em|pt|pc|in)*)(?:\\/(normal|" + s.reNum + "))?\\s+(.*)"
@@ -3271,8 +3264,8 @@ var Ht = {};
       parseFontDeclaration: function(C, _) {
         var T = C.match(M);
         if (T) {
-          var P = T[1], j = T[3], A = T[4], z = T[5], G = T[6];
-          P && (_.fontStyle = P), j && (_.fontWeight = isNaN(parseFloat(j)) ? j : parseFloat(j)), A && (_.fontSize = i(A)), G && (_.fontFamily = G), z && (_.lineHeight = z === "normal" ? 1 : z);
+          var k = T[1], j = T[3], A = T[4], z = T[5], G = T[6];
+          k && (_.fontStyle = k), j && (_.fontWeight = isNaN(parseFloat(j)) ? j : parseFloat(j)), A && (_.fontSize = i(A)), G && (_.fontFamily = G), z && (_.lineHeight = z === "normal" ? 1 : z);
         }
       },
       /**
@@ -3289,9 +3282,9 @@ var Ht = {};
           "radialGradient",
           "svg:linearGradient",
           "svg:radialGradient"
-        ], T = L(C, _), P, j = 0, A = {};
+        ], T = L(C, _), k, j = 0, A = {};
         for (j = T.length; j--; )
-          P = T[j], P.getAttribute("xlink:href") && x(C, P), A[P.getAttribute("id")] = P;
+          k = T[j], k.getAttribute("xlink:href") && x(C, k), A[k.getAttribute("id")] = k;
         return A;
       },
       /**
@@ -3305,10 +3298,10 @@ var Ht = {};
        */
       parseAttributes: function(C, _, T) {
         if (C) {
-          var P, j = {}, A, z;
+          var k, j = {}, A, z;
           typeof T > "u" && (T = C.getAttribute("svgUid")), C.parentNode && s.svgValidParentsRegEx.test(C.parentNode.nodeName) && (j = s.parseAttributes(C.parentNode, _, T));
           var G = _.reduce(function(V, K) {
-            return P = C.getAttribute(K), P && (V[K] = P), V;
+            return k = C.getAttribute(K), k && (V[K] = k), V;
           }, {}), $ = l(
             Z(C, T),
             s.parseStyleAttribute(C)
@@ -3334,8 +3327,8 @@ var Ht = {};
        * @param {Object} [options] Options object
        * @param {Function} [reviver] Method for further parsing of SVG elements, called after each fabric object created.
        */
-      parseElements: function(C, _, T, P, j) {
-        new s.ElementsParser(C, _, T, P, j).parse();
+      parseElements: function(C, _, T, k, j) {
+        new s.ElementsParser(C, _, T, k, j).parse();
       },
       /**
        * Parses "style" attribute, retuning an object with values
@@ -3359,8 +3352,8 @@ var Ht = {};
         if (!C)
           return null;
         C = C.replace(/,/g, " ").trim(), C = C.split(/\s+/);
-        var _ = [], T, P;
-        for (T = 0, P = C.length; T < P; T += 2)
+        var _ = [], T, k;
+        for (T = 0, k = C.length; T < k; T += 2)
           _.push({
             x: parseFloat(C[T]),
             y: parseFloat(C[T + 1])
@@ -3376,8 +3369,8 @@ var Ht = {};
        * @return {Object} CSS rules of this document
        */
       getCSSRules: function(C) {
-        var _ = C.getElementsByTagName("style"), T, P, j = {}, A;
-        for (T = 0, P = _.length; T < P; T++) {
+        var _ = C.getElementsByTagName("style"), T, k, j = {}, A;
+        for (T = 0, k = _.length; T < k; T++) {
           var z = _[T].textContent;
           z = z.replace(/\/\*[\s\S]*?\*\//g, ""), z.trim() !== "" && (A = z.split("}"), A = A.filter(function(G) {
             return G.trim();
@@ -3385,7 +3378,7 @@ var Ht = {};
             var $ = G.split("{"), F = {}, O = $[1].trim(), I = O.split(";").filter(function(K) {
               return K.trim();
             });
-            for (T = 0, P = I.length; T < P; T++) {
+            for (T = 0, k = I.length; T < k; T++) {
               var B = I[T].split(":"), D = B[0].trim(), V = B[1].trim();
               F[D] = V;
             }
@@ -3406,7 +3399,7 @@ var Ht = {};
        * @param {Object} [options] Object containing options for parsing
        * @param {String} [options.crossOrigin] crossOrigin crossOrigin setting to use for external resources
        */
-      loadSVGFromURL: function(C, _, T, P) {
+      loadSVGFromURL: function(C, _, T, k) {
         C = C.replace(/^\n\s*/, "").trim(), new s.util.request(C, {
           method: "get",
           onComplete: j
@@ -3417,7 +3410,7 @@ var Ht = {};
             return _ && _(null), !1;
           s.parseSVGDocument(z.documentElement, function(G, $, F, O) {
             _ && _(G, $, F, O);
-          }, T, P);
+          }, T, k);
         }
       },
       /**
@@ -3429,14 +3422,14 @@ var Ht = {};
        * @param {Object} [options] Object containing options for parsing
        * @param {String} [options.crossOrigin] crossOrigin crossOrigin setting to use for external resources
        */
-      loadSVGFromString: function(C, _, T, P) {
+      loadSVGFromString: function(C, _, T, k) {
         var j = new s.window.DOMParser(), A = j.parseFromString(C.trim(), "text/xml");
         s.parseSVGDocument(A.documentElement, function(z, G, $, F) {
           _(z, G, $, F);
-        }, T, P);
+        }, T, k);
       }
     });
-  }(k), f.ElementsParser = function(c, s, l, o, e, i) {
+  }(P), f.ElementsParser = function(c, s, l, o, e, i) {
     this.elements = c, this.callback = s, this.options = l, this.reviver = o, this.svgUid = l && l.svgUid || 0, this.parsingOptions = e, this.regexUrl = /^url\(['"]?#([^'"]+)['"]?\)/g, this.doc = i;
   }, function(c) {
     c.parse = function() {
@@ -3766,7 +3759,7 @@ var Ht = {};
         return new l(this.x, this.y);
       }
     };
-  }(k), function(c) {
+  }(P), function(c) {
     var s = c.fabric || (c.fabric = {});
     if (s.Intersection) {
       s.warn("fabric.Intersection is already defined");
@@ -3820,7 +3813,7 @@ var Ht = {};
       var t = e.min(i), r = e.max(i), a = new s.Point(r.x, t.y), n = new s.Point(t.x, r.y), h = l.intersectLinePolygon(t, a, o), u = l.intersectLinePolygon(a, r, o), d = l.intersectLinePolygon(r, n, o), g = l.intersectLinePolygon(n, t, o), m = new l();
       return m.appendPoints(h.points), m.appendPoints(u.points), m.appendPoints(d.points), m.appendPoints(g.points), m.points.length > 0 && (m.status = "Intersection"), m;
     };
-  }(k), function(c) {
+  }(P), function(c) {
     var s = c.fabric || (c.fabric = {});
     if (s.Color) {
       s.warn("fabric.Color is already defined.");
@@ -4181,7 +4174,7 @@ var Ht = {};
       var i = new l();
       return i.setSource(e), i;
     };
-  }(k), function(c) {
+  }(P), function(c) {
     var s = c.fabric || (c.fabric = {}), l = ["e", "se", "s", "sw", "w", "nw", "n", "ne", "e"], o = ["ns", "nesw", "ew", "nwse"], e = {}, i = "left", t = "top", r = "right", a = "bottom", n = "center", h = {
       top: a,
       bottom: t,
@@ -4253,7 +4246,7 @@ var Ht = {};
         return V.setPositionByOrigin(ht, I.originX, I.originY), rt;
       };
     }
-    function tt(F, O) {
+    function et(F, O) {
       return function(I, B, D, V) {
         var K = O(I, B, D, V);
         return K && m(F, W(I, B, D, V)), K;
@@ -4263,7 +4256,7 @@ var Ht = {};
       var V = F.target, K = V.controls[F.corner], ht = V.canvas.getZoom(), rt = V.padding / ht, R = V.toLocalPoint(new s.Point(B, D), O, I);
       return R.x >= rt && (R.x -= rt), R.x <= -rt && (R.x += rt), R.y >= rt && (R.y -= rt), R.y <= rt && (R.y += rt), R.x -= K.offsetX, R.y -= K.offsetY, R;
     }
-    function et(F) {
+    function it(F) {
       return F.flipX !== F.flipY;
     }
     function y(F, O, I, B, D) {
@@ -4276,7 +4269,7 @@ var Ht = {};
       var D = O.target, V = D._getTransformedDimensions(0, D.skewY), K = st(O, O.originX, O.originY, I, B), ht = Math.abs(K.x * 2) - V.x, rt = D.skewX, R;
       ht < 2 ? R = 0 : (R = u(
         Math.atan2(ht / D.scaleX, V.y / D.scaleY)
-      ), O.originX === i && O.originY === a && (R = -R), O.originX === r && O.originY === t && (R = -R), et(D) && (R = -R));
+      ), O.originX === i && O.originY === a && (R = -R), O.originX === r && O.originY === t && (R = -R), it(D) && (R = -R));
       var at = rt !== R;
       if (at) {
         var ct = D._getTransformedDimensions().y;
@@ -4288,7 +4281,7 @@ var Ht = {};
       var D = O.target, V = D._getTransformedDimensions(D.skewX, 0), K = st(O, O.originX, O.originY, I, B), ht = Math.abs(K.y * 2) - V.y, rt = D.skewY, R;
       ht < 2 ? R = 0 : (R = u(
         Math.atan2(ht / D.scaleY, V.x / D.scaleX)
-      ), O.originX === i && O.originY === a && (R = -R), O.originX === r && O.originY === t && (R = -R), et(D) && (R = -R));
+      ), O.originX === i && O.originY === a && (R = -R), O.originX === r && O.originY === t && (R = -R), it(D) && (R = -R));
       var at = rt !== R;
       if (at) {
         var ct = D._getTransformedDimensions().x;
@@ -4304,9 +4297,9 @@ var Ht = {};
         var rt = st(O, n, n, I, B);
         rt.x > 0 ? K = i : K = r;
       } else
-        V > 0 && (K = ht === t ? i : r), V < 0 && (K = ht === t ? r : i), et(D) && (K = K === i ? r : i);
+        V > 0 && (K = ht === t ? i : r), V < 0 && (K = ht === t ? r : i), it(D) && (K = K === i ? r : i);
       O.originX = K;
-      var R = tt("skewing", N(S));
+      var R = et("skewing", N(S));
       return R(F, O, I, B);
     }
     function M(F, O, I, B) {
@@ -4317,9 +4310,9 @@ var Ht = {};
         var rt = st(O, n, n, I, B);
         rt.y > 0 ? K = t : K = a;
       } else
-        V > 0 && (K = ht === i ? t : a), V < 0 && (K = ht === i ? a : t), et(D) && (K = K === t ? a : t);
+        V > 0 && (K = ht === i ? t : a), V < 0 && (K = ht === i ? a : t), it(D) && (K = K === t ? a : t);
       O.originY = K;
-      var R = tt("skewing", N(b));
+      var R = et("skewing", N(b));
       return R(F, O, I, B);
     }
     function C(F, O, I, B) {
@@ -4356,7 +4349,7 @@ var Ht = {};
     function T(F, O, I, B) {
       return _(F, O, I, B);
     }
-    function P(F, O, I, B) {
+    function k(F, O, I, B) {
       return _(F, O, I, B, { by: "x" });
     }
     function j(F, O, I, B) {
@@ -4376,8 +4369,8 @@ var Ht = {};
       var D = O.target, V = I - O.offsetX, K = B - O.offsetY, ht = !D.get("lockMovementX") && D.left !== V, rt = !D.get("lockMovementY") && D.top !== K;
       return ht && D.set("left", V), rt && D.set("top", K), (ht || rt) && m("moving", W(F, O, I, B)), ht || rt;
     }
-    e.scaleCursorStyleHandler = E, e.skewCursorStyleHandler = L, e.scaleSkewCursorStyleHandler = U, e.rotationWithSnapping = tt("rotating", N(C)), e.scalingEqually = tt("scaling", N(T)), e.scalingX = tt("scaling", N(P)), e.scalingY = tt("scaling", N(j)), e.scalingYOrSkewingX = A, e.scalingXOrSkewingY = z, e.changeWidth = tt("resizing", N(G)), e.skewHandlerX = x, e.skewHandlerY = M, e.dragHandler = $, e.scaleOrSkewActionName = q, e.rotationStyleHandler = Z, e.fireEvent = m, e.wrapWithFixedAnchor = N, e.wrapWithFireEvent = tt, e.getLocalPoint = st, s.controlsUtils = e;
-  }(k), function(c) {
+    e.scaleCursorStyleHandler = E, e.skewCursorStyleHandler = L, e.scaleSkewCursorStyleHandler = U, e.rotationWithSnapping = et("rotating", N(C)), e.scalingEqually = et("scaling", N(T)), e.scalingX = et("scaling", N(k)), e.scalingY = et("scaling", N(j)), e.scalingYOrSkewingX = A, e.scalingXOrSkewingY = z, e.changeWidth = et("resizing", N(G)), e.skewHandlerX = x, e.skewHandlerY = M, e.dragHandler = $, e.scaleOrSkewActionName = q, e.rotationStyleHandler = Z, e.fireEvent = m, e.wrapWithFixedAnchor = N, e.wrapWithFireEvent = et, e.getLocalPoint = st, s.controlsUtils = e;
+  }(P), function(c) {
     var s = c.fabric || (c.fabric = {}), l = s.util.degreesToRadians, o = s.controlsUtils;
     function e(t, r, a, n, h) {
       n = n || {};
@@ -4390,7 +4383,7 @@ var Ht = {};
       t.save(), t.fillStyle = n.cornerColor || h.cornerColor, t.strokeStyle = n.cornerStrokeColor || h.cornerStrokeColor, t.lineWidth = 1, t.translate(r, a), t.rotate(l(h.angle)), t[m + "Rect"](-v, -w, u, d), p && t.strokeRect(-v, -w, u, d), t.restore();
     }
     o.renderCircleControl = e, o.renderSquareControl = i;
-  }(k), function(c) {
+  }(P), function(c) {
     var s = c.fabric || (c.fabric = {});
     function l(o) {
       for (var e in o)
@@ -4673,7 +4666,7 @@ var Ht = {};
         }
       }
     };
-  }(k), function() {
+  }(P), function() {
     function c(i, t) {
       var r = i.getAttribute("style"), a = i.getAttribute("offset") || 0, n, h, u, d;
       if (a = parseFloat(a) / (/%$/.test(a) ? 100 : 1), a = a < 0 ? 0 : a > 1 ? 1 : a, r) {
@@ -4818,8 +4811,8 @@ var Ht = {};
          */
         toSVG: function(i, h) {
           var r = o(this.coords, !0), a, n, h = h || {}, u, d, g = o(this.colorStops, !0), m = r.r1 > r.r2, p = this.gradientTransform ? this.gradientTransform.concat() : f.iMatrix.concat(), v = -this.offsetX, w = -this.offsetY, E = !!h.additionalTransform, L = this.gradientUnits === "pixels" ? "userSpaceOnUse" : "objectBoundingBox";
-          if (g.sort(function(N, tt) {
-            return N.offset - tt.offset;
+          if (g.sort(function(N, et) {
+            return N.offset - et.offset;
           }), L === "objectBoundingBox" ? (v /= i.width, w /= i.height) : (v += i.width / 2, w += i.height / 2), i.type === "path" && this.gradientUnits !== "percentage" && (v -= i.pathOffset.x, w -= i.pathOffset.y), p[4] -= v, p[5] -= w, d = 'id="SVGID_' + this.id + '" gradientUnits="' + L + '"', d += ' gradientTransform="' + (E ? h.additionalTransform + " " : "") + f.util.matrixToSVG(p) + '" ', this.type === "linear" ? u = [
             "<linearGradient ",
             d,
@@ -5180,7 +5173,7 @@ var Ht = {};
         }
       }
     ), s.Shadow.reOffsetsAndBlur = /(?:\s|^)(-?\d+(?:\.\d*)?(?:px)?(?:\s?|$))?(-?\d+(?:\.\d*)?(?:px)?(?:\s?|$))?(\d+(?:\.\d*)?(?:px)?)?(?:\s?|$)(?:$|\s)/;
-  }(k), function() {
+  }(P), function() {
     if (f.StaticCanvas) {
       f.warn("fabric.StaticCanvas is already defined.");
       return;
@@ -9754,10 +9747,10 @@ var Ht = {};
             skipOffscreen: !1
           });
           n.format === "jpeg" && (N.backgroundColor = "#fff"), this.setPositionByOrigin(new s.Point(N.width / 2, N.height / 2), "center", "center");
-          var tt = this.canvas;
+          var et = this.canvas;
           N.add(this);
           var st = N.toCanvasElement(p || 1, n);
-          return this.shadow = g, this.set("canvas", tt), d && (this.group = d), this.set(u).setCoords(), N._objects = [], N.dispose(), N = null, st;
+          return this.shadow = g, this.set("canvas", et), d && (this.group = d), this.set(u).setCoords(), N._objects = [], N.dispose(), N = null, st;
         },
         /**
          * Converts an object into a data-url-like string
@@ -9907,7 +9900,7 @@ var Ht = {};
         });
       });
     }, s.Object.__uid = 0);
-  }(k), function() {
+  }(P), function() {
     var c = f.util.degreesToRadians, s = {
       left: -0.5,
       center: 0,
@@ -11343,7 +11336,7 @@ var Ht = {};
         }
       };
     }
-  }(k), function(c) {
+  }(P), function(c) {
     var s = c.fabric || (c.fabric = {}), l = s.util.degreesToRadians;
     if (s.Circle) {
       s.warn("fabric.Circle is already defined.");
@@ -11480,7 +11473,7 @@ var Ht = {};
     s.Circle.fromObject = function(e, i) {
       s.Object._fromObject("Circle", e, i);
     };
-  }(k), function(c) {
+  }(P), function(c) {
     var s = c.fabric || (c.fabric = {});
     if (s.Triangle) {
       s.warn("fabric.Triangle is already defined");
@@ -11541,7 +11534,7 @@ var Ht = {};
     ), s.Triangle.fromObject = function(l, o) {
       return s.Object._fromObject("Triangle", l, o);
     };
-  }(k), function(c) {
+  }(P), function(c) {
     var s = c.fabric || (c.fabric = {}), l = Math.PI * 2;
     if (s.Ellipse) {
       s.warn("fabric.Ellipse is already defined.");
@@ -11658,7 +11651,7 @@ var Ht = {};
     }, s.Ellipse.fromObject = function(o, e) {
       s.Object._fromObject("Ellipse", o, e);
     };
-  }(k), function(c) {
+  }(P), function(c) {
     var s = c.fabric || (c.fabric = {}), l = s.util.object.extend;
     if (s.Rect) {
       s.warn("fabric.Rect is already defined");
@@ -11764,7 +11757,7 @@ var Ht = {};
     }, s.Rect.fromObject = function(o, e) {
       return s.Object._fromObject("Rect", o, e);
     };
-  }(k), function(c) {
+  }(P), function(c) {
     var s = c.fabric || (c.fabric = {}), l = s.util.object.extend, o = s.util.array.min, e = s.util.array.max, i = s.util.toFixed, t = s.util.projectStrokeOnPoints;
     if (s.Polyline) {
       s.warn("fabric.Polyline is already defined");
@@ -11934,7 +11927,7 @@ var Ht = {};
     }, s.Polyline.fromElement = s.Polyline.fromElementGenerator("Polyline"), s.Polyline.fromObject = function(r, a) {
       return s.Object._fromObject("Polyline", r, a, "points");
     };
-  }(k), function(c) {
+  }(P), function(c) {
     var s = c.fabric || (c.fabric = {}), l = s.util.projectStrokeOnPoints;
     if (s.Polygon) {
       s.warn("fabric.Polygon is already defined");
@@ -11967,7 +11960,7 @@ var Ht = {};
     ), s.Polygon.ATTRIBUTE_NAMES = s.SHARED_ATTRIBUTES.concat(), s.Polygon.fromElement = s.Polyline.fromElementGenerator("Polygon"), s.Polygon.fromObject = function(o, e) {
       s.Object._fromObject("Polygon", o, e, "points");
     };
-  }(k), function(c) {
+  }(P), function(c) {
     var s = c.fabric || (c.fabric = {}), l = s.util.array.min, o = s.util.array.max, e = s.util.object.extend, i = s.util.object.clone, t = s.util.toFixed;
     if (s.Path) {
       s.warn("fabric.Path is already defined");
@@ -12204,7 +12197,7 @@ var Ht = {};
       var h = s.parseAttributes(r, s.Path.ATTRIBUTE_NAMES);
       h.fromSVG = !0, a(new s.Path(h.d, e(h, n)));
     };
-  }(k), function(c) {
+  }(P), function(c) {
     var s = c.fabric || (c.fabric = {}), l = s.util.array.min, o = s.util.array.max;
     s.Group || (s.Group = s.util.createClass(
       s.Object,
@@ -12585,7 +12578,7 @@ var Ht = {};
         });
       });
     });
-  }(k), function(c) {
+  }(P), function(c) {
     var s = c.fabric || (c.fabric = {});
     s.ActiveSelection || (s.ActiveSelection = s.util.createClass(
       s.Group,
@@ -12678,7 +12671,7 @@ var Ht = {};
         delete l.objects, o && o(new s.ActiveSelection(e, l, !0));
       });
     });
-  }(k), function(c) {
+  }(P), function(c) {
     var s = f.util.object.extend;
     if (c.fabric || (c.fabric = {}), c.fabric.Image) {
       f.warn("fabric.Image is already defined.");
@@ -13168,7 +13161,7 @@ var Ht = {};
         s(e ? f.util.object.clone(e) : {}, i)
       );
     };
-  }(k), f.util.object.extend(
+  }(P), f.util.object.extend(
     f.Object.prototype,
     /** @lends fabric.Object.prototype */
     {
@@ -13870,7 +13863,7 @@ gl_FragColor = color;
         }
       }
     ), s.Image.filters.ColorMatrix.fromObject = s.Image.filters.BaseFilter.fromObject;
-  }(k), function(c) {
+  }(P), function(c) {
     var s = c.fabric || (c.fabric = {}), l = s.Image.filters, o = s.util.createClass;
     l.Brightness = o(
       l.BaseFilter,
@@ -13943,7 +13936,7 @@ gl_FragColor = color;
         }
       }
     ), s.Image.filters.Brightness.fromObject = s.Image.filters.BaseFilter.fromObject;
-  }(k), function(c) {
+  }(P), function(c) {
     var s = c.fabric || (c.fabric = {}), l = s.util.object.extend, o = s.Image.filters, e = s.util.createClass;
     o.Convolute = e(
       o.BaseFilter,
@@ -14128,12 +14121,12 @@ gl_FragColor.a = alpha;
          * @param {ImageData} options.imageData The Uint8ClampedArray to be filtered.
          */
         applyTo2d: function(i) {
-          var t = i.imageData, r = t.data, a = this.matrix, n = Math.round(Math.sqrt(a.length)), h = Math.floor(n / 2), u = t.width, d = t.height, g = i.ctx.createImageData(u, d), m = g.data, p = this.opaque ? 1 : 0, v, w, E, L, U, q, Z, W, N, tt, st, et, y;
+          var t = i.imageData, r = t.data, a = this.matrix, n = Math.round(Math.sqrt(a.length)), h = Math.floor(n / 2), u = t.width, d = t.height, g = i.ctx.createImageData(u, d), m = g.data, p = this.opaque ? 1 : 0, v, w, E, L, U, q, Z, W, N, et, st, it, y;
           for (st = 0; st < d; st++)
-            for (tt = 0; tt < u; tt++) {
-              for (U = (st * u + tt) * 4, v = 0, w = 0, E = 0, L = 0, y = 0; y < n; y++)
-                for (et = 0; et < n; et++)
-                  Z = st + y - h, q = tt + et - h, !(Z < 0 || Z >= d || q < 0 || q >= u) && (W = (Z * u + q) * 4, N = a[y * n + et], v += r[W] * N, w += r[W + 1] * N, E += r[W + 2] * N, p || (L += r[W + 3] * N));
+            for (et = 0; et < u; et++) {
+              for (U = (st * u + et) * 4, v = 0, w = 0, E = 0, L = 0, y = 0; y < n; y++)
+                for (it = 0; it < n; it++)
+                  Z = st + y - h, q = et + it - h, !(Z < 0 || Z >= d || q < 0 || q >= u) && (W = (Z * u + q) * 4, N = a[y * n + it], v += r[W] * N, w += r[W + 1] * N, E += r[W + 2] * N, p || (L += r[W + 3] * N));
               m[U] = v, m[U + 1] = w, m[U + 2] = E, p ? m[U + 3] = r[U + 3] : m[U + 3] = L;
             }
           i.imageData = g;
@@ -14173,7 +14166,7 @@ gl_FragColor.a = alpha;
         }
       }
     ), s.Image.filters.Convolute.fromObject = s.Image.filters.BaseFilter.fromObject;
-  }(k), function(c) {
+  }(P), function(c) {
     var s = c.fabric || (c.fabric = {}), l = s.Image.filters, o = s.util.createClass;
     l.Grayscale = o(
       l.BaseFilter,
@@ -14276,7 +14269,7 @@ gl_FragColor = vec4(average, average, average, col.a);
         }
       }
     ), s.Image.filters.Grayscale.fromObject = s.Image.filters.BaseFilter.fromObject;
-  }(k), function(c) {
+  }(P), function(c) {
     var s = c.fabric || (c.fabric = {}), l = s.Image.filters, o = s.util.createClass;
     l.Invert = o(
       l.BaseFilter,
@@ -14349,7 +14342,7 @@ gl_FragColor = color;
         }
       }
     ), s.Image.filters.Invert.fromObject = s.Image.filters.BaseFilter.fromObject;
-  }(k), function(c) {
+  }(P), function(c) {
     var s = c.fabric || (c.fabric = {}), l = s.util.object.extend, o = s.Image.filters, e = s.util.createClass;
     o.Noise = e(
       o.BaseFilter,
@@ -14435,7 +14428,7 @@ gl_FragColor = color;
         }
       }
     ), s.Image.filters.Noise.fromObject = s.Image.filters.BaseFilter.fromObject;
-  }(k), function(c) {
+  }(P), function(c) {
     var s = c.fabric || (c.fabric = {}), l = s.Image.filters, o = s.util.createClass;
     l.Pixelate = o(
       l.BaseFilter,
@@ -14513,7 +14506,7 @@ gl_FragColor = color;
         }
       }
     ), s.Image.filters.Pixelate.fromObject = s.Image.filters.BaseFilter.fromObject;
-  }(k), function(c) {
+  }(P), function(c) {
     var s = c.fabric || (c.fabric = {}), l = s.util.object.extend, o = s.Image.filters, e = s.util.createClass;
     o.RemoveColor = e(
       o.BaseFilter,
@@ -14623,7 +14616,7 @@ gl_FragColor.a = 0.0;
         }
       }
     ), s.Image.filters.RemoveColor.fromObject = s.Image.filters.BaseFilter.fromObject;
-  }(k), function(c) {
+  }(P), function(c) {
     var s = c.fabric || (c.fabric = {}), l = s.Image.filters, o = s.util.createClass, e = {
       Brownie: [
         0.5997,
@@ -14809,7 +14802,7 @@ gl_FragColor.a = 0.0;
           colorsOnly: !0
         }
       ), s.Image.filters[i].fromObject = s.Image.filters.BaseFilter.fromObject;
-  }(k), function(c) {
+  }(P), function(c) {
     var s = c.fabric, l = s.Image.filters, o = s.util.createClass;
     l.BlendColor = o(
       l.BaseFilter,
@@ -14983,7 +14976,7 @@ if (color.a > 0.0) {
         }
       }
     ), s.Image.filters.BlendColor.fromObject = s.Image.filters.BaseFilter.fromObject;
-  }(k), function(c) {
+  }(P), function(c) {
     var s = c.fabric, l = s.Image.filters, o = s.util.createClass;
     l.BlendImage = o(
       l.BaseFilter,
@@ -15141,7 +15134,7 @@ gl_FragColor = color;
         r.image = t, i(new s.Image.filters.BlendImage(r));
       });
     };
-  }(k), function(c) {
+  }(P), function(c) {
     var s = c.fabric || (c.fabric = {}), l = Math.pow, o = Math.floor, e = Math.sqrt, i = Math.abs, t = Math.round, r = Math.sin, a = Math.ceil, n = s.Image.filters, h = s.util.createClass;
     n.Resize = h(
       n.BaseFilter,
@@ -15299,10 +15292,10 @@ varying vec2 vTexCoord;
          * @returns {ImageData}
          */
         sliceByTwo: function(u, d, g, m, p) {
-          var v = u.imageData, w = 0.5, E = !1, L = !1, U = d * w, q = g * w, Z = s.filterBackend.resources, W, N, tt = 0, st = 0, et = d, y = 0;
+          var v = u.imageData, w = 0.5, E = !1, L = !1, U = d * w, q = g * w, Z = s.filterBackend.resources, W, N, et = 0, st = 0, it = d, y = 0;
           for (Z.sliceByTwo || (Z.sliceByTwo = document.createElement("canvas")), W = Z.sliceByTwo, (W.width < d * 1.5 || W.height < g) && (W.width = d * 1.5, W.height = g), N = W.getContext("2d"), N.clearRect(0, 0, d * 1.5, g), N.putImageData(v, 0, 0), m = o(m), p = o(p); !E || !L; )
-            d = U, g = q, m < o(U * w) ? U = o(U * w) : (U = m, E = !0), p < o(q * w) ? q = o(q * w) : (q = p, L = !0), N.drawImage(W, tt, st, d, g, et, y, U, q), tt = et, st = y, y += q;
-          return N.getImageData(tt, st, m, p);
+            d = U, g = q, m < o(U * w) ? U = o(U * w) : (U = m, E = !0), p < o(q * w) ? q = o(q * w) : (q = p, L = !0), N.drawImage(W, et, st, d, g, it, y, U, q), et = it, st = y, y += q;
+          return N.getImageData(et, st, m, p);
         },
         /**
          * Filter lanczosResize
@@ -15315,19 +15308,19 @@ varying vec2 vTexCoord;
          */
         lanczosResize: function(u, d, g, m, p) {
           function v(b) {
-            var x, M, C, _, T, P, j, A, z, G, $;
+            var x, M, C, _, T, k, j, A, z, G, $;
             for (y.x = (b + 0.5) * q, S.x = o(y.x), x = 0; x < p; x++) {
-              for (y.y = (x + 0.5) * Z, S.y = o(y.y), T = 0, P = 0, j = 0, A = 0, z = 0, M = S.x - tt; M <= S.x + tt; M++)
+              for (y.y = (x + 0.5) * Z, S.y = o(y.y), T = 0, k = 0, j = 0, A = 0, z = 0, M = S.x - et; M <= S.x + et; M++)
                 if (!(M < 0 || M >= d)) {
-                  G = o(1e3 * i(M - y.x)), et[G] || (et[G] = {});
+                  G = o(1e3 * i(M - y.x)), it[G] || (it[G] = {});
                   for (var F = S.y - st; F <= S.y + st; F++)
-                    F < 0 || F >= g || ($ = o(1e3 * i(F - y.y)), et[G][$] || (et[G][$] = U(e(l(G * W, 2) + l($ * N, 2)) / 1e3)), C = et[G][$], C > 0 && (_ = (F * d + M) * 4, T += C, P += C * w[_], j += C * w[_ + 1], A += C * w[_ + 2], z += C * w[_ + 3]));
+                    F < 0 || F >= g || ($ = o(1e3 * i(F - y.y)), it[G][$] || (it[G][$] = U(e(l(G * W, 2) + l($ * N, 2)) / 1e3)), C = it[G][$], C > 0 && (_ = (F * d + M) * 4, T += C, k += C * w[_], j += C * w[_ + 1], A += C * w[_ + 2], z += C * w[_ + 3]));
                 }
-              _ = (x * m + b) * 4, L[_] = P / T, L[_ + 1] = j / T, L[_ + 2] = A / T, L[_ + 3] = z / T;
+              _ = (x * m + b) * 4, L[_] = k / T, L[_ + 1] = j / T, L[_ + 2] = A / T, L[_ + 3] = z / T;
             }
             return ++b < m ? v(b) : E;
           }
-          var w = u.imageData.data, E = u.ctx.createImageData(m, p), L = E.data, U = this.lanczosCreate(this.lanczosLobes), q = this.rcpScaleX, Z = this.rcpScaleY, W = 2 / this.rcpScaleX, N = 2 / this.rcpScaleY, tt = a(q * this.lanczosLobes / 2), st = a(Z * this.lanczosLobes / 2), et = {}, y = {}, S = {};
+          var w = u.imageData.data, E = u.ctx.createImageData(m, p), L = E.data, U = this.lanczosCreate(this.lanczosLobes), q = this.rcpScaleX, Z = this.rcpScaleY, W = 2 / this.rcpScaleX, N = 2 / this.rcpScaleY, et = a(q * this.lanczosLobes / 2), st = a(Z * this.lanczosLobes / 2), it = {}, y = {}, S = {};
           return v(0);
         },
         /**
@@ -15340,11 +15333,11 @@ varying vec2 vTexCoord;
          * @returns {ImageData}
          */
         bilinearFiltering: function(u, d, g, m, p) {
-          var v, w, E, L, U, q, Z, W, N, tt, st, et, y = 0, S, b = this.rcpScaleX, x = this.rcpScaleY, M = 4 * (d - 1), C = u.imageData, _ = C.data, T = u.ctx.createImageData(m, p), P = T.data;
+          var v, w, E, L, U, q, Z, W, N, et, st, it, y = 0, S, b = this.rcpScaleX, x = this.rcpScaleY, M = 4 * (d - 1), C = u.imageData, _ = C.data, T = u.ctx.createImageData(m, p), k = T.data;
           for (Z = 0; Z < p; Z++)
             for (W = 0; W < m; W++)
-              for (U = o(b * W), q = o(x * Z), N = b * W - U, tt = x * Z - q, S = 4 * (q * d + U), st = 0; st < 4; st++)
-                v = _[S + st], w = _[S + 4 + st], E = _[S + M + st], L = _[S + M + 4 + st], et = v * (1 - N) * (1 - tt) + w * N * (1 - tt) + E * tt * (1 - N) + L * N * tt, P[y++] = et;
+              for (U = o(b * W), q = o(x * Z), N = b * W - U, et = x * Z - q, S = 4 * (q * d + U), st = 0; st < 4; st++)
+                v = _[S + st], w = _[S + 4 + st], E = _[S + M + st], L = _[S + M + 4 + st], it = v * (1 - N) * (1 - et) + w * N * (1 - et) + E * et * (1 - N) + L * N * et, k[y++] = it;
           return T;
         },
         /**
@@ -15358,11 +15351,11 @@ varying vec2 vTexCoord;
          */
         hermiteFastResize: function(u, d, g, m, p) {
           for (var v = this.rcpScaleX, w = this.rcpScaleY, E = a(v / 2), L = a(w / 2), U = u.imageData, q = U.data, Z = u.ctx.createImageData(m, p), W = Z.data, N = 0; N < p; N++)
-            for (var tt = 0; tt < m; tt++) {
-              for (var st = (tt + N * m) * 4, et = 0, y = 0, S = 0, b = 0, x = 0, M = 0, C = 0, _ = (N + 0.5) * w, T = o(N * w); T < (N + 1) * w; T++)
-                for (var P = i(_ - (T + 0.5)) / L, j = (tt + 0.5) * v, A = P * P, z = o(tt * v); z < (tt + 1) * v; z++) {
+            for (var et = 0; et < m; et++) {
+              for (var st = (et + N * m) * 4, it = 0, y = 0, S = 0, b = 0, x = 0, M = 0, C = 0, _ = (N + 0.5) * w, T = o(N * w); T < (N + 1) * w; T++)
+                for (var k = i(_ - (T + 0.5)) / L, j = (et + 0.5) * v, A = k * k, z = o(et * v); z < (et + 1) * v; z++) {
                   var G = i(j - (z + 0.5)) / E, $ = e(A + G * G);
-                  $ > 1 && $ < -1 || (et = 2 * $ * $ * $ - 3 * $ * $ + 1, et > 0 && (G = 4 * (z + T * d), C += et * q[G + 3], S += et, q[G + 3] < 255 && (et = et * q[G + 3] / 250), b += et * q[G], x += et * q[G + 1], M += et * q[G + 2], y += et));
+                  $ > 1 && $ < -1 || (it = 2 * $ * $ * $ - 3 * $ * $ + 1, it > 0 && (G = 4 * (z + T * d), C += it * q[G + 3], S += it, q[G + 3] < 255 && (it = it * q[G + 3] / 250), b += it * q[G], x += it * q[G + 1], M += it * q[G + 2], y += it));
                 }
               W[st] = b / y, W[st + 1] = x / y, W[st + 2] = M / y, W[st + 3] = C / S;
             }
@@ -15383,7 +15376,7 @@ varying vec2 vTexCoord;
         }
       }
     ), s.Image.filters.Resize.fromObject = s.Image.filters.BaseFilter.fromObject;
-  }(k), function(c) {
+  }(P), function(c) {
     var s = c.fabric || (c.fabric = {}), l = s.Image.filters, o = s.util.createClass;
     l.Contrast = o(
       l.BaseFilter,
@@ -15453,7 +15446,7 @@ gl_FragColor = color;
         }
       }
     ), s.Image.filters.Contrast.fromObject = s.Image.filters.BaseFilter.fromObject;
-  }(k), function(c) {
+  }(P), function(c) {
     var s = c.fabric || (c.fabric = {}), l = s.Image.filters, o = s.util.createClass;
     l.Saturation = o(
       l.BaseFilter,
@@ -15529,7 +15522,7 @@ gl_FragColor = color;
         }
       }
     ), s.Image.filters.Saturation.fromObject = s.Image.filters.BaseFilter.fromObject;
-  }(k), function(c) {
+  }(P), function(c) {
     var s = c.fabric || (c.fabric = {}), l = s.Image.filters, o = s.util.createClass;
     l.Vibrance = o(
       l.BaseFilter,
@@ -15606,7 +15599,7 @@ gl_FragColor = color;
         }
       }
     ), s.Image.filters.Vibrance.fromObject = s.Image.filters.BaseFilter.fromObject;
-  }(k), function(c) {
+  }(P), function(c) {
     var s = c.fabric || (c.fabric = {}), l = s.Image.filters, o = s.util.createClass;
     l.Blur = o(
       l.BaseFilter,
@@ -15712,7 +15705,7 @@ gl_FragColor = color / total;
         }
       }
     ), l.Blur.fromObject = s.Image.filters.BaseFilter.fromObject;
-  }(k), function(c) {
+  }(P), function(c) {
     var s = c.fabric || (c.fabric = {}), l = s.Image.filters, o = s.util.createClass;
     l.Gamma = o(
       l.BaseFilter,
@@ -15791,7 +15784,7 @@ gl_FragColor.rgb *= color.a;
         }
       }
     ), s.Image.filters.Gamma.fromObject = s.Image.filters.BaseFilter.fromObject;
-  }(k), function(c) {
+  }(P), function(c) {
     var s = c.fabric || (c.fabric = {}), l = s.Image.filters, o = s.util.createClass;
     l.Composed = o(
       l.BaseFilter,
@@ -15844,7 +15837,7 @@ gl_FragColor.rgb *= color.a;
       }), a = new s.Image.filters.Composed({ subFilters: r });
       return i && i(a), a;
     };
-  }(k), function(c) {
+  }(P), function(c) {
     var s = c.fabric || (c.fabric = {}), l = s.Image.filters, o = s.util.createClass;
     l.HueRotation = o(
       l.ColorMatrix,
@@ -15921,7 +15914,7 @@ gl_FragColor.rgb *= color.a;
         }
       }
     ), s.Image.filters.HueRotation.fromObject = s.Image.filters.BaseFilter.fromObject;
-  }(k), function(c) {
+  }(P), function(c) {
     var s = c.fabric || (c.fabric = {}), l = s.util.object.clone;
     if (s.Text) {
       s.warn("fabric.Text is already defined");
@@ -16636,8 +16629,8 @@ gl_FragColor.rgb *= color.a;
             this._renderChar(e, i, n, 0, t.join(""), r, a, h), i.restore();
             return;
           }
-          for (var N = 0, tt = t.length - 1; N <= tt; N++)
-            w = N === tt || this.charSpacing || E, m += t[N], p = this.__charBounds[n][N], v === 0 ? (r += q * (p.kernedWidth - p.width), v += p.width) : v += p.kernedWidth, u && !w && this._reSpaceAndTab.test(t[N]) && (w = !0), w || (d = d || this.getCompleteStyleDeclaration(n, N), g = this.getCompleteStyleDeclaration(n, N + 1), w = s.util.hasStyleChanged(d, g, !1)), w && (E ? (i.save(), i.translate(p.renderLeft, p.renderTop), i.rotate(p.angle), this._renderChar(e, i, n, N, m, -v / 2, 0, h), i.restore()) : (Z = r, this._renderChar(e, i, n, N, m, Z, a, h)), m = "", d = g, r += q * v, v = 0);
+          for (var N = 0, et = t.length - 1; N <= et; N++)
+            w = N === et || this.charSpacing || E, m += t[N], p = this.__charBounds[n][N], v === 0 ? (r += q * (p.kernedWidth - p.width), v += p.width) : v += p.kernedWidth, u && !w && this._reSpaceAndTab.test(t[N]) && (w = !0), w || (d = d || this.getCompleteStyleDeclaration(n, N), g = this.getCompleteStyleDeclaration(n, N + 1), w = s.util.hasStyleChanged(d, g, !1)), w && (E ? (i.save(), i.translate(p.renderLeft, p.renderTop), i.rotate(p.angle), this._renderChar(e, i, n, N, m, -v / 2, 0, h), i.restore()) : (Z = r, this._renderChar(e, i, n, N, m, Z, a, h)), m = "", d = g, r += q * v, v = 0);
           i.restore();
         },
         /**
@@ -16769,14 +16762,14 @@ gl_FragColor.rgb *= color.a;
         _renderTextDecoration: function(e, i) {
           if (!(!this[i] && !this.styleHas(i))) {
             e.save(), (i === "overline" || i === "linethrough") && this._removeShadow(e);
-            for (var t, r, a, n, h, u, d, g, m = this._getLeftOffset(), p = this._getTopOffset(), v, w, E, L, U, q, Z, W, N = this.path, tt = this._getWidthOfCharSpacing(), st = this.offsets[i], et = 0, y = this._textLines.length; et < y; et++) {
-              if (t = this.getHeightOfLine(et), !this[i] && !this.styleHas(i, et)) {
+            for (var t, r, a, n, h, u, d, g, m = this._getLeftOffset(), p = this._getTopOffset(), v, w, E, L, U, q, Z, W, N = this.path, et = this._getWidthOfCharSpacing(), st = this.offsets[i], it = 0, y = this._textLines.length; it < y; it++) {
+              if (t = this.getHeightOfLine(it), !this[i] && !this.styleHas(i, it)) {
                 p += t;
                 continue;
               }
-              d = this._textLines[et], q = t / this.lineHeight, n = this._getLineLeftOffset(et), w = 0, E = 0, g = this.getValueOfPropertyAt(et, 0, i), W = this.getValueOfPropertyAt(et, 0, "fill"), v = p + q * (1 - this._fontSizeFraction), r = this.getHeightOfChar(et, 0), h = this.getValueOfPropertyAt(et, 0, "deltaY");
+              d = this._textLines[it], q = t / this.lineHeight, n = this._getLineLeftOffset(it), w = 0, E = 0, g = this.getValueOfPropertyAt(it, 0, i), W = this.getValueOfPropertyAt(it, 0, "fill"), v = p + q * (1 - this._fontSizeFraction), r = this.getHeightOfChar(it, 0), h = this.getValueOfPropertyAt(it, 0, "deltaY");
               for (var S = 0, b = d.length; S < b; S++)
-                if (L = this.__charBounds[et][S], U = this.getValueOfPropertyAt(et, S, i), Z = this.getValueOfPropertyAt(et, S, "fill"), a = this.getHeightOfChar(et, S), u = this.getValueOfPropertyAt(et, S, "deltaY"), N && U && Z)
+                if (L = this.__charBounds[it][S], U = this.getValueOfPropertyAt(it, S, i), Z = this.getValueOfPropertyAt(it, S, "fill"), a = this.getHeightOfChar(it, S), u = this.getValueOfPropertyAt(it, S, "deltaY"), N && U && Z)
                   e.save(), e.fillStyle = W, e.translate(L.renderLeft, L.renderTop), e.rotate(L.angle), e.fillRect(
                     -L.kernedWidth / 2,
                     st * a + u,
@@ -16797,7 +16790,7 @@ gl_FragColor.rgb *= color.a;
               this.direction === "rtl" && (x = this.width - x - E), e.fillStyle = Z, U && Z && e.fillRect(
                 x,
                 v + st * r + h,
-                E - tt,
+                E - et,
                 this.fontSize / 15
               ), p += t;
             }
@@ -16901,7 +16894,7 @@ gl_FragColor.rgb *= color.a;
         }, "path") : i(a);
       }, "text");
     }, s.Text.genericFonts = ["sans-serif", "serif", "cursive", "fantasy", "monospace"], s.util.createAccessors && s.util.createAccessors(s.Text);
-  }(k), function() {
+  }(P), function() {
     f.util.object.extend(
       f.Text.prototype,
       /** @lends fabric.Text.prototype */
@@ -18842,7 +18835,7 @@ gl_FragColor.rgb *= color.a;
         }, "path") : o(t);
       }, "text");
     };
-  }(k), function() {
+  }(P), function() {
     var c = f.controlsUtils, s = c.scaleSkewCursorStyleHandler, l = c.scaleCursorStyleHandler, o = c.scalingEqually, e = c.scalingYOrSkewingX, i = c.scalingXOrSkewingY, t = c.scaleOrSkewActionName, r = f.Object.prototype.controls;
     if (r.ml = new f.Control({
       x: -0.5,
@@ -18914,7 +18907,7 @@ gl_FragColor.rgb *= color.a;
     }
   }();
 })(Ht);
-const ri = { key: 1 }, si = { class: "w-full" }, Rt = /* @__PURE__ */ bt({
+const si = { key: 1 }, ai = { class: "w-full" }, Rt = /* @__PURE__ */ bt({
   __name: "ImageCanvas",
   props: {
     headline: { type: String, required: !0, default: "" },
@@ -18940,14 +18933,14 @@ const ri = { key: 1 }, si = { class: "w-full" }, Rt = /* @__PURE__ */ bt({
       required: !0
     }
   },
-  setup(k) {
-    const f = k, nt = Ct(() => `${f.size.width}/${f.size.height}`), it = gt(null), lt = gt(null);
+  setup(P) {
+    const f = P, nt = Ct(() => `${f.size.width}/${f.size.height}`), tt = gt(null), lt = gt(null);
     let H;
     function J() {
       var e, i;
-      it.value && !H && (H = new Ht.fabric.Canvas(it.value, {
-        width: ((e = it.value) == null ? void 0 : e.offsetWidth) || 0,
-        height: ((i = it.value) == null ? void 0 : i.offsetHeight) || 0
+      tt.value && !H && (H = new Ht.fabric.Canvas(tt.value, {
+        width: ((e = tt.value) == null ? void 0 : e.offsetWidth) || 0,
+        height: ((i = tt.value) == null ? void 0 : i.offsetHeight) || 0
       }), o = new Ht.fabric.Textbox(f.headline, {
         selectable: !0,
         textAlign: "center",
@@ -18986,7 +18979,7 @@ const ri = { key: 1 }, si = { class: "w-full" }, Rt = /* @__PURE__ */ bt({
     }, { immediate: !0 }), jt(
       [() => f.image, () => f.isLoading],
       ([e]) => {
-        e && ue(() => {
+        e && fe(() => {
           J(), H.setDimensions({
             width: lt.value.offsetWidth,
             height: lt.value.offsetHeight
@@ -19037,20 +19030,20 @@ const ri = { key: 1 }, si = { class: "w-full" }, Rt = /* @__PURE__ */ bt({
             class: "w-full bg-fm-color-neutral-gray-200 flex justify-center items-center",
             style: Ft({ aspectRatio: X(nt) })
           }, [
-            k.isLoading ? (Q(), vt(t, { key: 0 })) : (Q(), ut("p", ri, "no selected image"))
+            P.isLoading ? (Q(), vt(t, { key: 0 })) : (Q(), ut("p", si, "no selected image"))
           ], 4), [
-            [Pt, !k.image || k.isLoading]
+            [Pt, !P.image || P.isLoading]
           ]),
-          wt(Y("div", si, [
+          wt(Y("div", ai, [
             Y("canvas", {
               ref_key: "canvasRef",
-              ref: it
+              ref: tt
             }, null, 512)
           ], 512), [
-            [Pt, !k.isLoading && k.image]
+            [Pt, !P.isLoading && P.image]
           ]),
           ee(e.$slots, "default"),
-          k.image ? (Q(), ut("button", {
+          P.image ? (Q(), ut("button", {
             key: 0,
             onClick: l,
             class: "absolute flex gap-[8px] justify-center items-center bottom-[8px] right-[16px] bg-white rounded-lg py-[8px] px-[12px] hover:bg-fm-color-neutral-gray-200"
@@ -19062,7 +19055,7 @@ const ri = { key: 1 }, si = { class: "w-full" }, Rt = /* @__PURE__ */ bt({
       ]);
     };
   }
-}), ai = { class: "max-w-[600px]" }, oi = { class: "flex flex-col bg-white p-[24px] gap-[16px] w-full" }, li = { class: "relative flex flex-row gap-[11px]" }, hi = ["src"], ci = { class: "flex flex-col justify-center align-middle" }, ui = { class: "fm-typo-en-body-lg-600" }, fi = ["innerHTML"], di = { class: "flex pt-[24px] gap-[24px]" }, gi = ["src", "onClick", "alt"], mi = /* @__PURE__ */ bt({
+}), oi = { class: "max-w-[600px]" }, li = { class: "flex flex-col bg-white p-[24px] gap-[16px] w-full" }, hi = { class: "relative flex flex-row gap-[11px]" }, ci = ["src"], ui = { class: "flex flex-col justify-center align-middle" }, fi = { class: "fm-typo-en-body-lg-600" }, di = ["innerHTML"], gi = { class: "flex pt-[24px] gap-[24px]" }, mi = ["src", "onClick", "alt"], pi = /* @__PURE__ */ bt({
   __name: "FacebookPost",
   props: {
     caption: { type: String, required: !0, default: "" },
@@ -19098,22 +19091,22 @@ const ri = { key: 1 }, si = { class: "w-full" }, Rt = /* @__PURE__ */ bt({
       required: !0
     }
   },
-  setup(k) {
-    const f = k, nt = gt(0), it = Ct(() => f.images[nt.value]);
-    return (lt, H) => (Q(), ut("div", ai, [
-      Y("div", oi, [
-        Y("div", li, [
+  setup(P) {
+    const f = P, nt = gt(0), tt = Ct(() => f.images[nt.value]);
+    return (lt, H) => (Q(), ut("div", oi, [
+      Y("div", li, [
+        Y("div", hi, [
           Y("img", {
             class: "h-[31px] w-[31px] rounded-xl",
             src: f.businessIcon,
             style: { objectFit: "cover" }
-          }, null, 8, hi),
-          Y("div", ci, [
-            Y("p", ui, Tt(f.businessName), 1),
+          }, null, 8, ci),
+          Y("div", ui, [
+            Y("p", fi, Tt(f.businessName), 1),
             H[0] || (H[0] = Y("div", { class: "flex flex-row items-center gap-[5px]" }, [
               Y("p", { class: "fm-typo-en-body-sm-400 text-fm-color-neutral-gray-300" }, " 1 sec ago "),
               Y("img", {
-                src: ni,
+                src: ri,
                 class: "w-[24px] h-[24px]"
               })
             ], -1))
@@ -19122,16 +19115,16 @@ const ri = { key: 1 }, si = { class: "w-full" }, Rt = /* @__PURE__ */ bt({
         Y("p", {
           class: "fm-typo-en-body-lg-400 text-fm-color-typo-primary line-clamp-6 text-ellipsis",
           innerHTML: f.caption
-        }, null, 8, fi)
+        }, null, 8, di)
       ]),
       ot(Rt, {
-        "is-loading": k.isLoading,
-        image: X(it),
-        size: k.size,
-        headline: k.headline,
-        style: Ft(k.headlineStyle)
+        "is-loading": P.isLoading,
+        image: X(tt),
+        size: P.size,
+        headline: P.headline,
+        style: Ft(P.headlineStyle)
       }, null, 8, ["is-loading", "image", "size", "headline", "style"]),
-      wt(Y("div", di, [
+      wt(Y("div", gi, [
         (Q(!0), ut(xt, null, Ot(f.images, (J, c) => (Q(), ut("img", {
           src: J,
           key: `image_${c}`,
@@ -19139,13 +19132,13 @@ const ri = { key: 1 }, si = { class: "w-full" }, Rt = /* @__PURE__ */ bt({
           onClick: (s) => nt.value = c,
           alt: `ai_image_predict_${c}`,
           style: { objectFit: "cover" }
-        }, null, 10, gi))), 128))
+        }, null, 10, mi))), 128))
       ], 512), [
-        [Pt, !k.isLoading]
+        [Pt, !P.isLoading]
       ])
     ]));
   }
-}), pi = { class: "max-w-[375px]" }, vi = { class: "absolute w-full flex flex-col px-[12px] pt-[20px] text-white text-box-black-white" }, yi = { class: "flex flex-row w-full justify-center items-center gap-[8px] relative" }, _i = { class: "relative" }, Ci = ["src"], xi = { class: "fm-typo-en-body-sm-400" }, bi = { class: "flex pt-[24px] gap-[24px]" }, Si = ["src", "onClick", "alt"], wi = /* @__PURE__ */ bt({
+}), vi = { class: "max-w-[375px]" }, yi = { class: "absolute w-full flex flex-col px-[12px] pt-[20px] text-white text-box-black-white" }, _i = { class: "flex flex-row w-full justify-center items-center gap-[8px] relative" }, Ci = { class: "relative" }, xi = ["src"], bi = { class: "fm-typo-en-body-sm-400" }, Si = { class: "flex pt-[24px] gap-[24px]" }, wi = ["src", "onClick", "alt"], Ti = /* @__PURE__ */ bt({
   __name: "FacebookStory",
   props: {
     caption: { type: String, required: !0, default: "No selected caption." },
@@ -19181,29 +19174,29 @@ const ri = { key: 1 }, si = { class: "w-full" }, Rt = /* @__PURE__ */ bt({
       required: !0
     }
   },
-  setup(k) {
-    const f = k, nt = gt(0), it = Ct(() => f.images[nt.value]);
+  setup(P) {
+    const f = P, nt = gt(0), tt = Ct(() => f.images[nt.value]);
     return (lt, H) => {
       const J = ft("FmIcon");
-      return Q(), ut("div", pi, [
+      return Q(), ut("div", vi, [
         ot(Rt, {
-          "is-loading": k.isLoading,
-          image: X(it),
-          size: k.size,
-          headline: k.headline,
-          style: Ft(k.headlineStyle)
+          "is-loading": P.isLoading,
+          image: X(tt),
+          size: P.size,
+          headline: P.headline,
+          style: Ft(P.headlineStyle)
         }, {
           default: pt(() => [
-            Y("div", vi, [
-              Y("div", yi, [
-                Y("div", _i, [
+            Y("div", yi, [
+              Y("div", _i, [
+                Y("div", Ci, [
                   Y("img", {
                     class: "rounded-xl h-[31px] w-[31px]",
                     src: f.businessIcon,
                     style: { objectFit: "cover" }
-                  }, null, 8, Ci)
+                  }, null, 8, xi)
                 ]),
-                Y("p", xi, Tt(f.businessName), 1),
+                Y("p", bi, Tt(f.businessName), 1),
                 H[0] || (H[0] = Y("p", { class: "fm-typo-en-body-sm-400" }, "1 sec", -1)),
                 H[1] || (H[1] = Y("div", { class: "grow" }, null, -1)),
                 ot(J, { name: "more_horiz" }),
@@ -19214,7 +19207,7 @@ const ri = { key: 1 }, si = { class: "w-full" }, Rt = /* @__PURE__ */ bt({
           ]),
           _: 1
         }, 8, ["is-loading", "image", "size", "headline", "style"]),
-        wt(Y("div", bi, [
+        wt(Y("div", Si, [
           (Q(!0), ut(xt, null, Ot(f.images, (c, s) => (Q(), ut("img", {
             src: c,
             key: `image_${s}`,
@@ -19222,14 +19215,14 @@ const ri = { key: 1 }, si = { class: "w-full" }, Rt = /* @__PURE__ */ bt({
             onClick: (l) => nt.value = s,
             alt: `ai_image_predict_${s}`,
             style: { objectFit: "cover" }
-          }, null, 10, Si))), 128))
+          }, null, 10, wi))), 128))
         ], 512), [
-          [Pt, !k.isLoading]
+          [Pt, !P.isLoading]
         ])
       ]);
     };
   }
-}), Ti = "data:image/svg+xml,%3csvg%20width='24'%20height='24'%20viewBox='0%200%2024%2024'%20fill='none'%20xmlns='http://www.w3.org/2000/svg'%3e%3cg%20id='Icons'%3e%3cpath%20id='Vector'%20d='M12.314%206.18333L11.6642%205.55288C11.5296%205.42238%2011.4002%205.29733%2011.2744%205.17585C11.0546%204.96351%2010.8461%204.76206%2010.6415%204.56141C9.00072%202.95363%206.74236%202.49843%204.93299%203.27967L4.93283%203.27973C3.11907%204.06244%201.85702%206.05591%201.90111%208.28774L1.90111%208.2878C1.93442%209.97965%202.64327%2011.4798%203.67634%2012.964L3.67663%2012.9644C5.93146%2016.2077%208.99036%2018.6439%2012.2533%2021.0298C14.6308%2019.2988%2016.895%2017.5125%2018.8503%2015.3974L19.5111%2016.0083L18.8503%2015.3974C20.5094%2013.6026%2021.8746%2011.7871%2022.4325%209.53909L22.4326%209.53886C23.0207%207.17223%2022.0148%204.70667%2020.1001%203.55451L12.314%206.18333ZM12.314%206.18333L12.9405%205.52971M12.314%206.18333L12.9405%205.52971M12.9405%205.52971C13.0847%205.37935%2013.212%205.24125%2013.3317%205.11141C13.5615%204.86221%2013.7633%204.64342%2014.0019%204.42667L14.0023%204.42636M12.9405%205.52971L14.0023%204.42636M14.0023%204.42636C15.8653%202.73241%2018.2782%202.4589%2020.1%203.55442L14.0023%204.42636ZM12.0873%2021.1505C12.0875%2021.1503%2012.0877%2021.1502%2012.088%2021.15C12.0878%2021.1501%2012.0875%2021.1503%2012.0873%2021.1504L12.0873%2021.1505ZM12.1764%2021.1002L12.1835%2021.0999C12.1896%2021.0997%2012.2038%2021.0997%2012.225%2021.1022C12.2453%2021.1045%2012.2813%2021.1102%2012.3278%2021.1253C12.3732%2021.1402%2012.444%2021.169%2012.5215%2021.2254L12.1764%2021.1002Z'%20fill='%23FE0135'%20stroke='%23FE0135'%20stroke-width='1.8'/%3e%3c/g%3e%3c/svg%3e", Oi = "data:image/svg+xml,%3csvg%20width='24'%20height='24'%20viewBox='0%200%2024%2024'%20fill='none'%20xmlns='http://www.w3.org/2000/svg'%3e%3cg%20id='Icons'%3e%3cg%20id='Union'%3e%3cmask%20id='path-1-inside-1_2770_16980'%20fill='white'%3e%3cpath%20fill-rule='evenodd'%20clip-rule='evenodd'%20d='M21.4517%2017.6305C22.435%2015.9834%2023%2014.0577%2023%2012C23%205.92487%2018.0751%201%2012%201C5.92487%201%201%205.92487%201%2012C1%2018.0751%205.92487%2023%2012%2023C14.062%2023%2015.9915%2022.4326%2017.6409%2021.4455L22.8478%2022.8407L21.4517%2017.6305Z'/%3e%3c/mask%3e%3cpath%20d='M21.4517%2017.6305L19.9062%2016.7078C19.6568%2017.1255%2019.5871%2017.6264%2019.7131%2018.0963L21.4517%2017.6305ZM17.6409%2021.4455L18.1068%2019.7068C17.6362%2019.5807%2017.1346%2019.6508%2016.7165%2019.901L17.6409%2021.4455ZM22.8478%2022.8407L22.3819%2024.5793C23.0031%2024.7458%2023.6659%2024.5682%2024.1206%2024.1135C24.5753%2023.6587%2024.7529%2022.996%2024.5865%2022.3748L22.8478%2022.8407ZM21.2%2012C21.2%2013.7239%2020.7276%2015.3319%2019.9062%2016.7078L22.9973%2018.5531C24.1425%2016.6348%2024.8%2014.3915%2024.8%2012H21.2ZM12%202.8C17.081%202.8%2021.2%206.91898%2021.2%2012H24.8C24.8%204.93076%2019.0692%20-0.8%2012%20-0.8V2.8ZM2.8%2012C2.8%206.91898%206.91898%202.8%2012%202.8V-0.8C4.93076%20-0.8%20-0.8%204.93076%20-0.8%2012H2.8ZM12%2021.2C6.91898%2021.2%202.8%2017.081%202.8%2012H-0.8C-0.8%2019.0692%204.93076%2024.8%2012%2024.8V21.2ZM16.7165%2019.901C15.3387%2020.7256%2013.7275%2021.2%2012%2021.2V24.8C14.3965%2024.8%2016.6443%2024.1397%2018.5653%2022.99L16.7165%2019.901ZM17.175%2023.1842L22.3819%2024.5793L23.3137%2021.102L18.1068%2019.7068L17.175%2023.1842ZM24.5865%2022.3748L23.1904%2017.1646L19.7131%2018.0963L21.1091%2023.3065L24.5865%2022.3748Z'%20fill='black'%20mask='url(%23path-1-inside-1_2770_16980)'/%3e%3c/g%3e%3c/g%3e%3c/svg%3e", ki = "data:image/svg+xml,%3csvg%20width='24'%20height='24'%20viewBox='0%200%2024%2024'%20fill='none'%20xmlns='http://www.w3.org/2000/svg'%3e%3cg%20id='Icons'%20clip-path='url(%23clip0_2770_16981)'%3e%3cpath%20id='Polygon%204'%20d='M2.68376%203.95005L21.5703%203.95005L12.1272%2020.306L9.36084%2011.2374C9.32085%2011.1063%209.25144%2010.9861%209.15792%2010.8859L2.68376%203.95005Z'%20stroke='black'%20stroke-width='1.8'%20stroke-linejoin='round'/%3e%3c/g%3e%3cdefs%3e%3cclipPath%20id='clip0_2770_16981'%3e%3crect%20width='24'%20height='24'%20fill='white'/%3e%3c/clipPath%3e%3c/defs%3e%3c/svg%3e", Pi = "data:image/svg+xml,%3csvg%20width='24'%20height='24'%20viewBox='0%200%2024%2024'%20fill='none'%20xmlns='http://www.w3.org/2000/svg'%3e%3cg%20id='Icons'%3e%3cpath%20id='Rectangle%201438'%20d='M3.9%2021.0785V1.9H20.1V21.0785L12.5762%2014.8086C12.2424%2014.5305%2011.7576%2014.5305%2011.4238%2014.8086L3.9%2021.0785Z'%20stroke='black'%20stroke-width='1.8'%20stroke-linejoin='round'/%3e%3c/g%3e%3c/svg%3e", Ei = { class: "flex flex-col w-[375px] h-[538px]" }, Mi = { class: "flex flex-row bg-white p-[5px] gap-[8px] justify-center items-center" }, Ai = ["src"], Fi = { class: "fm-typo-en-body-lg-600" }, Di = { class: "flex flex-col bg-white px-[10px] pt-[10px] pb-[24px]" }, Li = ["innerHTML"], Ii = { class: "flex pt-[24px] gap-[24px]" }, ji = ["src", "onClick", "alt"], Ri = /* @__PURE__ */ bt({
+}), Oi = "data:image/svg+xml,%3csvg%20width='24'%20height='24'%20viewBox='0%200%2024%2024'%20fill='none'%20xmlns='http://www.w3.org/2000/svg'%3e%3cg%20id='Icons'%3e%3cpath%20id='Vector'%20d='M12.314%206.18333L11.6642%205.55288C11.5296%205.42238%2011.4002%205.29733%2011.2744%205.17585C11.0546%204.96351%2010.8461%204.76206%2010.6415%204.56141C9.00072%202.95363%206.74236%202.49843%204.93299%203.27967L4.93283%203.27973C3.11907%204.06244%201.85702%206.05591%201.90111%208.28774L1.90111%208.2878C1.93442%209.97965%202.64327%2011.4798%203.67634%2012.964L3.67663%2012.9644C5.93146%2016.2077%208.99036%2018.6439%2012.2533%2021.0298C14.6308%2019.2988%2016.895%2017.5125%2018.8503%2015.3974L19.5111%2016.0083L18.8503%2015.3974C20.5094%2013.6026%2021.8746%2011.7871%2022.4325%209.53909L22.4326%209.53886C23.0207%207.17223%2022.0148%204.70667%2020.1001%203.55451L12.314%206.18333ZM12.314%206.18333L12.9405%205.52971M12.314%206.18333L12.9405%205.52971M12.9405%205.52971C13.0847%205.37935%2013.212%205.24125%2013.3317%205.11141C13.5615%204.86221%2013.7633%204.64342%2014.0019%204.42667L14.0023%204.42636M12.9405%205.52971L14.0023%204.42636M14.0023%204.42636C15.8653%202.73241%2018.2782%202.4589%2020.1%203.55442L14.0023%204.42636ZM12.0873%2021.1505C12.0875%2021.1503%2012.0877%2021.1502%2012.088%2021.15C12.0878%2021.1501%2012.0875%2021.1503%2012.0873%2021.1504L12.0873%2021.1505ZM12.1764%2021.1002L12.1835%2021.0999C12.1896%2021.0997%2012.2038%2021.0997%2012.225%2021.1022C12.2453%2021.1045%2012.2813%2021.1102%2012.3278%2021.1253C12.3732%2021.1402%2012.444%2021.169%2012.5215%2021.2254L12.1764%2021.1002Z'%20fill='%23FE0135'%20stroke='%23FE0135'%20stroke-width='1.8'/%3e%3c/g%3e%3c/svg%3e", ki = "data:image/svg+xml,%3csvg%20width='24'%20height='24'%20viewBox='0%200%2024%2024'%20fill='none'%20xmlns='http://www.w3.org/2000/svg'%3e%3cg%20id='Icons'%3e%3cg%20id='Union'%3e%3cmask%20id='path-1-inside-1_2770_16980'%20fill='white'%3e%3cpath%20fill-rule='evenodd'%20clip-rule='evenodd'%20d='M21.4517%2017.6305C22.435%2015.9834%2023%2014.0577%2023%2012C23%205.92487%2018.0751%201%2012%201C5.92487%201%201%205.92487%201%2012C1%2018.0751%205.92487%2023%2012%2023C14.062%2023%2015.9915%2022.4326%2017.6409%2021.4455L22.8478%2022.8407L21.4517%2017.6305Z'/%3e%3c/mask%3e%3cpath%20d='M21.4517%2017.6305L19.9062%2016.7078C19.6568%2017.1255%2019.5871%2017.6264%2019.7131%2018.0963L21.4517%2017.6305ZM17.6409%2021.4455L18.1068%2019.7068C17.6362%2019.5807%2017.1346%2019.6508%2016.7165%2019.901L17.6409%2021.4455ZM22.8478%2022.8407L22.3819%2024.5793C23.0031%2024.7458%2023.6659%2024.5682%2024.1206%2024.1135C24.5753%2023.6587%2024.7529%2022.996%2024.5865%2022.3748L22.8478%2022.8407ZM21.2%2012C21.2%2013.7239%2020.7276%2015.3319%2019.9062%2016.7078L22.9973%2018.5531C24.1425%2016.6348%2024.8%2014.3915%2024.8%2012H21.2ZM12%202.8C17.081%202.8%2021.2%206.91898%2021.2%2012H24.8C24.8%204.93076%2019.0692%20-0.8%2012%20-0.8V2.8ZM2.8%2012C2.8%206.91898%206.91898%202.8%2012%202.8V-0.8C4.93076%20-0.8%20-0.8%204.93076%20-0.8%2012H2.8ZM12%2021.2C6.91898%2021.2%202.8%2017.081%202.8%2012H-0.8C-0.8%2019.0692%204.93076%2024.8%2012%2024.8V21.2ZM16.7165%2019.901C15.3387%2020.7256%2013.7275%2021.2%2012%2021.2V24.8C14.3965%2024.8%2016.6443%2024.1397%2018.5653%2022.99L16.7165%2019.901ZM17.175%2023.1842L22.3819%2024.5793L23.3137%2021.102L18.1068%2019.7068L17.175%2023.1842ZM24.5865%2022.3748L23.1904%2017.1646L19.7131%2018.0963L21.1091%2023.3065L24.5865%2022.3748Z'%20fill='black'%20mask='url(%23path-1-inside-1_2770_16980)'/%3e%3c/g%3e%3c/g%3e%3c/svg%3e", Pi = "data:image/svg+xml,%3csvg%20width='24'%20height='24'%20viewBox='0%200%2024%2024'%20fill='none'%20xmlns='http://www.w3.org/2000/svg'%3e%3cg%20id='Icons'%20clip-path='url(%23clip0_2770_16981)'%3e%3cpath%20id='Polygon%204'%20d='M2.68376%203.95005L21.5703%203.95005L12.1272%2020.306L9.36084%2011.2374C9.32085%2011.1063%209.25144%2010.9861%209.15792%2010.8859L2.68376%203.95005Z'%20stroke='black'%20stroke-width='1.8'%20stroke-linejoin='round'/%3e%3c/g%3e%3cdefs%3e%3cclipPath%20id='clip0_2770_16981'%3e%3crect%20width='24'%20height='24'%20fill='white'/%3e%3c/clipPath%3e%3c/defs%3e%3c/svg%3e", Ei = "data:image/svg+xml,%3csvg%20width='24'%20height='24'%20viewBox='0%200%2024%2024'%20fill='none'%20xmlns='http://www.w3.org/2000/svg'%3e%3cg%20id='Icons'%3e%3cpath%20id='Rectangle%201438'%20d='M3.9%2021.0785V1.9H20.1V21.0785L12.5762%2014.8086C12.2424%2014.5305%2011.7576%2014.5305%2011.4238%2014.8086L3.9%2021.0785Z'%20stroke='black'%20stroke-width='1.8'%20stroke-linejoin='round'/%3e%3c/g%3e%3c/svg%3e", Mi = { class: "flex flex-col w-[375px] h-[538px]" }, Ai = { class: "flex flex-row bg-white p-[5px] gap-[8px] justify-center items-center" }, Fi = ["src"], Di = { class: "fm-typo-en-body-lg-600" }, Li = { class: "flex flex-col bg-white px-[10px] pt-[10px] pb-[24px]" }, Ii = ["innerHTML"], ji = { class: "flex pt-[24px] gap-[24px]" }, Ri = ["src", "onClick", "alt"], Bi = /* @__PURE__ */ bt({
   __name: "InstagramPost",
   props: {
     caption: { type: String, required: !0, default: "No selected caption." },
@@ -19265,36 +19258,36 @@ const ri = { key: 1 }, si = { class: "w-full" }, Rt = /* @__PURE__ */ bt({
       required: !0
     }
   },
-  setup(k) {
-    const f = k, nt = gt(0), it = Ct(() => f.images[nt.value]);
+  setup(P) {
+    const f = P, nt = gt(0), tt = Ct(() => f.images[nt.value]);
     return (lt, H) => {
       const J = ft("FmIcon");
-      return Q(), ut("div", Ei, [
-        Y("div", Mi, [
+      return Q(), ut("div", Mi, [
+        Y("div", Ai, [
           Y("img", {
             class: "h-[31px] w-[31px] rounded-xl",
             src: f.businessIcon,
             style: { objectFit: "cover" }
-          }, null, 8, Ai),
-          Y("p", Fi, Tt(f.businessName), 1),
+          }, null, 8, Fi),
+          Y("p", Di, Tt(f.businessName), 1),
           H[0] || (H[0] = Y("div", { class: "grow" }, null, -1)),
           ot(J, { name: "more_horiz" })
         ]),
         ot(Rt, {
-          "is-loading": k.isLoading,
-          image: X(it),
-          size: k.size,
-          headline: k.headline,
-          style: Ft(k.headlineStyle)
+          "is-loading": P.isLoading,
+          image: X(tt),
+          size: P.size,
+          headline: P.headline,
+          style: Ft(P.headlineStyle)
         }, null, 8, ["is-loading", "image", "size", "headline", "style"]),
-        Y("div", Di, [
-          H[1] || (H[1] = fe('<div class="pb-[10px] flex flex-row pr-[5px] gap-[12px]"><img src="' + Ti + '" class="w-[24px] h-[24px]"><img src="' + Oi + '" class="w-[24px] h-[24px]"><img src="' + ki + '" class="w-[24px] h-[24px]"><div class="grow"></div><img src="' + Pi + '" class="w-[24px] h-[24px]"></div>', 1)),
+        Y("div", Li, [
+          H[1] || (H[1] = de('<div class="pb-[10px] flex flex-row pr-[5px] gap-[12px]"><img src="' + Oi + '" class="w-[24px] h-[24px]"><img src="' + ki + '" class="w-[24px] h-[24px]"><img src="' + Pi + '" class="w-[24px] h-[24px]"><div class="grow"></div><img src="' + Ei + '" class="w-[24px] h-[24px]"></div>', 1)),
           Y("p", {
             class: "fm-typo-en-body-lg-400 text-fm-color-typo-primary line-clamp-2 text-ellipsis",
             innerHTML: f.caption
-          }, null, 8, Li)
+          }, null, 8, Ii)
         ]),
-        wt(Y("div", Ii, [
+        wt(Y("div", ji, [
           (Q(!0), ut(xt, null, Ot(f.images, (c, s) => (Q(), ut("img", {
             src: c,
             key: `image_${s}`,
@@ -19302,14 +19295,14 @@ const ri = { key: 1 }, si = { class: "w-full" }, Rt = /* @__PURE__ */ bt({
             onClick: (l) => nt.value = s,
             alt: `ai_image_predict_${s}`,
             style: { objectFit: "cover" }
-          }, null, 10, ji))), 128))
+          }, null, 10, Ri))), 128))
         ], 512), [
-          [Pt, !k.isLoading]
+          [Pt, !P.isLoading]
         ])
       ]);
     };
   }
-}), Bi = { class: "max-w-[375px]" }, Xi = { class: "absolute bottom-0 w-full flex flex-col px-[12px] gap-[12px] text-white text-box-white-black pt-[50px]" }, zi = { class: "flex flex-row justify-start items-center" }, Yi = ["src"], Wi = { class: "fm-typo-en-body-sm-400" }, Vi = { class: "flex flex-row items-center px-[12px] pb-[24px]" }, Hi = ["innerHTML"], Ui = { class: "flex pt-[24px] gap-[24px]" }, Gi = ["src", "onClick", "alt"], Ni = /* @__PURE__ */ bt({
+}), Xi = { class: "max-w-[375px]" }, zi = { class: "absolute bottom-0 w-full flex flex-col px-[12px] gap-[12px] text-white text-box-white-black pt-[50px]" }, Yi = { class: "flex flex-row justify-start items-center" }, Wi = ["src"], Vi = { class: "fm-typo-en-body-sm-400" }, Hi = { class: "flex flex-row items-center px-[12px] pb-[24px]" }, Ui = ["innerHTML"], Gi = { class: "flex pt-[24px] gap-[24px]" }, Ni = ["src", "onClick", "alt"], $i = /* @__PURE__ */ bt({
   __name: "InstagramReel",
   props: {
     caption: { type: String, required: !0, default: "No selected caption." },
@@ -19345,33 +19338,33 @@ const ri = { key: 1 }, si = { class: "w-full" }, Rt = /* @__PURE__ */ bt({
       required: !0
     }
   },
-  setup(k) {
-    const f = k, nt = gt(0), it = Ct(() => f.images[nt.value]);
+  setup(P) {
+    const f = P, nt = gt(0), tt = Ct(() => f.images[nt.value]);
     return (lt, H) => {
       const J = ft("FmIcon");
-      return Q(), ut("div", Bi, [
+      return Q(), ut("div", Xi, [
         ot(Rt, {
-          "is-loading": k.isLoading,
-          image: X(it),
-          size: k.size,
-          headline: k.headline,
-          style: Ft(k.headlineStyle)
+          "is-loading": P.isLoading,
+          image: X(tt),
+          size: P.size,
+          headline: P.headline,
+          style: Ft(P.headlineStyle)
         }, {
           default: pt(() => [
-            Y("div", Xi, [
-              Y("div", zi, [
+            Y("div", zi, [
+              Y("div", Yi, [
                 Y("img", {
                   class: "h-[31px] w-[31px] rounded-xl",
                   src: f.businessIcon,
                   style: { objectFit: "cover" }
-                }, null, 8, Yi),
-                Y("p", Wi, Tt(f.businessName), 1)
+                }, null, 8, Wi),
+                Y("p", Vi, Tt(f.businessName), 1)
               ]),
-              Y("div", Vi, [
+              Y("div", Hi, [
                 Y("p", {
                   class: "fm-typo-en-body-lg-400 line-clamp-2 text-ellipsis",
                   innerHTML: f.caption
-                }, null, 8, Hi),
+                }, null, 8, Ui),
                 H[0] || (H[0] = Y("div", { class: "grow" }, null, -1)),
                 ot(J, { name: "more_horiz" })
               ])
@@ -19379,7 +19372,7 @@ const ri = { key: 1 }, si = { class: "w-full" }, Rt = /* @__PURE__ */ bt({
           ]),
           _: 1
         }, 8, ["is-loading", "image", "size", "headline", "style"]),
-        wt(Y("div", Ui, [
+        wt(Y("div", Gi, [
           (Q(!0), ut(xt, null, Ot(f.images, (c, s) => (Q(), ut("img", {
             src: c,
             key: `image_${s}`,
@@ -19387,14 +19380,14 @@ const ri = { key: 1 }, si = { class: "w-full" }, Rt = /* @__PURE__ */ bt({
             onClick: (l) => nt.value = s,
             alt: `ai_image_predict_${s}`,
             style: { objectFit: "cover" }
-          }, null, 10, Gi))), 128))
+          }, null, 10, Ni))), 128))
         ], 512), [
-          [Pt, !k.isLoading]
+          [Pt, !P.isLoading]
         ])
       ]);
     };
   }
-}), $i = { class: "max-w-[375px]" }, qi = { class: "absolute w-full flex flex-col px-[12px] pt-[20px] text-white text-box-black-white" }, Ki = { class: "flex flex-row w-full justify-center items-center gap-[8px]" }, Zi = ["src"], Ji = { class: "fm-typo-en-body-sm-400" }, Qi = { class: "flex pt-[24px] gap-[24px]" }, tn = ["src", "onClick", "alt"], en = /* @__PURE__ */ bt({
+}), qi = { class: "max-w-[375px]" }, Ki = { class: "absolute w-full flex flex-col px-[12px] pt-[20px] text-white text-box-black-white" }, Zi = { class: "flex flex-row w-full justify-center items-center gap-[8px]" }, Ji = ["src"], Qi = { class: "fm-typo-en-body-sm-400" }, tn = { class: "flex pt-[24px] gap-[24px]" }, en = ["src", "onClick", "alt"], nn = /* @__PURE__ */ bt({
   __name: "InstagramStory",
   props: {
     caption: { type: String, required: !0, default: "No selected caption." },
@@ -19430,27 +19423,27 @@ const ri = { key: 1 }, si = { class: "w-full" }, Rt = /* @__PURE__ */ bt({
       required: !0
     }
   },
-  setup(k) {
-    const f = k, nt = gt(0), it = Ct(() => f.images[nt.value]);
+  setup(P) {
+    const f = P, nt = gt(0), tt = Ct(() => f.images[nt.value]);
     return (lt, H) => {
       const J = ft("FmIcon");
-      return Q(), ut("div", $i, [
+      return Q(), ut("div", qi, [
         ot(Rt, {
-          "is-loading": k.isLoading,
-          image: X(it),
-          size: k.size,
-          headline: k.headline,
-          style: Ft(k.headlineStyle)
+          "is-loading": P.isLoading,
+          image: X(tt),
+          size: P.size,
+          headline: P.headline,
+          style: Ft(P.headlineStyle)
         }, {
           default: pt(() => [
-            Y("div", qi, [
-              Y("div", Ki, [
+            Y("div", Ki, [
+              Y("div", Zi, [
                 Y("img", {
                   class: "h-[31px] w-[31px] rounded-xl",
                   src: f.businessIcon,
                   style: { objectFit: "cover" }
-                }, null, 8, Zi),
-                Y("p", Ji, Tt(f.businessName), 1),
+                }, null, 8, Ji),
+                Y("p", Qi, Tt(f.businessName), 1),
                 H[0] || (H[0] = Y("p", { class: "fm-typo-en-body-sm-400" }, "1 sec", -1)),
                 H[1] || (H[1] = Y("div", { class: "grow" }, null, -1)),
                 ot(J, { name: "more_horiz" }),
@@ -19461,7 +19454,7 @@ const ri = { key: 1 }, si = { class: "w-full" }, Rt = /* @__PURE__ */ bt({
           ]),
           _: 1
         }, 8, ["is-loading", "image", "size", "headline", "style"]),
-        wt(Y("div", Qi, [
+        wt(Y("div", tn, [
           (Q(!0), ut(xt, null, Ot(f.images, (c, s) => (Q(), ut("img", {
             src: c,
             key: `image_${s}`,
@@ -19469,14 +19462,14 @@ const ri = { key: 1 }, si = { class: "w-full" }, Rt = /* @__PURE__ */ bt({
             onClick: (l) => nt.value = s,
             alt: `ai_image_predict_${s}`,
             style: { objectFit: "cover" }
-          }, null, 10, tn))), 128))
+          }, null, 10, en))), 128))
         ], 512), [
-          [Pt, !k.isLoading]
+          [Pt, !P.isLoading]
         ])
       ]);
     };
   }
-}), nn = { class: "max-w-[600px]" }, rn = { class: "flex flex-col w-full" }, sn = { class: "flex pt-[24px] gap-[24px]" }, an = ["src", "onClick", "alt"], on = /* @__PURE__ */ bt({
+}), rn = { class: "max-w-[600px]" }, sn = { class: "flex flex-col w-full" }, an = { class: "flex pt-[24px] gap-[24px]" }, on = ["src", "onClick", "alt"], ln = /* @__PURE__ */ bt({
   __name: "TvImage",
   props: {
     caption: { type: String, required: !0, default: "" },
@@ -19512,20 +19505,20 @@ const ri = { key: 1 }, si = { class: "w-full" }, Rt = /* @__PURE__ */ bt({
       required: !0
     }
   },
-  setup(k) {
-    const f = k, nt = gt(0), it = Ct(
+  setup(P) {
+    const f = P, nt = gt(0), tt = Ct(
       () => f.images[nt.value]
     );
-    return (lt, H) => (Q(), ut("div", nn, [
-      Y("div", rn, [
+    return (lt, H) => (Q(), ut("div", rn, [
+      Y("div", sn, [
         ot(Rt, {
-          "is-loading": k.isLoading,
-          image: X(it),
-          size: k.size,
-          headline: k.headline,
-          style: Ft(k.headlineStyle)
+          "is-loading": P.isLoading,
+          image: X(tt),
+          size: P.size,
+          headline: P.headline,
+          style: Ft(P.headlineStyle)
         }, null, 8, ["is-loading", "image", "size", "headline", "style"]),
-        wt(Y("div", sn, [
+        wt(Y("div", an, [
           (Q(!0), ut(xt, null, Ot(f.images, (J, c) => (Q(), ut("img", {
             src: J,
             key: `image_${c}`,
@@ -19533,14 +19526,14 @@ const ri = { key: 1 }, si = { class: "w-full" }, Rt = /* @__PURE__ */ bt({
             onClick: (s) => nt.value = c,
             alt: `ai_image_predict_${c}`,
             style: { objectFit: "cover" }
-          }, null, 10, an))), 128))
+          }, null, 10, on))), 128))
         ], 512), [
-          [Pt, !k.isLoading]
+          [Pt, !P.isLoading]
         ])
       ])
     ]));
   }
-}), ln = { class: "max-w-[375px]" }, hn = { class: "flex pt-[24px] gap-[24px]" }, cn = ["src", "onClick", "alt"], un = /* @__PURE__ */ bt({
+}), hn = { class: "max-w-[375px]" }, cn = { class: "flex pt-[24px] gap-[24px]" }, un = ["src", "onClick", "alt"], fn = /* @__PURE__ */ bt({
   __name: "BrandAppImage",
   props: {
     caption: { type: String, required: !0, default: "No selected caption." },
@@ -19576,17 +19569,17 @@ const ri = { key: 1 }, si = { class: "w-full" }, Rt = /* @__PURE__ */ bt({
       required: !0
     }
   },
-  setup(k) {
-    const f = k, nt = gt(0), it = Ct(() => f.images[nt.value]);
-    return (lt, H) => (Q(), ut("div", ln, [
+  setup(P) {
+    const f = P, nt = gt(0), tt = Ct(() => f.images[nt.value]);
+    return (lt, H) => (Q(), ut("div", hn, [
       ot(Rt, {
-        "is-loading": k.isLoading,
-        image: X(it),
-        size: k.size,
-        headline: k.headline,
-        style: Ft(k.headlineStyle)
+        "is-loading": P.isLoading,
+        image: X(tt),
+        size: P.size,
+        headline: P.headline,
+        style: Ft(P.headlineStyle)
       }, null, 8, ["is-loading", "image", "size", "headline", "style"]),
-      wt(Y("div", hn, [
+      wt(Y("div", cn, [
         (Q(!0), ut(xt, null, Ot(f.images, (J, c) => (Q(), ut("img", {
           src: J,
           key: `image_${c}`,
@@ -19594,13 +19587,13 @@ const ri = { key: 1 }, si = { class: "w-full" }, Rt = /* @__PURE__ */ bt({
           onClick: (s) => nt.value = c,
           alt: `ai_image_predict_${c}`,
           style: { objectFit: "cover" }
-        }, null, 10, cn))), 128))
+        }, null, 10, un))), 128))
       ], 512), [
-        [Pt, !k.isLoading]
+        [Pt, !P.isLoading]
       ])
     ]));
   }
-}), fn = { class: "w-1/2 px-[32px] py-[24px] flex flex-col gap-[40px]" }, dn = { class: "flex flex-col gap-[8px]" }, gn = { class: "flex flex-col gap-[16px] w-full" }, mn = { class: "flex flex-col gap-[8px]" }, pn = /* @__PURE__ */ bt({
+}), dn = { class: "w-1/2 px-[32px] py-[24px] flex flex-col gap-[40px]" }, gn = { class: "flex flex-col gap-[8px]" }, mn = { class: "flex flex-col gap-[16px] w-full" }, pn = { class: "flex flex-col gap-[8px]" }, vn = /* @__PURE__ */ bt({
   __name: "RightSheet",
   props: {
     caption: {
@@ -19626,16 +19619,16 @@ const ri = { key: 1 }, si = { class: "w-full" }, Rt = /* @__PURE__ */ bt({
       required: !0
     }
   },
-  setup(k) {
-    const f = k, nt = Ct(() => f.assets.map((e) => ({
+  setup(P) {
+    const f = P, nt = Ct(() => f.assets.map((e) => ({
       platform: e.platform,
       label: e.platform.replace(/_/g, " ")
-    }))), it = gt(), lt = gt(), H = Ct(() => f.assets.find((e) => {
+    }))), tt = gt(), lt = gt(), H = Ct(() => f.assets.find((e) => {
       var i;
       return e.platform === ((i = lt.value) == null ? void 0 : i.platform);
     })), J = Ct(() => {
       var e;
-      return (e = H.value) == null ? void 0 : e.contents.find((i) => i.type === it.value);
+      return (e = H.value) == null ? void 0 : e.contents.find((i) => i.type === tt.value);
     });
     jt(nt, (e) => {
       lt.value = e.find((i) => {
@@ -19644,7 +19637,7 @@ const ri = { key: 1 }, si = { class: "w-full" }, Rt = /* @__PURE__ */ bt({
       }) || e[0];
     }, { immediate: !0 }), jt(H, (e) => {
       const i = e == null ? void 0 : e.contents.map((t) => t.type);
-      i && !i.includes(it.value) && (it.value = e == null ? void 0 : e.contents[0].type);
+      i && !i.includes(tt.value) && (tt.value = e == null ? void 0 : e.contents[0].type);
     }, { immediate: !0 });
     const c = (e, i) => {
       for (; i !== 0; ) {
@@ -19661,10 +19654,10 @@ const ri = { key: 1 }, si = { class: "w-full" }, Rt = /* @__PURE__ */ bt({
     }
     const { currentBusiness: o } = Jt();
     return (e, i) => {
-      var n, h, u, d, g, m, p, v, w, E, L, U, q, Z, W, N, tt, st, et, y, S, b, x, M, C, _, T, P, j, A, z, G, $, F, O;
+      var n, h, u, d, g, m, p, v, w, E, L, U, q, Z, W, N, et, st, it, y, S, b, x, M, C, _, T, k, j, A, z, G, $, F, O;
       const t = ft("FmButtonGroup"), r = ft("FmRadio"), a = ft("FmRadioGroup");
-      return Q(), ut("div", fn, [
-        Y("div", dn, [
+      return Q(), ut("div", dn, [
+        Y("div", gn, [
           i[2] || (i[2] = Y("p", { class: "fm-typo-en-title-sm-800" }, "Select platform", -1)),
           i[3] || (i[3] = Y("p", { class: "fm-typo-en-body-lg-400 text-fm-color-typo-secondary" }, " Generated image will adjust resolution according to selected platform. ", -1)),
           ot(t, {
@@ -19674,8 +19667,8 @@ const ri = { key: 1 }, si = { class: "w-full" }, Rt = /* @__PURE__ */ bt({
           }, null, 8, ["modelValue", "items"]),
           X(H) ? (Q(), vt(a, {
             key: 0,
-            modelValue: X(it),
-            "onUpdate:modelValue": i[1] || (i[1] = (I) => At(it) ? it.value = I : null)
+            modelValue: X(tt),
+            "onUpdate:modelValue": i[1] || (i[1] = (I) => At(tt) ? tt.value = I : null)
           }, {
             default: pt(() => [
               (Q(!0), ut(xt, null, Ot(X(H).contents, (I, B) => (Q(), vt(r, {
@@ -19688,23 +19681,23 @@ const ri = { key: 1 }, si = { class: "w-full" }, Rt = /* @__PURE__ */ bt({
             _: 1
           }, 8, ["modelValue"])) : Et("", !0)
         ]),
-        Y("div", gn, [
-          Y("div", mn, [
+        Y("div", mn, [
+          Y("div", pn, [
             i[4] || (i[4] = Y("p", { class: "fm-typo-en-title-sm-800" }, "Design preview", -1)),
             i[5] || (i[5] = Y("p", { class: "fm-typo-en-body-lg-400 text-fm-color-typo-secondary" }, " Generated design here is for preview only. ", -1)),
-            ((n = X(H)) == null ? void 0 : n.platform) === "FACEBOOK" && X(it) === "POST" ? (Q(), vt(mi, {
+            ((n = X(H)) == null ? void 0 : n.platform) === "FACEBOOK" && X(tt) === "POST" ? (Q(), vt(pi, {
               key: 0,
               class: "container",
               caption: l(),
-              headline: k.headline,
+              headline: P.headline,
               images: (h = X(J)) == null ? void 0 : h.images,
               size: (u = X(J)) == null ? void 0 : u.size,
               "business-name": ((d = X(o)) == null ? void 0 : d.name) ?? "",
               "business-icon": ((g = X(o)) == null ? void 0 : g.thumbnail) ?? "",
-              "is-loading": k.isLoadingImage,
-              "headline-style": k.headlineStyle
+              "is-loading": P.isLoadingImage,
+              "headline-style": P.headlineStyle
             }, null, 8, ["caption", "headline", "images", "size", "business-name", "business-icon", "is-loading", "headline-style"])) : Et("", !0),
-            ((m = X(H)) == null ? void 0 : m.platform) === "FACEBOOK" && X(it) === "STORY" ? (Q(), vt(wi, {
+            ((m = X(H)) == null ? void 0 : m.platform) === "FACEBOOK" && X(tt) === "STORY" ? (Q(), vt(Ti, {
               key: 1,
               class: "container",
               caption: l(),
@@ -19712,11 +19705,11 @@ const ri = { key: 1 }, si = { class: "w-full" }, Rt = /* @__PURE__ */ bt({
               size: (v = X(J)) == null ? void 0 : v.size,
               "business-name": ((w = X(o)) == null ? void 0 : w.name) ?? "",
               "business-icon": ((E = X(o)) == null ? void 0 : E.thumbnail) ?? "",
-              "is-loading": k.isLoadingImage,
-              headline: k.headline,
-              "headline-style": k.headlineStyle
+              "is-loading": P.isLoadingImage,
+              headline: P.headline,
+              "headline-style": P.headlineStyle
             }, null, 8, ["caption", "images", "size", "business-name", "business-icon", "is-loading", "headline", "headline-style"])) : Et("", !0),
-            ((L = X(H)) == null ? void 0 : L.platform) === "INSTAGRAM" && X(it) === "POST" ? (Q(), vt(Ri, {
+            ((L = X(H)) == null ? void 0 : L.platform) === "INSTAGRAM" && X(tt) === "POST" ? (Q(), vt(Bi, {
               key: 2,
               class: "container",
               caption: l(),
@@ -19724,23 +19717,23 @@ const ri = { key: 1 }, si = { class: "w-full" }, Rt = /* @__PURE__ */ bt({
               size: (q = X(J)) == null ? void 0 : q.size,
               "business-name": ((Z = X(o)) == null ? void 0 : Z.name) ?? "",
               "business-icon": ((W = X(o)) == null ? void 0 : W.thumbnail) ?? "",
-              "is-loading": k.isLoadingImage,
-              headline: k.headline,
-              "headline-style": k.headlineStyle
+              "is-loading": P.isLoadingImage,
+              headline: P.headline,
+              "headline-style": P.headlineStyle
             }, null, 8, ["caption", "images", "size", "business-name", "business-icon", "is-loading", "headline", "headline-style"])) : Et("", !0),
-            ((N = X(H)) == null ? void 0 : N.platform) === "INSTAGRAM" && X(it) === "STORY" ? (Q(), vt(en, {
+            ((N = X(H)) == null ? void 0 : N.platform) === "INSTAGRAM" && X(tt) === "STORY" ? (Q(), vt(nn, {
               key: 3,
               class: "container",
               caption: l(),
-              images: (tt = X(J)) == null ? void 0 : tt.images,
+              images: (et = X(J)) == null ? void 0 : et.images,
               size: (st = X(J)) == null ? void 0 : st.size,
-              "business-name": ((et = X(o)) == null ? void 0 : et.name) ?? "",
+              "business-name": ((it = X(o)) == null ? void 0 : it.name) ?? "",
               "business-icon": ((y = X(o)) == null ? void 0 : y.thumbnail) ?? "",
-              "is-loading": k.isLoadingImage,
-              headline: k.headline,
-              "headline-style": k.headlineStyle
+              "is-loading": P.isLoadingImage,
+              headline: P.headline,
+              "headline-style": P.headlineStyle
             }, null, 8, ["caption", "images", "size", "business-name", "business-icon", "is-loading", "headline", "headline-style"])) : Et("", !0),
-            ((S = X(H)) == null ? void 0 : S.platform) === "INSTAGRAM" && X(it) === "REEL" ? (Q(), vt(Ni, {
+            ((S = X(H)) == null ? void 0 : S.platform) === "INSTAGRAM" && X(tt) === "REEL" ? (Q(), vt($i, {
               key: 4,
               class: "container",
               caption: l(),
@@ -19748,23 +19741,23 @@ const ri = { key: 1 }, si = { class: "w-full" }, Rt = /* @__PURE__ */ bt({
               size: (x = X(J)) == null ? void 0 : x.size,
               "business-name": ((M = X(o)) == null ? void 0 : M.name) ?? "",
               "business-icon": ((C = X(o)) == null ? void 0 : C.thumbnail) ?? "",
-              "is-loading": k.isLoadingImage,
-              headline: k.headline,
-              "headline-style": k.headlineStyle
+              "is-loading": P.isLoadingImage,
+              headline: P.headline,
+              "headline-style": P.headlineStyle
             }, null, 8, ["caption", "images", "size", "business-name", "business-icon", "is-loading", "headline", "headline-style"])) : Et("", !0),
-            ((_ = X(H)) == null ? void 0 : _.platform) === "BRAND_APP" && X(it) === "IMAGE" ? (Q(), vt(un, {
+            ((_ = X(H)) == null ? void 0 : _.platform) === "BRAND_APP" && X(tt) === "IMAGE" ? (Q(), vt(fn, {
               key: 5,
               class: "container",
               caption: l(),
               images: (T = X(J)) == null ? void 0 : T.images,
-              size: (P = X(J)) == null ? void 0 : P.size,
+              size: (k = X(J)) == null ? void 0 : k.size,
               "business-name": ((j = X(o)) == null ? void 0 : j.name) ?? "",
               "business-icon": ((A = X(o)) == null ? void 0 : A.thumbnail) ?? "",
-              "is-loading": k.isLoadingImage,
-              headline: k.headline,
-              "headline-style": k.headlineStyle
+              "is-loading": P.isLoadingImage,
+              headline: P.headline,
+              "headline-style": P.headlineStyle
             }, null, 8, ["caption", "images", "size", "business-name", "business-icon", "is-loading", "headline", "headline-style"])) : Et("", !0),
-            ((z = X(H)) == null ? void 0 : z.platform) === "TV" && X(it) === "IMAGE" ? (Q(), vt(on, {
+            ((z = X(H)) == null ? void 0 : z.platform) === "TV" && X(tt) === "IMAGE" ? (Q(), vt(ln, {
               key: 6,
               class: "container",
               caption: l(),
@@ -19772,16 +19765,16 @@ const ri = { key: 1 }, si = { class: "w-full" }, Rt = /* @__PURE__ */ bt({
               size: ($ = X(J)) == null ? void 0 : $.size,
               "business-name": ((F = X(o)) == null ? void 0 : F.name) ?? "",
               "business-icon": ((O = X(o)) == null ? void 0 : O.thumbnail) ?? "",
-              "is-loading": k.isLoadingImage,
-              headline: k.headline,
-              "headline-style": k.headlineStyle
+              "is-loading": P.isLoadingImage,
+              headline: P.headline,
+              "headline-style": P.headlineStyle
             }, null, 8, ["caption", "images", "size", "business-name", "business-icon", "is-loading", "headline", "headline-style"])) : Et("", !0)
           ])
         ])
       ]);
     };
   }
-}), vn = /* @__PURE__ */ xe(pn, [["__scopeId", "data-v-893c9161"]]), yn = { class: "xs:hidden px-24 pb-[14px] pt-[22px] flex items-center justify-between w-full border-b" }, _n = { class: "flex flex-row bg-fm-color-neutral-gray-100 h-full" }, Cn = /* @__PURE__ */ bt({
+}), yn = /* @__PURE__ */ be(vn, [["__scopeId", "data-v-893c9161"]]), _n = { class: "xs:hidden px-24 pb-[14px] pt-[22px] flex items-center justify-between w-full border-b" }, Cn = { class: "flex flex-row bg-fm-color-neutral-gray-100 h-full" }, xn = /* @__PURE__ */ bt({
   __name: "MarketingSheet",
   props: /* @__PURE__ */ Lt({
     isOpen: { type: Boolean, default: !0, required: !0 }
@@ -19794,8 +19787,8 @@ const ri = { key: 1 }, si = { class: "w-full" }, Rt = /* @__PURE__ */ bt({
     modelModifiers: {}
   }),
   emits: /* @__PURE__ */ Lt(["update:is-open"], ["update:modelValue"]),
-  setup(k, { emit: f }) {
-    const nt = me(), it = Nt(), lt = k, H = f, J = Dt(k, "modelValue"), c = gt([]), s = Ct(() => {
+  setup(P, { emit: f }) {
+    const nt = pe(), tt = Nt(), lt = P, H = f, J = Dt(P, "modelValue"), c = gt([]), s = Ct(() => {
       var a;
       return c.value.find(
         (n) => {
@@ -19829,7 +19822,7 @@ const ri = { key: 1 }, si = { class: "w-full" }, Rt = /* @__PURE__ */ bt({
     }
     async function t(r) {
       if (r.name === "") {
-        it.open({ message: "Please enter a name", type: "error" });
+        tt.open({ message: "Please enter a name", type: "error" });
         return;
       }
       nt.open({
@@ -19856,7 +19849,7 @@ const ri = { key: 1 }, si = { class: "w-full" }, Rt = /* @__PURE__ */ bt({
         "onUpdate:modelValue": a[4] || (a[4] = (u) => H("update:is-open", u))
       }, {
         "top-sheet-header": pt(() => [
-          Y("div", yn, [
+          Y("div", _n, [
             a[5] || (a[5] = Y("p", null, "Add Material", -1)),
             a[6] || (a[6] = Y("div", { class: "grow" }, null, -1)),
             ot(n, {
@@ -19871,8 +19864,8 @@ const ri = { key: 1 }, si = { class: "w-full" }, Rt = /* @__PURE__ */ bt({
           ])
         ]),
         default: pt(() => [
-          Y("div", _n, [
-            ot(ii, {
+          Y("div", Cn, [
+            ot(ni, {
               "marketing-material": J.value,
               "onUpdate:marketingMaterial": a[1] || (a[1] = (u) => J.value = u),
               "is-loading-image": X(o),
@@ -19883,7 +19876,7 @@ const ri = { key: 1 }, si = { class: "w-full" }, Rt = /* @__PURE__ */ bt({
               class: "h-full overflow-scroll",
               style: { borderRadius: 0 }
             }, null, 8, ["marketing-material", "is-loading-image", "caption-index", "headline-styles"]),
-            ot(vn, {
+            ot(yn, {
               caption: X(e),
               class: "h-full overflow-scroll",
               assets: J.value.assets,
@@ -19897,19 +19890,17 @@ const ri = { key: 1 }, si = { class: "w-full" }, Rt = /* @__PURE__ */ bt({
       }, 8, ["model-value"]);
     };
   }
-}), xn = { class: "px-24 flex flex-col gap-y-16" }, bn = { class: "flex items-center justify-between w-full" }, Sn = { class: "space-y-8" }, wn = { class: "fm-typo-en-body-lg-600" }, Tn = { class: "fm-typo-en-body-lg-600" }, On = { key: 0 }, kn = { class: "fm-typo-en-title-sm-800" }, Pn = { class: "fm-typo-en-body-md-400 text-fm-color-typo-secondary w-4/6 text-center" }, Hn = /* @__PURE__ */ bt({
+}), bn = { class: "px-24 flex flex-col gap-y-16" }, Sn = { class: "flex items-center justify-between w-full" }, wn = { class: "space-y-8" }, Tn = { class: "fm-typo-en-body-lg-600" }, On = { class: "fm-typo-en-body-lg-600" }, kn = { key: 0 }, Pn = { class: "fm-typo-en-title-sm-800" }, En = { class: "fm-typo-en-body-md-400 text-fm-color-typo-secondary w-4/6 text-center" }, Un = /* @__PURE__ */ bt({
   __name: "Marketing",
-  setup(k) {
-    const { t: f } = Se(), nt = {
+  setup(P) {
+    const { t: f } = we(), nt = {
       label: f("connect.marketing.create"),
       value: "create",
       isPrimary: !0,
       prependIcon: "add"
-    }, it = gt(!1), lt = Bt(), H = se(), { global: J, minor: c } = ie;
+    }, tt = gt(!1), lt = Bt(), H = se(), { global: J, minor: c } = ie;
     Gt(async () => {
-      await J(async () => {
-        await H.read(), await lt.readMarketingMaterial();
-      });
+      await H.read(), await lt.readMarketingMaterial();
     });
     const s = Ct(() => lt.marketing.filter(
       (r) => r.name.includes(t.value.searchKey.toLowerCase())
@@ -19935,13 +19926,13 @@ const ri = { key: 1 }, si = { class: "w-full" }, Rt = /* @__PURE__ */ bt({
           const a = new Date(
             parseInt(r._id.toString().substring(0, 8), 16) * 1e3
           );
-          return be(a).format("DD MMM YYYY");
+          return Se(a).format("DD MMM YYYY");
         }
       },
       {
         header: f("connect.marketing.table.actions"),
         cell(r) {
-          return de(pe.FmButton, {
+          return ge(ve.FmButton, {
             variant: "tertiary",
             icon: "delete",
             iconColor: "neutral-gray-400",
@@ -19953,7 +19944,7 @@ const ri = { key: 1 }, si = { class: "w-full" }, Rt = /* @__PURE__ */ bt({
       }
     ];
     async function e(r) {
-      await ve.remove(
+      await ye.remove(
         f("marketing.delete.confirm", { name: r.name })
       ) && await c(
         async () => {
@@ -19968,7 +19959,7 @@ const ri = { key: 1 }, si = { class: "w-full" }, Rt = /* @__PURE__ */ bt({
     async function i(r) {
       console.log("onEdit", r), r ? l.value = JSON.parse(JSON.stringify(r)) : l.value = JSON.parse(
         JSON.stringify(Bt().defaultMarketing)
-      ), it.value = !0;
+      ), tt.value = !0;
     }
     const t = gt({
       searchKey: ""
@@ -19982,7 +19973,7 @@ const ri = { key: 1 }, si = { class: "w-full" }, Rt = /* @__PURE__ */ bt({
           actions: X(s).length > 0 ? [nt] : [],
           "onClick:action": a[0] || (a[0] = () => i())
         }, null, 8, ["title", "actions"]),
-        Y("div", xn, [
+        Y("div", bn, [
           ot(h, {
             modelValue: t.value.searchKey,
             "onUpdate:modelValue": a[1] || (a[1] = (v) => t.value.searchKey = v),
@@ -19990,14 +19981,14 @@ const ri = { key: 1 }, si = { class: "w-full" }, Rt = /* @__PURE__ */ bt({
             class: "hidden xs:block border-b-2 border-fm-color-neutral-gray-100",
             collapsible: ""
           }, null, 8, ["modelValue", "placeholder"]),
-          ot(Cn, {
+          ot(xn, {
             modelValue: l.value,
             "onUpdate:modelValue": a[2] || (a[2] = (v) => l.value = v),
-            "is-open": it.value,
-            "onUpdate:isOpen": a[3] || (a[3] = (v) => it.value = v)
+            "is-open": tt.value,
+            "onUpdate:isOpen": a[3] || (a[3] = (v) => tt.value = v)
           }, null, 8, ["modelValue", "is-open"]),
           X(s).length > 0 ? (Q(), ut(xt, { key: 0 }, [
-            Y("div", bn, [
+            Y("div", Sn, [
               ot(h, {
                 modelValue: t.value.searchKey,
                 "onUpdate:modelValue": a[4] || (a[4] = (v) => t.value.searchKey = v),
@@ -20027,9 +20018,9 @@ const ri = { key: 1 }, si = { class: "w-full" }, Rt = /* @__PURE__ */ bt({
                   default: pt(() => {
                     var w;
                     return [
-                      Y("div", Sn, [
-                        Y("div", wn, Tt(v.name), 1),
-                        Y("div", Tn, Tt(v.campaign === null || v.campaign === void 0 ? "-" : (w = X(H).campaigns.all.find(
+                      Y("div", wn, [
+                        Y("div", Tn, Tt(v.name), 1),
+                        Y("div", On, Tt(v.campaign === null || v.campaign === void 0 ? "-" : (w = X(H).campaigns.all.find(
                           (E) => E._id === v.campaign
                         )) == null ? void 0 : w.name), 1)
                       ]),
@@ -20046,7 +20037,7 @@ const ri = { key: 1 }, si = { class: "w-full" }, Rt = /* @__PURE__ */ bt({
               ]),
               _: 1
             }),
-            X(s).length == 0 ? (Q(), ut("div", On, a[7] || (a[7] = [
+            X(s).length == 0 ? (Q(), ut("div", kn, a[7] || (a[7] = [
               Y("div", { class: "text-fm-color-typo-secondary fm-typo-en-body-md-600" }, " No results found ", -1)
             ]))) : Et("", !0)
           ], 64)) : (Q(), vt(p, {
@@ -20056,11 +20047,11 @@ const ri = { key: 1 }, si = { class: "w-full" }, Rt = /* @__PURE__ */ bt({
           }, {
             default: pt(() => [
               a[8] || (a[8] = Y("img", {
-                src: ge,
+                src: me,
                 class: "w-[150px]"
               }, null, -1)),
-              Y("p", kn, Tt(X(f)("connect.marketing.emptyState.title")), 1),
-              Y("p", Pn, Tt(X(f)("connect.marketing.emptyState.description")), 1),
+              Y("p", Pn, Tt(X(f)("connect.marketing.emptyState.title")), 1),
+              Y("p", En, Tt(X(f)("connect.marketing.emptyState.description")), 1),
               ot(d, {
                 label: X(f)("connect.marketing.emptyState.action"),
                 "prepend-icon": "add",
@@ -20075,5 +20066,5 @@ const ri = { key: 1 }, si = { class: "w-full" }, Rt = /* @__PURE__ */ bt({
   }
 });
 export {
-  Hn as default
+  Un as default
 };