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