@devtable/dashboard 10.3.0 → 10.3.1

package/dist/dashboard.es.js

@@ -3024,7 +3024,7 @@ class Xo {
     }), this.instanceRegistry.clear(), this.factoryRegistry.clear();
   }
 }
-const fc = "10.3.0", bf = /* @__PURE__ */ Object.freeze(/* @__PURE__ */ Object.defineProperty({
+const fc = "10.3.1", bf = /* @__PURE__ */ Object.freeze(/* @__PURE__ */ Object.defineProperty({
   __proto__: null,
   version: fc
 }, Symbol.toStringTag, { value: "Module" }));
@@ -22271,7 +22271,7 @@ const Dk = b.model("PanelsModel", {
   }
 }));
 var Ik = /* @__PURE__ */ ((t) => (t.Use = "use", t.Edit = "edit", t))(Ik || {}), le = /* @__PURE__ */ ((t) => (t.Division = "div", t.Modal = "modal", t.Tabs = "tabs", t))(le || {});
-const jz = {
+const Yz = {
   div: "Division",
   tabs: "Tabs",
   modal: "Modal"
@@ -22279,11 +22279,11 @@ const jz = {
   div: "rgba(255, 0, 0, 0.2)",
   modal: "rgba(0, 0, 0, 0.2)",
   tabs: "rgba(255, 200, 100, 0.4)"
-}, Yz = {
+}, Gz = {
   div: "#ff4000",
   modal: "#000",
   tabs: "#ffad18"
-}, Gz = {
+}, Hz = {
   definition: {
     sqlSnippets: [],
     queries: [],
@@ -22847,7 +22847,7 @@ const Fk = b.model({
     }, t);
   }
 });
-function Hz(t, e) {
+function Qz(t, e) {
   e.filters && st(t.filters.current, e.filters);
 }
 function Pk({
@@ -24008,17 +24008,21 @@ const pT = D(function() {
   return n ? /* @__PURE__ */ i(w, { grow: !0, position: "center", px: 20, className: "panel-title-wrapper", sx: {
     flexGrow: 1
   }, children: /* @__PURE__ */ i(C, { align: "center", lineClamp: 1, weight: "bold", children: n }) }) : null;
-}), fT = {
+});
+function fT(t) {
+  return !["richText", "button"].includes(t);
+}
+const mT = {
   border: "1px solid #e9ecef"
-}, mT = {
+}, gT = {
   border: "1px dashed transparent",
   transition: "border-color 300ms ease",
   "&:hover": {
     borderColor: "#e9ecef"
   }
 };
-function gT(t, e) {
-  return t.style.border.enabled ? fT : e ? mT : {
+function bT(t, e) {
+  return t.style.border.enabled ? mT : e ? gT : {
     border: "1px dashed transparent"
   };
 }
@@ -24028,7 +24032,7 @@ const Ea = D(function({
 }) {
   const {
     inEditMode: r
-  } = Et(In), o = e.title ? "calc(100% - 25px - 5px)" : "100%", a = gT(e, r);
+  } = Et(In), o = e.title ? "calc(100% - 25px - 5px)" : "100%", a = bT(e, r), l = fT(e.viz.type) || r;
   return /* @__PURE__ */ i(gc, { value: {
     panel: e,
     data: e.data,
@@ -24044,12 +24048,12 @@ const Ea = D(function({
       height: 28,
       zIndex: 310
     }, children: /* @__PURE__ */ i(Dd, {}) }),
-    /* @__PURE__ */ i(aT, { view: n }),
+    l && /* @__PURE__ */ i(aT, { view: n }),
     /* @__PURE__ */ i(pT, {}),
     /* @__PURE__ */ i(Ld, { panel: e, height: o })
   ] }) });
 });
-const bT = z.forwardRef(({
+const yT = z.forwardRef(({
   h: t
 }, e) => /* @__PURE__ */ i(K, { ref: e, className: "react-grid-customDragHandle", sx: {
   userSelect: "none",
@@ -24061,7 +24065,7 @@ const bT = z.forwardRef(({
   "&:hover": {
     color: "#228be6"
   }
-}, variant: "transparent", children: /* @__PURE__ */ i(wh, { size: 16 }) })), yT = z.forwardRef(({
+}, variant: "transparent", children: /* @__PURE__ */ i(wh, { size: 16 }) })), xT = z.forwardRef(({
   handleAxis: t,
   ...e
 }, n) => /* @__PURE__ */ i(K, { ref: n, className: "react-grid-customResizeHandle", sx: {
@@ -24074,7 +24078,7 @@ const bT = z.forwardRef(({
   "&:hover": {
     color: "#228be6"
   }
-}, variant: "transparent", ...e, children: /* @__PURE__ */ i(_h, { size: 16 }) })), xT = Yl(jl), vT = D(({
+}, variant: "transparent", ...e, children: /* @__PURE__ */ i(_h, { size: 16 }) })), vT = Yl(jl), wT = D(({
   view: t,
   className: e = "layout"
 }) => {
@@ -24092,13 +24096,13 @@ const bT = z.forwardRef(({
   }, [n]), s = (l, c, d, p) => {
     d.h < 30 && (d.h = 30, p.h = 30), d.w < 4 && (d.w = 4, p.w = 4);
   };
-  return /* @__PURE__ */ i(xT, { onLayoutChange: a, className: `dashboard-layout ${e}`, rowHeight: 1, cols: 36, margin: [0, 0], isBounded: !0, isDraggable: !0, isResizable: !0, layout: o, draggableHandle: ".react-grid-customDragHandle", resizeHandle: /* @__PURE__ */ i(yT, {}), onResize: s, children: r.map((l, c) => /* @__PURE__ */ h("div", { "data-grid": {
+  return /* @__PURE__ */ i(vT, { onLayoutChange: a, className: `dashboard-layout ${e}`, rowHeight: 1, cols: 36, margin: [0, 0], isBounded: !0, isDraggable: !0, isResizable: !0, layout: o, draggableHandle: ".react-grid-customDragHandle", resizeHandle: /* @__PURE__ */ i(xT, {}), onResize: s, children: r.map((l, c) => /* @__PURE__ */ h("div", { "data-grid": {
     ...l.layout
   }, className: "panel-grid-item", children: [
-    /* @__PURE__ */ i(bT, { h: l.layout.h }),
+    /* @__PURE__ */ i(yT, { h: l.layout.h }),
     /* @__PURE__ */ i(Ea, { view: t, panel: l })
   ] }, l.id)) });
-}), wT = Yl(jl), _T = D(function({
+}), _T = Yl(jl), CT = D(function({
   view: e,
   className: n = "layout"
 }) {
@@ -24106,12 +24110,12 @@ const bT = z.forwardRef(({
     panels: r,
     layouts: o
   } = ne().panels.panelsByIDs(e.panelIDs);
-  return /* @__PURE__ */ i(wT, { className: `dashboard-layout ${n}`, cols: 36, rowHeight: 1, margin: [0, 0], isDraggable: !1, isResizable: !1, layout: o, children: r.map((a) => /* @__PURE__ */ i("div", { "data-grid": {
+  return /* @__PURE__ */ i(_T, { className: `dashboard-layout ${n}`, cols: 36, rowHeight: 1, margin: [0, 0], isDraggable: !1, isResizable: !1, layout: o, children: r.map((a) => /* @__PURE__ */ i("div", { "data-grid": {
     ...a.layout
   }, className: "panel-grid-item", children: /* @__PURE__ */ i(Ea, { view: e, panel: a }) }, a.id)) });
-}), CT = D(({
+}), ST = D(({
   children: t
-}) => /* @__PURE__ */ i(V, { pt: 10, pb: 100, children: t })), ST = D(({
+}) => /* @__PURE__ */ i(V, { pt: 10, pb: 100, children: t })), kT = D(({
   children: t,
   view: e
 }) => {
@@ -24134,7 +24138,7 @@ const bT = z.forwardRef(({
       maxHeight: "calc(100vh - 325px)"
     }
   }, withinPortal: !1, transitionDuration: 0, children: t });
-}), kT = ({
+}), TT = ({
   variant: t,
   orientation: e
 }) => {
@@ -24151,11 +24155,11 @@ const bT = z.forwardRef(({
     marginLeft: "auto",
     marginRight: "auto"
   }), n;
-}, TT = (t) => t.color ? {
+}, DT = (t) => t.color ? {
   "&[data-active], &[data-active]:hover": {
     borderColor: t.color ? t.color : "..."
   }
-} : {}, DT = D(({
+} : {}, IT = D(({
   children: t,
   view: e
 }) => {
@@ -24175,9 +24179,9 @@ const bT = z.forwardRef(({
     zIndex: 320
   }), l = a.tabs.length === 0;
   return /* @__PURE__ */ h(V, { className: "preview-view-tabs", children: [
-    /* @__PURE__ */ h(g, { variant: a.variant, orientation: a.orientation, defaultValue: a.tabs.length > 0 ? a.tabs[0].id : "0", styles: kT(a), children: [
+    /* @__PURE__ */ h(g, { variant: a.variant, orientation: a.orientation, defaultValue: a.tabs.length > 0 ? a.tabs[0].id : "0", styles: TT(a), children: [
       /* @__PURE__ */ h(g.List, { grow: a.grow, children: [
-        a.tabs.map((c) => /* @__PURE__ */ i(g.Tab, { value: c.id, sx: TT(c), children: c.name ?? c.id }, c.id)),
+        a.tabs.map((c) => /* @__PURE__ */ i(g.Tab, { value: c.id, sx: DT(c), children: c.name ?? c.id }, c.id)),
         /* @__PURE__ */ i(g.Tab, { onClick: a.addTab, value: "add", className: "add-a-tab", children: /* @__PURE__ */ i(Ge, { size: 18, color: "#228be6" }) })
       ] }),
       a.tabs.map((c, d) => {
@@ -24218,35 +24222,35 @@ const bT = z.forwardRef(({
     ] }),
     t
   ] });
-}), IT = D(({
+}), MT = D(({
   view: t,
   children: e
 }) => {
   switch (t.type) {
     case le.Modal:
-      return /* @__PURE__ */ i(ST, { view: t, children: e });
+      return /* @__PURE__ */ i(kT, { view: t, children: e });
     case le.Tabs:
-      return /* @__PURE__ */ i(DT, { view: t, children: e });
+      return /* @__PURE__ */ i(IT, { view: t, children: e });
     case le.Division:
     default:
-      return /* @__PURE__ */ i(CT, { children: e });
+      return /* @__PURE__ */ i(ST, { children: e });
   }
-}), MT = D(function({
+}), $T = D(function({
   view: e
 }) {
   return /* @__PURE__ */ i(Aa.Provider, { value: {
     viewPanelInFullScreen: T.noop,
     inFullScreen: !1
-  }, children: /* @__PURE__ */ i(V, { className: "dashboard-view", "data-enable-scrollbar": !0, children: /* @__PURE__ */ i(IT, { view: e, children: /* @__PURE__ */ h(V, { sx: {
+  }, children: /* @__PURE__ */ i(V, { className: "dashboard-view", "data-enable-scrollbar": !0, children: /* @__PURE__ */ i(MT, { view: e, children: /* @__PURE__ */ h(V, { sx: {
     position: "relative"
   }, children: [
     /* @__PURE__ */ i(V, { className: "dashboard-sticky-area", sx: {
       position: "sticky",
       top: "0px"
     }, children: /* @__PURE__ */ i(Td, { view: e }) }),
-    /* @__PURE__ */ i(vT, { view: e })
+    /* @__PURE__ */ i(wT, { view: e })
   ] }) }) }) });
-}), $T = {
+}), zT = {
   modal: {
     display: "flex",
     flexDirection: "column",
@@ -24256,17 +24260,17 @@ const bT = z.forwardRef(({
     display: "flex",
     height: "calc(100vh - 88px)"
   }
-}, zT = D(function({
+}, LT = D(function({
   view: e,
   panel: n,
   exitFullScreen: r
 }) {
-  return /* @__PURE__ */ i($e, { opened: !0, fullScreen: !0, onClose: r, title: /* @__PURE__ */ i(M, { color: "blue", size: "xs", onClick: r, leftIcon: /* @__PURE__ */ i(Ch, { size: 20 }), children: "Exit fullscreen" }), styles: $T, children: /* @__PURE__ */ i(w, { grow: !0, sx: {
+  return /* @__PURE__ */ i($e, { opened: !0, fullScreen: !0, onClose: r, title: /* @__PURE__ */ i(M, { color: "blue", size: "xs", onClick: r, leftIcon: /* @__PURE__ */ i(Ch, { size: 20 }), children: "Exit fullscreen" }), styles: zT, children: /* @__PURE__ */ i(w, { grow: !0, sx: {
     flexGrow: 1,
     flexShrink: 0
   }, children: /* @__PURE__ */ i(Ea, { view: e, panel: n }) }) });
 });
-function LT(t, e, n) {
+function AT(t, e, n) {
   const {
     panels: r
   } = ne(), o = t.id === "Main", [a, s] = z.useState(() => o && r.findByID(e) ? e : null), l = z.useCallback((u) => {
@@ -24281,9 +24285,9 @@ function LT(t, e, n) {
     fullScreenPanel: d
   };
 }
-const AT = D(({
+const ET = D(({
   children: t
-}) => /* @__PURE__ */ i(V, { children: t })), ET = D(({
+}) => /* @__PURE__ */ i(V, { children: t })), RT = D(({
   children: t,
   view: e
 }) => {
@@ -24299,11 +24303,11 @@ const AT = D(({
       overflow: "auto"
     }
   }, transitionDuration: 0, children: t });
-}), RT = (t) => t.color ? {
+}), OT = (t) => t.color ? {
   "&[data-active], &[data-active]:hover": {
     borderColor: t.color ? t.color : "..."
   }
-} : {}, OT = D(({
+} : {}, FT = D(({
   children: t,
   view: e
 }) => {
@@ -24314,7 +24318,7 @@ const AT = D(({
         padding: r.orientation === "horizontal" ? "16px 0px" : "0"
       }
     }, keepMounted: !1, children: [
-      /* @__PURE__ */ i(g.List, { grow: r.grow, children: r.tabs.map((o) => /* @__PURE__ */ i(g.Tab, { value: o.id, sx: RT(o), disabled: !o.view_id, children: o.name ?? o.id }, o.id)) }),
+      /* @__PURE__ */ i(g.List, { grow: r.grow, children: r.tabs.map((o) => /* @__PURE__ */ i(g.Tab, { value: o.id, sx: OT(o), disabled: !o.view_id, children: o.name ?? o.id }, o.id)) }),
       r.tabs.map((o) => {
         const a = n.views.findByID(o.view_id);
         return a ? /* @__PURE__ */ i(g.Panel, { value: o.id, children: /* @__PURE__ */ i(Ra, { view: a }) }, o.id) : null;
@@ -24322,18 +24326,18 @@ const AT = D(({
     ] }),
     t
   ] });
-}), FT = D(({
+}), PT = D(({
   view: t,
   children: e
 }) => {
   switch (t.type) {
     case le.Modal:
-      return /* @__PURE__ */ i(ET, { view: t, children: e });
+      return /* @__PURE__ */ i(RT, { view: t, children: e });
     case le.Tabs:
-      return /* @__PURE__ */ i(OT, { view: t, children: e });
+      return /* @__PURE__ */ i(FT, { view: t, children: e });
     case le.Division:
     default:
-      return /* @__PURE__ */ i(AT, { children: e });
+      return /* @__PURE__ */ i(ET, { children: e });
   }
 }), Ra = D(function({
   view: e
@@ -24346,27 +24350,27 @@ const AT = D(({
     exitFullScreen: a,
     inFullScreen: s,
     fullScreenPanel: l
-  } = LT(e, n, r);
+  } = AT(e, n, r);
   return /* @__PURE__ */ i(Aa.Provider, { value: {
     viewPanelInFullScreen: o,
     inFullScreen: s
   }, children: /* @__PURE__ */ h(V, { className: "dashboard-view", "data-enable-scrollbar": !0, children: [
-    s && /* @__PURE__ */ i(zT, { view: e, panel: l, exitFullScreen: a }),
-    /* @__PURE__ */ i(FT, { view: e, children: /* @__PURE__ */ h(V, { sx: {
+    s && /* @__PURE__ */ i(LT, { view: e, panel: l, exitFullScreen: a }),
+    /* @__PURE__ */ i(PT, { view: e, children: /* @__PURE__ */ h(V, { sx: {
       position: "relative"
     }, children: [
       !s && /* @__PURE__ */ i(V, { className: "dashboard-sticky-area", sx: {
         position: "sticky",
         top: "0px"
       }, children: /* @__PURE__ */ i(Td, { view: e }) }),
-      !s && /* @__PURE__ */ i(_T, { view: e })
+      !s && /* @__PURE__ */ i(CT, { view: e })
     ] }) })
   ] }) });
 });
 function Ad(t) {
   return z.useCallback((e) => e.provideValue(qe.pluginManager, t.pluginManager).provideValue(qe.vizManager, t.vizManager).provideValue(qe.colorManager, t.colorManager), []);
 }
-const PT = D(({
+const VT = D(({
   headerMenuItems: t = null
 }) => {
   const e = Le(), n = ne(), r = () => {
@@ -24381,7 +24385,7 @@ const PT = D(({
       t
     ] })
   ] });
-}), VT = D(({
+}), NT = D(({
   saveDashboardChanges: t
 }) => {
   const e = jt(), n = ne(), r = () => {
@@ -24421,7 +24425,7 @@ const PT = D(({
       /* @__PURE__ */ i(He.Dropdown, { children: /* @__PURE__ */ i(He.Item, { icon: /* @__PURE__ */ i(bl, { size: 14, color: "red" }), disabled: !o, onClick: r, children: "Revert Changes" }) })
     ] })
   ] });
-}), NT = D(({
+}), BT = D(({
   saveDashboardChanges: t,
   headerSlot: e = null,
   headerMenuItems: n
@@ -24459,16 +24463,16 @@ const PT = D(({
         "End Editing",
         /* @__PURE__ */ i(C, { td: "underline", children: o.name })
       ] }) }),
-      /* @__PURE__ */ i(VT, { saveDashboardChanges: t })
+      /* @__PURE__ */ i(NT, { saveDashboardChanges: t })
     ] }),
     /* @__PURE__ */ h(w, { position: "right", sx: {
       flexGrow: 1
     }, children: [
       e,
-      /* @__PURE__ */ i(PT, { headerMenuItems: n })
+      /* @__PURE__ */ i(VT, { headerMenuItems: n })
     ] })
   ] }) });
-}), BT = {
+}), qT = {
   position: "fixed",
   top: 60,
   // height of mantine-header
@@ -24478,9 +24482,9 @@ const PT = D(({
   zIndex: 299,
   borderBottom: "1px solid #e9ecef",
   background: "rgba(233,236,239, 0.15)"
-}, qT = D(() => {
+}, WT = D(() => {
   const t = ne();
-  return /* @__PURE__ */ i(V, { sx: BT, pl: {
+  return /* @__PURE__ */ i(V, { sx: qT, pl: {
     base: 200,
     xs: 200,
     sm: 200,
@@ -24501,11 +24505,11 @@ const PT = D(({
     /* @__PURE__ */ i(V, {}),
     /* @__PURE__ */ i(V, {})
   ] }) });
-}), WT = D((t) => /* @__PURE__ */ h(H, { children: [
-  /* @__PURE__ */ i(NT, { ...t }),
-  /* @__PURE__ */ i(qT, {})
+}), jT = D((t) => /* @__PURE__ */ h(H, { children: [
+  /* @__PURE__ */ i(BT, { ...t }),
+  /* @__PURE__ */ i(WT, {})
 ] }));
-function jT(t, e, n) {
+function YT(t, e, n) {
   const r = [];
   return t.filter((o) => "__INTERACTIONS" in o.viz.conf).forEach((o, a) => {
     const s = e[o.id];
@@ -24567,21 +24571,21 @@ function jT(t, e, n) {
     });
   }), r;
 }
-function YT(t, e) {
+function GT(t, e) {
   const n = t.filters.keyLabelMap;
   return {
-    edges: jT(t.panels.list, e, n),
+    edges: YT(t.panels.list, e, n),
     edgeNodes: []
   };
 }
 function Ed(t, e, n) {
   return t * e + t * n;
 }
-function GT(t, e, n) {
+function HT(t, e, n) {
   return t * e + (t - 1) * n;
 }
-const Qr = 25, Oa = 40, Rd = 25, Fa = 350, HT = 150, QT = 150, Od = 150, Ws = 300, Vr = 40, Fd = 25, KT = 300;
-function UT(t, e) {
+const Qr = 25, Oa = 40, Rd = 25, Fa = 350, QT = 150, KT = 150, Od = 150, Ws = 300, Vr = 40, Fd = 25, UT = 300;
+function XT(t, e) {
   const n = T.keyBy(e, (o) => o.id), r = [];
   return t.current.forEach((o, a) => {
     o.panelIDs.forEach((s, l) => {
@@ -24629,14 +24633,14 @@ function UT(t, e) {
     });
   }), r;
 }
-const XT = {
+const JT = {
   [le.Division]: "Div",
   [le.Modal]: "Modal",
   [le.Tabs]: "Tabs"
-}, JT = Mk;
-function ZT(t) {
+}, ZT = Mk;
+function eD(t) {
   return t.current.map((n, r) => {
-    const o = GT(n.panelIDs.length, Vr, Fd) + Oa + Rd;
+    const o = HT(n.panelIDs.length, Vr, Fd) + Oa + Rd;
     let a = [];
     return n.type === le.Tabs && (a = n.config.tabs.map((l) => l.view_id)), {
       id: n.id,
@@ -24646,7 +24650,7 @@ function ZT(t) {
       _sub_view_ids: [],
       _tab_view_ids: a,
       data: {
-        label: `${XT[n.type]}:${n.name}`
+        label: `${JT[n.type]}:${n.name}`
       },
       position: {
         x: 0,
@@ -24656,14 +24660,14 @@ function ZT(t) {
       targetPosition: Ct.Left,
       className: "light",
       style: {
-        backgroundColor: JT[n.type],
+        backgroundColor: ZT[n.type],
         width: Fa,
         height: o
       }
     };
   });
 }
-function eD(t) {
+function tD(t) {
   const e = T.keyBy(t, (n) => n.id);
   t.forEach((n) => {
     n._node_type !== "view-root" || n._view_type !== le.Tabs || n._tab_view_ids.forEach((r) => {
@@ -24671,13 +24675,13 @@ function eD(t) {
     });
   });
 }
-function tD(t) {
-  const e = ZT(t.views);
-  eD(e);
-  const n = UT(t.views, t.panels.list);
+function nD(t) {
+  const e = eD(t.views);
+  tD(e);
+  const n = XT(t.views, t.panels.list);
   return [...e, ...n];
 }
-function nD({
+function rD({
   nodeMap: t,
   nodes: e,
   edges: n
@@ -24691,7 +24695,7 @@ function nD({
     }, Oa));
   });
 }
-function rD({
+function iD({
   nodeMap: t,
   nodes: e,
   edges: n
@@ -24704,7 +24708,7 @@ function rD({
     s._node_type !== "view-root" || a._node_type !== "view-root" || (a._view_level += 1 + s._view_level, s._sub_view_ids.push(a.id));
   }), e.sort((r, o) => r._node_type === "view-root" && o._node_type === "view-root" ? r._view_level - o._view_level : r._node_type !== "view-root" && o._node_type !== "view-root" ? 0 : r._node_type === "view-root" ? -1 : 1);
 }
-function iD({
+function oD({
   nodeMap: t,
   nodes: e,
   edges: n
@@ -24716,13 +24720,13 @@ function iD({
     const a = t[o.source], s = t[o.target];
     if (a && s && a.parentNode) {
       const l = t[a.parentNode], c = l.position.x, d = Number(T.get(s, "style.height", 0)), p = Number(l.style.width);
-      s.position.x = c + p + KT, l._view_level === 0 && s._sub_view_ids.length === 0 && (a.sourcePosition = Ct.Left, s.targetPosition = Ct.Right, s.position.x *= -1);
+      s.position.x = c + p + UT, l._view_level === 0 && s._sub_view_ids.length === 0 && (a.sourcePosition = Ct.Left, s.targetPosition = Ct.Right, s.position.x *= -1);
       const f = s.position.x, m = T.get(r, f, 0);
       s.position.y = m, r[f] = m + d + Od;
     }
   });
 }
-function oD({
+function aD({
   nodeMap: t,
   nodes: e,
   edges: n
@@ -24731,10 +24735,10 @@ function oD({
   n.forEach((s) => {
     r.add(s.source), o.add(s.target);
   }), e.filter((s) => s._node_type !== "view-root" || s.id === "Main" || s.parentNode ? !1 : !r.has(s.id) && !o.has(s.id)).forEach((s, l) => {
-    s.position.x = Ed(l, Fa, QT), s.position.y = 0 - HT - Od;
+    s.position.x = Ed(l, Fa, KT), s.position.y = 0 - QT - Od;
   });
 }
-function aD({
+function sD({
   nodeMap: t,
   nodes: e,
   edges: n
@@ -24744,28 +24748,28 @@ function aD({
     nodes: e,
     edges: n
   };
-  return oD(r), rD(r), nD(r), iD(r), {
+  return aD(r), iD(r), rD(r), oD(r), {
     nodes: e,
     edges: n
   };
 }
-function sD(t) {
-  const e = tD(t), n = T.keyBy(e, (c) => c.id), {
+function lD(t) {
+  const e = nD(t), n = T.keyBy(e, (c) => c.id), {
     edges: r,
     edgeNodes: o
-  } = YT(t, n), a = [...e, ...o], s = T.keyBy(a, (c) => c.id), l = {
+  } = GT(t, n), a = [...e, ...o], s = T.keyBy(a, (c) => c.id), l = {
     edges: T.uniqBy(r, (c) => c.id),
     nodes: a,
     nodeMap: s
   };
-  return aD(l);
+  return sD(l);
 }
 const Ni = {
   "builtin:op:open-link": /* @__PURE__ */ i(Ii, { color: "blue", size: 20, radius: "xl", children: /* @__PURE__ */ i(th, { size: 14 }) }),
   "builtin:op:set_filter_values": /* @__PURE__ */ i(Ii, { color: "orange", size: 20, radius: "xl", children: /* @__PURE__ */ i(nh, { size: 14 }) }),
   "builtin:op:clear_filter_values": /* @__PURE__ */ i(Ii, { color: "orange", size: 20, radius: "xl", children: /* @__PURE__ */ i(rh, { size: 14 }) })
 };
-function lD(t) {
+function cD(t) {
   const e = [];
   return t.forEach((n) => {
     switch (n.schemaRef) {
@@ -24812,14 +24816,14 @@ function lD(t) {
     }
   }), e;
 }
-const cD = pu(({
+const dD = pu(({
   data: t,
   isConnectable: e,
   sourcePosition: n = Ct.Right,
   targetPosition: r = Ct.Left,
   ...o
 }) => {
-  const a = $(() => lD(t.interactions), [t.interactions]);
+  const a = $(() => cD(t.interactions), [t.interactions]);
   return /* @__PURE__ */ h(H, { children: [
     /* @__PURE__ */ i(ds, { type: "target", position: r, isConnectable: e }),
     /* @__PURE__ */ i(V, { sx: {
@@ -24834,19 +24838,19 @@ const cD = pu(({
     /* @__PURE__ */ i(ds, { type: "source", position: n, isConnectable: e })
   ] });
 });
-const dD = {
-  interaction: cD
-}, uD = D(() => {
+const uD = {
+  interaction: dD
+}, hD = D(() => {
   const t = ne(), {
     edges: e,
     nodes: n
-  } = sD(t);
-  return /* @__PURE__ */ h(rp, { nodes: n, edges: e, onNodesChange: T.noop, onEdgesChange: T.noop, onConnect: T.noop, className: "interactions-viewer", fitView: !0, nodeTypes: dD, children: [
+  } = lD(t);
+  return /* @__PURE__ */ h(rp, { nodes: n, edges: e, onNodesChange: T.noop, onEdgesChange: T.noop, onConnect: T.noop, className: "interactions-viewer", fitView: !0, nodeTypes: uD, children: [
     /* @__PURE__ */ i(ip, {}),
     /* @__PURE__ */ i(op, {}),
     /* @__PURE__ */ i(ap, {})
   ] });
-}), hD = D(({
+}), pD = D(({
   opened: t,
   close: e
 }) => {
@@ -24876,10 +24880,10 @@ const dD = {
         }
       },
       zIndex: 300,
-      children: /* @__PURE__ */ i(uD, {})
+      children: /* @__PURE__ */ i(hD, {})
     }
   );
-}), pD = {
+}), fD = {
   "> button": {
     "&:first-of-type": {
       borderTopRightRadius: 0,
@@ -24901,7 +24905,7 @@ const dD = {
     }
   }
 };
-function fD({
+function mD({
   onClick: t,
   name: e,
   active: n,
@@ -24935,14 +24939,14 @@ function fD({
     }, children: /* @__PURE__ */ i(ih, { size: 16 }) }) })
   ] });
 }
-const mD = D(() => {
+const gD = D(() => {
   const t = Le(), e = ne(), n = it((o) => () => e.views.setIDOfVIE(o), [e]), r = (o) => {
     t.editor.open(["_VIEWS_", o]);
   };
   return /* @__PURE__ */ h(V, { sx: {
     position: "relative"
   }, children: [
-    e.views.options.map((o) => /* @__PURE__ */ i(fD, { active: e.views.idOfVIE === o.value, name: o.label, onClick: n(o.value), openSettings: () => r(o.value) }, o.value)),
+    e.views.options.map((o) => /* @__PURE__ */ i(mD, { active: e.views.idOfVIE === o.value, name: o.label, onClick: n(o.value), openSettings: () => r(o.value) }, o.value)),
     /* @__PURE__ */ i(E, { variant: "dashed" }),
     /* @__PURE__ */ i(M, { variant: "subtle", rightIcon: /* @__PURE__ */ i(on, { size: 14 }), size: "sm", px: "xs", color: "blue", onClick: e.views.addARandomNewView, sx: {
       width: "100%",
@@ -24953,7 +24957,7 @@ const mD = D(() => {
       }
     }, children: "Add a View" })
   ] });
-}), gD = D(() => {
+}), bD = D(() => {
   const t = Le(), e = ne(), n = () => {
     if (!e.queries.firstID) {
       t.editor.open(["_QUERIES_", ""]);
@@ -24977,7 +24981,7 @@ const mD = D(() => {
   }, zIndex: 299, children: [
     /* @__PURE__ */ h(Nt.Section, { children: [
       /* @__PURE__ */ h(w, { grow: !0, spacing: 0, sx: {
-        ...pD,
+        ...fD,
         button: {
           borderWidth: 0,
           borderBottomWidth: 1,
@@ -24994,7 +24998,7 @@ const mD = D(() => {
           height: "30px"
         }, onClick: s, children: /* @__PURE__ */ i(oh, { size: 20 }) }) })
       ] }),
-      /* @__PURE__ */ i(hD, { opened: o, close: l })
+      /* @__PURE__ */ i(pD, { opened: o, close: l })
     ] }),
     /* @__PURE__ */ i(Nt.Section, { py: 5, sx: {
       borderBottom: "1px solid #eee"
@@ -25004,12 +25008,12 @@ const mD = D(() => {
     }, children: "Views" }) }),
     /* @__PURE__ */ i(Nt.Section, { grow: !0, sx: {
       overflow: "auto"
-    }, children: /* @__PURE__ */ i(mD, {}) }),
+    }, children: /* @__PURE__ */ i(gD, {}) }),
     /* @__PURE__ */ i(Nt.Section, { children: /* @__PURE__ */ i(w, { grow: !0, p: "md", pt: "sm", sx: {
       borderTop: "1px solid #eee"
     }, children: /* @__PURE__ */ i(M, { size: "xs", leftIcon: /* @__PURE__ */ i(ah, { size: 20 }), onClick: () => t.editor.open([]), children: "Settings" }) }) })
   ] });
-}), bD = D(function({
+}), yD = D(function({
   config: e
 }) {
   return /* @__PURE__ */ h(H, { children: [
@@ -25021,7 +25025,7 @@ const mD = D(() => {
       }
     } })
   ] });
-}), yD = [{
+}), xD = [{
   label: "2022",
   value: "YYYY"
 }, {
@@ -25036,7 +25040,7 @@ const mD = D(() => {
 }, {
   label: "2022-01-01",
   value: "YYYY-MM-DD"
-}], xD = D(function({
+}], vD = D(function({
   config: e
 }) {
   return /* @__PURE__ */ h(H, { children: [
@@ -25045,7 +25049,7 @@ const mD = D(() => {
       /* @__PURE__ */ i(ve, { checked: e.clearable, onChange: (n) => e.setClearable(n.currentTarget.checked), disabled: e.max_days > 0, label: "Clearable" }),
       /* @__PURE__ */ i(ve, { checked: e.allowSingleDateInRange, onChange: (n) => e.setAllowSingleDateInRange(n.currentTarget.checked), label: "Allow choosing 1 day" })
     ] }),
-    /* @__PURE__ */ i(P, { data: yD, label: "Display Format", value: e.inputFormat, onChange: e.setInputFormat }),
+    /* @__PURE__ */ i(P, { data: xD, label: "Display Format", value: e.inputFormat, onChange: e.setInputFormat }),
     /* @__PURE__ */ i(
       Cd,
       {
@@ -25072,7 +25076,7 @@ const mD = D(() => {
   return /* @__PURE__ */ i(P, { label: "Pick a query", data: r, value: t, onChange: e, allowDeselect: !1, clearable: !0, sx: {
     flexGrow: 1
   }, disabled: o, error: o ? "You need to add a query in Data Settings" : void 0 });
-}), vD = `
+}), wD = `
 // row
 {
   label: string;
@@ -25083,9 +25087,9 @@ const mD = D(() => {
   const [t, e] = U(!1);
   return /* @__PURE__ */ h(H, { children: [
     /* @__PURE__ */ i(M, { variant: "subtle", compact: !0, onClick: () => e((n) => !n), children: t ? "Close" : "Click to see expected data structure" }),
-    /* @__PURE__ */ i(Vo, { in: t, children: /* @__PURE__ */ i(wn, { language: "typescript", noCopy: !0, colorScheme: "dark", children: vD }) })
+    /* @__PURE__ */ i(Vo, { in: t, children: /* @__PURE__ */ i(wn, { language: "typescript", noCopy: !0, colorScheme: "dark", children: wD }) })
   ] });
-}, wD = D(function({
+}, _D = D(function({
   config: e
 }) {
   const n = () => {
@@ -25146,7 +25150,7 @@ const mD = D(() => {
     /* @__PURE__ */ i(Pa, { value: e.options_query_id, onChange: e.setOptionsQueryID }),
     /* @__PURE__ */ i(Pd, {})
   ] });
-}), _D = D(function({
+}), CD = D(function({
   config: e
 }) {
   const n = () => {
@@ -25211,7 +25215,7 @@ const mD = D(() => {
     /* @__PURE__ */ i(Pa, { value: e.options_query_id, onChange: e.setOptionsQueryID }),
     /* @__PURE__ */ i(Pd, {})
   ] });
-}), CD = D(function({
+}), SD = D(function({
   config: e
 }) {
   return /* @__PURE__ */ h(H, { children: [
@@ -25220,7 +25224,7 @@ const mD = D(() => {
     } }),
     /* @__PURE__ */ i(ve, { checked: e.required, onChange: (n) => e.setRequired(n.currentTarget.checked), label: "Required" })
   ] });
-}), SD = `
+}), kD = `
 // row
 {
   label: string;
@@ -25228,13 +25232,13 @@ const mD = D(() => {
   parent_value: string;
   description?: string;
 }
-`, kD = () => {
+`, TD = () => {
   const [t, e] = U(!1);
   return /* @__PURE__ */ h(H, { children: [
     /* @__PURE__ */ i(M, { variant: "subtle", compact: !0, onClick: () => e((n) => !n), children: t ? "Close" : "Click to see expected data structure" }),
-    /* @__PURE__ */ i(Vo, { in: t, children: /* @__PURE__ */ i(wn, { language: "typescript", noCopy: !0, colorScheme: "dark", children: SD }) })
+    /* @__PURE__ */ i(Vo, { in: t, children: /* @__PURE__ */ i(wn, { language: "typescript", noCopy: !0, colorScheme: "dark", children: kD }) })
   ] });
-}, TD = D(function({
+}, DD = D(function({
   config: e
 }) {
   return /* @__PURE__ */ h(H, { children: [
@@ -25242,9 +25246,9 @@ const mD = D(() => {
     /* @__PURE__ */ i(E, { label: "Fetch options from database", labelPosition: "center" }),
     /* @__PURE__ */ i(ae, { value: e.default_selection_count, onChange: e.setDefaultSelectionCount, label: "Select first N options by default" }),
     /* @__PURE__ */ i(Pa, { value: e.options_query_id, onChange: e.setOptionsQueryID }),
-    /* @__PURE__ */ i(kD, {})
+    /* @__PURE__ */ i(TD, {})
   ] });
-}), DD = D(function({
+}), ID = D(function({
   filter: e
 }) {
   const [n, r] = z.useState(e.plainDefaultValue);
@@ -25258,14 +25262,14 @@ const mD = D(() => {
     /* @__PURE__ */ i(C, { pt: "lg", pb: "md", color: "gray", children: "Config" }),
     /* @__PURE__ */ i(wn, { language: "json", colorScheme: "dark", noCopy: !0, children: JSON.stringify(e, null, 4) })
   ] });
-}), ID = {
-  select: _D,
-  "multi-select": wD,
-  "tree-select": TD,
-  "text-input": CD,
-  checkbox: bD,
-  "date-range": xD
-}, MD = [{
+}), MD = {
+  select: CD,
+  "multi-select": _D,
+  "tree-select": DD,
+  "text-input": SD,
+  checkbox: yD,
+  "date-range": vD
+}, $D = [{
   label: "Select",
   value: "select"
 }, {
@@ -25283,10 +25287,10 @@ const mD = D(() => {
 }, {
   label: "Date Range",
   value: "date-range"
-}], $D = D(function({
+}], zD = D(function({
   filter: e
 }) {
-  const n = ne(), r = z.useMemo(() => ID[e.type], [e.type]);
+  const n = ne(), r = z.useMemo(() => MD[e.type], [e.type]);
   return /* @__PURE__ */ h(w, { grow: !0, spacing: 20, align: "top", children: [
     /* @__PURE__ */ h(V, { sx: {
       maxWidth: "600px"
@@ -25316,13 +25320,13 @@ const mD = D(() => {
         /* @__PURE__ */ i(A, { label: "Label", placeholder: "Label for this field", required: !0, value: e.label, onChange: (o) => {
           e.setLabel(o.currentTarget.value);
         } }),
-        /* @__PURE__ */ i(P, { label: "Widget", data: MD, required: !0, value: e.type, onChange: e.setType }),
+        /* @__PURE__ */ i(P, { label: "Widget", data: $D, required: !0, value: e.type, onChange: e.setType }),
         /* @__PURE__ */ i(r, { config: e.config })
       ] })
     ] }),
-    /* @__PURE__ */ i(DD, { filter: e })
+    /* @__PURE__ */ i(ID, { filter: e })
   ] });
-}), zD = D(({
+}), LD = D(({
   id: t
 }) => {
   const e = jt(), n = Le(), r = ne();
@@ -25363,9 +25367,9 @@ const mD = D(() => {
       flexGrow: 1,
       maxHeight: "calc(100% - 52px)",
       overflow: "auto"
-    }, children: /* @__PURE__ */ i($D, { filter: o }) })
+    }, children: /* @__PURE__ */ i(zD, { filter: o }) })
   ] });
-}), LD = D(() => {
+}), AD = D(() => {
   const t = ne(), [e, n] = U(() => JSON.stringify(t.mock_context.current, null, 4)), r = () => {
     try {
       t.mock_context.replace(JSON.parse(e));
@@ -25416,7 +25420,7 @@ const mD = D(() => {
       }, disabled: !o, onClick: r, children: /* @__PURE__ */ i(we, { size: 20 }) })
     ] })
   ] });
-}), AD = D(() => {
+}), ED = D(() => {
   const {
     panel: t
   } = Je();
@@ -25425,14 +25429,14 @@ const mD = D(() => {
       flexGrow: 1
     }
   } });
-}), ED = D(() => {
+}), RD = D(() => {
   const {
     panel: t
   } = Je(), {
     style: e
   } = t;
   return /* @__PURE__ */ i(H, { children: /* @__PURE__ */ i(tt, { label: "Border", checked: e.border.enabled, onChange: (n) => e.border.setEnabled(n.currentTarget.checked) }) });
-}), RD = D(() => {
+}), OD = D(() => {
   const {
     panel: t
   } = Je(), {
@@ -25453,18 +25457,18 @@ const mD = D(() => {
     }
   } });
 });
-function OD() {
+function FD() {
   return /* @__PURE__ */ h(S, { sx: {
     height: "100%"
   }, children: [
     /* @__PURE__ */ i(E, { label: "Style", labelPosition: "center", variant: "dashed" }),
-    /* @__PURE__ */ i(ED, {}),
-    /* @__PURE__ */ i(E, { label: "Info", labelPosition: "center", variant: "dashed" }),
     /* @__PURE__ */ i(RD, {}),
-    /* @__PURE__ */ i(AD, {})
+    /* @__PURE__ */ i(E, { label: "Info", labelPosition: "center", variant: "dashed" }),
+    /* @__PURE__ */ i(OD, {}),
+    /* @__PURE__ */ i(ED, {})
   ] });
 }
-const FD = ({
+const PD = ({
   queryID: t
 }) => {
   const e = ne(), {
@@ -25474,7 +25478,7 @@ const FD = ({
   return n === "loading" ? null : r ? /* @__PURE__ */ i(C, { color: "red", size: "md", align: "center", sx: {
     fontFamily: "monospace"
   }, children: r }) : o != null && o.stateMessage ? /* @__PURE__ */ i(C, { color: "gray", align: "center", children: o.stateMessage }) : null;
-}, PD = {
+}, VD = {
   width: "fit-content",
   minWidth: "100%",
   tableLayout: "fixed",
@@ -25525,7 +25529,7 @@ function Vd({
   });
   return t.length === 0 ? /* @__PURE__ */ i(V, { sx: {
     height: "5em"
-  } }) : /* @__PURE__ */ i(ct, { children: /* @__PURE__ */ h(Rt, { sx: PD, children: [
+  } }) : /* @__PURE__ */ i(ct, { children: /* @__PURE__ */ h(Rt, { sx: VD, children: [
     /* @__PURE__ */ i("thead", { children: n.getHeaderGroups().map((r) => /* @__PURE__ */ i("tr", { children: r.headers.map((o) => /* @__PURE__ */ h("th", { style: {
       width: o.getSize()
     }, children: [
@@ -25572,11 +25576,11 @@ const to = D(function({
       overflow: "auto"
     }, children: [
       /* @__PURE__ */ i(_n, { visible: s }),
-      /* @__PURE__ */ i(FD, { queryID: e }),
+      /* @__PURE__ */ i(PD, { queryID: e }),
       /* @__PURE__ */ i(Vd, { data: d })
     ] })
   ] });
-}), VD = D(function() {
+}), ND = D(function() {
   const e = Le(), n = ne(), {
     panel: r
   } = Je(), [o, a] = U(!1), s = (l) => {
@@ -25593,7 +25597,7 @@ const to = D(function({
       ] })
     ] })
   ] });
-}), ND = D(() => {
+}), BD = D(() => {
   const {
     panel: t
   } = Je();
@@ -25644,7 +25648,7 @@ const to = D(function({
     average: !1
   }
 };
-class BD {
+class qD {
   constructor(e) {
     Y(this, "panel");
     Y(this, "selected");
@@ -25675,11 +25679,11 @@ class BD {
     }
   }
 }
-function qD() {
+function WD() {
   const {
     panel: t
   } = Je();
-  return kt(() => new BD(t), [t]);
+  return kt(() => new qD(t), [t]);
 }
 const Nd = Nn((t) => ({
   root: {
@@ -25711,7 +25715,7 @@ const Nd = Nn((t) => ({
     overflow: "auto",
     paddingRight: 10
   }
-})), WD = z.forwardRef(function({
+})), jD = z.forwardRef(function({
   value: e,
   onChange: n,
   data: r,
@@ -25731,18 +25735,18 @@ const Nd = Nn((t) => ({
     /* @__PURE__ */ i(Dt, { value: e.formatter, onChange: (l) => s("formatter", l) }),
     o && /* @__PURE__ */ i(wc, { value: e, onChange: n })
   ] });
-}), jD = (t) => {
+}), YD = (t) => {
   const {
     uiModel: e
   } = t;
   return /* @__PURE__ */ i(S, { className: "var-list", children: e.variables.map((n) => /* @__PURE__ */ i(M, { variant: e.selected === n ? "filled" : "subtle", color: "gray", onClick: () => e.select(n), children: n.name }, n.name)) });
-}, YD = D(jD), GD = ({
+}, GD = D(YD), HD = ({
   variable: t,
   data: e
 }) => /* @__PURE__ */ i(w, { style: {
   minHeight: 0,
   height: "calc(100% - 68px)"
-}, children: /* @__PURE__ */ i(Fo, { withBorder: !0, p: "md", children: _c(t, e) }) }), HD = D(GD), QD = (t) => {
+}, children: /* @__PURE__ */ i(Fo, { withBorder: !0, p: "md", children: _c(t, e) }) }), QD = D(HD), KD = (t) => {
   const e = kt(() => rf(t.variable), [t.variable]), {
     classes: n
   } = Nd(), {
@@ -25756,23 +25760,23 @@ const Nd = Nn((t) => ({
         /* @__PURE__ */ i(K, { variant: "filled", disabled: !e.changed, color: "primary", onClick: e.commit, children: /* @__PURE__ */ i(Sn, { size: 18 }) }),
         /* @__PURE__ */ i(K, { color: "red", onClick: () => t.uiModel.remove(t.variable), children: /* @__PURE__ */ i(Pn, { size: 18 }) })
       ] }),
-      /* @__PURE__ */ i(WD, { value: zt(e.copy), onChange: e.update, data: r })
+      /* @__PURE__ */ i(jD, { value: zt(e.copy), onChange: e.update, data: r })
     ] }),
-    /* @__PURE__ */ i(HD, { variable: zt(e.copy), data: r })
+    /* @__PURE__ */ i(QD, { variable: zt(e.copy), data: r })
   ] });
-}, KD = D(QD), UD = () => {
-  const t = qD(), {
+}, UD = D(KD), XD = () => {
+  const t = WD(), {
     classes: e
   } = Nd();
   return /* @__PURE__ */ h(w, { className: e.root, noWrap: !0, align: "start", children: [
     /* @__PURE__ */ i(Fo, { withBorder: !0, p: "md", className: "var-list-container", children: /* @__PURE__ */ h(S, { justify: "space-between", children: [
       /* @__PURE__ */ i(V, { className: "var-list-actions", children: /* @__PURE__ */ i(M, { variant: "light", size: "sm", onClick: t.addNew, fullWidth: !0, children: "Add Variable" }) }),
-      /* @__PURE__ */ i(YD, { uiModel: t })
+      /* @__PURE__ */ i(GD, { uiModel: t })
     ] }) }),
-    t.selected ? /* @__PURE__ */ i(H, { children: /* @__PURE__ */ i(KD, { uiModel: t, variable: t.selected }) }) : /* @__PURE__ */ i("span", { children: "Select or create a new variable on right side" })
+    t.selected ? /* @__PURE__ */ i(H, { children: /* @__PURE__ */ i(UD, { uiModel: t, variable: t.selected }) }) : /* @__PURE__ */ i("span", { children: "Select or create a new variable on right side" })
   ] });
-}, XD = D(UD);
-function JD() {
+}, JD = D(XD);
+function ZD() {
   const {
     vizManager: t
   } = Et(Ft);
@@ -25785,7 +25789,7 @@ function JD() {
     return T.orderBy(e, [(n) => n.group, (n) => n.label], ["asc", "asc"]);
   }, [t]);
 }
-const ZD = D(({
+const eI = D(({
   value: t,
   submit: e
 }) => {
@@ -25793,17 +25797,17 @@ const ZD = D(({
   W(() => {
     r(t);
   }, [t]);
-  const o = JD();
+  const o = ZD();
   return /* @__PURE__ */ i(P, { label: "Visualization", value: n, searchable: !0, onChange: r, data: o, rightSection: /* @__PURE__ */ i(K, { disabled: !(t !== n), onClick: () => e(n), children: /* @__PURE__ */ i(we, { size: 20 }) }), maxDropdownHeight: 600 });
 }), js = [];
-function eI(t, e) {
+function tI(t, e) {
   try {
     return t.resolveComponent(e).createConfig();
   } catch {
     return null;
   }
 }
-function tI() {
+function nI() {
   const {
     data: t,
     panel: {
@@ -25838,7 +25842,7 @@ function tI() {
     return console.info(ce(x, "message")), null;
   }
 }
-const nI = D(() => {
+const rI = D(() => {
   const {
     data: t,
     panel: {
@@ -25849,7 +25853,7 @@ const nI = D(() => {
   } = Et(Ft), r = z.useCallback((d) => {
     if (d === e.type)
       return;
-    const p = eI(n, d);
+    const p = tI(n, d);
     e.setType(d), e.setConf(p || {});
   }, [e.type]), o = (d) => {
     try {
@@ -25860,7 +25864,7 @@ const nI = D(() => {
   }, a = z.useMemo(() => {
     var d;
     return (d = js.find((p) => p.value === e.type)) == null ? void 0 : d.Panel;
-  }, [e.type, js]), s = tI(), l = a ? Ur(a, {
+  }, [e.type, js]), s = nI(), l = a ? Ur(a, {
     data: t,
     conf: e.conf,
     setConf: e.setConf
@@ -25869,7 +25873,7 @@ const nI = D(() => {
     height: "100%",
     overflow: "hidden"
   }, children: [
-    /* @__PURE__ */ i(ZD, { submit: r, value: e.type }),
+    /* @__PURE__ */ i(eI, { submit: r, value: e.type }),
     /* @__PURE__ */ h(ct, { children: [
       /* @__PURE__ */ i(S, { pb: 10, sx: {
         flexGrow: 1,
@@ -25879,7 +25883,7 @@ const nI = D(() => {
       !c && /* @__PURE__ */ i(el, { minRows: 20, label: "Config", value: JSON.stringify(e.conf, null, 2), onChange: o })
     ] })
   ] });
-}), rI = D(({
+}), iI = D(({
   panel: t,
   sourceViewID: e
 }) => {
@@ -25913,7 +25917,7 @@ const nI = D(() => {
       ] })
     ] }) })
   ] });
-}), iI = {
+}), oI = {
   root: {
     flexGrow: 1,
     width: "100%",
@@ -25936,15 +25940,15 @@ const nI = D(() => {
     height: "100%",
     overflow: "auto"
   }, children: t }),
-  /* @__PURE__ */ i(ND, {})
+  /* @__PURE__ */ i(BD, {})
 ] });
-function oI(t) {
+function aI(t) {
   return !["richText", "button"].includes(t);
 }
-const aI = D(({
+const sI = D(({
   panel: t
 }) => {
-  const e = jt(), n = Le(), r = ne(), [o, a] = U("Data"), s = t.queries, c = oI(t.viz.type) && t.dataLoading, d = c || t.queryErrors.length > 0 || t.queryStateMessages.length > 0 || s.length === 0, p = n.editor.path[1];
+  const e = jt(), n = Le(), r = ne(), [o, a] = U("Data"), s = t.queries, c = aI(t.viz.type) && t.dataLoading, d = c || t.queryErrors.length > 0 || t.queryStateMessages.length > 0 || s.length === 0, p = n.editor.path[1];
   W(() => {
     a((m) => d && m === "Visualization" ? "Data" : m);
   }, [t.id, d]);
@@ -25979,11 +25983,11 @@ const aI = D(({
         " "
       ] }),
       /* @__PURE__ */ h(w, { position: "right", noWrap: !0, children: [
-        /* @__PURE__ */ i(rI, { panel: t, sourceViewID: p }),
+        /* @__PURE__ */ i(iI, { panel: t, sourceViewID: p }),
         /* @__PURE__ */ i(M, { size: "xs", variant: "subtle", color: "red", onClick: f, leftIcon: /* @__PURE__ */ i(Pn, { size: 14 }), children: "Delete This Panel" })
       ] })
     ] }),
-    /* @__PURE__ */ h(g, { value: o, onTabChange: a, keepMounted: !1, styles: iI, children: [
+    /* @__PURE__ */ h(g, { value: o, onTabChange: a, keepMounted: !1, styles: oI, children: [
       /* @__PURE__ */ h(g.List, { children: [
         /* @__PURE__ */ i(g.Tab, { value: "Data", disabled: c, children: "Data" }),
         /* @__PURE__ */ i(g.Tab, { value: "Panel", children: "Panel" }),
@@ -25993,15 +25997,15 @@ const aI = D(({
       ] }),
       /* @__PURE__ */ h(g.Panel, { value: "Data", children: [
         /* @__PURE__ */ i(_n, { visible: c, exitTransitionDuration: 0 }),
-        /* @__PURE__ */ i(VD, {})
+        /* @__PURE__ */ i(ND, {})
       ] }),
-      /* @__PURE__ */ i(g.Panel, { value: "Panel", children: /* @__PURE__ */ i(Ys, { children: /* @__PURE__ */ i(OD, {}) }) }),
-      /* @__PURE__ */ i(g.Panel, { value: "Variables", children: /* @__PURE__ */ i(XD, {}) }),
-      /* @__PURE__ */ i(g.Panel, { value: "Visualization", children: /* @__PURE__ */ i(ct, { children: /* @__PURE__ */ i(Ys, { children: /* @__PURE__ */ i(nI, {}) }) }) }),
+      /* @__PURE__ */ i(g.Panel, { value: "Panel", children: /* @__PURE__ */ i(Ys, { children: /* @__PURE__ */ i(FD, {}) }) }),
+      /* @__PURE__ */ i(g.Panel, { value: "Variables", children: /* @__PURE__ */ i(JD, {}) }),
+      /* @__PURE__ */ i(g.Panel, { value: "Visualization", children: /* @__PURE__ */ i(ct, { children: /* @__PURE__ */ i(Ys, { children: /* @__PURE__ */ i(rI, {}) }) }) }),
       /* @__PURE__ */ i(g.Panel, { value: "Interactions", children: /* @__PURE__ */ i(ct, { children: /* @__PURE__ */ i(Kf, {}) }) })
     ] })
   ] });
-}), sI = D(({
+}), lI = D(({
   viewID: t,
   panelID: e
 }) => {
@@ -26013,7 +26017,7 @@ const aI = D(({
       "] is not found"
     ] });
   const o = n.panels.findByID(e);
-  return o ? /* @__PURE__ */ i(aI, { panel: o }) : /* @__PURE__ */ h(C, { size: 14, children: [
+  return o ? /* @__PURE__ */ i(sI, { panel: o }) : /* @__PURE__ */ h(C, { size: 14, children: [
     "Panel by ID[",
     e,
     "] is not found"
@@ -26030,7 +26034,7 @@ const aI = D(({
   /* @__PURE__ */ i(rs, { width: e, height: n, radius: "xs" })
 ] }), or = ({
   value: t
-}) => t === null || t === "" ? null : /* @__PURE__ */ i(Re, { label: t, disabled: !t, multiline: !0, children: /* @__PURE__ */ i(K, { children: /* @__PURE__ */ i(Bn, { size: 14 }) }) }), lI = ({
+}) => t === null || t === "" ? null : /* @__PURE__ */ i(Re, { label: t, disabled: !t, multiline: !0, children: /* @__PURE__ */ i(K, { children: /* @__PURE__ */ i(Bn, { size: 14 }) }) }), cI = ({
   column: t
 }) => {
   const {
@@ -26038,7 +26042,7 @@ const aI = D(({
     column_key_text: n
   } = t;
   return e ? /* @__PURE__ */ i(Re, { label: n, disabled: !n, children: /* @__PURE__ */ i(sr, { children: e }) }) : null;
-}, cI = D(({
+}, dI = D(({
   dataSource: t
 }) => {
   const {
@@ -26092,13 +26096,13 @@ const aI = D(({
       /* @__PURE__ */ i("td", { children: n.ordinal_position }),
       /* @__PURE__ */ i("td", { children: n.column_name }),
       /* @__PURE__ */ i("td", { children: /* @__PURE__ */ i(or, { value: n.column_comment }) }),
-      /* @__PURE__ */ i("td", { children: /* @__PURE__ */ i(lI, { column: n }) }),
+      /* @__PURE__ */ i("td", { children: /* @__PURE__ */ i(cI, { column: n }) }),
       /* @__PURE__ */ i("td", { children: n.column_type }),
       /* @__PURE__ */ i("td", { children: n.is_nullable }),
       /* @__PURE__ */ i("td", { children: /* @__PURE__ */ i(or, { value: n.column_default }) })
     ] }, n.column_name)) })
   ] });
-}), dI = D(({
+}), uI = D(({
   dataSource: t
 }) => {
   const {
@@ -26146,7 +26150,7 @@ const aI = D(({
       /* @__PURE__ */ i("td", { children: r.column_name })
     ] }, r.index_name)) })
   ] });
-}), uI = D(({
+}), hI = D(({
   dataSource: t
 }) => {
   const {
@@ -26199,29 +26203,29 @@ const aI = D(({
       /* @__PURE__ */ i("td", { children: /* @__PURE__ */ i(or, { value: r.comment }) })
     ] }, r.index_name)) })
   ] });
-}), hI = D(({
+}), pI = D(({
   dataSource: t
 }) => {
   const {
     indexes: e
   } = t;
-  return e.loading || e.empty ? null : t.type === Me.MySQL ? /* @__PURE__ */ i(dI, { dataSource: t }) : t.type === Me.Postgresql ? /* @__PURE__ */ i(uI, { dataSource: t }) : null;
-}), pI = D(({
+  return e.loading || e.empty ? null : t.type === Me.MySQL ? /* @__PURE__ */ i(uI, { dataSource: t }) : t.type === Me.Postgresql ? /* @__PURE__ */ i(hI, { dataSource: t }) : null;
+}), fI = D(({
   dataSource: t
 }) => /* @__PURE__ */ h(S, { spacing: 40, pt: 10, sx: {
   flexGrow: 1,
   overflow: "auto",
   position: "relative"
 }, children: [
-  /* @__PURE__ */ i(ct, { children: /* @__PURE__ */ i(cI, { dataSource: t }) }),
-  /* @__PURE__ */ i(ct, { children: /* @__PURE__ */ i(hI, { dataSource: t }) })
+  /* @__PURE__ */ i(ct, { children: /* @__PURE__ */ i(dI, { dataSource: t }) }),
+  /* @__PURE__ */ i(ct, { children: /* @__PURE__ */ i(pI, { dataSource: t }) })
 ] }));
-function fI({
+function mI({
   table_type: t
 }) {
   return t === "VIEW" ? /* @__PURE__ */ i(vl, { size: 14 }) : t === "BASE TABLE" ? /* @__PURE__ */ i(lh, { size: 14 }) : null;
 }
-const mI = D(({
+const gI = D(({
   dataSource: t
 }) => {
   const {
@@ -26232,17 +26236,17 @@ const mI = D(({
     ".mantine-NavLink-label": {
       fontFamily: "monospace"
     }
-  }, children: Object.entries(e.data).map(([n, r]) => /* @__PURE__ */ i(ji, { label: n, icon: /* @__PURE__ */ i(Xr, { size: 14 }), defaultOpened: t.table_schema === n, pl: 0, childrenOffset: 14, children: r.map((o) => /* @__PURE__ */ i(ji, { label: o.table_name, icon: /* @__PURE__ */ i(fI, { table_type: o.table_type }), onClick: () => {
+  }, children: Object.entries(e.data).map(([n, r]) => /* @__PURE__ */ i(ji, { label: n, icon: /* @__PURE__ */ i(Xr, { size: 14 }), defaultOpened: t.table_schema === n, pl: 0, childrenOffset: 14, children: r.map((o) => /* @__PURE__ */ i(ji, { label: o.table_name, icon: /* @__PURE__ */ i(mI, { table_type: o.table_type }), onClick: () => {
     t.setKeywords(n, o.table_name);
   }, active: t.table_name === o.table_name }, o.table_name)) }, n)) });
-}), gI = ({
+}), bI = ({
   visible: t
 }) => /* @__PURE__ */ i(V, { py: 10, sx: {
   width: "100%",
   height: "100%",
   overflow: "hidden",
   position: "relative"
-}, children: /* @__PURE__ */ i(_n, { visible: t }) }), bI = [{
+}, children: /* @__PURE__ */ i(_n, { visible: t }) }), yI = [{
   label: "10",
   value: "10"
 }, {
@@ -26254,7 +26258,7 @@ const mI = D(({
 }, {
   label: "100",
   value: "100"
-}], yI = {
+}], xI = {
   icon: {
     width: "50px",
     textAlign: "center"
@@ -26264,7 +26268,7 @@ const mI = D(({
       paddingLeft: "50px"
     }
   }
-}, xI = D(({
+}, vI = D(({
   dataSource: t
 }) => {
   const {
@@ -26282,8 +26286,8 @@ const mI = D(({
         {
           icon: /* @__PURE__ */ i(C, { ta: "center", color: "dimmed", size: 14, children: "Limit" }),
           size: "xs",
-          styles: yI,
-          data: bI,
+          styles: xI,
+          data: yI,
           value: String(e.limit),
           onChange: (n) => e.setLimit(Number(n))
         }
@@ -26295,7 +26299,7 @@ const mI = D(({
       " rows"
     ] }) })
   ] });
-}), vI = D(({
+}), wI = D(({
   dataSource: t
 }) => {
   const e = t.tableData;
@@ -26303,8 +26307,8 @@ const mI = D(({
     fontFamily: "monospace"
   }, children: "This table is empty" }) : e.error ? /* @__PURE__ */ i(C, { mt: 20, color: "red", size: "md", align: "center", sx: {
     fontFamily: "monospace"
-  }, children: e.error }) : e.page === 1 && e.loading ? /* @__PURE__ */ i(gI, { visible: !0 }) : /* @__PURE__ */ h(ct, { children: [
-    /* @__PURE__ */ i(xI, { dataSource: t }),
+  }, children: e.error }) : e.page === 1 && e.loading ? /* @__PURE__ */ i(bI, { visible: !0 }) : /* @__PURE__ */ h(ct, { children: [
+    /* @__PURE__ */ i(vI, { dataSource: t }),
     /* @__PURE__ */ h(V, { py: 10, sx: {
       width: "100%",
       height: "calc(100% - 42px)",
@@ -26315,7 +26319,7 @@ const mI = D(({
       /* @__PURE__ */ i(Vd, { data: e.data })
     ] })
   ] });
-}), wI = {
+}), _I = {
   root: {
     flexGrow: 1,
     overflow: "auto",
@@ -26327,7 +26331,7 @@ const mI = D(({
   tab: {
     minWidth: 120
   }
-}, _I = D(({
+}, CI = D(({
   dataSource: t
 }) => (W(() => {
   t.loadTablesIfEmpty();
@@ -26340,20 +26344,20 @@ const mI = D(({
     flexGrow: 0,
     flexShrink: 0,
     position: "relative"
-  }, children: /* @__PURE__ */ i(ct, { children: /* @__PURE__ */ i(mI, { dataSource: t }) }) }),
-  /* @__PURE__ */ h(g, { defaultValue: "structure", styles: wI, children: [
+  }, children: /* @__PURE__ */ i(ct, { children: /* @__PURE__ */ i(gI, { dataSource: t }) }) }),
+  /* @__PURE__ */ h(g, { defaultValue: "structure", styles: _I, children: [
     /* @__PURE__ */ h(g.List, { children: [
       /* @__PURE__ */ i(g.Tab, { value: "structure", icon: /* @__PURE__ */ i(ch, { size: 14 }), children: "Structure" }),
       /* @__PURE__ */ i(g.Tab, { value: "data", icon: /* @__PURE__ */ i(Xr, { size: 14 }), children: "Data" })
     ] }),
-    /* @__PURE__ */ i(g.Panel, { value: "structure", children: /* @__PURE__ */ i(pI, { dataSource: t }) }),
+    /* @__PURE__ */ i(g.Panel, { value: "structure", children: /* @__PURE__ */ i(fI, { dataSource: t }) }),
     /* @__PURE__ */ i(g.Panel, { value: "data", sx: {
       width: "100%",
       height: "calc(100% - 36px)",
       overflow: "hidden"
-    }, children: /* @__PURE__ */ i(vI, { dataSource: t }) })
+    }, children: /* @__PURE__ */ i(wI, { dataSource: t }) })
   ] })
-] }))), CI = {
+] }))), SI = {
   modal: {
     paddingLeft: "0px !important",
     paddingRight: "0px !important"
@@ -26389,23 +26393,23 @@ const mI = D(({
           to: "red"
         }, children: t.type })
       ] })
-    ] }), zIndex: 320, size: "96vw", overflow: "inside", styles: CI, children: /* @__PURE__ */ i(V, { sx: {
+    ] }), zIndex: 320, size: "96vw", overflow: "inside", styles: SI, children: /* @__PURE__ */ i(V, { sx: {
       height: "calc(100vh - 220px)"
-    }, children: /* @__PURE__ */ i(_I, { dataSource: t }) }) }),
+    }, children: /* @__PURE__ */ i(CI, { dataSource: t }) }) }),
     /* @__PURE__ */ i(M, { variant: "subtle", onClick: () => r(!0), px: 16, styles: {
       inner: {
         justifyContent: "flex-start"
       }
     }, ...e, children: "See Table Structure" })
   ] });
-}), SI = Ie(({
+}), kI = Ie(({
   label: t,
   type: e,
   ...n
 }, r) => /* @__PURE__ */ h(w, { position: "apart", ref: r, ...n, children: [
   /* @__PURE__ */ i(C, { children: t }),
   /* @__PURE__ */ i(C, { children: e })
-] })), kI = D(({
+] })), TI = D(({
   value: t,
   onChange: e
 }) => {
@@ -26431,7 +26435,7 @@ const mI = D(({
       size: "xs",
       px: 10
     } })
-  ] }), itemComponent: SI, rightSection: c ? /* @__PURE__ */ i(C, { size: "xs", color: "dimmed", children: c.type }) : void 0, rightSectionWidth: 85, maxDropdownHeight: 280, styles: {
+  ] }), itemComponent: kI, rightSection: c ? /* @__PURE__ */ i(C, { size: "xs", color: "dimmed", children: c.type }) : void 0, rightSectionWidth: 85, maxDropdownHeight: 280, styles: {
     root: {
       flex: 1
     },
@@ -26447,7 +26451,7 @@ const mI = D(({
       }
     }
   }, disabled: o, value: t.key, onChange: l });
-}), TI = (t) => {
+}), DI = (t) => {
   const {
     queryModel: e
   } = t, n = Le(), r = ne(), a = r.findQueryUsage(e.id).length > 0, s = jt(), l = () => {
@@ -26476,7 +26480,7 @@ const mI = D(({
   }, children: "Delete this Query" }) }) : /* @__PURE__ */ i(M, { color: "red", size: "xs", onClick: l, leftIcon: /* @__PURE__ */ i(Pn, { size: 16 }), sx: {
     alignSelf: "flex-end"
   }, children: "Delete this Query" });
-}, DI = D(TI), II = D(({
+}, II = D(DI), MI = D(({
   queryModel: t
 }) => {
   const [e, n] = U(t.name);
@@ -26495,7 +26499,7 @@ const mI = D(({
     }, rightSection: /* @__PURE__ */ i(K, { variant: "filled", color: "blue", size: "sm", onClick: () => t.setName(e), disabled: e === t.name, children: /* @__PURE__ */ i(Sn, { size: 16 }) }), onBlur: () => {
       t.setName(e);
     } }),
-    /* @__PURE__ */ i(kI, { value: {
+    /* @__PURE__ */ i(TI, { value: {
       type: t.type,
       key: t.key
     }, onChange: ({
@@ -26508,10 +26512,10 @@ const mI = D(({
     /* @__PURE__ */ i(ar, { label: "Run query when these are truthy", placeholder: "Always run this query on load", data: t.conditionOptions, value: [...t.run_by], onChange: t.setRunBy }),
     t.typedAsHTTP && /* @__PURE__ */ i(ar, { label: "Re-run query when these changed", placeholder: "Leave it empty to never re-run this query", data: t.conditionOptions, value: [...t.react_to], onChange: t.setReactTo }),
     /* @__PURE__ */ i(E, { mt: 20, mb: 10, variant: "dashed" }),
-    /* @__PURE__ */ i(DI, { queryModel: t })
+    /* @__PURE__ */ i(II, { queryModel: t })
   ] }) });
 });
-function MI() {
+function $I() {
   const [t, {
     open: e,
     close: n
@@ -26531,7 +26535,7 @@ function MI() {
     /* @__PURE__ */ i(M, { variant: "light", color: "violet", size: "xs", onClick: e, leftIcon: /* @__PURE__ */ i(Bn, { size: 16 }), children: "About parameter 'utils'" })
   ] });
 }
-const $I = ({
+const zI = ({
   value: t,
   onChange: e
 }) => /* @__PURE__ */ i(V, { sx: {
@@ -26572,7 +26576,7 @@ const $I = ({
       flexShrink: 0,
       flexGrow: 0
     }, children: [
-      /* @__PURE__ */ i(w, { position: "left", children: /* @__PURE__ */ i(MI, {}) }),
+      /* @__PURE__ */ i(w, { position: "left", children: /* @__PURE__ */ i($I, {}) }),
       /* @__PURE__ */ h(w, { position: "right", children: [
         /* @__PURE__ */ i(M, { onClick: d, size: "xs", variant: "default", leftIcon: /* @__PURE__ */ i(dh, { size: 16 }), children: "Reset to default" }),
         /* @__PURE__ */ i(M, { onClick: c, color: "red", size: "xs", disabled: !p, leftIcon: /* @__PURE__ */ i(bl, { size: 16 }), children: "Revert Changes" }),
@@ -26580,10 +26584,10 @@ const $I = ({
       ] })
     ] }),
     /* @__PURE__ */ i(C, { size: 14, children: n }),
-    /* @__PURE__ */ i($I, { value: a, onChange: s })
+    /* @__PURE__ */ i(zI, { value: a, onChange: s })
   ] });
 });
-function zI({
+function LI({
   content: t
 }) {
   return /* @__PURE__ */ h(nt, { width: "60vw", shadow: "md", children: [
@@ -26591,7 +26595,7 @@ function zI({
     /* @__PURE__ */ i(nt.Dropdown, { children: /* @__PURE__ */ i(wn, { language: "sql", noCopy: !0, withLineNumbers: !0, children: t }) })
   ] });
 }
-const LI = D(() => {
+const AI = D(() => {
   const e = [...Le().globalSQLSnippets.list];
   return e.length === 0 ? null : /* @__PURE__ */ h(Rt, { horizontalSpacing: "xs", verticalSpacing: "xs", fontSize: "sm", highlightOnHover: !0, children: [
     /* @__PURE__ */ i("thead", { children: /* @__PURE__ */ h("tr", { children: [
@@ -26605,11 +26609,11 @@ const LI = D(() => {
       } = n;
       return /* @__PURE__ */ h("tr", { children: [
         /* @__PURE__ */ i("td", { children: r }),
-        /* @__PURE__ */ i("td", { width: 200, children: /* @__PURE__ */ i(zI, { content: o }) })
+        /* @__PURE__ */ i("td", { width: 200, children: /* @__PURE__ */ i(LI, { content: o }) })
       ] }, r);
     }) })
   ] });
-}), AI = `
+}), EI = `
 -- You may reference query variables in SQL or VizConfig.
 SELECT *
 FROM commit
@@ -26647,13 +26651,13 @@ WHERE
     ] }),
     /* @__PURE__ */ i(g.Panel, { value: "guide", pt: "xs", children: /* @__PURE__ */ i(wn, { language: "sql", sx: {
       width: "100%"
-    }, noCopy: !0, colorScheme: "dark", children: AI }) }),
+    }, noCopy: !0, colorScheme: "dark", children: EI }) }),
     /* @__PURE__ */ i(g.Panel, { value: "local_query_vars", pt: "xs", children: /* @__PURE__ */ i(wn, { language: "json", sx: {
       width: "100%"
     }, noCopy: !0, colorScheme: "dark", children: s }) }),
     /* @__PURE__ */ i(g.Panel, { value: "global_sql_snippets", pt: "xs", children: /* @__PURE__ */ h(S, { spacing: 10, children: [
       /* @__PURE__ */ i(Us, { icon: /* @__PURE__ */ i(ss, { size: 16 }), title: "Global SQL Snippets", children: "SQL snippets worth sharing between dashboards are managed in System Settings by admins." }),
-      /* @__PURE__ */ i(LI, {})
+      /* @__PURE__ */ i(AI, {})
     ] }) })
   ] }) });
 }), Va = D(() => {
@@ -26671,7 +26675,7 @@ WHERE
 `),
   post: ["function process_result(res, utils) {", "    // your code goes here", "    return data", "}"].join(`
 `)
-}, EI = D(({
+}, RI = D(({
   queryModel: t
 }) => t.typedAsHTTP ? /* @__PURE__ */ h(g, { defaultValue: "pre_process", orientation: "vertical", sx: {
   flexGrow: 1
@@ -26685,7 +26689,7 @@ WHERE
     position: "relative"
   }, p: "sm", children: /* @__PURE__ */ i(Kr, { label: "", value: t.pre_process, onChange: t.setPreProcess, defaultValue: Gs.pre }) }),
   /* @__PURE__ */ i(g.Panel, { value: "post_process", p: "sm", children: /* @__PURE__ */ i(Kr, { label: "", value: t.post_process, onChange: t.setPostProcess, defaultValue: Gs.post }) })
-] }) : null), RI = D(({
+] }) : null), OI = D(({
   queryID: t,
   usage: e
 }) => {
@@ -26745,7 +26749,7 @@ WHERE
     readOnly: s || !e,
     "semanticHighlighting.enabled": !0
   } });
-}, OI = ({
+}, FI = ({
   value: t,
   height: e = "200px",
   defaultLanguage: n = "sql"
@@ -26758,17 +26762,17 @@ WHERE
     enabled: !1
   },
   readOnly: !0
-} }), FI = D(({
+} }), PI = D(({
   value: t
 }) => {
   const n = ne().payloadForSQL, r = z.useMemo(() => Go(t, n), [t, n]);
-  return /* @__PURE__ */ i(OI, { height: "100%", value: r });
+  return /* @__PURE__ */ i(FI, { height: "100%", value: r });
 }), Hs = {
   pre: ["function process_request({ context, filters, sql }, utils) {", "    // modify and return sql", "    return sql", "}"].join(`
 `),
   post: ["function process_result(data, utils) {", "    // process data and return the result", "    return data", "}"].join(`
 `)
-}, PI = D(({
+}, VI = D(({
   queryModel: t
 }) => {
   const [e, n] = z.useState(t.sql);
@@ -26801,7 +26805,7 @@ WHERE
     /* @__PURE__ */ i(g.Panel, { value: "Edit", sx: {
       position: "relative"
     }, p: "sm", children: /* @__PURE__ */ i(Na, { height: "100%", value: e, onChange: n, theme: "sql-dark", defaultLanguage: "sql" }) }),
-    /* @__PURE__ */ i(g.Panel, { value: "Preview", p: 0, pl: 4, children: /* @__PURE__ */ i(FI, { value: t.sql }) }),
+    /* @__PURE__ */ i(g.Panel, { value: "Preview", p: 0, pl: 4, children: /* @__PURE__ */ i(PI, { value: t.sql }) }),
     /* @__PURE__ */ i(g.Panel, { value: "pre_process", sx: {
       position: "relative"
     }, p: "sm", children: /* @__PURE__ */ i(Kr, { label: "", value: t.pre_process, onChange: t.setPreProcess, defaultValue: Hs.pre }) }),
@@ -26811,7 +26815,7 @@ WHERE
   height: "calc(100% - 44px)",
   // Tabs.List
   padding: 0
-}, VI = D(({
+}, NI = D(({
   queryModel: t
 }) => {
   const e = ne(), n = $(() => t.datasource ? t.typedAsHTTP ? "HTTP" : "SQL" : "Configurations", [t.datasource, t.typedAsHTTP]), [r, o] = U(n);
@@ -26831,13 +26835,13 @@ WHERE
       /* @__PURE__ */ i(g.Tab, { value: "Data", disabled: !t.datasource, children: /* @__PURE__ */ i(Re, { label: "Need to pick a Data Source first", disabled: t.datasource, withinPortal: !0, children: /* @__PURE__ */ i(C, { children: "Data" }) }) }),
       /* @__PURE__ */ i(g.Tab, { value: "Usage", disabled: s, children: /* @__PURE__ */ i(Re, { label: "This query is not used for any filter or panel", disabled: !s, withinPortal: !0, children: /* @__PURE__ */ i(C, { children: "Usage" }) }) })
     ] }),
-    /* @__PURE__ */ i(g.Panel, { value: "Configurations", pt: 0, p: 0, children: /* @__PURE__ */ i(II, { queryModel: t }) }),
+    /* @__PURE__ */ i(g.Panel, { value: "Configurations", pt: 0, p: 0, children: /* @__PURE__ */ i(MI, { queryModel: t }) }),
     t.typedAsSQL && /* @__PURE__ */ i(g.Panel, { value: "SQL", sx: zr, children: /* @__PURE__ */ i(S, { sx: {
       height: "100%"
-    }, children: /* @__PURE__ */ i(PI, { queryModel: t }) }) }),
+    }, children: /* @__PURE__ */ i(VI, { queryModel: t }) }) }),
     t.typedAsHTTP && /* @__PURE__ */ i(g.Panel, { value: "HTTP", sx: zr, children: /* @__PURE__ */ i(S, { sx: {
       height: "100%"
-    }, children: /* @__PURE__ */ i(EI, { queryModel: t }) }) }),
+    }, children: /* @__PURE__ */ i(RI, { queryModel: t }) }) }),
     /* @__PURE__ */ i(g.Panel, { value: "Data", sx: {
       ...zr,
       overflow: "hidden"
@@ -26845,21 +26849,21 @@ WHERE
     /* @__PURE__ */ i(g.Panel, { value: "Usage", sx: {
       ...zr,
       overflow: "hidden"
-    }, children: /* @__PURE__ */ i(RI, { queryID: t.id, usage: a }) })
+    }, children: /* @__PURE__ */ i(OI, { queryID: t.id, usage: a }) })
   ] }) });
-}), NI = D(({
+}), BI = D(({
   id: t
 }) => {
   const n = ne().queries.findByID(t);
   return t === "" ? null : n ? /* @__PURE__ */ i(S, { sx: {
     height: "100%"
-  }, spacing: "sm", children: /* @__PURE__ */ i(VI, { queryModel: n }) }) : /* @__PURE__ */ i(C, { size: 14, color: "red", children: "Invalid Query ID" });
-}), BI = D(({
+  }, spacing: "sm", children: /* @__PURE__ */ i(NI, { queryModel: n }) }) : /* @__PURE__ */ i(C, { size: 14, color: "red", children: "Invalid Query ID" });
+}), qI = D(({
   value: t
 }) => {
   const n = ne().payloadForSQL, r = $(() => Go(t, n), [t, n]);
   return /* @__PURE__ */ i(Na, { height: "100%", value: r });
-}), qI = D(({
+}), WI = D(({
   item: t,
   remove: e,
   onKeyChanged: n
@@ -26931,10 +26935,10 @@ WHERE
         }, children: /* @__PURE__ */ i(we, { size: 18 }) })
       ] }),
       /* @__PURE__ */ i(g.Panel, { value: "SQL", pt: "sm", children: /* @__PURE__ */ i(Na, { height: "100%", value: p, onChange: u, defaultLanguage: "sql", theme: "sql-dark" }) }),
-      /* @__PURE__ */ i(g.Panel, { value: "Preview", pt: "sm", children: /* @__PURE__ */ i(BI, { value: p }) })
+      /* @__PURE__ */ i(g.Panel, { value: "Preview", pt: "sm", children: /* @__PURE__ */ i(qI, { value: p }) })
     ] })
   ] });
-}), WI = D(({
+}), jI = D(({
   id: t
 }) => {
   const e = Le(), n = ne(), r = $(() => n.sqlSnippets.findByKey(t), [t]);
@@ -26949,17 +26953,17 @@ WHERE
   const o = () => {
     e.editor.setPath(["_SQL_SNIPPETS_", ""]);
   };
-  return /* @__PURE__ */ i(qI, { item: r, remove: () => {
+  return /* @__PURE__ */ i(WI, { item: r, remove: () => {
     n.sqlSnippets.removeByKey(t), o();
   }, onKeyChanged: (l) => {
     e.editor.setPath(["_SQL_SNIPPETS_", l]);
   } });
-}), jI = D(({
+}), YI = D(({
   view: t
 }) => !t || t.type !== le.Division ? null : /* @__PURE__ */ h(S, { children: [
   /* @__PURE__ */ i(E, { mt: 8, mb: 0, label: "Division settings", labelPosition: "center" }),
   /* @__PURE__ */ i(C, { align: "center", size: "xs", color: "dimmed", children: "Under construction" })
-] })), YI = [{
+] })), GI = [{
   value: "default",
   label: "Default"
 }, {
@@ -26968,13 +26972,13 @@ WHERE
 }, {
   value: "pills",
   label: "Pills"
-}], GI = [{
+}], HI = [{
   value: "horizontal",
   label: "Horizontal"
 }, {
   value: "vertical",
   label: "Vertical"
-}], HI = D(({
+}], QI = D(({
   view: t
 }) => {
   if (!t || t.type !== le.Tabs)
@@ -26982,11 +26986,11 @@ WHERE
   const e = t.config;
   return /* @__PURE__ */ h(S, { children: [
     /* @__PURE__ */ i(E, { mt: 8, mb: 0, label: "Tabs settings", labelPosition: "center" }),
-    /* @__PURE__ */ i(P, { label: "Variant", value: e.variant, onChange: e.setVariant, data: YI }),
-    /* @__PURE__ */ i(P, { label: "Orientation", value: e.orientation, onChange: e.setOrientation, data: GI }),
+    /* @__PURE__ */ i(P, { label: "Variant", value: e.variant, onChange: e.setVariant, data: GI }),
+    /* @__PURE__ */ i(P, { label: "Orientation", value: e.orientation, onChange: e.setOrientation, data: HI }),
     /* @__PURE__ */ i(tt, { label: "Grow Tabs", checked: e.grow, onChange: (n) => e.setGrow(n.currentTarget.checked) })
   ] });
-}), QI = ({
+}), KI = ({
   disabled: t,
   value: e,
   onChange: n
@@ -27002,7 +27006,7 @@ WHERE
     },
     readOnly: t
   } })
-] }), KI = ({
+] }), UI = ({
   value: t,
   onChange: e
 }) => {
@@ -27040,7 +27044,7 @@ WHERE
     }, children: /* @__PURE__ */ i(Il, { size: 14 }) }),
     /* @__PURE__ */ i($e, { size: 800, title: "Customize modal title", opened: n, onClose: o, closeOnClickOutside: !1, withCloseButton: !1, zIndex: 320, children: n && /* @__PURE__ */ h(S, { children: [
       /* @__PURE__ */ i(ve, { mt: 10, label: "Enabled", checked: a.enabled, onChange: (f) => l(f.currentTarget.checked) }),
-      /* @__PURE__ */ i(QI, { value: a.func_content, onChange: p, disabled: !a.enabled }),
+      /* @__PURE__ */ i(KI, { value: a.func_content, onChange: p, disabled: !a.enabled }),
       /* @__PURE__ */ h(w, { position: "apart", children: [
         /* @__PURE__ */ i(M, { onClick: u, color: "red", leftIcon: /* @__PURE__ */ i(Ot, { size: 20 }), children: "Rest" }),
         /* @__PURE__ */ h(w, { position: "right", children: [
@@ -27050,7 +27054,7 @@ WHERE
       ] })
     ] }) })
   ] });
-}, UI = D(({
+}, XI = D(({
   view: t
 }) => {
   if (!t || t.type !== le.Modal)
@@ -27062,20 +27066,20 @@ WHERE
       /* @__PURE__ */ i(A, { label: "Modal Title", value: n, onChange: T.noop, disabled: !0, sx: {
         flexGrow: 1
       } }),
-      /* @__PURE__ */ i(KI, { value: e.custom_modal_title, onChange: e.custom_modal_title.replace })
+      /* @__PURE__ */ i(UI, { value: e.custom_modal_title, onChange: e.custom_modal_title.replace })
     ] }),
     /* @__PURE__ */ h(w, { grow: !0, children: [
       /* @__PURE__ */ i(A, { label: "Width", value: e.width, onChange: (r) => e.setWidth(r.currentTarget.value), placeholder: "600px / 50vw" }),
       /* @__PURE__ */ i(A, { label: "Height", value: e.height, onChange: (r) => e.setHeight(r.currentTarget.value), placeholder: "600px / 50vw" })
     ] })
   ] });
-}), XI = D(({
+}), JI = D(({
   view: t
 }) => /* @__PURE__ */ h(H, { children: [
-  /* @__PURE__ */ i(jI, { view: t }),
-  /* @__PURE__ */ i(UI, { view: t }),
-  /* @__PURE__ */ i(HI, { view: t })
-] })), JI = [{
+  /* @__PURE__ */ i(YI, { view: t }),
+  /* @__PURE__ */ i(XI, { view: t }),
+  /* @__PURE__ */ i(QI, { view: t })
+] })), ZI = [{
   label: "Division",
   value: le.Division
 }, {
@@ -27084,7 +27088,7 @@ WHERE
 }, {
   label: "Tabs",
   value: le.Tabs
-}], ZI = D(({
+}], eM = D(({
   view: t
 }) => t ? /* @__PURE__ */ h(S, { sx: {
   position: "relative"
@@ -27092,9 +27096,9 @@ WHERE
   /* @__PURE__ */ i(A, { label: "Name", value: t.name, onChange: (e) => {
     t.setName(e.currentTarget.value);
   } }),
-  /* @__PURE__ */ i(P, { label: "Type", withinPortal: !0, value: t.type, onChange: t.setType, data: JI }),
-  /* @__PURE__ */ i(XI, { view: t })
-] }) : null), eM = D(({
+  /* @__PURE__ */ i(P, { label: "Type", withinPortal: !0, value: t.type, onChange: t.setType, data: ZI }),
+  /* @__PURE__ */ i(JI, { view: t })
+] }) : null), tM = D(({
   id: t
 }) => {
   const e = jt(), n = Le(), r = ne();
@@ -27132,36 +27136,36 @@ WHERE
       flexGrow: 1,
       maxHeight: "calc(100% - 52px)",
       overflow: "auto"
-    }, children: /* @__PURE__ */ i(ZI, { view: o }) })
+    }, children: /* @__PURE__ */ i(eM, { view: o }) })
   ] });
 });
-function tM(t) {
+function nM(t) {
   return t.length === 1 && t[0] === "_QUERY_VARS_";
 }
-function nM(t) {
+function rM(t) {
   return t.length === 1 && t[0] === "_MOCK_CONTEXT_";
 }
-function rM(t) {
+function iM(t) {
   return t.length === 2 && t[0] === "_FILTERS_";
 }
-function iM(t) {
+function oM(t) {
   return t.length === 2 && t[0] === "_SQL_SNIPPETS_";
 }
-function oM(t) {
+function aM(t) {
   return t.length === 2 && t[0] === "_QUERIES_";
 }
-function aM(t) {
+function sM(t) {
   return t.length === 2 && t[0] === "_VIEWS_";
 }
-function sM(t) {
+function lM(t) {
   return t.length === 4 && t[0] === "_VIEWS_" && t[2] === "_PANELS_";
 }
-const lM = D(() => /* @__PURE__ */ i(S, { sx: {
+const cM = D(() => /* @__PURE__ */ i(S, { sx: {
   height: "100%"
-}, p: "sm", children: /* @__PURE__ */ i(Wd, {}) })), cM = D(() => {
+}, p: "sm", children: /* @__PURE__ */ i(Wd, {}) })), dM = D(() => {
   const t = Le().editor, e = t.path;
-  return tM(e) ? /* @__PURE__ */ i(lM, {}) : nM(e) ? /* @__PURE__ */ i(LD, {}) : rM(e) ? /* @__PURE__ */ i(V, { p: "xs", pl: 20, children: /* @__PURE__ */ i(zD, { id: e[1] }) }) : iM(e) ? /* @__PURE__ */ i(WI, { id: e[1] }) : oM(e) ? /* @__PURE__ */ i(NI, { id: e[1] }) : aM(e) ? /* @__PURE__ */ i(V, { p: "xs", pl: 20, children: /* @__PURE__ */ i(eM, { id: e[1] }) }) : sM(e) ? /* @__PURE__ */ i(sI, { viewID: e[1], panelID: e[3] }) : /* @__PURE__ */ i(V, { children: t.path });
-}), dM = D(() => /* @__PURE__ */ i(cM, {})), uM = D(() => {
+  return nM(e) ? /* @__PURE__ */ i(cM, {}) : rM(e) ? /* @__PURE__ */ i(AD, {}) : iM(e) ? /* @__PURE__ */ i(V, { p: "xs", pl: 20, children: /* @__PURE__ */ i(LD, { id: e[1] }) }) : oM(e) ? /* @__PURE__ */ i(jI, { id: e[1] }) : aM(e) ? /* @__PURE__ */ i(BI, { id: e[1] }) : sM(e) ? /* @__PURE__ */ i(V, { p: "xs", pl: 20, children: /* @__PURE__ */ i(tM, { id: e[1] }) }) : lM(e) ? /* @__PURE__ */ i(lI, { viewID: e[1], panelID: e[3] }) : /* @__PURE__ */ i(V, { children: t.path });
+}), uM = D(() => /* @__PURE__ */ i(dM, {})), hM = D(() => {
   const t = Le();
   return /* @__PURE__ */ i(M, { variant: "subtle", leftIcon: /* @__PURE__ */ i(on, { size: 14 }), size: "sm", px: "xs", mb: 10, color: "blue", onClick: () => {
     const n = (/* @__PURE__ */ new Date()).getTime().toString(), r = {
@@ -27183,7 +27187,7 @@ const lM = D(() => /* @__PURE__ */ i(S, { sx: {
       justifyContent: "flex-start"
     }
   }, children: "Add a Filter" });
-}), hM = D(({
+}), pM = D(({
   parentID: t
 }) => {
   const e = ne();
@@ -27198,7 +27202,7 @@ const lM = D(() => /* @__PURE__ */ i(S, { sx: {
       justifyContent: "flex-start"
     }
   }, children: "Add a Panel" }) : null;
-}), pM = D(() => {
+}), fM = D(() => {
   const t = Le();
   return /* @__PURE__ */ i(M, { variant: "subtle", leftIcon: /* @__PURE__ */ i(on, { size: 14 }), size: "sm", px: "xs", mb: 10, color: "blue", onClick: () => {
     const n = (/* @__PURE__ */ new Date()).getTime().toString(), r = {
@@ -27217,7 +27221,7 @@ const lM = D(() => /* @__PURE__ */ i(S, { sx: {
       justifyContent: "flex-start"
     }
   }, children: "Add a Query" });
-}), fM = D(() => {
+}), mM = D(() => {
   const t = Le();
   return /* @__PURE__ */ i(M, { variant: "subtle", leftIcon: /* @__PURE__ */ i(on, { size: 14 }), size: "sm", px: "xs", mb: 10, color: "blue", onClick: () => {
     const n = (/* @__PURE__ */ new Date()).getTime().toString(), r = {
@@ -27233,7 +27237,7 @@ const lM = D(() => /* @__PURE__ */ i(S, { sx: {
       justifyContent: "flex-start"
     }
   }, children: "Add a SQL Snippet" });
-}), mM = D(() => {
+}), gM = D(() => {
   const t = ne();
   return /* @__PURE__ */ i(M, { variant: "subtle", leftIcon: /* @__PURE__ */ i(on, { size: 14 }), size: "sm", px: "xs", mb: 10, color: "blue", onClick: t.views.addARandomNewView, sx: {
     width: "100%",
@@ -27243,23 +27247,23 @@ const lM = D(() => /* @__PURE__ */ i(S, { sx: {
       justifyContent: "flex-start"
     }
   }, children: "Add a View" });
-}), gM = D(({
+}), bM = D(({
   action_type: t,
   parentID: e
-}) => (ne(), t === "_Add_A_Filter_" ? /* @__PURE__ */ i(uM, {}) : t === "_Add_A_SQL_SNIPPET_" ? /* @__PURE__ */ i(fM, {}) : t === "_Add_A_QUERY_" ? /* @__PURE__ */ i(pM, {}) : t === "_Add_A_VIEW_" ? /* @__PURE__ */ i(mM, {}) : t === "_Add_A_PANEL_" ? /* @__PURE__ */ i(hM, { parentID: e }) : null)), jd = D(({
+}) => (ne(), t === "_Add_A_Filter_" ? /* @__PURE__ */ i(hM, {}) : t === "_Add_A_SQL_SNIPPET_" ? /* @__PURE__ */ i(mM, {}) : t === "_Add_A_QUERY_" ? /* @__PURE__ */ i(fM, {}) : t === "_Add_A_VIEW_" ? /* @__PURE__ */ i(gM, {}) : t === "_Add_A_PANEL_" ? /* @__PURE__ */ i(pM, { parentID: e }) : null)), jd = D(({
   option: t
 }) => {
   var d;
   const e = Le().editor, n = e.isOptionActive, r = n(e.path, t), o = e.isOptionOpened, a = e.navigate, s = o(t), [l, c] = U(s);
   return W(() => {
     c(s);
-  }, [s]), /* @__PURE__ */ i(ji, { active: r, defaultOpened: s, opened: l, onChange: c, label: t.label, onClick: () => a(t), icon: t.Icon ? /* @__PURE__ */ i(t.Icon, { size: 18 }) : null, children: (d = t.children) == null ? void 0 : d.map((p) => p._type === "ACTION" ? /* @__PURE__ */ i(gM, { action_type: p._action_type, parentID: p.parentID }, `_ADD_${p.value}_`) : /* @__PURE__ */ i(jd, { option: p }, p.value)) }, t.label);
-}), bM = D(() => {
+  }, [s]), /* @__PURE__ */ i(ji, { active: r, defaultOpened: s, opened: l, onChange: c, label: t.label, onClick: () => a(t), icon: t.Icon ? /* @__PURE__ */ i(t.Icon, { size: 18 }) : null, children: (d = t.children) == null ? void 0 : d.map((p) => p._type === "ACTION" ? /* @__PURE__ */ i(bM, { action_type: p._action_type, parentID: p.parentID }, `_ADD_${p.value}_`) : /* @__PURE__ */ i(jd, { option: p }, p.value)) }, t.label);
+}), yM = D(() => {
   const t = Le();
   return /* @__PURE__ */ i(V, { sx: {
     position: "relative"
   }, children: t.editor.navOptions.map((e) => /* @__PURE__ */ i(jd, { option: e }, e.value)) });
-}), yM = D(() => {
+}), xM = D(() => {
   const t = Le();
   return /* @__PURE__ */ h(Nt, { p: 0, width: {
     base: 200,
@@ -27279,12 +27283,12 @@ const lM = D(() => /* @__PURE__ */ i(S, { sx: {
     }, children: "Settings" }) }),
     /* @__PURE__ */ i(Nt.Section, { grow: !0, sx: {
       overflow: "auto"
-    }, children: /* @__PURE__ */ i(bM, {}) }),
+    }, children: /* @__PURE__ */ i(yM, {}) }),
     /* @__PURE__ */ i(Nt.Section, { children: /* @__PURE__ */ i(w, { grow: !0, p: "md", pt: "sm", sx: {
       borderTop: "1px solid #eee"
     }, children: /* @__PURE__ */ i(M, { size: "xs", color: "red", leftIcon: /* @__PURE__ */ i(xl, { size: 18 }), onClick: () => t.editor.close(), children: "Close" }) }) })
   ] });
-}), xM = {
+}), vM = {
   root: {
     height: "100vh",
     display: "flex",
@@ -27305,20 +27309,20 @@ const lM = D(() => /* @__PURE__ */ i(S, { sx: {
     paddingTop: 0,
     height: "100vh"
   }
-}, vM = D(() => {
+}, wM = D(() => {
   const t = Le().editor;
   return /* @__PURE__ */ i($e, { onClose: () => t.setSettingsOpen(!1), closeOnEscape: !1, closeOnClickOutside: !1, opened: t.settings_open, fullScreen: !0, title: null, transitionDuration: 0, withCloseButton: !1, withinPortal: !0, zIndex: 300, styles: {
     modal: {
       padding: "0 !important"
     }
-  }, children: /* @__PURE__ */ i(tl, { padding: 0, navbar: /* @__PURE__ */ i(yM, {}), styles: xM, children: /* @__PURE__ */ i(dM, {}) }) });
-}), wM = (t) => t.replace(/([^:])(\/\/+)/g, "$1/");
-function _M(t) {
+  }, children: /* @__PURE__ */ i(tl, { padding: 0, navbar: /* @__PURE__ */ i(xM, {}), styles: vM, children: /* @__PURE__ */ i(uM, {}) }) });
+}), _M = (t) => t.replace(/([^:])(\/\/+)/g, "$1/");
+function CM(t) {
   W(() => {
     if ($i.__getMonacoInstance())
       return;
     console.log("loading monaco for @devtable/dashboard");
-    const n = wM(t);
+    const n = _M(t);
     $i.config({
       paths: {
         vs: n
@@ -27327,7 +27331,7 @@ function _M(t) {
   }, []);
 }
 Mc();
-const CM = {
+const SM = {
   root: {
     height: "100vh",
     display: "flex",
@@ -27345,7 +27349,7 @@ const CM = {
     // main header & sub header
     height: "100vh"
   }
-}, SM = ({
+}, kM = ({
   context: t,
   dashboard: e,
   content: n,
@@ -27356,7 +27360,7 @@ const CM = {
   headerSlot: l,
   headerMenuItems: c
 }, d) => {
-  _M(a.monacoPath), Gl(a);
+  CM(a.monacoPath), Gl(a);
   const {
     data: p = []
   } = yn(Ho), {
@@ -27379,14 +27383,14 @@ const CM = {
     freezeLayout: m,
     inEditMode: !0
   }, children: /* @__PURE__ */ i(Ft.Provider, { value: k, children: /* @__PURE__ */ h(xi, { configure: I, children: [
-    /* @__PURE__ */ i(tl, { padding: 0, header: /* @__PURE__ */ i(WT, { saveDashboardChanges: x, headerSlot: l, headerMenuItems: c }), navbar: /* @__PURE__ */ i(gD, {}), styles: CM, children: /* @__PURE__ */ i(V, { className: `${o} dashboard-root`, sx: {
+    /* @__PURE__ */ i(tl, { padding: 0, header: /* @__PURE__ */ i(jT, { saveDashboardChanges: x, headerSlot: l, headerMenuItems: c }), navbar: /* @__PURE__ */ i(bD, {}), styles: SM, children: /* @__PURE__ */ i(V, { className: `${o} dashboard-root`, sx: {
       position: "relative"
-    }, children: v.content.views.visibleViews.map((L) => /* @__PURE__ */ i(MT, { view: L }, L.id)) }) }),
-    /* @__PURE__ */ i(vM, {})
+    }, children: v.content.views.visibleViews.map((L) => /* @__PURE__ */ i($T, { view: L }, L.id)) }) }),
+    /* @__PURE__ */ i(wM, {})
   ] }) }) }) }) }) });
-}, Qz = D(Ie(SM));
+}, Kz = D(Ie(kM));
 Mc();
-const Kz = D(({
+const Uz = D(({
   context: t,
   dashboard: e,
   content: n,
@@ -27418,7 +27422,7 @@ const Kz = D(({
     inEditMode: !1
   }, children: /* @__PURE__ */ i(V, { className: `${r} dashboard-root`, children: /* @__PURE__ */ i(Ft.Provider, { value: p, children: /* @__PURE__ */ i(xi, { configure: u, children: d.content.views.visibleViews.map((f) => /* @__PURE__ */ i(Ra, { view: f }, f.id)) }) }) }) }) }) }) }) });
 });
-var no = {}, kM = {
+var no = {}, TM = {
   get exports() {
     return no;
   },
@@ -27473,9 +27477,9 @@ var no = {}, kM = {
       };
     };
   });
-})(kM);
-const TM = no;
-var ro = {}, DM = {
+})(TM);
+const DM = no;
+var ro = {}, IM = {
   get exports() {
     return ro;
   },
@@ -27497,9 +27501,9 @@ var ro = {}, DM = {
       };
     };
   });
-})(DM);
-const IM = ro;
-var io = {}, MM = {
+})(IM);
+const MM = ro;
+var io = {}, $M = {
   get exports() {
     return io;
   },
@@ -27548,9 +27552,9 @@ var io = {}, MM = {
       };
     };
   });
-})(MM);
-const $M = io;
-var oo = {}, zM = {
+})($M);
+const zM = io;
+var oo = {}, LM = {
   get exports() {
     return oo;
   },
@@ -27573,9 +27577,9 @@ var oo = {}, zM = {
       };
     };
   });
-})(zM);
-const LM = oo;
-var ao = {}, AM = {
+})(LM);
+const AM = oo;
+var ao = {}, EM = {
   get exports() {
     return ao;
   },
@@ -27595,9 +27599,9 @@ var ao = {}, AM = {
       };
     };
   });
-})(AM);
-const EM = ao;
-var so = {}, RM = {
+})(EM);
+const RM = ao;
+var so = {}, OM = {
   get exports() {
     return so;
   },
@@ -27733,9 +27737,9 @@ var so = {}, RM = {
       };
     };
   });
-})(RM);
-const OM = so;
-var lo = {}, FM = {
+})(OM);
+const FM = so;
+var lo = {}, PM = {
   get exports() {
     return lo;
   },
@@ -27754,9 +27758,9 @@ var lo = {}, FM = {
       };
     };
   });
-})(FM);
-const PM = lo;
-var co = {}, VM = {
+})(PM);
+const VM = lo;
+var co = {}, NM = {
   get exports() {
     return co;
   },
@@ -27895,9 +27899,9 @@ var co = {}, VM = {
       };
     };
   });
-})(VM);
-const NM = co;
-var uo = {}, BM = {
+})(NM);
+const BM = co;
+var uo = {}, qM = {
   get exports() {
     return uo;
   },
@@ -27916,9 +27920,9 @@ var uo = {}, BM = {
       };
     };
   });
-})(BM);
-const qM = uo;
-var ho = {}, WM = {
+})(qM);
+const WM = uo;
+var ho = {}, jM = {
   get exports() {
     return ho;
   },
@@ -27936,9 +27940,9 @@ var ho = {}, WM = {
       };
     };
   });
-})(WM);
-const jM = ho;
-var po = {}, YM = {
+})(jM);
+const YM = ho;
+var po = {}, GM = {
   get exports() {
     return po;
   },
@@ -27956,9 +27960,9 @@ var po = {}, YM = {
       };
     };
   });
-})(YM);
-const GM = po;
-var fo = {}, HM = {
+})(GM);
+const HM = po;
+var fo = {}, QM = {
   get exports() {
     return fo;
   },
@@ -27992,9 +27996,9 @@ var fo = {}, HM = {
       };
     };
   });
-})(HM);
-const QM = fo;
-var mo = {}, KM = {
+})(QM);
+const KM = fo;
+var mo = {}, UM = {
   get exports() {
     return mo;
   },
@@ -28013,9 +28017,9 @@ var mo = {}, KM = {
       };
     };
   });
-})(KM);
-const UM = mo;
-var go = {}, XM = {
+})(UM);
+const XM = mo;
+var go = {}, JM = {
   get exports() {
     return go;
   },
@@ -28033,9 +28037,9 @@ var go = {}, XM = {
       };
     };
   });
-})(XM);
-const JM = go;
-var bo = {}, ZM = {
+})(JM);
+const ZM = go;
+var bo = {}, e$ = {
   get exports() {
     return bo;
   },
@@ -28053,9 +28057,9 @@ var bo = {}, ZM = {
       };
     };
   });
-})(ZM);
-const e$ = bo;
-var yo = {}, t$ = {
+})(e$);
+const t$ = bo;
+var yo = {}, n$ = {
   get exports() {
     return yo;
   },
@@ -28074,9 +28078,9 @@ var yo = {}, t$ = {
       };
     };
   });
-})(t$);
-const n$ = yo;
-var xo = {}, r$ = {
+})(n$);
+const r$ = yo;
+var xo = {}, i$ = {
   get exports() {
     return xo;
   },
@@ -28095,9 +28099,9 @@ var xo = {}, r$ = {
       };
     };
   });
-})(r$);
-const i$ = xo;
-var vo = {}, o$ = {
+})(i$);
+const o$ = xo;
+var vo = {}, a$ = {
   get exports() {
     return vo;
   },
@@ -28116,9 +28120,9 @@ var vo = {}, o$ = {
       };
     };
   });
-})(o$);
-const a$ = vo;
-var wo = {}, s$ = {
+})(a$);
+const s$ = vo;
+var wo = {}, l$ = {
   get exports() {
     return wo;
   },
@@ -28201,9 +28205,9 @@ var wo = {}, s$ = {
       };
     };
   });
-})(s$);
-const l$ = wo;
-var _o = {}, c$ = {
+})(l$);
+const c$ = wo;
+var _o = {}, d$ = {
   get exports() {
     return _o;
   },
@@ -28232,9 +28236,9 @@ var _o = {}, c$ = {
       };
     };
   });
-})(c$);
-const d$ = _o;
-var Co = {}, u$ = {
+})(d$);
+const u$ = _o;
+var Co = {}, h$ = {
   get exports() {
     return Co;
   },
@@ -28267,9 +28271,9 @@ var Co = {}, u$ = {
       };
     };
   });
-})(u$);
-const h$ = Co;
-var So = {}, p$ = {
+})(h$);
+const p$ = Co;
+var So = {}, f$ = {
   get exports() {
     return So;
   },
@@ -28318,9 +28322,9 @@ var So = {}, p$ = {
       };
     };
   });
-})(p$);
-const f$ = So;
-var ko = {}, m$ = {
+})(f$);
+const m$ = So;
+var ko = {}, g$ = {
   get exports() {
     return ko;
   },
@@ -28339,9 +28343,9 @@ var ko = {}, m$ = {
       });
     };
   });
-})(m$);
-const g$ = ko;
-var To = {}, b$ = {
+})(g$);
+const b$ = ko;
+var To = {}, y$ = {
   get exports() {
     return To;
   },
@@ -28376,9 +28380,9 @@ var To = {}, b$ = {
       });
     };
   });
-})(b$);
-const y$ = To;
-var Do = {}, x$ = {
+})(y$);
+const x$ = To;
+var Do = {}, v$ = {
   get exports() {
     return Do;
   },
@@ -28411,9 +28415,9 @@ var Do = {}, x$ = {
       };
     };
   });
-})(x$);
-const v$ = Do;
-var Io = {}, w$ = {
+})(v$);
+const w$ = Do;
+var Io = {}, _$ = {
   get exports() {
     return Io;
   },
@@ -28462,9 +28466,9 @@ var Io = {}, w$ = {
       };
     };
   });
-})(w$);
-const _$ = Io;
-var Mo = {}, C$ = {
+})(_$);
+const C$ = Io;
+var Mo = {}, S$ = {
   get exports() {
     return Mo;
   },
@@ -28533,9 +28537,9 @@ var Mo = {}, C$ = {
       };
     };
   });
-})(C$);
-const S$ = Mo;
-var $o = {}, k$ = {
+})(S$);
+const k$ = Mo;
+var $o = {}, T$ = {
   get exports() {
     return $o;
   },
@@ -28553,9 +28557,9 @@ var $o = {}, k$ = {
       };
     };
   });
-})(k$);
-const T$ = $o;
-var zo = {}, D$ = {
+})(T$);
+const D$ = $o;
+var zo = {}, I$ = {
   get exports() {
     return zo;
   },
@@ -28573,9 +28577,9 @@ var zo = {}, D$ = {
       };
     };
   });
-})(D$);
-const I$ = zo;
-var Lo = {}, M$ = {
+})(I$);
+const M$ = zo;
+var Lo = {}, $$ = {
   get exports() {
     return Lo;
   },
@@ -28597,9 +28601,9 @@ var Lo = {}, M$ = {
       };
     };
   });
-})(M$);
-const $$ = Lo;
-var Ao = {}, z$ = {
+})($$);
+const z$ = Lo;
+var Ao = {}, L$ = {
   get exports() {
     return Ao;
   },
@@ -28686,9 +28690,9 @@ var Ao = {}, z$ = {
       };
     };
   });
-})(z$);
-const L$ = Ao;
-var Eo = {}, A$ = {
+})(L$);
+const A$ = Ao;
+var Eo = {}, E$ = {
   get exports() {
     return Eo;
   },
@@ -28707,9 +28711,9 @@ var Eo = {}, A$ = {
       };
     };
   });
-})(A$);
-const E$ = Eo;
-var Ro = {}, R$ = {
+})(E$);
+const R$ = Eo;
+var Ro = {}, O$ = {
   get exports() {
     return Ro;
   },
@@ -28740,9 +28744,9 @@ var Ro = {}, R$ = {
       };
     };
   });
-})(R$);
-const O$ = Ro;
-var Oo = {}, F$ = {
+})(O$);
+const F$ = Ro;
+var Oo = {}, P$ = {
   get exports() {
     return Oo;
   },
@@ -28761,55 +28765,55 @@ var Oo = {}, F$ = {
       };
     };
   });
-})(F$);
-const P$ = Oo;
-ee.extend(TM);
-ee.extend(IM);
-ee.extend($M);
-ee.extend(LM);
-ee.extend(EM);
-ee.extend(OM);
-ee.extend(PM);
-ee.extend(NM);
-ee.extend(qM);
-ee.extend(jM);
-ee.extend(GM);
-ee.extend(JM);
-ee.extend(e$);
-ee.extend(n$);
-ee.extend(i$);
-ee.extend(a$);
-ee.extend(QM);
-ee.extend(UM);
-ee.extend(l$);
-ee.extend(d$);
-ee.extend(h$);
-ee.extend(f$);
-ee.extend(g$);
-ee.extend(y$);
-ee.extend(v$);
-ee.extend(_$);
-ee.extend(S$);
-ee.extend(T$);
-ee.extend(I$);
-ee.extend($$);
-ee.extend(L$);
-ee.extend(O$);
-ee.extend(P$);
-ee.extend(E$);
+})(P$);
+const V$ = Oo;
+ee.extend(DM);
+ee.extend(MM);
+ee.extend(zM);
+ee.extend(AM);
+ee.extend(RM);
+ee.extend(FM);
+ee.extend(VM);
+ee.extend(BM);
+ee.extend(WM);
+ee.extend(YM);
+ee.extend(HM);
+ee.extend(ZM);
+ee.extend(t$);
+ee.extend(r$);
+ee.extend(o$);
+ee.extend(s$);
+ee.extend(KM);
+ee.extend(XM);
+ee.extend(c$);
+ee.extend(u$);
+ee.extend(p$);
+ee.extend(m$);
+ee.extend(b$);
+ee.extend(x$);
+ee.extend(w$);
+ee.extend(C$);
+ee.extend(k$);
+ee.extend(D$);
+ee.extend(M$);
+ee.extend(z$);
+ee.extend(A$);
+ee.extend(F$);
+ee.extend(V$);
+ee.extend(R$);
 ee.tz.setDefault("UTC");
-const Uz = () => Promise.resolve().then(() => bf).then(({
+const Xz = () => Promise.resolve().then(() => bf).then(({
   version: t
 }) => (console.log(`[@devtable/dashboard] version: ${t}`), t));
 export {
   La as ContentModel,
   Kl as ContentModelContextProvider,
   Yp as ContextModel,
-  Qz as DashboardEditor,
+  Kz as DashboardEditor,
   gd as DashboardFilterType,
   Ik as DashboardMode,
   Bk as DashboardModel,
-  MT as DashboardViewEditor,
+  $T as DashboardViewEditor,
   Ra as DashboardViewRender,
   le as EViewComponentType,
   ps as FilterModel,
@@ -28823,22 +28827,22 @@ export {
   Dk as PanelsModel,
   qp as QueriesModel,
   Bp as QueryModel,
-  Kz as ReadOnlyDashboard,
+  Uz as ReadOnlyDashboard,
   Wp as SQLSnippetModel,
   jp as SQLSnippetsModel,
   Mk as ViewComponentTypeBackground,
-  Yz as ViewComponentTypeColor,
-  jz as ViewComponentTypeName,
+  Gz as ViewComponentTypeColor,
+  Yz as ViewComponentTypeName,
   Rk as ViewModel,
   Ok as ViewsModel,
-  Hz as applyPartialDashboard,
+  Qz as applyPartialDashboard,
   Pk as createContentModel,
   wd as createDashboardModel,
   vd as createDashboardViewsModel,
   Lp as getInitialFiltersPayload,
   Tk as getNewPanel,
-  Uz as getVersion,
-  Gz as initialDashboardContent,
+  Xz as getVersion,
+  Hz as initialDashboardContent,
   ne as useContentModelContext,
   Cf as useFullScreenPanelContext,
   Le as useModelContext,