@feedmepos/mf-report 5.4.36 → 5.5.0-beta.1

package/dist/DynamicWidget.vue_vue_type_script_setup_true_lang-C6n257cI.js

@@ -0,0 +1,1004 @@
+import { defineComponent as H, useModel as O, computed as s, ref as F, resolveComponent as w, createElementBlock as L, openBlock as h, Fragment as W, renderSlot as G, createVNode as S, createElementVNode as k, toDisplayString as Z, unref as j, withCtx as B, createBlock as $, createCommentVNode as K, normalizeClass as le, normalizeStyle as _e, h as ge, renderList as Ce, mergeModels as Ee, watch as ae, onMounted as ze, onUnmounted as We, resolveDynamicComponent as He, withDirectives as Oe, vShow as qe } from "vue";
+import { W as i, v as te, R as Ue, g as je, d as Ge, q as Je } from "./v4-BS8SFGqd.js";
+import { u as ie, b as xe, a as ue } from "./global-loader-BqFQzk46.js";
+import { d as be } from "./index-Cmh079Bh.js";
+import { storeToRefs as se } from "pinia";
+import { _ as Ke } from "./_plugin-vue_export-helper-CHgC5LLL.js";
+import { _ as ye } from "./NoData.vue_vue_type_script_setup_true_lang-DI4X_DSc.js";
+import { useBreakpoints as Qe, useSnackbar as Ze } from "@feedmepos/ui-library";
+var re = /* @__PURE__ */ ((t) => (t.line = "LINE", t.bar = "BAR", t))(re || {}), M = /* @__PURE__ */ ((t) => (t.top = "TOP", t.bottom = "BOTTOM", t))(M || {});
+i.Circular, i.Table, i.BarChart, i.LineChart, i.StackBarChart, i.StackLineChart, i.Scorecard, i.Spacer;
+const Xe = [
+  {
+    type: i.Circular,
+    showLabel: !1,
+    // TODO: temporarily removed show label as it has no function
+    showDrillDimension: !0,
+    showRollup: !1,
+    showSearchBar: !1
+  },
+  {
+    type: i.Table,
+    showLabel: !1,
+    showDrillDimension: !0,
+    showRollup: !0,
+    showSearchBar: !0
+  },
+  {
+    type: i.BarChart,
+    showLabel: !1,
+    // TODO: temporarily removed show label as it has no function
+    showDrillDimension: !0,
+    showRollup: !1,
+    showSearchBar: !1
+  },
+  {
+    type: i.LineChart,
+    showLabel: !1,
+    // TODO: temporarily removed show label as it has no function
+    showDrillDimension: !0,
+    showRollup: !0,
+    showSearchBar: !1
+  },
+  {
+    type: i.StackBarChart,
+    showLabel: !1,
+    // TODO: temporarily removed show label as it has no function
+    showDrillDimension: !0,
+    showRollup: !0,
+    showSearchBar: !1
+  },
+  {
+    type: i.StackLineChart,
+    showLabel: !1,
+    // TODO: temporarily removed show label as it has no function
+    showDrillDimension: !0,
+    showRollup: !0,
+    showSearchBar: !1
+  },
+  {
+    type: i.Scorecard,
+    showLabel: !1,
+    showDrillDimension: !1,
+    showRollup: !1,
+    showSearchBar: !1
+  },
+  {
+    type: i.Spacer,
+    showLabel: !1,
+    showDrillDimension: !1,
+    showRollup: !1,
+    showSearchBar: !1
+  }
+];
+function oe(t) {
+  const e = [t.schemaName, t.name];
+  return "option" in t && t.option && e.push(t.option), "aggregation" in t && t.aggregation && e.push(t.aggregation), e.push(t.label.replace(/[^a-zA-Z0-9]/g, "")), e.join("_").toLowerCase();
+}
+function Ye(t, e) {
+  switch (t) {
+    case i.BarChart:
+    case i.LineChart:
+    case i.StackBarChart:
+    case i.StackLineChart:
+      return Array.isArray(e == null ? void 0 : e.datasets) && Array.isArray(e == null ? void 0 : e.xAxis) && e.datasets.length > 0 && e.xAxis.length > 0;
+    case i.Table:
+      return Array.isArray(e == null ? void 0 : e.rows) && Array.isArray(e == null ? void 0 : e.columns) && e.rows.length > 0 && e.columns.length > 0;
+    case i.Circular:
+      return Array.isArray(e == null ? void 0 : e.datasets) && e.datasets.length > 0;
+    case i.Scorecard:
+      return !0;
+    case i.Spacer:
+      return !0;
+  }
+}
+const we = [
+  "54, 162, 235",
+  //8CE6D7
+  "0, 123, 167",
+  //007BA7
+  "255, 93, 83",
+  //FF5D53
+  "115, 200, 230",
+  //73C8E6
+  "252, 162, 62",
+  //FCA23E
+  "240, 155, 190",
+  //F09BBE
+  "255, 210, 50",
+  //FFD232
+  "80, 190, 155",
+  //50BE9B
+  "131, 88, 212",
+  //8358D4
+  "155, 80, 70"
+  //9B5046
+];
+function X({
+  index: t,
+  isCompare: e,
+  opacity: n
+}) {
+  let p = typeof n == "number" ? n : 1;
+  return e && (p = p * 0.6), `rgba(${we[t % we.length]}, ${p})`;
+}
+function ke(t, e, n) {
+  if (t === "" || e === "")
+    return null;
+  let p = (o) => o == null ? void 0 : o.replace(/,/g, "");
+  n === "ID" && (p = (o) => o == null ? void 0 : o.replace(/\./g, "").replace(/,/g, "."));
+  const g = Number(p(t)), v = Number(p(e));
+  if (isNaN(g) || isNaN(v))
+    return null;
+  let u = 0;
+  v === 0 ? g === 0 ? u = 0 : u = 1 : u = (g - v) / v;
+  const l = ea(u);
+  return {
+    value: isNaN(u) ? "" : `${(u * 100).toFixed(0)}%`,
+    icon: l
+  };
+}
+function ea(t) {
+  return t > 0 ? {
+    name: "moving",
+    color: "#1F7735",
+    tailwind: "fm-color-system-success-100"
+  } : t < 0 ? {
+    name: "trending_down",
+    color: "#99231D",
+    tailwind: "fm-color-system-error-100"
+  } : {
+    name: "equal",
+    color: "#C7C7CC",
+    tailwind: "fm-color-neutral-gray-100"
+  };
+}
+const aa = /* @__PURE__ */ H({
+  __name: "WidgetBarchart",
+  props: {
+    modelValue: { required: !0 },
+    modelModifiers: {}
+  },
+  emits: ["update:modelValue"],
+  setup(t) {
+    const e = O(t, "modelValue"), n = s(() => {
+      var o;
+      return ((o = e.value.data) == null ? void 0 : o.xAxis) ?? [];
+    }), p = s(() => {
+      var o;
+      return ((o = e.value.data) == null ? void 0 : o.datasets) ?? [];
+    }), g = s(() => e.value.isTransposed ?? void 0), v = s(() => e.value.showLabel ?? void 0), u = F(null), l = s(() => p.value.length > 0 ? [
+      ...p.value.map((o, m) => ({
+        label: o.name,
+        data: o.values,
+        dash: !!o.isCompare,
+        backgroundColor: X({ index: m, isCompare: o.isCompare })
+      }))
+    ] : []);
+    return (o, m) => {
+      const R = w("FmBarChart");
+      return h(), L(W, null, [
+        G(o.$slots, "menu"),
+        S(R, {
+          ref_key: "chartRef",
+          ref: u,
+          class: "bar-chart",
+          datasets: l.value,
+          "x-axis": { categories: n.value },
+          transpose: g.value,
+          legend: {
+            display: !1,
+            position: "bottom",
+            maxHeight: 54,
+            labels: {
+              usePointStyle: !0
+            }
+          },
+          datalabels: { display: v.value, align: "end", anchor: "end" },
+          "maintain-aspect-ratio": !1
+        }, null, 8, ["datasets", "x-axis", "transpose", "datalabels"])
+      ], 64);
+    };
+  }
+}), ta = /* @__PURE__ */ H({
+  __name: "WidgetCircular",
+  props: {
+    modelValue: { required: !0 },
+    modelModifiers: {}
+  },
+  emits: ["update:modelValue"],
+  setup(t) {
+    const e = O(t, "modelValue"), n = s(() => e.value.showLabel ?? void 0), p = s(() => {
+      let g = [];
+      return e.value.data.datasets && e.value.data.metrics && e.value.data.datasets.length > 0 && e.value.data.metrics.length > 0 && (g = [
+        {
+          label: e.value.data.metrics[0],
+          data: e.value.data.datasets.map((v) => v.value),
+          backgroundColor: e.value.data.datasets.map((v, u) => X({ index: u }))
+        }
+      ]), g;
+    });
+    return (g, v) => {
+      const u = w("FmPieChart");
+      return h(), L(W, null, [
+        G(g.$slots, "menu"),
+        S(u, {
+          class: "circular",
+          percentage: "70%",
+          datasets: p.value,
+          metrics: e.value.data.datasets.map((l) => l.name),
+          variant: "doughnut",
+          legend: {
+            display: !0,
+            position: "top",
+            maxHeight: 54,
+            labels: {
+              usePointStyle: !0
+            }
+          },
+          datalabels: { display: n.value, align: "end", anchor: "end" },
+          "maintain-aspect-ratio": !1
+        }, null, 8, ["datasets", "metrics", "datalabels"])
+      ], 64);
+    };
+  }
+}), la = { class: "flex flex-col gap-1" }, na = { class: "fm-typo-en-title-sm-600" }, oa = { class: "flex gap-2" }, sa = { key: 0 }, ra = { key: 1 }, ia = /* @__PURE__ */ H({
+  __name: "WidgetScorecard",
+  props: {
+    modelValue: { required: !0 },
+    modelModifiers: {}
+  },
+  emits: ["update:modelValue"],
+  setup(t) {
+    const e = O(t, "modelValue"), { t: n } = ie(), { compareDateRange: p, defaultDateSetting: g } = se(xe()), { country: v } = ue(), u = s(() => {
+      var y;
+      return ((y = e.value.data) == null ? void 0 : y.value) || "";
+    }), l = s(() => {
+      const { data: y } = e.value;
+      return y != null && y.comparison ? ke(u.value, y.comparison, v) : null;
+    });
+    function o(y) {
+      switch (y) {
+        case re.bar:
+          return "bar";
+        case re.line:
+          return "line";
+        default:
+          return "line";
+      }
+    }
+    const m = s(() => {
+      var y;
+      return (y = e.value.data) == null ? void 0 : y.sparkline;
+    }), R = s(() => m.value.datasets.map((y) => ({
+      label: y.name,
+      data: y.values,
+      fill: !0,
+      color: "#36a2eb"
+    })));
+    return (y, T) => {
+      var c;
+      const J = w("FmIcon"), I = w("FmChip"), D = w("FmTooltip"), a = w("FmLineChart");
+      return h(), L("div", la, [
+        G(y.$slots, "menu"),
+        k("p", na, Z(u.value), 1),
+        k("div", oa, [
+          S(D, {
+            content: `vs. ${(c = j(g).defaultCompareType) == null ? void 0 : c.split("_").join(" ")}`,
+            placement: "right",
+            "hide-arrow": "",
+            variant: "plain"
+          }, {
+            default: B(() => [
+              l.value ? (h(), $(I, {
+                key: 0,
+                icon: l.value.icon.name,
+                class: le(`bg-${l.value.icon.tailwind}`),
+                compact: ""
+              }, {
+                default: B(() => [
+                  S(J, {
+                    name: l.value.icon.name,
+                    color: l.value.icon.color
+                  }, null, 8, ["name", "color"]),
+                  k("p", {
+                    class: "fm-typo-en-body-md-600",
+                    style: _e({ color: l.value.icon.color })
+                  }, Z(l.value.value), 5)
+                ]),
+                _: 1
+              }, 8, ["icon", "class"])) : K("", !0),
+              j(p).endDate !== null && j(p).startDate !== null && l.value === null ? (h(), $(I, {
+                key: 1,
+                compact: ""
+              }, {
+                default: B(() => [
+                  S(J, {
+                    name: "arrow_upward",
+                    color: "#C7C7CC"
+                  }),
+                  T[0] || (T[0] = k("p", { class: "fm-typo-en-body-md-600 text-fm-color-typo-disabled" }, "N/A", -1))
+                ]),
+                _: 1
+              })) : K("", !0)
+            ]),
+            _: 1
+          }, 8, ["content"])
+        ]),
+        m.value ? (h(), L("div", sa, [
+          o(m.value.type) === "line" ? (h(), $(a, {
+            key: 0,
+            class: "sparkline",
+            datasets: R.value,
+            "hide-x-axis": !0,
+            "hide-y-axis": !0,
+            legend: {
+              display: !1
+            },
+            "x-axis": { categories: m.value.dimensions },
+            "maintain-aspect-ratio": !1
+          }, null, 8, ["datasets", "x-axis"])) : K("", !0)
+        ])) : (h(), L("div", ra, T[1] || (T[1] = [
+          k("div", { class: "sparkline" }, [
+            k("div", { class: "flex flex-col gap-8" }, [
+              k("div"),
+              k("div")
+            ]),
+            k("div", { class: "grow" })
+          ], -1)
+        ])))
+      ]);
+    };
+  }
+}), ua = {};
+function ca(t, e) {
+  const n = w("FmMenuDivider");
+  return h(), $(n);
+}
+const da = /* @__PURE__ */ Ke(ua, [["render", ca]]), ma = { class: "my-4" }, pa = {
+  class: "border-b border-fm-color-neutral-gray-100 hover:bg-fm-color-opacity-sm",
+  style: { backgroundColor: "#f9f9f9" }
+}, va = { class: "font-bold" }, fa = { class: "text-fm-color-neutral-gray-300" }, ha = /* @__PURE__ */ H({
+  __name: "WidgetTable",
+  props: {
+    modelValue: { required: !0 },
+    modelModifiers: {}
+  },
+  emits: ["update:modelValue"],
+  setup(t) {
+    const { t: e } = ie(), n = O(t, "modelValue"), { country: p } = ue(), g = F(null), v = s(() => {
+      var a;
+      return ((a = n.value.data) == null ? void 0 : a.columns) || [{ label: "", key: "" }];
+    }), u = s(() => {
+      var a;
+      return ((a = n.value.data) == null ? void 0 : a.rows) || [];
+    }), l = s(() => n.value.filterText), o = s(() => {
+      var a, c;
+      if (!(l.value && l.value.trim().length > 0 || !((a = u.value[0]) != null && a.isRollup) && !((c = u.value[u.value.length - 1]) != null && c.isRollup))) {
+        if (n.value.rollupPosition === M.top || n.value.rollupPosition === void 0)
+          return M.top;
+        if (n.value.rollupPosition === M.bottom)
+          return M.bottom;
+      }
+    }), m = s(() => {
+      const d = o.value !== void 0 ? 1 : 0, x = (g.value ? g.value.$el.offsetHeight : 0) - 48;
+      return Math.floor((x - 34.5 - 32) / 48) - d;
+    }), R = s(() => {
+      var c, b;
+      let a = [];
+      switch (o.value) {
+        case M.top:
+          a = [...((c = u.value[0]) == null ? void 0 : c.cells) || []].map((d, x) => {
+            var _;
+            return {
+              main: d,
+              comparison: (_ = u.value[0]) == null ? void 0 : _.comparisonCells[x],
+              rowType: v.value[x].type
+            };
+          });
+          break;
+        case M.bottom:
+          a = [...((b = u.value[u.value.length - 1]) == null ? void 0 : b.cells) || []].map((d, x) => {
+            var _;
+            return {
+              main: d,
+              comparison: (_ = u.value[0]) == null ? void 0 : _.comparisonCells[x],
+              rowType: v.value[x].type
+            };
+          });
+          break;
+      }
+      return a.length > 0 && a[0].main === "" && (a[0].main = "Grand total"), a;
+    });
+    function y(a) {
+      const c = {};
+      for (let b = 0; b < v.value.length; b++)
+        if (v.value[b].key !== "") {
+          const d = a.comparisonCells[b];
+          c[v.value[b].key] = {
+            main: a.cells[b],
+            comparison: d
+          }, c.isRollup = a.isRollup;
+        }
+      return c;
+    }
+    function T(a) {
+      return [...new Array(a < 0 ? 0 : a)].map(() => {
+        var b;
+        const c = {};
+        if ((b = n.value.data) != null && b.columns)
+          for (let d = 0; d < n.value.data.columns.length; d++)
+            c[n.value.data.columns[d].key] = void 0;
+        return c;
+      });
+    }
+    function J(a) {
+      let c = (a == null ? void 0 : a.main) || "";
+      return c.includes("#") && !c.startsWith("#") && (c = c.split("#")[0]), !a || a.main === "" || a.comparison === "" ? {
+        main: c
+      } : {
+        main: c,
+        comparison: a == null ? void 0 : a.comparison,
+        difference: ke(a.main, a.comparison, p)
+      };
+    }
+    const I = s(() => {
+      var x, _, N;
+      let a = ((x = n.value.data) == null ? void 0 : x.rows) || [];
+      switch (o.value) {
+        case M.bottom:
+          a = (_ = a[a.length - 1]) != null && _.isRollup ? a.slice(0, -1) : a;
+          break;
+        case M.top:
+          a = (N = a[0]) != null && N.isRollup ? a.slice(1, a.length) : a;
+          break;
+      }
+      const c = a.filter((P) => !(l.value !== "" && (P.isRollup === !0 || !P.cells.some(
+        (E) => {
+          var q;
+          return ((E == null ? void 0 : E.toLowerCase()) || "").includes((q = l.value) == null ? void 0 : q.toLowerCase());
+        }
+      )))).map((P) => y(P)), b = c.length % m.value;
+      let d = 0;
+      return b > 0 ? d = Math.abs(b - m.value) : c.length === 0 && (d = m.value), c.push(...T(d)), c;
+    }), D = s(() => {
+      var c;
+      let a = [];
+      return (c = n.value.data) != null && c.columns && (a = [...n.value.data.columns.map((d) => {
+        const x = d.label;
+        return {
+          accessorKey: d.key,
+          header: () => ge(
+            "p",
+            {
+              class: `min-w-[110px] w-full text-nowrap ${d.type === "NUMERIC" ? "text-right" : ""}`
+            },
+            x
+          ),
+          cell: (_) => {
+            var E, q;
+            const N = J(_.getValue()), P = (q = (E = _ == null ? void 0 : _.row) == null ? void 0 : E.original) == null ? void 0 : q.isRollup;
+            return ge(
+              "div",
+              {
+                class: `${P ? "fm-typo-en-body-md-600 text-fm-color-typo-secondary" : "fm-typo-en-body-md-400"} ${d.type === "NUMERIC" ? "text-right" : ""} text-nowrap whitespace-pre`
+              },
+              [N.main]
+            );
+          },
+          meta: () => ({
+            cellClass: "subtotal-row"
+          }),
+          enableSorting: !1
+        };
+      })]), a;
+    });
+    return (a, c) => {
+      const b = w("FmTable");
+      return h(), L(W, null, [
+        k("div", ma, [
+          G(a.$slots, "menu")
+        ]),
+        S(b, {
+          ref_key: "table",
+          ref: g,
+          "column-defs": D.value,
+          "row-data": I.value,
+          "search-value": l.value,
+          "page-size": m.value,
+          "shrink-at": !1,
+          "force-mobile-footer": !0,
+          class: "scrollbar-hide-table"
+        }, {
+          "pin-top": B(() => [
+            k("tbody", null, [
+              k("tr", pa, [
+                (h(!0), L(W, null, Ce(R.value, (d, x) => (h(), L("td", {
+                  key: `${j(te)()}_${x}`,
+                  class: "h-[48px] text-fm-color-typo-primary px-16"
+                }, [
+                  k("span", {
+                    class: le(`items-center text-fm-color-typo-secondary gap-2 line-clamp-2 text-ellipsis ${d.rowType === "NUMERIC" ? "text-right" : ""}`)
+                  }, [
+                    k("p", va, Z(d.main), 1),
+                    k("p", fa, Z(d.comparison ? `(${d.comparison})` : ""), 1)
+                  ], 2)
+                ]))), 128))
+              ])
+            ])
+          ]),
+          _: 1
+        }, 8, ["column-defs", "row-data", "search-value", "page-size"])
+      ], 64);
+    };
+  }
+}), ga = /* @__PURE__ */ H({
+  __name: "WidgetStackBarChart",
+  props: {
+    modelValue: { required: !0 },
+    modelModifiers: {}
+  },
+  emits: ["update:modelValue"],
+  setup(t) {
+    const e = O(t, "modelValue"), n = s(() => {
+      var m;
+      return ((m = e.value.data) == null ? void 0 : m.xAxis) || [];
+    }), p = s(() => {
+      var o;
+      return ((o = e.value.data) == null ? void 0 : o.datasets) ?? [];
+    }), g = s(() => e.value.isTransposed ?? void 0), v = s(() => e.value.showLabel ?? void 0), u = F(null), l = s(() => p.value.length > 0 ? [
+      ...p.value.map((o, m) => {
+        let R = o.values;
+        return {
+          label: o.name,
+          data: R,
+          dash: !!o.isCompare,
+          backgroundColor: X({ index: m, isCompare: o.isCompare })
+        };
+      })
+    ] : []);
+    return (o, m) => {
+      const R = w("FmBarChart");
+      return h(), L(W, null, [
+        G(o.$slots, "menu"),
+        S(R, {
+          ref_key: "chartRef",
+          ref: u,
+          class: "bar-chart",
+          datasets: l.value,
+          "x-axis": { categories: n.value },
+          transpose: g.value,
+          stacked: !0,
+          legend: {
+            display: !1,
+            position: "bottom",
+            maxHeight: 54,
+            labels: {
+              usePointStyle: !0
+            }
+          },
+          datalabels: { display: v.value, align: "end", anchor: "end", rotation: 0 },
+          "maintain-aspect-ratio": !1
+        }, null, 8, ["datasets", "x-axis", "transpose", "datalabels"])
+      ], 64);
+    };
+  }
+}), ba = /* @__PURE__ */ H({
+  __name: "WidgetStackLineChart",
+  props: {
+    modelValue: { required: !0 },
+    modelModifiers: {}
+  },
+  emits: ["update:modelValue"],
+  setup(t) {
+    const e = O(t, "modelValue"), n = s(() => {
+      var l;
+      return ((l = e.value.data) == null ? void 0 : l.xAxis) ?? [];
+    }), p = s(() => {
+      var l;
+      return ((l = e.value.data) == null ? void 0 : l.datasets) ?? [];
+    }), g = s(() => e.value.isTransposed ?? void 0), v = s(() => e.value.showLabel ?? void 0), u = s(() => p.value.length > 0 ? [
+      ...p.value.map((l, o) => {
+        let m = l.values;
+        return {
+          label: l.name,
+          data: m,
+          dash: l.isCompare,
+          fill: !1,
+          color: X({ index: o, isCompare: l.isCompare })
+        };
+      })
+    ] : []);
+    return (l, o) => {
+      const m = w("FmLineChart");
+      return h(), L(W, null, [
+        G(l.$slots, "menu"),
+        S(m, {
+          class: "line-chart",
+          datasets: u.value,
+          "x-axis": { categories: n.value },
+          transpose: g.value,
+          legend: {
+            display: !1,
+            position: "bottom",
+            maxHeight: 54,
+            labels: {
+              usePointStyle: !0
+            }
+          },
+          stacked: !0,
+          datalabels: { display: v.value, align: "end", anchor: "end", rotation: 0 },
+          "maintain-aspect-ratio": !1
+        }, null, 8, ["datasets", "x-axis", "transpose", "datalabels"])
+      ], 64);
+    };
+  }
+}), Q = [
+  "col-span-1",
+  "col-span-2",
+  "col-span-3",
+  "col-span-4",
+  "col-span-5",
+  "col-span-6",
+  "col-span-7",
+  "col-span-8",
+  "col-span-9",
+  "col-span-10",
+  "col-span-11",
+  "col-span-12"
+];
+function ya(t) {
+  return t < 12 ? Q[t - 1] : Q[11];
+}
+function wa(t) {
+  return t < 12 ? Q[Math.min(11, t * 2 - 1)] : Q[11];
+}
+function _a(t) {
+  return t < 12 ? Q[Math.min(11, t * 3 - 1)] : Q[11];
+}
+const Ca = /* @__PURE__ */ H({
+  __name: "WidgetLinechart",
+  props: {
+    modelValue: { required: !0 },
+    modelModifiers: {}
+  },
+  emits: ["update:modelValue"],
+  setup(t) {
+    const e = O(t, "modelValue"), n = s(() => {
+      var l;
+      return ((l = e.value.data) == null ? void 0 : l.xAxis) ?? [];
+    }), p = s(() => {
+      var l;
+      return ((l = e.value.data) == null ? void 0 : l.datasets) ?? [];
+    }), g = s(() => e.value.isTransposed ?? void 0), v = s(() => e.value.showLabel ?? void 0), u = s(() => p.value.length > 0 ? [
+      ...p.value.map((l, o) => ({
+        label: l.name,
+        data: l.values,
+        dash: !!l.isCompare,
+        fill: !1,
+        color: X({ index: o, isCompare: l.isCompare })
+      }))
+    ] : []);
+    return (l, o) => {
+      const m = w("FmLineChart");
+      return h(), L(W, null, [
+        G(l.$slots, "menu"),
+        S(m, {
+          class: "line-chart",
+          datasets: u.value,
+          "x-axis": { categories: n.value },
+          transpose: g.value,
+          legend: {
+            display: !1,
+            position: "bottom",
+            maxHeight: 54,
+            labels: {
+              usePointStyle: !0
+            }
+          },
+          datalabels: { display: v.value, align: "end", anchor: "end", rotation: 0 },
+          "maintain-aspect-ratio": !1
+        }, null, 8, ["datasets", "x-axis", "transpose", "datalabels"])
+      ], 64);
+    };
+  }
+}), xa = {
+  key: 1,
+  class: "grow"
+}, ka = {
+  key: 2,
+  class: "flex"
+}, Ba = /* @__PURE__ */ H({
+  __name: "DynamicWidget",
+  props: /* @__PURE__ */ Ee({
+    index: {
+      type: Number,
+      default: 0
+    },
+    hideExport: {
+      type: Boolean,
+      default: !1
+    }
+  }, {
+    modelValue: { required: !0, default: () => {
+    } },
+    modelModifiers: {}
+  }),
+  emits: ["update:modelValue"],
+  setup(t) {
+    const e = F(!0), n = O(t, "modelValue"), { t: p } = ie(), g = t, v = F(null), u = F(n.value.widget.config.rollup), l = F(te()), o = F(n.value.widget.config.drillDimension), m = s(() => {
+      if (U.value.length > 0) {
+        const r = U.value.findIndex(
+          (f) => f.value === o.value
+        );
+        return r >= 0 ? r : 0;
+      } else
+        return -1;
+    }), R = s(() => m.value !== 0), y = s(
+      () => m.value != U.value.length - 1
+    ), T = F(n.value.widget.config.showLabel ?? !1), J = s(() => n.value.widget.config.showSearchBar), I = F(""), { breakpoints: D } = Qe(), a = F(), c = s(() => D.value.lg || D.value.md ? ya(n.value.size.width) : D.value.sm ? wa(n.value.size.width) : _a(n.value.size.width)), b = s(
+      () => Xe.find((r) => r.type === n.value.widget.type)
+    ), d = be(() => {
+      var r;
+      a.value = Le((r = v.value) == null ? void 0 : r.$el.offsetWidth), l.value = te();
+    }), x = s(() => {
+      if (Ye(C.value.type, _.value))
+        switch (n.value.widget.type) {
+          case i.BarChart:
+            return aa;
+          case i.StackBarChart:
+            return ga;
+          case i.LineChart:
+            return Ca;
+          case i.StackLineChart:
+            return ba;
+          case i.Circular:
+            return ta;
+          case i.Scorecard:
+            return ia;
+          case i.Spacer:
+            return da;
+          case i.Table:
+            return ha;
+          default:
+            return ye;
+        }
+      else
+        return ye;
+    }), _ = F(null), { selectedLocationIds: N, dateRange: P, compareDateRange: E, timeRange: q } = se(xe()), { businessId: Se } = se(ue()), C = s(() => {
+      const r = JSON.parse(JSON.stringify(n.value.widget));
+      return {
+        ...r,
+        config: {
+          ...r.config,
+          rollup: u.value,
+          drillDimension: o.value,
+          showGrandTotal: !1
+        }
+      };
+    }), ce = s(() => {
+      let r, f, V, z;
+      switch (C.value.type) {
+        case i.Table:
+          V = I.value, z = C.value.config.rollupPosition;
+          break;
+        case i.BarChart:
+        case i.LineChart:
+        case i.StackBarChart:
+        case i.StackLineChart:
+        case i.Circular:
+          r = T.value, f = C.value.config.isTransposed;
+          break;
+      }
+      return {
+        data: _.value,
+        showLabel: r,
+        isTransposed: f,
+        rollupPosition: z,
+        filterText: V
+      };
+    }), de = s(() => {
+      const { config: r } = n.value.widget;
+      if (r.rollup != null) {
+        const f = [...r.dimensions].filter((V) => !V.hide);
+        return f.sort(
+          (V, z) => (r.rowIds || []).indexOf(oe(V)) - (r.rowIds || []).indexOf(oe(z))
+        ), [
+          { label: "None", value: null },
+          { label: "Grand Total", value: 0 },
+          ...[...f].slice(0, f.length - 1).map((V, z) => ({ label: V.label, value: z + 1 }))
+        ];
+      }
+      return [];
+    }), U = s(() => {
+      const { config: r } = C.value;
+      return r.isDrillable ? r.dimensions.map((f) => ({
+        label: f.label,
+        value: oe(f)
+      })) : [];
+    });
+    ae(n.value, (r) => {
+      u.value = r.widget.config.rollup, T.value = r.widget.config.showLabel ?? !1;
+    }), ae([() => u.value], () => {
+      u.value !== null && (n.value.widget.config.rollup = u.value);
+    }), ae(
+      [
+        () => C.value,
+        () => P.value,
+        () => q.value,
+        () => E.value,
+        () => N.value,
+        () => Se.value
+      ],
+      () => {
+        var r;
+        N.value && ((r = N.value) == null ? void 0 : r.length) > 0 && pe();
+      },
+      {
+        deep: !0
+      }
+    ), ae(
+      [() => n.value.size],
+      () => {
+        d();
+      },
+      { deep: !0 }
+    ), ze(() => {
+      d(), D.value.sm || D.value.md || D.value.xs ? (console.log("Ignoring resize event due to keyboard"), addEventListener("change", d)) : addEventListener("resize", d), pe();
+    }), We(() => {
+      D.value.sm || D.value.md || D.value.xs ? (console.log("Ignoring resize event due to keyboard"), removeEventListener("change", d)) : removeEventListener("resize", d);
+    });
+    const me = Ze();
+    let Y;
+    const pe = be(async function() {
+      if (C.value.config.schemaNames.length <= 0 && !(C.value.config.dimensions.length <= 0 || C.value.config.metrics.length <= 0)) {
+        me.open({
+          message: "schema must not be empty and dimension or metrics must have at least 1 column",
+          type: "info"
+        }), e.value = !1;
+        return;
+      }
+      try {
+        e.value = !0, Y && Y.abort(), Y = new AbortController();
+        const f = Y.signal;
+        _.value = await Je(C.value, f), l.value = te(), e.value = !1;
+      } catch (f) {
+        _.value = null, f.code !== "ERR_CANCELED" && (me.open({ message: `Invalid chart ${C.value.type}`, type: "error" }), console.log(f), e.value = !1);
+      }
+    });
+    function Le(r) {
+      switch (n.value.widget.type) {
+        case "SPACER":
+          return;
+        case "SCORECARD":
+          return;
+        case "TABLE":
+          return `${n.value.size.height * 100 + (J.value ? 72 : 0) + 96.5}px`;
+      }
+      return `${Math.max(r / n.value.size.width, 90) * n.value.size.height}px`;
+    }
+    function De() {
+      const r = m.value - 1;
+      r >= 0 && (o.value = U.value[r].value);
+    }
+    function Fe() {
+      const r = m.value + 1;
+      r >= 0 && r < U.value.length && (o.value = U.value[r].value);
+    }
+    const Re = Object.values(Ue).map((r) => ({
+      label: je(r),
+      value: r,
+      onClick: async () => {
+        await Ge(r, g.index);
+      }
+    })), Te = C.value.type === i.Spacer ? "flat" : "outlined", $e = C.value.type === i.Spacer ? "p-0" : "p-16";
+    return (r, f) => {
+      const V = w("FmTooltip"), z = w("FmSearch"), Ve = w("FmCheckbox"), ne = w("FmButton"), Be = w("FmSelect"), Ae = w("FmMenuItem"), Me = w("FmMenu"), Ie = w("FmForm"), Ne = w("FmCircularProgress"), Pe = w("FmCard");
+      return h(), $(Pe, {
+        ref_key: "tileCard",
+        ref: v,
+        class: le(`${c.value} ${j($e)}`),
+        variant: j(Te)
+      }, {
+        default: B(() => [
+          e.value ? (h(), $(Ne, { key: 1 })) : (h(), L("div", {
+            key: 0,
+            style: _e({ height: a.value })
+          }, [
+            (h(), $(He(x.value), {
+              key: l.value,
+              modelValue: ce.value,
+              "onUpdate:modelValue": f[3] || (f[3] = (ee) => ce.value = ee)
+            }, {
+              menu: B(() => [
+                S(Ie, { class: "flex items-center gap-2" }, {
+                  default: B(() => {
+                    var ee, ve, fe, he;
+                    return [
+                      S(V, {
+                        variant: "plain",
+                        placement: "right",
+                        content: C.value.description,
+                        "hide-arrow": !0,
+                        disabled: !C.value.description
+                      }, {
+                        default: B(() => [
+                          k("p", {
+                            class: le(["fm-typo-en-body-md-400 line-clamp-1 text-fm-color-typo-secondary", `${C.value.description ? "border-b-2 border-dashed border-gray-300" : ""}`])
+                          }, Z(C.value.title || " "), 3)
+                        ]),
+                        _: 1
+                      }, 8, ["content", "disabled"]),
+                      (ee = b.value) != null && ee.showSearchBar ? (h(), $(z, {
+                        key: 0,
+                        modelValue: I.value,
+                        "onUpdate:modelValue": f[0] || (f[0] = (A) => I.value = A),
+                        class: "grow"
+                      }, null, 8, ["modelValue"])) : (h(), L("div", xa)),
+                      Oe(S(Ve, {
+                        modelValue: T.value,
+                        "onUpdate:modelValue": f[1] || (f[1] = (A) => T.value = A),
+                        label: "Label",
+                        value: !1
+                      }, null, 8, ["modelValue"]), [
+                        [qe, (ve = b.value) == null ? void 0 : ve.showLabel]
+                      ]),
+                      (fe = b.value) != null && fe.showDrillDimension && U.value.length > 0 ? (h(), L("div", ka, [
+                        S(ne, {
+                          icon: "arrow_upward",
+                          variant: "tertiary",
+                          disabled: !R.value,
+                          onClick: De
+                        }, null, 8, ["disabled"]),
+                        S(ne, {
+                          icon: "arrow_downward",
+                          variant: "tertiary",
+                          disabled: !y.value,
+                          onClick: Fe
+                        }, null, 8, ["disabled"])
+                      ])) : K("", !0),
+                      (he = b.value) != null && he.showRollup && de.value.length > 0 ? (h(), $(Be, {
+                        key: 3,
+                        modelValue: u.value,
+                        "onUpdate:modelValue": f[2] || (f[2] = (A) => u.value = A),
+                        class: "w-[150px]",
+                        items: de.value
+                      }, null, 8, ["modelValue", "items"])) : K("", !0),
+                      g.hideExport ? K("", !0) : (h(), $(Me, {
+                        key: 4,
+                        shift: !0
+                      }, {
+                        "menu-button": B(() => [
+                          S(ne, {
+                            icon: "more_vert",
+                            variant: "tertiary"
+                          })
+                        ]),
+                        default: B(() => [
+                          (h(!0), L(W, null, Ce(j(Re), (A) => (h(), $(Ae, {
+                            key: A.value,
+                            label: A.label,
+                            onClick: A.onClick
+                          }, null, 8, ["label", "onClick"]))), 128))
+                        ]),
+                        _: 1
+                      }))
+                    ];
+                  }),
+                  _: 1
+                })
+              ]),
+              _: 1
+            }, 8, ["modelValue"]))
+          ], 4))
+        ]),
+        _: 1
+      }, 8, ["class", "variant"]);
+    };
+  }
+});
+export {
+  M as R,
+  Ba as _,
+  oe as g
+};