@feedmepos/mf-report 5.5.7 → 5.5.8-beta.0

package/dist/DynamicWidget.vue_vue_type_script_setup_true_lang-B2WDEV5d.js

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