@tenorlab/react-dashboard 1.0.6 → 1.0.8

package/dist/react-dashboard.es.js

@@ -0,0 +1,3256 @@
+import se, { useState as ce, useCallback as ue, useMemo as at, forwardRef as le, useRef as xt, Suspense as Ct, useEffect as St } from "react";
+import { jsxs as W, jsx as a } from "react/jsx-runtime";
+import st from "react-dom";
+const Dt = [
+  {
+    key: "grid-gap",
+    displayName: "Gap",
+    description: "Set the gap between widgets in the dashboard grid",
+    cssProperty: "--bwj-dashboard-gap",
+    step: 0.1,
+    defaultUnit: "rem",
+    minValue: 0,
+    defaultValue: "1.25rem",
+    value: "1.25rem"
+  },
+  {
+    key: "widget-width",
+    displayName: "Widget Width",
+    description: "Set the min width for the widgets",
+    cssProperty: "--bwj-widget-width",
+    step: 0.1,
+    defaultUnit: "rem",
+    minValue: 6,
+    defaultValue: "21rem",
+    value: "21rem"
+  },
+  {
+    key: "widget-border-radius",
+    displayName: "Widget Border Radius",
+    description: "Set the border radius for the widgets",
+    cssProperty: "--bwj-widget-border-radius",
+    step: 0.1,
+    defaultUnit: "rem",
+    minValue: 0,
+    defaultValue: "0.33rem",
+    value: "0.33rem"
+  },
+  {
+    key: "widget-inner-padding-x",
+    displayName: "Widget Horiz Padding",
+    description: "Set the horizontal padding for the widgets",
+    cssProperty: "--bwj-widget-inner-px",
+    step: 0.1,
+    defaultUnit: "rem",
+    minValue: 0,
+    defaultValue: "1.0rem",
+    value: "1.0rem"
+  },
+  {
+    key: "widget-inner-padding-y",
+    displayName: "Widget Vertical Padding",
+    description: "Set the vertical padding for the widgets",
+    cssProperty: "--bwj-widget-inner-py",
+    step: 0.1,
+    defaultUnit: "rem",
+    minValue: 0,
+    defaultValue: "0.75rem",
+    value: "0.75rem"
+  },
+  {
+    key: "widget-header-padding-y",
+    displayName: "Widget Header Vertical Padding",
+    description: "Set the vertical padding for the widget headers",
+    cssProperty: "--bwj-widget-header-py",
+    step: 0.1,
+    defaultUnit: "rem",
+    minValue: 0,
+    defaultValue: "1.0rem",
+    value: "1.0rem"
+  },
+  {
+    key: "widget-title-font-size",
+    displayName: "Widget Title Font Size",
+    description: "Set the font size for the widget titles",
+    cssProperty: "--bwj-widget-title-size",
+    step: 0.1,
+    defaultUnit: "rem",
+    minValue: 0,
+    defaultValue: "1.0rem",
+    value: "1.0rem"
+  }
+], Tt = ["rem", "pc", "cm", "in", "em", "vh", "vw", "%"], Nt = (e, n) => Tt.includes(e) ? n : 1, Et = {
+  incrementOrDecrementValue: (e, n) => {
+    const t = e.value.match(/([\d.]+)/), r = t ? parseFloat(t[1]) : 0, i = e.value.match(/([^\d.]+)/), o = i ? i[1] : e.defaultUnit, s = Nt(o, e.step) * n, p = `${Math.max(r + s, e.minValue).toFixed(1)}${o}`;
+    return {
+      ...e,
+      value: p
+    };
+  }
+}, Ce = {
+  userID: 0,
+  clientAppKey: "",
+  dashboardId: "default",
+  dashboardName: "Default",
+  zoomScale: 1,
+  responsiveGrid: !1,
+  widgets: [],
+  childWidgetsConfig: [],
+  cssSettings: [...Dt]
+}, Ae = 0.7, Fe = 1, _t = 0.05, lt = (e) => {
+  let n = Number(e || 0);
+  return n < Ae && (n = Ae), n > Fe && (n = Fe), n;
+}, _n = (e, n) => {
+  let t = Number(Number((_t * n).toFixed(2)).toFixed(2)), r = Number((Number(e) + t).toFixed(2));
+  return lt(r);
+}, Mn = (e) => {
+  let n = {
+    ...e
+  };
+  return n.widgets = n.widgets.filter((t) => {
+    if (`${t}`.includes("WidgetContainer")) {
+      const r = n.childWidgetsConfig.filter(
+        (i) => i.parentWidgetKey === t
+      );
+      if (!r || r.length === 0)
+        return n.widgets = n.widgets.filter(
+          (i) => i !== t
+        ), !1;
+    }
+    return !0;
+  }), n;
+}, Mt = (e) => {
+  const n = e.widgets.filter(
+    (r) => r.includes("WidgetContainer")
+  ), t = {};
+  return n.forEach((r, i) => {
+    const d = `${r.split("_container")[0]}_container${i + 1}`;
+    t[r] = d;
+  }), e.widgets = e.widgets.map((r) => t[r] || r), e.childWidgetsConfig = e.childWidgetsConfig.map((r) => {
+    const i = r.parentWidgetKey, o = t[i];
+    return {
+      ...r,
+      // If a new key exists, use it. If not, keep the original key.
+      parentWidgetKey: o || i
+    };
+  }), e;
+}, ge = (e, n) => {
+  const t = `${e}`.includes("Container"), r = t ? ["Container"] : ["Widget"], i = n?.title || e, o = n?.description || (t ? "Container" : "Unknown");
+  return {
+    title: i,
+    displayName: e,
+    description: o,
+    categories: r,
+    noDuplicatedWidgets: !0,
+    icon: void 0
+  };
+}, Pn = (e, n, t) => {
+  const r = n[e];
+  return r || ge(e, t);
+}, Pt = (e, n) => {
+  const r = n.get(e)?.meta;
+  return r || ge(e);
+}, $n = (e, n, t) => {
+  const r = t || ge(e);
+  return [
+    e,
+    {
+      key: e,
+      title: r.displayName,
+      isContainer: `${e}`.includes("Container"),
+      meta: r,
+      component: n
+    }
+  ];
+}, ct = (e, n, t) => {
+  const r = t || ge(e);
+  return [
+    e,
+    {
+      key: e,
+      title: r.displayName,
+      isContainer: !1,
+      meta: r,
+      loader: n
+    }
+  ];
+}, $t = (e) => {
+  const n = e.match(/\/widget-([a-zA-Z0-9-]+)\/index\.ts$/);
+  if (n && n[1]) {
+    const t = n[1], r = `Widget${t.split("-").map((o) => o.charAt(0).toUpperCase() + o.slice(1)).join("")}`, i = t.split("-").map((o) => o.charAt(0).toUpperCase() + o.slice(1)).join(" ");
+    return { key: r, title: i, folder: t };
+  }
+  return null;
+}, Wt = (e, n, t) => {
+  const r = `${n}/${t}/${t}.meta.ts`, i = e[r];
+  if (i && i[`${key}Meta`])
+    return i[`${key}Meta`];
+}, Wn = async (e, n, t) => {
+  const r = [];
+  for (const i in n) {
+    const o = n[i], s = $t(i);
+    if (s && o) {
+      const { key: d, title: p, folder: g } = s;
+      console.log("widgets-catalog: registering dynamic plugins", d, p, g);
+      let h = Wt(
+        //key,
+        t,
+        e,
+        g
+      );
+      h || (h = ge(d, {
+        title: p,
+        description: "Dynamic plugin widget"
+      })), r.push(ct(d, o, h));
+    }
+  }
+  return r;
+}, In = async (e) => new Promise(async (n, t) => {
+  const r = [];
+  try {
+    const o = await (await fetch(`${e}?${Math.random()}`)).json();
+    for (const s in o) {
+      const d = o[s], p = () => import(
+        /* @vite-ignore */
+        d.url
+      ), g = {
+        displayName: d.meta.displayName,
+        description: d.meta.description || "Remote Plugin",
+        categories: d.meta.categories || ["Widget"],
+        noDuplicatedWidgets: d.meta.noDuplicatedWidgets ?? !0,
+        icon: void 0
+        // Or a logic to map a string name to a Lucide component
+      };
+      r.push(ct(s, p, g));
+    }
+    n({
+      entries: r,
+      message: "",
+      details: ""
+    });
+  } catch (i) {
+    console.error("Remote plugin discovery failed:", i), t({
+      entries: [],
+      message: "Remote plugin discovery failed:",
+      details: typeof i == "object" ? JSON.stringify(i) : i
+    });
+  }
+}), Le = (e) => {
+  let n;
+  const t = /* @__PURE__ */ new Set(), r = (g, h) => {
+    const u = typeof g == "function" ? g(n) : g;
+    if (!Object.is(u, n)) {
+      const m = n;
+      n = h ?? (typeof u != "object" || u === null) ? u : Object.assign({}, n, u), t.forEach((y) => y(n, m));
+    }
+  }, i = () => n, d = { setState: r, getState: i, getInitialState: () => p, subscribe: (g) => (t.add(g), () => t.delete(g)) }, p = n = e(r, i, d);
+  return d;
+}, It = ((e) => e ? Le(e) : Le), Ot = (e) => e;
+function Rt(e, n = Ot) {
+  const t = se.useSyncExternalStore(
+    e.subscribe,
+    se.useCallback(() => n(e.getState()), [e, n]),
+    se.useCallback(() => n(e.getInitialState()), [e, n])
+  );
+  return se.useDebugValue(t), t;
+}
+const kt = (e) => {
+  const n = It(e), t = (r) => Rt(n, r);
+  return Object.assign(t, n), t;
+}, jt = ((e) => kt), At = (e) => {
+  const n = e.widgets.filter((r) => r.includes("WidgetContainer")).map((r) => Number(r.split("_")[1].replace("container", "")));
+  return `container${n.length > 0 ? Math.max(...n) + 1 : 1}`;
+}, Ft = (e, n) => {
+  const t = At(e);
+  return `${n}_${t}`;
+}, Lt = (e) => {
+  const { dashboardConfig: n, widgetKey: t, parentWidgetKey: r, noDuplicatedWidgets: i } = e;
+  if (r) {
+    if (i && n.childWidgetsConfig.find(
+      (s) => s.parentWidgetKey === r && s.widgetKey === t
+    ))
+      return {
+        success: !1,
+        message: `DashboardStore: addWidget: Widget already added (${t})`,
+        updatedDashboardConfig: n
+      };
+    const o = [
+      ...n.childWidgetsConfig,
+      { parentWidgetKey: r, widgetKey: t }
+      // new entry
+    ];
+    return {
+      success: !0,
+      updatedDashboardConfig: {
+        ...n,
+        childWidgetsConfig: o
+      }
+    };
+  } else {
+    if (i && n.widgets.includes(t))
+      return {
+        success: !1,
+        message: `DashboardStore: addWidget: Widget already added (${t})`,
+        updatedDashboardConfig: n
+      };
+    const o = [...n.widgets, t];
+    return {
+      success: !0,
+      updatedDashboardConfig: {
+        ...n,
+        widgets: o
+      }
+    };
+  }
+}, Ut = (e, n, t) => {
+  if ((t || "").trim().length > 0) {
+    const r = e.childWidgetsConfig.filter(
+      (p) => p.parentWidgetKey !== t
+    ), i = e.childWidgetsConfig.filter(
+      (p) => p.parentWidgetKey === t && p.widgetKey !== n
+    ), o = [...r, ...i];
+    let s = {
+      ...e,
+      childWidgetsConfig: o
+    };
+    return `${n}`.includes("Container") && (s = Mt(s)), {
+      success: !0,
+      updatedDashboardConfig: s
+    };
+  } else {
+    const r = e.widgets.filter((o) => o !== n), i = e.childWidgetsConfig.filter(
+      (o) => o.parentWidgetKey !== n
+    );
+    return {
+      success: !0,
+      updatedDashboardConfig: {
+        ...e,
+        widgets: r,
+        childWidgetsConfig: i
+      }
+    };
+  }
+}, Vt = (e, n, t, r) => {
+  if ((r || "").trim().length > 0) {
+    const i = e.childWidgetsConfig.filter(
+      (h) => h.parentWidgetKey !== r
+    );
+    let o = e.childWidgetsConfig.filter(
+      (h) => h.parentWidgetKey === r
+    );
+    const s = o.indexOf(t);
+    let d = s + n;
+    if (d = Math.max(0, d), d = Math.min(o.length - 1, d), d === s)
+      return {
+        success: !1,
+        message: `DashboardStore: moveWidget: Widget already at min/max position (${t})`,
+        updatedDashboardConfig: e
+      };
+    const p = [...o], [g] = p.splice(s, 1);
+    return p.splice(d, 0, g), {
+      success: !0,
+      updatedDashboardConfig: {
+        ...e,
+        childWidgetsConfig: [...i, ...p]
+      }
+    };
+  } else {
+    const i = e.widgets || [], o = i.indexOf(t);
+    let s = o + n;
+    if (s = Math.max(0, s), s = Math.min(i.length - 1, s), s === o)
+      return {
+        success: !1,
+        message: `DashboardStore: moveWidget: Widget already at min/max position (${t})`,
+        updatedDashboardConfig: e
+      };
+    const d = [...i], [p] = d.splice(o, 1);
+    return d.splice(s, 0, p), {
+      success: !0,
+      updatedDashboardConfig: {
+        ...e,
+        widgets: d
+      }
+    };
+  }
+}, Yt = (e, n) => ({
+  isLoading: !1,
+  isEditing: !1,
+  allDashboardConfigs: [Ce],
+  currentDashboardConfig: Ce,
+  targetContainerKey: void 0,
+  getNextContainerKey: (t) => Ft(n().currentDashboardConfig, t),
+  setIsLoading: (t) => (e(() => ({ isLoading: t })), t),
+  setIsEditing: (t) => {
+    let r = n().targetContainerKey;
+    return t || (r = void 0), e(() => ({ isEditing: t, targetContainerKey: r })), t;
+  },
+  setTargetContainerKey: (t) => (e(() => ({ targetContainerKey: t })), t),
+  setAllDashboardConfigs: (t) => (e(() => ({ allDashboardConfigs: t })), n().allDashboardConfigs),
+  setCurrentDashboardConfig: (t) => {
+    const r = n(), i = [
+      ...r.allDashboardConfigs.filter((o) => o.dashboardId !== t.dashboardId),
+      t
+    ];
+    return e(() => ({
+      ...r,
+      allDashboardConfigs: i,
+      currentDashboardConfig: t
+    })), i;
+  },
+  addDashboardConfig: (t) => {
+    const r = n(), i = [
+      ...r.allDashboardConfigs.filter((o) => o.dashboardId !== t.dashboardId),
+      t
+    ];
+    return e(() => ({
+      ...r,
+      allDashboardConfigs: i,
+      currentDashboardConfig: t
+    })), i;
+  },
+  deleteDashboardConfigById: (t) => {
+    const r = n(), i = [...r.allDashboardConfigs.filter((o) => o.dashboardId !== t)];
+    return e(() => ({
+      ...r,
+      allDashboardConfigs: i,
+      currentDashboardConfig: i[0] || Ce
+    })), i;
+  },
+  selectDashboardById: (t) => (e(() => {
+    const r = n(), i = r.allDashboardConfigs.find((o) => o.dashboardId === t);
+    return i ? {
+      currentDashboardConfig: i
+    } : {
+      ...r
+    };
+  }), n().currentDashboardConfig),
+  addWidget: (t) => {
+    const r = n(), i = Lt({
+      dashboardConfig: r.currentDashboardConfig,
+      ...t
+    }), o = [
+      ...r.allDashboardConfigs.filter(
+        (s) => s.dashboardId !== i.updatedDashboardConfig.dashboardId
+      ),
+      i.updatedDashboardConfig
+    ];
+    return i.success && e(() => ({
+      allDashboardConfigs: o,
+      currentDashboardConfig: i.updatedDashboardConfig
+    })), {
+      ...i,
+      allUpdatedDashboardConfigs: o
+    };
+  },
+  removeWidget: (t, r) => {
+    const i = n(), o = Ut(i.currentDashboardConfig, t, r), s = [
+      ...i.allDashboardConfigs.filter(
+        (d) => d.dashboardId !== o.updatedDashboardConfig.dashboardId
+      ),
+      o.updatedDashboardConfig
+    ];
+    return o.success && e(() => ({
+      allDashboardConfigs: s,
+      currentDashboardConfig: o.updatedDashboardConfig
+    })), {
+      ...o,
+      allUpdatedDashboardConfigs: s
+    };
+  },
+  moveWidget: (t, r, i) => {
+    const o = n(), s = Vt(o.currentDashboardConfig, t, r, i), d = [
+      ...o.allDashboardConfigs.filter(
+        (p) => p.dashboardId !== s.updatedDashboardConfig.dashboardId
+      ),
+      s.updatedDashboardConfig
+    ];
+    return s.success && e(() => ({
+      allDashboardConfigs: d,
+      currentDashboardConfig: s.updatedDashboardConfig
+    })), {
+      ...s,
+      allUpdatedDashboardConfigs: d
+    };
+  }
+}), On = jt()((...e) => ({
+  ...Yt(...e)
+})), dt = (e, n) => `dashboards_${n}_${e}`, qt = async (e, n, t, r) => {
+  const i = localStorage.getItem(dt(e, n));
+  if (i)
+    try {
+      const o = JSON.parse(i);
+      return o.length < 1 ? [r] : (o.forEach((s) => {
+        s.dashboardId || (s.dashboardId = "default"), s.dashboardName || (s.dashboardName = `Dashboard ${s.dashboardId}`), s.responsiveGrid = s.responsiveGrid ?? !1, (s.widgets || []).length < 1 && (s.widgets = r.widgets);
+        const d = (s.cssSettings || []).filter(
+          (p) => r.cssSettings.some((g) => g.key === p.key)
+        );
+        if (d.length < 1)
+          s.cssSettings = [...r.cssSettings];
+        else {
+          d.forEach((g) => {
+            g.value = (g.value || "").replace(/NaN/g, "");
+            const h = r.cssSettings.find(
+              (u) => u.key === g.key
+            );
+            h && (Object.keys(h).forEach((u) => {
+              u in g || (g[u] = h[u]);
+            }), g.step = h.step, g.minValue = h.minValue, g.defaultValue = h.defaultValue, g.defaultUnit = h.defaultUnit, /\d+/g.test(g.value) === !1 && (g.value = h ? h.value : "1.0rem"));
+          });
+          const p = r.cssSettings.filter((g) => !d.some(
+            (h) => h.key === g.key
+          ));
+          s.cssSettings = [...d, ...p];
+        }
+        s.widgets = s.widgets.filter(
+          (p) => p.includes("WidgetContainer") || t.has(p)
+        ), s.childWidgetsConfig = s.childWidgetsConfig.filter(
+          (p) => t.has(p.widgetKey)
+        ), s.zoomScale ? s.zoomScale < 0.7 && (s.zoomScale = 0.7) : s.zoomScale = 1;
+      }), o);
+    } catch (o) {
+      console.warn("Error parsing saved dashboard config:", o);
+    }
+  return [r];
+}, zt = async (e, n, t, r) => {
+  t.forEach((o) => {
+    if (o.userID = e, o.clientAppKey = n, o.responsiveGrid = o.responsiveGrid ?? !1, typeof o != "object")
+      throw new Error("Invalid dashboard configuration");
+    o.widgets = o.widgets.filter(
+      (s) => s.includes("WidgetContainer") || r.has(s)
+    ), o.childWidgetsConfig = o.childWidgetsConfig.filter(
+      (s) => r.has(s.widgetKey)
+    ), o.zoomScale ? o.zoomScale < 0.7 && (o.zoomScale = 0.7) : o.zoomScale = 1;
+  });
+  const i = JSON.stringify(t);
+  return localStorage.setItem(dt(e, n), i), !0;
+}, Bt = {
+  getSavedDashboards: qt,
+  saveDashboards: zt
+}, Rn = () => Bt, kn = () => {
+  const [e, n] = ce({}), [t, r] = ce({}), i = ue((h) => {
+    const u = h.dashboardId;
+    n((m) => {
+      const y = {
+        undoIndex: 0,
+        config: h
+      };
+      return r((x) => ({
+        ...x,
+        [u]: 0
+      })), {
+        ...m,
+        [u]: [y]
+        // Forces a reset to just this one entry
+      };
+    });
+  }, []), o = ue(
+    (h) => {
+      n((u) => {
+        const m = h.dashboardId, y = u[m] || [], x = t[m] ?? -1, v = y.slice(0, x + 1), b = {
+          undoIndex: v.length,
+          // New index based on trimmed length
+          config: h
+        }, C = [...v, b];
+        return r((T) => ({
+          ...T,
+          [m]: C.length - 1
+          // Index is now the last element's index
+        })), {
+          ...u,
+          [m]: C
+        };
+      });
+    },
+    [t]
+  ), s = ue((h) => {
+    n((u) => {
+      if (!u[h])
+        return u;
+      const { [h]: m, ...y } = u;
+      return y;
+    }), r((u) => {
+      const { [h]: m, ...y } = u;
+      return y;
+    });
+  }, []), d = ue(
+    (h) => {
+      r((u) => {
+        const m = u[h] ?? -1, y = Math.max(0, m - 1);
+        return y !== m ? { ...u, [h]: y } : u;
+      });
+    },
+    [
+      //loadConfigFromHistory
+    ]
+  ), p = ue(
+    (h) => {
+      r((u) => {
+        const m = e[h]?.length || 0, y = u[h] ?? -1, x = Math.min(m - 1, y + 1);
+        return x !== y ? { ...u, [h]: x } : u;
+      });
+    },
+    [
+      e
+      //loadConfigFromHistory,
+    ]
+  );
+  return {
+    initializeHistoryForDashboard: i,
+    resetAllHistory: () => n({}),
+    addUndoEntry: o,
+    removeUndoHistoryForDashboard: s,
+    undo: d,
+    redo: p,
+    getUndoStatus: (h) => {
+      const u = t[h] ?? -1, m = e[h]?.length || 0, y = u <= 0, x = u >= m - 1;
+      return { isUndoDisabled: y, isRedoDisabled: x };
+    },
+    undoHistory: e,
+    historyIndex: t
+    // (Optional: You might expose undoHistory and historyIndex if needed for debugging)
+  };
+};
+function K({
+  children: e,
+  className: n
+}) {
+  return /* @__PURE__ */ a(
+    "svg",
+    {
+      xmlns: "http://www.w3.org/2000/svg",
+      width: "24",
+      height: "24",
+      viewBox: "0 0 24 24",
+      fill: "none",
+      stroke: "currentColor",
+      strokeWidth: "2",
+      strokeLinecap: "round",
+      strokeLinejoin: "round",
+      className: n,
+      children: e
+    }
+  );
+}
+function jn({ className: e }) {
+  return /* @__PURE__ */ W(K, { className: `lucide lucide-circle-plus-icon lucide-circle-plus ${e}`, children: [
+    /* @__PURE__ */ a("circle", { cx: "12", cy: "12", r: "10" }),
+    /* @__PURE__ */ a("path", { d: "M8 12h8" }),
+    /* @__PURE__ */ a("path", { d: "M12 8v8" })
+  ] });
+}
+function An({ className: e }) {
+  return /* @__PURE__ */ W(K, { className: `lucide lucide-trash2-icon lucide-trash-2 ${e}`, children: [
+    /* @__PURE__ */ a("path", { d: "M10 11v6" }),
+    /* @__PURE__ */ a("path", { d: "M14 11v6" }),
+    /* @__PURE__ */ a("path", { d: "M19 6v14a2 2 0 0 1-2 2H7a2 2 0 0 1-2-2V6" }),
+    /* @__PURE__ */ a("path", { d: "M3 6h18" }),
+    /* @__PURE__ */ a("path", { d: "M8 6V4a2 2 0 0 1 2-2h4a2 2 0 0 1 2 2v2" })
+  ] });
+}
+function Fn({ className: e }) {
+  return /* @__PURE__ */ W(K, { className: `lucide lucide-square-pen-icon lucide-square-pen ${e}`, children: [
+    /* @__PURE__ */ a("path", { d: "M12 3H5a2 2 0 0 0-2 2v14a2 2 0 0 0 2 2h14a2 2 0 0 0 2-2v-7" }),
+    /* @__PURE__ */ a("path", { d: "M18.375 2.625a1 1 0 0 1 3 3l-9.013 9.014a2 2 0 0 1-.853.505l-2.873.84a.5.5 0 0 1-.62-.62l.84-2.873a2 2 0 0 1 .506-.852z" })
+  ] });
+}
+function Ln({ className: e }) {
+  return /* @__PURE__ */ W(K, { className: `lucide lucide-grid3x3-icon lucide-grid-3x3 ${e}`, children: [
+    /* @__PURE__ */ a("rect", { width: "18", height: "18", x: "3", y: "3", rx: "2" }),
+    /* @__PURE__ */ a("path", { d: "M3 9h18" }),
+    /* @__PURE__ */ a("path", { d: "M3 15h18" }),
+    /* @__PURE__ */ a("path", { d: "M9 3v18" }),
+    /* @__PURE__ */ a("path", { d: "M15 3v18" })
+  ] });
+}
+function Un({ className: e }) {
+  return /* @__PURE__ */ W(K, { className: `lucide lucide-monitor-icon lucide-monitor ${e}`, children: [
+    /* @__PURE__ */ a("rect", { width: "20", height: "14", x: "2", y: "3", rx: "2" }),
+    /* @__PURE__ */ a("line", { x1: "8", x2: "16", y1: "21", y2: "21" }),
+    /* @__PURE__ */ a("line", { x1: "12", x2: "12", y1: "17", y2: "21" })
+  ] });
+}
+function Vn({ className: e }) {
+  return /* @__PURE__ */ W(
+    K,
+    {
+      className: `lucide lucide-monitor-smartphone-icon lucide-monitor-smartphone ${e}`,
+      children: [
+        /* @__PURE__ */ a("path", { d: "M18 8V6a2 2 0 0 0-2-2H4a2 2 0 0 0-2 2v7a2 2 0 0 0 2 2h8" }),
+        /* @__PURE__ */ a("path", { d: "M10 19v-3.96 3.15" }),
+        /* @__PURE__ */ a("path", { d: "M7 19h5" }),
+        /* @__PURE__ */ a("rect", { width: "6", height: "10", x: "16", y: "12", rx: "2" })
+      ]
+    }
+  );
+}
+function ut({ className: e }) {
+  return /* @__PURE__ */ W(
+    K,
+    {
+      className: `lucide lucide-circle-arrow-left-icon lucide-circle-arrow-left ${e}`,
+      children: [
+        /* @__PURE__ */ a("circle", { cx: "12", cy: "12", r: "10" }),
+        /* @__PURE__ */ a("path", { d: "m12 8-4 4 4 4" }),
+        /* @__PURE__ */ a("path", { d: "M16 12H8" })
+      ]
+    }
+  );
+}
+function ft({ className: e }) {
+  return /* @__PURE__ */ W(
+    K,
+    {
+      className: `lucide lucide-circle-arrow-right-icon lucide-circle-arrow-right ${e}`,
+      children: [
+        /* @__PURE__ */ a("circle", { cx: "12", cy: "12", r: "10" }),
+        /* @__PURE__ */ a("path", { d: "m12 16 4-4-4-4" }),
+        /* @__PURE__ */ a("path", { d: "M8 12h8" })
+      ]
+    }
+  );
+}
+function Kt({ className: e }) {
+  return /* @__PURE__ */ W(K, { className: `lucide lucide-settings-icon lucide-settings ${e}`, children: [
+    /* @__PURE__ */ a("path", { d: "M9.671 4.136a2.34 2.34 0 0 1 4.659 0 2.34 2.34 0 0 0 3.319 1.915 2.34 2.34 0 0 1 2.33 4.033 2.34 2.34 0 0 0 0 3.831 2.34 2.34 0 0 1-2.33 4.033 2.34 2.34 0 0 0-3.319 1.915 2.34 2.34 0 0 1-4.659 0 2.34 2.34 0 0 0-3.32-1.915 2.34 2.34 0 0 1-2.33-4.033 2.34 2.34 0 0 0 0-3.831A2.34 2.34 0 0 1 6.35 6.051a2.34 2.34 0 0 0 3.319-1.915" }),
+    /* @__PURE__ */ a("circle", { cx: "12", cy: "12", r: "3" })
+  ] });
+}
+function Yn({ className: e }) {
+  return /* @__PURE__ */ W(
+    K,
+    {
+      className: `lucide lucide-tablet-smartphone-icon lucide-tablet-smartphone ${e}`,
+      children: [
+        /* @__PURE__ */ a("rect", { width: "10", height: "14", x: "3", y: "8", rx: "2" }),
+        /* @__PURE__ */ a("path", { d: "M5 4a2 2 0 0 1 2-2h12a2 2 0 0 1 2 2v16a2 2 0 0 1-2 2h-2.4" }),
+        /* @__PURE__ */ a("path", { d: "M8 18h.01" })
+      ]
+    }
+  );
+}
+function ht({ className: e }) {
+  return /* @__PURE__ */ W(K, { className: `lucide lucide-circle-x-icon lucide-circle-x ${e}`, children: [
+    /* @__PURE__ */ a("circle", { cx: "12", cy: "12", r: "10" }),
+    /* @__PURE__ */ a("path", { d: "m15 9-6 6" }),
+    /* @__PURE__ */ a("path", { d: "m9 9 6 6" })
+  ] });
+}
+function qn({ className: e }) {
+  return /* @__PURE__ */ W(K, { className: `lucide lucide-zoom-in-icon lucide-zoom-in ${e}`, children: [
+    /* @__PURE__ */ a("circle", { cx: "11", cy: "11", r: "8" }),
+    /* @__PURE__ */ a("line", { x1: "21", x2: "16.65", y1: "21", y2: "16.65" }),
+    /* @__PURE__ */ a("line", { x1: "11", x2: "11", y1: "8", y2: "14" }),
+    /* @__PURE__ */ a("line", { x1: "8", x2: "14", y1: "11", y2: "11" })
+  ] });
+}
+function zn({ className: e }) {
+  return /* @__PURE__ */ W(K, { className: `lucide lucide-zoom-out-icon lucide-zoom-out ${e}`, children: [
+    /* @__PURE__ */ a("circle", { cx: "11", cy: "11", r: "8" }),
+    /* @__PURE__ */ a("line", { x1: "21", x2: "16.65", y1: "21", y2: "16.65" }),
+    /* @__PURE__ */ a("line", { x1: "8", x2: "14", y1: "11", y2: "11" })
+  ] });
+}
+function Ht({ className: e }) {
+  return /* @__PURE__ */ W(K, { className: `lucide lucide-timer-reset-icon lucide-timer-reset ${e}`, children: [
+    /* @__PURE__ */ a("path", { d: "M10 2h4" }),
+    /* @__PURE__ */ a("path", { d: "M12 14v-4" }),
+    /* @__PURE__ */ a("path", { d: "M4 13a8 8 0 0 1 8-7 8 8 0 1 1-5.3 14L4 17.6" }),
+    /* @__PURE__ */ a("path", { d: "M9 17H4v5" })
+  ] });
+}
+function Xt({ className: e }) {
+  return /* @__PURE__ */ W(K, { className: `lucide lucide-undo-icon lucide-undo ${e}`, children: [
+    /* @__PURE__ */ a("path", { d: "M3 7v6h6" }),
+    /* @__PURE__ */ a("path", { d: "M21 17a9 9 0 0 0-9-9 9 9 0 0 0-6 2.3L3 13" })
+  ] });
+}
+function Gt({ className: e }) {
+  return /* @__PURE__ */ W(K, { className: `lucide lucide-redo-icon lucide-redo ${e}`, children: [
+    /* @__PURE__ */ a("path", { d: "M21 7v6h-6" }),
+    /* @__PURE__ */ a("path", { d: "M3 17a9 9 0 0 1 9-9 9 9 0 0 1 6 2.3l3 2.7" })
+  ] });
+}
+function Zt({ className: e }) {
+  return /* @__PURE__ */ W(K, { className: `lucide lucide-hand-icon lucide-hand ${e}`, children: [
+    /* @__PURE__ */ a("path", { d: "M18 11V6a2 2 0 0 0-2-2a2 2 0 0 0-2 2" }),
+    /* @__PURE__ */ a("path", { d: "M14 10V4a2 2 0 0 0-2-2a2 2 0 0 0-2 2v2" }),
+    /* @__PURE__ */ a("path", { d: "M10 10.5V6a2 2 0 0 0-2-2a2 2 0 0 0-2 2v8" }),
+    /* @__PURE__ */ a("path", { d: "M18 8a2 2 0 1 1 4 0v6a8 8 0 0 1-8 8h-2c-2.8 0-4.5-.86-5.99-2.34l-3.6-3.6a2 2 0 0 1 2.83-2.82L7 15" })
+  ] });
+}
+function Jt({ className: e }) {
+  return /* @__PURE__ */ W(K, { className: `lucide lucide-hand-grab-icon lucide-hand-grab ${e}`, children: [
+    /* @__PURE__ */ a("path", { d: "M18 11.5V9a2 2 0 0 0-2-2a2 2 0 0 0-2 2v1.4" }),
+    /* @__PURE__ */ a("path", { d: "M14 10V8a2 2 0 0 0-2-2a2 2 0 0 0-2 2v2" }),
+    /* @__PURE__ */ a("path", { d: "M10 9.9V9a2 2 0 0 0-2-2a2 2 0 0 0-2 2v5" }),
+    /* @__PURE__ */ a("path", { d: "M6 14a2 2 0 0 0-2-2a2 2 0 0 0-2 2" }),
+    /* @__PURE__ */ a("path", { d: "M18 11a2 2 0 1 1 4 0v3a8 8 0 0 1-8 8h-4a8 8 0 0 1-8-8 2 2 0 1 1 4 0" })
+  ] });
+}
+function Qt({ className: e }) {
+  return /* @__PURE__ */ W(K, { className: `lucide lucide-crosshair-icon lucide-crosshair ${e}`, children: [
+    /* @__PURE__ */ a("line", { x1: "22", x2: "18", y1: "12", y2: "12" }),
+    /* @__PURE__ */ a("line", { x1: "6", x2: "2", y1: "12", y2: "12" }),
+    /* @__PURE__ */ a("line", { x1: "12", x2: "12", y1: "6", y2: "2" }),
+    /* @__PURE__ */ a("line", { x1: "12", x2: "12", y1: "22", y2: "18" })
+  ] });
+}
+function Bn({ className: e }) {
+  return /* @__PURE__ */ W(K, { className: `lucide lucide-target-icon lucide-target ${e}`, children: [
+    /* @__PURE__ */ a("circle", { cx: "12", cy: "12", r: "10" }),
+    /* @__PURE__ */ a("circle", { cx: "12", cy: "12", r: "6" }),
+    /* @__PURE__ */ a("circle", { cx: "12", cy: "12", r: "2" })
+  ] });
+}
+function en({ className: e }) {
+  return /* @__PURE__ */ W(
+    K,
+    {
+      className: `lucide lucide-file-question-mark-icon lucide-file-question-mark ${e}`,
+      children: [
+        /* @__PURE__ */ a("circle", { cx: "12", cy: "12", r: "10" }),
+        /* @__PURE__ */ a("path", { d: "M9.09 9a3 3 0 0 1 5.83 1c0 2-3 3-3 3" }),
+        /* @__PURE__ */ a("path", { d: "M12 17h.01" })
+      ]
+    }
+  );
+}
+const Z = (e, ...n) => [
+  ...new Set(
+    [e || "", ...n].join(" ").trim().replace(/\n+/gi, " ").replace(/\s+/gi, " ").split(" ")
+  )
+].join(" ").trim(), re = (e, n = "color") => {
+  if (typeof window > "u") return "#FFFFFF";
+  const t = document.createElement("div");
+  Array.isArray(e) ? e.forEach((i) => t.classList.add(i)) : e.split(" ").forEach((i) => t.classList.add(i)), t.style.display = "none", document.body.appendChild(t);
+  const r = window.getComputedStyle(t)[n];
+  return document.body.removeChild(t), r;
+}, Kn = {
+  primary: re("text-primary", "color"),
+  secondary: re("text-secondary", "color"),
+  success: re("text-success", "color"),
+  danger: re("text-danger", "color"),
+  warning: re("text-warning", "color"),
+  info: re("text-info", "color"),
+  disabled: re("text-disabled", "color"),
+  neutral: re("text-neutral", "color"),
+  body: re("text-body", "color")
+}, Hn = {
+  getCssVariableValue: (e) => {
+    const n = document.documentElement;
+    return getComputedStyle(n).getPropertyValue(e).trim() || null;
+  },
+  setCssVariableValue: (e, n) => {
+    document.documentElement.style.setProperty(e, n);
+  },
+  restoreCssVarsFromSettings: (e) => {
+    const n = document.documentElement;
+    e.forEach((t) => {
+      n.style.setProperty(t.cssProperty, t.value);
+    });
+  }
+}, gt = (e) => {
+  const n = `${e}`.split("_");
+  return n.length > 1 ? n[1].replace(/(\D)(\d+)/, "$1 $2") : "Container";
+}, mt = ({
+  label: e,
+  className: n,
+  size: t = "medium",
+  value: r,
+  onChange: i,
+  onKeyDown: o,
+  placeholder: s = ""
+}) => {
+  const d = at(() => t === "small" ? "py-1.5 px-3 text-sm" : "py-2.5 px-4 text-base", [t]), p = Z("flex flex-col mb-4", n || ""), h = `${Z(`
+    block w-full rounded-md px-3 py-1.5 text-base 
+    bg-formfield content-formfield
+    outline-1 -outline-offset-1 outline-primary 
+    placeholder:text-disabled 
+    focus:outline-2 focus:-outline-offset-2 focus:outline-indigo-200 sm:text-sm/6
+  `)} ${d}`;
+  return /* @__PURE__ */ W("div", { className: p, children: [
+    /* @__PURE__ */ a("label", { htmlFor: e, className: "block text-sm/6 font-medium mb-1.5", children: e }),
+    /* @__PURE__ */ a(
+      "input",
+      {
+        id: e,
+        type: "text",
+        value: r,
+        onChange: i,
+        onKeyDown: (u) => o && o(u),
+        placeholder: s,
+        className: h,
+        "aria-label": e
+      }
+    )
+  ] });
+}, Se = /* @__PURE__ */ new Map([
+  [
+    "normal",
+    "group bg-[category] content-[category] hover:bg-[category] group-hover:bg-[category] focus:outline-[category] focus:outline-offset-[category]"
+  ],
+  [
+    "ghost",
+    "group bg-transparent border-[category] text-[category] hover:text-[category] group-hover:text-[category] focus:outline-[category] focus:outline-offset-[category]"
+  ]
+]);
+function J(e) {
+  const {
+    tooltip: n,
+    disabled: t,
+    isIconButton: r,
+    className: i,
+    buttonType: o,
+    category: s,
+    px: d,
+    py: p,
+    children: g,
+    ...h
+  } = e, u = () => {
+    const y = e.isIconButton || !1, x = e.category || "primary", v = e.buttonType || "normal", b = e.disabled || !1, C = e.className || "", T = e.font || "semibold", S = Number((e.border || 0) > 0 ? e.border : 0);
+    let D = (e.borderColor || "").trim();
+    D = D.length > 0 ? D : "";
+    const c = Number((e.borderHover || 0) > 0 ? e.borderHover : 0), N = e.shadow || "sm", l = e.shadowHover || "md", f = (e.addCss || "").trim(), P = e.justifyCss || "justify-center";
+    if (y)
+      return Z(
+        "flex flex-row items-center",
+        b ? "text-disabled" : `text-${x} hover:brightness-110 cursor-pointer`,
+        C || ""
+      );
+    const $ = [
+      "relative cursor-pointer",
+      "rounded-sm focus:outline-none focus:ring focus:ring-offset",
+      "transition-all duration-150",
+      "text-sm",
+      `font-${T}`
+    ];
+    if (b)
+      v === "ghost" ? $.push("text-disabled border-disabled cursor-not-allowed") : $.push("bg-disabled content-disabled border-disabled cursor-not-allowed");
+    else {
+      $.push("cursor-pointer");
+      let O = "";
+      Se.has(v) ? O = `${Se.get(v)}` : O = `${Se.get("normal")}`, S < 1 && (O = O.replace("border-[category]", ""));
+      const E = O.replace(/\[category\]/g, x).trim();
+      $.push(E);
+    }
+    return S > 0 ? ($.push(`border-[${S}px]`), $.push(`border-${D}`)) : ($.push("border-[1px]"), $.push("border-transparent")), c > 0 ? ($.push(`hover:border-[${c}px] group-hover:border-[${c}px]`), $.push(`hover:border-${D} group-hover:border-${D}`)) : $.push("hover:border-[1px] group-hover:border-[1px]"), $.push(`shadow-${N}`), $.push(`hover:shadow-${l} group-hover:shadow-${l}`), f.length > 0 && $.push(f), f.indexOf("hidden") === -1 && $.push("inline-flex"), $.push(P), $.join(" ").trim();
+  }, m = () => {
+    const y = e.px || 0.7, x = e.py || 0.25;
+    return {
+      padding: r ? 0 : `${x}rem ${y}rem `
+    };
+  };
+  return /* @__PURE__ */ a("button", { type: "button", disabled: t, className: u(), style: m(), ...h, children: g });
+}
+const tn = (e) => e.direction === "row" ? Z("flex flex-row items-center gap-2", e.classNames || "") : Z("flex flex-col gap-2 w-full", e.classNames || "");
+function nn(e) {
+  const { children: n, testId: t, classNames: r, direction: i, ...o } = e, s = tn(e);
+  return /* @__PURE__ */ a("div", { "data-testid": t || "not-set", className: s, ...o, children: n });
+}
+const Xn = le(
+  (e, n) => {
+    const { classNames: t, innerClass: r, ...i } = e, o = Z(t || "", "w-full"), s = Z(
+      `w-full flex overflow-hidden justify-between items-center gap-0 
+      rounded-md border`,
+      r || ""
+    );
+    return /* @__PURE__ */ a(nn, { direction: "row", classNames: o, ...i, children: /* @__PURE__ */ a("div", { className: s, children: e.children }) });
+  }
+), Gn = le((e, n) => /* @__PURE__ */ a(
+  "div",
+  {
+    "data-testid": e.testId || "not-set",
+    className: "flex items-center justify-center",
+    style: {
+      flexShrink: 0,
+      padding: "0.75rem 0 0.75rem 0.75rem"
+    },
+    children: e.children
+  }
+)), Zn = le(
+  (e, n) => /* @__PURE__ */ a(
+    "div",
+    {
+      "data-testid": e.testId || "not-set",
+      className: "flex-1 flex flex-col gap-0 truncate p-2",
+      children: e.children
+    }
+  )
+), Jn = le((e, n) => /* @__PURE__ */ a(
+  "div",
+  {
+    "data-testid": e.testId || "not-set",
+    className: "flex flex-row items-center justify-between gap-1 h-full",
+    style: {
+      flexShrink: 0,
+      paddingRight: "0.65rem"
+    },
+    children: e.children
+  }
+));
+function rn(e) {
+  return e && e.__esModule && Object.prototype.hasOwnProperty.call(e, "default") ? e.default : e;
+}
+var fe = { exports: {} }, De = {}, pe = { exports: {} }, ye = { exports: {} }, V = {};
+var Ue;
+function on() {
+  if (Ue) return V;
+  Ue = 1;
+  var e = typeof Symbol == "function" && Symbol.for, n = e ? /* @__PURE__ */ Symbol.for("react.element") : 60103, t = e ? /* @__PURE__ */ Symbol.for("react.portal") : 60106, r = e ? /* @__PURE__ */ Symbol.for("react.fragment") : 60107, i = e ? /* @__PURE__ */ Symbol.for("react.strict_mode") : 60108, o = e ? /* @__PURE__ */ Symbol.for("react.profiler") : 60114, s = e ? /* @__PURE__ */ Symbol.for("react.provider") : 60109, d = e ? /* @__PURE__ */ Symbol.for("react.context") : 60110, p = e ? /* @__PURE__ */ Symbol.for("react.async_mode") : 60111, g = e ? /* @__PURE__ */ Symbol.for("react.concurrent_mode") : 60111, h = e ? /* @__PURE__ */ Symbol.for("react.forward_ref") : 60112, u = e ? /* @__PURE__ */ Symbol.for("react.suspense") : 60113, m = e ? /* @__PURE__ */ Symbol.for("react.suspense_list") : 60120, y = e ? /* @__PURE__ */ Symbol.for("react.memo") : 60115, x = e ? /* @__PURE__ */ Symbol.for("react.lazy") : 60116, v = e ? /* @__PURE__ */ Symbol.for("react.block") : 60121, b = e ? /* @__PURE__ */ Symbol.for("react.fundamental") : 60117, C = e ? /* @__PURE__ */ Symbol.for("react.responder") : 60118, T = e ? /* @__PURE__ */ Symbol.for("react.scope") : 60119;
+  function S(c) {
+    if (typeof c == "object" && c !== null) {
+      var N = c.$$typeof;
+      switch (N) {
+        case n:
+          switch (c = c.type, c) {
+            case p:
+            case g:
+            case r:
+            case o:
+            case i:
+            case u:
+              return c;
+            default:
+              switch (c = c && c.$$typeof, c) {
+                case d:
+                case h:
+                case x:
+                case y:
+                case s:
+                  return c;
+                default:
+                  return N;
+              }
+          }
+        case t:
+          return N;
+      }
+    }
+  }
+  function D(c) {
+    return S(c) === g;
+  }
+  return V.AsyncMode = p, V.ConcurrentMode = g, V.ContextConsumer = d, V.ContextProvider = s, V.Element = n, V.ForwardRef = h, V.Fragment = r, V.Lazy = x, V.Memo = y, V.Portal = t, V.Profiler = o, V.StrictMode = i, V.Suspense = u, V.isAsyncMode = function(c) {
+    return D(c) || S(c) === p;
+  }, V.isConcurrentMode = D, V.isContextConsumer = function(c) {
+    return S(c) === d;
+  }, V.isContextProvider = function(c) {
+    return S(c) === s;
+  }, V.isElement = function(c) {
+    return typeof c == "object" && c !== null && c.$$typeof === n;
+  }, V.isForwardRef = function(c) {
+    return S(c) === h;
+  }, V.isFragment = function(c) {
+    return S(c) === r;
+  }, V.isLazy = function(c) {
+    return S(c) === x;
+  }, V.isMemo = function(c) {
+    return S(c) === y;
+  }, V.isPortal = function(c) {
+    return S(c) === t;
+  }, V.isProfiler = function(c) {
+    return S(c) === o;
+  }, V.isStrictMode = function(c) {
+    return S(c) === i;
+  }, V.isSuspense = function(c) {
+    return S(c) === u;
+  }, V.isValidElementType = function(c) {
+    return typeof c == "string" || typeof c == "function" || c === r || c === g || c === o || c === i || c === u || c === m || typeof c == "object" && c !== null && (c.$$typeof === x || c.$$typeof === y || c.$$typeof === s || c.$$typeof === d || c.$$typeof === h || c.$$typeof === b || c.$$typeof === C || c.$$typeof === T || c.$$typeof === v);
+  }, V.typeOf = S, V;
+}
+var Y = {};
+var Ve;
+function an() {
+  return Ve || (Ve = 1, process.env.NODE_ENV !== "production" && (function() {
+    var e = typeof Symbol == "function" && Symbol.for, n = e ? /* @__PURE__ */ Symbol.for("react.element") : 60103, t = e ? /* @__PURE__ */ Symbol.for("react.portal") : 60106, r = e ? /* @__PURE__ */ Symbol.for("react.fragment") : 60107, i = e ? /* @__PURE__ */ Symbol.for("react.strict_mode") : 60108, o = e ? /* @__PURE__ */ Symbol.for("react.profiler") : 60114, s = e ? /* @__PURE__ */ Symbol.for("react.provider") : 60109, d = e ? /* @__PURE__ */ Symbol.for("react.context") : 60110, p = e ? /* @__PURE__ */ Symbol.for("react.async_mode") : 60111, g = e ? /* @__PURE__ */ Symbol.for("react.concurrent_mode") : 60111, h = e ? /* @__PURE__ */ Symbol.for("react.forward_ref") : 60112, u = e ? /* @__PURE__ */ Symbol.for("react.suspense") : 60113, m = e ? /* @__PURE__ */ Symbol.for("react.suspense_list") : 60120, y = e ? /* @__PURE__ */ Symbol.for("react.memo") : 60115, x = e ? /* @__PURE__ */ Symbol.for("react.lazy") : 60116, v = e ? /* @__PURE__ */ Symbol.for("react.block") : 60121, b = e ? /* @__PURE__ */ Symbol.for("react.fundamental") : 60117, C = e ? /* @__PURE__ */ Symbol.for("react.responder") : 60118, T = e ? /* @__PURE__ */ Symbol.for("react.scope") : 60119;
+    function S(_) {
+      return typeof _ == "string" || typeof _ == "function" || // Note: its typeof might be other than 'symbol' or 'number' if it's a polyfill.
+      _ === r || _ === g || _ === o || _ === i || _ === u || _ === m || typeof _ == "object" && _ !== null && (_.$$typeof === x || _.$$typeof === y || _.$$typeof === s || _.$$typeof === d || _.$$typeof === h || _.$$typeof === b || _.$$typeof === C || _.$$typeof === T || _.$$typeof === v);
+    }
+    function D(_) {
+      if (typeof _ == "object" && _ !== null) {
+        var te = _.$$typeof;
+        switch (te) {
+          case n:
+            var me = _.type;
+            switch (me) {
+              case p:
+              case g:
+              case r:
+              case o:
+              case i:
+              case u:
+                return me;
+              default:
+                var je = me && me.$$typeof;
+                switch (je) {
+                  case d:
+                  case h:
+                  case x:
+                  case y:
+                  case s:
+                    return je;
+                  default:
+                    return te;
+                }
+            }
+          case t:
+            return te;
+        }
+      }
+    }
+    var c = p, N = g, l = d, f = s, P = n, $ = h, O = r, E = x, z = y, X = t, Q = o, H = i, ee = u, ae = !1;
+    function de(_) {
+      return ae || (ae = !0, console.warn("The ReactIs.isAsyncMode() alias has been deprecated, and will be removed in React 17+. Update your code to use ReactIs.isConcurrentMode() instead. It has the exact same API.")), w(_) || D(_) === p;
+    }
+    function w(_) {
+      return D(_) === g;
+    }
+    function M(_) {
+      return D(_) === d;
+    }
+    function A(_) {
+      return D(_) === s;
+    }
+    function k(_) {
+      return typeof _ == "object" && _ !== null && _.$$typeof === n;
+    }
+    function I(_) {
+      return D(_) === h;
+    }
+    function F(_) {
+      return D(_) === r;
+    }
+    function R(_) {
+      return D(_) === x;
+    }
+    function j(_) {
+      return D(_) === y;
+    }
+    function L(_) {
+      return D(_) === t;
+    }
+    function q(_) {
+      return D(_) === o;
+    }
+    function U(_) {
+      return D(_) === i;
+    }
+    function G(_) {
+      return D(_) === u;
+    }
+    Y.AsyncMode = c, Y.ConcurrentMode = N, Y.ContextConsumer = l, Y.ContextProvider = f, Y.Element = P, Y.ForwardRef = $, Y.Fragment = O, Y.Lazy = E, Y.Memo = z, Y.Portal = X, Y.Profiler = Q, Y.StrictMode = H, Y.Suspense = ee, Y.isAsyncMode = de, Y.isConcurrentMode = w, Y.isContextConsumer = M, Y.isContextProvider = A, Y.isElement = k, Y.isForwardRef = I, Y.isFragment = F, Y.isLazy = R, Y.isMemo = j, Y.isPortal = L, Y.isProfiler = q, Y.isStrictMode = U, Y.isSuspense = G, Y.isValidElementType = S, Y.typeOf = D;
+  })()), Y;
+}
+var Ye;
+function pt() {
+  return Ye || (Ye = 1, process.env.NODE_ENV === "production" ? ye.exports = on() : ye.exports = an()), ye.exports;
+}
+var Te, qe;
+function sn() {
+  if (qe) return Te;
+  qe = 1;
+  var e = Object.getOwnPropertySymbols, n = Object.prototype.hasOwnProperty, t = Object.prototype.propertyIsEnumerable;
+  function r(o) {
+    if (o == null)
+      throw new TypeError("Object.assign cannot be called with null or undefined");
+    return Object(o);
+  }
+  function i() {
+    try {
+      if (!Object.assign)
+        return !1;
+      var o = new String("abc");
+      if (o[5] = "de", Object.getOwnPropertyNames(o)[0] === "5")
+        return !1;
+      for (var s = {}, d = 0; d < 10; d++)
+        s["_" + String.fromCharCode(d)] = d;
+      var p = Object.getOwnPropertyNames(s).map(function(h) {
+        return s[h];
+      });
+      if (p.join("") !== "0123456789")
+        return !1;
+      var g = {};
+      return "abcdefghijklmnopqrst".split("").forEach(function(h) {
+        g[h] = h;
+      }), Object.keys(Object.assign({}, g)).join("") === "abcdefghijklmnopqrst";
+    } catch {
+      return !1;
+    }
+  }
+  return Te = i() ? Object.assign : function(o, s) {
+    for (var d, p = r(o), g, h = 1; h < arguments.length; h++) {
+      d = Object(arguments[h]);
+      for (var u in d)
+        n.call(d, u) && (p[u] = d[u]);
+      if (e) {
+        g = e(d);
+        for (var m = 0; m < g.length; m++)
+          t.call(d, g[m]) && (p[g[m]] = d[g[m]]);
+      }
+    }
+    return p;
+  }, Te;
+}
+var Ne, ze;
+function Oe() {
+  if (ze) return Ne;
+  ze = 1;
+  var e = "SECRET_DO_NOT_PASS_THIS_OR_YOU_WILL_BE_FIRED";
+  return Ne = e, Ne;
+}
+var Ee, Be;
+function yt() {
+  return Be || (Be = 1, Ee = Function.call.bind(Object.prototype.hasOwnProperty)), Ee;
+}
+var _e, Ke;
+function ln() {
+  if (Ke) return _e;
+  Ke = 1;
+  var e = function() {
+  };
+  if (process.env.NODE_ENV !== "production") {
+    var n = /* @__PURE__ */ Oe(), t = {}, r = /* @__PURE__ */ yt();
+    e = function(o) {
+      var s = "Warning: " + o;
+      typeof console < "u" && console.error(s);
+      try {
+        throw new Error(s);
+      } catch {
+      }
+    };
+  }
+  function i(o, s, d, p, g) {
+    if (process.env.NODE_ENV !== "production") {
+      for (var h in o)
+        if (r(o, h)) {
+          var u;
+          try {
+            if (typeof o[h] != "function") {
+              var m = Error(
+                (p || "React class") + ": " + d + " type `" + h + "` is invalid; it must be a function, usually from the `prop-types` package, but received `" + typeof o[h] + "`.This often happens because of typos such as `PropTypes.function` instead of `PropTypes.func`."
+              );
+              throw m.name = "Invariant Violation", m;
+            }
+            u = o[h](s, h, p, d, null, n);
+          } catch (x) {
+            u = x;
+          }
+          if (u && !(u instanceof Error) && e(
+            (p || "React class") + ": type specification of " + d + " `" + h + "` is invalid; the type checker function must return `null` or an `Error` but returned a " + typeof u + ". You may have forgotten to pass an argument to the type checker creator (arrayOf, instanceOf, objectOf, oneOf, oneOfType, and shape all require an argument)."
+          ), u instanceof Error && !(u.message in t)) {
+            t[u.message] = !0;
+            var y = g ? g() : "";
+            e(
+              "Failed " + d + " type: " + u.message + (y ?? "")
+            );
+          }
+        }
+    }
+  }
+  return i.resetWarningCache = function() {
+    process.env.NODE_ENV !== "production" && (t = {});
+  }, _e = i, _e;
+}
+var Me, He;
+function cn() {
+  if (He) return Me;
+  He = 1;
+  var e = pt(), n = sn(), t = /* @__PURE__ */ Oe(), r = /* @__PURE__ */ yt(), i = /* @__PURE__ */ ln(), o = function() {
+  };
+  process.env.NODE_ENV !== "production" && (o = function(d) {
+    var p = "Warning: " + d;
+    typeof console < "u" && console.error(p);
+    try {
+      throw new Error(p);
+    } catch {
+    }
+  });
+  function s() {
+    return null;
+  }
+  return Me = function(d, p) {
+    var g = typeof Symbol == "function" && Symbol.iterator, h = "@@iterator";
+    function u(w) {
+      var M = w && (g && w[g] || w[h]);
+      if (typeof M == "function")
+        return M;
+    }
+    var m = "<<anonymous>>", y = {
+      array: C("array"),
+      bigint: C("bigint"),
+      bool: C("boolean"),
+      func: C("function"),
+      number: C("number"),
+      object: C("object"),
+      string: C("string"),
+      symbol: C("symbol"),
+      any: T(),
+      arrayOf: S,
+      element: D(),
+      elementType: c(),
+      instanceOf: N,
+      node: $(),
+      objectOf: f,
+      oneOf: l,
+      oneOfType: P,
+      shape: E,
+      exact: z
+    };
+    function x(w, M) {
+      return w === M ? w !== 0 || 1 / w === 1 / M : w !== w && M !== M;
+    }
+    function v(w, M) {
+      this.message = w, this.data = M && typeof M == "object" ? M : {}, this.stack = "";
+    }
+    v.prototype = Error.prototype;
+    function b(w) {
+      if (process.env.NODE_ENV !== "production")
+        var M = {}, A = 0;
+      function k(F, R, j, L, q, U, G) {
+        if (L = L || m, U = U || j, G !== t) {
+          if (p) {
+            var _ = new Error(
+              "Calling PropTypes validators directly is not supported by the `prop-types` package. Use `PropTypes.checkPropTypes()` to call them. Read more at http://fb.me/use-check-prop-types"
+            );
+            throw _.name = "Invariant Violation", _;
+          } else if (process.env.NODE_ENV !== "production" && typeof console < "u") {
+            var te = L + ":" + j;
+            !M[te] && // Avoid spamming the console because they are often not actionable except for lib authors
+            A < 3 && (o(
+              "You are manually calling a React.PropTypes validation function for the `" + U + "` prop on `" + L + "`. This is deprecated and will throw in the standalone `prop-types` package. You may be seeing this warning due to a third-party PropTypes library. See https://fb.me/react-warning-dont-call-proptypes for details."
+            ), M[te] = !0, A++);
+          }
+        }
+        return R[j] == null ? F ? R[j] === null ? new v("The " + q + " `" + U + "` is marked as required " + ("in `" + L + "`, but its value is `null`.")) : new v("The " + q + " `" + U + "` is marked as required in " + ("`" + L + "`, but its value is `undefined`.")) : null : w(R, j, L, q, U);
+      }
+      var I = k.bind(null, !1);
+      return I.isRequired = k.bind(null, !0), I;
+    }
+    function C(w) {
+      function M(A, k, I, F, R, j) {
+        var L = A[k], q = H(L);
+        if (q !== w) {
+          var U = ee(L);
+          return new v(
+            "Invalid " + F + " `" + R + "` of type " + ("`" + U + "` supplied to `" + I + "`, expected ") + ("`" + w + "`."),
+            { expectedType: w }
+          );
+        }
+        return null;
+      }
+      return b(M);
+    }
+    function T() {
+      return b(s);
+    }
+    function S(w) {
+      function M(A, k, I, F, R) {
+        if (typeof w != "function")
+          return new v("Property `" + R + "` of component `" + I + "` has invalid PropType notation inside arrayOf.");
+        var j = A[k];
+        if (!Array.isArray(j)) {
+          var L = H(j);
+          return new v("Invalid " + F + " `" + R + "` of type " + ("`" + L + "` supplied to `" + I + "`, expected an array."));
+        }
+        for (var q = 0; q < j.length; q++) {
+          var U = w(j, q, I, F, R + "[" + q + "]", t);
+          if (U instanceof Error)
+            return U;
+        }
+        return null;
+      }
+      return b(M);
+    }
+    function D() {
+      function w(M, A, k, I, F) {
+        var R = M[A];
+        if (!d(R)) {
+          var j = H(R);
+          return new v("Invalid " + I + " `" + F + "` of type " + ("`" + j + "` supplied to `" + k + "`, expected a single ReactElement."));
+        }
+        return null;
+      }
+      return b(w);
+    }
+    function c() {
+      function w(M, A, k, I, F) {
+        var R = M[A];
+        if (!e.isValidElementType(R)) {
+          var j = H(R);
+          return new v("Invalid " + I + " `" + F + "` of type " + ("`" + j + "` supplied to `" + k + "`, expected a single ReactElement type."));
+        }
+        return null;
+      }
+      return b(w);
+    }
+    function N(w) {
+      function M(A, k, I, F, R) {
+        if (!(A[k] instanceof w)) {
+          var j = w.name || m, L = de(A[k]);
+          return new v("Invalid " + F + " `" + R + "` of type " + ("`" + L + "` supplied to `" + I + "`, expected ") + ("instance of `" + j + "`."));
+        }
+        return null;
+      }
+      return b(M);
+    }
+    function l(w) {
+      if (!Array.isArray(w))
+        return process.env.NODE_ENV !== "production" && (arguments.length > 1 ? o(
+          "Invalid arguments supplied to oneOf, expected an array, got " + arguments.length + " arguments. A common mistake is to write oneOf(x, y, z) instead of oneOf([x, y, z])."
+        ) : o("Invalid argument supplied to oneOf, expected an array.")), s;
+      function M(A, k, I, F, R) {
+        for (var j = A[k], L = 0; L < w.length; L++)
+          if (x(j, w[L]))
+            return null;
+        var q = JSON.stringify(w, function(G, _) {
+          var te = ee(_);
+          return te === "symbol" ? String(_) : _;
+        });
+        return new v("Invalid " + F + " `" + R + "` of value `" + String(j) + "` " + ("supplied to `" + I + "`, expected one of " + q + "."));
+      }
+      return b(M);
+    }
+    function f(w) {
+      function M(A, k, I, F, R) {
+        if (typeof w != "function")
+          return new v("Property `" + R + "` of component `" + I + "` has invalid PropType notation inside objectOf.");
+        var j = A[k], L = H(j);
+        if (L !== "object")
+          return new v("Invalid " + F + " `" + R + "` of type " + ("`" + L + "` supplied to `" + I + "`, expected an object."));
+        for (var q in j)
+          if (r(j, q)) {
+            var U = w(j, q, I, F, R + "." + q, t);
+            if (U instanceof Error)
+              return U;
+          }
+        return null;
+      }
+      return b(M);
+    }
+    function P(w) {
+      if (!Array.isArray(w))
+        return process.env.NODE_ENV !== "production" && o("Invalid argument supplied to oneOfType, expected an instance of array."), s;
+      for (var M = 0; M < w.length; M++) {
+        var A = w[M];
+        if (typeof A != "function")
+          return o(
+            "Invalid argument supplied to oneOfType. Expected an array of check functions, but received " + ae(A) + " at index " + M + "."
+          ), s;
+      }
+      function k(I, F, R, j, L) {
+        for (var q = [], U = 0; U < w.length; U++) {
+          var G = w[U], _ = G(I, F, R, j, L, t);
+          if (_ == null)
+            return null;
+          _.data && r(_.data, "expectedType") && q.push(_.data.expectedType);
+        }
+        var te = q.length > 0 ? ", expected one of type [" + q.join(", ") + "]" : "";
+        return new v("Invalid " + j + " `" + L + "` supplied to " + ("`" + R + "`" + te + "."));
+      }
+      return b(k);
+    }
+    function $() {
+      function w(M, A, k, I, F) {
+        return X(M[A]) ? null : new v("Invalid " + I + " `" + F + "` supplied to " + ("`" + k + "`, expected a ReactNode."));
+      }
+      return b(w);
+    }
+    function O(w, M, A, k, I) {
+      return new v(
+        (w || "React class") + ": " + M + " type `" + A + "." + k + "` is invalid; it must be a function, usually from the `prop-types` package, but received `" + I + "`."
+      );
+    }
+    function E(w) {
+      function M(A, k, I, F, R) {
+        var j = A[k], L = H(j);
+        if (L !== "object")
+          return new v("Invalid " + F + " `" + R + "` of type `" + L + "` " + ("supplied to `" + I + "`, expected `object`."));
+        for (var q in w) {
+          var U = w[q];
+          if (typeof U != "function")
+            return O(I, F, R, q, ee(U));
+          var G = U(j, q, I, F, R + "." + q, t);
+          if (G)
+            return G;
+        }
+        return null;
+      }
+      return b(M);
+    }
+    function z(w) {
+      function M(A, k, I, F, R) {
+        var j = A[k], L = H(j);
+        if (L !== "object")
+          return new v("Invalid " + F + " `" + R + "` of type `" + L + "` " + ("supplied to `" + I + "`, expected `object`."));
+        var q = n({}, A[k], w);
+        for (var U in q) {
+          var G = w[U];
+          if (r(w, U) && typeof G != "function")
+            return O(I, F, R, U, ee(G));
+          if (!G)
+            return new v(
+              "Invalid " + F + " `" + R + "` key `" + U + "` supplied to `" + I + "`.\nBad object: " + JSON.stringify(A[k], null, "  ") + `
+Valid keys: ` + JSON.stringify(Object.keys(w), null, "  ")
+            );
+          var _ = G(j, U, I, F, R + "." + U, t);
+          if (_)
+            return _;
+        }
+        return null;
+      }
+      return b(M);
+    }
+    function X(w) {
+      switch (typeof w) {
+        case "number":
+        case "string":
+        case "undefined":
+          return !0;
+        case "boolean":
+          return !w;
+        case "object":
+          if (Array.isArray(w))
+            return w.every(X);
+          if (w === null || d(w))
+            return !0;
+          var M = u(w);
+          if (M) {
+            var A = M.call(w), k;
+            if (M !== w.entries) {
+              for (; !(k = A.next()).done; )
+                if (!X(k.value))
+                  return !1;
+            } else
+              for (; !(k = A.next()).done; ) {
+                var I = k.value;
+                if (I && !X(I[1]))
+                  return !1;
+              }
+          } else
+            return !1;
+          return !0;
+        default:
+          return !1;
+      }
+    }
+    function Q(w, M) {
+      return w === "symbol" ? !0 : M ? M["@@toStringTag"] === "Symbol" || typeof Symbol == "function" && M instanceof Symbol : !1;
+    }
+    function H(w) {
+      var M = typeof w;
+      return Array.isArray(w) ? "array" : w instanceof RegExp ? "object" : Q(M, w) ? "symbol" : M;
+    }
+    function ee(w) {
+      if (typeof w > "u" || w === null)
+        return "" + w;
+      var M = H(w);
+      if (M === "object") {
+        if (w instanceof Date)
+          return "date";
+        if (w instanceof RegExp)
+          return "regexp";
+      }
+      return M;
+    }
+    function ae(w) {
+      var M = ee(w);
+      switch (M) {
+        case "array":
+        case "object":
+          return "an " + M;
+        case "boolean":
+        case "date":
+        case "regexp":
+          return "a " + M;
+        default:
+          return M;
+      }
+    }
+    function de(w) {
+      return !w.constructor || !w.constructor.name ? m : w.constructor.name;
+    }
+    return y.checkPropTypes = i, y.resetWarningCache = i.resetWarningCache, y.PropTypes = y, y;
+  }, Me;
+}
+var Pe, Xe;
+function dn() {
+  if (Xe) return Pe;
+  Xe = 1;
+  var e = /* @__PURE__ */ Oe();
+  function n() {
+  }
+  function t() {
+  }
+  return t.resetWarningCache = n, Pe = function() {
+    function r(s, d, p, g, h, u) {
+      if (u !== e) {
+        var m = new Error(
+          "Calling PropTypes validators directly is not supported by the `prop-types` package. Use PropTypes.checkPropTypes() to call them. Read more at http://fb.me/use-check-prop-types"
+        );
+        throw m.name = "Invariant Violation", m;
+      }
+    }
+    r.isRequired = r;
+    function i() {
+      return r;
+    }
+    var o = {
+      array: r,
+      bigint: r,
+      bool: r,
+      func: r,
+      number: r,
+      object: r,
+      string: r,
+      symbol: r,
+      any: r,
+      arrayOf: i,
+      element: r,
+      elementType: r,
+      instanceOf: i,
+      node: r,
+      objectOf: i,
+      oneOf: i,
+      oneOfType: i,
+      shape: i,
+      exact: i,
+      checkPropTypes: t,
+      resetWarningCache: n
+    };
+    return o.PropTypes = o, o;
+  }, Pe;
+}
+var Ge;
+function vt() {
+  if (Ge) return pe.exports;
+  if (Ge = 1, process.env.NODE_ENV !== "production") {
+    var e = pt(), n = !0;
+    pe.exports = /* @__PURE__ */ cn()(e.isElement, n);
+  } else
+    pe.exports = /* @__PURE__ */ dn()();
+  return pe.exports;
+}
+var ve = { exports: {} }, Ze;
+function un() {
+  if (Ze) return ve.exports;
+  Ze = 1;
+  function e(t) {
+    var r, i, o = "";
+    if (typeof t == "string" || typeof t == "number") o += t;
+    else if (typeof t == "object") if (Array.isArray(t)) {
+      var s = t.length;
+      for (r = 0; r < s; r++) t[r] && (i = e(t[r])) && (o && (o += " "), o += i);
+    } else for (i in t) t[i] && (o && (o += " "), o += i);
+    return o;
+  }
+  function n() {
+    for (var t, r, i = 0, o = "", s = arguments.length; i < s; i++) (t = arguments[i]) && (r = e(t)) && (o && (o += " "), o += r);
+    return o;
+  }
+  return ve.exports = n, ve.exports.clsx = n, ve.exports;
+}
+var B = {}, oe = {}, Je;
+function xe() {
+  if (Je) return oe;
+  Je = 1, Object.defineProperty(oe, "__esModule", {
+    value: !0
+  }), oe.dontSetMe = i, oe.findInArray = e, oe.int = r, oe.isFunction = n, oe.isNum = t;
+  function e(o, s) {
+    for (let d = 0, p = o.length; d < p; d++)
+      if (s.apply(s, [o[d], d, o])) return o[d];
+  }
+  function n(o) {
+    return typeof o == "function" || Object.prototype.toString.call(o) === "[object Function]";
+  }
+  function t(o) {
+    return typeof o == "number" && !isNaN(o);
+  }
+  function r(o) {
+    return parseInt(o, 10);
+  }
+  function i(o, s, d) {
+    if (o[s])
+      return new Error(`Invalid prop ${s} passed to ${d} - do not set this, set it on the child.`);
+  }
+  return oe;
+}
+var ie = {}, Qe;
+function fn() {
+  if (Qe) return ie;
+  Qe = 1, Object.defineProperty(ie, "__esModule", {
+    value: !0
+  }), ie.browserPrefixToKey = t, ie.browserPrefixToStyle = r, ie.default = void 0, ie.getPrefix = n;
+  const e = ["Moz", "Webkit", "O", "ms"];
+  function n() {
+    let o = arguments.length > 0 && arguments[0] !== void 0 ? arguments[0] : "transform";
+    if (typeof window > "u") return "";
+    const s = window.document?.documentElement?.style;
+    if (!s || o in s) return "";
+    for (let d = 0; d < e.length; d++)
+      if (t(o, e[d]) in s) return e[d];
+    return "";
+  }
+  function t(o, s) {
+    return s ? `${s}${i(o)}` : o;
+  }
+  function r(o, s) {
+    return s ? `-${s.toLowerCase()}-${o}` : o;
+  }
+  function i(o) {
+    let s = "", d = !0;
+    for (let p = 0; p < o.length; p++)
+      d ? (s += o[p].toUpperCase(), d = !1) : o[p] === "-" ? d = !0 : s += o[p];
+    return s;
+  }
+  return ie.default = n(), ie;
+}
+var et;
+function Re() {
+  if (et) return B;
+  et = 1, Object.defineProperty(B, "__esModule", {
+    value: !0
+  }), B.addClassName = c, B.addEvent = s, B.addUserSelectStyles = T, B.createCSSTransform = y, B.createSVGTransform = x, B.getTouch = b, B.getTouchIdentifier = C, B.getTranslation = v, B.innerHeight = h, B.innerWidth = u, B.matchesSelector = i, B.matchesSelectorAndParentsTo = o, B.offsetXYFromParent = m, B.outerHeight = p, B.outerWidth = g, B.removeClassName = N, B.removeEvent = d, B.scheduleRemoveUserSelectStyles = S;
+  var e = xe(), n = t(fn());
+  function t(l, f) {
+    if (typeof WeakMap == "function") var P = /* @__PURE__ */ new WeakMap(), $ = /* @__PURE__ */ new WeakMap();
+    return (t = function(O, E) {
+      if (!E && O && O.__esModule) return O;
+      var z, X, Q = { __proto__: null, default: O };
+      if (O === null || typeof O != "object" && typeof O != "function") return Q;
+      if (z = E ? $ : P) {
+        if (z.has(O)) return z.get(O);
+        z.set(O, Q);
+      }
+      for (const H in O) H !== "default" && {}.hasOwnProperty.call(O, H) && ((X = (z = Object.defineProperty) && Object.getOwnPropertyDescriptor(O, H)) && (X.get || X.set) ? z(Q, H, X) : Q[H] = O[H]);
+      return Q;
+    })(l, f);
+  }
+  let r = "";
+  function i(l, f) {
+    return r || (r = (0, e.findInArray)(["matches", "webkitMatchesSelector", "mozMatchesSelector", "msMatchesSelector", "oMatchesSelector"], function(P) {
+      return (0, e.isFunction)(l[P]);
+    })), (0, e.isFunction)(l[r]) ? l[r](f) : !1;
+  }
+  function o(l, f, P) {
+    let $ = l;
+    do {
+      if (i($, f)) return !0;
+      if ($ === P) return !1;
+      $ = $.parentNode;
+    } while ($);
+    return !1;
+  }
+  function s(l, f, P, $) {
+    if (!l) return;
+    const O = {
+      capture: !0,
+      ...$
+    };
+    l.addEventListener ? l.addEventListener(f, P, O) : l.attachEvent ? l.attachEvent("on" + f, P) : l["on" + f] = P;
+  }
+  function d(l, f, P, $) {
+    if (!l) return;
+    const O = {
+      capture: !0,
+      ...$
+    };
+    l.removeEventListener ? l.removeEventListener(f, P, O) : l.detachEvent ? l.detachEvent("on" + f, P) : l["on" + f] = null;
+  }
+  function p(l) {
+    let f = l.clientHeight;
+    const P = l.ownerDocument.defaultView.getComputedStyle(l);
+    return f += (0, e.int)(P.borderTopWidth), f += (0, e.int)(P.borderBottomWidth), f;
+  }
+  function g(l) {
+    let f = l.clientWidth;
+    const P = l.ownerDocument.defaultView.getComputedStyle(l);
+    return f += (0, e.int)(P.borderLeftWidth), f += (0, e.int)(P.borderRightWidth), f;
+  }
+  function h(l) {
+    let f = l.clientHeight;
+    const P = l.ownerDocument.defaultView.getComputedStyle(l);
+    return f -= (0, e.int)(P.paddingTop), f -= (0, e.int)(P.paddingBottom), f;
+  }
+  function u(l) {
+    let f = l.clientWidth;
+    const P = l.ownerDocument.defaultView.getComputedStyle(l);
+    return f -= (0, e.int)(P.paddingLeft), f -= (0, e.int)(P.paddingRight), f;
+  }
+  function m(l, f, P) {
+    const O = f === f.ownerDocument.body ? {
+      left: 0,
+      top: 0
+    } : f.getBoundingClientRect(), E = (l.clientX + f.scrollLeft - O.left) / P, z = (l.clientY + f.scrollTop - O.top) / P;
+    return {
+      x: E,
+      y: z
+    };
+  }
+  function y(l, f) {
+    const P = v(l, f, "px");
+    return {
+      [(0, n.browserPrefixToKey)("transform", n.default)]: P
+    };
+  }
+  function x(l, f) {
+    return v(l, f, "");
+  }
+  function v(l, f, P) {
+    let {
+      x: $,
+      y: O
+    } = l, E = `translate(${$}${P},${O}${P})`;
+    if (f) {
+      const z = `${typeof f.x == "string" ? f.x : f.x + P}`, X = `${typeof f.y == "string" ? f.y : f.y + P}`;
+      E = `translate(${z}, ${X})` + E;
+    }
+    return E;
+  }
+  function b(l, f) {
+    return l.targetTouches && (0, e.findInArray)(l.targetTouches, (P) => f === P.identifier) || l.changedTouches && (0, e.findInArray)(l.changedTouches, (P) => f === P.identifier);
+  }
+  function C(l) {
+    if (l.targetTouches && l.targetTouches[0]) return l.targetTouches[0].identifier;
+    if (l.changedTouches && l.changedTouches[0]) return l.changedTouches[0].identifier;
+  }
+  function T(l) {
+    if (!l) return;
+    let f = l.getElementById("react-draggable-style-el");
+    f || (f = l.createElement("style"), f.type = "text/css", f.id = "react-draggable-style-el", f.innerHTML = `.react-draggable-transparent-selection *::-moz-selection {all: inherit;}
+`, f.innerHTML += `.react-draggable-transparent-selection *::selection {all: inherit;}
+`, l.getElementsByTagName("head")[0].appendChild(f)), l.body && c(l.body, "react-draggable-transparent-selection");
+  }
+  function S(l) {
+    window.requestAnimationFrame ? window.requestAnimationFrame(() => {
+      D(l);
+    }) : D(l);
+  }
+  function D(l) {
+    if (l)
+      try {
+        if (l.body && N(l.body, "react-draggable-transparent-selection"), l.selection)
+          l.selection.empty();
+        else {
+          const f = (l.defaultView || window).getSelection();
+          f && f.type !== "Caret" && f.removeAllRanges();
+        }
+      } catch {
+      }
+  }
+  function c(l, f) {
+    l.classList ? l.classList.add(f) : l.className.match(new RegExp(`(?:^|\\s)${f}(?!\\S)`)) || (l.className += ` ${f}`);
+  }
+  function N(l, f) {
+    l.classList ? l.classList.remove(f) : l.className = l.className.replace(new RegExp(`(?:^|\\s)${f}(?!\\S)`, "g"), "");
+  }
+  return B;
+}
+var ne = {}, tt;
+function bt() {
+  if (tt) return ne;
+  tt = 1, Object.defineProperty(ne, "__esModule", {
+    value: !0
+  }), ne.canDragX = i, ne.canDragY = o, ne.createCoreData = d, ne.createDraggableData = p, ne.getBoundPosition = t, ne.getControlPosition = s, ne.snapToGrid = r;
+  var e = xe(), n = Re();
+  function t(u, m, y) {
+    if (!u.props.bounds) return [m, y];
+    let {
+      bounds: x
+    } = u.props;
+    x = typeof x == "string" ? x : g(x);
+    const v = h(u);
+    if (typeof x == "string") {
+      const {
+        ownerDocument: b
+      } = v, C = b.defaultView;
+      let T;
+      if (x === "parent" ? T = v.parentNode : T = v.getRootNode().querySelector(x), !(T instanceof C.HTMLElement))
+        throw new Error('Bounds selector "' + x + '" could not find an element.');
+      const S = T, D = C.getComputedStyle(v), c = C.getComputedStyle(S);
+      x = {
+        left: -v.offsetLeft + (0, e.int)(c.paddingLeft) + (0, e.int)(D.marginLeft),
+        top: -v.offsetTop + (0, e.int)(c.paddingTop) + (0, e.int)(D.marginTop),
+        right: (0, n.innerWidth)(S) - (0, n.outerWidth)(v) - v.offsetLeft + (0, e.int)(c.paddingRight) - (0, e.int)(D.marginRight),
+        bottom: (0, n.innerHeight)(S) - (0, n.outerHeight)(v) - v.offsetTop + (0, e.int)(c.paddingBottom) - (0, e.int)(D.marginBottom)
+      };
+    }
+    return (0, e.isNum)(x.right) && (m = Math.min(m, x.right)), (0, e.isNum)(x.bottom) && (y = Math.min(y, x.bottom)), (0, e.isNum)(x.left) && (m = Math.max(m, x.left)), (0, e.isNum)(x.top) && (y = Math.max(y, x.top)), [m, y];
+  }
+  function r(u, m, y) {
+    const x = Math.round(m / u[0]) * u[0], v = Math.round(y / u[1]) * u[1];
+    return [x, v];
+  }
+  function i(u) {
+    return u.props.axis === "both" || u.props.axis === "x";
+  }
+  function o(u) {
+    return u.props.axis === "both" || u.props.axis === "y";
+  }
+  function s(u, m, y) {
+    const x = typeof m == "number" ? (0, n.getTouch)(u, m) : null;
+    if (typeof m == "number" && !x) return null;
+    const v = h(y), b = y.props.offsetParent || v.offsetParent || v.ownerDocument.body;
+    return (0, n.offsetXYFromParent)(x || u, b, y.props.scale);
+  }
+  function d(u, m, y) {
+    const x = !(0, e.isNum)(u.lastX), v = h(u);
+    return x ? {
+      node: v,
+      deltaX: 0,
+      deltaY: 0,
+      lastX: m,
+      lastY: y,
+      x: m,
+      y
+    } : {
+      node: v,
+      deltaX: m - u.lastX,
+      deltaY: y - u.lastY,
+      lastX: u.lastX,
+      lastY: u.lastY,
+      x: m,
+      y
+    };
+  }
+  function p(u, m) {
+    const y = u.props.scale;
+    return {
+      node: m.node,
+      x: u.state.x + m.deltaX / y,
+      y: u.state.y + m.deltaY / y,
+      deltaX: m.deltaX / y,
+      deltaY: m.deltaY / y,
+      lastX: u.state.x,
+      lastY: u.state.y
+    };
+  }
+  function g(u) {
+    return {
+      left: u.left,
+      top: u.top,
+      right: u.right,
+      bottom: u.bottom
+    };
+  }
+  function h(u) {
+    const m = u.findDOMNode();
+    if (!m)
+      throw new Error("<DraggableCore>: Unmounted during event!");
+    return m;
+  }
+  return ne;
+}
+var he = {}, be = {}, nt;
+function wt() {
+  if (nt) return be;
+  nt = 1, Object.defineProperty(be, "__esModule", {
+    value: !0
+  }), be.default = e;
+  function e() {
+  }
+  return be;
+}
+var rt;
+function hn() {
+  if (rt) return he;
+  rt = 1, Object.defineProperty(he, "__esModule", {
+    value: !0
+  }), he.default = void 0;
+  var e = p(se), n = d(/* @__PURE__ */ vt()), t = d(st), r = Re(), i = bt(), o = xe(), s = d(wt());
+  function d(v) {
+    return v && v.__esModule ? v : { default: v };
+  }
+  function p(v, b) {
+    if (typeof WeakMap == "function") var C = /* @__PURE__ */ new WeakMap(), T = /* @__PURE__ */ new WeakMap();
+    return (p = function(S, D) {
+      if (!D && S && S.__esModule) return S;
+      var c, N, l = { __proto__: null, default: S };
+      if (S === null || typeof S != "object" && typeof S != "function") return l;
+      if (c = D ? T : C) {
+        if (c.has(S)) return c.get(S);
+        c.set(S, l);
+      }
+      for (const f in S) f !== "default" && {}.hasOwnProperty.call(S, f) && ((N = (c = Object.defineProperty) && Object.getOwnPropertyDescriptor(S, f)) && (N.get || N.set) ? c(l, f, N) : l[f] = S[f]);
+      return l;
+    })(v, b);
+  }
+  function g(v, b, C) {
+    return (b = h(b)) in v ? Object.defineProperty(v, b, { value: C, enumerable: !0, configurable: !0, writable: !0 }) : v[b] = C, v;
+  }
+  function h(v) {
+    var b = u(v, "string");
+    return typeof b == "symbol" ? b : b + "";
+  }
+  function u(v, b) {
+    if (typeof v != "object" || !v) return v;
+    var C = v[Symbol.toPrimitive];
+    if (C !== void 0) {
+      var T = C.call(v, b);
+      if (typeof T != "object") return T;
+      throw new TypeError("@@toPrimitive must return a primitive value.");
+    }
+    return (b === "string" ? String : Number)(v);
+  }
+  const m = {
+    touch: {
+      start: "touchstart",
+      move: "touchmove",
+      stop: "touchend"
+    },
+    mouse: {
+      start: "mousedown",
+      move: "mousemove",
+      stop: "mouseup"
+    }
+  };
+  let y = m.mouse, x = class extends e.Component {
+    constructor() {
+      super(...arguments), g(this, "dragging", !1), g(this, "lastX", NaN), g(this, "lastY", NaN), g(this, "touchIdentifier", null), g(this, "mounted", !1), g(this, "handleDragStart", (b) => {
+        if (this.props.onMouseDown(b), !this.props.allowAnyClick && typeof b.button == "number" && b.button !== 0) return !1;
+        const C = this.findDOMNode();
+        if (!C || !C.ownerDocument || !C.ownerDocument.body)
+          throw new Error("<DraggableCore> not mounted on DragStart!");
+        const {
+          ownerDocument: T
+        } = C;
+        if (this.props.disabled || !(b.target instanceof T.defaultView.Node) || this.props.handle && !(0, r.matchesSelectorAndParentsTo)(b.target, this.props.handle, C) || this.props.cancel && (0, r.matchesSelectorAndParentsTo)(b.target, this.props.cancel, C))
+          return;
+        b.type === "touchstart" && !this.props.allowMobileScroll && b.preventDefault();
+        const S = (0, r.getTouchIdentifier)(b);
+        this.touchIdentifier = S;
+        const D = (0, i.getControlPosition)(b, S, this);
+        if (D == null) return;
+        const {
+          x: c,
+          y: N
+        } = D, l = (0, i.createCoreData)(this, c, N);
+        (0, s.default)("DraggableCore: handleDragStart: %j", l), (0, s.default)("calling", this.props.onStart), !(this.props.onStart(b, l) === !1 || this.mounted === !1) && (this.props.enableUserSelectHack && (0, r.addUserSelectStyles)(T), this.dragging = !0, this.lastX = c, this.lastY = N, (0, r.addEvent)(T, y.move, this.handleDrag), (0, r.addEvent)(T, y.stop, this.handleDragStop));
+      }), g(this, "handleDrag", (b) => {
+        const C = (0, i.getControlPosition)(b, this.touchIdentifier, this);
+        if (C == null) return;
+        let {
+          x: T,
+          y: S
+        } = C;
+        if (Array.isArray(this.props.grid)) {
+          let N = T - this.lastX, l = S - this.lastY;
+          if ([N, l] = (0, i.snapToGrid)(this.props.grid, N, l), !N && !l) return;
+          T = this.lastX + N, S = this.lastY + l;
+        }
+        const D = (0, i.createCoreData)(this, T, S);
+        if ((0, s.default)("DraggableCore: handleDrag: %j", D), this.props.onDrag(b, D) === !1 || this.mounted === !1) {
+          try {
+            this.handleDragStop(new MouseEvent("mouseup"));
+          } catch {
+            const l = document.createEvent("MouseEvents");
+            l.initMouseEvent("mouseup", !0, !0, window, 0, 0, 0, 0, 0, !1, !1, !1, !1, 0, null), this.handleDragStop(l);
+          }
+          return;
+        }
+        this.lastX = T, this.lastY = S;
+      }), g(this, "handleDragStop", (b) => {
+        if (!this.dragging) return;
+        const C = (0, i.getControlPosition)(b, this.touchIdentifier, this);
+        if (C == null) return;
+        let {
+          x: T,
+          y: S
+        } = C;
+        if (Array.isArray(this.props.grid)) {
+          let l = T - this.lastX || 0, f = S - this.lastY || 0;
+          [l, f] = (0, i.snapToGrid)(this.props.grid, l, f), T = this.lastX + l, S = this.lastY + f;
+        }
+        const D = (0, i.createCoreData)(this, T, S);
+        if (this.props.onStop(b, D) === !1 || this.mounted === !1) return !1;
+        const N = this.findDOMNode();
+        N && this.props.enableUserSelectHack && (0, r.scheduleRemoveUserSelectStyles)(N.ownerDocument), (0, s.default)("DraggableCore: handleDragStop: %j", D), this.dragging = !1, this.lastX = NaN, this.lastY = NaN, N && ((0, s.default)("DraggableCore: Removing handlers"), (0, r.removeEvent)(N.ownerDocument, y.move, this.handleDrag), (0, r.removeEvent)(N.ownerDocument, y.stop, this.handleDragStop));
+      }), g(this, "onMouseDown", (b) => (y = m.mouse, this.handleDragStart(b))), g(this, "onMouseUp", (b) => (y = m.mouse, this.handleDragStop(b))), g(this, "onTouchStart", (b) => (y = m.touch, this.handleDragStart(b))), g(this, "onTouchEnd", (b) => (y = m.touch, this.handleDragStop(b)));
+    }
+    componentDidMount() {
+      this.mounted = !0;
+      const b = this.findDOMNode();
+      b && (0, r.addEvent)(b, m.touch.start, this.onTouchStart, {
+        passive: !1
+      });
+    }
+    componentWillUnmount() {
+      this.mounted = !1;
+      const b = this.findDOMNode();
+      if (b) {
+        const {
+          ownerDocument: C
+        } = b;
+        (0, r.removeEvent)(C, m.mouse.move, this.handleDrag), (0, r.removeEvent)(C, m.touch.move, this.handleDrag), (0, r.removeEvent)(C, m.mouse.stop, this.handleDragStop), (0, r.removeEvent)(C, m.touch.stop, this.handleDragStop), (0, r.removeEvent)(b, m.touch.start, this.onTouchStart, {
+          passive: !1
+        }), this.props.enableUserSelectHack && (0, r.scheduleRemoveUserSelectStyles)(C);
+      }
+    }
+    // React Strict Mode compatibility: if `nodeRef` is passed, we will use it instead of trying to find
+    // the underlying DOM node ourselves. See the README for more information.
+    findDOMNode() {
+      return this.props?.nodeRef ? this.props?.nodeRef?.current : t.default.findDOMNode(this);
+    }
+    render() {
+      return /* @__PURE__ */ e.cloneElement(e.Children.only(this.props.children), {
+        // Note: mouseMove handler is attached to document so it will still function
+        // when the user drags quickly and leaves the bounds of the element.
+        onMouseDown: this.onMouseDown,
+        onMouseUp: this.onMouseUp,
+        // onTouchStart is added on `componentDidMount` so they can be added with
+        // {passive: false}, which allows it to cancel. See
+        // https://developers.google.com/web/updates/2017/01/scrolling-intervention
+        onTouchEnd: this.onTouchEnd
+      });
+    }
+  };
+  return he.default = x, g(x, "displayName", "DraggableCore"), g(x, "propTypes", {
+    /**
+     * `allowAnyClick` allows dragging using any mouse button.
+     * By default, we only accept the left button.
+     *
+     * Defaults to `false`.
+     */
+    allowAnyClick: n.default.bool,
+    /**
+     * `allowMobileScroll` turns off cancellation of the 'touchstart' event
+     * on mobile devices. Only enable this if you are having trouble with click
+     * events. Prefer using 'handle' / 'cancel' instead.
+     *
+     * Defaults to `false`.
+     */
+    allowMobileScroll: n.default.bool,
+    children: n.default.node.isRequired,
+    /**
+     * `disabled`, if true, stops the <Draggable> from dragging. All handlers,
+     * with the exception of `onMouseDown`, will not fire.
+     */
+    disabled: n.default.bool,
+    /**
+     * By default, we add 'user-select:none' attributes to the document body
+     * to prevent ugly text selection during drag. If this is causing problems
+     * for your app, set this to `false`.
+     */
+    enableUserSelectHack: n.default.bool,
+    /**
+     * `offsetParent`, if set, uses the passed DOM node to compute drag offsets
+     * instead of using the parent node.
+     */
+    offsetParent: function(v, b) {
+      if (v[b] && v[b].nodeType !== 1)
+        throw new Error("Draggable's offsetParent must be a DOM Node.");
+    },
+    /**
+     * `grid` specifies the x and y that dragging should snap to.
+     */
+    grid: n.default.arrayOf(n.default.number),
+    /**
+     * `handle` specifies a selector to be used as the handle that initiates drag.
+     *
+     * Example:
+     *
+     * ```jsx
+     *   let App = React.createClass({
+     *       render: function () {
+     *         return (
+     *            <Draggable handle=".handle">
+     *              <div>
+     *                  <div className="handle">Click me to drag</div>
+     *                  <div>This is some other content</div>
+     *              </div>
+     *           </Draggable>
+     *         );
+     *       }
+     *   });
+     * ```
+     */
+    handle: n.default.string,
+    /**
+     * `cancel` specifies a selector to be used to prevent drag initialization.
+     *
+     * Example:
+     *
+     * ```jsx
+     *   let App = React.createClass({
+     *       render: function () {
+     *           return(
+     *               <Draggable cancel=".cancel">
+     *                   <div>
+     *                     <div className="cancel">You can't drag from here</div>
+     *                     <div>Dragging here works fine</div>
+     *                   </div>
+     *               </Draggable>
+     *           );
+     *       }
+     *   });
+     * ```
+     */
+    cancel: n.default.string,
+    /* If running in React Strict mode, ReactDOM.findDOMNode() is deprecated.
+     * Unfortunately, in order for <Draggable> to work properly, we need raw access
+     * to the underlying DOM node. If you want to avoid the warning, pass a `nodeRef`
+     * as in this example:
+     *
+     * function MyComponent() {
+     *   const nodeRef = React.useRef(null);
+     *   return (
+     *     <Draggable nodeRef={nodeRef}>
+     *       <div ref={nodeRef}>Example Target</div>
+     *     </Draggable>
+     *   );
+     * }
+     *
+     * This can be used for arbitrarily nested components, so long as the ref ends up
+     * pointing to the actual child DOM node and not a custom component.
+     */
+    nodeRef: n.default.object,
+    /**
+     * Called when dragging starts.
+     * If this function returns the boolean false, dragging will be canceled.
+     */
+    onStart: n.default.func,
+    /**
+     * Called while dragging.
+     * If this function returns the boolean false, dragging will be canceled.
+     */
+    onDrag: n.default.func,
+    /**
+     * Called when dragging stops.
+     * If this function returns the boolean false, the drag will remain active.
+     */
+    onStop: n.default.func,
+    /**
+     * A workaround option which can be passed if onMouseDown needs to be accessed,
+     * since it'll always be blocked (as there is internal use of onMouseDown)
+     */
+    onMouseDown: n.default.func,
+    /**
+     * `scale`, if set, applies scaling while dragging an element
+     */
+    scale: n.default.number,
+    /**
+     * These properties should be defined on the child, not here.
+     */
+    className: o.dontSetMe,
+    style: o.dontSetMe,
+    transform: o.dontSetMe
+  }), g(x, "defaultProps", {
+    allowAnyClick: !1,
+    // by default only accept left click
+    allowMobileScroll: !1,
+    disabled: !1,
+    enableUserSelectHack: !0,
+    onStart: function() {
+    },
+    onDrag: function() {
+    },
+    onStop: function() {
+    },
+    onMouseDown: function() {
+    },
+    scale: 1
+  }), he;
+}
+var ot;
+function gn() {
+  return ot || (ot = 1, (function(e) {
+    Object.defineProperty(e, "__esModule", {
+      value: !0
+    }), Object.defineProperty(e, "DraggableCore", {
+      enumerable: !0,
+      get: function() {
+        return p.default;
+      }
+    }), e.default = void 0;
+    var n = u(se), t = h(/* @__PURE__ */ vt()), r = h(st), i = un(), o = Re(), s = bt(), d = xe(), p = h(hn()), g = h(wt());
+    function h(C) {
+      return C && C.__esModule ? C : { default: C };
+    }
+    function u(C, T) {
+      if (typeof WeakMap == "function") var S = /* @__PURE__ */ new WeakMap(), D = /* @__PURE__ */ new WeakMap();
+      return (u = function(c, N) {
+        if (!N && c && c.__esModule) return c;
+        var l, f, P = { __proto__: null, default: c };
+        if (c === null || typeof c != "object" && typeof c != "function") return P;
+        if (l = N ? D : S) {
+          if (l.has(c)) return l.get(c);
+          l.set(c, P);
+        }
+        for (const $ in c) $ !== "default" && {}.hasOwnProperty.call(c, $) && ((f = (l = Object.defineProperty) && Object.getOwnPropertyDescriptor(c, $)) && (f.get || f.set) ? l(P, $, f) : P[$] = c[$]);
+        return P;
+      })(C, T);
+    }
+    function m() {
+      return m = Object.assign ? Object.assign.bind() : function(C) {
+        for (var T = 1; T < arguments.length; T++) {
+          var S = arguments[T];
+          for (var D in S) ({}).hasOwnProperty.call(S, D) && (C[D] = S[D]);
+        }
+        return C;
+      }, m.apply(null, arguments);
+    }
+    function y(C, T, S) {
+      return (T = x(T)) in C ? Object.defineProperty(C, T, { value: S, enumerable: !0, configurable: !0, writable: !0 }) : C[T] = S, C;
+    }
+    function x(C) {
+      var T = v(C, "string");
+      return typeof T == "symbol" ? T : T + "";
+    }
+    function v(C, T) {
+      if (typeof C != "object" || !C) return C;
+      var S = C[Symbol.toPrimitive];
+      if (S !== void 0) {
+        var D = S.call(C, T);
+        if (typeof D != "object") return D;
+        throw new TypeError("@@toPrimitive must return a primitive value.");
+      }
+      return (T === "string" ? String : Number)(C);
+    }
+    class b extends n.Component {
+      // React 16.3+
+      // Arity (props, state)
+      static getDerivedStateFromProps(T, S) {
+        let {
+          position: D
+        } = T, {
+          prevPropsPosition: c
+        } = S;
+        return D && (!c || D.x !== c.x || D.y !== c.y) ? ((0, g.default)("Draggable: getDerivedStateFromProps %j", {
+          position: D,
+          prevPropsPosition: c
+        }), {
+          x: D.x,
+          y: D.y,
+          prevPropsPosition: {
+            ...D
+          }
+        }) : null;
+      }
+      constructor(T) {
+        super(T), y(this, "onDragStart", (S, D) => {
+          if ((0, g.default)("Draggable: onDragStart: %j", D), this.props.onStart(S, (0, s.createDraggableData)(this, D)) === !1) return !1;
+          this.setState({
+            dragging: !0,
+            dragged: !0
+          });
+        }), y(this, "onDrag", (S, D) => {
+          if (!this.state.dragging) return !1;
+          (0, g.default)("Draggable: onDrag: %j", D);
+          const c = (0, s.createDraggableData)(this, D), N = {
+            x: c.x,
+            y: c.y,
+            slackX: 0,
+            slackY: 0
+          };
+          if (this.props.bounds) {
+            const {
+              x: f,
+              y: P
+            } = N;
+            N.x += this.state.slackX, N.y += this.state.slackY;
+            const [$, O] = (0, s.getBoundPosition)(this, N.x, N.y);
+            N.x = $, N.y = O, N.slackX = this.state.slackX + (f - N.x), N.slackY = this.state.slackY + (P - N.y), c.x = N.x, c.y = N.y, c.deltaX = N.x - this.state.x, c.deltaY = N.y - this.state.y;
+          }
+          if (this.props.onDrag(S, c) === !1) return !1;
+          this.setState(N);
+        }), y(this, "onDragStop", (S, D) => {
+          if (!this.state.dragging || this.props.onStop(S, (0, s.createDraggableData)(this, D)) === !1) return !1;
+          (0, g.default)("Draggable: onDragStop: %j", D);
+          const N = {
+            dragging: !1,
+            slackX: 0,
+            slackY: 0
+          };
+          if (!!this.props.position) {
+            const {
+              x: f,
+              y: P
+            } = this.props.position;
+            N.x = f, N.y = P;
+          }
+          this.setState(N);
+        }), this.state = {
+          // Whether or not we are currently dragging.
+          dragging: !1,
+          // Whether or not we have been dragged before.
+          dragged: !1,
+          // Current transform x and y.
+          x: T.position ? T.position.x : T.defaultPosition.x,
+          y: T.position ? T.position.y : T.defaultPosition.y,
+          prevPropsPosition: {
+            ...T.position
+          },
+          // Used for compensating for out-of-bounds drags
+          slackX: 0,
+          slackY: 0,
+          // Can only determine if SVG after mounting
+          isElementSVG: !1
+        }, T.position && !(T.onDrag || T.onStop) && console.warn("A `position` was applied to this <Draggable>, without drag handlers. This will make this component effectively undraggable. Please attach `onDrag` or `onStop` handlers so you can adjust the `position` of this element.");
+      }
+      componentDidMount() {
+        typeof window.SVGElement < "u" && this.findDOMNode() instanceof window.SVGElement && this.setState({
+          isElementSVG: !0
+        });
+      }
+      componentWillUnmount() {
+        this.state.dragging && this.setState({
+          dragging: !1
+        });
+      }
+      // React Strict Mode compatibility: if `nodeRef` is passed, we will use it instead of trying to find
+      // the underlying DOM node ourselves. See the README for more information.
+      findDOMNode() {
+        return this.props?.nodeRef?.current ?? r.default.findDOMNode(this);
+      }
+      render() {
+        const {
+          axis: T,
+          bounds: S,
+          children: D,
+          defaultPosition: c,
+          defaultClassName: N,
+          defaultClassNameDragging: l,
+          defaultClassNameDragged: f,
+          position: P,
+          positionOffset: $,
+          scale: O,
+          ...E
+        } = this.props;
+        let z = {}, X = null;
+        const H = !!!P || this.state.dragging, ee = P || c, ae = {
+          // Set left if horizontal drag is enabled
+          x: (0, s.canDragX)(this) && H ? this.state.x : ee.x,
+          // Set top if vertical drag is enabled
+          y: (0, s.canDragY)(this) && H ? this.state.y : ee.y
+        };
+        this.state.isElementSVG ? X = (0, o.createSVGTransform)(ae, $) : z = (0, o.createCSSTransform)(ae, $);
+        const de = (0, i.clsx)(D.props.className || "", N, {
+          [l]: this.state.dragging,
+          [f]: this.state.dragged
+        });
+        return /* @__PURE__ */ n.createElement(p.default, m({}, E, {
+          onStart: this.onDragStart,
+          onDrag: this.onDrag,
+          onStop: this.onDragStop
+        }), /* @__PURE__ */ n.cloneElement(n.Children.only(D), {
+          className: de,
+          style: {
+            ...D.props.style,
+            ...z
+          },
+          transform: X
+        }));
+      }
+    }
+    e.default = b, y(b, "displayName", "Draggable"), y(b, "propTypes", {
+      // Accepts all props <DraggableCore> accepts.
+      ...p.default.propTypes,
+      /**
+       * `axis` determines which axis the draggable can move.
+       *
+       *  Note that all callbacks will still return data as normal. This only
+       *  controls flushing to the DOM.
+       *
+       * 'both' allows movement horizontally and vertically.
+       * 'x' limits movement to horizontal axis.
+       * 'y' limits movement to vertical axis.
+       * 'none' limits all movement.
+       *
+       * Defaults to 'both'.
+       */
+      axis: t.default.oneOf(["both", "x", "y", "none"]),
+      /**
+       * `bounds` determines the range of movement available to the element.
+       * Available values are:
+       *
+       * 'parent' restricts movement within the Draggable's parent node.
+       *
+       * Alternatively, pass an object with the following properties, all of which are optional:
+       *
+       * {left: LEFT_BOUND, right: RIGHT_BOUND, bottom: BOTTOM_BOUND, top: TOP_BOUND}
+       *
+       * All values are in px.
+       *
+       * Example:
+       *
+       * ```jsx
+       *   let App = React.createClass({
+       *       render: function () {
+       *         return (
+       *            <Draggable bounds={{right: 300, bottom: 300}}>
+       *              <div>Content</div>
+       *           </Draggable>
+       *         );
+       *       }
+       *   });
+       * ```
+       */
+      bounds: t.default.oneOfType([t.default.shape({
+        left: t.default.number,
+        right: t.default.number,
+        top: t.default.number,
+        bottom: t.default.number
+      }), t.default.string, t.default.oneOf([!1])]),
+      defaultClassName: t.default.string,
+      defaultClassNameDragging: t.default.string,
+      defaultClassNameDragged: t.default.string,
+      /**
+       * `defaultPosition` specifies the x and y that the dragged item should start at
+       *
+       * Example:
+       *
+       * ```jsx
+       *      let App = React.createClass({
+       *          render: function () {
+       *              return (
+       *                  <Draggable defaultPosition={{x: 25, y: 25}}>
+       *                      <div>I start with transformX: 25px and transformY: 25px;</div>
+       *                  </Draggable>
+       *              );
+       *          }
+       *      });
+       * ```
+       */
+      defaultPosition: t.default.shape({
+        x: t.default.number,
+        y: t.default.number
+      }),
+      positionOffset: t.default.shape({
+        x: t.default.oneOfType([t.default.number, t.default.string]),
+        y: t.default.oneOfType([t.default.number, t.default.string])
+      }),
+      /**
+       * `position`, if present, defines the current position of the element.
+       *
+       *  This is similar to how form elements in React work - if no `position` is supplied, the component
+       *  is uncontrolled.
+       *
+       * Example:
+       *
+       * ```jsx
+       *      let App = React.createClass({
+       *          render: function () {
+       *              return (
+       *                  <Draggable position={{x: 25, y: 25}}>
+       *                      <div>I start with transformX: 25px and transformY: 25px;</div>
+       *                  </Draggable>
+       *              );
+       *          }
+       *      });
+       * ```
+       */
+      position: t.default.shape({
+        x: t.default.number,
+        y: t.default.number
+      }),
+      /**
+       * These properties should be defined on the child, not here.
+       */
+      className: d.dontSetMe,
+      style: d.dontSetMe,
+      transform: d.dontSetMe
+    }), y(b, "defaultProps", {
+      ...p.default.defaultProps,
+      axis: "both",
+      bounds: !1,
+      defaultClassName: "react-draggable",
+      defaultClassNameDragging: "react-draggable-dragging",
+      defaultClassNameDragged: "react-draggable-dragged",
+      defaultPosition: {
+        x: 0,
+        y: 0
+      },
+      scale: 1
+    });
+  })(De)), De;
+}
+var it;
+function mn() {
+  if (it) return fe.exports;
+  it = 1;
+  const {
+    default: e,
+    DraggableCore: n
+  } = gn();
+  return fe.exports = e, fe.exports.default = e, fe.exports.DraggableCore = n, fe.exports;
+}
+var pn = mn();
+const yn = /* @__PURE__ */ rn(pn), vn = le((e, n) => {
+  const r = {
+    ...{
+      // 1. Take it out of the document flow
+      position: "fixed",
+      // 2. Set initial viewport position (e.g., top right)
+      top: "6rem",
+      right: "1rem",
+      // 3. Ensure it stacks above other content
+      zIndex: 1,
+      // Add your layout/appearance styles
+      width: "360px",
+      minHeight: "360px",
+      borderStyle: "solid",
+      borderWidth: "3px",
+      boxShadow: "rgba(0, 0, 0, 0.5) 7px 7px 10px 0px"
+    },
+    ...e.style || {}
+  }, i = e.testId || "not-set", o = e.className || "panel", s = xt(null);
+  return (
+    // 3. Pass the internal ref to the Draggable component via 'nodeRef'
+    /* @__PURE__ */ a(
+      yn,
+      {
+        nodeRef: s,
+        "data-testid": i,
+        axis: "both",
+        handle: ".handle",
+        onStart: (g, h) => {
+          e.onDraggingChange?.(!0);
+        },
+        onStop: (g, h) => {
+          setTimeout(() => {
+            e.onDraggingChange?.(!1);
+          }, 100);
+        },
+        children: /* @__PURE__ */ a("div", { ref: s, className: o, style: r, children: e.children })
+      }
+    )
+  );
+});
+function er({ children: e }) {
+  return /* @__PURE__ */ a(
+    "div",
+    {
+      className: "w-full h-full flex-1 flex flex-col gap-2 items-end justify-end content-end",
+      style: {
+        minHeight: "140px"
+      },
+      children: e
+    }
+  );
+}
+function tr({ children: e }) {
+  return /* @__PURE__ */ a("div", { className: "w-full flex flex-col items-end", children: e });
+}
+const nr = (e) => {
+  console.warn("showToast TODO", e);
+}, bn = (e) => e < 0.8 ? 1 : e <= 1 ? 0 : e > 1 ? -1 : 0, rr = le((e, n) => {
+  let t = lt(Number(e.zoomScale || 0));
+  const r = e.responsiveGrid || !1, i = e.isEditing || !1, o = {
+    "--bwj-dashboard-transform-scale": t,
+    "--bwj-dashboard-add-cols": bn(t)
+  }, s = Z(
+    "dashboard-main-grid w-full",
+    i ? "editing" : "",
+    r ? "responsive-grid" : "",
+    //`border border-dashed ${isEditing ? 'border-primary border-opacity-50' : 'border-transparent'}`,
+    "border border-solid border-primary"
+  );
+  return /* @__PURE__ */ a("div", { className: s, style: o, children: e.children });
+}), $e = "size-5", wn = (e, n) => {
+  const t = e.hideTitle && !e.isEditing, r = e.noBorder;
+  let i = `dashboard-widget ${e.isEditing ? "editing" : ""} border border-solid`;
+  r ? i = `${i} border-transparent border-opacity-0` : (e.borderCssClasses || "").trim().length > 0 ? i = `${i} ${e.borderCssClasses}` : i = `${i} border-card-invert border-opacity-20`, e.noShadow && (i = `${i} no-shadow`), e.noPadding && (i = `${i} no-padding p-0`), (e.backgroundCssClasses || "").trim().length > 0 ? i = `${i} ${e.backgroundCssClasses}` : i = `${i} bg-card content-card`, ["large", "xlarge"].indexOf(e.size || "") > -1 && (i = `${i} ${e.size}-widget`);
+  const o = () => {
+    e.onRemoveClick && e.widgetKey && e.onRemoveClick(e.widgetKey, e.parentWidgetKey);
+  }, s = (p) => {
+    e.onMoveClick && e.widgetKey && e.onMoveClick(p, e.widgetKey, e.parentWidgetKey);
+  }, d = Z(
+    "widget-header",
+    t ? "hidden" : "flex items-center justify-between border-b border-solid border-card-invert",
+    t ? "border-opacity-0" : "border-opacity-20"
+  );
+  return /* @__PURE__ */ W("div", { className: i, children: [
+    /* @__PURE__ */ W("div", { className: d, children: [
+      /* @__PURE__ */ W("div", { className: "widget-title-wrapper w-full flex flex-row gap-2 items-center justify-between", children: [
+        /* @__PURE__ */ W("h2", { className: "widget-title", children: [
+          e.title,
+          " "
+        ] }),
+        /* @__PURE__ */ a("div", {})
+      ] }),
+      /* @__PURE__ */ a("div", { "data-testid": "collapse-and-other-actions", children: /* @__PURE__ */ W("div", { className: "actions-inner", children: [
+        /* @__PURE__ */ a("div", { children: /* @__PURE__ */ a("span", { className: "hidden", children: "Widget" }) }),
+        /* @__PURE__ */ W("div", { className: "actions-buttons-container", children: [
+          /* @__PURE__ */ a(
+            J,
+            {
+              "data-testid": `move-widget-left_${e.title}`,
+              isIconButton: !0,
+              disabled: e.index < 1,
+              tooltip: {
+                placement: "top",
+                title: `${e.index < 1 ? "Already at min position" : "Move Widget to the left/up"}`
+              },
+              onClick: () => s(-1),
+              children: /* @__PURE__ */ a(ut, { className: $e })
+            }
+          ),
+          /* @__PURE__ */ a(
+            J,
+            {
+              "data-testid": `move-widget-right_${e.title}`,
+              isIconButton: !0,
+              disabled: e.index >= e.maxIndex,
+              tooltip: {
+                placement: "top",
+                title: `${e.index >= e.maxIndex ? "Already at max position" : "Move Widget to the right/down"}`
+              },
+              onClick: () => s(1),
+              children: /* @__PURE__ */ a(ft, { className: $e })
+            }
+          ),
+          /* @__PURE__ */ a(
+            J,
+            {
+              "data-testid": `remove-container_${e.title}`,
+              isIconButton: !0,
+              tooltip: {
+                placement: "top",
+                title: "Remove Widget"
+              },
+              onClick: () => o(),
+              children: /* @__PURE__ */ a(ht, { className: $e })
+            }
+          )
+        ] })
+      ] }) })
+    ] }),
+    /* @__PURE__ */ a("div", { className: "widget-inner", children: e.children })
+  ] });
+}, xn = le(wn);
+function Cn(e) {
+  return /* @__PURE__ */ a("div", { className: "dashboard-widget", children: /* @__PURE__ */ W("div", { className: "absolute inset-0 bg-black flex flex-col items-center justify-center text-center", children: [
+    /* @__PURE__ */ a("div", { className: "w-full absolute opacity-100 text-primary", children: e.title }),
+    /* @__PURE__ */ a("div", { className: "animate-ping rounded-full h-32 w-32 border-8 border-white" })
+  ] }) });
+}
+function Sn({
+  index: e,
+  maxIndex: n,
+  widgetKey: t,
+  parentWidgetKey: r,
+  targetContainerKey: i,
+  childWidgetsConfig: o,
+  widgetCatalog: s,
+  isEditing: d,
+  onRemoveClick: p,
+  onMoveClick: g,
+  selectContainer: h
+}) {
+  const u = `${t}`.split("_"), m = u.length > 1, y = m ? u[0] : t, x = s.get(y);
+  if (!x)
+    return /* @__PURE__ */ a("div", { className: "flex", children: /* @__PURE__ */ W("p", { children: [
+      "Widget not found in catalog: ",
+      y
+    ] }) });
+  let v = null, b = !1;
+  if (x.component ? (v = x.component, b = !1) : x.loader && (b = !0, v = at(() => {
+    if (!x) return null;
+    if (x.component)
+      return x.component;
+    if (x.loader) {
+      const l = async () => {
+        try {
+          return await x.loader();
+        } catch (f) {
+          return console.error(`CDN Load Failure for ${t}:`, f), {
+            default: () => /* @__PURE__ */ a(xn, { ...D, children: /* @__PURE__ */ W("div", { className: "p-4 border border-dashed border-danger", children: [
+              /* @__PURE__ */ W("p", { className: "font-bold", children: [
+                'Failed to load "',
+                t,
+                '"'
+              ] }),
+              /* @__PURE__ */ a("p", { className: "text-xs italic", children: "The remote plugin is unavailable or incompatible." }),
+              /* @__PURE__ */ a("pre", { className: "text-xs overflow-hidden", children: JSON.stringify(x.meta || {}, null, 2) })
+            ] }) })
+          };
+        }
+      };
+      return se.lazy(l);
+    }
+    return null;
+  }, [x, t])), !v)
+    return /* @__PURE__ */ a("div", { className: "flex", children: /* @__PURE__ */ W("p", { children: [
+      "Widget definition incomplete: ",
+      y
+    ] }) });
+  const C = !!x.isContainer, T = m ? gt(t) : "", S = C ? (o || []).filter((l) => l.parentWidgetKey === t) : [], D = {
+    index: e,
+    maxIndex: n,
+    widgetKey: t,
+    parentWidgetKey: r,
+    isEditing: d,
+    title: m ? T : x.title,
+    onRemoveClick: p,
+    onMoveClick: g
+  }, c = C ? {
+    highlight: i === t,
+    selectContainer: h,
+    // The children prop is the recursive call back to DynamicWidgetLoader
+    children: S.map((l, f) => /* @__PURE__ */ a(
+      Sn,
+      {
+        index: f,
+        maxIndex: S.length - 1,
+        widgetKey: l.widgetKey,
+        parentWidgetKey: l.parentWidgetKey,
+        widgetCatalog: s,
+        isEditing: d,
+        onRemoveClick: p,
+        onMoveClick: g
+      },
+      `${l.widgetKey}_${f}`
+    ))
+  } : {}, N = () => /* @__PURE__ */ a(v, { ...D, ...c });
+  return b ? /* @__PURE__ */ a(Ct, { fallback: /* @__PURE__ */ a(Cn, { title: `Loading ${x.title}` }), children: /* @__PURE__ */ a(N, {}) }) : /* @__PURE__ */ a(N, {});
+}
+const we = "size-5";
+function ke(e) {
+  const n = e.highlight || !1, t = e.direction || "column", r = e.children.length > 0, i = e.isEditing || !1;
+  let d = n ? "border-transparent" : i && !r ? "border-card-invert" : "border-transparent";
+  const p = ["large", "xlarge"].includes(e.size || "");
+  let g = "";
+  ["large", "xlarge"].indexOf(e.size || "") > -1 && (g = `${e.size}-widget`);
+  let h = "";
+  t === "row" && !r ? h = "min-h-48" : t === "column" && !r && (h = "min-h-96");
+  let u = Z(
+    "dashboard-widget-container relative ",
+    r ? "" : "has-no-children",
+    i ? "editing" : "",
+    h,
+    g,
+    p ? "widget-container-grid" : "widget-container-flex",
+    `direction-${t}`,
+    `border ${d}`,
+    `${n ? "highlight-container" : ""} ${d}`
+  ), m = `widget-container-header direction-${t} flex items-center border-1 ${d}`;
+  const y = () => {
+    e.onRemoveClick && e.widgetKey && e.onRemoveClick(e.widgetKey);
+  }, x = (b) => {
+    e.onMoveClick && e.widgetKey && e.onMoveClick(b, e.widgetKey, e.parentWidgetKey);
+  }, v = () => {
+    e.selectContainer && e.widgetKey && e.selectContainer(e.widgetKey);
+  };
+  return /* @__PURE__ */ W("div", { "data-testid": `container_${e.widgetKey}`, className: u, children: [
+    /* @__PURE__ */ W("div", { className: m, children: [
+      /* @__PURE__ */ a(
+        "div",
+        {
+          className: "widget-title-wrapper w-full flex whitespace-nowrap",
+          onClick: v,
+          children: /* @__PURE__ */ a("span", { className: "text-sm font-semibold capitalize", children: e.title })
+        }
+      ),
+      /* @__PURE__ */ a("div", { "data-testid": "collapse-and-other-actions", children: /* @__PURE__ */ a("div", { className: "actions-inner", children: /* @__PURE__ */ W("div", { className: "actions-buttons-container", children: [
+        /* @__PURE__ */ a(
+          J,
+          {
+            "data-testid": `open-widgets-catalog-from-container_${e.title}`,
+            isIconButton: !0,
+            className: "whitespace-nowrap",
+            tooltip: {
+              placement: "top",
+              title: "Target this Container"
+            },
+            onClick: v,
+            children: /* @__PURE__ */ a(
+              Qt,
+              {
+                className: `${we} ${n ? "text-success" : "text-disabled"}`
+              }
+            )
+          }
+        ),
+        /* @__PURE__ */ a(
+          J,
+          {
+            "data-testid": `move-container-left_${e.title}`,
+            isIconButton: !0,
+            disabled: e.index < 1,
+            tooltip: {
+              placement: "top",
+              title: `${e.index < 1 ? "Already at min position" : "Move Container to the left/up"}`
+            },
+            onClick: () => x(-1),
+            children: /* @__PURE__ */ a(ut, { className: we })
+          }
+        ),
+        /* @__PURE__ */ a(
+          J,
+          {
+            "data-testid": `move-container-right_${e.title}`,
+            isIconButton: !0,
+            disabled: e.index >= e.maxIndex,
+            tooltip: {
+              placement: "top",
+              title: `${e.index >= e.maxIndex ? "Already at max position" : "Move Container to the right/down"}`
+            },
+            onClick: () => x(1),
+            children: /* @__PURE__ */ a(ft, { className: we })
+          }
+        ),
+        /* @__PURE__ */ a(
+          J,
+          {
+            "data-testid": `remove-container_${e.title}`,
+            isIconButton: !0,
+            tooltip: {
+              placement: "top",
+              title: "Remove Container"
+            },
+            onClick: () => y(),
+            children: /* @__PURE__ */ a(ht, { className: we })
+          }
+        )
+      ] }) }) })
+    ] }),
+    /* @__PURE__ */ a("div", { "data-testid": `childrenwrapper_${e.widgetKey}`, className: "widget-container-inner", children: e.children })
+  ] });
+}
+function or(e) {
+  const { direction: n, ...t } = e;
+  return /* @__PURE__ */ a(ke, { direction: "column", ...t });
+}
+function ir(e) {
+  const { size: n, ...t } = e;
+  return /* @__PURE__ */ a(ke, { size: "large", ...t });
+}
+function ar(e) {
+  const { direction: n, ...t } = e;
+  return /* @__PURE__ */ a(ke, { direction: "row", ...t });
+}
+function We({
+  // widgetKey,
+  metaData: e,
+  alreadyAdded: n,
+  addWidget: t
+}) {
+  const r = e.icon || en, i = e.displayName || "Unknown", o = e.description || "---", d = (e.noDuplicatedWidgets || !1) && n, p = Z(`
+    flex flex-row gap-2 p-2 rounded-md border text-sm bg-card content-card backdrop-opacity-100
+    ${d ? "border-disabled fill-disabled text-disabled" : "cursor-pointer border-primary fill-danger hover:fill-primary content-primary hover:brightness-110"}
+  `);
+  return /* @__PURE__ */ W("div", { className: p, style: { width: "calc(100% - 1rem)" }, onClick: () => {
+    d || t();
+  }, children: [
+    /* @__PURE__ */ a(r, { className: "" }),
+    /* @__PURE__ */ W("div", { className: "w-full", children: [
+      /* @__PURE__ */ W("div", { className: "flex flex-row items-center gap-2 justify-between", children: [
+        /* @__PURE__ */ a("span", { className: "font-bold", children: i }),
+        /* @__PURE__ */ a("div", { className: "text-xs", children: d ? "(Added)" : "" })
+      ] }),
+      /* @__PURE__ */ a("div", { className: "flex flex-col gap-2 text-xs", children: /* @__PURE__ */ a("div", { children: o }) })
+    ] })
+  ] });
+}
+function Dn({
+  item: e,
+  onSettingItemChanged: n
+}) {
+  const t = e.displayName || "Unknown", r = e.description || "---", i = Z(`
+    flex flex-row gap-2 p-2 rounded-md border text-sm bg-card content-card backdrop-opacity-100
+  `), o = (d) => {
+    const p = d.key;
+    if (["ArrowUp", "ArrowDown"].includes(p)) {
+      d.preventDefault();
+      const g = Et.incrementOrDecrementValue(
+        e,
+        p === "ArrowUp" ? 1 : -1
+      );
+      n(g);
+    }
+  }, s = (d) => {
+    n({
+      ...e,
+      value: d.target.value || ""
+    });
+  };
+  return /* @__PURE__ */ a("div", { className: i, style: { width: "calc(100% - 1rem)" }, children: /* @__PURE__ */ W("div", { className: "w-full", children: [
+    /* @__PURE__ */ a("div", { className: "flex flex-row items-center gap-2 justify-between", children: /* @__PURE__ */ a("span", { className: "font-bold", children: t }) }),
+    /* @__PURE__ */ a("div", { className: "flex flex-col gap-2 text-xs", children: /* @__PURE__ */ a("div", { children: r }) }),
+    /* @__PURE__ */ W("div", { children: [
+      "Value:",
+      /* @__PURE__ */ a(
+        mt,
+        {
+          label: "Filter...",
+          size: "small",
+          className: "w-full",
+          value: e.value,
+          onChange: s,
+          onKeyDown: o
+        }
+      )
+    ] })
+  ] }) });
+}
+const Ie = (e, n) => [
+  ...n.widgets.filter((r) => r.indexOf("Container") === -1),
+  ...n.childWidgetsConfig.map((r) => r.widgetKey)
+].includes(e);
+function sr({
+  targetContainerKey: e,
+  widgetsCatalog: n,
+  currentDashboardConfig: t,
+  undoStatus: r,
+  addWidget: i,
+  addContainer: o,
+  onSettingItemsUpdated: s,
+  onResetToDefaultDashboardClick: d,
+  onUndoOrRedo: p,
+  onDoneClick: g
+}) {
+  const [h, u] = ce("Editing"), [m, y] = ce(0), [x, v] = ce(""), C = Array.from(n.keys()).map((E) => ({
+    widgetKey: E,
+    metaData: Pt(E, n)
+  })), T = (E) => {
+    v(E.target.value);
+  }, S = (E) => {
+    const z = x.trim().toLowerCase();
+    return z.length < 1 ? !0 : E.displayName.trim().toLowerCase().includes(z) || E.description.toLowerCase().includes(z);
+  }, D = (E) => {
+    const z = x.trim().toLowerCase();
+    return z.length < 1 ? !0 : E.displayName.trim().toLowerCase().includes(z) || E.description.toLowerCase().includes(z);
+  }, c = (E) => Z(
+    "px-4 py-2 font-medium cursor-pointer border-b-2 border-transparent hover:border-primary focus:outline-none",
+    E === m ? "text-primary border-primary" : ""
+  ), N = !!e;
+  St(() => {
+    if (e) {
+      y(0);
+      const E = gt(e);
+      u(`Editing ${E}`);
+    } else
+      u("Editing Dashboard");
+  }, [e]);
+  const l = (E) => {
+    N ? i(E, e) : i(E);
+  }, f = (E) => {
+    const z = (t.cssSettings || []).map((X) => X.key === E.key ? E : X);
+    s(z);
+  }, [P, $] = ce(!1);
+  return /* @__PURE__ */ a(
+    vn,
+    {
+      testId: "dashboard-catalog-flyout",
+      className: "bg-body content-body bg-opacity-70 border-2 border-primary",
+      style: {
+        width: "360px",
+        minWidth: "360px",
+        maxWidth: "360px",
+        minHeight: "360px",
+        backdropFilter: "blur(8px)"
+      },
+      onDraggingChange: (E) => {
+        $(E);
+      },
+      children: /* @__PURE__ */ W("div", { className: "flex flex-col gap-2 p-2", children: [
+        /* @__PURE__ */ W("div", { className: "flex flex-row gap-2 justify-between", children: [
+          /* @__PURE__ */ W("div", { className: "handle flex-1 flex gap-2 w-full hover:text-primary cursor-grab", children: [
+            P ? /* @__PURE__ */ a(Jt, { className: "size-5" }) : /* @__PURE__ */ a(Zt, { className: "size-5" }),
+            /* @__PURE__ */ a(
+              "h2",
+              {
+                className: "flex-1 text-base margin-0 capitalize",
+                title: N ? h : `Editing dashboard: ${t.dashboardName}`,
+                children: h
+              }
+            )
+          ] }),
+          /* @__PURE__ */ W("div", { className: "flex flex-row gap-2 items-center", children: [
+            /* @__PURE__ */ a(
+              J,
+              {
+                "data-testid": "undo-dashboard-config-change",
+                isIconButton: !0,
+                tooltip: {
+                  placement: "bottom",
+                  title: "Undo"
+                },
+                disabled: r.isUndoDisabled,
+                onClick: () => p("Undo"),
+                children: /* @__PURE__ */ a(Xt, { className: "size-5" })
+              }
+            ),
+            /* @__PURE__ */ a(
+              J,
+              {
+                "data-testid": "redo-dashboard-config-change",
+                isIconButton: !0,
+                tooltip: {
+                  placement: "bottom",
+                  title: "Redo"
+                },
+                disabled: r.isRedoDisabled,
+                onClick: () => p("Redo"),
+                children: /* @__PURE__ */ a(Gt, { className: "size-5" })
+              }
+            ),
+            /* @__PURE__ */ a(
+              J,
+              {
+                "data-testid": "reset-dashboard-to-default",
+                isIconButton: !0,
+                tooltip: {
+                  placement: "bottom",
+                  title: "Reset this dashboard to the default configuration"
+                },
+                onClick: d,
+                children: /* @__PURE__ */ a(Ht, { className: "size-5" })
+              }
+            )
+          ] })
+        ] }),
+        /* @__PURE__ */ W("div", { className: "flex border-b border-gray-200", children: [
+          /* @__PURE__ */ a("button", { onClick: () => y(0), className: c(0), children: "Widgets" }),
+          /* @__PURE__ */ a("button", { onClick: () => y(1), className: c(1), children: "Charts" }),
+          !N && /* @__PURE__ */ a("button", { onClick: () => y(2), className: c(2), children: "Containers" }),
+          !N && /* @__PURE__ */ a("button", { onClick: () => y(3), className: c(3), children: /* @__PURE__ */ a(Kt, {}) })
+        ] }),
+        /* @__PURE__ */ a("div", { className: "flex items-center justify-between gap-1 w-full", children: /* @__PURE__ */ a(
+          mt,
+          {
+            label: "Filter...",
+            size: "small",
+            className: "w-full",
+            value: x,
+            onChange: T
+          }
+        ) }),
+        /* @__PURE__ */ W(
+          "div",
+          {
+            className: "flex flex-col gap-2 overflow-x-hidden overflow-y-auto",
+            style: {
+              maxHeight: "360px"
+            },
+            children: [
+              m === 0 && C.filter(
+                (E) => E.metaData.categories.includes("Widget") && S(E.metaData)
+              ).map((E) => /* @__PURE__ */ a(
+                We,
+                {
+                  widgetKey: E.widgetKey,
+                  metaData: E.metaData,
+                  alreadyAdded: Ie(E.widgetKey, t),
+                  addWidget: () => l(E.widgetKey)
+                },
+                E.widgetKey
+              )),
+              m === 1 && C.filter(
+                (E) => E.metaData.categories.includes("Chart") && S(E.metaData)
+              ).map((E) => /* @__PURE__ */ a(
+                We,
+                {
+                  widgetKey: E.widgetKey,
+                  metaData: E.metaData,
+                  alreadyAdded: Ie(E.widgetKey, t),
+                  addWidget: () => l(E.widgetKey)
+                },
+                E.widgetKey
+              )),
+              !N && m === 2 && C.filter((E) => E.metaData.categories.includes("Container")).map((E) => /* @__PURE__ */ a(
+                We,
+                {
+                  widgetKey: E.widgetKey,
+                  metaData: E.metaData,
+                  alreadyAdded: Ie(E.widgetKey, t),
+                  addWidget: () => o(E.widgetKey)
+                },
+                E.widgetKey
+              )),
+              !N && m === 3 && (t.cssSettings || []).filter(D).map((E) => /* @__PURE__ */ a(
+                Dn,
+                {
+                  item: E,
+                  onSettingItemChanged: f
+                },
+                E.key
+              ))
+            ]
+          }
+        ),
+        /* @__PURE__ */ a("div", { className: "mt-4 w-full flex flex-row justify-end pt-1", children: /* @__PURE__ */ a(
+          J,
+          {
+            className: "bg-opacity-100",
+            tooltip: {
+              placement: "bottom",
+              title: "Click to exit edit mode"
+            },
+            onClick: g,
+            children: "Done"
+          }
+        ) })
+      ] })
+    }
+  );
+}
+export {
+  jn as AddIcon,
+  J as Button,
+  en as CircleQuestionMark,
+  Qt as CrosshairIcon,
+  rr as DashboardGrid,
+  Fe as DashboardMaxZoomScale,
+  Ae as DashboardMinZoomScale,
+  xn as DashboardWidgetBase,
+  _t as DashboardZoomStep,
+  An as DeleteIcon,
+  vn as DraggablePanel,
+  Sn as DynamicWidgetLoader,
+  Fn as EditIcon,
+  Ln as GridIcon,
+  Jt as HandGrabIcon,
+  Zt as HandIcon,
+  Xn as ListItem,
+  Gn as ListItemLeftChild,
+  Zn as ListItemMiddleChild,
+  Jn as ListItemRightChild,
+  Un as MonitorIcon,
+  Vn as MonitorSmartphoneIcon,
+  ut as MoveLeftIcon,
+  ft as MoveRightIcon,
+  Gt as RedoIcon,
+  Kt as SettingsIcon,
+  nn as Stack,
+  K as SvgBaseWrapper,
+  Yn as TabletSmartphoneIcon,
+  Bn as TargetIcon,
+  mt as TextField,
+  Ht as TimerResetIcon,
+  Xt as UndoIcon,
+  or as WidgetContainerColumn,
+  ir as WidgetContainerLarge,
+  ar as WidgetContainerRow,
+  sr as WidgetsCatalogFlyout,
+  er as WrapperColumnContent,
+  tr as WrapperColumnContentListItem,
+  ht as XCircleIcon,
+  qn as ZoomInIcon,
+  zn as ZoomOutIcon,
+  Ce as blankDashboardConfig,
+  ct as createDynamicEntry,
+  $n as createStaticEntry,
+  Dt as cssSettingsCatalog,
+  Hn as cssVarsUtils,
+  Et as dashboardSettingsUtils,
+  Mt as ensureContainersSequence,
+  lt as ensureZoomScaleIsWithinRange,
+  ge as getDefaultWidgetMetaFromKey,
+  Pn as getDefaultWidgetMetaFromMap,
+  Z as getDistinctCssClasses,
+  Wt as getMetaInfoFromFile,
+  _n as getNewZoomScaleWithinRange,
+  Pt as getWidgetMetaFromCatalog,
+  Wn as localWidgetDiscovery,
+  gt as parseContainerTitle,
+  $t as parseKeyAndTitleFromFilePath,
+  In as remoteWidgetDiscovery,
+  Mn as removeEmptyContainers,
+  re as resolveColorFromClass,
+  Kn as resolvedColors,
+  nr as showToast,
+  Rn as useDashboardStorageService,
+  On as useDashboardStore,
+  kn as useDashboardUndoService
+};