@feedmepos/mf-report 5.27.54 → 5.28.0

package/dist/{OverviewView-BtGpQkBY.js → OverviewView-BkIozvMs.js}

@@ -1,11 +1,11 @@
 import { defineComponent as g, computed as s, resolveComponent as w, createBlock as l, openBlock as i, withCtx as y, createVNode as p, createElementVNode as c, unref as e, normalizeStyle as k, normalizeClass as b } from "vue";
-import { _ as h } from "./TilePageStack.vue_vue_type_script_setup_true_lang-B4g3YPzM.js";
-import { u as I, l as $ } from "./GlobalFilterSelect.vue_vue_type_script_setup_true_lang-CVShUWJC.js";
-import { _ as C } from "./Default.vue_vue_type_script_setup_true_lang-BwPZXC_d.js";
+import { _ as h } from "./TilePageStack.vue_vue_type_script_setup_true_lang-CzggUdfI.js";
+import { u as I, l as $ } from "./report-DjGDWvm3.js";
+import { _ as C } from "./Default.vue_vue_type_script_setup_true_lang-WGOOX2b8.js";
 import { storeToRefs as B } from "pinia";
-import { _ as z } from "./SelectComponent.vue_vue_type_script_setup_true_lang-Ckn2p74A.js";
+import { _ as z } from "./SelectComponent.vue_vue_type_script_setup_true_lang-DW7Dk7iQ.js";
 import { useBreakpoints as P } from "@feedmepos/ui-library";
