@feedmepos/mf-report 5.27.40 → 5.27.41

package/dist/ReportEditor-BLn7-0ar.js

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