@feedmepos/mf-report 5.5.10-beta.0 → 5.5.11-beta.0

package/dist/DynamicWidget.vue_vue_type_script_setup_true_lang-Blu98Lu7.js

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