-import { _ as R } from "./MenuTab.vue_vue_type_script_setup_true_lang-BUvD1_b0.js";
+import { _ as R } from "./MenuTab.vue_vue_type_script_setup_true_lang-nOukNXp3.js";
 import { useI18n as S } from "@feedmepos/mf-common";
 import { r as V } from "./i18n-DbyciK4x.js";
 const D = { class: "sticky top-0 z-10 bg-white" }, K = /* @__PURE__ */ g({

package/dist/{Report-CJ9myNLK.js → Report-HiSGRNhn.js}

@@ -1,28 +1,28 @@
-import { defineComponent as Ie, ref as Q, watch as de, computed as h, h as d, withModifiers as Fe, resolveComponent as x, createBlock as W, openBlock as J, withCtx as m, createVNode as i, createElementVNode as g, unref as e, normalizeStyle as Oe, normalizeClass as y, withDirectives as fe, createElementBlock as Pe, Fragment as Le, renderList as Ne, toDisplayString as _, createTextVNode as Ve, vShow as ye } from "vue";
+import { defineComponent as Ie, ref as Q, watch as de, computed as h, h as d, withModifiers as Fe, resolveComponent as x, createBlock as W, openBlock as T, withCtx as m, createVNode as i, createElementVNode as g, unref as e, normalizeStyle as Oe, normalizeClass as y, withDirectives as fe, createElementBlock as Pe, Fragment as Le, renderList as Ne, toDisplayString as _, createTextVNode as Ve, vShow as ye } from "vue";
 import { storeToRefs as ve } from "pinia";
-import { u as Ae } from "./GlobalFilterSelect.vue_vue_type_script_setup_true_lang-CVShUWJC.js";
-import { _ as Je } from "./Default.vue_vue_type_script_setup_true_lang-BwPZXC_d.js";
-import { u as ze } from "./message-dialog-UoMWOnil.js";
-import { a as Be } from "./_plugin-vue_export-helper-kkiiQoKl.js";
-import { useSnackbar as Te, useBreakpoints as Ue, components as Ee, FmButtonColorThemeVariant as Ke } from "@feedmepos/ui-library";
-import { _ as Me } from "./SelectComponent.vue_vue_type_script_setup_true_lang-Ckn2p74A.js";
-import { c as Ye, a as ge, h as qe } from "./app-BAgs-zHf.js";
+import { u as Ae } from "./report-DjGDWvm3.js";
+import { _ as Te } from "./Default.vue_vue_type_script_setup_true_lang-WGOOX2b8.js";
+import { u as Je } from "./message-dialog-UoMWOnil.js";
+import { u as ze } from "./global-loader-BuxFfehu.js";
+import { useSnackbar as Be, useBreakpoints as Ue, components as Ee, FmButtonColorThemeVariant as Ke } from "@feedmepos/ui-library";
+import { _ as Me } from "./SelectComponent.vue_vue_type_script_setup_true_lang-DW7Dk7iQ.js";
+import { c as Ye, a as ge, h as qe } from "./app-Bjt_JuJi.js";
 import { useRouter as je, useRoute as Ge, onBeforeRouteLeave as He } from "vue-router";
 import { useI18n as Qe } from "@feedmepos/mf-common";
 import { r as X } from "./i18n-DbyciK4x.js";
 const We = { class: "fm-typo-en-body-md-400 text-fm-color-typo-secondary" }, Xe = { class: "w-[343px]" }, Ze = { class: "fm-typo-en-body-md-600" }, dt = /* @__PURE__ */ Ie({
   __name: "Report",
   setup(et) {
-    const { t: a, te: z } = Qe(), Z = je(), ee = Ge(), f = Ae(), be = Ye(), { business: we } = ve(ge()), {
+    const { t: a, te: J } = Qe(), Z = je(), ee = Ge(), f = Ae(), be = Ye(), { business: we } = ve(ge()), {
       reports: p,
-      overviewReport: B,
+      overviewReport: z,
       categories: $,
       pinReport: I,
       isOpenAddReportDialog: Re,
       scrollPositionY: te,
       customReportQuota: F,
       canCreateCustomReport: oe
-    } = ve(f), { promptMessage: ae } = ze(), { promptLoader: T } = Be(), c = Te(), { breakpoints: u } = Ue(), { canRead: re, canUpdate: ne, canDuplicate: se, canDelete: U, canCreateReport: he } = qe(), b = Q();
+    } = ve(f), { promptMessage: ae } = Je(), { promptLoader: B } = ze(), c = Be(), { breakpoints: u } = Ue(), { canRead: re, canUpdate: ne, canDuplicate: se, canDelete: U, canCreateReport: he } = qe(), b = Q();
     He(() => {
       b.value && (te.value = b.value.$el.children[0].scrollTop);
     }), de(b, () => {
@@ -53,7 +53,7 @@ const We = { class: "fm-typo-en-body-md-400 text-fm-color-typo-secondary" }, Xe
       ...E.value.map((t) => {
         const r = $.value.find((l) => l.id === t.category);
         return {
-          name: X(a, z, t.name, "other"),
+          name: X(a, J, t.name, "other"),
           categoryId: (r == null ? void 0 : r.id) ?? "",
           category: r != null && r.name ? a(`report.category.${r.name}`) : a("report.common.uncategorized"),
           reportId: t.id,
@@ -61,13 +61,14 @@ const We = { class: "fm-typo-en-body-md-400 text-fm-color-typo-secondary" }, Xe
           description: t.description || "",
           pin: !0,
           canUpdate: ne(t),
-          canRead: re(t)
+          canRead: re(t),
+          reportType: t.reportType
         };
       }),
       ...le.value.map((t) => {
         const r = $.value.find((l) => l.id === t.category);
         return {
-          name: X(a, z, t.name, "other"),
+          name: X(a, J, t.name, "other"),
           categoryId: (r == null ? void 0 : r.id) ?? "",
           category: r != null && r.name ? a(`report.category.${r.name}`) : a("report.common.uncategorized"),
           reportId: t.id,
@@ -75,7 +76,8 @@ const We = { class: "fm-typo-en-body-md-400 text-fm-color-typo-secondary" }, Xe
           description: t.description || "",
           pin: !1,
           canUpdate: ne(t),
-          canRead: re(t)
+          canRead: re(t),
+          reportType: t.reportType
         };
       })
     ].filter((t) => O.value.value && t.categoryId !== O.value.value ? !1 : `${(t == null ? void 0 : t.name) || ""}${(t == null ? void 0 : t.description) || ""}`.toLowerCase().indexOf(q.value.toLowerCase()) !== -1)), Se = h(
@@ -133,7 +135,7 @@ const We = { class: "fm-typo-en-body-md-400 text-fm-color-typo-secondary" }, Xe
         },
         cell: (o) => {
           var w;
-          const t = o.row.original, r = t.reportId, l = p.value.find((s) => s.id === r), H = r === ((w = B.value) == null ? void 0 : w.id), V = !t.canRead, D = l ? se(l) : !1, A = l ? U(l) : !1, n = [
+          const t = o.row.original, r = t.reportId, l = p.value.find((s) => s.id === r), H = r === ((w = z.value) == null ? void 0 : w.id), V = !t.canRead, D = l ? se(l) : !1, A = l ? U(l) : !1, n = [
             {
               label: a("report.common.duplicate"),
               onClick: () => {
@@ -239,10 +241,10 @@ const We = { class: "fm-typo-en-body-md-400 text-fm-color-typo-secondary" }, Xe
       }
     ]);
     async function ie(o) {
-      await T(async () => {
+      await B(async () => {
         var t;
         try {
-          const r = o.id === ((t = B.value) == null ? void 0 : t.id);
+          const r = o.id === ((t = z.value) == null ? void 0 : t.id);
           await f.updateDefaultReport(r ? null : o.id), c.open({
             message: `Successfully ${r ? "unset" : "set"} ${o.name} as Overview`,
             type: "success"
@@ -261,7 +263,7 @@ const We = { class: "fm-typo-en-body-md-400 text-fm-color-typo-secondary" }, Xe
         })
       })) {
         const r = JSON.parse(JSON.stringify(o));
-        r.editable = !0, r.id = "", r.name = `${r.name} ${a("report.common.duplicate")}`, r.isDefault = !1, T(async () => {
+        r.editable = !0, r.id = "", r.name = `${r.name} ${a("report.common.duplicate")}`, r.isDefault = !1, B(async () => {
           try {
             await f.createOrUpdateReport(r), c.open({
               message: `${a("report.messages.duplicateSuccess", { name: r.name })}`,
@@ -292,7 +294,7 @@ const We = { class: "fm-typo-en-body-md-400 text-fm-color-typo-secondary" }, Xe
       await ae({
         title: a("report.messages.deleteReport"),
         message: a("report.messages.confirmDelete", { name: o.name })
-      }) && T(async () => {
+      }) && B(async () => {
         try {
           await f.removeReport(o), c.open({
             message: a("report.messages.deleteSuccess", { name: o.name }),
@@ -333,7 +335,7 @@ const We = { class: "fm-typo-en-body-md-400 text-fm-color-typo-secondary" }, Xe
       }
     }
     function pe(o) {
-      const t = X(a, z, o.name, "other") ?? "";
+      const t = X(a, J, o.name, "other") ?? "";
       I.value && I.value.includes(o.id) ? (c.open({
         message: `${a("report.common.unpin")} ${t} ${a("report.common.successful")}`,
         type: "success"
@@ -348,7 +350,7 @@ const We = { class: "fm-typo-en-body-md-400 text-fm-color-typo-secondary" }, Xe
     const { selectedLocationIds: k, dateRange: P, compareDateRange: L, timeRange: v, locations: $e } = ge(), N = h(() => k.length === $e.length);
     return (o, t) => {
       const r = x("FmPageHead"), l = x("FmSearch"), H = x("FmForm"), V = x("FmListItem"), D = x("FmList"), A = x("FmTable");
-      return J(), W(Je, null, {
+      return T(), W(Te, null, {
         default: m(() => [
           i(r, {
             title: e(a)("report.common.report", 1),
@@ -382,7 +384,7 @@ const We = { class: "fm-typo-en-body-md-400 text-fm-color-typo-secondary" }, Xe
                     })
                   ]),
                   default: m(() => [
-                    (J(!0), Pe(Le, null, Ne(ce.value, (n, w) => (J(), W(e(C), {
+                    (T(!0), Pe(Le, null, Ne(ce.value, (n, w) => (T(), W(e(C), {
                       key: w,
                       label: e(a)(`report.category.${n.label}`),
                       onClick: () => _e(n)
@@ -406,7 +408,7 @@ const We = { class: "fm-typo-en-body-md-400 text-fm-color-typo-secondary" }, Xe
               ]),
               _: 1
             }, 8, ["class"]),
-            fe((J(), W(A, {
+            fe((T(), W(A, {
               key: Se.value,
               ref_key: "table",
               ref: b,
@@ -524,7 +526,7 @@ const We = { class: "fm-typo-en-body-md-400 text-fm-color-typo-secondary" }, Xe
                               }, null, 8, ["label", "disabled", "class", "onClick"]),
                               i(e(C), {
                                 label: e(a)(
-                                  n.reportId === ((w = e(B)) == null ? void 0 : w.id) ? "report.common.unsetAsOverview" : "report.common.setAsOverview"
+                                  n.reportId === ((w = e(z)) == null ? void 0 : w.id) ? "report.common.unsetAsOverview" : "report.common.setAsOverview"
                                 ),
                                 onClick: () => {
                                   const s = e(p).find(

package/dist/ReportCanvasView-ILVhB1KL.js

@@ -0,0 +1,448 @@
+import { ref as N, shallowRef as ne, onMounted as G, onBeforeUnmount as oe, defineComponent as re, watch as L, computed as ae, createElementBlock as U, openBlock as A, createElementVNode as V, createCommentVNode as J, withDirectives as se, createVNode as F, unref as C, isRef as H, withCtx as ie, toDisplayString as Y, vShow as ue } from "vue";
+import { useRoute as ce } from "vue-router";
+import { u as le } from "./_plugin-vue_export-helper-C6QDExPN.js";
+import { storeToRefs as x } from "pinia";
+import { _ as de } from "./LocationSelect.vue_vue_type_script_setup_true_lang-DC9QYJk-.js";
+import { D as fe } from "./DateRangeSelect-CRsKMi0U.js";
+import { F as B, r as j, u as W, a as X, a0 as me } from "./app-Bjt_JuJi.js";
+function K(o) {
+  const { businessId: c } = x(W());
+  if (!c.value) throw new Error("Business Id is not defined");
+  return `/${c.value}/report-canvas/${o}`;
+}
+const pe = (o) => {
+  const c = {
+    fetchType: B.Get,
+    url: K(o)
+  };
+  return j.fetch(c);
+}, ve = (o, c, l, s) => {
+  const p = {
+    fetchType: B.Post,
+    url: `${K(o)}/query/${c}`,
+    data: { params: l, timezone: s }
+  };
+  return j.fetch(p);
+}, ye = (o, c, l) => {
+  const s = {
+    fetchType: B.Post,
+    url: `${K(o)}/section/${c}/ack`,
+    data: l
+  };
+  return j.fetch(s);
+}, he = ["@from", "@to", "@locationIds", "@timezone"], we = ["@from", "@to", "@locationIds"], ge = 1, Se = 1500;
+function Re(o) {
+  if (!(!(o instanceof me) || o.status !== 429))
+    return Math.min(Math.max(o.retryAfterMs ?? Se, 500), 5e3);
+}
+const be = {
+  MY: "MYR",
+  SG: "SGD",
+  TH: "THB",
+  ID: "IDR",
+  PH: "PHP",
+  VN: "VND",
+  BN: "BND",
+  KH: "KHR",
+  MM: "MMK",
+  AE: "AED",
+  MO: "MOP",
+  MV: "MVR",
+  AU: "AUD",
+  JP: "JPY",
+  TW: "TWD",
+  HK: "HKD"
+};
+function q(o) {
+  return o == null ? !0 : Array.isArray(o) ? o.length === 0 : o === "";
+}
+function _e(o) {
+  const c = X(), { dateRange: l, selectedLocationIds: s, locations: p, timezone: v } = x(c), { country: _ } = x(W()), r = N({}), i = ne({}), R = N([]), I = [], g = {}, y = {};
+  function O(e) {
+    I.push(e);
+  }
+  function k(e) {
+    i.value = { ...i.value, [e.queryId]: e }, I.forEach((n) => n(e));
+  }
+  function T(e) {
+    const n = {};
+    for (const m of e.params)
+      n[m.name] = m.default ?? null;
+    n["@from"] = l.value.startDate ?? null, n["@to"] = l.value.endDate ?? null, n["@timezone"] = v.value, n["@locationIds"] = s.value.length ? [...s.value] : p.value.map((m) => m.id), r.value = n;
+  }
+  function a() {
+    return {
+      locations: p.value.map((e) => ({
+        id: e.id,
+        name: e.name || e.id,
+        code: e.code
+      })),
+      timezone: v.value,
+      locale: navigator.language || "en-US",
+      currency: be[(_.value || "").toUpperCase()] ?? ""
+    };
+  }
+  function h(e) {
+    return JSON.stringify(e.dependsOn.map((n) => r.value[n] ?? null));
+  }
+  function S(e) {
+    return !!e.lazy && e.dependsOn.some((n) => q(r.value[n] ?? null));
+  }
+  function D() {
+    return !we.some((e) => e in r.value && q(r.value[e] ?? null));
+  }
+  async function E(e) {
+    var m;
+    const n = (g[e.id] ?? 0) + 1;
+    g[e.id] = n, k({
+      queryId: e.id,
+      runId: n,
+      status: "loading",
+      rows: ((m = i.value[e.id]) == null ? void 0 : m.rows) ?? [],
+      truncated: !1
+    });
+    for (let b = 0; ; b++)
+      try {
+        const w = await ve(
+          o,
+          e.id,
+          r.value,
+          v.value
+        );
+        if (g[e.id] !== n) return;
+        k({
+          queryId: e.id,
+          runId: n,
+          status: "ok",
+          rows: w.rows ?? [],
+          truncated: !!w.truncated
+        });
+        return;
+      } catch (w) {
+        if (g[e.id] !== n) return;
+        const f = Re(w);
+        if (f !== void 0 && b < ge) {
+          if (await new Promise((u) => setTimeout(u, f)), g[e.id] !== n) return;
+          continue;
+        }
+        k({
+          queryId: e.id,
+          runId: n,
+          status: "error",
+          rows: [],
+          truncated: !1,
+          error: w instanceof Error ? w.message : String(w)
+        });
+        return;
+      }
+  }
+  function M(e = {}) {
+    var m, b, w;
+    const n = !D();
+    for (const f of R.value) {
+      if (S(f)) {
+        delete y[f.id], ((m = i.value[f.id]) == null ? void 0 : m.status) !== "idle" && k({
+          queryId: f.id,
+          runId: g[f.id] ?? 0,
+          status: "idle",
+          rows: [],
+          truncated: !1
+        });
+        continue;
+      }
+      if (n) {
+        ((b = i.value[f.id]) == null ? void 0 : b.status) !== "loading" && k({
+          queryId: f.id,
+          runId: g[f.id] ?? 0,
+          status: "loading",
+          rows: ((w = i.value[f.id]) == null ? void 0 : w.rows) ?? [],
+          truncated: !1
+        });
+        continue;
+      }
+      const u = h(f);
+      !e.force && y[f.id] === u || (y[f.id] = u, E(f));
+    }
+  }
+  function P(e) {
+    const n = { ...r.value };
+    let m = !1;
+    for (const [b, w] of Object.entries(e))
+      b in n && JSON.stringify(n[b] ?? null) !== JSON.stringify(w ?? null) && (n[b] = w, m = !0);
+    return m ? (r.value = n, M(), !0) : !1;
+  }
+  function t(e) {
+    R.value = e.queries, i.value = {};
+    for (const n of Object.keys(g)) delete g[n];
+    for (const n of Object.keys(y)) delete y[n];
+    T(e), M();
+  }
+  function d(e, n = []) {
+    R.value = e.queries;
+    const m = JSON.stringify(r.value), b = {};
+    for (const u of e.params)
+      b[u.name] = u.name in r.value ? r.value[u.name] : u.default ?? null;
+    r.value = b;
+    const w = new Set(e.queries.map((u) => u.id));
+    for (const u of Object.keys(g)) w.has(u) || delete g[u];
+    for (const u of Object.keys(y)) w.has(u) || delete y[u];
+    const f = Object.keys(i.value).filter((u) => !w.has(u));
+    if (f.length) {
+      const u = { ...i.value };
+      for (const te of f) delete u[te];
+      i.value = u;
+    }
+    for (const u of n) delete y[u];
+    return M(), JSON.stringify(r.value) !== m;
+  }
+  return {
+    params: r,
+    results: i,
+    queries: R,
+    env: a,
+    load: t,
+    applyCanvas: d,
+    run: M,
+    setParams: P,
+    onResult: O,
+    RESERVED: he
+  };
+}
+function Z(o) {
+  const c = o.replace(/^\//, "");
+  try {
+    const l = new URL(import.meta.url);
+    if (typeof location < "u" && location.hostname !== l.hostname)
+      return new URL(c, l).href;
+  } catch {
+  }
+  return `${"/".replace(/\/$/, "")}/${c}`;
+}
+const ee = {
+  "chart.js@4": "chart.js-4.js",
+  "fm-ui@1": "fm-ui-1.js"
+}, $ = /* @__PURE__ */ new Map();
+function Ee(o) {
+  return Z(`report-canvas-libs/${ee[o]}`);
+}
+async function z(o) {
+  const c = [...new Set(o)].filter((s) => ee[s]), l = {};
+  return await Promise.all(
+    c.map(async (s) => {
+      if (!$.has(s)) {
+        const v = await fetch(Ee(s));
+        if (!v.ok) return;
+        $.set(s, await v.text());
+      }
+      const p = $.get(s);
+      p && (l[s] = p);
+    })
+  ), l;
+}
+const Ie = Z("report-canvas-frame.html"), Q = 8e3;
+function ke(o, c) {
+  const l = N(!1);
+  let s = null;
+  const p = /* @__PURE__ */ new Map();
+  let v;
+  const _ = /* @__PURE__ */ new Map();
+  function r() {
+    var t;
+    return ((t = o.value) == null ? void 0 : t.contentWindow) ?? null;
+  }
+  function i(t) {
+    var d;
+    (d = r()) == null || d.postMessage(JSON.parse(JSON.stringify(t)), "*");
+  }
+  function R(t) {
+    const d = r();
+    if (!d || t.source !== d) return;
+    const e = t.data;
+    if (!(!e || typeof e != "object"))
+      switch (e.type) {
+        case "ready":
+          if (l.value) return;
+          v = e.nonce, l.value = !0, s == null || s(), s = null, D();
+          break;
+        case "setParams":
+          c.onSetParams(e.values ?? {});
+          break;
+        case "rendered":
+          if (!I(e)) return;
+          y(e.sectionId, e.version), c.onSectionRendered(e.sectionId, e.version);
+          break;
+        case "error":
+          if (!I(e)) return;
+          y(e.sectionId, e.version), c.onSectionError(e.sectionId, e.version, e.message);
+          break;
+      }
+  }
+  function I(t) {
+    return !v || t.nonce === v ? !0 : (console.warn("[report-canvas] dropped a render outcome without the shell nonce"), !1);
+  }
+  function g(t, d) {
+    return `${t}@${d}`;
+  }
+  function y(t, d) {
+    if (d === void 0) return;
+    const e = g(t, d), n = _.get(e);
+    n !== void 0 && (clearTimeout(n), _.delete(e));
+  }
+  function O() {
+    _.forEach((t) => clearTimeout(t)), _.clear();
+  }
+  function k(t) {
+    for (const d of t) {
+      const e = g(d.id, d.version);
+      _.has(e) || _.set(
+        e,
+        setTimeout(() => {
+          _.delete(e), c.onSectionError(
+            d.id,
+            d.version,
+            `the section did not report a render within ${Q}ms`
+          );
+        }, Q)
+      );
+    }
+  }
+  async function T(t, d, e) {
+    const n = await z(t.flatMap((b) => b.libs ?? [])), m = () => {
+      i({ type: "init", sections: t, params: d, libs: n, env: e }), O(), k(t);
+    };
+    l.value ? m() : s = m;
+  }
+  async function a(t) {
+    const d = await z(t.flatMap((e) => e.libs ?? []));
+    i({ type: "sections", sections: t, libs: d }), k(t);
+  }
+  function h(t) {
+    i({ type: "params", values: t });
+  }
+  function S(t) {
+    i({ type: "env", env: t });
+  }
+  function D() {
+    const t = [...p.values()];
+    p.clear(), t.forEach(E);
+  }
+  function E(t) {
+    i({
+      type: "rows",
+      queryId: t.queryId,
+      runId: t.runId,
+      rows: t.rows,
+      status: t.status,
+      truncated: t.truncated,
+      error: t.error
+    });
+  }
+  function M(t) {
+    if (!l.value) {
+      p.set(t.queryId, t);
+      return;
+    }
+    E(t);
+  }
+  G(() => window.addEventListener("message", R)), oe(() => {
+    window.removeEventListener("message", R), O();
+  });
+  function P() {
+    l.value = !1, s = null, v = void 0, p.clear(), O();
+  }
+  return { ready: l, init: T, swapSections: a, pushParams: h, pushEnv: S, pushRows: M, reset: P };
+}
+const Me = { class: "flex h-full min-h-0 w-full" }, Oe = { class: "flex min-w-0 grow flex-col" }, Pe = { class: "flex items-start overflow-x-auto border-b border-fm-color-border-secondary px-16 py-8 scrollbar-hide" }, Ce = {
+  key: 0,
+  class: "fm-typo-en-body-xs-400 border-b border-fm-color-border-secondary bg-fm-color-system-warning-100 px-16 py-8"
+}, Ne = {
+  key: 1,
+  class: "fm-typo-en-body-sm-400 p-16 text-fm-color-typo-error"
+}, Te = ["src", "title"], je = /* @__PURE__ */ re({
+  __name: "ReportCanvasView",
+  setup(o) {
+    const c = ce(), { t: l } = le(), s = String(c.query.reportId ?? ""), p = N(), v = N(""), _ = N(), r = _e(s), { dateRange: i, selectedLocationIds: R, locations: I, timezone: g } = x(X()), y = ke(_, {
+      onSetParams: (a) => {
+        r.setParams(a) && y.pushParams(r.params.value);
+      },
+      onSectionRendered: (a, h) => void O(a, h, "ok"),
+      onSectionError: (a, h, S) => {
+        console.warn("[report-canvas] section failed", { reportId: s, sectionId: a, message: S }), O(a, h, "error", S);
+      }
+    });
+    r.onResult((a) => y.pushRows(a));
+    async function O(a, h, S, D) {
+      var P;
+      const E = (P = p.value) == null ? void 0 : P.sections.find((t) => t.id === a);
+      if (!E || h !== E.version) return;
+      const M = S === "error" ? D ?? "the section failed to render" : void 0;
+      if (!(E.status === S && E.error === M)) {
+        E.status = S, E.error = M;
+        try {
+          await ye(s, a, { version: h, status: S, error: M });
+        } catch (t) {
+          console.warn("[report-canvas] ack failed", { reportId: s, sectionId: a, err: t });
+        }
+      }
+    }
+    async function k() {
+      try {
+        v.value = "";
+        const a = await pe(s);
+        p.value = a, r.load(a), await y.init(a.sections, r.params.value, r.env());
+      } catch (a) {
+        v.value = a instanceof Error ? a.message : String(a);
+      }
+    }
+    L([i, R, I], () => {
+      if (!p.value) return;
+      r.setParams({
+        "@from": i.value.startDate ?? null,
+        "@to": i.value.endDate ?? null,
+        "@locationIds": R.value.length ? [...R.value] : I.value.map((h) => h.id)
+      }) && y.pushParams(r.params.value);
+    }), L([I, g], () => {
+      p.value && y.pushEnv(r.env());
+    });
+    const T = ae(
+      () => Object.values(r.results.value).some((a) => a.truncated)
+    );
+    return G(async () => {
+      await k();
+    }), (a, h) => (A(), U("div", Me, [
+      V("div", Oe, [
+        V("div", Pe, [
+          F(de, {
+            modelValue: C(R),
+            "onUpdate:modelValue": h[1] || (h[1] = (S) => H(R) ? R.value = S : null),
+            options: C(I)
+          }, {
+            default: ie(() => [
+              F(fe, {
+                "date-range": C(i),
+                "onUpdate:dateRange": h[0] || (h[0] = (S) => H(i) ? i.value = S : null)
+              }, null, 8, ["date-range"])
+            ]),
+            _: 1
+          }, 8, ["modelValue", "options"])
+        ]),
+        T.value ? (A(), U("div", Ce, Y(C(l)("reportV5.reportCanvas.canvas.truncated")), 1)) : J("", !0),
+        v.value ? (A(), U("p", Ne, Y(v.value), 1)) : J("", !0),
+        se(V("iframe", {
+          ref_key: "frame",
+          ref: _,
+          "data-testid": "report-canvas-frame",
+          class: "min-h-0 grow border-0",
+          src: C(Ie),
+          sandbox: "allow-scripts",
+          title: C(l)("reportV5.reportCanvas.canvas.title")
+        }, null, 8, Te), [
+          [ue, !v.value]
+        ])
+      ])
+    ]));
+  }
+});
+export {
+  je as default
+};