@feedmepos/mf-report 5.27.35 → 5.27.36

package/dist/ReportEditor-BUXYZXMs.js

@@ -0,0 +1,2032 @@
+import { defineComponent as we, mergeModels as ke, useModel as Te, ref as L, computed as b, resolveComponent as C, createBlock as T, openBlock as c, withCtx as _, createElementVNode as v, createVNode as i, unref as o, normalizeClass as Pe, createTextVNode as Ge, toDisplayString as B, createElementBlock as R, Fragment as he, renderSlot as vt, createCommentVNode as M, watch as ge, renderList as qe, onMounted as ft, onUnmounted as St, resolveDynamicComponent as $t, isRef as gt, normalizeStyle as lt } from "vue";
+import { W as Dt, g as Ot, _ as It, a as Ut, e as Oe, S as Le, d as bt, b as yt, T as Bt, c as Nt } from "./TransitionFade-DszPGM-J.js";
+import { C as Ve, D as te, d as Re, g as Mt, F as He, e as Ie, u as at, M as ht, r as Rt, f as st, n as zt, h as qt, i as Pt, j as Et, k as Lt, a as Gt, b as ut, m as Xe, o as Wt, Q as je, p as At, l as Ht, c as dt, q as jt } from "./GlobalFilterSelect.vue_vue_type_script_setup_true_lang-DzZP-ANz.js";
+import { storeToRefs as ze } from "pinia";
+import { useRouter as rt, useRoute as nt } from "vue-router";
+import { useBreakpoints as Je, useSnackbar as wt, FmButtonColorThemeVariant as Ce } from "@feedmepos/ui-library";
+import { u as it } from "./message-dialog-UoMWOnil.js";
+import { u as Ee, a as Jt } from "./_plugin-vue_export-helper-onplcgja.js";
+import { r as We } from "./i18n-CI_sQ5d_.js";
+import { _ as Ze } from "./TileGrid.vue_vue_type_script_setup_true_lang-CC-xGpBd.js";
+import { a as et, _ as tt } from "./SelectComponent.vue_vue_type_script_setup_true_lang-CGbb3b5G.js";
+import { d as Kt, e as Qt, i as Yt } from "./DynamicWidget.vue_vue_type_script_setup_true_lang-RABMoQ3F.js";
+import { useCoreStore as Xt } from "@feedmepos/mf-common";
+import { u as Zt, a as el } from "./app-CwM9HM2R.js";
+import { d as tl } from "./DateRangeSelect-D2772bgT.js";
+const ll = /* @__PURE__ */ we({
+  __name: "WidgetDialog",
+  props: /* @__PURE__ */ ke({
+    isOpen: { type: Boolean }
+  }, {
+    modelValue: {},
+    modelModifiers: {}
+  }),
+  emits: /* @__PURE__ */ ke(["update:isOpen"], ["update:modelValue"]),
+  setup(z, { emit: p }) {
+    const { t: d } = Ee(), { breakpoints: y } = Je(), s = Te(z, "modelValue"), h = z, P = p;
+    function Q() {
+      P("update:isOpen", !1);
+    }
+    function S() {
+      F.value && (s.value = F.value, F.value = void 0, P("update:isOpen", !1));
+    }
+    const F = L(), U = b(() => !F.value);
+    return (ee, q) => {
+      const r = C("FmButton"), O = C("FmDialog");
+      return c(), T(O, {
+        "model-value": h.isOpen
+      }, {
+        "dialog-header": _(() => [
+          Ge(B(o(d)("report.widget.type")), 1)
+        ]),
+        default: _(() => [
+          i(Dt, {
+            modelValue: F.value,
+            "onUpdate:modelValue": q[0] || (q[0] = (k) => F.value = k),
+            class: Pe(`grid ${o(y).lg || o(y).md ? "grid-cols-3 gap-3" : "grid-cols-2 gap-3"}`),
+            "child-class": "p-[8px] flex flex-col"
+          }, null, 8, ["modelValue", "class"])
+        ]),
+        "dialog-footer": _(() => [
+          q[1] || (q[1] = v("div", { class: "grow" }, null, -1)),
+          i(r, {
+            label: o(d)("report.common.cancel"),
+            variant: "tertiary",
+            onClick: Q
+          }, null, 8, ["label"]),
+          i(r, {
+            label: o(d)("report.common.confirm"),
+            disabled: U.value,
+            onClick: S
+          }, null, 8, ["label", "disabled"])
+        ]),
+        _: 1
+      }, 8, ["model-value"]);
+    };
+  }
+}), ol = { class: "fm-typo-en-body-lg-600" }, ot = /* @__PURE__ */ we({
+  __name: "ReportEditorTabHeader",
+  props: /* @__PURE__ */ ke({
+    icon: {
+      type: String,
+      required: !0
+    }
+  }, {
+    modelValue: { type: Boolean, required: !0, default: !1 },
+    modelModifiers: {}
+  }),
+  emits: ["update:modelValue"],
+  setup(z) {
+    const { t: p } = Ee(), d = Te(z, "modelValue"), y = z;
+    return (s, h) => {
+      const P = C("FmIcon");
+      return c(), R("div", {
+        class: "px-6 py-16 flex items-center gap-2 bg-fm-color-neutral-white border cursor-pointer",
+        onClick: h[0] || (h[0] = (Q) => d.value = !d.value)
+      }, [
+        v("p", ol, B(o(p)("report.editor.customizeReport")), 1),
+        h[1] || (h[1] = v("div", { class: "grow" }, null, -1)),
+        i(P, {
+          name: y.icon
+        }, null, 8, ["name"])
+      ]);
+    };
+  }
+}), al = /* @__PURE__ */ we({
+  __name: "ReportEditorTabDesktop",
+  props: {
+    modelValue: { required: !0, default: !1 },
+    modelModifiers: {}
+  },
+  emits: ["update:modelValue"],
+  setup(z) {
+    const p = Te(z, "modelValue");
+    return (d, y) => (c(), R(he, null, [
+      i(ot, {
+        modelValue: p.value,
+        "onUpdate:modelValue": y[0] || (y[0] = (s) => p.value = s),
+        icon: "keyboard_double_arrow_left"
+      }, null, 8, ["modelValue"]),
+      vt(d.$slots, "default")
+    ], 64));
+  }
+}), rl = /* @__PURE__ */ we({
+  __name: "ReportEditorTabMobile",
+  props: {
+    modelValue: { required: !0, default: !1 },
+    modelModifiers: {}
+  },
+  emits: ["update:modelValue"],
+  setup(z) {
+    const p = Te(z, "modelValue");
+    return (d, y) => {
+      const s = C("FmTopSheet"), h = C("FmCard");
+      return c(), T(h, { class: "fixed bottom-0 w-full" }, {
+        default: _(() => [
+          i(ot, {
+            modelValue: p.value,
+            "onUpdate:modelValue": y[0] || (y[0] = (P) => p.value = P),
+            icon: "keyboard_double_arrow_up"
+          }, null, 8, ["modelValue"]),
+          i(s, {
+            modelValue: p.value,
+            "onUpdate:modelValue": y[2] || (y[2] = (P) => p.value = P),
+            "fullscreen-size": "sm"
+          }, {
+            default: _(() => [
+              i(ot, {
+                modelValue: p.value,
+                "onUpdate:modelValue": y[1] || (y[1] = (P) => p.value = P),
+                icon: "keyboard_double_arrow_down"
+              }, null, 8, ["modelValue"]),
+              p.value ? vt(d.$slots, "default", { key: 0 }) : M("", !0)
+            ]),
+            _: 3
+          }, 8, ["modelValue"])
+        ]),
+        _: 3
+      });
+    };
+  }
+}), nl = {
+  key: 2,
+  class: "flex flex-col gap-3 mt-2 border border-neutral-300 p-3"
+}, il = { class: "grid grid-cols-1 gap-2 rounded-md border border-neutral-300 p-2 sm:grid-cols-[1.3fr_1fr_1fr_auto] sm:items-end" }, sl = {
+  key: 0,
+  class: "flex justify-end sm:pb-[2px]"
+}, ul = { class: "fm-typo-en-body-lg-600 text-fm-color-typo-primary" }, dl = { class: "pl-1" }, ml = {
+  key: 0,
+  class: "flex justify-end sm:pb-[2px]"
+}, cl = {
+  key: 3,
+  class: "flex flex-col gap-2"
+}, pl = /* @__PURE__ */ we({
+  __name: "GlobalFilterDialog",
+  props: /* @__PURE__ */ ke({
+    schemas: {
+      type: Array,
+      default: () => []
+    },
+    tiles: {
+      type: Array,
+      required: !0
+    }
+  }, {
+    globalFilter: {
+      default: () => null
+    },
+    globalFilterModifiers: {},
+    isOpen: { type: Boolean, default: () => !1, required: !0 },
+    isOpenModifiers: {}
+  }),
+  emits: ["update:globalFilter", "update:isOpen"],
+  setup(z) {
+    const { t: p, te: d } = Ee(), y = Te(z, "globalFilter"), s = Te(z, "isOpen"), h = wt(), P = z, Q = L(""), S = L(), F = L(), U = L(), ee = L([]), q = L([]), r = L(!1), O = L([]), k = L([]), Y = L(Ve.Equal);
+    function ne(e) {
+      return JSON.parse(JSON.stringify(e));
+    }
+    function ce(e, t) {
+      return { hour: e, minute: t };
+    }
+    function A(e) {
+      return e ? `${String(e.hour).padStart(2, "0")}:${String(e.minute).padStart(2, "0")}` : null;
+    }
+    function j(e) {
+      if (!e) return null;
+      const [t, m] = e.split(":").map(Number);
+      return Number.isNaN(t) || Number.isNaN(m) ? null : { hour: t, minute: m };
+    }
+    const x = b(() => F.value ? !(F.value.type === te.Timestamp && U.value === Re.DateTime) : !1), X = b(
+      () => {
+        var e;
+        return ((e = F.value) == null ? void 0 : e.type) === te.Timestamp && U.value === Re.TimeOfDay;
+      }
+    ), le = b(() => {
+      var e;
+      return (((e = F.value) == null ? void 0 : e.filterOperators) ?? []).filter((t) => t !== Ve.And && t !== Ve.Or).map((t) => ({
+        label: p(`report.section.comparisonOperator.${t}`),
+        value: t
+      }));
+    });
+    function oe() {
+      var t;
+      const e = (t = le.value[0]) == null ? void 0 : t.value;
+      return e || (F.value ? Ne(
+        F.value.type,
+        U.value ?? null
+      ) : Ve.Equal);
+    }
+    function se(e) {
+      if (F.value)
+        return Mt({
+          operator: e ?? oe(),
+          dataType: F.value.type,
+          dimensionOption: F.value.type === te.Timestamp ? U.value ?? null : null,
+          t: p
+        });
+    }
+    function ue(e, t) {
+      if (typeof (t == null ? void 0 : t.default) == "boolean" || e.length > 0 && e.every((V) => typeof V == "boolean")) {
+        const V = e.reduce((D, I) => (typeof I == "boolean" && D.push(I), D), []);
+        if (t)
+          for (t.fixed && V.splice(t.count); V.length < t.count; )
+            V.push(typeof t.default == "boolean" ? t.default : !1);
+        return V;
+      }
+      const g = e.reduce((V, D) => (typeof D == "string" && V.push(D), V), []);
+      if (t)
+        for (t.fixed && g.splice(t.count); g.length < t.count; )
+          g.push(typeof t.default == "string" ? t.default : "");
+      return g;
+    }
+    function de(e = Y.value) {
+      const t = se(e), m = ue(
+        t ? Array(t.count).fill(t.default) : [],
+        t
+      );
+      return {
+        label: "",
+        operator: e,
+        values: m
+      };
+    }
+    function E() {
+      return {
+        name: "",
+        startTime: ce(0, 0),
+        endTime: ce(23, 59)
+      };
+    }
+    function G() {
+      if (!(!x.value || !r.value)) {
+        if (X.value) {
+          k.value.length === 0 && (k.value = [E()]);
+          return;
+        }
+        O.value.length === 0 && (O.value = [de()]);
+      }
+    }
+    function J() {
+      var m, g, V;
+      const e = ne(((m = y.value) == null ? void 0 : m.customOptions) ?? []), t = ne(((g = y.value) == null ? void 0 : g.customTimeRanges) ?? []);
+      Y.value = ((V = e[0]) == null ? void 0 : V.operator) ?? oe(), r.value = e.length > 0 || t.length > 0, O.value = e, k.value = t, G();
+    }
+    function pe(e) {
+      Y.value = e, O.value = O.value.map((t, m) => {
+        const g = O.value[m];
+        if (!g)
+          return de(e);
+        const V = se(e), D = ue(
+          Array.isArray(g.values) ? [...g.values] : [],
+          V
+        );
+        return {
+          ...g,
+          operator: e,
+          values: D
+        };
+      });
+    }
+    function be() {
+      O.value = [...O.value, de()];
+    }
+    function K(e) {
+      O.value.length <= 1 || (O.value = O.value.filter((t, m) => m !== e));
+    }
+    function _e() {
+      k.value = [...k.value, E()];
+    }
+    function ae(e) {
+      k.value.length <= 1 || (k.value = k.value.filter(
+        (t, m) => m !== e
+      ));
+    }
+    function Se(e, t, m) {
+      const g = k.value[e];
+      g && (k.value[e] = {
+        ...g,
+        [t]: j(m)
+      });
+    }
+    function Ue(e) {
+      return e.length === 0 || e.some((t) => t === "");
+    }
+    function $e() {
+      if (!r.value) return !0;
+      if (X.value) {
+        const m = k.value.map((V) => V.name.trim()).filter(Boolean);
+        return k.value.some(
+          (V) => !V.name.trim() || !V.startTime || !V.endTime
+        ) ? (h.open({
+          message: p("report.section.filter.invalidCustomTimeRange"),
+          type: "error"
+        }), !1) : new Set(m).size !== m.length ? (h.open({
+          message: p("report.section.filter.customTimeRangeNamesMustBeUnique"),
+          type: "error"
+        }), !1) : !0;
+      }
+      const e = O.value.map((m) => m.label.trim()).filter(Boolean);
+      return O.value.some(
+        (m) => !m.label.trim() || Ue(m.values)
+      ) ? (h.open({ message: p("report.section.filter.invalidCustomOption"), type: "error" }), !1) : new Set(e).size !== e.length ? (h.open({
+        message: p("report.section.filter.customOptionLabelsMustBeUnique"),
+        type: "error"
+      }), !1) : !0;
+    }
+    ge(s, (e) => {
+      var t, m, g, V, D;
+      e && (Q.value = ((t = y.value) == null ? void 0 : t.label) || "", S.value = P.schemas.find(
+        (I) => {
+          var W;
+          return I.name === ((W = y.value) == null ? void 0 : W.schemaName);
+        }
+      ), F.value = (m = fe.value.find(
+        (I) => {
+          var W;
+          return I.value.name === ((W = y.value) == null ? void 0 : W.name);
+        }
+      )) == null ? void 0 : m.value, U.value = (g = y.value) == null ? void 0 : g.option, ee.value = ((V = y.value) == null ? void 0 : V.tileIds) || [], q.value = ((D = y.value) == null ? void 0 : D.filters) || [], J());
+    }), ge(r, (e) => {
+      var t;
+      e && (Y.value = ((t = O.value[0]) == null ? void 0 : t.operator) ?? oe(), G());
+    }), ge(x, (e) => {
+      if (!e) {
+        r.value = !1, O.value = [], k.value = [];
+        return;
+      }
+      G();
+    }), ge(X, () => {
+      G();
+    }), ge(le, (e) => {
+      var m;
+      const t = (m = e[0]) == null ? void 0 : m.value;
+      t && (e.some((g) => g.value === Y.value) || pe(t));
+    });
+    const ve = b(
+      () => P.schemas.map((e) => ({
+        label: e.label || e.name,
+        value: e
+      }))
+    ), fe = b(() => {
+      var e;
+      return (((e = S.value) == null ? void 0 : e.fields) || []).filter((t) => t.type !== te.Numeric).map((t) => ({
+        label: t.label || t.name,
+        value: t
+      }));
+    }), ye = b(() => {
+      var e;
+      return ((e = F.value) == null ? void 0 : e.type) !== te.Timestamp ? [] : Ot(p);
+    }), Fe = b(() => P.tiles.reduce((e, t, m) => {
+      var D, I, W, H, Z;
+      const g = ((D = t.widget) == null ? void 0 : D.config.schemaNames) ?? [], V = (((I = t.widget) == null ? void 0 : I.config.joinDatasources) ?? []).flatMap(
+        (me) => me.schemaNames ?? []
+      );
+      return [...g, ...V].includes(((W = S.value) == null ? void 0 : W.name) || "") && e.push({
+        label: (Z = (H = t.widget) == null ? void 0 : H.title) != null && Z.trim() ? t.widget.title : `Widget ${m + 1}`,
+        value: t.id
+      }), e;
+    }, [])), xe = b(
+      () => P.schemas.flatMap(
+        (e) => (e.fields ?? []).map((t) => ({
+          ...t,
+          labels: [
+            We(p, d, e.label, "schema"),
+            We(p, d, t.label || t.name, "other")
+          ]
+        }))
+      )
+    );
+    function De(e) {
+      var t;
+      e.name !== ((t = S.value) == null ? void 0 : t.name) && (S.value = e, F.value = void 0, Y.value = Ve.Equal, r.value = !1, O.value = [], k.value = []);
+    }
+    function Be(e) {
+      F.value = e, U.value = e.type === te.Timestamp ? Re.DateTime : void 0, Y.value = oe(), r.value = !1, O.value = [], k.value = [];
+    }
+    function Ne(e, t) {
+      switch (e) {
+        case te.Timestamp:
+          return t === Re.DateTime || t === Re.TimeOfDay ? Ve.Between : Ve.Equal;
+        case te.Bool:
+        case te.String:
+        case te.Numeric:
+          return Ve.Equal;
+        default:
+          throw new Error(`Unsupported data type: ${e}`);
+      }
+    }
+    function Me() {
+      if (!S.value) {
+        h.open({ message: p("report.section.filter.invalidSchema"), type: "error" });
+        return;
+      }
+      if (!F.value) {
+        h.open({ message: p("report.section.filter.invalidDimension"), type: "error" });
+        return;
+      }
+      const e = q.value.filter((g) => g ? !ve.value.some((D) => D.value.name === g.schemaName) : !0);
+      if (e.length > 0) {
+        const g = e.filter((D) => !!D).map((D) => D.schemaName), V = e.some((D) => !D) ? `, ${p("report.section.filter.unknownFilters")}` : "";
+        h.open({
+          message: p("report.section.filter.invalidFiltersSchemaNotFound", {
+            schemas: g.join(", "),
+            unknownFiltersSuffix: V
+          }),
+          type: "error"
+        });
+        return;
+      }
+      if (!$e())
+        return;
+      const t = r.value && !X.value ? O.value.map((g) => ({
+        label: g.label.trim(),
+        operator: g.operator ?? oe(),
+        values: ue(
+          [...g.values],
+          se(g.operator)
+        )
+      })) : void 0, m = r.value && X.value ? k.value.map((g) => ({
+        name: g.name.trim(),
+        startTime: g.startTime,
+        endTime: g.endTime
+      })) : void 0;
+      y.value = {
+        schemaName: S.value.name,
+        name: F.value.name,
+        label: Q.value,
+        operator: Ne(
+          F.value.type,
+          F.value.type === te.Timestamp ? U.value ?? Re.DateTime : null
+        ),
+        option: F.value.type === te.Timestamp ? U.value : null,
+        values: [],
+        tileIds: [...ee.value],
+        filters: ne(q.value),
+        customOptions: t,
+        customTimeRanges: m
+      }, s.value = !1;
+    }
+    function re() {
+      s.value = !1;
+    }
+    const n = b(() => {
+      var e;
+      return [
+        (e = S.value) == null ? void 0 : e.name,
+        ...q.value.map((t) => t.schemaName)
+      ];
+    });
+    function a(e) {
+      var $;
+      const t = P.tiles.find((w) => w.id === e.value);
+      if (!t || !S.value || !F.value) return null;
+      const m = ($ = t == null ? void 0 : t.widget) == null ? void 0 : $.config, g = (m == null ? void 0 : m.schemaNames) ?? [], V = ((m == null ? void 0 : m.joinDatasources) ?? []).flatMap(
+        (w) => w.schemaNames ?? []
+      ), D = [...g, ...V], I = n.value.filter((w) => !!w).some((w) => !D.includes(w)), W = F.value.type === te.Timestamp;
+      if (I)
+        return p(
+          W ? "report.section.filter.missingFilterSchema" : "report.section.filter.missingFilterSchemaOrDimension"
+        );
+      if (W) return null;
+      const H = ((m == null ? void 0 : m.dimensions) ?? []).map((w) => ({
+        schemaName: w.schemaName,
+        name: w.name
+      })), Z = ((m == null ? void 0 : m.joinDatasources) ?? []).flatMap(
+        (w) => (w.dimensions ?? []).map((ie) => ({
+          schemaName: ie.schemaName,
+          name: ie.name
+        }))
+      ), me = [...H, ...Z], f = S.value.name, u = F.value.name;
+      return me.some(
+        (w) => w.schemaName === f && w.name === u
+      ) ? null : p("report.section.filter.missingFilterSchemaOrDimension");
+    }
+    return (e, t) => {
+      const m = C("FmTextField"), g = C("FmSelect"), V = C("FmCheckbox"), D = C("FmTimePicker"), I = C("FmButton"), W = C("FmLabel"), H = C("FmIcon"), Z = C("FmTooltip"), me = C("FmForm"), f = C("FmDialog");
+      return c(), T(f, {
+        modelValue: s.value,
+        "onUpdate:modelValue": t[9] || (t[9] = (u) => s.value = u),
+        overlay: !0,
+        "z-index": 10
+      }, {
+        "dialog-header": _(() => [
+          Ge(B(o(p)("report.section.filter.globalFilter")), 1)
+        ]),
+        default: _(() => [
+          i(me, {
+            ref: "form",
+            class: "flex flex-col gap-2 w-[490px]"
+          }, {
+            default: _(() => {
+              var u;
+              return [
+                i(m, {
+                  modelValue: Q.value,
+                  "onUpdate:modelValue": t[0] || (t[0] = (l) => Q.value = l),
+                  placeholder: o(p)("report.section.filter.displayName"),
+                  label: o(p)("report.section.filter.displayName"),
+                  class: "mb-2"
+                }, null, 8, ["modelValue", "placeholder", "label"]),
+                i(et, {
+                  "model-value": S.value,
+                  items: ve.value,
+                  placeholder: o(p)("report.section.schema.title"),
+                  label: o(p)("report.section.schema.title"),
+                  "onUpdate:modelValue": t[1] || (t[1] = (l) => De(l))
+                }, null, 8, ["model-value", "items", "placeholder", "label"]),
+                i(et, {
+                  "model-value": F.value,
+                  items: fe.value,
+                  placeholder: o(p)("report.section.dimension.title"),
+                  label: o(p)("report.section.dimension.title"),
+                  "onUpdate:modelValue": t[2] || (t[2] = (l) => Be(l))
+                }, null, 8, ["model-value", "items", "placeholder", "label"]),
+                ((u = F.value) == null ? void 0 : u.type) === o(te).Timestamp ? (c(), T(g, {
+                  key: 0,
+                  modelValue: U.value,
+                  "onUpdate:modelValue": t[3] || (t[3] = (l) => U.value = l),
+                  items: ye.value,
+                  placeholder: o(p)("report.section.filter.timeFormatter"),
+                  label: o(p)("report.section.filter.timeFormatter")
+                }, null, 8, ["modelValue", "items", "placeholder", "label"])) : M("", !0),
+                x.value ? (c(), T(V, {
+                  key: 1,
+                  modelValue: r.value,
+                  "onUpdate:modelValue": t[4] || (t[4] = (l) => r.value = l),
+                  label: o(p)("report.section.filter.customOptions"),
+                  value: !0
+                }, null, 8, ["modelValue", "label"])) : M("", !0),
+                x.value && r.value ? (c(), R("div", nl, [
+                  X.value ? (c(!0), R(he, { key: 0 }, qe(k.value, (l, $) => (c(), R("div", {
+                    key: `custom-time-range-${$}`,
+                    class: "flex flex-col gap-2"
+                  }, [
+                    v("div", il, [
+                      i(m, {
+                        modelValue: l.name,
+                        "onUpdate:modelValue": (w) => l.name = w,
+                        label: o(p)("report.section.filter.label")
+                      }, null, 8, ["modelValue", "onUpdate:modelValue", "label"]),
+                      i(D, {
+                        "model-value": A(l.startTime),
+                        label: o(p)("report.date.startingTime"),
+                        "onUpdate:modelValue": (w) => Se($, "startTime", w)
+                      }, null, 8, ["model-value", "label", "onUpdate:modelValue"]),
+                      i(D, {
+                        "model-value": A(l.endTime),
+                        label: o(p)("report.date.endingTime"),
+                        "onUpdate:modelValue": (w) => Se($, "endTime", w)
+                      }, null, 8, ["model-value", "label", "onUpdate:modelValue"]),
+                      k.value.length > 1 ? (c(), R("div", sl, [
+                        i(I, {
+                          icon: "delete",
+                          variant: "tertiary",
+                          onClick: (w) => ae($)
+                        }, null, 8, ["onClick"])
+                      ])) : M("", !0)
+                    ])
+                  ]))), 128)) : (c(), R(he, { key: 1 }, [
+                    v("p", ul, B(o(p)("report.section.filter.operator")), 1),
+                    le.value.length > 0 ? (c(), T(et, {
+                      key: 0,
+                      "model-value": Y.value,
+                      items: le.value,
+                      placeholder: o(p)("report.section.filter.operator"),
+                      "onUpdate:modelValue": t[5] || (t[5] = (l) => pe(l))
+                    }, null, 8, ["model-value", "items", "placeholder"])) : M("", !0),
+                    (c(!0), R(he, null, qe(O.value, (l, $) => (c(), R("div", {
+                      key: `custom-option-${$}`,
+                      class: "flex flex-col gap-2"
+                    }, [
+                      v("div", {
+                        class: Pe(["grid grid-cols-1 gap-2 p-2 sm:items-end text-fm-color-typo-primary fm-typo-en-body-lg-600 border-neutral-300 rounded-md border", "sm:grid-cols-[1fr_1.6fr_auto]"])
+                      }, [
+                        v("span", dl, B(o(p)("report.section.filter.label")), 1),
+                        i(m, {
+                          modelValue: l.label,
+                          "onUpdate:modelValue": (w) => l.label = w
+                        }, null, 8, ["modelValue", "onUpdate:modelValue"]),
+                        (c(), T(It, {
+                          key: `custom-option-value-${$}-${l.operator ?? ""}-${U.value ?? ""}`,
+                          modelValue: l.values,
+                          "onUpdate:modelValue": (w) => l.values = w,
+                          config: se(l.operator),
+                          option: U.value
+                        }, null, 8, ["modelValue", "onUpdate:modelValue", "config", "option"])),
+                        O.value.length > 1 ? (c(), R("div", ml, [
+                          i(I, {
+                            icon: "delete",
+                            variant: "tertiary",
+                            onClick: (w) => K($)
+                          }, null, 8, ["onClick"])
+                        ])) : M("", !0)
+                      ])
+                    ]))), 128))
+                  ], 64)),
+                  i(I, {
+                    class: "w-full",
+                    variant: "primary",
+                    icon: "add",
+                    "icon-position": "prepend",
+                    onClick: t[6] || (t[6] = (l) => X.value ? _e() : be())
+                  })
+                ])) : M("", !0),
+                i(Ut, {
+                  modelValue: q.value,
+                  "onUpdate:modelValue": t[7] || (t[7] = (l) => q.value = l),
+                  options: xe.value
+                }, null, 8, ["modelValue", "options"]),
+                i(W, { class: "mt-2 fm-typo-en-body-lg-600" }, {
+                  default: _(() => [
+                    Ge(B(o(p)("report.section.filter.applyWidget")), 1)
+                  ]),
+                  _: 1
+                }),
+                z.tiles.length > 0 ? (c(), R("div", cl, [
+                  (c(!0), R(he, null, qe(Fe.value, (l) => (c(), R("div", {
+                    key: l.value,
+                    class: "flex items-center"
+                  }, [
+                    i(V, {
+                      modelValue: ee.value,
+                      "onUpdate:modelValue": t[8] || (t[8] = ($) => ee.value = $),
+                      label: l.label,
+                      value: l.value
+                    }, null, 8, ["modelValue", "label", "value"]),
+                    a(l) ? (c(), T(Z, {
+                      key: 0,
+                      content: a(l) ?? void 0,
+                      "z-index": 99,
+                      class: "ml-2"
+                    }, {
+                      default: _(() => [
+                        i(H, {
+                          name: "warning",
+                          class: "text-fm-color-system-error-300"
+                        })
+                      ]),
+                      _: 2
+                    }, 1032, ["content"])) : M("", !0)
+                  ]))), 128))
+                ])) : (c(), T(W, {
+                  key: 4,
+                  class: "fm-typo-en-body-lg-400",
+                  label: o(p)("report.section.filter.noWidget")
+                }, null, 8, ["label"]))
+              ];
+            }),
+            _: 1
+          }, 512)
+        ]),
+        "dialog-footer": _(() => [
+          t[10] || (t[10] = v("div", { class: "grow" }, null, -1)),
+          i(I, {
+            label: o(p)("report.common.cancel"),
+            variant: "tertiary",
+            onClick: re
+          }, null, 8, ["label"]),
+          i(I, {
+            label: o(p)("report.common.confirm"),
+            onClick: Me
+          }, null, 8, ["label"])
+        ]),
+        _: 1
+      }, 8, ["modelValue"]);
+    };
+  }
+}), vl = 8.4375, fl = 1024 ** 4, gl = {
+  MY: { rate: 4, currency: "MYR", symbol: "RM" },
+  TH: { rate: 33, currency: "THB", symbol: "฿" },
+  SG: { rate: 1.29, currency: "SGD", symbol: "S$" },
+  ID: { rate: 17900, currency: "IDR", symbol: "Rp" }
+}, bl = { rate: 1, currency: "USD", symbol: "$" };
+function mt(z, p) {
+  const d = z / fl * vl, { rate: y, currency: s, symbol: h } = gl[p] ?? bl;
+  return {
+    amount: d * y,
+    currency: s,
+    symbol: h,
+    costUsd: d
+  };
+}
+function ct(z, p) {
+  return z < 0.01 ? `< ${p}0.01` : `${p}${z.toFixed(2)}`;
+}
+const yl = { class: "flex flex-col gap-16" }, hl = {
+  key: 0,
+  class: "flex flex-col gap-8"
+}, wl = { class: "flex items-center gap-4 pb-8 border-b border-neutral-300" }, _l = ["title"], Fl = { class: "fm-typo-en-title-sm-600 pt-8" }, xl = { class: "mx-16 flex flex-col gap-12 py-4" }, Vl = { class: "fm-typo-en-body-lg-600" }, Cl = { class: "fm-typo-en-body-md-400 text-fm-color-typo-tertiary" }, kl = { class: "flex flex-col gap-12 border-t border-neutral-200 pt-12" }, Tl = { class: "fm-typo-en-body-lg-600" }, Sl = { class: "grid grid-cols-2 items-end gap-12" }, $l = { class: "flex flex-col gap-8 min-w-0" }, Dl = { class: "fm-typo-en-body-sm-600 whitespace-nowrap" }, Ol = { class: "flex gap-8" }, Il = { class: "grid grid-cols-2 items-end gap-12" }, Ul = { class: "flex flex-col gap-8 min-w-0" }, Bl = { class: "fm-typo-en-body-sm-600 whitespace-nowrap" }, Nl = { class: "flex gap-8" }, Ml = {
+  key: 1,
+  class: "rounded-md border border-dashed border-neutral-300 p-12 text-center fm-typo-en-body-sm-400 text-fm-color-typo-secondary"
+}, Rl = ["onClick"], zl = ["title"], ql = {
+  key: 0,
+  class: "text-fm-color-typo-secondary"
+}, Pl = { class: "text-fm-color-system-error-300" }, El = { class: "w-full text-left" }, Ll = /* @__PURE__ */ we({
+  __name: "TileDrillPanel",
+  props: {
+    report: {}
+  },
+  emits: ["add-widget"],
+  setup(z, { emit: p }) {
+    const d = z, y = p, { t: s, te: h } = Ee(), P = [
+      { label: s("report.tile.widget.icon.small"), value: He.Small },
+      { label: s("report.tile.widget.icon.medium"), value: He.Medium },
+      { label: s("report.tile.widget.icon.large"), value: He.Large },
+      { label: s("report.tile.widget.icon.extraLarge"), value: He.ExtraLarge }
+    ], Q = [
+      { label: s("report.tile.widget.icon.material"), value: Ie.Material },
+      { label: s("report.tile.widget.icon.customSvg"), value: Ie.Custom }
+    ], S = rt(), F = nt(), { promptMessage: U } = it(), ee = at(), q = b(() => {
+      const n = [];
+      let a = d.report.tiles;
+      for (const e of Oe.value) {
+        const t = a.find((m) => m.id === e);
+        if (!t) break;
+        n.push(t), a = t.tiles ?? [];
+      }
+      return n;
+    });
+    ge(q, (n) => {
+      n.length !== Oe.value.length && (Oe.value = n.map((a) => a.id));
+    });
+    const r = b(() => q.value[q.value.length - 1] ?? null), O = b(() => q.value[q.value.length - 2] ?? null), k = b(
+      () => r.value ? r.value.tiles ?? [] : d.report.tiles
+    ), Y = b(() => {
+      var n;
+      return ((n = r.value) == null ? void 0 : n.id) ?? null;
+    }), ne = b(() => q.value.length === 0), ce = b(() => {
+      var n;
+      return ((n = r.value) == null ? void 0 : n.tab) === !0;
+    }), A = b(() => {
+      var n;
+      return ((n = O.value) == null ? void 0 : n.tab) === !0;
+    }), j = b(
+      () => q.value.reduce((n, a) => a.tab ? n : n + 1, 1)
+    ), x = b(() => !ce.value && j.value < ht), X = b(() => ne.value);
+    function le(n) {
+      n.widget || (Oe.value = [...Oe.value, n.id]);
+    }
+    function oe() {
+      Oe.value = Oe.value.slice(0, -1);
+    }
+    function se(n) {
+      if (!n) return "";
+      const a = `report.widget.types.${n.toLowerCase()}`;
+      return h(a) ? s(a) : We(s, h, n, "other");
+    }
+    function ue(n, a) {
+      return n.widget ? n.widget.title ? se(n.widget.title) : s("report.editor.widget", { index: a + 1 }) : n.tabTitle !== void 0 ? n.tabTitle || s("report.editor.tab", { index: a + 1 }) : n.title ? n.title : n.tab ? s("report.editor.tabGroup") : s("report.editor.group");
+    }
+    function de(n, a) {
+      return !n.widget && ce.value ? n.tabTitle || s("report.editor.tab", { index: a + 1 }) : ue(n, a);
+    }
+    function E(n) {
+      var a;
+      return ((a = n.tiles) == null ? void 0 : a.length) ?? 0;
+    }
+    const G = b(
+      () => q.value.map((n, a) => ue(n, a)).join(" › ")
+    );
+    function J(n, a) {
+      yt.value = Y.value, ee.editingTileIndex = a, ee.editingTile = JSON.parse(JSON.stringify(n)), S.push({ name: "tileEditor", query: F.query });
+    }
+    function pe(n, a) {
+      k.value.splice(a + 1, 0, Rt(n));
+    }
+    async function be(n, a) {
+      var m;
+      if (!await U({
+        title: s("report.editor.deleteWidget"),
+        message: s("report.editor.deleteWidgetConfirm", { title: de(n, a) })
+      })) return;
+      const t = st(n);
+      k.value.splice(a, 1), (m = d.report.globalFilters) == null || m.forEach((g) => {
+        var V;
+        g.tileIds = (V = g.tileIds) == null ? void 0 : V.filter((D) => !t.includes(D));
+      });
+    }
+    function K() {
+      r.value && (r.value.tiles || (r.value.tiles = []), r.value.tiles.push(zt(r.value.tiles.length + 1)));
+    }
+    function _e() {
+      k.value.push(qt());
+    }
+    function ae() {
+      k.value.push(Pt());
+    }
+    function Se(n) {
+      var e;
+      const a = Number((e = n.size) == null ? void 0 : e.width);
+      n.size || (n.size = { width: 12, height: 12 }), !Number.isFinite(a) || a < 1 ? n.size.width = 1 : a > 12 && (n.size.width = 12);
+    }
+    function Ue(n) {
+      var e;
+      const a = Number((e = n.size) == null ? void 0 : e.height);
+      n.size || (n.size = { width: 12, height: 12 }), !Number.isFinite(a) || a < 1 ? n.size.height = 1 : a > 12 && (n.size.height = 12);
+    }
+    function $e(n, a) {
+      const e = Number(n[a]);
+      !Number.isFinite(e) || e < 1 ? n[a] = 1 : e > 24 && (n[a] = 24);
+    }
+    const ve = b({
+      get: () => {
+        var n;
+        return ((n = r.value) == null ? void 0 : n.titleFontSize) ?? 16;
+      },
+      set: (n) => {
+        r.value && (r.value.titleFontSize = n ?? void 0);
+      }
+    }), fe = b({
+      get: () => {
+        var n;
+        return ((n = r.value) == null ? void 0 : n.descriptionFontSize) ?? 14;
+      },
+      set: (n) => {
+        r.value && (r.value.descriptionFontSize = n ?? void 0);
+      }
+    }), ye = b({
+      get: () => {
+        var n, a, e;
+        return ((n = r.value) == null ? void 0 : n.tabIconType) ?? ((e = (a = r.value) == null ? void 0 : a.tabIcon) != null && e.trim().startsWith("<svg") ? Ie.Custom : Ie.Material);
+      },
+      set: (n) => {
+        r.value && (r.value.tabIconType = n);
+      }
+    }), Fe = b({
+      get: () => {
+        var n, a;
+        return ye.value === Ie.Custom ? Kt(((n = r.value) == null ? void 0 : n.tabIcon) ?? "") : ((a = r.value) == null ? void 0 : a.tabIcon) ?? "";
+      },
+      set: (n) => {
+        r.value && (r.value.tabIcon = ye.value === Ie.Custom ? Qt(n) : n.trim());
+      }
+    }), xe = L(!1), De = L(null), Be = L([]);
+    function Ne(n) {
+      const a = [
+        { parentId: null, label: s("report.editor.topLevel"), level: 1 }
+      ], e = (m, g, V) => {
+        let D = 0;
+        m.forEach((I) => {
+          var W;
+          if (!I.widget)
+            if (I.tab) {
+              const H = `${V}${s("report.editor.tabGroup")}`;
+              (W = I.tiles) == null || W.forEach((Z, me) => {
+                const f = `${H} › ${Z.tabTitle || s("report.editor.tab", { index: me + 1 })}`;
+                a.push({ parentId: Z.id, label: f, level: g + 1 }), e(Z.tiles ?? [], g + 1, `${f} › `);
+              });
+            } else {
+              D += 1;
+              const H = `${V}${I.title || `${s("report.editor.group")} ${D}`}`;
+              a.push({ parentId: I.id, label: H, level: g + 1 }), e(I.tiles ?? [], g + 1, `${H} › `);
+            }
+        });
+      };
+      e(d.report.tiles, 1, "");
+      const t = new Set(st(n));
+      return a.filter(
+        (m) => m.parentId !== Y.value && !(m.parentId && t.has(m.parentId)) && Lt(n, m.level)
+      );
+    }
+    function Me(n) {
+      De.value = n, Be.value = Ne(n), xe.value = !0;
+    }
+    function re(n) {
+      const a = De.value;
+      if (!a) return;
+      const e = k.value.indexOf(a);
+      e >= 0 && k.value.splice(e, 1), Et(d.report.tiles, n.parentId).push(a), xe.value = !1, De.value = null;
+    }
+    return (n, a) => {
+      const e = C("FmButton"), t = C("FmTextField"), m = C("FmSelect"), g = C("FmTextarea"), V = C("FmStepperField"), D = C("FmIcon"), I = C("FmMenuItem"), W = C("FmMenu"), H = C("FmList"), Z = C("FmListItem"), me = C("FmDialog");
+      return c(), R("div", yl, [
+        ne.value ? M("", !0) : (c(), R("div", hl, [
+          v("div", wl, [
+            i(e, {
+              icon: "arrow_back",
+              variant: "tertiary",
+              class: "-ml-8",
+              onClick: oe
+            }),
+            v("p", {
+              class: "fm-typo-en-body-md-600 line-clamp-1 overflow-hidden break-all min-w-0 grow text-left",
+              title: G.value
+            }, B(G.value), 9, _l)
+          ]),
+          A.value && r.value ? (c(), T(t, {
+            key: 0,
+            modelValue: r.value.tabTitle,
+            "onUpdate:modelValue": a[0] || (a[0] = (f) => r.value.tabTitle = f),
+            label: o(s)("report.editor.tabName"),
+            placeholder: o(s)("report.editor.tabName")
+          }, null, 8, ["modelValue", "label", "placeholder"])) : M("", !0),
+          A.value && r.value ? (c(), T(m, {
+            key: 1,
+            modelValue: ye.value,
+            "onUpdate:modelValue": a[1] || (a[1] = (f) => ye.value = f),
+            label: o(s)("report.tile.widget.icon.type"),
+            items: Q
+          }, null, 8, ["modelValue", "label"])) : M("", !0),
+          A.value && r.value && ye.value === o(Ie).Material ? (c(), T(t, {
+            key: 2,
+            modelValue: Fe.value,
+            "onUpdate:modelValue": a[2] || (a[2] = (f) => Fe.value = f),
+            label: o(s)("report.tile.widget.icon.materialName"),
+            placeholder: o(s)("report.tile.widget.icon.materialPlaceholder")
+          }, null, 8, ["modelValue", "label", "placeholder"])) : A.value && r.value ? (c(), T(g, {
+            key: 3,
+            modelValue: Fe.value,
+            "onUpdate:modelValue": a[3] || (a[3] = (f) => Fe.value = f),
+            label: o(s)("report.tile.widget.icon.customSvg"),
+            placeholder: o(s)("report.tile.widget.icon.customPlaceholder")
+          }, null, 8, ["modelValue", "label", "placeholder"])) : M("", !0),
+          A.value && r.value ? (c(), T(m, {
+            key: 4,
+            modelValue: r.value.tabIconSize,
+            "onUpdate:modelValue": a[4] || (a[4] = (f) => r.value.tabIconSize = f),
+            label: o(s)("report.tile.widget.icon.size"),
+            items: P
+          }, null, 8, ["modelValue", "label"])) : M("", !0),
+          !A.value && r.value ? (c(), T(Le, {
+            key: 5,
+            "is-open": !1
+          }, {
+            header: _(() => [
+              v("p", Fl, B(o(s)("report.editor.groupDetails")), 1),
+              a[23] || (a[23] = v("div", { class: "grow" }, null, -1))
+            ]),
+            content: _(() => [
+              v("div", xl, [
+                i(t, {
+                  modelValue: r.value.title,
+                  "onUpdate:modelValue": a[5] || (a[5] = (f) => r.value.title = f),
+                  label: o(s)("report.editor.groupTitle"),
+                  placeholder: o(s)("report.editor.groupTitlePlaceholder")
+                }, null, 8, ["modelValue", "label", "placeholder"]),
+                i(g, {
+                  modelValue: r.value.description,
+                  "onUpdate:modelValue": a[6] || (a[6] = (f) => r.value.description = f),
+                  placeholder: o(s)("report.editor.groupDescriptionPlaceholder")
+                }, {
+                  label: _(() => [
+                    v("p", Vl, B(o(s)("report.editor.groupDescription")), 1),
+                    v("p", Cl, " (" + B(o(s)("report.editor.optional")) + ") ", 1)
+                  ]),
+                  _: 1
+                }, 8, ["modelValue", "placeholder"]),
+                v("div", kl, [
+                  v("p", Tl, B(o(s)("report.editor.typography")), 1),
+                  v("div", Sl, [
+                    i(V, {
+                      modelValue: ve.value,
+                      "onUpdate:modelValue": a[7] || (a[7] = (f) => ve.value = f),
+                      modelModifiers: { number: !0 },
+                      class: "w-full",
+                      label: o(s)("report.editor.titleSize"),
+                      max: 24,
+                      min: 1,
+                      type: "number",
+                      onBlur: a[8] || (a[8] = (f) => $e(r.value, "titleFontSize"))
+                    }, null, 8, ["modelValue", "label"]),
+                    v("div", $l, [
+                      v("p", Dl, B(o(s)("report.editor.titleFormatting")), 1),
+                      v("div", Ol, [
+                        i(e, {
+                          "append-icon": "format_bold",
+                          "model-value": r.value.titleBold ?? !0,
+                          variant: "tertiary",
+                          "icon-color": r.value.titleBold ?? !0 ? "neutral-gray-400" : "neutral-gray-300",
+                          "bg-color": r.value.titleBold ?? !0 ? "neutral-gray-100" : "neutral-white",
+                          class: "rounded-sm",
+                          title: o(s)("report.editor.bold"),
+                          onClick: a[9] || (a[9] = (f) => r.value.titleBold = !(r.value.titleBold ?? !0))
+                        }, null, 8, ["model-value", "icon-color", "bg-color", "title"]),
+                        i(e, {
+                          "append-icon": "format_italic",
+                          "model-value": r.value.titleItalic ?? !1,
+                          variant: "tertiary",
+                          "icon-color": r.value.titleItalic ? "neutral-gray-400" : "neutral-gray-300",
+                          "bg-color": r.value.titleItalic ? "neutral-gray-100" : "neutral-white",
+                          class: "rounded-sm",
+                          title: o(s)("report.editor.italic"),
+                          onClick: a[10] || (a[10] = (f) => r.value.titleItalic = !r.value.titleItalic)
+                        }, null, 8, ["model-value", "icon-color", "bg-color", "title"]),
+                        i(e, {
+                          "append-icon": "format_underlined",
+                          "model-value": r.value.titleUnderline ?? !1,
+                          variant: "tertiary",
+                          "icon-color": r.value.titleUnderline ? "neutral-gray-400" : "neutral-gray-300",
+                          "bg-color": r.value.titleUnderline ? "neutral-gray-100" : "neutral-white",
+                          class: "rounded-sm",
+                          title: o(s)("report.editor.underline"),
+                          onClick: a[11] || (a[11] = (f) => r.value.titleUnderline = !r.value.titleUnderline)
+                        }, null, 8, ["model-value", "icon-color", "bg-color", "title"])
+                      ])
+                    ])
+                  ]),
+                  v("div", Il, [
+                    i(V, {
+                      modelValue: fe.value,
+                      "onUpdate:modelValue": a[12] || (a[12] = (f) => fe.value = f),
+                      modelModifiers: { number: !0 },
+                      class: "w-full",
+                      label: o(s)("report.editor.descriptionSize"),
+                      max: 24,
+                      min: 1,
+                      type: "number",
+                      onBlur: a[13] || (a[13] = (f) => $e(r.value, "descriptionFontSize"))
+                    }, null, 8, ["modelValue", "label"]),
+                    v("div", Ul, [
+                      v("p", Bl, B(o(s)("report.editor.descriptionFormatting")), 1),
+                      v("div", Nl, [
+                        i(e, {
+                          "append-icon": "format_bold",
+                          "model-value": r.value.descriptionBold ?? !1,
+                          variant: "tertiary",
+                          "icon-color": r.value.descriptionBold ? "neutral-gray-400" : "neutral-gray-300",
+                          "bg-color": r.value.descriptionBold ? "neutral-gray-100" : "neutral-white",
+                          class: "rounded-sm",
+                          title: o(s)("report.editor.bold"),
+                          onClick: a[14] || (a[14] = (f) => r.value.descriptionBold = !r.value.descriptionBold)
+                        }, null, 8, ["model-value", "icon-color", "bg-color", "title"]),
+                        i(e, {
+                          "append-icon": "format_italic",
+                          "model-value": r.value.descriptionItalic ?? !1,
+                          variant: "tertiary",
+                          "icon-color": r.value.descriptionItalic ? "neutral-gray-400" : "neutral-gray-300",
+                          "bg-color": r.value.descriptionItalic ? "neutral-gray-100" : "neutral-white",
+                          class: "rounded-sm",
+                          title: o(s)("report.editor.italic"),
+                          onClick: a[15] || (a[15] = (f) => r.value.descriptionItalic = !r.value.descriptionItalic)
+                        }, null, 8, ["model-value", "icon-color", "bg-color", "title"]),
+                        i(e, {
+                          "append-icon": "format_underlined",
+                          "model-value": r.value.descriptionUnderline ?? !1,
+                          variant: "tertiary",
+                          "icon-color": r.value.descriptionUnderline ? "neutral-gray-400" : "neutral-gray-300",
+                          "bg-color": r.value.descriptionUnderline ? "neutral-gray-100" : "neutral-white",
+                          class: "rounded-sm",
+                          title: o(s)("report.editor.underline"),
+                          onClick: a[16] || (a[16] = (f) => r.value.descriptionUnderline = !r.value.descriptionUnderline)
+                        }, null, 8, ["model-value", "icon-color", "bg-color", "title"])
+                      ])
+                    ])
+                  ])
+                ])
+              ])
+            ]),
+            _: 1
+          })) : M("", !0),
+          !A.value && r.value ? (c(), T(t, {
+            key: 6,
+            modelValue: r.value.size.width,
+            "onUpdate:modelValue": a[17] || (a[17] = (f) => r.value.size.width = f),
+            modelModifiers: { number: !0 },
+            type: "number",
+            label: o(s)("report.editor.width"),
+            onBlur: a[18] || (a[18] = (f) => Se(r.value))
+          }, null, 8, ["modelValue", "label"])) : M("", !0),
+          !A.value && r.value ? (c(), T(t, {
+            key: 7,
+            modelValue: r.value.size.height,
+            "onUpdate:modelValue": a[19] || (a[19] = (f) => r.value.size.height = f),
+            modelModifiers: { number: !0 },
+            type: "number",
+            label: o(s)("report.editor.height"),
+            onBlur: a[20] || (a[20] = (f) => Ue(r.value))
+          }, null, 8, ["modelValue", "label"])) : M("", !0)
+        ])),
+        k.value.length === 0 ? (c(), R("div", Ml, B(o(s)("report.editor.emptyLevel")), 1)) : (c(), T(H, { key: 2 }, {
+          default: _(() => [
+            i(o(bt), {
+              list: k.value,
+              "item-key": "id",
+              class: "flex flex-col gap-2 cursor-grab",
+              handle: ".handle"
+            }, {
+              item: _(({ element: f, index: u }) => [
+                v("div", {
+                  class: Pe(["flex items-center gap-8 px-12 py-8 border rounded-md border-neutral-300 hover:bg-fm-color-opacity-sm", f.widget ? "cursor-grab" : "cursor-pointer"]),
+                  onClick: (l) => le(f)
+                }, [
+                  i(D, {
+                    name: "drag_handle",
+                    class: "handle shrink-0 !cursor-grab"
+                  }),
+                  v("p", {
+                    class: "flex-1 min-w-0 truncate text-left fm-typo-en-body-lg-400",
+                    title: de(f, u)
+                  }, [
+                    Ge(B(de(f, u)) + " ", 1),
+                    f.widget ? M("", !0) : (c(), R("span", ql, " · " + B(E(f)), 1))
+                  ], 8, zl),
+                  f.widget ? M("", !0) : (c(), T(D, {
+                    key: 0,
+                    name: "chevron_right",
+                    class: "shrink-0"
+                  })),
+                  i(W, {
+                    trigger: "click",
+                    shift: !0,
+                    "stop-click-propagation": !0,
+                    class: "shrink-0"
+                  }, {
+                    "menu-button": _(() => [
+                      i(e, {
+                        "append-icon": "more_vert",
+                        variant: "tertiary"
+                      })
+                    ]),
+                    default: _(() => [
+                      f.widget ? (c(), T(I, {
+                        key: 0,
+                        label: o(s)("report.common.edit"),
+                        onClick: (l) => J(f, u)
+                      }, null, 8, ["label", "onClick"])) : M("", !0),
+                      f.tab ? M("", !0) : (c(), T(I, {
+                        key: 1,
+                        label: o(s)("report.editor.moveTo"),
+                        onClick: (l) => Me(f)
+                      }, null, 8, ["label", "onClick"])),
+                      i(I, {
+                        label: o(s)("report.common.duplicate"),
+                        onClick: (l) => pe(f, u)
+                      }, null, 8, ["label", "onClick"]),
+                      i(I, {
+                        onClick: (l) => be(f, u)
+                      }, {
+                        label: _(() => [
+                          v("p", Pl, B(o(s)("report.common.remove")), 1)
+                        ]),
+                        _: 2
+                      }, 1032, ["onClick"])
+                    ]),
+                    _: 2
+                  }, 1024)
+                ], 10, Rl)
+              ]),
+              _: 1
+            }, 8, ["list"])
+          ]),
+          _: 1
+        })),
+        ce.value ? (c(), T(e, {
+          key: 3,
+          label: o(s)("report.editor.addTab"),
+          variant: "secondary",
+          icon: "add",
+          "icon-position": "prepend",
+          "border-color": o(Ce).ColorPrimary,
+          "text-color": o(Ce).ColorPrimary,
+          onClick: K
+        }, null, 8, ["label", "border-color", "text-color"])) : (c(), T(W, {
+          key: 4,
+          trigger: "click",
+          shift: !0
+        }, {
+          "menu-button": _(() => [
+            i(e, {
+              label: o(s)("report.common.add"),
+              variant: "secondary",
+              icon: "add",
+              "icon-position": "prepend",
+              class: "w-full",
+              "border-color": o(Ce).ColorPrimary,
+              "text-color": o(Ce).ColorPrimary
+            }, null, 8, ["label", "border-color", "text-color"])
+          ]),
+          default: _(() => [
+            i(I, {
+              label: o(s)("report.editor.addWidget"),
+              onClick: a[21] || (a[21] = (f) => y("add-widget", Y.value))
+            }, null, 8, ["label"]),
+            x.value ? (c(), T(I, {
+              key: 0,
+              label: o(s)("report.editor.addGroup"),
+              onClick: _e
+            }, null, 8, ["label"])) : M("", !0),
+            X.value ? (c(), T(I, {
+              key: 1,
+              label: o(s)("report.editor.addTabGroup"),
+              onClick: ae
+            }, null, 8, ["label"])) : M("", !0)
+          ]),
+          _: 1
+        })),
+        i(me, {
+          modelValue: xe.value,
+          "onUpdate:modelValue": a[22] || (a[22] = (f) => xe.value = f),
+          overlay: !0,
+          "z-index": 10
+        }, {
+          "dialog-header": _(() => [
+            Ge(B(o(s)("report.editor.moveTo")), 1)
+          ]),
+          default: _(() => [
+            i(H, null, {
+              default: _(() => [
+                (c(!0), R(he, null, qe(Be.value, (f) => (c(), T(Z, {
+                  key: f.parentId ?? "root",
+                  onClick: (u) => re(f)
+                }, {
+                  default: _(() => [
+                    v("p", El, B(f.label), 1)
+                  ]),
+                  _: 2
+                }, 1032, ["onClick"]))), 128))
+              ]),
+              _: 1
+            })
+          ]),
+          _: 1
+        }, 8, ["modelValue"])
+      ]);
+    };
+  }
+}), Gl = { class: "flex flex-col gap-24 top-0 bg-fm-color-neutral-white z-10" }, Wl = { class: "flex flex-col gap-24 top-0 bg-fm-color-neutral-white z-10" }, Al = { class: "flex items-center gap-8" }, Hl = {
+  key: 2,
+  class: "flex flex-col gap-8 rounded-md border border-fm-color-border px-16 py-12"
+}, jl = { class: "fm-typo-en-body-sm-400" }, Jl = { class: "fm-typo-en-body-sm-400 font-bold" }, Kl = { class: "space-y-1 fm-typo-en-body-sm-400 text-fm-color-typo-secondary" }, Ql = { class: "flex flex-col gap-24 top-0 bg-fm-color-neutral-white z-10" }, Yl = { class: "flex items-center gap-1 max-w-[195px] w-[195px]" }, Xl = { class: "line-clamp-2 overflow-hidden max-w-[195px] w-[195px]" }, pt = /* @__PURE__ */ we({
+  __name: "ReportEditorTab",
+  props: /* @__PURE__ */ ke({
+    hideConfiguration: {
+      type: Boolean,
+      default: !1
+    }
+  }, {
+    modelValue: { required: !0 },
+    modelModifiers: {}
+  }),
+  emits: /* @__PURE__ */ ke(["hideConfiguration"], ["update:modelValue"]),
+  setup(z, { emit: p }) {
+    const d = Te(z, "modelValue"), { breakpoints: y } = Je(), s = z, h = p, P = rt(), Q = nt(), S = L(), {
+      currentSelectWidgetType: F,
+      categories: U,
+      editingTile: ee,
+      editingTileIndex: q,
+      editingGlobalFilter: r,
+      editingGlobalFilterIndex: O
+    } = ze(at()), { schemas: k } = ze(Gt()), { globalFilters: Y } = ze(ut()), { getGlobalFilterLabel: ne } = ut(), { promptMessage: ce } = it(), A = L(!1), j = L(!1), { t: x, te: X, locale: le } = Ee(), oe = L(void 0), se = b(() => {
+      const u = Xe(d.value.tiles).flatMap((l) => {
+        var ie;
+        const $ = l.widget.config.schemaNames ?? [], w = ((ie = l.widget.config.joinDatasources) == null ? void 0 : ie.flatMap((Ae) => Ae.schemaNames ?? [])) ?? [];
+        return [...$, ...w];
+      });
+      return [...new Set(u)].reduce((l, $) => {
+        const w = k.value.find((ie) => ie.name === $);
+        return w && l.push(w), l;
+      }, []);
+    }), ue = L(null);
+    function de(u) {
+      ue.value = u, j.value = !0;
+    }
+    ge(
+      () => F.value,
+      () => {
+        F.value !== void 0 && (oe.value = Yt(F.value), ee.value = oe.value, q.value = -1, yt.value = ue.value, P.push({
+          name: "tileEditor",
+          query: Q.query
+        }));
+      },
+      { immediate: !0 }
+    ), ge(
+      () => d.value.tiles,
+      (u) => {
+        Wt(u);
+      },
+      { immediate: !0, deep: !0 }
+    );
+    const E = [
+      {
+        label: "report.common.edit",
+        selected: !1,
+        variant: "tertiary",
+        onClick: (u) => {
+          var l;
+          O.value = u, r.value = JSON.parse(JSON.stringify((l = d.value.globalFilters) == null ? void 0 : l[u])), A.value = !0;
+        }
+      },
+      {
+        label: "report.common.duplicate",
+        selected: !1,
+        variant: "tertiary",
+        onClick: (u) => {
+          var w;
+          const l = (w = d.value.globalFilters) == null ? void 0 : w[u];
+          if (!l) return;
+          const $ = JSON.parse(JSON.stringify(l));
+          d.value.globalFilters || (d.value.globalFilters = []), d.value.globalFilters.push($);
+        }
+      },
+      {
+        label: "report.common.remove",
+        selected: !1,
+        variant: "destructive",
+        onClick: async (u) => {
+          var w, ie;
+          const l = (w = d.value.globalFilters) == null ? void 0 : w[u];
+          if (!l) return;
+          await ce({
+            title: x("report.editor.deleteWidget"),
+            message: x("report.editor.deleteWidgetConfirm", {
+              title: ne(l)
+            })
+          }) && ((ie = d.value.globalFilters) == null || ie.splice(u, 1));
+        }
+      }
+    ], G = b(() => U.value.map((u) => ({
+      label: x(`report.category.${u.name}`),
+      value: u.id
+    }))), { sessionUser: J } = Xt(), pe = b(
+      () => {
+        var u, l, $, w;
+        return ((l = (u = J.value) == null ? void 0 : u.role) == null ? void 0 : l.isAdmin) === !0 || ((w = ($ = J.value) == null ? void 0 : $.role) == null ? void 0 : w.isStaff) === !0;
+      }
+    ), be = b({
+      get: () => d.value.queryVersion === "v2",
+      set: (u) => {
+        d.value.queryVersion = u ? "v2" : "v1", u ? d.value.queryDatasource = d.value.queryDatasource ?? je.Postgres : d.value.queryDatasource = void 0;
+      }
+    }), K = [
+      { label: x("report.common.postgresql"), value: je.Postgres },
+      { label: x("report.common.bigquery"), value: je.BigQuery }
+    ], _e = [
+      { label: x("report.common.noBatch"), value: "none" },
+      { label: x("report.common.days"), value: "days" },
+      { label: x("report.common.locations"), value: "locations" }
+    ], ae = b({
+      get: () => {
+        var u, l;
+        return (u = d.value.batch) != null && u.days ? "days" : (l = d.value.batch) != null && l.locations ? "locations" : "none";
+      },
+      set: (u) => {
+        var l, $;
+        u === "none" ? d.value.batch = void 0 : u === "days" ? d.value.batch = { days: ((l = d.value.batch) == null ? void 0 : l.days) || 1 } : u === "locations" && (d.value.batch = { locations: (($ = d.value.batch) == null ? void 0 : $.locations) || 10 });
+      }
+    }), Se = b({
+      get: () => {
+        var u, l;
+        if (ae.value === "days") return ((u = d.value.batch) == null ? void 0 : u.days) ?? 1;
+        if (ae.value === "locations") return ((l = d.value.batch) == null ? void 0 : l.locations) ?? 1;
+      },
+      set: (u) => {
+        u && (ae.value === "days" ? d.value.batch = { days: u } : ae.value === "locations" && (d.value.batch = { locations: u }));
+      }
+    }), Ue = b({
+      get: () => We(x, X, d.value.name, "other"),
+      set: (u) => {
+        d.value.name = u;
+      }
+    }), { country: $e } = ze(Zt()), {
+      dateRange: ve,
+      compareDateRange: fe,
+      timeRange: ye,
+      selectedLocationIds: Fe,
+      businessDataVersion: xe,
+      restaurants: De,
+      warehouses: Be
+    } = ze(el()), Ne = b(
+      () => d.value.queryVersion === "v2" && d.value.queryDatasource === je.BigQuery
+    ), Me = b(() => Ne.value && pe.value), re = L(null), n = L(!1), a = b(() => {
+      const u = ve.value.startDate ?? ve.value.endDate;
+      return u ? {
+        startDate: u,
+        endDate: u
+      } : ve.value;
+    }), e = b(() => {
+      const u = fe.value.startDate ?? fe.value.endDate;
+      return u ? {
+        startDate: u,
+        endDate: u
+      } : fe.value;
+    }), t = b(() => {
+      const u = d.value.batch;
+      if (!u) return 1;
+      if (u.locations) {
+        const l = De.value.length + Be.value.length;
+        return Math.max(1, Math.ceil(l / u.locations));
+      }
+      return 1;
+    }), m = b(() => {
+      if (re.value == null || re.value === 0) return null;
+      const u = re.value * t.value;
+      return mt(u, $e.value);
+    }), g = b(() => re.value == null || re.value === 0 ? null : mt(re.value, $e.value)), V = b(() => m.value ? ct(m.value.amount, m.value.symbol) : ""), D = b(() => g.value ? ct(g.value.amount, g.value.symbol) : ""), I = b(() => t.value === 1 ? x("report.common.estimatedCostBatchSingular") : x("report.common.estimatedCostBatchPlural")), W = b(() => n.value ? "..." : !V.value || !D.value ? "--" : x("report.common.estimatedCostFormula", {
+      batchCount: t.value,
+      batchLabel: I.value,
+      baseCost: D.value,
+      totalCost: V.value
+    }));
+    let H = [];
+    const Z = tl(async () => {
+      if (!Me.value) return;
+      const u = Xe(d.value.tiles).filter(
+        (l) => {
+          var $;
+          return (($ = l.widget.config.schemaNames) == null ? void 0 : $.length) > 0;
+        }
+      );
+      if (u.length === 0) {
+        re.value = null;
+        return;
+      }
+      n.value = !0, H.forEach((l) => l.abort()), H = [];
+      try {
+        const l = await Promise.all(
+          u.map(($) => {
+            const w = new AbortController();
+            return H.push(w), At({
+              widget: $.widget,
+              signal: w.signal,
+              tileId: $.id,
+              scopedDateRange: a.value,
+              scopedCompareDateRange: e.value
+            });
+          })
+        );
+        re.value = l.reduce(($, w) => $ + (w.totalBytesProcessed ?? 0), 0);
+      } catch (l) {
+        l.code !== "ERR_CANCELED" && (re.value = null);
+      } finally {
+        n.value = !1;
+      }
+    }, 1e3);
+    ge(
+      [
+        () => d.value.tiles,
+        () => d.value.queryVersion,
+        () => d.value.queryDatasource,
+        () => d.value.batch,
+        () => ve.value,
+        () => ye.value,
+        () => fe.value,
+        () => Fe.value,
+        () => xe.value
+      ],
+      () => {
+        Z();
+      },
+      { deep: !0 }
+    ), ft(() => {
+      Z();
+    }), St(() => {
+      H.forEach((u) => u.abort());
+    });
+    function me(u) {
+      var l;
+      return !((l = u.tileIds) != null && l.length);
+    }
+    function f(u) {
+      return !se.value.find((l) => l.name === u.schemaName);
+    }
+    return ge(
+      () => d.value.globalFilters,
+      (u) => {
+        Y.value = JSON.parse(JSON.stringify(u || []));
+      },
+      { deep: !0, immediate: !0 }
+    ), (u, l) => {
+      const $ = C("FmTextField"), w = C("FmSelect"), ie = C("FmSwitch"), Ae = C("FmButton"), Ke = C("FmIcon"), Qe = C("FmTooltip"), _t = C("FmMenuItem"), Ft = C("FmMenu"), xt = C("FmListItem"), Vt = C("FmList"), Ct = C("FmForm");
+      return c(), T($t(o(y).lg || o(y).md ? al : rl), {
+        "model-value": s.hideConfiguration,
+        "onUpdate:modelValue": l[12] || (l[12] = (N) => h("hideConfiguration", N))
+      }, {
+        default: _(() => [
+          i(pl, {
+            "is-open": A.value,
+            "onUpdate:isOpen": l[0] || (l[0] = (N) => A.value = N),
+            "global-filter": o(r),
+            tiles: o(Xe)(d.value.tiles),
+            schemas: se.value,
+            "onUpdate:globalFilter": l[1] || (l[1] = (N) => {
+              N && (d.value.globalFilters || (d.value.globalFilters = []), typeof o(O) == "number" && o(O) >= 0 ? d.value.globalFilters[o(O)] = N : d.value.globalFilters.push(N));
+            })
+          }, null, 8, ["is-open", "global-filter", "tiles", "schemas"]),
+          i(ll, {
+            modelValue: o(F),
+            "onUpdate:modelValue": l[2] || (l[2] = (N) => gt(F) ? F.value = N : null),
+            "is-open": j.value,
+            "onUpdate:isOpen": l[3] || (l[3] = (N) => j.value = N)
+          }, null, 8, ["modelValue", "is-open"]),
+          i(Ct, {
+            ref_key: "form",
+            ref: S,
+            class: "px-6 py-16 flex flex-col gap-24 overflow-y-auto overflow-x-hidden"
+          }, {
+            default: _(() => [
+              i(Le, { class: "border-solid" }, {
+                header: _(() => [
+                  v("p", null, B(o(x)("report.editor.reportInfo")), 1),
+                  l[13] || (l[13] = v("div", { class: "grow" }, null, -1))
+                ]),
+                content: _(() => [
+                  v("div", Gl, [
+                    i($, {
+                      modelValue: Ue.value,
+                      "onUpdate:modelValue": l[4] || (l[4] = (N) => Ue.value = N),
+                      label: o(x)("report.common.name"),
+                      placeholder: o(x)("report.common.name")
+                    }, null, 8, ["modelValue", "label", "placeholder"]),
+                    (c(), T(w, {
+                      key: `category-${o(le)}`,
+                      modelValue: d.value.category,
+                      "onUpdate:modelValue": l[5] || (l[5] = (N) => d.value.category = N),
+                      label: o(x)("report.common.category"),
+                      items: G.value
+                    }, null, 8, ["modelValue", "label", "items"])),
+                    i($, {
+                      modelValue: d.value.description,
+                      "onUpdate:modelValue": l[6] || (l[6] = (N) => d.value.description = N),
+                      label: o(x)("report.common.description"),
+                      placeholder: o(x)("report.common.description")
+                    }, null, 8, ["modelValue", "label", "placeholder"])
+                  ])
+                ]),
+                _: 1
+              }),
+              i(Le, {
+                class: "border-solid",
+                "is-open": !1
+              }, {
+                header: _(() => [
+                  v("p", null, B(o(x)("report.editor.advancedUsage")), 1),
+                  l[14] || (l[14] = v("div", { class: "grow" }, null, -1))
+                ]),
+                content: _(() => [
+                  v("div", Wl, [
+                    v("div", Al, [
+                      l[15] || (l[15] = v("span", { class: "fm-typo-en-body-sm-400 text-fm-color-typo-secondary" }, "V2", -1)),
+                      i(ie, {
+                        modelValue: be.value,
+                        "onUpdate:modelValue": l[7] || (l[7] = (N) => be.value = N)
+                      }, null, 8, ["modelValue"])
+                    ]),
+                    be.value && pe.value ? (c(), T(w, {
+                      key: 0,
+                      modelValue: d.value.queryDatasource,
+                      "onUpdate:modelValue": l[8] || (l[8] = (N) => d.value.queryDatasource = N),
+                      label: o(x)("report.common.queryDatasource"),
+                      items: K
+                    }, null, 8, ["modelValue", "label"])) : M("", !0),
+                    i(w, {
+                      modelValue: ae.value,
+                      "onUpdate:modelValue": l[9] || (l[9] = (N) => ae.value = N),
+                      label: o(x)("report.common.batch"),
+                      items: _e
+                    }, null, 8, ["modelValue", "label"]),
+                    ae.value !== "none" ? (c(), T($, {
+                      key: 1,
+                      modelValue: Se.value,
+                      "onUpdate:modelValue": l[10] || (l[10] = (N) => Se.value = N),
+                      modelModifiers: { number: !0 },
+                      label: ae.value === "days" ? o(x)("report.common.days") : o(x)("report.common.locations"),
+                      type: "number"
+                    }, null, 8, ["modelValue", "label"])) : M("", !0),
+                    Me.value ? (c(), R("div", Hl, [
+                      v("span", jl, B(o(x)("report.common.estimatedBqCost")), 1),
+                      v("p", Jl, B(W.value), 1),
+                      v("div", Kl, [
+                        v("div", null, "* " + B(o(x)("report.common.estimatedCostGuidelineBigQuery")), 1),
+                        v("div", null, "* " + B(o(x)("report.common.estimatedCostGuidelineDateRange")), 1),
+                        v("div", null, "* " + B(o(x)("report.common.estimatedCostGuidelineLocationBatch")), 1)
+                      ])
+                    ])) : M("", !0)
+                  ])
+                ]),
+                _: 1
+              }),
+              i(Le, {
+                class: "border-solid",
+                "is-open": !1
+              }, {
+                header: _(() => [
+                  v("p", null, B(o(x)("report.section.filter.globalFilter")), 1),
+                  l[16] || (l[16] = v("div", { class: "grow" }, null, -1))
+                ]),
+                content: _(() => [
+                  v("div", Ql, [
+                    i(Ae, {
+                      label: o(x)("report.section.filter.addGlobalFilter"),
+                      variant: "secondary",
+                      icon: "add",
+                      "icon-position": "prepend",
+                      "border-color": o(Ce).ColorPrimary,
+                      "text-color": o(Ce).ColorPrimary,
+                      onClick: l[11] || (l[11] = () => {
+                        O.value = null, r.value = null, A.value = !0;
+                      })
+                    }, null, 8, ["label", "border-color", "text-color"]),
+                    i(Vt, null, {
+                      default: _(() => [
+                        i(o(bt), {
+                          list: d.value.globalFilters,
+                          "item-key": "`${element.schemaName}-${element.name}`",
+                          class: "flex flex-col gap-2 cursor-grab",
+                          handle: ".handle"
+                        }, {
+                          item: _(({ element: N, index: kt }) => [
+                            i(xt, { class: "!cursor-grab border rounded-md border-neutral-300" }, {
+                              default: _(() => [
+                                i(Ke, {
+                                  name: "drag_handle",
+                                  class: "handle"
+                                }),
+                                v("div", Yl, [
+                                  i(Qe, {
+                                    "z-index": 99,
+                                    content: o(ne)(N),
+                                    class: "handle"
+                                  }, {
+                                    default: _(() => [
+                                      v("p", Xl, B(o(ne)(N)), 1)
+                                    ]),
+                                    _: 2
+                                  }, 1032, ["content"]),
+                                  f(N) ? (c(), T(Qe, {
+                                    key: 0,
+                                    content: o(x)("report.section.filter.missingSchema"),
+                                    "z-index": 99
+                                  }, {
+                                    default: _(() => [
+                                      i(Ke, {
+                                        name: "warning",
+                                        class: "text-fm-color-system-error-300"
+                                      })
+                                    ]),
+                                    _: 1
+                                  }, 8, ["content"])) : me(N) ? (c(), T(Qe, {
+                                    key: 1,
+                                    content: o(x)("report.section.filter.missingTileIds"),
+                                    "z-index": 99
+                                  }, {
+                                    default: _(() => [
+                                      i(Ke, {
+                                        name: "warning",
+                                        class: "text-fm-color-system-warning-300"
+                                      })
+                                    ]),
+                                    _: 1
+                                  }, 8, ["content"])) : M("", !0)
+                                ]),
+                                l[17] || (l[17] = v("div", { class: "grow" }, null, -1)),
+                                i(Ft, {
+                                  trigger: "click",
+                                  shift: !0,
+                                  "stop-click-propagation": !0
+                                }, {
+                                  "menu-button": _(() => [
+                                    i(Ae, {
+                                      "append-icon": "more_vert",
+                                      variant: "tertiary"
+                                    })
+                                  ]),
+                                  default: _(() => [
+                                    (c(), R(he, null, qe(E, (Ye, Tt) => i(_t, {
+                                      key: Tt,
+                                      onClick: (fo) => Ye.onClick(kt)
+                                    }, {
+                                      label: _(() => [
+                                        v("p", {
+                                          class: Pe(
+                                            Ye.variant === "destructive" ? " text-fm-color-system-error-300" : ""
+                                          )
+                                        }, B(o(x)(Ye.label)), 3)
+                                      ]),
+                                      _: 2
+                                    }, 1032, ["onClick"])), 64))
+                                  ]),
+                                  _: 2
+                                }, 1024)
+                              ]),
+                              _: 2
+                            }, 1024)
+                          ]),
+                          _: 1
+                        }, 8, ["list"])
+                      ]),
+                      _: 1
+                    })
+                  ])
+                ]),
+                _: 1
+              }),
+              i(Le, { class: "border-solid" }, {
+                header: _(() => [
+                  v("p", null, B(o(x)("report.editor.widgets")), 1),
+                  l[18] || (l[18] = v("div", { class: "grow" }, null, -1))
+                ]),
+                content: _(() => [
+                  i(Ll, {
+                    report: d.value,
+                    onAddWidget: de
+                  }, null, 8, ["report"])
+                ]),
+                _: 1
+              })
+            ]),
+            _: 1
+          }, 512)
+        ]),
+        _: 1
+      }, 8, ["model-value"]);
+    };
+  }
+}), Zl = { class: "h-full w-full overflow-x-hidden" }, eo = { class: "flex flex-col bg-fm-color-neutral-white w-[400px]" }, to = { class: "flex bg-fm-color-neutral-white w-[88px]" }, lo = {
+  key: 1,
+  class: "w-full overflow-y-auto"
+}, oo = {
+  key: 0,
+  class: "w-full grid grid-cols-12 gap-[24px] p-24"
+}, ao = { class: "col-span-12 mb-4 flex flex-wrap gap-2 pb-2" }, ro = { key: 2 }, no = {
+  key: 0,
+  class: "grid grid-cols-12 gap-[16px]"
+}, io = { class: "col-span-12 mb-4 flex flex-wrap gap-2 pb-2" }, so = {
+  key: 3,
+  class: "h-full w-full flex items-start justify-center bg-fm-color-neutral-white py-24",
+  style: { backgroundColor: "#F6F8FC" }
+}, uo = {
+  key: 0,
+  class: "w-full grid grid-cols-12 gap-[24px] p-24"
+}, mo = /* @__PURE__ */ we({
+  __name: "ReportEditorViewport",
+  props: /* @__PURE__ */ ke({
+    hideConfiguration: { type: Boolean, required: !1, default: !1 },
+    previewWidth: { type: Number, required: !0 },
+    previewHeight: { type: Number, required: !0 },
+    previewScale: { type: Number, required: !0 }
+  }, {
+    modelValue: { required: !0, default: () => {
+    } },
+    modelModifiers: {}
+  }),
+  emits: /* @__PURE__ */ ke(["hideConfiguration"], ["update:modelValue"]),
+  setup(z, { emit: p }) {
+    const { breakpoints: d } = Je(), y = Te(z, "modelValue"), s = b(() => {
+      var F;
+      return Ht((F = y.value) == null ? void 0 : F.tiles);
+    }), h = z, P = b(() => h.previewWidth > 0 && h.previewHeight > 0), Q = b(() => d.value.sm || d.value.xs), S = p;
+    return (F, U) => {
+      const ee = C("FmCircularProgress"), q = C("FmButton"), r = C("FmMenuDivider"), O = C("FmCard");
+      return c(), R("div", Zl, [
+        y.value ? (c(), R(he, { key: 1 }, [
+          P.value ? M("", !0) : (c(), T(Bt, {
+            key: 0,
+            "model-value": !h.hideConfiguration
+          }, {
+            right: _(() => [
+              v("div", eo, [
+                y.value ? (c(), T(pt, {
+                  key: 0,
+                  modelValue: y.value,
+                  "onUpdate:modelValue": U[0] || (U[0] = (k) => y.value = k),
+                  "hide-configuration": h.hideConfiguration,
+                  onHideConfiguration: U[1] || (U[1] = (k) => S("hideConfiguration", k))
+                }, null, 8, ["modelValue", "hide-configuration"])) : M("", !0)
+              ])
+            ]),
+            left: _(() => [
+              v("div", to, [
+                i(q, {
+                  variant: "secondary",
+                  icon: "keyboard_double_arrow_right",
+                  "border-color": o(Ce).ColorPrimary,
+                  "text-color": o(Ce).ColorPrimary,
+                  class: "m-24 my-16",
+                  size: "md",
+                  onClick: U[2] || (U[2] = (k) => S("hideConfiguration", !h.hideConfiguration))
+                }, null, 8, ["border-color", "text-color"])
+              ])
+            ]),
+            _: 1
+          }, 8, ["model-value"])),
+          i(r, {
+            vertical: "",
+            style: { margin: "0px" }
+          }),
+          !Q.value && !P.value ? (c(), R("div", lo, [
+            y.value.tiles.length > 0 ? (c(), R("div", oo, [
+              v("div", ao, [
+                i(dt)
+              ]),
+              i(Ze, {
+                tiles: y.value.tiles,
+                "report-id": y.value.id || "editing",
+                "leaf-index-by-id": s.value,
+                "hide-export": !0
+              }, null, 8, ["tiles", "report-id", "leaf-index-by-id"])
+            ])) : (c(), T(tt, { key: 1 }))
+          ])) : Q.value && !P.value ? (c(), R("div", ro, [
+            i(O, { class: "px-5 pb-28" }, {
+              default: _(() => [
+                y.value.tiles.length > 0 ? (c(), R("div", no, [
+                  v("div", io, [
+                    i(dt)
+                  ]),
+                  i(Ze, {
+                    tiles: y.value.tiles,
+                    "report-id": y.value.id || "editing",
+                    "leaf-index-by-id": s.value,
+                    "hide-export": !0
+                  }, null, 8, ["tiles", "report-id", "leaf-index-by-id"])
+                ])) : (c(), T(tt, { key: 1 }))
+              ]),
+              _: 1
+            }),
+            y.value ? (c(), T(pt, {
+              key: 0,
+              modelValue: y.value,
+              "onUpdate:modelValue": U[3] || (U[3] = (k) => y.value = k),
+              "hide-configuration": h.hideConfiguration,
+              onHideConfiguration: U[4] || (U[4] = (k) => {
+                S("hideConfiguration", k);
+              })
+            }, null, 8, ["modelValue", "hide-configuration"])) : M("", !0)
+          ])) : (c(), R("div", so, [
+            v("div", {
+              style: lt({
+                transformOrigin: "top center",
+                transform: `scale(${h.previewScale})`
+              })
+            }, [
+              v("div", {
+                class: "overflow-y-auto bg-white rounded-lg",
+                style: lt({
+                  width: h.previewWidth + "px",
+                  height: h.previewHeight + "px"
+                })
+              }, [
+                y.value.tiles.length > 0 ? (c(), R("div", uo, [
+                  i(Ze, {
+                    tiles: y.value.tiles,
+                    "report-id": y.value.id || "editing",
+                    "leaf-index-by-id": s.value,
+                    "hide-export": !0,
+                    "custom-screen-width": h.previewWidth
+                  }, null, 8, ["tiles", "report-id", "leaf-index-by-id", "custom-screen-width"])
+                ])) : (c(), T(tt, { key: 1 }))
+              ], 4)
+            ], 4)
+          ]))
+        ], 64)) : (c(), T(ee, { key: 0 }))
+      ]);
+    };
+  }
+}), co = { class: "flex items-center gap-4" }, po = { class: "flex justify-center items-center gap-2 w-full" }, vo = { class: "flex gap-4" }, Oo = /* @__PURE__ */ we({
+  __name: "ReportEditor",
+  setup(z) {
+    const p = rt(), d = nt(), y = at(), { promptLoader: s } = Jt(), { t: h, te: P } = Ee(), { currentReport: Q, editingReport: S } = ze(y), { breakpoints: F } = Je(), U = b(() => {
+      var E;
+      return !((E = S.value) != null && E.editable);
+    }), ee = b(() => {
+      var E;
+      return ((E = S.value) == null ? void 0 : E.name) ?? h("report.editor.newReport");
+    }), q = b(() => We(h, P, ee.value, "other")), r = wt(), { promptMessage: O } = it(), k = L(!1), Y = b(() => [
+      { label: h("report.common.cancel"), value: "cancel", isPrimary: !1 },
+      { label: h("report.common.save"), value: "save", isPrimary: !0, prependIcon: "download" }
+    ]);
+    async function ne() {
+      if (!S.value || S.value.tiles.length === 0) {
+        r.open({ message: h("report.messages.noWidget"), type: "error" });
+        return;
+      }
+      if (jt(S.value.tiles) > ht) {
+        r.open({ message: h("report.messages.tooDeepNesting"), type: "error" });
+        return;
+      }
+      const E = U.value ? h("report.common.clone") : h("report.common.save");
+      if (await O({
+        title: `${h("report.messages.saveReport")}`,
+        message: h("report.messages.confirmAction", { action: E, name: q.value })
+      }))
+        try {
+          await s(async () => {
+            if (U.value) {
+              const J = JSON.parse(JSON.stringify(S.value));
+              J.editable = !0, J.id = "", J.name = `${J.name} ${h("report.common.duplicate")}`, J.isDefault = !1, await y.createOrUpdateReport(J);
+            } else
+              S.value && await y.createOrUpdateReport(S.value);
+            p.push({
+              name: "reportView",
+              query: d.query
+            });
+          });
+        } catch (J) {
+          console.log(J), r.open({
+            message: h("report.messages.failedToAction", { action: E }),
+            type: "error"
+          });
+        }
+    }
+    async function ce() {
+      var G;
+      if (!S.value) return;
+      await O({
+        title: h("report.common.report", 1),
+        message: h("report.editor.notSaved", { name: (G = S.value) == null ? void 0 : G.name })
+      }) && (S.value = JSON.parse(JSON.stringify(Q.value)), p.back());
+    }
+    ft(() => {
+      S.value || p.push({ name: "reports" });
+    });
+    const A = [
+      {
+        labelKey: "report.common.default",
+        width: void 0,
+        height: void 0
+      },
+      {
+        labelKey: "report.editor.devices.desktop",
+        width: 1920,
+        height: 1080
+      },
+      {
+        labelKey: "report.editor.devices.tablet",
+        width: 820,
+        height: 1180
+      },
+      {
+        labelKey: "report.editor.devices.phone",
+        width: 390,
+        height: 859
+      }
+    ], j = L(A[0]), x = L(!1), X = b(() => x.value ? Math.max(j.value.width || 0, j.value.height || 0) : Math.min(j.value.width || 0, j.value.height || 0)), le = b(() => x.value ? Math.min(j.value.width || 0, j.value.height || 0) : Math.max(j.value.width || 0, j.value.height || 0)), oe = b(() => window.innerHeight - 72 - 56), se = b(() => {
+      if (!X.value) return 1;
+      let E = (oe.value - 48) / X.value, G = le.value * E;
+      return G > window.innerWidth && (E = window.innerWidth / le.value, G = le.value * E), E > 1 ? 1 : E;
+    });
+    function ue(E) {
+      j.value = E;
+    }
+    function de() {
+      x.value = !x.value;
+    }
+    return (E, G) => {
+      const J = C("FmTooltip"), pe = C("FmButton"), be = C("FmPageHead");
+      return c(), T(Nt, null, {
+        default: _(() => [
+          i(be, {
+            "data-editor-header": "true",
+            actions: Y.value,
+            "onClick:action": G[0] || (G[0] = (K) => {
+              K === "cancel" && ce(), K === "save" && ne();
+            })
+          }, {
+            title: _(() => [
+              v("div", co, [
+                i(J, {
+                  content: q.value,
+                  placement: "bottom"
+                }, {
+                  default: _(() => [
+                    v("p", {
+                      class: Pe(`${o(F).sm || o(F).xs ? "hidden" : ""} text-ellipsis overflow-hidden text-nowrap fm-typo-en-title-md-600 w-[250px]`)
+                    }, B(q.value), 3)
+                  ]),
+                  _: 1
+                }, 8, ["content"]),
+                v("div", po, [
+                  v("div", vo, [
+                    (c(), R(he, null, qe(A, (K) => {
+                      var _e;
+                      return i(pe, {
+                        key: K.labelKey,
+                        label: o(h)(K.labelKey),
+                        variant: ((_e = j.value) == null ? void 0 : _e.labelKey) === K.labelKey ? "primary" : "secondary",
+                        size: "md",
+                        onClick: (ae) => ue(K)
+                      }, null, 8, ["label", "variant", "onClick"]);
+                    }), 64))
+                  ]),
+                  i(pe, {
+                    icon: "screen_rotation",
+                    variant: "tertiary",
+                    size: "md",
+                    class: "text-fm-color-typo-primary",
+                    onClick: de
+                  })
+                ])
+              ])
+            ]),
+            _: 1
+          }, 8, ["actions"]),
+          o(S) ? (c(), T(mo, {
+            key: 0,
+            modelValue: o(S),
+            "onUpdate:modelValue": G[1] || (G[1] = (K) => gt(S) ? S.value = K : null),
+            style: lt({ height: oe.value + "px" }),
+            class: Pe(o(F).lg || o(F).md ? "flex" : ""),
+            "hide-configuration": k.value,
+            "preview-width": le.value,
+            "preview-height": X.value,
+            "preview-scale": se.value,
+            onHideConfiguration: G[2] || (G[2] = (K) => k.value = K)
+          }, null, 8, ["modelValue", "style", "class", "hide-configuration", "preview-width", "preview-height", "preview-scale"])) : M("", !0)
+        ]),
+        _: 1
+      });
+    };
+  }
+});
+export {
+  Oo as default
+};