import { defineComponent as G, mergeModels as L, useModel as j, ref as q, computed as U, resolveComponent as g, createBlock as $, openBlock as s, withCtx as u, createElementVNode as _, createVNode as t, unref as e, normalizeClass as oe, createTextVNode as pe, toDisplayString as E, createElementBlock as S, Fragment as J, renderSlot as Ce, createCommentVNode as Q, watch as ve, renderList as X, resolveDynamicComponent as Ue, isRef as ke, normalizeStyle as fe, onMounted as Be } from "vue";
import { W as De, _ as We, i as Ie, S as ye, d as we, T as Re, a as qe } from "./TransitionFade-B7X9MlFK.js";
import { c as Ee, D as le, C as _e, a as Ve, b as He, v as te } from "./BaseDialog.vue_vue_type_script_setup_true_lang-BqtS2XG4.js";
import { storeToRefs as re } from "pinia";
import { useRouter as Se, useRoute as $e } from "vue-router";
import { useBreakpoints as se, useSnackbar as Oe, FmButtonColorThemeVariant as Z } from "@feedmepos/ui-library";
import { u as Te } from "./message-dialog-UoMWOnil.js";
import { u as ae, j as de, f as Pe } from "./vue-i18n-DG0DIzwC.js";
import { _ as me } from "./DynamicWidget.vue_vue_type_script_setup_true_lang-FhZDnXkv.js";
import { _ as ce } from "./NoData.vue_vue_type_script_setup_true_lang-j8BlZPPp.js";
import { r as ie } from "./i18n-Cif1I9J2.js";
import { _ as Fe } from "./SelectComponent.vue_vue_type_script_setup_true_lang-kzXPr73e.js";
const ze = /* @__PURE__ */ G({
  __name: "WidgetDialog",
  props: /* @__PURE__ */ L({
    isOpen: { type: Boolean }
  }, {
    modelValue: {},
    modelModifiers: {}
  }),
  emits: /* @__PURE__ */ L(["update:isOpen"], ["update:modelValue"]),
  setup(k, { emit: d }) {
    const { t: n } = ae(), { breakpoints: r } = se(), y = j(k, "modelValue"), p = k, x = d;
    function f() {
      x("update:isOpen", !1);
    }
    function V() {
      m.value && (y.value = m.value, m.value = void 0, x("update:isOpen", !1));
    }
    const m = q(), B = U(() => !m.value);
    return (D, W) => {
      const I = g("FmButton"), w = g("FmDialog");
      return s(), $(w, {
        "model-value": p.isOpen
      }, {
        "dialog-header": u(() => [
          pe(E(e(n)("report.widget.type")), 1)
        ]),
        default: u(() => [
          t(De, {
            modelValue: m.value,
            "onUpdate:modelValue": W[0] || (W[0] = (N) => m.value = N),
            class: oe(`grid ${e(r).lg || e(r).md ? "grid-cols-3 gap-3" : "grid-cols-2 gap-3"}`),
            "child-class": "p-[8px] flex flex-col"
          }, null, 8, ["modelValue", "class"])
        ]),
        "dialog-footer": u(() => [
          W[1] || (W[1] = _("div", { class: "grow" }, null, -1)),
          t(I, {
            label: e(n)("report.common.cancel"),
            variant: "tertiary",
            onClick: f
          }, null, 8, ["label"]),
          t(I, {
            label: e(n)("report.common.confirm"),
            disabled: B.value,
            onClick: V
          }, null, 8, ["label", "disabled"])
        ]),
        _: 1
      }, 8, ["model-value"]);
    };
  }
}), Je = { class: "fm-typo-en-body-lg-600" }, ge = /* @__PURE__ */ G({
  __name: "ReportEditorTabHeader",
  props: /* @__PURE__ */ L({
    icon: {
      type: String,
      required: !0
    }
  }, {
    modelValue: { type: Boolean, required: !0, default: !1 },
    modelModifiers: {}
  }),
  emits: ["update:modelValue"],
  setup(k) {
    const { t: d } = ae(), n = j(k, "modelValue"), r = k;
    return (y, p) => {
      const x = g("FmIcon");
      return s(), S("div", {
        class: "px-6 py-16 flex items-center gap-2 bg-fm-color-neutral-white border cursor-pointer",
        onClick: p[0] || (p[0] = (f) => n.value = !n.value)
      }, [
        _("p", Je, E(e(d)("report.editor.customizeReport")), 1),
        p[1] || (p[1] = _("div", { class: "grow" }, null, -1)),
        t(x, {
          name: r.icon
        }, null, 8, ["name"])
      ]);
    };
  }
}), Le = /* @__PURE__ */ G({
  __name: "ReportEditorTabDesktop",
  props: {
    modelValue: { required: !0, default: !1 },
    modelModifiers: {}
  },
  emits: ["update:modelValue"],
  setup(k) {
    const d = j(k, "modelValue");
    return (n, r) => (s(), S(J, null, [
      t(ge, {
        modelValue: d.value,
        "onUpdate:modelValue": r[0] || (r[0] = (y) => d.value = y),
        icon: "keyboard_double_arrow_left"
      }, null, 8, ["modelValue"]),
      Ce(n.$slots, "default")
    ], 64));
  }
}), je = /* @__PURE__ */ G({
  __name: "ReportEditorTabMobile",
  props: {
    modelValue: { required: !0, default: !1 },
    modelModifiers: {}
  },
  emits: ["update:modelValue"],
  setup(k) {
    const d = j(k, "modelValue");
    return (n, r) => {
      const y = g("FmTopSheet"), p = g("FmCard");
      return s(), $(p, { class: "fixed bottom-0 w-full" }, {
        default: u(() => [
          t(ge, {
            modelValue: d.value,
            "onUpdate:modelValue": r[0] || (r[0] = (x) => d.value = x),
            icon: "keyboard_double_arrow_up"
          }, null, 8, ["modelValue"]),
          t(y, {
            modelValue: d.value,
            "onUpdate:modelValue": r[2] || (r[2] = (x) => d.value = x),
            "fullscreen-size": "sm"
          }, {
            default: u(() => [
              t(ge, {
                modelValue: d.value,
                "onUpdate:modelValue": r[1] || (r[1] = (x) => d.value = x),
                icon: "keyboard_double_arrow_down"
              }, null, 8, ["modelValue"]),
              d.value ? Ce(n.$slots, "default", { key: 0 }) : Q("", !0)
            ]),
            _: 3
          }, 8, ["modelValue"])
        ]),
        _: 3
      });
    };
  }
}), Ge = {
  key: 0,
  class: "flex flex-col gap-2"
}, Ae = /* @__PURE__ */ G({
  __name: "GlobalFilterDialog",
  props: /* @__PURE__ */ L({
    schemas: {
      type: Array,
      default: () => []
    },
    tiles: {
      type: Array,
      required: !0
    }
  }, {
    globalFilter: {
      default: () => null
    },
    globalFilterModifiers: {},
    isOpen: { type: Boolean, default: () => !1, required: !0 },
    isOpenModifiers: {}
  }),
  emits: ["update:globalFilter", "update:isOpen"],
  setup(k) {
    const { t: d, te: n } = ae(), r = j(k, "globalFilter"), y = j(k, "isOpen"), p = Oe(), x = k, f = q(), V = q(), m = q(), B = q([]), D = q([]);
    ve(y, (v) => {
      var o, h, a, l;
      v && (f.value = ((o = r.value) == null ? void 0 : o.label) || "", V.value = x.schemas.find(
        (C) => {
          var i;
          return C.name === ((i = r.value) == null ? void 0 : i.schemaName);
        }
      ), m.value = (h = I.value.find(
        (C) => {
          var i;
          return C.value.name === ((i = r.value) == null ? void 0 : i.name);
        }
      )) == null ? void 0 : h.value, B.value = ((a = r.value) == null ? void 0 : a.tileIds) || [], D.value = ((l = r.value) == null ? void 0 : l.filters) || []);
    });
    const W = U(
      () => x.schemas.map((v) => ({
        label: v.label || v.name,
        value: v
      }))
    ), I = U(() => {
      var v;
      return (((v = V.value) == null ? void 0 : v.fields) || []).map((o) => ({
        label: o.label,
        value: o
      }));
    }), w = U(() => x.tiles.reduce((v, o, h) => {
      var C, i;
      const a = o.widget.config.schemaNames ?? [], l = (o.widget.config.joinDatasources ?? []).flatMap(
        (c) => c.schemaNames ?? []
      );
      return [...a, ...l].includes(((C = V.value) == null ? void 0 : C.name) || "") && v.push({
        label: (i = o == null ? void 0 : o.widget.title) != null && i.trim() ? o.widget.title : `Widget ${h + 1}`,
        value: o.id
      }), v;
    }, [])), N = U(
      () => x.schemas.flatMap(
        (v) => (v.fields ?? []).map((o) => ({
          ...o,
          labels: [
            ie(d, n, v.label, "schema"),
            ie(d, n, o.label || o.name, "other")
          ]
        }))
      )
    );
    function A(v) {
      var o;
      v.name !== ((o = V.value) == null ? void 0 : o.name) && (V.value = v, m.value = void 0);
    }
    function O(v) {
      m.value = v;
    }
    function H(v) {
      switch (v) {
        case le.Timestamp:
          return _e.Between;
        case le.Bool:
        case le.String:
        case le.Numeric:
          return _e.Equal;
        default:
          throw new Error(`Unsupported data type: ${v}`);
      }
    }
    function b() {
      if (!V.value) {
        p.open({ message: "Invalid schema", type: "error" });
        return;
      }
      m.value || p.open({ message: "Invalid dimension", type: "error" }), r.value = {
        schemaName: V.value.name,
        name: m.value.name,
        label: f.value || name,
        operator: H(m.value.type),
        option: m.value.type === le.Timestamp ? Ee.DateTime : null,
        tileIds: [...B.value],
        filters: JSON.parse(JSON.stringify(D.value))
      }, y.value = !1;
    }
    function P() {
      y.value = !1;
    }
    const K = U(() => {
      var v;
      return [
        (v = V.value) == null ? void 0 : v.name,
        ...D.value.map((o) => o.schemaName)
      ];
    });
    function Y(v) {
      var C, i, c, M;
      const o = x.tiles.find((R) => R.id === v.value), h = ((i = (C = o == null ? void 0 : o.widget) == null ? void 0 : C.config) == null ? void 0 : i.schemaNames) ?? [], a = (((M = (c = o == null ? void 0 : o.widget) == null ? void 0 : c.config) == null ? void 0 : M.joinDatasources) ?? []).flatMap(
        (R) => R.schemaNames ?? []
      ), l = [...h, ...a];
      return K.value.filter((R) => !!R).some((R) => !l.includes(R));
    }
    return (v, o) => {
      const h = g("FmTextField"), a = g("FmLabel"), l = g("FmCheckbox"), C = g("FmIcon"), i = g("FmTooltip"), c = g("FmForm"), M = g("FmButton"), R = g("FmDialog");
      return s(), $(R, {
        modelValue: y.value,
        "onUpdate:modelValue": o[5] || (o[5] = (T) => y.value = T),
        overlay: !0,
        "z-index": 10
      }, {
        "dialog-header": u(() => [
          pe(E(e(d)("report.section.filter.globalFilter")), 1)
        ]),
        default: u(() => [
          t(c, {
            ref: "form",
            class: "flex flex-col gap-2 w-[490px]"
          }, {
            default: u(() => [
              t(h, {
                modelValue: f.value,
                "onUpdate:modelValue": o[0] || (o[0] = (T) => f.value = T),
                placeholder: e(d)("report.section.filter.displayName"),
                label: e(d)("report.section.filter.displayName"),
                class: "mb-2"
              }, null, 8, ["modelValue", "placeholder", "label"]),
              t(Fe, {
                "model-value": V.value,
                items: W.value,
                placeholder: e(d)("report.section.schema.title"),
                label: e(d)("report.section.schema.title"),
                "onUpdate:modelValue": o[1] || (o[1] = (T) => A(T))
              }, null, 8, ["model-value", "items", "placeholder", "label"]),
              t(Fe, {
                "model-value": m.value,
                items: I.value,
                placeholder: e(d)("report.section.dimension.Dimension"),
                label: e(d)("report.section.dimension.Dimension"),
                "onUpdate:modelValue": o[2] || (o[2] = (T) => O(T))
              }, null, 8, ["model-value", "items", "placeholder", "label"]),
              t(We, {
                modelValue: D.value,
                "onUpdate:modelValue": o[3] || (o[3] = (T) => D.value = T),
                options: N.value
              }, null, 8, ["modelValue", "options"]),
              t(a, { class: "mt-2 fm-typo-en-body-lg-600" }, {
                default: u(() => [
                  pe(E(e(d)("report.section.filter.applyWidget")), 1)
                ]),
                _: 1
              }),
              k.tiles.length > 0 ? (s(), S("div", Ge, [
                (s(!0), S(J, null, X(w.value, (T) => (s(), S("div", {
                  key: T.value,
                  class: "flex items-center"
                }, [
                  t(l, {
                    modelValue: B.value,
                    "onUpdate:modelValue": o[4] || (o[4] = (ne) => B.value = ne),
                    label: T.label,
                    value: T.value
                  }, null, 8, ["modelValue", "label", "value"]),
                  Y(T) ? (s(), $(i, {
                    key: 0,
                    content: e(d)("report.section.filter.missingFilterSchema"),
                    "z-index": 99,
                    class: "ml-2"
                  }, {
                    default: u(() => [
                      t(C, {
                        name: "warning",
                        class: "text-fm-color-system-error-300"
                      })
                    ]),
                    _: 1
                  }, 8, ["content"])) : Q("", !0)
                ]))), 128))
              ])) : (s(), $(a, {
                key: 1,
                class: "fm-typo-en-body-lg-400",
                label: e(d)("report.section.filter.noWidget")
              }, null, 8, ["label"]))
            ]),
            _: 1
          }, 512)
        ]),
        "dialog-footer": u(() => [
          o[6] || (o[6] = _("div", { class: "grow" }, null, -1)),
          t(M, {
            label: e(d)("report.common.cancel"),
            variant: "tertiary",
            onClick: P
          }, null, 8, ["label"]),
          t(M, {
            label: e(d)("report.common.confirm"),
            onClick: b
          }, null, 8, ["label"])
        ]),
        _: 1
      }, 8, ["modelValue"]);
    };
  }
}), Ke = { class: "flex flex-col gap-24 top-0 bg-fm-color-neutral-white z-10" }, Qe = { class: "flex flex-col gap-24 top-0 bg-fm-color-neutral-white z-10" }, Xe = { class: "flex items-center gap-1 max-w-[195px] w-[195px]" }, Ye = { class: "line-clamp-2 overflow-hidden max-w-[195px] w-[195px]" }, Ze = { class: "flex flex-col gap-24" }, el = { class: "line-clamp-2 overflow-hidden max-w-[195px] w-[195px]" }, xe = /* @__PURE__ */ G({
  __name: "ReportEditorTab",
  props: /* @__PURE__ */ L({
    hideConfiguration: {
      type: Boolean,
      default: !1
    }
  }, {
    modelValue: { required: !0 },
    modelModifiers: {}
  }),
  emits: /* @__PURE__ */ L(["hideConfiguration"], ["update:modelValue"]),
  setup(k, { emit: d }) {
    const n = j(k, "modelValue"), { breakpoints: r } = se(), y = k, p = d, x = Se(), f = $e(), V = q(), {
      currentSelectWidgetType: m,
      categories: B,
      editingTile: D,
      editingTileIndex: W,
      editingGlobalFilter: I,
      editingGlobalFilterIndex: w
    } = re(Ve()), { schemas: N } = re(He()), { promptMessage: A } = Te(), O = q(!1), H = q(!1), { t: b, te: P } = ae(), K = q(void 0), Y = U(() => {
      const a = n.value.tiles.flatMap((l) => {
        var c;
        const C = l.widget.config.schemaNames ?? [], i = ((c = l.widget.config.joinDatasources) == null ? void 0 : c.flatMap((M) => M.schemaNames ?? [])) ?? [];
        return [...C, ...i];
      });
      return [...new Set(a)].reduce((l, C) => {
        const i = N.value.find((c) => c.name === C);
        return i && l.push(i), l;
      }, []);
    });
    ve(
      () => m.value,
      () => {
        m.value !== void 0 && (K.value = Ie(m.value), D.value = K.value, W.value = -1, x.push({
          name: "tileEditor",
          query: f.query
        }));
      },
      { immediate: !0 }
    ), ve(
      () => n.value.tiles,
      (a) => {
        a.forEach((l) => {
          l.id || (l.id = te());
        });
      },
      { immediate: !0, deep: !0 }
    );
    const v = [
      {
        label: b("report.common.edit"),
        selected: !1,
        variant: "tertiary",
        onClick: (a) => {
          W.value = a, D.value = JSON.parse(JSON.stringify(n.value.tiles[a])), x.push({
            name: "tileEditor",
            query: f.query
          });
        }
      },
      {
        label: b("report.common.duplicate"),
        selected: !1,
        variant: "tertiary",
        onClick: (a) => {
          const l = {
            ...JSON.parse(JSON.stringify(n.value.tiles[a])),
            id: te()
          };
          n.value.tiles.push(l);
        }
      },
      {
        label: b("report.common.remove"),
        selected: !1,
        variant: "destructive",
        onClick: async (a) => {
          if (await A({
            title: b("report.editor.deleteWidget"),
            message: b("report.editor.deleteWidgetConfirm", {
              title: n.value.tiles[a].widget.title
            })
          })) {
            const C = n.value.tiles[a].id;
            n.value.tiles.splice(a, 1), n.value.globalFilters && n.value.globalFilters.forEach((i) => {
              var c;
              i.tileIds = (c = i.tileIds) == null ? void 0 : c.filter((M) => M !== C);
            });
          }
        }
      }
    ], o = [
      {
        label: b("report.common.edit"),
        selected: !1,
        variant: "tertiary",
        onClick: (a) => {
          var l;
          w.value = a, I.value = JSON.parse(JSON.stringify((l = n.value.globalFilters) == null ? void 0 : l[a])), O.value = !0;
        }
      },
      {
        label: b("report.common.remove"),
        selected: !1,
        variant: "destructive",
        onClick: async (a) => {
          var i, c;
          const l = (i = n.value.globalFilters) == null ? void 0 : i[a];
          if (!l) return;
          await A({
            title: b("report.editor.deleteWidget"),
            message: b("report.editor.deleteWidgetConfirm", {
              title: de(l)
            })
          }) && ((c = n.value.globalFilters) == null || c.splice(a, 1));
        }
      }
    ], h = U(() => B.value.map((a) => ({
      label: b(`report.category.${a.name}`),
      value: a.id
    })));
    return (a, l) => {
      const C = g("FmTextField"), i = g("FmSelect"), c = g("FmButton"), M = g("FmIcon"), R = g("FmTooltip"), T = g("FmMenuItem"), ne = g("FmMenu"), be = g("FmListItem"), he = g("FmList"), Ne = g("FmForm");
      return s(), $(Ue(e(r).lg || e(r).md ? Le : je), {
        "model-value": y.hideConfiguration,
        "onUpdate:modelValue": l[8] || (l[8] = (F) => p("hideConfiguration", F))
      }, {
        default: u(() => [
          t(Ae, {
            "is-open": O.value,
            "onUpdate:isOpen": l[0] || (l[0] = (F) => O.value = F),
            "global-filter": e(I),
            tiles: n.value.tiles,
            schemas: Y.value,
            "onUpdate:globalFilter": l[1] || (l[1] = (F) => {
              F && (n.value.globalFilters || (n.value.globalFilters = []), typeof e(w) == "number" && e(w) >= 0 ? n.value.globalFilters[e(w)] = F : n.value.globalFilters.push(F));
            })
          }, null, 8, ["is-open", "global-filter", "tiles", "schemas"]),
          t(ze, {
            modelValue: e(m),
            "onUpdate:modelValue": l[2] || (l[2] = (F) => ke(m) ? m.value = F : null),
            "is-open": H.value,
            "onUpdate:isOpen": l[3] || (l[3] = (F) => H.value = F)
          }, null, 8, ["modelValue", "is-open"]),
          t(Ne, {
            ref_key: "form",
            ref: V,
            class: "px-6 py-16 flex flex-col gap-24 overflow-y-auto overflow-x-hidden"
          }, {
            default: u(() => [
              t(ye, { class: "border-solid" }, {
                header: u(() => [
                  _("p", null, E(e(b)("report.editor.reportInfo")), 1),
                  l[9] || (l[9] = _("div", { class: "grow" }, null, -1))
                ]),
                content: u(() => [
                  _("div", Ke, [
                    t(C, {
                      modelValue: n.value.name,
                      "onUpdate:modelValue": l[4] || (l[4] = (F) => n.value.name = F),
                      label: e(b)("report.editor.reportTitle"),
                      placeholder: e(b)("report.editor.placeholder")
                    }, null, 8, ["modelValue", "label", "placeholder"]),
                    t(i, {
                      modelValue: n.value.category,
                      "onUpdate:modelValue": l[5] || (l[5] = (F) => n.value.category = F),
                      label: e(b)("report.common.category"),
                      items: h.value
                    }, null, 8, ["modelValue", "label", "items"])
                  ])
                ]),
                _: 1
              }),
              t(ye, {
                class: "border-solid",
                "is-open": !1
              }, {
                header: u(() => [
                  _("p", null, E(e(b)("report.section.filter.globalFilter")), 1),
                  l[10] || (l[10] = _("div", { class: "grow" }, null, -1))
                ]),
                content: u(() => [
                  _("div", Qe, [
                    t(c, {
                      label: e(b)("report.section.filter.addGlobalFilter"),
                      variant: "secondary",
                      icon: "add",
                      "icon-position": "prepend",
                      "border-color": e(Z).ColorPrimary,
                      "text-color": e(Z).ColorPrimary,
                      onClick: l[6] || (l[6] = () => {
                        w.value = null, I.value = null, O.value = !0;
                      })
                    }, null, 8, ["label", "border-color", "text-color"]),
                    t(he, null, {
                      default: u(() => [
                        t(e(we), {
                          list: n.value.globalFilters,
                          "item-key": "`${element.schemaName}-${element.name}`",
                          class: "flex flex-col gap-2 cursor-grab",
                          handle: ".handle"
                        }, {
                          item: u(({ element: F, index: ee }) => [
                            t(be, { class: "!cursor-grab border rounded-md border-neutral-300" }, {
                              default: u(() => [
                                t(M, {
                                  name: "drag_handle",
                                  class: "handle"
                                }),
                                _("div", Xe, [
                                  t(R, {
                                    "z-index": 99,
                                    content: e(de)(F),
                                    class: "handle"
                                  }, {
                                    default: u(() => [
                                      _("p", Ye, E(e(de)(F)), 1)
                                    ]),
                                    _: 2
                                  }, 1032, ["content"]),
                                  Y.value.find(
                                    (z) => z.name === F.schemaName
                                  ) ? Q("", !0) : (s(), $(R, {
                                    key: 0,
                                    content: e(b)("report.section.filter.missingSchema"),
                                    "z-index": 99
                                  }, {
                                    default: u(() => [
                                      t(M, {
                                        name: "warning",
                                        class: "text-fm-color-system-error-300"
                                      })
                                    ]),
                                    _: 1
                                  }, 8, ["content"]))
                                ]),
                                l[11] || (l[11] = _("div", { class: "grow" }, null, -1)),
                                t(ne, {
                                  trigger: "click",
                                  shift: !0,
                                  "stop-click-propagation": !0
                                }, {
                                  "menu-button": u(() => [
                                    t(c, {
                                      "append-icon": "more_vert",
                                      variant: "tertiary"
                                    })
                                  ]),
                                  default: u(() => [
                                    (s(), S(J, null, X(o, (z, ue) => t(T, {
                                      key: ue,
                                      onClick: (Me) => z.onClick(ee)
                                    }, {
                                      label: u(() => [
                                        _("p", {
                                          class: oe(
                                            z.variant === "destructive" ? " text-fm-color-system-error-300" : ""
                                          )
                                        }, E(z.label), 3)
                                      ]),
                                      _: 2
                                    }, 1032, ["onClick"])), 64))
                                  ]),
                                  _: 2
                                }, 1024)
                              ]),
                              _: 2
                            }, 1024)
                          ]),
                          _: 1
                        }, 8, ["list"])
                      ]),
                      _: 1
                    })
                  ])
                ]),
                _: 1
              }),
              _("div", Ze, [
                t(c, {
                  label: e(b)("report.editor.addWidget"),
                  variant: "secondary",
                  icon: "add",
                  "icon-position": "prepend",
                  "border-color": e(Z).ColorPrimary,
                  "text-color": e(Z).ColorPrimary,
                  onClick: l[7] || (l[7] = (F) => H.value = !0)
                }, null, 8, ["label", "border-color", "text-color"]),
                t(he, null, {
                  default: u(() => [
                    t(e(we), {
                      list: n.value.tiles,
                      "item-key": "id",
                      class: "flex flex-col gap-2 cursor-grab",
                      handle: ".handle"
                    }, {
                      item: u(({ element: F, index: ee }) => [
                        t(be, { class: "!cursor-grab border rounded-md border-neutral-300" }, {
                          default: u(() => [
                            t(M, {
                              name: "drag_handle",
                              class: "handle"
                            }),
                            t(R, {
                              content: F.widget.title ? e(ie)(e(b), e(P), F.widget.title, "other") : e(b)("report.editor.widget", { index: ee + 1 }),
                              class: "handle"
                            }, {
                              default: u(() => [
                                _("p", el, E(F.widget.title ? e(ie)(e(b), e(P), F.widget.title, "other") : e(b)("report.editor.widget", { index: ee + 1 })), 1)
                              ]),
                              _: 2
                            }, 1032, ["content"]),
                            l[12] || (l[12] = _("div", { class: "grow" }, null, -1)),
                            t(ne, {
                              trigger: "click",
                              shift: !0,
                              "stop-click-propagation": !0
                            }, {
                              "menu-button": u(() => [
                                t(c, {
                                  "append-icon": "more_vert",
                                  variant: "tertiary"
                                })
                              ]),
                              default: u(() => [
                                (s(), S(J, null, X(v, (z, ue) => t(T, {
                                  key: ue,
                                  onClick: (Me) => z.onClick(ee)
                                }, {
                                  label: u(() => [
                                    _("p", {
                                      class: oe(
                                        z.variant === "destructive" ? " text-fm-color-system-error-300" : ""
                                      )
                                    }, E(z.label), 3)
                                  ]),
                                  _: 2
                                }, 1032, ["onClick"])), 64))
                              ]),
                              _: 2
                            }, 1024)
                          ]),
                          _: 2
                        }, 1024)
                      ]),
                      _: 1
                    }, 8, ["list"])
                  ]),
                  _: 1
                })
              ])
            ]),
            _: 1
          }, 512)
        ]),
        _: 1
      }, 8, ["model-value"]);
    };
  }
}), ll = { class: "h-full w-full overflow-x-hidden" }, tl = { class: "flex flex-col bg-fm-color-neutral-white w-[400px]" }, ol = { class: "flex bg-fm-color-neutral-white w-[88px]" }, al = {
  key: 1,
  class: "w-full overflow-y-auto"
}, nl = {
  key: 0,
  class: "w-full grid grid-cols-12 gap-[24px] p-24"
}, rl = { key: 2 }, il = {
  key: 0,
  class: "grid grid-cols-12 gap-[16px]"
}, sl = {
  key: 3,
  class: "h-full w-full flex items-start justify-center bg-fm-color-neutral-white py-24",
  style: { backgroundColor: "#F6F8FC" }
}, ul = {
  key: 0,
  class: "w-full grid grid-cols-12 gap-[24px] p-24"
}, dl = /* @__PURE__ */ G({
  __name: "ReportEditorViewport",
  props: /* @__PURE__ */ L({
    hideConfiguration: { type: Boolean, required: !1, default: !1 },
    previewWidth: { type: Number, required: !0 },
    previewHeight: { type: Number, required: !0 },
    previewScale: { type: Number, required: !0 }
  }, {
    modelValue: { required: !0, default: () => {
    } },
    modelModifiers: {}
  }),
  emits: /* @__PURE__ */ L(["hideConfiguration"], ["update:modelValue"]),
  setup(k, { emit: d }) {
    const { breakpoints: n } = se(), r = j(k, "modelValue"), y = k, p = U(() => y.previewWidth > 0 && y.previewHeight > 0), x = U(() => n.value.sm || n.value.xs), f = d;
    return (V, m) => {
      const B = g("FmCircularProgress"), D = g("FmButton"), W = g("FmMenuDivider"), I = g("FmCard");
      return s(), S("div", ll, [
        r.value ? (s(), S(J, { key: 1 }, [
          p.value ? Q("", !0) : (s(), $(Re, {
            key: 0,
            "model-value": !y.hideConfiguration
          }, {
            right: u(() => [
              _("div", tl, [
                r.value ? (s(), $(xe, {
                  key: 0,
                  modelValue: r.value,
                  "onUpdate:modelValue": m[0] || (m[0] = (w) => r.value = w),
                  "hide-configuration": y.hideConfiguration,
                  onHideConfiguration: m[1] || (m[1] = (w) => f("hideConfiguration", w))
                }, null, 8, ["modelValue", "hide-configuration"])) : Q("", !0)
              ])
            ]),
            left: u(() => [
              _("div", ol, [
                t(D, {
                  variant: "secondary",
                  icon: "keyboard_double_arrow_right",
                  "border-color": e(Z).ColorPrimary,
                  "text-color": e(Z).ColorPrimary,
                  class: "m-24 my-16",
                  size: "md",
                  onClick: m[2] || (m[2] = (w) => f("hideConfiguration", !y.hideConfiguration))
                }, null, 8, ["border-color", "text-color"])
              ])
            ]),
            _: 1
          }, 8, ["model-value"])),
          t(W, {
            vertical: "",
            style: { margin: "0px" }
          }),
          !x.value && !p.value ? (s(), S("div", al, [
            r.value.tiles.length > 0 ? (s(), S("div", nl, [
              (s(!0), S(J, null, X(r.value.tiles, (w, N) => (s(), $(me, {
                key: `${e(te)()}_${N}`,
                "model-value": w,
                index: N,
                "hide-export": !0
              }, null, 8, ["model-value", "index"]))), 128))
            ])) : (s(), $(ce, { key: 1 }))
          ])) : x.value && !p.value ? (s(), S("div", rl, [
            t(I, { class: "px-5 pb-28" }, {
              default: u(() => [
                r.value.tiles.length > 0 ? (s(), S("div", il, [
                  (s(!0), S(J, null, X(r.value.tiles, (w, N) => (s(), $(me, {
                    key: `${e(te)()}_${N}`,
                    "model-value": w,
                    index: N,
                    "hide-export": !0
                  }, null, 8, ["model-value", "index"]))), 128))
                ])) : (s(), $(ce, { key: 1 }))
              ]),
              _: 1
            }),
            r.value ? (s(), $(xe, {
              key: 0,
              modelValue: r.value,
              "onUpdate:modelValue": m[3] || (m[3] = (w) => r.value = w),
              "hide-configuration": y.hideConfiguration,
              onHideConfiguration: m[4] || (m[4] = (w) => {
                f("hideConfiguration", w);
              })
            }, null, 8, ["modelValue", "hide-configuration"])) : Q("", !0)
          ])) : (s(), S("div", sl, [
            _("div", {
              style: fe({
                transformOrigin: "top center",
                transform: `scale(${y.previewScale})`
              })
            }, [
              _("div", {
                class: "overflow-y-auto bg-white rounded-lg",
                style: fe({
                  width: y.previewWidth + "px",
                  height: y.previewHeight + "px"
                })
              }, [
                r.value.tiles.length > 0 ? (s(), S("div", ul, [
                  (s(!0), S(J, null, X(r.value.tiles, (w, N) => (s(), $(me, {
                    key: `${e(te)()}_${N}`,
                    "model-value": w,
                    index: N,
                    "hide-export": !0,
                    "custom-screen-width": y.previewWidth
                  }, null, 8, ["model-value", "index", "custom-screen-width"]))), 128))
                ])) : (s(), $(ce, { key: 1 }))
              ], 4)
            ], 4)
          ]))
        ], 64)) : (s(), $(B, { key: 0 }))
      ]);
    };
  }
}), ml = { class: "flex items-center gap-4" }, cl = { class: "flex justify-center items-center gap-2 w-full" }, pl = { class: "flex gap-4" }, Vl = /* @__PURE__ */ G({
  __name: "ReportEditor",
  setup(k) {
    const d = Se(), n = $e(), r = Ve(), { promptLoader: y } = Pe(), { t: p } = ae(), { currentReport: x, editingReport: f } = re(r), { breakpoints: V } = se(), m = U(() => {
      var h;
      return !((h = f.value) != null && h.editable);
    }), B = U(() => {
      var h;
      return ((h = f.value) == null ? void 0 : h.name) ?? p("report.editor.newReport");
    }), D = Oe(), { promptMessage: W } = Te(), I = q(!1);
    async function w() {
      if (!f.value || f.value.tiles.length === 0) {
        D.open({ message: p("report.messages.noWidget"), type: "error" });
        return;
      }
      const { defaultChartWidth: h, defaultChartHeight: a } = re(r);
      f.value.tiles.forEach((i) => {
        i.widget.config.chartWidth == null && (i.widget.config.chartWidth = h.value), i.widget.config.chartHeight == null && (i.widget.config.chartHeight = a.value);
      });
      const l = m.value ? p("report.common.clone") : p("report.common.save");
      if (await W({
        title: `${p("report.messages.saveReport")}`,
        message: p("report.messages.confirmAction", { action: l, name: B.value })
      }))
        try {
          await y(async () => {
            if (m.value) {
              const i = JSON.parse(JSON.stringify(f.value));
              i.editable = !0, i.id = "", i.name = `${i.name} ${p("report.common.duplicate")}`, await r.createOrUpdateReport(i);
            } else
              f.value && await r.createOrUpdateReport(f.value);
            d.push({
              name: "reportView",
              query: n.query
            });
          });
        } catch (i) {
          console.log(i), D.open({
            message: p("report.messages.failedToAction", { action: l }),
            type: "error"
          });
        }
    }
    async function N() {
      var a;
      if (!f.value) return;
      await W({
        title: p("report.common.report", 1),
        message: p("report.editor.notSaved", { name: (a = f.value) == null ? void 0 : a.name })
      }) && (f.value = JSON.parse(JSON.stringify(x.value)), d.back());
    }
    Be(() => {
      f.value || d.push({ name: "reports" });
    });
    const A = [
      {
        label: p("report.common.default"),
        width: void 0,
        height: void 0
      },
      {
        label: p("report.editor.devices.desktop"),
        width: 1920,
        height: 1080
      },
      {
        label: p("report.editor.devices.tablet"),
        width: 820,
        height: 1180
      },
      {
        label: p("report.editor.devices.phone"),
        width: 390,
        height: 859
      }
    ], O = q(A[0]), H = q(!1), b = U(() => H.value ? Math.max(O.value.width || 0, O.value.height || 0) : Math.min(O.value.width || 0, O.value.height || 0)), P = U(() => H.value ? Math.min(O.value.width || 0, O.value.height || 0) : Math.max(O.value.width || 0, O.value.height || 0)), K = U(() => window.innerHeight - 72 - 56), Y = U(() => {
      if (!b.value) return 1;
      let h = (K.value - 48) / b.value, a = P.value * h;
      return a > window.innerWidth && (h = window.innerWidth / P.value, a = P.value * h), h > 1 ? 1 : h;
    });
    function v(h) {
      O.value = h;
    }
    function o() {
      H.value = !H.value;
    }
    return (h, a) => {
      const l = g("FmTooltip"), C = g("FmButton"), i = g("FmPageHead");
      return s(), $(qe, null, {
        default: u(() => [
          t(i, {
            actions: [
              { label: e(p)("report.common.cancel"), value: "cancel", isPrimary: !1 },
              { label: "Save Report", value: "save", isPrimary: !0, prependIcon: "download" }
            ],
            "onClick:action": a[0] || (a[0] = (c) => {
              c === "cancel" && N(), c === "save" && w();
            })
          }, {
            title: u(() => [
              _("div", ml, [
                t(l, {
                  content: B.value,
                  placement: "bottom"
                }, {
                  default: u(() => [
                    _("p", {
                      class: oe(`${e(V).sm || e(V).xs ? "hidden" : ""} text-ellipsis overflow-hidden text-nowrap fm-typo-en-title-md-600 w-[250px]`)
                    }, E(B.value), 3)
                  ]),
                  _: 1
                }, 8, ["content"]),
                _("div", cl, [
                  _("div", pl, [
                    (s(), S(J, null, X(A, (c) => {
                      var M;
                      return t(C, {
                        key: c.label,
                        label: c.label,
                        variant: ((M = O.value) == null ? void 0 : M.label) === c.label ? "primary" : "secondary",
                        size: "md",
                        onClick: (R) => v(c)
                      }, null, 8, ["label", "variant", "onClick"]);
                    }), 64))
                  ]),
                  t(C, {
                    icon: "screen_rotation",
                    variant: "tertiary",
                    size: "md",
                    class: "text-fm-color-typo-primary",
                    onClick: o
                  })
                ])
              ])
            ]),
            _: 1
          }, 8, ["actions"]),
          e(f) ? (s(), $(dl, {
            key: 0,
            modelValue: e(f),
            "onUpdate:modelValue": a[1] || (a[1] = (c) => ke(f) ? f.value = c : null),
            style: fe({ height: K.value + "px" }),
            class: oe(e(V).lg || e(V).md ? "flex" : ""),
            "hide-configuration": I.value,
            "preview-width": P.value,
            "preview-height": b.value,
            "preview-scale": Y.value,
            onHideConfiguration: a[2] || (a[2] = (c) => I.value = c)
          }, null, 8, ["modelValue", "style", "class", "hide-configuration", "preview-width", "preview-height", "preview-scale"])) : Q("", !0)
        ]),
        _: 1
      });
    };
  }
});
export {
  Vl as default
};
