@devtable/dashboard 11.3.0 → 11.4.0

package/dist/dashboard.es.js

@@ -1,8 +1,8 @@
 var th = Object.defineProperty;
 var nh = (e, t, n) => t in e ? th(e, t, { enumerable: !0, configurable: !0, writable: !0, value: n }) : e[t] = n;
 var N = (e, t, n) => (nh(e, typeof t != "symbol" ? t + "" : t, n), n);
-import M, { forwardRef as ue, useState as q, useEffect as O, useCallback as Be, useMemo as T, createElement as ts, useContext as Ht, useRef as ns, createContext as el, memo as rh } from "react";
-import { TextInput as D, Text as j, Box as z, Button as C, HoverCard as Te, Group as b, Select as L, Stack as w, Divider as I, NumberInput as U, Switch as Ve, Table as We, ActionIcon as W, MultiSelect as $n, Paper as sh, Code as Ja, Modal as fe, Tabs as f, LoadingOverlay as _n, Alert as rs, ColorSwatch as ti, Overlay as Rt, Checkbox as K, Collapse as xr, Center as Sn, useMantineTheme as tl, CheckIcon as ih, MANTINE_SIZES as ah, SimpleGrid as nn, Tooltip as ge, NativeSelect as nl, SegmentedControl as oh, Anchor as ni, Textarea as lh, Mark as ch, ColorInput as ji, createStyles as mr, Popover as On, Slider as dh, Flex as Ut, Badge as bn, CloseButton as rl, Menu as de, Affix as uh, Header as hh, List as it, FileInput as ph, ThemeIcon as Ps, UnstyledButton as xh, Navbar as Nt, JsonInput as sl, Pagination as il, Drawer as mh, Accordion as Ir, Radio as Za, Skeleton as eo, NavLink as ri, AppShell as al } from "@mantine/core";
+import M, { forwardRef as he, useState as q, useEffect as O, useCallback as Be, useMemo as T, createElement as ts, useContext as Ht, useRef as ns, createContext as el, memo as rh } from "react";
+import { TextInput as D, Text as j, Box as z, Button as C, HoverCard as Te, Group as b, Select as L, Stack as w, Divider as I, NumberInput as U, Switch as Ve, Table as We, ActionIcon as W, MultiSelect as $n, Paper as sh, Code as Ja, Modal as ge, Tabs as f, LoadingOverlay as _n, Alert as rs, ColorSwatch as ti, Overlay as Rt, Checkbox as K, Collapse as xr, Center as Sn, useMantineTheme as tl, CheckIcon as ih, MANTINE_SIZES as ah, SimpleGrid as nn, Tooltip as be, NativeSelect as nl, SegmentedControl as oh, Anchor as ni, Textarea as lh, Mark as ch, ColorInput as ji, createStyles as mr, Popover as On, Slider as dh, Flex as Ut, Badge as bn, CloseButton as rl, Menu as ue, Affix as uh, Header as hh, List as it, FileInput as ph, ThemeIcon as Ps, UnstyledButton as xh, Navbar as Nt, JsonInput as sl, Pagination as il, Drawer as mh, Accordion as Ir, Radio as Za, Skeleton as eo, NavLink as ri, AppShell as al } from "@mantine/core";
 import { useModals as Et, ModalsProvider as ol } from "@mantine/modals";
 import { useBoolean as $e, useCreation as kt, useAsyncEffect as fr, useRequest as yn, useWhyDidYouUpdate as ll, useLatest as to, usePrevious as fh } from "ahooks";
 import { toJS as Kt, observable as cl, runInAction as sr, reaction as ot, makeAutoObservable as gr } from "mobx";
@@ -13,7 +13,7 @@ import yh from "crypto-js";
 import * as jh from "d3-array";
 import { quantile as Er } from "d3-array";
 import E from "dayjs";
-import _, { cloneDeepWith as dl, unset as vh, get as te, isObject as ul, set as vi, omit as jn, isFunction as wh, orderBy as _h, last as hl, defaults as Ce, minBy as Sh, maxBy as Ch, cloneDeep as Ne, values as pl, template as wi, throttle as kh, isEqual as me, defaultsDeep as je, keyBy as Th, isEmpty as xl, isNumber as Dh, findLastIndex as Ih, isString as ml, range as zh, pick as fl } from "lodash";
+import _, { cloneDeepWith as dl, unset as vh, get as te, isObject as ul, set as vi, omit as jn, isFunction as wh, orderBy as _h, last as hl, defaults as Ce, minBy as Sh, maxBy as Ch, cloneDeep as Ne, values as pl, template as wi, throttle as kh, isEqual as fe, defaultsDeep as je, keyBy as Th, isEmpty as xl, isNumber as Dh, findLastIndex as Ih, isString as ml, range as zh, pick as fl } from "lodash";
 import * as Fr from "mathjs";
 import si from "numbro";
 import Bt from "axios";
@@ -28,7 +28,7 @@ import "echarts-gl";
 import { GridComponent as lt, VisualMapComponent as br, LegendComponent as ct, TooltipComponent as dt, DataZoomComponent as Ft, MarkLineComponent as is, MarkAreaComponent as _i, CalendarComponent as Rh } from "echarts/components";
 import { CanvasRenderer as Xe } from "echarts/renderers";
 import { useForm as ve, Controller as g, useFieldArray as we, useWatch as Eh } from "react-hook-form";
-import { DeviceFloppy as pe, Trash as ae, AlertCircle as Fh, Recycle as mt, InfoCircle as an, Plus as Ae, Refresh as Si, Download as Ci, ArrowsMaximize as bl, Settings as yl, Copy as Oh, ArrowLeft as $h, ArrowsMove as Ph, ChevronDownRight as Vh, ChevronsUpRight as Nh, PlaylistAdd as as, ArrowBarToRight as qh } from "tabler-icons-react";
+import { DeviceFloppy as xe, Trash as ae, AlertCircle as Fh, Recycle as mt, InfoCircle as an, Plus as Ae, Refresh as Si, Download as Ci, ArrowsMaximize as bl, Settings as yl, Copy as Oh, ArrowLeft as $h, ArrowsMove as Ph, ChevronDownRight as Vh, ChevronsUpRight as Nh, PlaylistAdd as as, ArrowBarToRight as qh } from "tabler-icons-react";
 import { BoxplotChart as Bh, CustomChart as Wh, BarChart as Wn, LineChart as Gn, ScatterChart as os, FunnelChart as Gh, HeatmapChart as ls, PieChart as Qh, RadarChart as Hh, SunburstChart as Uh } from "echarts/charts";
 import { IconDeviceFloppy as Yt, IconChevronUp as Kh, IconChevronDown as Yh, IconTextSize as ki, IconInfoCircle as Tn, IconPlayerSkipBack as jl, IconRecycle as cs, IconMathFunction as vl, IconPlus as ft, IconBorderAll as Xh, IconTrash as rn, IconArrowDown as Jh, IconArrowUp as Zh, IconCalendar as ep, IconMinus as tp, IconChevronsUp as np, IconChevronsDown as rp, IconCode as wn, IconCamera as ds, IconShare3 as sp, IconDownload as ip, IconArrowsLeftRight as ap, IconVariable as wl, IconCodeDots as op, IconFilter as _l, IconCopy as lp, IconDatabase as us, IconBoxMultiple as Sl, IconCaretDown as cp, IconAlertTriangle as Cl, IconArrowLeft as dp, IconPlaylistAdd as ro, IconPointFilled as Ti, IconFileImport as so, IconCircleDashed as up, IconCircleDot as hp, IconCircleOff as pp, IconAdjustments as xp, IconLink as mp, IconSettings as hs, IconArrowCurveRight as ii, IconLine as fp, IconX as kl, IconEye as Tl, IconTable as gp, IconColumns as bp, IconVectorTriangle as yp, IconAlertCircle as io, IconVariablePlus as jp, IconHierarchy as vp, IconDiscountCheckFilled as wp } from "@tabler/icons-react";
 import { showNotification as Pn, notifications as _p } from "@mantine/notifications";
@@ -160,16 +160,16 @@ function Nx() {
       {
         var H = F.ReactDebugCurrentFrame, re = H.getStackAddendum();
         re !== "" && (R += "%s", P = P.concat([re]));
-        var xe = P.map(function(ee) {
+        var me = P.map(function(ee) {
           return String(ee);
         });
-        xe.unshift("Warning: " + R), Function.prototype.apply.call(console[v], console, xe);
+        me.unshift("Warning: " + R), Function.prototype.apply.call(console[v], console, me);
       }
     }
-    var ce = !1, ne = !1, Se = !1, De = !1, Re = !1, cn;
+    var de = !1, ne = !1, Se = !1, De = !1, Re = !1, cn;
     cn = Symbol.for("react.module.reference");
     function wt(v) {
-      return !!(typeof v == "string" || typeof v == "function" || v === s || v === a || Re || v === i || v === d || v === u || De || v === x || ce || ne || Se || typeof v == "object" && v !== null && (v.$$typeof === p || v.$$typeof === h || v.$$typeof === o || v.$$typeof === l || v.$$typeof === c || // This needs to include all possible module reference object
+      return !!(typeof v == "string" || typeof v == "function" || v === s || v === a || Re || v === i || v === d || v === u || De || v === x || de || ne || Se || typeof v == "object" && v !== null && (v.$$typeof === p || v.$$typeof === h || v.$$typeof === o || v.$$typeof === l || v.$$typeof === c || // This needs to include all possible module reference object
       // types supported by any Flight configuration anywhere since
       // we don't know which Flight build this will end up being used
       // with.
@@ -220,9 +220,9 @@ function Nx() {
             var H = v.displayName || null;
             return H !== null ? H : $t(v.type) || "Memo";
           case p: {
-            var re = v, xe = re._payload, ee = re._init;
+            var re = v, me = re._payload, ee = re._init;
             try {
-              return $t(ee(xe));
+              return $t(ee(me));
             } catch {
               return null;
             }
@@ -323,8 +323,8 @@ function Nx() {
       As = !0;
       var re = Error.prepareStackTrace;
       Error.prepareStackTrace = void 0;
-      var xe;
-      xe = Ms.current, Ms.current = null, zu();
+      var me;
+      me = Ms.current, Ms.current = null, zu();
       try {
         if (R) {
           var ee = function() {
@@ -377,7 +377,7 @@ function Nx() {
             }
         }
       } finally {
-        As = !1, Ms.current = xe, Mu(), Error.prepareStackTrace = re;
+        As = !1, Ms.current = me, Mu(), Error.prepareStackTrace = re;
       }
       var Mn = v ? v.displayName || v.name : "", Xa = Mn ? Sr(Mn) : "";
       return typeof v == "function" && Cr.set(v, Xa), Xa;
@@ -409,9 +409,9 @@ function Nx() {
           case h:
             return kr(v.type, R, P);
           case p: {
-            var H = v, re = H._payload, xe = H._init;
+            var H = v, re = H._payload, me = H._init;
             try {
-              return kr(xe(re), R, P);
+              return kr(me(re), R, P);
             } catch {
             }
           }
@@ -428,9 +428,9 @@ function Nx() {
     }
     function Eu(v, R, P, H, re) {
       {
-        var xe = Function.call.bind(Tr);
+        var me = Function.call.bind(Tr);
         for (var ee in v)
-          if (xe(v, ee)) {
+          if (me(v, ee)) {
             var J = void 0;
             try {
               if (typeof v[ee] != "function") {
@@ -520,7 +520,7 @@ function Nx() {
         });
       }
     }
-    var Gu = function(v, R, P, H, re, xe, ee) {
+    var Gu = function(v, R, P, H, re, me, ee) {
       var J = {
         // This tag allows us to uniquely identify this as a React Element
         $$typeof: t,
@@ -530,7 +530,7 @@ function Nx() {
         ref: P,
         props: ee,
         // Record the component responsible for creating this element.
-        _owner: xe
+        _owner: me
       };
       return J._store = {}, Object.defineProperty(J._store, "validated", {
         configurable: !1,
@@ -551,14 +551,14 @@ function Nx() {
     };
     function Qu(v, R, P, H, re) {
       {
-        var xe, ee = {}, J = null, He = null;
+        var me, ee = {}, J = null, He = null;
         P !== void 0 && (qa(P), J = "" + P), Nu(R) && (qa(R.key), J = "" + R.key), Vu(R) && (He = R.ref, qu(R, re));
-        for (xe in R)
-          Tr.call(R, xe) && !Pu.hasOwnProperty(xe) && (ee[xe] = R[xe]);
+        for (me in R)
+          Tr.call(R, me) && !Pu.hasOwnProperty(me) && (ee[me] = R[me]);
         if (v && v.defaultProps) {
           var ke = v.defaultProps;
-          for (xe in ke)
-            ee[xe] === void 0 && (ee[xe] = ke[xe]);
+          for (me in ke)
+            ee[me] === void 0 && (ee[me] = ke[me]);
         }
         if (J || He) {
           var Ie = typeof v == "function" ? v.displayName || v.name || "Unknown" : v;
@@ -643,7 +643,7 @@ Check the top-level render call using <` + P + ">.");
         else if (v) {
           var re = A(v);
           if (typeof re == "function" && re !== v.entries)
-            for (var xe = re.call(v), ee; !(ee = xe.next()).done; )
+            for (var me = re.call(v), ee; !(ee = me.next()).done; )
               $s(ee.value) && Ua(ee.value, R);
         }
       }
@@ -685,7 +685,7 @@ Check the top-level render call using <` + P + ">.");
         v.ref !== null && (zn(v), V("Invalid attribute `ref` supplied to `React.Fragment`."), zn(null));
       }
     }
-    function Ya(v, R, P, H, re, xe) {
+    function Ya(v, R, P, H, re, me) {
       {
         var ee = wt(v);
         if (!ee) {
@@ -696,7 +696,7 @@ Check the top-level render call using <` + P + ">.");
           var ke;
           v === null ? ke = "null" : Rs(v) ? ke = "array" : v !== void 0 && v.$$typeof === t ? (ke = "<" + ($t(v.type) || "Unknown") + " />", J = " Did you accidentally export a JSX literal instead of a component?") : ke = typeof v, V("React.jsx: type is invalid -- expected a string (for built-in components) or a class/function (for composite components) but got: %s.%s", ke, J);
         }
-        var Ie = Qu(v, R, P, re, xe);
+        var Ie = Qu(v, R, P, re, me);
         if (Ie == null)
           return Ie;
         if (ee) {
@@ -976,7 +976,7 @@ const Ln = new Yx();
 function Yl(e) {
   Ln.baseURL !== e.apiBaseURL && (Ln.baseURL = e.apiBaseURL), e.app_id && (Ln.app_id = e.app_id), e.app_secret && (Ln.app_secret = e.app_secret), e.makeQueryENV && (Ln.makeQueryENV = e.makeQueryENV);
 }
-const Jx = new Xx(Ln), qt = Jx, dr = ue(function({
+const Jx = new Xx(Ln), qt = Jx, dr = he(function({
   value: t,
   onChange: n,
   ...s
@@ -1101,7 +1101,7 @@ function Z(e, {
     return String(e);
   try {
     let s = si(e).value();
-    if (s === void 0)
+    if (s === void 0 || Number.isNaN(s))
       throw new Error(`[formatNumber]Not a number: ${e}`);
     return t && (s = Math.abs(s)), si(s).format(n);
   } catch (s) {
@@ -1719,7 +1719,7 @@ class Ri {
     }), this.instanceRegistry.clear(), this.factoryRegistry.clear();
   }
 }
-const rc = "11.3.0", Rm = /* @__PURE__ */ Object.freeze(/* @__PURE__ */ Object.defineProperty({
+const rc = "11.4.0", Rm = /* @__PURE__ */ Object.freeze(/* @__PURE__ */ Object.defineProperty({
   __proto__: null,
   version: rc
 }, Symbol.toStringTag, { value: "Module" }));
@@ -1917,7 +1917,7 @@ function $m({
     min: S,
     max: A
   } = T(() => {
-    const V = Sh(h, (ce) => ce[y.columnKey]), Y = Ch(h, (ce) => ce[y.columnKey]);
+    const V = Sh(h, (de) => de[y.columnKey]), Y = Ch(h, (de) => de[y.columnKey]);
     return {
       min: te(V, y.columnKey),
       max: te(Y, y.columnKey)
@@ -1967,7 +1967,7 @@ function ac() {
     throw new Error("Please use DashboardModelContextProvider");
   return e;
 }
-const oe = () => ac(), Pm = () => ac(), oc = M.createContext({
+const le = () => ac(), Pm = () => ac(), oc = M.createContext({
   searchButtonProps: {}
 }), lc = oc.Provider;
 function Vm() {
@@ -1980,7 +1980,7 @@ function uc() {
     throw new Error("Please use ContentModelContextProvider");
   return e;
 }
-const le = () => uc(), Pe = () => uc(), Nm = {
+const ce = () => uc(), Pe = () => uc(), Nm = {
   inEditMode: !1
 }, Fi = M.createContext(Nm), hc = M.createContext({
   panel: null,
@@ -2006,7 +2006,7 @@ function Bm() {
     throw new Error("Please use FullScreenPanelContext.Provider");
   return e;
 }
-const G = k(ue(({
+const G = k(he(({
   label: e,
   required: t,
   value: n,
@@ -2098,7 +2098,7 @@ function Wm({
     /* @__PURE__ */ r.jsx(b, { position: "center", mt: "xl", grow: !0, sx: {
       width: "60%"
     }, mx: "auto", children: /* @__PURE__ */ r.jsxs(C, { color: "blue", type: "submit", children: [
-      /* @__PURE__ */ r.jsx(pe, { size: 20 }),
+      /* @__PURE__ */ r.jsx(xe, { size: 20 }),
       /* @__PURE__ */ r.jsx(j, { ml: "md", children: "Save" })
     ] }) })
   ] }) }) : null;
@@ -2211,7 +2211,7 @@ const Ym = [{
 }, {
   label: "Break Word",
   value: "breakAll"
-}], Qr = ue(({
+}], Qr = he(({
   sectionTitle: e,
   value: t,
   onChange: n
@@ -2237,7 +2237,7 @@ const Ym = [{
       )
     ] })
   ] });
-}), zt = ue(({
+}), zt = he(({
   value: e,
   onChange: t
 }, n) => {
@@ -2499,7 +2499,7 @@ const af = {
   configRender: rf,
   run: sf
 }, of = k((e) => {
-  const t = le(), {
+  const t = ce(), {
     value: n,
     set: s
   } = Q(e.operation.operationData, "config");
@@ -2550,7 +2550,7 @@ const cf = {
 }, hf = {
   dictionary: {}
 }, pf = k((e) => {
-  const t = le(), {
+  const t = ce(), {
     value: n = hf,
     set: s
   } = Q(e.operation.operationData, "config"), {
@@ -2613,7 +2613,7 @@ const mf = {
 }, ff = {
   filter_keys: []
 }, gf = k((e) => {
-  const t = le(), {
+  const t = ce(), {
     value: n = ff,
     set: s
   } = Q(e.operation.operationData, "config"), {
@@ -2946,7 +2946,7 @@ const Sf = k(({
     await c.configOperation(a, l);
   }, [a, c]), _f(c) ? /* @__PURE__ */ r.jsxs(r.Fragment, { children: [
     /* @__PURE__ */ r.jsx(Sf, { model: c, onClick: n }),
-    /* @__PURE__ */ r.jsx(fe, { size: 600, opened: t, onClose: s, title: "Operation Settings", zIndex: 320, children: /* @__PURE__ */ r.jsxs(w, { children: [
+    /* @__PURE__ */ r.jsx(ge, { size: 600, opened: t, onClose: s, title: "Operation Settings", zIndex: 320, children: /* @__PURE__ */ r.jsxs(w, { children: [
       /* @__PURE__ */ r.jsx(kf, { model: c }),
       /* @__PURE__ */ r.jsxs(f, { defaultValue: "settings", children: [
         /* @__PURE__ */ r.jsxs(f.List, { children: [
@@ -3025,7 +3025,7 @@ const Mf = k(({
     setFalse: s
   }] = $e(!1), i = e.model;
   return /* @__PURE__ */ r.jsxs(r.Fragment, { children: [
-    /* @__PURE__ */ r.jsx(fe, { opened: t, onClose: s, title: "Setup Trigger", zIndex: 320, children: /* @__PURE__ */ r.jsxs(w, { children: [
+    /* @__PURE__ */ r.jsx(ge, { opened: t, onClose: s, title: "Setup Trigger", zIndex: 320, children: /* @__PURE__ */ r.jsxs(w, { children: [
       /* @__PURE__ */ r.jsx(Lf, { model: i }),
       /* @__PURE__ */ r.jsx(Af, { model: i }),
       /* @__PURE__ */ r.jsx(gc, { title: "Payload", variables: i.triggerSchema.payload })
@@ -3181,7 +3181,7 @@ const Gf = /* @__PURE__ */ Object.freeze(/* @__PURE__ */ Object.defineProperty({
   __proto__: null,
   getTooltip: Wf,
   tooltip: jc
-}, Symbol.toStringTag, { value: "Module" })), be = {
+}, Symbol.toStringTag, { value: "Module" })), oe = {
   ...Nf,
   ...Bf,
   ...Gf
@@ -3609,7 +3609,7 @@ const lg = (e) => (t) => {
 function cg({
   config: e
 }) {
-  return be.getTooltip({
+  return oe.getTooltip({
     trigger: "item",
     formatter: lg(e)
   });
@@ -3633,7 +3633,7 @@ function dg({
     tooltip: cg({
       config: e
     }),
-    xAxis: [be.getXAxis({
+    xAxis: [oe.getXAxis({
       type: "category",
       name: s.name,
       nameGap: 25,
@@ -3647,7 +3647,7 @@ function dg({
         formatter: Hn(s.axisLabel.formatter)
       }
     })],
-    yAxis: [be.getYAxis({
+    yAxis: [oe.getYAxis({
       name: i.name,
       minInterval: 1,
       axisLabel: {
@@ -3829,7 +3829,7 @@ const mg = ({
       readOnly: e
     } })
   ] });
-}, bs = ue(({
+}, bs = he(({
   value: e,
   onChange: t
 }, n) => {
@@ -3869,7 +3869,7 @@ const mg = ({
     /* @__PURE__ */ r.jsx(C, { variant: "filled", mt: 24, onClick: i, sx: {
       flexGrow: 0
     }, children: "Customize Label" }),
-    /* @__PURE__ */ r.jsx(fe, { size: 800, title: "Customize label content", opened: s, onClose: a, closeOnClickOutside: !1, withCloseButton: !1, zIndex: 320, children: s && /* @__PURE__ */ r.jsxs(w, { children: [
+    /* @__PURE__ */ r.jsx(ge, { size: 800, title: "Customize label content", opened: s, onClose: a, closeOnClickOutside: !1, withCloseButton: !1, zIndex: 320, children: s && /* @__PURE__ */ r.jsxs(w, { children: [
       /* @__PURE__ */ r.jsx(K, { mt: 10, label: "Enabled", checked: o.enabled, onChange: (x) => c(x.currentTarget.checked) }),
       /* @__PURE__ */ r.jsx(mg, { value: o.func_content, onChange: h, disabled: !o.enabled }),
       /* @__PURE__ */ r.jsxs(b, { position: "apart", children: [
@@ -4172,14 +4172,14 @@ function kg({
   O(() => {
     d(i);
   }, [i]), l(["x_axis", "y_axis", "reference_lines", "color"]);
-  const u = c(), h = T(() => !me(u, t), [u, t]);
+  const u = c(), h = T(() => !fe(u, t), [u, t]);
   return /* @__PURE__ */ r.jsx(w, { spacing: "xs", children: /* @__PURE__ */ r.jsxs("form", { onSubmit: o(n), children: [
     /* @__PURE__ */ r.jsxs(b, { position: "left", py: "md", pl: "md", sx: {
       borderBottom: "1px solid #eee",
       background: "#efefef"
     }, children: [
       /* @__PURE__ */ r.jsx(j, { children: "Chart Config" }),
-      /* @__PURE__ */ r.jsx(W, { type: "submit", mr: 5, variant: "filled", color: "blue", disabled: !h, children: /* @__PURE__ */ r.jsx(pe, { size: 20 }) })
+      /* @__PURE__ */ r.jsx(W, { type: "submit", mr: 5, variant: "filled", color: "blue", disabled: !h, children: /* @__PURE__ */ r.jsx(xe, { size: 20 }) })
     ] }),
     /* @__PURE__ */ r.jsxs(f, { defaultValue: "X Axis", orientation: "vertical", styles: {
       tab: {
@@ -4574,7 +4574,7 @@ function Ug({
     set: n
   } = Q(e.instanceData, "config"), s = T(() => je({}, t, Ni), [t]), i = s;
   O(() => {
-    !me(s, i) && (console.log("config malformed, resetting to defaults", s, i), n(i));
+    !fe(s, i) && (console.log("config malformed, resetting to defaults", s, i), n(i));
   }, [s, i]);
   const {
     control: a,
@@ -4588,14 +4588,14 @@ function Ug({
   O(() => {
     d(i);
   }, [i]);
-  const u = c(), h = T(() => !me(u, s), [u, s]);
+  const u = c(), h = T(() => !fe(u, s), [u, s]);
   return l(["content", "variant", "color", "size", "compact", "horizontal_align", "vertical_align"]), /* @__PURE__ */ r.jsxs("form", { onSubmit: o(n), children: [
     /* @__PURE__ */ r.jsxs(b, { position: "left", py: "md", pl: "md", sx: {
       borderBottom: "1px solid #eee",
       background: "#efefef"
     }, children: [
       /* @__PURE__ */ r.jsx(j, { children: "Chart Config" }),
-      /* @__PURE__ */ r.jsx(W, { type: "submit", mr: 5, variant: "filled", color: "blue", disabled: !h, children: /* @__PURE__ */ r.jsx(pe, { size: 20 }) })
+      /* @__PURE__ */ r.jsx(W, { type: "submit", mr: 5, variant: "filled", color: "blue", disabled: !h, children: /* @__PURE__ */ r.jsx(xe, { size: 20 }) })
     ] }),
     /* @__PURE__ */ r.jsxs(w, { children: [
       /* @__PURE__ */ r.jsx(g, { control: a, name: "content", render: ({
@@ -5100,13 +5100,13 @@ function pb({
       y_axis_data_key: n,
       valueTypedXAxis: V
     }), Y;
-  const ce = hb({
+  const de = hb({
     group_by_key: o,
     data: S,
     x_axis_data_key: e,
     y_axis_data_key: n
   });
-  return Object.entries(ce).map(([ne, Se]) => {
+  return Object.entries(de).map(([ne, Se]) => {
     const De = Ne(Y);
     return De.name = ne, De.color = void 0, De.data = Se, De;
   });
@@ -5130,7 +5130,7 @@ function fb(e, t, n) {
     yAxisIndex: a,
     name: o
   }) => (i[o] = a, i), {});
-  return be.getTooltip({
+  return oe.getTooltip({
     trigger: "axis",
     formatter: function(i) {
       const a = Array.isArray(i) ? i : [i];
@@ -5197,7 +5197,7 @@ function bb(e, t) {
     overflow: n,
     ...s
   } = e.x_axis.axisLabel, i = bt(n.on_axis), a = t.length === 0;
-  return [be.getXAxis({
+  return [oe.getXAxis({
     data: t,
     name: e.x_axis_name ?? "",
     nameGap: a ? 5 : void 0,
@@ -5244,7 +5244,7 @@ function vb(e, t, n) {
     ...c
   }, d) => {
     let u = c.position;
-    return u || (u = d > 0 ? "right" : "left"), be.getYAxis({
+    return u || (u = d > 0 ? "right" : "left"), oe.getYAxis({
       ...c,
       minInterval: s[d] ?? 0,
       show: l,
@@ -5382,7 +5382,7 @@ function Cb({
     }, children: Object.values(x.bottom).map((A, F) => /* @__PURE__ */ r.jsx(M.Fragment, { children: A }, F)) })
   ] });
 }
-const Qi = ue(({
+const Qi = he(({
   value: e,
   onChange: t
 }, n) => {
@@ -5407,7 +5407,7 @@ const Qi = ue(({
       /* @__PURE__ */ r.jsx(z, { sx: {
         flexGrow: 1
       }, children: /* @__PURE__ */ r.jsx(Ve, { label: "Slider for X Axis", checked: e.x_axis_slider, onChange: (i) => s("x_axis_slider")(i.currentTarget.checked) }) }),
-      /* @__PURE__ */ r.jsx(ge, { label: "Not available for now, will overlap y-axis's label", children: /* @__PURE__ */ r.jsx(z, { sx: {
+      /* @__PURE__ */ r.jsx(be, { label: "Not available for now, will overlap y-axis's label", children: /* @__PURE__ */ r.jsx(z, { sx: {
         flexGrow: 1
       }, children: /* @__PURE__ */ r.jsx(Ve, { label: "Slider for Y Axis", disabled: !e.y_axis_slider, checked: e.y_axis_slider, onChange: (i) => s("y_axis_slider")(i.currentTarget.checked) }) }) })
     ] })
@@ -6418,7 +6418,7 @@ class st {
 st.none = [];
 class $b extends Error {
 }
-class he {
+class pe {
   /**
   Create a slice. When specifying a non-zero open depth, you must
   make sure that there are nodes of at least that depth at the
@@ -6445,13 +6445,13 @@ class he {
   */
   insertAt(t, n) {
     let s = Tc(this.content, t + this.openStart, n);
-    return s && new he(s, this.openStart, this.openEnd);
+    return s && new pe(s, this.openStart, this.openEnd);
   }
   /**
   @internal
   */
   removeBetween(t, n) {
-    return new he(kc(this.content, t + this.openStart, n + this.openStart), this.openStart, this.openEnd);
+    return new pe(kc(this.content, t + this.openStart, n + this.openStart), this.openStart, this.openEnd);
   }
   /**
   Tests whether this slice is equal to another slice.
@@ -6479,11 +6479,11 @@ class he {
   */
   static fromJSON(t, n) {
     if (!n)
-      return he.empty;
+      return pe.empty;
     let s = n.openStart || 0, i = n.openEnd || 0;
     if (typeof s != "number" || typeof i != "number")
       throw new RangeError("Invalid input for Slice.fromJSON");
-    return new he(se.fromJSON(t, n.content), s, i);
+    return new pe(se.fromJSON(t, n.content), s, i);
   }
   /**
   Create a slice from a fragment by taking the maximum possible
@@ -6495,10 +6495,10 @@ class he {
       s++;
     for (let a = t.lastChild; a && !a.isLeaf && (n || !a.type.spec.isolating); a = a.lastChild)
       i++;
-    return new he(t, s, i);
+    return new pe(t, s, i);
   }
 }
-he.empty = new he(se.empty, 0, 0);
+pe.empty = new pe(se.empty, 0, 0);
 function kc(e, t, n) {
   let { index: s, offset: i } = e.findIndex(t), a = e.maybeChild(s), { index: o, offset: l } = e.findIndex(n);
   if (i == t || a.isText) {
@@ -6549,7 +6549,7 @@ class Hr {
   */
   parseSlice(t, n = {}) {
     let s = new bo(this, n, !0);
-    return s.addAll(t, n.from, n.to), he.maxOpen(s.finish());
+    return s.addAll(t, n.from, n.to), pe.maxOpen(s.finish());
   }
   /**
   @internal
@@ -7278,7 +7278,7 @@ class pn extends rt {
     super(), this.from = t, this.to = n, this.mark = s;
   }
   apply(t) {
-    let n = t.slice(this.from, this.to), s = t.resolve(this.from), i = s.node(s.sharedDepth(this.to)), a = new he(Ki(n.content, (o, l) => !o.isAtom || !l.type.allowsMarkType(this.mark.type) ? o : o.mark(this.mark.addToSet(o.marks)), i), n.openStart, n.openEnd);
+    let n = t.slice(this.from, this.to), s = t.resolve(this.from), i = s.node(s.sharedDepth(this.to)), a = new pe(Ki(n.content, (o, l) => !o.isAtom || !l.type.allowsMarkType(this.mark.type) ? o : o.mark(this.mark.addToSet(o.marks)), i), n.openStart, n.openEnd);
     return Fe.fromReplace(t, this.from, this.to, a);
   }
   invert() {
@@ -7317,7 +7317,7 @@ class xn extends rt {
     super(), this.from = t, this.to = n, this.mark = s;
   }
   apply(t) {
-    let n = t.slice(this.from, this.to), s = new he(Ki(n.content, (i) => i.mark(this.mark.removeFromSet(i.marks)), t), n.openStart, n.openEnd);
+    let n = t.slice(this.from, this.to), s = new pe(Ki(n.content, (i) => i.mark(this.mark.removeFromSet(i.marks)), t), n.openStart, n.openEnd);
     return Fe.fromReplace(t, this.from, this.to, s);
   }
   invert() {
@@ -7360,7 +7360,7 @@ class mn extends rt {
     if (!n)
       return Fe.fail("No node at mark step's position");
     let s = n.type.create(n.attrs, null, this.mark.addToSet(n.marks));
-    return Fe.fromReplace(t, this.pos, this.pos + 1, new he(se.from(s), 0, n.isLeaf ? 0 : 1));
+    return Fe.fromReplace(t, this.pos, this.pos + 1, new pe(se.from(s), 0, n.isLeaf ? 0 : 1));
   }
   invert(t) {
     let n = t.nodeAt(this.pos);
@@ -7404,7 +7404,7 @@ class hr extends rt {
     if (!n)
       return Fe.fail("No node at mark step's position");
     let s = n.type.create(n.attrs, null, this.mark.removeFromSet(n.marks));
-    return Fe.fromReplace(t, this.pos, this.pos + 1, new he(se.from(s), 0, n.isLeaf ? 0 : 1));
+    return Fe.fromReplace(t, this.pos, this.pos + 1, new pe(se.from(s), 0, n.isLeaf ? 0 : 1));
   }
   invert(t) {
     let n = t.nodeAt(this.pos);
@@ -7457,10 +7457,10 @@ class Mt extends rt {
     if (!(t instanceof Mt) || t.structure || this.structure)
       return null;
     if (this.from + this.slice.size == t.from && !this.slice.openEnd && !t.slice.openStart) {
-      let n = this.slice.size + t.slice.size == 0 ? he.empty : new he(this.slice.content.append(t.slice.content), this.slice.openStart, t.slice.openEnd);
+      let n = this.slice.size + t.slice.size == 0 ? pe.empty : new pe(this.slice.content.append(t.slice.content), this.slice.openStart, t.slice.openEnd);
       return new Mt(this.from, this.to + (t.to - t.from), n, this.structure);
     } else if (t.to == this.from && !this.slice.openStart && !t.slice.openEnd) {
-      let n = this.slice.size + t.slice.size == 0 ? he.empty : new he(t.slice.content.append(this.slice.content), t.slice.openStart, this.slice.openEnd);
+      let n = this.slice.size + t.slice.size == 0 ? pe.empty : new pe(t.slice.content.append(this.slice.content), t.slice.openStart, this.slice.openEnd);
       return new Mt(t.from, this.to, n, this.structure);
     } else
       return null;
@@ -7475,7 +7475,7 @@ class Mt extends rt {
   static fromJSON(t, n) {
     if (typeof n.from != "number" || typeof n.to != "number")
       throw new RangeError("Invalid input for ReplaceStep.fromJSON");
-    return new Mt(n.from, n.to, he.fromJSON(t, n.slice), !!n.structure);
+    return new Mt(n.from, n.to, pe.fromJSON(t, n.slice), !!n.structure);
   }
 }
 rt.jsonID("replace", Mt);
@@ -7533,7 +7533,7 @@ class gn extends rt {
   static fromJSON(t, n) {
     if (typeof n.from != "number" || typeof n.to != "number" || typeof n.gapFrom != "number" || typeof n.gapTo != "number" || typeof n.insert != "number")
       throw new RangeError("Invalid input for ReplaceAroundStep.fromJSON");
-    return new gn(n.from, n.to, n.gapFrom, n.gapTo, he.fromJSON(t, n.slice), n.insert, !!n.structure);
+    return new gn(n.from, n.to, n.gapFrom, n.gapTo, pe.fromJSON(t, n.slice), n.insert, !!n.structure);
   }
 }
 rt.jsonID("replaceAround", gn);
@@ -7605,7 +7605,7 @@ class ar extends rt {
       s[a] = n.attrs[a];
     s[this.attr] = this.value;
     let i = n.type.create(s, null, n.marks);
-    return Fe.fromReplace(t, this.pos, this.pos + 1, new he(se.from(i), 0, n.isLeaf ? 0 : 1));
+    return Fe.fromReplace(t, this.pos, this.pos + 1, new pe(se.from(i), 0, n.isLeaf ? 0 : 1));
   }
   getMap() {
     return ht.empty;
@@ -7702,14 +7702,14 @@ class ye {
   Replace the selection with a slice or, if no slice is given,
   delete the selection. Will append to the given transaction.
   */
-  replace(t, n = he.empty) {
+  replace(t, n = pe.empty) {
     let s = n.content.lastChild, i = null;
     for (let l = 0; l < n.openEnd; l++)
       i = s, s = s.lastChild;
     let a = t.steps.length, o = this.ranges;
     for (let l = 0; l < o.length; l++) {
       let { $from: c, $to: d } = o[l], u = t.mapping.slice(a);
-      t.replaceRange(u.map(c.pos), u.map(d.pos), l ? he.empty : n), l == 0 && So(t, a, (s ? s.isInline : i && i.isTextblock) ? -1 : 1);
+      t.replaceRange(u.map(c.pos), u.map(d.pos), l ? pe.empty : n), l == 0 && So(t, a, (s ? s.isInline : i && i.isTextblock) ? -1 : 1);
     }
   }
   /**
@@ -7835,8 +7835,8 @@ class Oe extends ye {
     let i = t.resolve(n.map(this.anchor));
     return new Oe(i.parent.inlineContent ? i : s, s);
   }
-  replace(t, n = he.empty) {
-    if (super.replace(t, n), n == he.empty) {
+  replace(t, n = pe.empty) {
+    if (super.replace(t, n), n == pe.empty) {
       let s = this.$from.marksAcross(this.$to);
       s && t.ensureMarks(s);
     }
@@ -7911,7 +7911,7 @@ class at extends ye {
     return s ? ye.near(a) : new at(a);
   }
   content() {
-    return new he(se.from(this.node), 0, 0);
+    return new pe(se.from(this.node), 0, 0);
   }
   eq(t) {
     return t instanceof at && t.anchor == this.anchor;
@@ -7966,8 +7966,8 @@ class Gt extends ye {
   constructor(t) {
     super(t.resolve(0), t.resolve(t.content.size));
   }
-  replace(t, n = he.empty) {
-    if (n == he.empty) {
+  replace(t, n = pe.empty) {
+    if (n == pe.empty) {
       t.delete(0, t.doc.content.size);
       let s = ye.atStart(t.doc);
       s.eq(t.selection) || t.setSelection(s);
@@ -8666,8 +8666,8 @@ function Ky(e, t, n = {}) {
       if (!S.isText && !S.marks.length)
         return;
       const F = Math.max(x, A), V = Math.min(y, A + S.nodeSize), Y = V - F;
-      o += Y, l.push(...S.marks.map((ce) => ({
-        mark: ce,
+      o += Y, l.push(...S.marks.map((de) => ({
+        mark: de,
         from: F,
         to: V
       })));
@@ -8804,10 +8804,10 @@ const rj = ({ keepMarks: e = !0 } = {}) => ({ tr: t, state: n, dispatch: s, edit
       const F = l.index(-1) ? 1 : l.index(-2) ? 2 : 3;
       for (let De = l.depth - F; De >= l.depth - 3; De -= 1)
         A = se.from(l.node(De).copy(A));
-      const V = l.indexAfter(-1) < l.node(-2).childCount ? 1 : l.indexAfter(-2) < l.node(-3).childCount ? 2 : 3, Y = Nr(h, l.node().type.name, l.node().attrs), ce = ((a = o.contentMatch.defaultType) === null || a === void 0 ? void 0 : a.createAndFill(Y)) || void 0;
-      A = A.append(se.from(o.createAndFill(null, ce) || void 0));
+      const V = l.indexAfter(-1) < l.node(-2).childCount ? 1 : l.indexAfter(-2) < l.node(-3).childCount ? 2 : 3, Y = Nr(h, l.node().type.name, l.node().attrs), de = ((a = o.contentMatch.defaultType) === null || a === void 0 ? void 0 : a.createAndFill(Y)) || void 0;
+      A = A.append(se.from(o.createAndFill(null, de) || void 0));
       const ne = l.before(l.depth - (F - 1));
-      t.replace(ne, l.after(-V), new he(A, 4 - F, 0));
+      t.replace(ne, l.after(-V), new pe(A, 4 - F, 0));
       let Se = -1;
       t.doc.nodesBetween(ne, t.doc.content.size, (De, Re) => {
         if (Se > -1)
@@ -8829,8 +8829,8 @@ const rj = ({ keepMarks: e = !0 } = {}) => ({ tr: t, state: n, dispatch: s, edit
     const { selection: A, storedMarks: F } = n, { splittableMarks: V } = i.extensionManager, Y = F || A.$to.parentOffset && A.$from.marks();
     if (t.split(l.pos, 2, S).scrollIntoView(), !Y || !s)
       return !0;
-    const ce = Y.filter((ne) => V.includes(ne.type.name));
-    t.ensureMarks(ce);
+    const de = Y.filter((ne) => V.includes(ne.type.name));
+    t.ensureMarks(de);
   }
   return !0;
 }, Ks = (e, t) => {
@@ -8852,7 +8852,7 @@ const rj = ({ keepMarks: e = !0 } = {}) => ({ tr: t, state: n, dispatch: s, edit
   const i = e.doc.nodeAt(s);
   return n.node.type === (i == null ? void 0 : i.type) && Ec(e.doc, s) && e.join(s), !0;
 }, ij = (e, t, n, s = {}) => ({ editor: i, tr: a, state: o, dispatch: l, chain: c, commands: d, can: u }) => {
-  const { extensions: h, splittableMarks: p } = i.extensionManager, x = Qe(e, o.schema), y = Qe(t, o.schema), { selection: S, storedMarks: A } = o, { $from: F, $to: V } = S, Y = F.blockRange(V), ce = A || S.$to.parentOffset && S.$from.marks();
+  const { extensions: h, splittableMarks: p } = i.extensionManager, x = Qe(e, o.schema), y = Qe(t, o.schema), { selection: S, storedMarks: A } = o, { $from: F, $to: V } = S, Y = F.blockRange(V), de = A || S.$to.parentOffset && S.$from.marks();
   if (!Y)
     return !1;
   const ne = Zi((Se) => Do(Se.type.name, h))(S);
@@ -8862,8 +8862,8 @@ const rj = ({ keepMarks: e = !0 } = {}) => ({ tr: t, state: n, dispatch: s, edit
     if (Do(ne.node.type.name, h) && x.validContent(ne.node.content) && l)
       return c().command(() => (a.setNodeMarkup(ne.pos, x), !0)).command(() => Ks(a, x)).command(() => Ys(a, x)).run();
   }
-  return !n || !ce || !l ? c().command(() => u().wrapInList(x, s) ? !0 : d.clearNodes()).wrapInList(x, s).command(() => Ks(a, x)).command(() => Ys(a, x)).run() : c().command(() => {
-    const Se = u().wrapInList(x, s), De = ce.filter((Re) => p.includes(Re.type.name));
+  return !n || !de || !l ? c().command(() => u().wrapInList(x, s) ? !0 : d.clearNodes()).wrapInList(x, s).command(() => Ks(a, x)).command(() => Ys(a, x)).run() : c().command(() => {
+    const Se = u().wrapInList(x, s), De = de.filter((Re) => p.includes(Re.type.name));
     return a.ensureMarks(De), Se ? !0 : d.clearNodes();
   }).wrapInList(x, s).command(() => Ks(a, x)).command(() => Ys(a, x)).run();
 }, aj = (e, t = {}, n = {}) => ({ state: s, commands: i }) => {
@@ -9222,7 +9222,7 @@ function jj() {
     close: n
   }] = Cn(!1);
   return /* @__PURE__ */ r.jsxs(r.Fragment, { children: [
-    /* @__PURE__ */ r.jsx(fe, { opened: e, onClose: n, title: "About FunctionUtils", zIndex: 330, withinPortal: !0, children: /* @__PURE__ */ r.jsx(vs, { value: Wx, styles: {
+    /* @__PURE__ */ r.jsx(ge, { opened: e, onClose: n, title: "About FunctionUtils", zIndex: 330, withinPortal: !0, children: /* @__PURE__ */ r.jsx(vs, { value: Wx, styles: {
       root: {
         border: "none"
       },
@@ -9256,7 +9256,7 @@ const vj = ({
       enabled: !1
     }
   } }) });
-}, Vn = ue(({
+}, Vn = he(({
   value: e,
   onChange: t,
   label: n,
@@ -9290,7 +9290,7 @@ const vj = ({
     /* @__PURE__ */ r.jsx(j, { size: 14, children: n }),
     /* @__PURE__ */ r.jsx(vj, { value: a, onChange: o })
   ] });
-}), Gc = ue(({
+}), Gc = he(({
   title: e,
   value: t,
   onChange: n,
@@ -9305,7 +9305,7 @@ const vj = ({
     close: h
   }] = Cn(!1);
   return /* @__PURE__ */ r.jsxs(r.Fragment, { children: [
-    /* @__PURE__ */ r.jsxs(fe, { opened: d, onClose: h, title: e, withinPortal: !0, zIndex: 320, size: "900px", children: [
+    /* @__PURE__ */ r.jsxs(ge, { opened: d, onClose: h, title: e, withinPortal: !0, zIndex: 320, size: "900px", children: [
       i,
       /* @__PURE__ */ r.jsx(z, { h: 600, children: /* @__PURE__ */ r.jsx(Vn, { value: t, onChange: n, defaultValue: l, label: s }) })
     ] }),
@@ -9510,7 +9510,7 @@ const kj = ({
     }, children: /* @__PURE__ */ r.jsx(C, { variant: "filled", mt: 24, onClick: s, sx: {
       flexGrow: 0
     }, children: "Setup" }) }),
-    /* @__PURE__ */ r.jsx(fe, { size: 800, title: "Setup dynamic size", opened: n, onClose: i, closeOnClickOutside: !1, withCloseButton: !1, zIndex: 320, children: n && /* @__PURE__ */ r.jsxs(w, { children: [
+    /* @__PURE__ */ r.jsx(ge, { size: 800, title: "Setup dynamic size", opened: n, onClose: i, closeOnClickOutside: !1, withCloseButton: !1, zIndex: 320, children: n && /* @__PURE__ */ r.jsxs(w, { children: [
       /* @__PURE__ */ r.jsx(I, { mt: 10, mb: -10, label: "Dynamic by a custom function", labelPosition: "center", variant: "dashed" }),
       /* @__PURE__ */ r.jsx(kj, { value: a.func_content, onChange: d }),
       /* @__PURE__ */ r.jsxs(b, { position: "apart", children: [
@@ -9544,7 +9544,7 @@ const kj = ({
 }, {
   label: "Dynamic",
   value: "dynamic"
-}], Qc = ue(({
+}], Qc = he(({
   label: e = "Size",
   value: t,
   onChange: n
@@ -10086,14 +10086,14 @@ function Qj({
   O(() => {
     d(i);
   }, [i]);
-  const u = c(), h = T(() => !me(u, i), [u, i]);
+  const u = c(), h = T(() => !fe(u, i), [u, i]);
   return l(["dataZoom"]), /* @__PURE__ */ r.jsx(w, { spacing: "xs", children: /* @__PURE__ */ r.jsxs("form", { onSubmit: o(n), children: [
     /* @__PURE__ */ r.jsxs(b, { position: "left", py: "md", pl: "md", sx: {
       borderBottom: "1px solid #eee",
       background: "#efefef"
     }, children: [
       /* @__PURE__ */ r.jsx(j, { children: "Chart Config" }),
-      /* @__PURE__ */ r.jsx(W, { type: "submit", mr: 5, variant: "filled", color: "blue", disabled: !h, children: /* @__PURE__ */ r.jsx(pe, { size: 20 }) })
+      /* @__PURE__ */ r.jsx(W, { type: "submit", mr: 5, variant: "filled", color: "blue", disabled: !h, children: /* @__PURE__ */ r.jsx(xe, { size: 20 }) })
     ] }),
     /* @__PURE__ */ r.jsxs(f, { defaultValue: "Series", orientation: "vertical", styles: {
       tab: {
@@ -10653,7 +10653,7 @@ function gv(e, t) {
   };
 }
 function bv(e, t) {
-  return be.getTooltip({
+  return oe.getTooltip({
     trigger: "item",
     formatter: gv(e, t)
   });
@@ -10766,7 +10766,7 @@ const _v = [{
 }, {
   label: "InsideBottomRight",
   value: "insideBottomRight"
-}], na = ue(({
+}], na = he(({
   label: e,
   value: t,
   onChange: n,
@@ -10855,7 +10855,7 @@ const _v = [{
           width: "100%"
         }, children: [
           /* @__PURE__ */ r.jsx(j, { children: "Min Value" }),
-          /* @__PURE__ */ r.jsx(ge, { label: "Check to enable specific min value", children: /* @__PURE__ */ r.jsx(z, { children: /* @__PURE__ */ r.jsx(g, { name: `series.${n}.min.enable_value`, control: t, render: ({
+          /* @__PURE__ */ r.jsx(be, { label: "Check to enable specific min value", children: /* @__PURE__ */ r.jsx(z, { children: /* @__PURE__ */ r.jsx(g, { name: `series.${n}.min.enable_value`, control: t, render: ({
             field: c
           }) => /* @__PURE__ */ r.jsx(K, { size: "xs", checked: c.value, onChange: (d) => c.onChange(d.currentTarget.checked) }) }) }) })
         ] }), ...l })
@@ -10875,7 +10875,7 @@ const _v = [{
           width: "100%"
         }, children: [
           /* @__PURE__ */ r.jsx(j, { children: "Max Value" }),
-          /* @__PURE__ */ r.jsx(ge, { label: "Check to enable specific max value", children: /* @__PURE__ */ r.jsx(z, { children: /* @__PURE__ */ r.jsx(g, { name: `series.${n}.max.enable_value`, control: t, render: ({
+          /* @__PURE__ */ r.jsx(be, { label: "Check to enable specific max value", children: /* @__PURE__ */ r.jsx(z, { children: /* @__PURE__ */ r.jsx(g, { name: `series.${n}.max.enable_value`, control: t, render: ({
             field: c
           }) => /* @__PURE__ */ r.jsx(K, { size: "xs", checked: c.value, onChange: (d) => c.onChange(d.currentTarget.checked) }) }) }) })
         ] }), ...l })
@@ -10960,7 +10960,7 @@ const _v = [{
   }, children: [
     /* @__PURE__ */ r.jsxs(f.List, { children: [
       o.map((u, h) => /* @__PURE__ */ r.jsx(f.Tab, { value: u.id, children: u.name }, u.id)),
-      /* @__PURE__ */ r.jsx(f.Tab, { value: "add", disabled: !0, children: /* @__PURE__ */ r.jsx(ge, { label: "TODO", children: /* @__PURE__ */ r.jsx(Sn, { children: /* @__PURE__ */ r.jsx(ft, { size: 18, color: "#228be6" }) }) }) })
+      /* @__PURE__ */ r.jsx(f.Tab, { value: "add", disabled: !0, children: /* @__PURE__ */ r.jsx(be, { label: "TODO", children: /* @__PURE__ */ r.jsx(Sn, { children: /* @__PURE__ */ r.jsx(ft, { size: 18, color: "#228be6" }) }) }) })
     ] }),
     o.map((u, h) => /* @__PURE__ */ r.jsx(f.Panel, { value: u.id, children: /* @__PURE__ */ r.jsx(Dv, { item: u, control: e, index: h, remove: i }) }, u.id))
   ] });
@@ -10990,7 +10990,7 @@ function zv({
       background: "#efefef"
     }, children: [
       /* @__PURE__ */ r.jsx(j, { children: "Funnel Config" }),
-      /* @__PURE__ */ r.jsx(W, { type: "submit", mr: 5, variant: "filled", color: "blue", disabled: !u, children: /* @__PURE__ */ r.jsx(pe, { size: 20 }) })
+      /* @__PURE__ */ r.jsx(W, { type: "submit", mr: 5, variant: "filled", color: "blue", disabled: !u, children: /* @__PURE__ */ r.jsx(xe, { size: 20 }) })
     ] }),
     /* @__PURE__ */ r.jsx(Iv, { control: i, watch: o })
   ] }) });
@@ -11123,11 +11123,15 @@ function Fv(e) {
 function Ov(e) {
   let t = 0;
   return e.x_axis.name && (t += 20), {
+    show: !0,
     top: 45,
     left: 5,
     right: 5,
     bottom: t,
-    containLabel: !0
+    containLabel: !0,
+    borderColor: "none",
+    backgroundColor: "#E7E7E9",
+    z: 1
   };
 }
 function $v(e, t, n) {
@@ -11148,7 +11152,8 @@ function $v(e, t, n) {
     label: s.label,
     labelLayout: {
       hideOverlap: !0
-    }
+    },
+    z: 2
   };
 }
 const Pv = (e) => Z(e, {
@@ -11209,7 +11214,7 @@ function Nv(e, t, n, s) {
   } = e, l = $(i.data_key), c = $(a.data_key);
   $(o.data_key);
   const d = _.keyBy(t[l.queryID], (u) => `${u[l.columnKey]}---${u[c.columnKey]}`);
-  return be.getTooltip({
+  return oe.getTooltip({
     formatter: function(u) {
       const p = Vv({
         conf: e,
@@ -11298,7 +11303,7 @@ const qv = ({
     }, children: /* @__PURE__ */ r.jsx(C, { variant: "filled", mt: 24, onClick: s, sx: {
       flexGrow: 0
     }, children: "Setup" }) }),
-    /* @__PURE__ */ r.jsx(fe, { size: 800, title: "Setup dynamic value", opened: n, onClose: i, closeOnClickOutside: !1, withCloseButton: !1, zIndex: 320, children: n && /* @__PURE__ */ r.jsxs(w, { children: [
+    /* @__PURE__ */ r.jsx(ge, { size: 800, title: "Setup dynamic value", opened: n, onClose: i, closeOnClickOutside: !1, withCloseButton: !1, zIndex: 320, children: n && /* @__PURE__ */ r.jsxs(w, { children: [
       /* @__PURE__ */ r.jsx(I, { mt: 10, mb: -10, label: "Dynamic by a custom function", labelPosition: "center", variant: "dashed" }),
       /* @__PURE__ */ r.jsx(qv, { value: a.value, onChange: d }),
       /* @__PURE__ */ r.jsxs(b, { position: "apart", children: [
@@ -11332,7 +11337,7 @@ const qv = ({
 }, {
   label: "Dynamic",
   value: "dynamic"
-}], Nn = ue(({
+}], Nn = he(({
   label: e = "Value",
   value: t,
   onChange: n
@@ -11385,12 +11390,12 @@ function Hv(e, t) {
     itemWidth: 15
   };
 }
-function Uv(e, t, n) {
+function Uv(e, t, n, s) {
   const {
-    overflow: s,
-    rotate: i
-  } = e.x_axis.axisLabel, a = bt(s.on_axis);
-  return {
+    overflow: i,
+    rotate: a
+  } = e.x_axis.axisLabel, o = bt(i.on_axis);
+  return oe.getXAxis({
     id: "main-x-axis",
     type: "category",
     data: t,
@@ -11401,12 +11406,23 @@ function Uv(e, t, n) {
       alignWithLabel: !0
     },
     axisLabel: {
-      rotate: i,
-      ...a,
+      rotate: a,
+      ...o,
       formatter: n
     },
     splitArea: {
-      show: !0
+      show: !1,
+      areaStyle: {
+        color: "#E7E7E9"
+      }
+    },
+    splitLine: {
+      show: s > 0,
+      interval: 0,
+      lineStyle: {
+        type: "solid",
+        color: "white"
+      }
     },
     nameLocation: "center",
     nameGap: 25,
@@ -11414,46 +11430,59 @@ function Uv(e, t, n) {
       fontWeight: "bold",
       align: "center"
     },
-    z: 2
-  };
+    z: 3
+  });
 }
-function Kv(e, t, n) {
+function Kv(e, t, n, s) {
   const {
-    nameAlignment: s,
-    data_key: i,
-    ...a
+    nameAlignment: i,
+    data_key: a,
+    ...o
   } = e.y_axis, {
-    overflow: o,
-    rotate: l
-  } = e.y_axis.axisLabel, c = bt(o.on_axis);
-  return {
-    ...a,
+    overflow: l,
+    rotate: c
+  } = e.y_axis.axisLabel, d = bt(l.on_axis);
+  return oe.getYAxis({
+    ...o,
     type: "category",
     data: t,
     axisLabel: {
-      rotate: l,
-      ...c,
+      rotate: c,
+      ...d,
       formatter: n
     },
-    axisLine: {
-      show: !0,
-      color: "blue"
-    },
     axisTick: {
       show: !0,
       alignWithLabel: !0
     },
+    axisLine: {
+      show: !0,
+      lineStyle: {
+        width: 3
+      }
+    },
     splitArea: {
-      show: !0
+      show: !1,
+      areaStyle: {
+        color: "#E7E7E9"
+      }
+    },
+    splitLine: {
+      show: s > 0,
+      interval: 0,
+      lineStyle: {
+        type: "solid",
+        color: "white"
+      }
     },
     nameTextStyle: {
       fontWeight: "bold",
-      align: s
+      align: i
     },
     nameLocation: "end",
     nameGap: 15,
-    z: 2
-  };
+    z: 3
+  });
 }
 function Yv(e, t, n, s) {
   return n < e * 10 || s < t * 10 ? 0 : n < e * 20 || s < t * 20 ? 1 : 2;
@@ -11466,8 +11495,8 @@ function Xv(e, t, n, s, i) {
     return A[F.name] = gt(F, V), A;
   }, {}), o = Ev(e), l = Fv(e), c = $(e.x_axis.data_key), d = $(e.y_axis.data_key), u = $(e.heat_block.data_key), h = _.uniq(t[c.queryID].map((A) => A[c.columnKey])), p = _.uniq(t[c.queryID].map((A) => A[d.columnKey])), x = t[c.queryID].map((A) => [_.get(A, c.columnKey), _.get(A, d.columnKey), _.get(A, u.columnKey)]), y = Yv(h.length, p.length, s, i);
   return {
-    xAxis: Uv(e, h, o.x_axis),
-    yAxis: Kv(e, p, o.y_axis),
+    xAxis: Uv(e, h, o.x_axis, y),
+    yAxis: Kv(e, p, o.y_axis, y),
     series: $v(e, x, y),
     tooltip: Nv(e, t, o, l),
     grid: Ov(e),
@@ -11748,7 +11777,7 @@ const aw = ({
   enabled: !1,
   func_content: ["function label(value, index) {", "    // your code goes here", "    // return value", "}"].join(`
 `)
-}, Kc = ue(({
+}, Kc = he(({
   value: e,
   onChange: t
 }, n) => {
@@ -11788,7 +11817,7 @@ const aw = ({
     /* @__PURE__ */ r.jsx(C, { variant: "filled", mt: 24, onClick: i, sx: {
       flexGrow: 0
     }, children: "Customize Label" }),
-    /* @__PURE__ */ r.jsx(fe, { size: 800, title: "Customize label content", opened: s, onClose: a, closeOnClickOutside: !1, withCloseButton: !1, zIndex: 320, children: s && /* @__PURE__ */ r.jsxs(w, { children: [
+    /* @__PURE__ */ r.jsx(ge, { size: 800, title: "Customize label content", opened: s, onClose: a, closeOnClickOutside: !1, withCloseButton: !1, zIndex: 320, children: s && /* @__PURE__ */ r.jsxs(w, { children: [
       /* @__PURE__ */ r.jsx(K, { mt: 10, label: "Enabled", checked: o.enabled, onChange: (x) => c(x.currentTarget.checked) }),
       /* @__PURE__ */ r.jsx(aw, { value: o.func_content, onChange: h, disabled: !o.enabled }),
       /* @__PURE__ */ r.jsxs(b, { position: "apart", children: [
@@ -11913,7 +11942,7 @@ function uw({
     set: n
   } = Q(e.instanceData, "config"), s = T(() => je({}, t, ra), [t]), i = T(() => _.cloneDeep(s), [s]);
   O(() => {
-    !me(s, i) && (console.log("config malformed, resetting to defaults", s, i), n(i));
+    !fe(s, i) && (console.log("config malformed, resetting to defaults", s, i), n(i));
   }, [s, i]);
   const {
     control: a,
@@ -11927,7 +11956,7 @@ function uw({
   O(() => {
     d(i);
   }, [i]);
-  const u = c(), h = T(() => !me(u, s), [u, s]);
+  const u = c(), h = T(() => !fe(u, s), [u, s]);
   return /* @__PURE__ */ r.jsx("form", { onSubmit: o(n), style: {
     flexGrow: 1
   }, children: /* @__PURE__ */ r.jsxs(w, { spacing: "xs", sx: {
@@ -11938,7 +11967,7 @@ function uw({
       background: "#efefef"
     }, children: [
       /* @__PURE__ */ r.jsx(j, { children: "Chart Config" }),
-      /* @__PURE__ */ r.jsx(W, { type: "submit", mr: 5, variant: "filled", color: "blue", disabled: !h, children: /* @__PURE__ */ r.jsx(pe, { size: 20 }) })
+      /* @__PURE__ */ r.jsx(W, { type: "submit", mr: 5, variant: "filled", color: "blue", disabled: !h, children: /* @__PURE__ */ r.jsx(xe, { size: 20 }) })
     ] }),
     /* @__PURE__ */ r.jsxs(f, { defaultValue: "X Axis", orientation: "vertical", styles: {
       root: {
@@ -12315,7 +12344,7 @@ const Sw = (e, t) => (n) => {
   `;
 };
 function Cw(e, t) {
-  return be.getTooltip({
+  return oe.getTooltip({
     trigger: "axis",
     formatter: Sw(e, t)
   });
@@ -12325,7 +12354,7 @@ function kw(e) {
     name: t,
     axisLabel: n
   } = e.x_axis, s = bt(n.overflow.on_axis);
-  return [be.getXAxis({
+  return [oe.getXAxis({
     type: "category",
     name: t,
     nameLocation: "middle",
@@ -12341,7 +12370,7 @@ function kw(e) {
   })];
 }
 function Tw(e, t) {
-  return [be.getYAxis({
+  return [oe.getYAxis({
     name: e.bar.name,
     nameGap: 20,
     minInterval: 1,
@@ -12356,7 +12385,7 @@ function Tw(e, t) {
     splitLine: {
       show: !1
     }
-  }), be.getYAxis({
+  }), oe.getYAxis({
     name: e.line.name,
     nameGap: 20,
     nameTextStyle: {
@@ -12617,14 +12646,14 @@ function Pw({
   O(() => {
     c(s);
   }, [s]), o(["x_axis", "data_key", "bar", "line", "dataZoom"]);
-  const d = l(), u = T(() => !me(d, t), [d, t]);
+  const d = l(), u = T(() => !fe(d, t), [d, t]);
   return /* @__PURE__ */ r.jsxs("form", { onSubmit: a(n), children: [
     /* @__PURE__ */ r.jsxs(b, { position: "left", py: "md", pl: "md", sx: {
       borderBottom: "1px solid #eee",
       background: "#efefef"
     }, children: [
       /* @__PURE__ */ r.jsx(j, { children: "Chart Config" }),
-      /* @__PURE__ */ r.jsx(W, { type: "submit", mr: 5, variant: "filled", color: "blue", disabled: !u, children: /* @__PURE__ */ r.jsx(pe, { size: 20 }) })
+      /* @__PURE__ */ r.jsx(W, { type: "submit", mr: 5, variant: "filled", color: "blue", disabled: !u, children: /* @__PURE__ */ r.jsx(xe, { size: 20 }) })
     ] }),
     /* @__PURE__ */ r.jsxs(f, { defaultValue: "X Axis", orientation: "vertical", styles: {
       tab: {
@@ -12892,7 +12921,7 @@ function Yw(e, t, n) {
 }
 function Xw(e, t, n) {
   return {
-    tooltip: be.getTooltip({}),
+    tooltip: oe.getTooltip({}),
     series: Yw(e, t, n)
   };
 }
@@ -13004,7 +13033,7 @@ function n0({
       background: "#efefef"
     }, children: [
       /* @__PURE__ */ r.jsx(j, { children: "Pie Chart Config" }),
-      /* @__PURE__ */ r.jsx(W, { type: "submit", mr: 5, variant: "filled", color: "blue", disabled: !h, children: /* @__PURE__ */ r.jsx(pe, { size: 20 }) })
+      /* @__PURE__ */ r.jsx(W, { type: "submit", mr: 5, variant: "filled", color: "blue", disabled: !h, children: /* @__PURE__ */ r.jsx(xe, { size: 20 }) })
     ] }),
     /* @__PURE__ */ r.jsxs(w, { mt: "md", spacing: "xs", p: "md", mb: "sm", sx: {
       border: "1px solid #eee",
@@ -13305,7 +13334,7 @@ function f0(e, t) {
         show: !1
       }
     },
-    tooltip: be.getTooltip({
+    tooltip: oe.getTooltip({
       backgroundColor: "rgba(255,255,255,0.6)",
       formatter: p0(e)
     }),
@@ -13565,14 +13594,14 @@ function _0({
   O(() => {
     c(s);
   }, [s]), o(["series_name_key", "background", "label"]);
-  const u = l(), h = T(() => !me(u, s), [u, s]);
+  const u = l(), h = T(() => !fe(u, s), [u, s]);
   return /* @__PURE__ */ r.jsx("form", { onSubmit: a(n), children: /* @__PURE__ */ r.jsxs(w, { spacing: "xs", children: [
     /* @__PURE__ */ r.jsxs(b, { position: "left", py: "md", pl: "md", sx: {
       borderBottom: "1px solid #eee",
       background: "#efefef"
     }, children: [
       /* @__PURE__ */ r.jsx(j, { children: "Radar Config" }),
-      /* @__PURE__ */ r.jsx(W, { type: "submit", mr: 5, variant: "filled", color: "blue", disabled: !h || !d.isValid, children: /* @__PURE__ */ r.jsx(pe, { size: 20 }) })
+      /* @__PURE__ */ r.jsx(W, { type: "submit", mr: 5, variant: "filled", color: "blue", disabled: !h || !d.isValid, children: /* @__PURE__ */ r.jsx(xe, { size: 20 }) })
     ] }),
     /* @__PURE__ */ r.jsxs(f, { defaultValue: "series", children: [
       /* @__PURE__ */ r.jsxs(f.List, { children: [
@@ -13852,7 +13881,7 @@ function F0(e) {
   }));
 }
 function O0(e) {
-  return be.getTooltip({
+  return oe.getTooltip({
     trigger: "axis",
     formatter: (t) => {
       const n = F0(t);
@@ -13907,7 +13936,7 @@ function $0(e) {
     formatter: s,
     ...i
   } = e.x_axis.axisLabel, a = bt(t.on_axis);
-  return be.getXAxis({
+  return oe.getXAxis({
     type: "value",
     name: e.x_axis.name ?? "",
     nameLocation: "middle",
@@ -13948,7 +13977,7 @@ const P0 = {
 function V0(e, t) {
   const n = E0(e, t), s = L0(e, n), i = {
     xAxis: $0(e),
-    yAxis: be.getYAxis({
+    yAxis: oe.getYAxis({
       name: e.y_axis.name ?? "",
       nameLocation: "end",
       nameTextStyle: {
@@ -14326,7 +14355,7 @@ const Z0 = ({
       readOnly: e
     } })
   ] });
-}, id = ue(({
+}, id = he(({
   value: e,
   onChange: t,
   triggerButtonText: n = "Customize Label"
@@ -14367,7 +14396,7 @@ const Z0 = ({
     /* @__PURE__ */ r.jsx(C, { variant: "filled", mt: 24, onClick: a, sx: {
       flexGrow: 0
     }, children: n }),
-    /* @__PURE__ */ r.jsx(fe, { size: 800, title: "Customize label content", opened: i, onClose: o, closeOnClickOutside: !1, withCloseButton: !1, zIndex: 320, children: i && /* @__PURE__ */ r.jsxs(w, { children: [
+    /* @__PURE__ */ r.jsx(ge, { size: 800, title: "Customize label content", opened: i, onClose: o, closeOnClickOutside: !1, withCloseButton: !1, zIndex: 320, children: i && /* @__PURE__ */ r.jsxs(w, { children: [
       /* @__PURE__ */ r.jsx(K, { mt: 10, label: "Enabled", checked: l.enabled, onChange: (y) => d(y.currentTarget.checked) }),
       /* @__PURE__ */ r.jsx(Z0, { value: l.func_content, onChange: p, disabled: !l.enabled }),
       /* @__PURE__ */ r.jsxs(b, { position: "apart", children: [
@@ -14461,14 +14490,14 @@ function n_({
   O(() => {
     c(s);
   }, [s]), o(["x_axis", "y_axis", "regression"]);
-  const d = l(), u = T(() => !me(d, t), [d, t]);
+  const d = l(), u = T(() => !fe(d, t), [d, t]);
   return /* @__PURE__ */ r.jsx(w, { spacing: "xs", children: /* @__PURE__ */ r.jsxs("form", { onSubmit: a(n), children: [
     /* @__PURE__ */ r.jsxs(b, { position: "left", py: "md", pl: "md", sx: {
       borderBottom: "1px solid #eee",
       background: "#efefef"
     }, children: [
       /* @__PURE__ */ r.jsx(j, { children: "Chart Config" }),
-      /* @__PURE__ */ r.jsx(W, { type: "submit", mr: 5, variant: "filled", color: "blue", disabled: !u, children: /* @__PURE__ */ r.jsx(pe, { size: 20 }) })
+      /* @__PURE__ */ r.jsx(W, { type: "submit", mr: 5, variant: "filled", color: "blue", disabled: !u, children: /* @__PURE__ */ r.jsx(xe, { size: 20 }) })
     ] }),
     /* @__PURE__ */ r.jsxs(f, { defaultValue: "X轴", orientation: "vertical", styles: {
       panel: {
@@ -14647,7 +14676,7 @@ function h_() {
     withHeaderRow: !0
   }), "aria-label": "Insert table", title: "Insert table", children: /* @__PURE__ */ r.jsx(Xh, { stroke: 1.5, size: 16 }) });
 }
-const oa = ue(({
+const oa = he(({
   value: e,
   onChange: t,
   styles: n = {},
@@ -14767,7 +14796,7 @@ function p_({
       display: "none"
     }, children: [
       /* @__PURE__ */ r.jsx(j, { children: "Content" }),
-      /* @__PURE__ */ r.jsx(W, { ref: c, type: "submit", mr: 5, variant: "filled", color: "blue", children: /* @__PURE__ */ r.jsx(pe, { size: 20 }) })
+      /* @__PURE__ */ r.jsx(W, { ref: c, type: "submit", mr: 5, variant: "filled", color: "blue", children: /* @__PURE__ */ r.jsx(xe, { size: 20 }) })
     ] }),
     /* @__PURE__ */ r.jsx(g, { name: "content", control: i, render: ({
       field: u
@@ -15146,7 +15175,7 @@ function I_(e, t) {
     scatter: n,
     tooltip: s
   } = e;
-  return be.getTooltip({
+  return oe.getTooltip({
     trigger: s.trigger,
     formatter: function(i) {
       const a = t[0] ?? t.default, o = Array.isArray(i) ? i : [i];
@@ -15194,7 +15223,7 @@ function z_(e, t) {
     overflow: s,
     ...i
   } = e.x_axis.axisLabel, a = bt(s.on_axis), o = t.length === 0;
-  return [be.getXAxis({
+  return [oe.getXAxis({
     data: t,
     name: e.x_axis.name ?? "",
     nameGap: o ? 5 : void 0,
@@ -15215,7 +15244,7 @@ function M_(e, t) {
     ...a
   }, o) => {
     let l = a.position;
-    return l || (l = o > 0 ? "right" : "left"), be.getYAxis({
+    return l || (l = o > 0 ? "right" : "left"), oe.getYAxis({
       ...a,
       minInterval: 1,
       min: s || void 0,
@@ -15363,7 +15392,7 @@ function E_({
     }, children: Object.values(x.bottom).map((S) => S) })
   ] });
 }
-const F_ = ue(({
+const F_ = he(({
   value: e,
   onChange: t,
   xAxisOptions: n,
@@ -15704,7 +15733,7 @@ const B_ = ({
     }, children: /* @__PURE__ */ r.jsx(C, { variant: "filled", mt: 24, onClick: s, sx: {
       flexGrow: 0
     }, children: "Setup" }) }),
-    /* @__PURE__ */ r.jsx(fe, { size: 800, title: "Setup dynamic color", opened: n, onClose: i, closeOnClickOutside: !1, withCloseButton: !1, zIndex: 320, children: n && /* @__PURE__ */ r.jsxs(w, { children: [
+    /* @__PURE__ */ r.jsx(ge, { size: 800, title: "Setup dynamic color", opened: n, onClose: i, closeOnClickOutside: !1, withCloseButton: !1, zIndex: 320, children: n && /* @__PURE__ */ r.jsxs(w, { children: [
       /* @__PURE__ */ r.jsx(I, { mt: 10, mb: -10, label: "Dynamic by a custom function", labelPosition: "center", variant: "dashed" }),
       /* @__PURE__ */ r.jsx(B_, { value: a.func_content, onChange: d }),
       /* @__PURE__ */ r.jsxs(b, { position: "apart", children: [
@@ -15738,7 +15767,7 @@ const B_ = ({
 }, {
   label: "Dynamic",
   value: "dynamic"
-}], U_ = ue(({
+}], U_ = he(({
   label: e = "Color",
   value: t,
   onChange: n
@@ -15755,7 +15784,7 @@ const B_ = ({
     /* @__PURE__ */ r.jsx(Q_, { value: t, onChange: n }),
     /* @__PURE__ */ r.jsx(G_, { value: t, onChange: n })
   ] });
-}), K_ = ue(({
+}), K_ = he(({
   value: e,
   onChange: t
 }, n) => {
@@ -15829,7 +15858,7 @@ const B_ = ({
     }, children: /* @__PURE__ */ r.jsx(C, { variant: "filled", mt: 24, onClick: s, sx: {
       flexGrow: 0
     }, children: "Setup" }) }),
-    /* @__PURE__ */ r.jsx(fe, { size: 800, title: "Setup dynamic size", opened: n, onClose: i, closeOnClickOutside: !1, withCloseButton: !1, zIndex: 320, children: n && /* @__PURE__ */ r.jsxs(w, { children: [
+    /* @__PURE__ */ r.jsx(ge, { size: 800, title: "Setup dynamic size", opened: n, onClose: i, closeOnClickOutside: !1, withCloseButton: !1, zIndex: 320, children: n && /* @__PURE__ */ r.jsxs(w, { children: [
       /* @__PURE__ */ r.jsx(I, { mt: 10, mb: -10, label: "Dynamic by a custom function", labelPosition: "center", variant: "dashed" }),
       /* @__PURE__ */ r.jsx(Y_, { value: a.func_content, onChange: d }),
       /* @__PURE__ */ r.jsxs(b, { position: "apart", children: [
@@ -15863,7 +15892,7 @@ const B_ = ({
 }, {
   label: "Dynamic",
   value: "dynamic"
-}], tS = ue(({
+}], tS = he(({
   label: e = "Size",
   value: t,
   onChange: n
@@ -16095,7 +16124,7 @@ const cS = ({
       readOnly: e
     } })
   ] });
-}, dS = ue(({
+}, dS = he(({
   value: e,
   onChange: t
 }, n) => {
@@ -16135,7 +16164,7 @@ const cS = ({
     /* @__PURE__ */ r.jsx(C, { variant: "filled", mt: 24, onClick: i, sx: {
       flexGrow: 0
     }, children: "Customize Label" }),
-    /* @__PURE__ */ r.jsx(fe, { size: 800, title: "Customize label content", opened: s, onClose: a, closeOnClickOutside: !1, withCloseButton: !1, zIndex: 320, children: s && /* @__PURE__ */ r.jsxs(w, { children: [
+    /* @__PURE__ */ r.jsx(ge, { size: 800, title: "Customize label content", opened: s, onClose: a, closeOnClickOutside: !1, withCloseButton: !1, zIndex: 320, children: s && /* @__PURE__ */ r.jsxs(w, { children: [
       /* @__PURE__ */ r.jsx(K, { mt: 10, label: "Enabled", checked: o.enabled, onChange: (x) => c(x.currentTarget.checked) }),
       /* @__PURE__ */ r.jsx(cS, { value: o.func_content, onChange: h, disabled: !o.enabled }),
       /* @__PURE__ */ r.jsxs(b, { position: "apart", children: [
@@ -16327,7 +16356,7 @@ function bS({
     variables: s
   } = e, i = T(() => je({}, t, la), [t]), a = T(() => gS(i), [i]);
   O(() => {
-    !me(i, a) && (console.log("config malformed, resetting to defaults", i, a), n(a));
+    !fe(i, a) && (console.log("config malformed, resetting to defaults", i, a), n(a));
   }, [i, a]);
   const {
     control: o,
@@ -16341,14 +16370,14 @@ function bS({
   O(() => {
     u(a);
   }, [a]);
-  const h = d(), p = T(() => !me(h, i), [h, i]);
+  const h = d(), p = T(() => !fe(h, i), [h, i]);
   return c(["dataZoom"]), /* @__PURE__ */ r.jsx(w, { spacing: "xs", children: /* @__PURE__ */ r.jsxs("form", { onSubmit: l(n), children: [
     /* @__PURE__ */ r.jsxs(b, { position: "left", py: "md", pl: "md", sx: {
       borderBottom: "1px solid #eee",
       background: "#efefef"
     }, children: [
       /* @__PURE__ */ r.jsx(j, { children: "Chart Config" }),
-      /* @__PURE__ */ r.jsx(W, { type: "submit", mr: 5, variant: "filled", color: "blue", disabled: !p, children: /* @__PURE__ */ r.jsx(pe, { size: 20 }) })
+      /* @__PURE__ */ r.jsx(W, { type: "submit", mr: 5, variant: "filled", color: "blue", disabled: !p, children: /* @__PURE__ */ r.jsx(xe, { size: 20 }) })
     ] }),
     /* @__PURE__ */ r.jsxs(f, { defaultValue: "X Axis", orientation: "vertical", styles: {
       tab: {
@@ -16763,7 +16792,7 @@ function $S({
       background: "#efefef"
     }, children: [
       /* @__PURE__ */ r.jsx(j, { weight: 500, children: "Stats Configurations" }),
-      /* @__PURE__ */ r.jsx(W, { type: "submit", mr: 5, variant: "filled", color: "blue", disabled: !u, children: /* @__PURE__ */ r.jsx(pe, { size: 20 }) })
+      /* @__PURE__ */ r.jsx(W, { type: "submit", mr: 5, variant: "filled", color: "blue", disabled: !u, children: /* @__PURE__ */ r.jsx(xe, { size: 20 }) })
     ] }),
     /* @__PURE__ */ r.jsx(g, { name: "template", control: i, render: ({
       field: h
@@ -16928,7 +16957,7 @@ function GS() {
   };
 }
 function QS() {
-  return be.getTooltip({
+  return oe.getTooltip({
     trigger: "item",
     formatter: GS()
   });
@@ -17151,7 +17180,7 @@ function tC({
       background: "#efefef"
     }, children: [
       /* @__PURE__ */ r.jsx(j, { children: "Sunburst Config" }),
-      /* @__PURE__ */ r.jsx(W, { type: "submit", mr: 5, variant: "filled", color: "blue", disabled: !h, children: /* @__PURE__ */ r.jsx(pe, { size: 20 }) })
+      /* @__PURE__ */ r.jsx(W, { type: "submit", mr: 5, variant: "filled", color: "blue", disabled: !h, children: /* @__PURE__ */ r.jsx(xe, { size: 20 }) })
     ] }),
     /* @__PURE__ */ r.jsxs(f, { value: p, onTabChange: x, orientation: "vertical", styles: {
       tab: {
@@ -17673,7 +17702,7 @@ function IC({
     getSortedRowModel: Wp()
   }), {
     rows: V
-  } = F.getRowModel(), Y = M.useRef(null), ce = V.length, ne = ce > 0, Se = ne ? n - 22 : n, De = ne ? 22 : 0;
+  } = F.getRowModel(), Y = M.useRef(null), de = V.length, ne = de > 0, Se = ne ? n - 22 : n, De = ne ? 22 : 0;
   return ll("VizTableComponent", {
     queryData: e,
     width: t,
@@ -17694,11 +17723,11 @@ function IC({
   }, "data-enable-scrollbar": !0, className: h(u.root, {
     "table-highlight-on-hover": s.highlightOnHover
   }), children: [
-    ce > 0 && /* @__PURE__ */ r.jsx(z, { className: u.info_bar, sx: {
+    de > 0 && /* @__PURE__ */ r.jsx(z, { className: u.info_bar, sx: {
       height: 22
     }, children: /* @__PURE__ */ r.jsxs(j, { align: "right", pr: 6, size: 14, color: "dimmed", fw: "normal", children: [
       "Total: ",
-      ce
+      de
     ] }) }),
     /* @__PURE__ */ r.jsxs(We, { sx: {
       ...uC,
@@ -17900,7 +17929,7 @@ const EC = k(({
   };
   return /* @__PURE__ */ r.jsxs(r.Fragment, { children: [
     /* @__PURE__ */ r.jsx(C, { variant: "outline", onClick: d, children: l == null ? void 0 : l.displayName }),
-    /* @__PURE__ */ r.jsx(fe, { size: 508, title: "Setup color interpolation", opened: c, onClose: u, zIndex: 320, children: c && /* @__PURE__ */ r.jsxs(w, { "data-testid": "color-interpolation-modal", children: [
+    /* @__PURE__ */ r.jsx(ge, { size: 508, title: "Setup color interpolation", opened: c, onClose: u, zIndex: 320, children: c && /* @__PURE__ */ r.jsxs(w, { "data-testid": "color-interpolation-modal", children: [
       /* @__PURE__ */ r.jsx(L, { label: "Color style", value: a.interpolation, data: h, onChange: p, withinPortal: !0, zIndex: 340, maxDropdownHeight: 500 }),
       /* @__PURE__ */ r.jsx(FC, { steps: a.steps, interpolation: l, onChange: y }),
       /* @__PURE__ */ r.jsxs(b, { position: "right", children: [
@@ -17932,7 +17961,7 @@ function NC(e, t) {
     interpolation: e.encodeColor(e.getColorInterpolations()[0])
   };
 }
-const qC = ue((e, t) => {
+const qC = he((e, t) => {
   const {
     colorManager: n
   } = Ht(Ot), [s, i] = q(fd(e.value)), [a, o] = q(VC(n, e.value)), l = to(a), [c, d] = q(NC(n, e.value)), u = to(c), h = (y) => {
@@ -17955,12 +17984,12 @@ const qC = ue((e, t) => {
 }, WC = Object.values(_t).map((e) => ({
   label: _.get(BC, e, _.capitalize(e)),
   value: e
-})), GC = ue(({
+})), GC = he(({
   label: e,
   value: t,
   onChange: n,
   sx: s
-}, i) => /* @__PURE__ */ r.jsx(L, { ref: i, label: e, data: WC, value: t, onChange: n, sx: s })), QC = ue(({
+}, i) => /* @__PURE__ */ r.jsx(L, { ref: i, label: e, data: WC, value: t, onChange: n, sx: s })), QC = he(({
   value: e,
   onChange: t
 }, n) => {
@@ -17980,7 +18009,7 @@ const qC = ue((e, t) => {
     /* @__PURE__ */ r.jsx(C, { variant: "filled", mt: 24, onClick: i, sx: {
       flexGrow: 0
     }, children: "Custom Cell Content" }),
-    /* @__PURE__ */ r.jsx(fe, { size: 800, title: "Custom cell content", opened: s, onClose: a, closeOnClickOutside: !1, withCloseButton: !1, zIndex: 320, children: s && /* @__PURE__ */ r.jsxs(w, { children: [
+    /* @__PURE__ */ r.jsx(ge, { size: 800, title: "Custom cell content", opened: s, onClose: a, closeOnClickOutside: !1, withCloseButton: !1, zIndex: 320, children: s && /* @__PURE__ */ r.jsxs(w, { children: [
       /* @__PURE__ */ r.jsx(z, { sx: {
         position: "relative"
       }, children: /* @__PURE__ */ r.jsx(Je, { height: "500px", defaultLanguage: "javascript", value: o, onChange: (h) => l(h ?? ""), theme: "vs-dark", options: {
@@ -18171,7 +18200,7 @@ function JC({
     set: n
   } = Q(e.instanceData, "config"), s = T(() => je({}, t, hd), [t]), i = T(() => XC(s), [s]);
   O(() => {
-    !me(s, i) && (console.log("config malformed, resetting to defaults", s, i), n(i));
+    !fe(s, i) && (console.log("config malformed, resetting to defaults", s, i), n(i));
   }, [s, i]);
   const {
     control: a,
@@ -18185,14 +18214,14 @@ function JC({
   O(() => {
     d(i);
   }, [i]);
-  const u = c(), h = T(() => !me(u, s), [u, s]);
+  const u = c(), h = T(() => !fe(u, s), [u, s]);
   return l(["id_field"]), /* @__PURE__ */ r.jsxs("form", { onSubmit: o(n), children: [
     /* @__PURE__ */ r.jsxs(b, { position: "apart", py: "md", pl: "md", sx: {
       borderBottom: "1px solid #eee",
       background: "#efefef"
     }, children: [
       /* @__PURE__ */ r.jsx(j, { children: "Table Config" }),
-      /* @__PURE__ */ r.jsx(W, { type: "submit", "aria-label": "save config", mr: 5, variant: "filled", color: "blue", disabled: !h, children: /* @__PURE__ */ r.jsx(pe, { size: 20 }) })
+      /* @__PURE__ */ r.jsx(W, { type: "submit", "aria-label": "save config", mr: 5, variant: "filled", color: "blue", disabled: !h, children: /* @__PURE__ */ r.jsx(xe, { size: 20 }) })
     ] }),
     /* @__PURE__ */ r.jsxs(f, { defaultValue: "Columns", orientation: "vertical", styles: {
       tab: {
@@ -18403,7 +18432,7 @@ const bd = M.forwardRef(s1), i1 = ({
       enabled: !1
     }
   } }) });
-}, a1 = ue(({
+}, a1 = he(({
   value: e,
   onChange: t
 }, n) => {
@@ -18423,7 +18452,7 @@ const bd = M.forwardRef(s1), i1 = ({
     /* @__PURE__ */ r.jsx(C, { variant: "filled", mt: 24, onClick: i, sx: {
       flexGrow: 0
     }, children: "Edit Content" }),
-    /* @__PURE__ */ r.jsx(fe, { size: 800, title: "Text content", opened: s, onClose: a, closeOnClickOutside: !1, withCloseButton: !1, zIndex: 320, children: s && /* @__PURE__ */ r.jsxs(w, { children: [
+    /* @__PURE__ */ r.jsx(ge, { size: 800, title: "Text content", opened: s, onClose: a, closeOnClickOutside: !1, withCloseButton: !1, zIndex: 320, children: s && /* @__PURE__ */ r.jsxs(w, { children: [
       /* @__PURE__ */ r.jsx(i1, { value: o, onChange: l }),
       /* @__PURE__ */ r.jsxs(b, { position: "apart", children: [
         /* @__PURE__ */ r.jsx(C, { onClick: u, color: "red", leftIcon: /* @__PURE__ */ r.jsx(mt, { size: 20 }), children: "Reset" }),
@@ -18465,7 +18494,7 @@ function l1({
     };
   }, [s]);
   O(() => {
-    !me(s, i) && (console.log("config malformed, resetting to defaults", s, i), n(i));
+    !fe(s, i) && (console.log("config malformed, resetting to defaults", s, i), n(i));
   }, [s, i]);
   const {
     control: a,
@@ -18486,7 +18515,7 @@ function l1({
       background: "#efefef"
     }, children: [
       /* @__PURE__ */ r.jsx(j, { weight: 500, children: "Configurations" }),
-      /* @__PURE__ */ r.jsx(W, { type: "submit", mr: 5, variant: "filled", color: "blue", disabled: !h, children: /* @__PURE__ */ r.jsx(pe, { size: 20 }) })
+      /* @__PURE__ */ r.jsx(W, { type: "submit", mr: 5, variant: "filled", color: "blue", disabled: !h, children: /* @__PURE__ */ r.jsx(xe, { size: 20 }) })
     ] }),
     /* @__PURE__ */ r.jsxs(w, { spacing: 10, children: [
       /* @__PURE__ */ r.jsx(g, { name: "func_content", control: a, render: ({
@@ -18671,7 +18700,7 @@ function f1({
   O(() => {
     c(s);
   }, [s]), o(["expertSystemURL", "goal", "path", "question"]);
-  const d = l(), u = T(() => !me(d, s), [d, s]);
+  const d = l(), u = T(() => !fe(d, s), [d, s]);
   return /* @__PURE__ */ r.jsx("form", { onSubmit: a(n), children: /* @__PURE__ */ r.jsxs(w, { children: [
     /* @__PURE__ */ r.jsxs(b, { grow: !0, children: [
       /* @__PURE__ */ r.jsx(g, { name: "expertSystemURL", control: i, render: ({
@@ -18690,7 +18719,7 @@ function f1({
       }) => /* @__PURE__ */ r.jsx(D, { label: "Question", required: !0, ...h }) })
     ] }),
     /* @__PURE__ */ r.jsx(I, { variant: "dashed", mt: 16, mb: 8 }),
-    /* @__PURE__ */ r.jsx(C, { type: "submit", variant: "filled", color: "blue", leftIcon: /* @__PURE__ */ r.jsx(pe, { size: 20 }), disabled: !u, sx: {
+    /* @__PURE__ */ r.jsx(C, { type: "submit", variant: "filled", color: "blue", leftIcon: /* @__PURE__ */ r.jsx(xe, { size: 20 }), disabled: !u, sx: {
       alignSelf: "flex-end"
     }, children: "Submit Changes" })
   ] }) });
@@ -18835,7 +18864,7 @@ function C1({
 }
 function k1(e, t, n) {
   const s = $(e.calendar.data_key), i = _.keyBy(t[s.queryID], s.columnKey);
-  return be.getTooltip({
+  return oe.getTooltip({
     formatter: function(a) {
       const l = C1({
         conf: e,
@@ -19177,7 +19206,7 @@ function B1({
     set: n
   } = Q(e.instanceData, "config"), s = T(() => je({}, t, xa), [t]), i = T(() => _.cloneDeep(s), [s]);
   O(() => {
-    !me(s, i) && (console.log("config malformed, resetting to defaults", s, i), n(i));
+    !fe(s, i) && (console.log("config malformed, resetting to defaults", s, i), n(i));
   }, [s, i]);
   const {
     control: a,
@@ -19191,14 +19220,14 @@ function B1({
   O(() => {
     d(i);
   }, [i]);
-  const u = c(), h = T(() => !me(u, s), [u, s]);
+  const u = c(), h = T(() => !fe(u, s), [u, s]);
   return /* @__PURE__ */ r.jsx(w, { spacing: "xs", children: /* @__PURE__ */ r.jsxs("form", { onSubmit: o(n), children: [
     /* @__PURE__ */ r.jsxs(b, { position: "left", py: "md", pl: "md", sx: {
       borderBottom: "1px solid #eee",
       background: "#efefef"
     }, children: [
       /* @__PURE__ */ r.jsx(j, { children: "Calendar Heatmap Config" }),
-      /* @__PURE__ */ r.jsx(W, { type: "submit", mr: 5, variant: "filled", color: "blue", disabled: !h, children: /* @__PURE__ */ r.jsx(pe, { size: 20 }) })
+      /* @__PURE__ */ r.jsx(W, { type: "submit", mr: 5, variant: "filled", color: "blue", disabled: !h, children: /* @__PURE__ */ r.jsx(xe, { size: 20 }) })
     ] }),
     /* @__PURE__ */ r.jsxs(f, { defaultValue: "Calendar", orientation: "vertical", styles: {
       tab: {
@@ -19561,9 +19590,9 @@ function ik({
     name_data_key: e.data_key,
     value_data_key: t
   });
-  return Object.entries(Y).map(([ce, ne]) => {
+  return Object.entries(Y).map(([de, ne]) => {
     const Se = Ne(V);
-    return Se.name = ce, Se.color = void 0, Se.data = ne, Se;
+    return Se.name = de, Se.color = void 0, Se.data = ne, Se;
   });
 }
 function ak(e, t, n, s, i, a, o) {
@@ -19587,7 +19616,7 @@ function lk(e, t, n) {
     xAxisIndex: a,
     name: o
   }) => (i[o] = a, i), {});
-  return be.getTooltip({
+  return oe.getTooltip({
     trigger: "axis",
     axisPointer: {
       type: "shadow"
@@ -19659,7 +19688,7 @@ function uk(e, t) {
     ...i
   }, a) => {
     let o = i.position;
-    return o || (o = a > 0 ? "bottom" : "top"), be.getYAxis({
+    return o || (o = a > 0 ? "bottom" : "top"), oe.getYAxis({
       ...i,
       type: "value",
       min: n || void 0,
@@ -19680,7 +19709,7 @@ function hk(e, t) {
     overflow: s,
     ...i
   } = e.y_axis.axisLabel, a = bt(s.on_axis);
-  return [be.getXAxis({
+  return [oe.getXAxis({
     data: t,
     name: e.y_axis.name ?? "",
     // wait for https://github.com/apache/echarts/pull/16825
@@ -20275,7 +20304,7 @@ function zk({
       background: "#efefef"
     }, children: [
       /* @__PURE__ */ r.jsx(j, { children: "Horizontal Bar Chart Config" }),
-      /* @__PURE__ */ r.jsx(W, { type: "submit", mr: 5, variant: "filled", color: "blue", disabled: !h, children: /* @__PURE__ */ r.jsx(pe, { size: 20 }) })
+      /* @__PURE__ */ r.jsx(W, { type: "submit", mr: 5, variant: "filled", color: "blue", disabled: !h, children: /* @__PURE__ */ r.jsx(xe, { size: 20 }) })
     ] }),
     /* @__PURE__ */ r.jsxs(f, { defaultValue: "Series", orientation: "vertical", styles: {
       tab: {
@@ -21220,7 +21249,7 @@ function lT({
       background: "#efefef"
     }, children: [
       /* @__PURE__ */ r.jsx(j, { children: "Merico Estimation Chart Config" }),
-      /* @__PURE__ */ r.jsx(W, { type: "submit", mr: 5, variant: "filled", color: "blue", disabled: !u, children: /* @__PURE__ */ r.jsx(pe, { size: 20 }) })
+      /* @__PURE__ */ r.jsx(W, { type: "submit", mr: 5, variant: "filled", color: "blue", disabled: !u, children: /* @__PURE__ */ r.jsx(xe, { size: 20 }) })
     ] }),
     /* @__PURE__ */ r.jsxs(f, { defaultValue: "X Axis", orientation: "vertical", styles: {
       tab: {
@@ -21403,11 +21432,11 @@ const No = ({
 }, {
   label: "Filter Option Label",
   value: "filter-option-label"
-}], fT = k(ue(({
+}], fT = k(he(({
   value: e,
   onChange: t
 }, n) => {
-  const i = le().filters.selects, a = (l) => {
+  const i = ce().filters.selects, a = (l) => {
     t({
       type: l,
       value: e.value
@@ -21614,14 +21643,14 @@ function wT({
   O(() => {
     d(i);
   }, [i]);
-  const u = c(), h = T(() => !me(u, i), [u, i]);
+  const u = c(), h = T(() => !fe(u, i), [u, i]);
   return /* @__PURE__ */ r.jsx("form", { onSubmit: o(n), children: /* @__PURE__ */ r.jsxs(w, { spacing: "xs", children: [
     /* @__PURE__ */ r.jsxs(b, { position: "left", py: "md", pl: "md", sx: {
       borderBottom: "1px solid #eee",
       background: "#efefef"
     }, children: [
       /* @__PURE__ */ r.jsx(j, { children: "Merico Stats Config" }),
-      /* @__PURE__ */ r.jsx(W, { type: "submit", mr: 5, variant: "filled", color: "blue", disabled: !h, children: /* @__PURE__ */ r.jsx(pe, { size: 20 }) })
+      /* @__PURE__ */ r.jsx(W, { type: "submit", mr: 5, variant: "filled", color: "blue", disabled: !h, children: /* @__PURE__ */ r.jsx(xe, { size: 20 }) })
     ] }),
     /* @__PURE__ */ r.jsx(vT, { control: a, watch: l }),
     /* @__PURE__ */ r.jsx(bT, { control: a, watch: l, variables: s })
@@ -21818,7 +21847,7 @@ const zT = ({
   enabled: !1,
   func_content: ["function label(value, index) {", "    // your code goes here", "    // return value", "}"].join(`
 `)
-}, vd = ue(({
+}, vd = he(({
   value: e,
   onChange: t
 }, n) => {
@@ -21858,7 +21887,7 @@ const zT = ({
     /* @__PURE__ */ r.jsx(C, { variant: "filled", mt: 24, onClick: i, sx: {
       flexGrow: 0
     }, children: "Customize Label" }),
-    /* @__PURE__ */ r.jsx(fe, { size: 800, title: "Customize label content", opened: s, onClose: a, closeOnClickOutside: !1, withCloseButton: !1, zIndex: 320, children: s && /* @__PURE__ */ r.jsxs(w, { children: [
+    /* @__PURE__ */ r.jsx(ge, { size: 800, title: "Customize label content", opened: s, onClose: a, closeOnClickOutside: !1, withCloseButton: !1, zIndex: 320, children: s && /* @__PURE__ */ r.jsxs(w, { children: [
       /* @__PURE__ */ r.jsx(K, { mt: 10, label: "Enabled", checked: o.enabled, onChange: (x) => c(x.currentTarget.checked) }),
       /* @__PURE__ */ r.jsx(zT, { value: o.func_content, onChange: h, disabled: !o.enabled }),
       /* @__PURE__ */ r.jsxs(b, { position: "apart", children: [
@@ -22028,7 +22057,7 @@ function ET({
     set: n
   } = Q(e.instanceData, "config"), s = T(() => je({}, t, ba), [t]), i = T(() => _.cloneDeep(s), [s]);
   O(() => {
-    !me(s, i) && (console.log("config malformed, resetting to defaults", s, i), n(i));
+    !fe(s, i) && (console.log("config malformed, resetting to defaults", s, i), n(i));
   }, [s, i]);
   const {
     control: a,
@@ -22042,7 +22071,7 @@ function ET({
   O(() => {
     d(i);
   }, [i]);
-  const u = c(), h = T(() => !me(u, s), [u, s]);
+  const u = c(), h = T(() => !fe(u, s), [u, s]);
   return /* @__PURE__ */ r.jsx("form", { onSubmit: o(n), style: {
     flexGrow: 1
   }, children: /* @__PURE__ */ r.jsxs(w, { spacing: "xs", sx: {
@@ -22053,7 +22082,7 @@ function ET({
       background: "#efefef"
     }, children: [
       /* @__PURE__ */ r.jsx(j, { children: "Chart Config" }),
-      /* @__PURE__ */ r.jsx(W, { type: "submit", mr: 5, variant: "filled", color: "blue", disabled: !h, children: /* @__PURE__ */ r.jsx(pe, { size: 20 }) })
+      /* @__PURE__ */ r.jsx(W, { type: "submit", mr: 5, variant: "filled", color: "blue", disabled: !h, children: /* @__PURE__ */ r.jsx(xe, { size: 20 }) })
     ] }),
     /* @__PURE__ */ r.jsxs(f, { defaultValue: "X Axis", orientation: "vertical", styles: {
       root: {
@@ -22160,7 +22189,10 @@ function VT(e) {
     left: 5,
     right: 5,
     bottom: t,
-    containLabel: !0
+    containLabel: !0,
+    borderColor: "none",
+    backgroundColor: "#E7E7E9",
+    z: 1
   };
 }
 function NT(e, t) {
@@ -22182,7 +22214,8 @@ function NT(e, t) {
     label: i.label,
     labelLayout: {
       hideOverlap: !0
-    }
+    },
+    z: 2
   };
 }
 const qT = (e) => Z(e, {
@@ -22243,7 +22276,7 @@ function WT(e, t, n, s) {
   } = e, l = $(i.data_key), c = $(a.data_key);
   $(o.data_key);
   const d = _.keyBy(t[l.queryID], (u) => `${u[l.columnKey]}---${u[c.columnKey]}`);
-  return be.getTooltip({
+  return oe.getTooltip({
     formatter: function(u) {
       const p = BT({
         conf: e,
@@ -22294,7 +22327,7 @@ function QT(e, t, n) {
     overflow: a,
     rotate: o
   } = e.x_axis.axisLabel, l = bt(a.on_axis);
-  return {
+  return oe.getXAxis({
     id: "main-x-axis",
     type: "category",
     data: i,
@@ -22310,7 +22343,13 @@ function QT(e, t, n) {
       formatter: n
     },
     splitArea: {
-      show: !0
+      show: !1,
+      areaStyle: {
+        color: "#E7E7E9"
+      }
+    },
+    splitLine: {
+      show: !1
     },
     nameLocation: "center",
     nameGap: 25,
@@ -22318,8 +22357,8 @@ function QT(e, t, n) {
       fontWeight: "bold",
       align: "center"
     },
-    z: 2
-  };
+    z: 3
+  });
 }
 function HT(e, t, n) {
   const s = $(e.x_axis.data_key), i = $(e.y_axis.data_key), {
@@ -22330,7 +22369,7 @@ function HT(e, t, n) {
     overflow: d,
     rotate: u
   } = e.y_axis.axisLabel, h = bt(d.on_axis);
-  return {
+  return oe.getYAxis({
     ...l,
     type: "category",
     data: c,
@@ -22341,14 +22380,22 @@ function HT(e, t, n) {
     },
     axisLine: {
       show: !0,
-      color: "blue"
+      lineStyle: {
+        width: 3
+      }
     },
     axisTick: {
       show: !0,
       alignWithLabel: !0
     },
     splitArea: {
-      show: !0
+      show: !1,
+      areaStyle: {
+        color: "#E7E7E9"
+      }
+    },
+    splitLine: {
+      show: !1
     },
     nameTextStyle: {
       fontWeight: "bold",
@@ -22356,8 +22403,8 @@ function HT(e, t, n) {
     },
     nameLocation: "end",
     nameGap: 15,
-    z: 2
-  };
+    z: 3
+  });
 }
 function UT(e, t, n) {
   if (!e.x_axis.data_key || !e.y_axis.data_key || !e.heat_block.data_key)
@@ -22539,7 +22586,7 @@ function Sd() {
 const tD = ({
   description: e,
   isDescriptionEmpty: t
-}) => t ? null : /* @__PURE__ */ r.jsx(ge, { color: "white", label: /* @__PURE__ */ r.jsx(vs, { value: e, styles: {
+}) => t ? null : /* @__PURE__ */ r.jsx(be, { color: "white", label: /* @__PURE__ */ r.jsx(vs, { value: e, styles: {
   root: {
     border: "none"
   },
@@ -22606,7 +22653,7 @@ const tD = ({
       visibility: "hidden"
     }, children: "." });
   const s = n === 1 ? "day" : "days";
-  return /* @__PURE__ */ r.jsx(ge, { label: `${n}${s}`, children: /* @__PURE__ */ r.jsx(bn, { size: "sm", children: n }) });
+  return /* @__PURE__ */ r.jsx(be, { label: `${n}${s}`, children: /* @__PURE__ */ r.jsx(bn, { size: "sm", children: n }) });
 }, iD = ({
   max_days: e
 }) => e ? /* @__PURE__ */ r.jsxs(r.Fragment, { children: [
@@ -23072,7 +23119,7 @@ const aD = ({
     unstyled: s
   }), [y, S] = q(!1), A = (ne) => {
     S(ne);
-  }, F = y && (l == null ? void 0 : l.length) > 0, [V, Y] = q(""), ce = T(() => {
+  }, F = y && (l == null ? void 0 : l.length) > 0, [V, Y] = q(""), de = T(() => {
     if (!V)
       return d;
     const ne = V.toLowerCase(), Se = (De) => {
@@ -23087,9 +23134,9 @@ const aD = ({
         o,
         h && /* @__PURE__ */ r.jsx("span", { className: p.required, "aria-hidden": "true", children: "*" })
       ] }),
-      F && /* @__PURE__ */ r.jsx(ge, { label: `${l.length} selected`, children: /* @__PURE__ */ r.jsx(bn, { children: l.length }) })
+      F && /* @__PURE__ */ r.jsx(be, { label: `${l.length} selected`, children: /* @__PURE__ */ r.jsx(bn, { children: l.length }) })
     ] }),
-    /* @__PURE__ */ r.jsx(Hp, { disabled: e, allowClear: !0, className: x(p.root, "check-select"), dropdownClassName: x(p.dropdown, ""), onDropdownVisibleChange: A, transitionName: "rc-select-dropdown-slide-up", choiceTransitionName: "rc-select-selection__choice-zoom", style: a, clearIcon: () => /* @__PURE__ */ r.jsx(rl, {}), value: l, onChange: c, onSelect: console.log, mode: "multiple", maxTagCount: 0, notFoundContent: /* @__PURE__ */ r.jsx(Td, { errorMessage: u }), maxTagTextLength: 10, maxTagPlaceholder: (ne) => `${ne.length} selected`, searchValue: V, onSearch: Y, filterOption: !1, children: ce.map((ne) => /* @__PURE__ */ r.jsxs(Up, { title: ne.label, children: [
+    /* @__PURE__ */ r.jsx(Hp, { disabled: e, allowClear: !0, className: x(p.root, "check-select"), dropdownClassName: x(p.dropdown, ""), onDropdownVisibleChange: A, transitionName: "rc-select-dropdown-slide-up", choiceTransitionName: "rc-select-selection__choice-zoom", style: a, clearIcon: () => /* @__PURE__ */ r.jsx(rl, {}), value: l, onChange: c, onSelect: console.log, mode: "multiple", maxTagCount: 0, notFoundContent: /* @__PURE__ */ r.jsx(Td, { errorMessage: u }), maxTagTextLength: 10, maxTagPlaceholder: (ne) => `${ne.length} selected`, searchValue: V, onSearch: Y, filterOption: !1, children: de.map((ne) => /* @__PURE__ */ r.jsxs(Up, { title: ne.label, children: [
       /* @__PURE__ */ r.jsx(j, { size: "sm", "data-role": "label", children: ne.label }),
       ne.description && /* @__PURE__ */ r.jsx(j, { size: "xs", color: "dimmed", "data-role": "description", children: ne.description })
     ] }, ne.value)) })
@@ -23110,7 +23157,7 @@ const aD = ({
     maxWidth: u ? d : "unset",
     borderColor: "#e9ecef"
   }, disabled: u, value: n, onChange: h, errorMessage: l, required: t.required });
-}), uD = ue(({
+}), uD = he(({
   label: e,
   description: t,
   ...n
@@ -23454,7 +23501,7 @@ const xD = ({
         o,
         h && /* @__PURE__ */ r.jsx("span", { className: x.required, "aria-hidden": "true", children: "*" })
       ] }),
-      V && /* @__PURE__ */ r.jsx(ge, { label: `${l.length} selected`, children: /* @__PURE__ */ r.jsx(bn, { children: l.length }) })
+      V && /* @__PURE__ */ r.jsx(be, { label: `${l.length} selected`, children: /* @__PURE__ */ r.jsx(bn, { children: l.length }) })
     ] }),
     /* @__PURE__ */ r.jsx(
       Kp,
@@ -23554,7 +23601,7 @@ const xD = ({
   return /* @__PURE__ */ r.jsx(C, { color: "blue", size: "sm", type: "submit", ...i, disabled: e || i.disabled, children: n });
 };
 function SD(e) {
-  const t = le();
+  const t = ce();
   O(() => {
     var n, s;
     (s = (n = t.filters).updatePreviewValues) == null || s.call(n, e);
@@ -25675,7 +25722,7 @@ class lI {
     });
   }
   get changed() {
-    return !me(Wt(this.origin), Wt(this.copy));
+    return !fe(Wt(this.origin), Wt(this.copy));
   }
   commit() {
     Ue(this.origin, Wt(this.copy));
@@ -25690,7 +25737,7 @@ class lI {
 const cI = (e) => new lI(e), dI = k(({
   view: e
 }) => {
-  const t = oe(), n = le(), s = Et(), {
+  const t = le(), n = ce(), s = Et(), {
     panel: i,
     downloadPanelScreenshot: a
   } = It(), {
@@ -25723,20 +25770,20 @@ const cI = (e) => new lI(e), dI = k(({
     left: 0,
     right: 0,
     zIndex: 300
-  }, children: /* @__PURE__ */ r.jsxs(de, { withinPortal: !0, children: [
-    /* @__PURE__ */ r.jsx(de.Target, { children: /* @__PURE__ */ r.jsx(z, { className: "panel-dropdown-target", sx: {
+  }, children: /* @__PURE__ */ r.jsxs(ue, { withinPortal: !0, children: [
+    /* @__PURE__ */ r.jsx(ue.Target, { children: /* @__PURE__ */ r.jsx(z, { className: "panel-dropdown-target", sx: {
       width: "100%"
     } }) }),
-    /* @__PURE__ */ r.jsxs(de.Dropdown, { children: [
-      /* @__PURE__ */ r.jsx(de.Item, { onClick: i.refreshData, icon: /* @__PURE__ */ r.jsx(Si, { size: 14 }), children: "Refresh" }),
-      /* @__PURE__ */ r.jsx(de.Item, { onClick: i.downloadData, icon: /* @__PURE__ */ r.jsx(Ci, { size: 14 }), children: "Download Data" }),
-      /* @__PURE__ */ r.jsx(de.Item, { onClick: i.downloadSchema, icon: /* @__PURE__ */ r.jsx(wn, { size: 14 }), children: "Download Schema" }),
-      /* @__PURE__ */ r.jsx(de.Item, { onClick: a, icon: /* @__PURE__ */ r.jsx(ds, { size: 14 }), children: "Screenshot" }),
-      x && /* @__PURE__ */ r.jsx(de.Item, { onClick: p, icon: /* @__PURE__ */ r.jsx(bl, { size: 14 }), disabled: !0, children: "Full Screen" }),
+    /* @__PURE__ */ r.jsxs(ue.Dropdown, { children: [
+      /* @__PURE__ */ r.jsx(ue.Item, { onClick: i.refreshData, icon: /* @__PURE__ */ r.jsx(Si, { size: 14 }), children: "Refresh" }),
+      /* @__PURE__ */ r.jsx(ue.Item, { onClick: i.downloadData, icon: /* @__PURE__ */ r.jsx(Ci, { size: 14 }), children: "Download Data" }),
+      /* @__PURE__ */ r.jsx(ue.Item, { onClick: i.downloadSchema, icon: /* @__PURE__ */ r.jsx(wn, { size: 14 }), children: "Download Schema" }),
+      /* @__PURE__ */ r.jsx(ue.Item, { onClick: a, icon: /* @__PURE__ */ r.jsx(ds, { size: 14 }), children: "Screenshot" }),
+      x && /* @__PURE__ */ r.jsx(ue.Item, { onClick: p, icon: /* @__PURE__ */ r.jsx(bl, { size: 14 }), disabled: !0, children: "Full Screen" }),
       /* @__PURE__ */ r.jsx(I, { label: "Edit", labelPosition: "center" }),
-      /* @__PURE__ */ r.jsx(de.Item, { onClick: u, icon: /* @__PURE__ */ r.jsx(yl, { size: 14 }), children: "Settings" }),
-      /* @__PURE__ */ r.jsx(de.Item, { onClick: d, icon: /* @__PURE__ */ r.jsx(Oh, { size: 14 }), children: "Duplicate" }),
-      /* @__PURE__ */ r.jsx(de.Item, { color: "red", onClick: h, icon: /* @__PURE__ */ r.jsx(ae, { size: 14 }), children: "Delete" })
+      /* @__PURE__ */ r.jsx(ue.Item, { onClick: u, icon: /* @__PURE__ */ r.jsx(yl, { size: 14 }), children: "Settings" }),
+      /* @__PURE__ */ r.jsx(ue.Item, { onClick: d, icon: /* @__PURE__ */ r.jsx(Oh, { size: 14 }), children: "Duplicate" }),
+      /* @__PURE__ */ r.jsx(ue.Item, { color: "red", onClick: h, icon: /* @__PURE__ */ r.jsx(ae, { size: 14 }), children: "Delete" })
     ] })
   ] }) }) });
 });
@@ -25748,7 +25795,7 @@ const iu = k(() => {
     panel: n
   } = Dn();
   return uI(n.description) ? null : /* @__PURE__ */ r.jsxs(r.Fragment, { children: [
-    /* @__PURE__ */ r.jsx(fe, { opened: e, onClose: () => t(!1), title: n.title.show ? n.name : "", withCloseButton: !1, withinPortal: !0, zIndex: 310, children: /* @__PURE__ */ r.jsx(vs, { value: n.description, styles: {
+    /* @__PURE__ */ r.jsx(ge, { opened: e, onClose: () => t(!1), title: n.title.show ? n.name : "", withCloseButton: !1, withinPortal: !0, zIndex: 310, children: /* @__PURE__ */ r.jsx(vs, { value: n.description, styles: {
       root: {
         border: "none"
       },
@@ -25760,7 +25807,7 @@ const iu = k(() => {
         padding: "0 !important"
       }
     } }) }),
-    /* @__PURE__ */ r.jsx(ge, { label: "Click to see description", position: "top-start", withinPortal: !0, children: /* @__PURE__ */ r.jsx(W, { variant: "subtle", color: "blue", onClick: () => t((s) => !s), sx: {
+    /* @__PURE__ */ r.jsx(be, { label: "Click to see description", position: "top-start", withinPortal: !0, children: /* @__PURE__ */ r.jsx(W, { variant: "subtle", color: "blue", onClick: () => t((s) => !s), sx: {
       verticalAlign: "baseline",
       cursor: "pointer"
     }, children: /* @__PURE__ */ r.jsx(an, { size: 20 }) }) })
@@ -26039,13 +26086,13 @@ const CI = k(({
     left: 0,
     right: 0,
     zIndex: 300
-  }, children: /* @__PURE__ */ r.jsxs(de, { withinPortal: !0, children: [
-    /* @__PURE__ */ r.jsx(de.Target, { children: /* @__PURE__ */ r.jsx(z, { className: "panel-dropdown-target" }) }),
-    /* @__PURE__ */ r.jsxs(de.Dropdown, { children: [
-      /* @__PURE__ */ r.jsx(de.Item, { onClick: t.refreshData, icon: /* @__PURE__ */ r.jsx(Si, { size: 14 }), children: "Refresh" }),
-      /* @__PURE__ */ r.jsx(de.Item, { onClick: t.downloadData, icon: /* @__PURE__ */ r.jsx(Ci, { size: 14 }), children: "Download Data" }),
-      /* @__PURE__ */ r.jsx(de.Item, { onClick: n, icon: /* @__PURE__ */ r.jsx(ds, { size: 14 }), children: "Screenshot" }),
-      l && /* @__PURE__ */ r.jsx(de.Item, { onClick: o, icon: /* @__PURE__ */ r.jsx(bl, { size: 14 }), children: "Full Screen" })
+  }, children: /* @__PURE__ */ r.jsxs(ue, { withinPortal: !0, children: [
+    /* @__PURE__ */ r.jsx(ue.Target, { children: /* @__PURE__ */ r.jsx(z, { className: "panel-dropdown-target" }) }),
+    /* @__PURE__ */ r.jsxs(ue.Dropdown, { children: [
+      /* @__PURE__ */ r.jsx(ue.Item, { onClick: t.refreshData, icon: /* @__PURE__ */ r.jsx(Si, { size: 14 }), children: "Refresh" }),
+      /* @__PURE__ */ r.jsx(ue.Item, { onClick: t.downloadData, icon: /* @__PURE__ */ r.jsx(Ci, { size: 14 }), children: "Download Data" }),
+      /* @__PURE__ */ r.jsx(ue.Item, { onClick: n, icon: /* @__PURE__ */ r.jsx(ds, { size: 14 }), children: "Screenshot" }),
+      l && /* @__PURE__ */ r.jsx(ue.Item, { onClick: o, icon: /* @__PURE__ */ r.jsx(bl, { size: 14 }), children: "Full Screen" })
     ] })
   ] }) }) : null;
 });
@@ -26075,7 +26122,7 @@ const hu = k(({
   panel: n,
   exitFullScreen: s
 }) {
-  return /* @__PURE__ */ r.jsx(fe, { opened: !0, fullScreen: !0, onClose: s, title: /* @__PURE__ */ r.jsx(C, { color: "blue", size: "xs", onClick: s, leftIcon: /* @__PURE__ */ r.jsx($h, { size: 20 }), children: "Exit fullscreen" }), styles: TI, children: /* @__PURE__ */ r.jsx(b, { grow: !0, sx: {
+  return /* @__PURE__ */ r.jsx(ge, { opened: !0, fullScreen: !0, onClose: s, title: /* @__PURE__ */ r.jsx(C, { color: "blue", size: "xs", onClick: s, leftIcon: /* @__PURE__ */ r.jsx($h, { size: 20 }), children: "Exit fullscreen" }), styles: TI, children: /* @__PURE__ */ r.jsx(b, { grow: !0, sx: {
     flexGrow: 1,
     flexShrink: 0
   }, children: /* @__PURE__ */ r.jsx(hu, { view: t, panel: n }) }) });
@@ -26190,8 +26237,8 @@ const FI = k(({
     const l = JSON.stringify(a.contentJSON, null, 2), c = `${i.name}__${a.name}`;
     Kn(c, l);
   };
-  return /* @__PURE__ */ r.jsxs(de, { shadow: "md", width: 200, trigger: "hover", openDelay: 200, closeDelay: 400, withinPortal: !0, position: "bottom-end", children: [
-    /* @__PURE__ */ r.jsx(de.Target, { children: /* @__PURE__ */ r.jsx(uh, { position: {
+  return /* @__PURE__ */ r.jsxs(ue, { shadow: "md", width: 200, trigger: "hover", openDelay: 200, closeDelay: 400, withinPortal: !0, position: "bottom-end", children: [
+    /* @__PURE__ */ r.jsx(ue.Target, { children: /* @__PURE__ */ r.jsx(uh, { position: {
       bottom: "20px",
       right: "10px"
     }, zIndex: 1, children: /* @__PURE__ */ r.jsx(W, { size: "md", variant: "gradient", gradient: {
@@ -26203,11 +26250,11 @@ const FI = k(({
       transition: "all ease 300ms",
       borderRadius: "50%"
     }, children: /* @__PURE__ */ r.jsx(sp, { size: "1rem" }) }) }) }),
-    /* @__PURE__ */ r.jsxs(de.Dropdown, { children: [
-      /* @__PURE__ */ r.jsx(de.Item, { icon: /* @__PURE__ */ r.jsx(ds, { size: 14 }), onClick: e, children: "Screenshot" }),
-      /* @__PURE__ */ r.jsx(de.Divider, {}),
-      /* @__PURE__ */ r.jsx(de.Item, { icon: /* @__PURE__ */ r.jsx(ip, { size: 14 }), onClick: a.queries.downloadAllData, children: "Download Data" }),
-      /* @__PURE__ */ r.jsx(de.Item, { icon: /* @__PURE__ */ r.jsx(wn, { size: 14 }), onClick: o, children: "Download Schema" })
+    /* @__PURE__ */ r.jsxs(ue.Dropdown, { children: [
+      /* @__PURE__ */ r.jsx(ue.Item, { icon: /* @__PURE__ */ r.jsx(ds, { size: 14 }), onClick: e, children: "Screenshot" }),
+      /* @__PURE__ */ r.jsx(ue.Divider, {}),
+      /* @__PURE__ */ r.jsx(ue.Item, { icon: /* @__PURE__ */ r.jsx(ip, { size: 14 }), onClick: a.queries.downloadAllData, children: "Download Data" }),
+      /* @__PURE__ */ r.jsx(ue.Item, { icon: /* @__PURE__ */ r.jsx(wn, { size: 14 }), onClick: o, children: "Download Schema" })
     ] })
   ] });
 }), pu = k(({
@@ -26233,7 +26280,7 @@ const FI = k(({
     ref: o,
     downloadScreenshot: l
   } = _a(t);
-  return /* @__PURE__ */ r.jsx(fe, { size: s.width, centered: !0, opened: i, onClose: a, withCloseButton: !1, title: /* @__PURE__ */ r.jsxs(b, { position: "apart", px: "1rem", h: "48px", children: [
+  return /* @__PURE__ */ r.jsx(ge, { size: s.width, centered: !0, opened: i, onClose: a, withCloseButton: !1, title: /* @__PURE__ */ r.jsxs(b, { position: "apart", px: "1rem", h: "48px", children: [
     /* @__PURE__ */ r.jsx(z, { children: s.custom_modal_title.value }),
     /* @__PURE__ */ r.jsx(xu, { downloadScreenshot: l })
   ] }), trapFocus: !0, onDragStart: (c) => {
@@ -26337,7 +26384,7 @@ const qI = k(({
     "> div:not(.mantine-Modal-root)": {
       height: "100%"
     }
-  }, children: /* @__PURE__ */ r.jsx(fe, { size: n.width, opened: !0, onClose: _.noop, withCloseButton: !1, title: /* @__PURE__ */ r.jsxs(b, { position: "apart", px: "1rem", h: "48px", children: [
+  }, children: /* @__PURE__ */ r.jsx(ge, { size: n.width, opened: !0, onClose: _.noop, withCloseButton: !1, title: /* @__PURE__ */ r.jsxs(b, { position: "apart", px: "1rem", h: "48px", children: [
     /* @__PURE__ */ r.jsx(z, { children: n.custom_modal_title.value }),
     /* @__PURE__ */ r.jsx(xu, { downloadScreenshot: o })
   ] }), trapFocus: !0, onDragStart: (l) => {
@@ -26408,7 +26455,7 @@ const qI = k(({
 } : {}, GI = k(({
   view: e
 }) => {
-  const t = Et(), n = le(), s = T(() => n.views.options.filter((l) => l.type === B.Division), [e.id, n.views.options]), i = e.config, a = (l) => t.openConfirmModal({
+  const t = Et(), n = ce(), s = T(() => n.views.options.filter((l) => l.type === B.Division), [e.id, n.views.options]), i = e.config, a = (l) => t.openConfirmModal({
     title: "Delete this tab?",
     labels: {
       confirm: "Confirm",
@@ -27400,27 +27447,27 @@ const pz = m.model({
   },
   get filtersChanged() {
     const t = "filters.current";
-    return !me(Wt(te(e, t)), te(e.origin, t));
+    return !fe(Wt(te(e, t)), te(e.origin, t));
   },
   get queriesChanged() {
     const t = "queries.current", n = Wt(te(e, t)).map((s) => fl(s, ["id", "name", "key", "type", "sql", "run_by", "react_to", "pre_process", "post_process", "dep_query_ids"]));
-    return !me(n, te(e.origin, t));
+    return !fe(n, te(e.origin, t));
   },
   get sqlSnippetsChanged() {
     const t = "sqlSnippets.current";
-    return !me(Wt(te(e, t)), te(e.origin, t));
+    return !fe(Wt(te(e, t)), te(e.origin, t));
   },
   get viewsChanged() {
     const t = "views.current";
-    return !me(e.views.json, te(e.origin, t));
+    return !fe(e.views.json, te(e.origin, t));
   },
   get panelsChanged() {
     const t = "panels.list";
-    return !me(Wt(te(e, t)), te(e.origin, t));
+    return !fe(Wt(te(e, t)), te(e.origin, t));
   },
   get mockContextChanged() {
     const t = "mock_context.current";
-    return !me(te(e, t), te(e.origin, t));
+    return !fe(te(e, t), te(e.origin, t));
   },
   get context() {
     const t = Le(e).context.current;
@@ -27850,7 +27897,7 @@ function bu(e) {
 const gz = k(({
   saveDashboardChanges: e
 }) => {
-  const t = Et(), n = le(), s = () => {
+  const t = Et(), n = ce(), s = () => {
     t.openConfirmModal({
       title: /* @__PURE__ */ r.jsxs(b, { position: "left", children: [
         /* @__PURE__ */ r.jsx(Cl, { size: 18, color: "red" }),
@@ -27874,8 +27921,8 @@ const gz = k(({
       borderTopRightRadius: 0,
       borderBottomRightRadius: 0
     }, children: "Save Changes" }),
-    /* @__PURE__ */ r.jsxs(de, { width: 200, trigger: "hover", openDelay: 100, closeDelay: 400, withinPortal: !0, zIndex: 320, disabled: !i, children: [
-      /* @__PURE__ */ r.jsx(de.Target, { children: /* @__PURE__ */ r.jsx(W, { variant: "default", disabled: !i, sx: {
+    /* @__PURE__ */ r.jsxs(ue, { width: 200, trigger: "hover", openDelay: 100, closeDelay: 400, withinPortal: !0, zIndex: 320, disabled: !i, children: [
+      /* @__PURE__ */ r.jsx(ue.Target, { children: /* @__PURE__ */ r.jsx(W, { variant: "default", disabled: !i, sx: {
         height: "30px",
         borderTopLeftRadius: 0,
         borderBottomLeftRadius: 0,
@@ -27884,7 +27931,7 @@ const gz = k(({
           stroke: "none"
         }
       }, children: /* @__PURE__ */ r.jsx(cp, { size: 18 }) }) }),
-      /* @__PURE__ */ r.jsx(de.Dropdown, { children: /* @__PURE__ */ r.jsx(de.Item, { icon: /* @__PURE__ */ r.jsx(cs, { size: 14, color: "red" }), disabled: !i, onClick: s, children: "Revert Changes" }) })
+      /* @__PURE__ */ r.jsx(ue.Dropdown, { children: /* @__PURE__ */ r.jsx(ue.Item, { icon: /* @__PURE__ */ r.jsx(cs, { size: 14, color: "red" }), disabled: !i, onClick: s, children: "Revert Changes" }) })
     ] })
   ] });
 }), bz = k(({
@@ -27892,7 +27939,7 @@ const gz = k(({
   onExit: t,
   headerSlot: n = null
 }) => {
-  const s = oe(), i = s.content.changed, a = () => {
+  const s = le(), i = s.content.changed, a = () => {
     t({
       hasChanges: i,
       dashboardId: s.id
@@ -27924,8 +27971,8 @@ const gz = k(({
   borderBottom: "1px solid #e9ecef"
 }, yz = k(() => {
   var s;
-  const e = le(), t = ((s = e.views.VIE) == null ? void 0 : s.type) === B.Tabs, n = () => e.addANewPanel(e.views.idOfVIE);
-  return t ? /* @__PURE__ */ r.jsx(ge, { label: "Please choose a tab first", children: /* @__PURE__ */ r.jsx(C, { variant: "outline", color: "gray", radius: 0, size: "xs", leftIcon: /* @__PURE__ */ r.jsx(ro, { size: 20 }), sx: {
+  const e = ce(), t = ((s = e.views.VIE) == null ? void 0 : s.type) === B.Tabs, n = () => e.addANewPanel(e.views.idOfVIE);
+  return t ? /* @__PURE__ */ r.jsx(be, { label: "Please choose a tab first", children: /* @__PURE__ */ r.jsx(C, { variant: "outline", color: "gray", radius: 0, size: "xs", leftIcon: /* @__PURE__ */ r.jsx(ro, { size: 20 }), sx: {
     ...Qo,
     transform: "none !important"
   }, children: "Add a Panel" }) }) : /* @__PURE__ */ r.jsx(C, { variant: "outline", color: "blue", radius: 0, size: "xs", onClick: n, leftIcon: /* @__PURE__ */ r.jsx(ro, { size: 20 }), sx: {
@@ -28019,7 +28066,7 @@ const gz = k(({
     /* @__PURE__ */ r.jsx(W, { size: "lg", color: "blue", variant: "filled", mt: 26, onClick: s, sx: {
       flexGrow: 0
     }, children: /* @__PURE__ */ r.jsx(yl, { size: 14 }) }),
-    /* @__PURE__ */ r.jsx(fe, { size: 800, title: "Customize modal title", opened: n, onClose: i, closeOnClickOutside: !1, withCloseButton: !1, zIndex: 320, children: n && /* @__PURE__ */ r.jsxs(w, { children: [
+    /* @__PURE__ */ r.jsx(ge, { size: 800, title: "Customize modal title", opened: n, onClose: i, closeOnClickOutside: !1, withCloseButton: !1, zIndex: 320, children: n && /* @__PURE__ */ r.jsxs(w, { children: [
       /* @__PURE__ */ r.jsx(K, { mt: 10, label: "Enabled", checked: a.enabled, onChange: (p) => l(p.currentTarget.checked) }),
       /* @__PURE__ */ r.jsx(Sz, { value: a.func_content, onChange: u, disabled: !a.enabled }),
       /* @__PURE__ */ r.jsxs(b, { position: "apart", children: [
@@ -28215,7 +28262,7 @@ const $z = k(({
   shrinkModal: n
 }) => {
   var A, F;
-  const s = le(), {
+  const s = ce(), {
     handleSubmit: i,
     formState: {
       errors: a
@@ -28253,12 +28300,12 @@ const $z = k(({
     const V = new FileReader();
     V.readAsText(h, "UTF-8"), V.onload = (Y) => {
       try {
-        const ce = Oz(Y);
-        o("content", ce), d("content");
-      } catch (ce) {
-        console.error(ce), c("content", {
+        const de = Oz(Y);
+        o("content", de), d("content");
+      } catch (de) {
+        console.error(de), c("content", {
           type: "custom",
-          message: ce.message
+          message: de.message
         });
       }
     }, V.onabort = () => console.log("🟨 abort"), V.onerror = () => {
@@ -28307,8 +28354,8 @@ const $z = k(({
   }] = Cn(!1), [s, {
     setTrue: i,
     setFalse: a
-  }] = $e(!1), l = ((c = oe().content.views.VIE) == null ? void 0 : c.type) === B.Tabs;
-  return l ? /* @__PURE__ */ r.jsx(ge, { label: "Please choose a tab first", children: /* @__PURE__ */ r.jsx(C, { variant: "outline", color: "gray", radius: 0, size: "xs", leftIcon: /* @__PURE__ */ r.jsx(so, { size: 16 }), sx: {
+  }] = $e(!1), l = ((c = le().content.views.VIE) == null ? void 0 : c.type) === B.Tabs;
+  return l ? /* @__PURE__ */ r.jsx(be, { label: "Please choose a tab first", children: /* @__PURE__ */ r.jsx(C, { variant: "outline", color: "gray", radius: 0, size: "xs", leftIcon: /* @__PURE__ */ r.jsx(so, { size: 16 }), sx: {
     ...Ho,
     transform: "none !important"
   }, children: "Import..." }) }) : /* @__PURE__ */ r.jsxs(r.Fragment, { children: [
@@ -28316,7 +28363,7 @@ const $z = k(({
       ...Ho
       // background: 'rgb(231, 245, 255)',
     }, children: "Import..." }),
-    /* @__PURE__ */ r.jsx(fe, { opened: e, onClose: n, title: "Import content with schema json", trapFocus: !0, onDragStart: (d) => {
+    /* @__PURE__ */ r.jsx(ge, { opened: e, onClose: n, title: "Import content with schema json", trapFocus: !0, onDragStart: (d) => {
       d.stopPropagation();
     }, withinPortal: !0, zIndex: 320, size: s ? "90vw" : 500, children: /* @__PURE__ */ r.jsx($z, { onSuccess: n, stretchModal: i, shrinkModal: a }) })
   ] });
@@ -28328,11 +28375,11 @@ const $z = k(({
   borderBottom: "1px solid #e9ecef"
 }, Vz = k(() => {
   var s;
-  const e = le(), t = ((s = e.views.VIE) == null ? void 0 : s.type) === B.Tabs, n = () => {
+  const e = ce(), t = ((s = e.views.VIE) == null ? void 0 : s.type) === B.Tabs, n = () => {
     var i;
     return (i = e.views.VIE) == null ? void 0 : i.downloadSchema();
   };
-  return t ? /* @__PURE__ */ r.jsx(ge, { label: "Please choose a tab first", children: /* @__PURE__ */ r.jsx(C, { variant: "outline", color: "gray", radius: 0, size: "xs", leftIcon: /* @__PURE__ */ r.jsx(wn, { size: 16 }), sx: {
+  return t ? /* @__PURE__ */ r.jsx(be, { label: "Please choose a tab first", children: /* @__PURE__ */ r.jsx(C, { variant: "outline", color: "gray", radius: 0, size: "xs", leftIcon: /* @__PURE__ */ r.jsx(wn, { size: 16 }), sx: {
     ...Uo,
     transform: "none !important"
   }, children: "Download this View" }) }) : /* @__PURE__ */ r.jsx(C, { variant: "outline", color: "blue", radius: 0, size: "xs", onClick: n, leftIcon: /* @__PURE__ */ r.jsx(wn, { size: 16 }), sx: {
@@ -28714,7 +28761,7 @@ const dM = {
   opened: e,
   close: t
 }) => /* @__PURE__ */ r.jsx(
-  fe,
+  ge,
   {
     size: "96vw",
     opened: e,
@@ -28780,7 +28827,7 @@ function xM({
     }), children: /* @__PURE__ */ r.jsx(b, { sx: {
       width: "calc(100% - 28px)"
     }, onClick: e, children: /* @__PURE__ */ r.jsx(j, { size: "sm", children: t }) }) }),
-    n && /* @__PURE__ */ r.jsx(ge, { label: "Edit", position: "right", withinPortal: !0, children: /* @__PURE__ */ r.jsx(W, { onClick: s, variant: "light", color: "blue", sx: {
+    n && /* @__PURE__ */ r.jsx(be, { label: "Edit", position: "right", withinPortal: !0, children: /* @__PURE__ */ r.jsx(W, { onClick: s, variant: "light", color: "blue", sx: {
       position: "absolute",
       top: 0,
       bottom: 0,
@@ -28792,7 +28839,7 @@ function xM({
   ] });
 }
 const mM = k(() => {
-  const e = oe(), t = le(), n = Be((i) => () => t.views.setIDOfVIE(i), [t]), s = (i) => {
+  const e = le(), t = ce(), n = Be((i) => () => t.views.setIDOfVIE(i), [t]), s = (i) => {
     e.editor.open(["_VIEWS_", i]);
   };
   return /* @__PURE__ */ r.jsxs(z, { sx: {
@@ -28810,7 +28857,7 @@ const mM = k(() => {
     }, children: "Add a View" })
   ] });
 }), fM = k(() => {
-  const e = oe(), t = le(), n = () => {
+  const e = le(), t = ce(), n = () => {
     if (!t.queries.firstID) {
       e.editor.open(["_QUERIES_", ""]);
       return;
@@ -28840,13 +28887,13 @@ const mM = k(() => {
           borderColor: "#e9ecef"
         }
       }, children: [
-        /* @__PURE__ */ r.jsx(ge, { label: "Filters", withinPortal: !0, children: /* @__PURE__ */ r.jsx(W, { variant: "default", radius: 0, size: "md", sx: {
+        /* @__PURE__ */ r.jsx(be, { label: "Filters", withinPortal: !0, children: /* @__PURE__ */ r.jsx(W, { variant: "default", radius: 0, size: "md", sx: {
           height: "30px"
         }, onClick: s, children: /* @__PURE__ */ r.jsx(_l, { size: 18 }) }) }),
-        /* @__PURE__ */ r.jsx(ge, { label: "Queries", withinPortal: !0, children: /* @__PURE__ */ r.jsx(W, { variant: "default", radius: 0, size: "md", sx: {
+        /* @__PURE__ */ r.jsx(be, { label: "Queries", withinPortal: !0, children: /* @__PURE__ */ r.jsx(W, { variant: "default", radius: 0, size: "md", sx: {
           height: "30px"
         }, onClick: n, children: /* @__PURE__ */ r.jsx(us, { size: 18 }) }) }),
-        /* @__PURE__ */ r.jsx(ge, { label: "Interactions Viewer", withinPortal: !0, children: /* @__PURE__ */ r.jsx(W, { variant: "default", radius: 0, size: "md", sx: {
+        /* @__PURE__ */ r.jsx(be, { label: "Interactions Viewer", withinPortal: !0, children: /* @__PURE__ */ r.jsx(W, { variant: "default", radius: 0, size: "md", sx: {
           height: "30px"
         }, onClick: o, children: /* @__PURE__ */ r.jsx(mp, { size: 18 }) }) })
       ] }),
@@ -28951,7 +28998,7 @@ const mM = k(() => {
   value: e,
   onChange: t
 }) => {
-  const n = oe(), s = le(), i = M.useMemo(() => s.queries.options, [s.queries.current]), a = i.length === 0, o = (l) => {
+  const n = le(), s = ce(), i = M.useMemo(() => s.queries.options, [s.queries.current]), a = i.length === 0, o = (l) => {
     n.editor.setPath(["_QUERIES_", l]);
   };
   return /* @__PURE__ */ r.jsx(L, { label: /* @__PURE__ */ r.jsxs(b, { position: "apart", children: [
@@ -29199,7 +29246,7 @@ const mM = k(() => {
 }], MM = k(function({
   filter: t
 }) {
-  const n = le(), s = M.useMemo(() => IM[t.type], [t.type]);
+  const n = ce(), s = M.useMemo(() => IM[t.type], [t.type]);
   return /* @__PURE__ */ r.jsxs(b, { grow: !0, spacing: 20, align: "top", children: [
     /* @__PURE__ */ r.jsxs(z, { sx: {
       maxWidth: "600px"
@@ -29239,7 +29286,7 @@ const mM = k(() => {
 }), LM = k(({
   id: e
 }) => {
-  const t = Et(), n = oe(), s = le();
+  const t = Et(), n = le(), s = ce();
   if (e === "")
     return null;
   const i = s.filters.findByID(e);
@@ -29280,7 +29327,7 @@ const mM = k(() => {
     }, children: /* @__PURE__ */ r.jsx(MM, { filter: i }) })
   ] });
 }), AM = k(() => {
-  const [e, t] = q([]), n = oe(), s = (c) => {
+  const [e, t] = q([]), n = le(), s = (c) => {
     n.editor.setPath(["_FILTERS_", c]);
   }, i = () => {
     n.content.filters.downloadSchema(e);
@@ -29351,7 +29398,7 @@ const mM = k(() => {
     ] }) }) })
   ] });
 }), RM = k(() => {
-  const e = le(), [t, n] = q(() => JSON.stringify(e.mock_context.current, null, 4)), s = () => {
+  const e = ce(), [t, n] = q(() => JSON.stringify(e.mock_context.current, null, 4)), s = () => {
     try {
       e.mock_context.replace(JSON.parse(t));
     } catch (a) {
@@ -29398,7 +29445,7 @@ const mM = k(() => {
         position: "absolute",
         right: 12,
         top: 0
-      }, disabled: !i, onClick: s, children: /* @__PURE__ */ r.jsx(pe, { size: 20 }) })
+      }, disabled: !i, onClick: s, children: /* @__PURE__ */ r.jsx(xe, { size: 20 }) })
     ] })
   ] });
 }), EM = k(() => {
@@ -29681,7 +29728,7 @@ const qM = [{
     ] })
   ] });
 }), HM = k(function() {
-  const t = oe(), n = le(), {
+  const t = le(), n = ce(), {
     panel: s
   } = It(), [i, a] = q(!1), o = (l) => {
     t.editor.setPath(["_QUERIES_", l]);
@@ -29690,10 +29737,10 @@ const qM = [{
     /* @__PURE__ */ r.jsx(mh, { opened: i, onClose: () => a(!1), title: "Choose queries", padding: "xl", size: 500, zIndex: 320, children: /* @__PURE__ */ r.jsx(K.Group, { value: [...s.queryIDs], onChange: s.setQueryIDs, children: /* @__PURE__ */ r.jsx(w, { spacing: "lg", children: n.queries.options.map((l) => /* @__PURE__ */ r.jsx(K, { label: l.label, value: l.value }, l.value)) }) }) }),
     /* @__PURE__ */ r.jsxs(w, { spacing: 6, children: [
       /* @__PURE__ */ r.jsx(b, { position: "right", children: /* @__PURE__ */ r.jsx(C, { variant: "light", size: "sm", leftIcon: /* @__PURE__ */ r.jsx(fp, { size: 16 }), onClick: () => a(!0), children: "Click me to choose queries for this panel" }) }),
-      s.queryIDs.length === 1 && /* @__PURE__ */ r.jsx(yi, { id: s.queryIDs[0], moreActions: /* @__PURE__ */ r.jsx(ge, { label: "Open this query", children: /* @__PURE__ */ r.jsx(W, { variant: "subtle", color: "blue", onClick: () => o(s.queryIDs[0]), children: /* @__PURE__ */ r.jsx(ii, { size: 16 }) }) }) }),
+      s.queryIDs.length === 1 && /* @__PURE__ */ r.jsx(yi, { id: s.queryIDs[0], moreActions: /* @__PURE__ */ r.jsx(be, { label: "Open this query", children: /* @__PURE__ */ r.jsx(W, { variant: "subtle", color: "blue", onClick: () => o(s.queryIDs[0]), children: /* @__PURE__ */ r.jsx(ii, { size: 16 }) }) }) }),
       s.queryIDs.length > 1 && /* @__PURE__ */ r.jsxs(f, { defaultValue: s.queryIDs[0], children: [
         /* @__PURE__ */ r.jsx(f.List, { children: s.queries.map((l) => /* @__PURE__ */ r.jsx(f.Tab, { value: l.id, children: l.name }, l.id)) }),
-        s.queries.map((l) => /* @__PURE__ */ r.jsx(f.Panel, { value: l.id, children: /* @__PURE__ */ r.jsx(yi, { id: l.id, moreActions: /* @__PURE__ */ r.jsx(ge, { label: "Open this query", children: /* @__PURE__ */ r.jsx(W, { variant: "subtle", color: "blue", onClick: () => o(l.id), children: /* @__PURE__ */ r.jsx(ii, { size: 16 }) }) }) }) }, l.id))
+        s.queries.map((l) => /* @__PURE__ */ r.jsx(f.Panel, { value: l.id, children: /* @__PURE__ */ r.jsx(yi, { id: l.id, moreActions: /* @__PURE__ */ r.jsx(be, { label: "Open this query", children: /* @__PURE__ */ r.jsx(W, { variant: "subtle", color: "blue", onClick: () => o(l.id), children: /* @__PURE__ */ r.jsx(ii, { size: 16 }) }) }) }) }, l.id))
       ] })
     ] })
   ] });
@@ -29823,7 +29870,7 @@ function XM({
   return /* @__PURE__ */ r.jsxs(r.Fragment, { children: [
     /* @__PURE__ */ r.jsxs(b, { position: "left", ref: s, children: [
       /* @__PURE__ */ r.jsx(j, { children: e }),
-      /* @__PURE__ */ r.jsx(W, { mr: 5, variant: "filled", color: "blue", disabled: !c, onClick: d, children: /* @__PURE__ */ r.jsx(pe, { size: 20 }) })
+      /* @__PURE__ */ r.jsx(W, { mr: 5, variant: "filled", color: "blue", disabled: !c, onClick: d, children: /* @__PURE__ */ r.jsx(xe, { size: 20 }) })
     ] }),
     /* @__PURE__ */ r.jsxs(b, { children: [
       i.map((p, x) => /* @__PURE__ */ r.jsx(ji, { value: p, onChange: (y) => {
@@ -29852,7 +29899,7 @@ function ZM({
   return /* @__PURE__ */ r.jsxs(r.Fragment, { children: [
     /* @__PURE__ */ r.jsxs(b, { position: "left", ref: i, children: [
       /* @__PURE__ */ r.jsx(j, { children: e }),
-      /* @__PURE__ */ r.jsx(W, { mr: 5, variant: "filled", color: "blue", disabled: !d, onClick: u, children: /* @__PURE__ */ r.jsx(pe, { size: 20 }) })
+      /* @__PURE__ */ r.jsx(W, { mr: 5, variant: "filled", color: "blue", disabled: !d, onClick: u, children: /* @__PURE__ */ r.jsx(xe, { size: 20 }) })
     ] }),
     /* @__PURE__ */ r.jsxs(b, { children: [
       a.map((h, p) => /* @__PURE__ */ r.jsx(D, { type: s, value: h, onChange: (x) => {
@@ -30022,7 +30069,7 @@ const lL = k(({
     s(e);
   }, [e]);
   const i = oL(), a = e !== n;
-  return /* @__PURE__ */ r.jsx(L, { label: "Visualization", value: n, searchable: !0, onChange: s, data: i, rightSection: /* @__PURE__ */ r.jsx(W, { disabled: !a, onClick: () => t(n), children: /* @__PURE__ */ r.jsx(pe, { size: 20 }) }), maxDropdownHeight: 600 });
+  return /* @__PURE__ */ r.jsx(L, { label: "Visualization", value: n, searchable: !0, onChange: s, data: i, rightSection: /* @__PURE__ */ r.jsx(W, { disabled: !a, onClick: () => t(n), children: /* @__PURE__ */ r.jsx(xe, { size: 20 }) }), maxDropdownHeight: 600 });
 }), Yo = [];
 function cL(e, t) {
   try {
@@ -30104,7 +30151,7 @@ const uL = k(() => {
   panel: e,
   sourceViewID: t
 }) => {
-  const n = le(), [s, i] = q(t);
+  const n = ce(), [s, i] = q(t);
   O(() => {
     i(t);
   }, [t]);
@@ -30116,7 +30163,7 @@ const uL = k(() => {
   };
   return /* @__PURE__ */ r.jsxs(r.Fragment, { children: [
     /* @__PURE__ */ r.jsx(C, { size: "xs", variant: "subtle", color: "blue", onClick: o, leftIcon: /* @__PURE__ */ r.jsx(Sl, { size: 14 }), children: "Move into Another View" }),
-    /* @__PURE__ */ r.jsx(fe, { opened: a, onClose: l, title: "Move panel into another view", zIndex: 320, children: /* @__PURE__ */ r.jsxs(w, { sx: {
+    /* @__PURE__ */ r.jsx(ge, { opened: a, onClose: l, title: "Move panel into another view", zIndex: 320, children: /* @__PURE__ */ r.jsxs(w, { sx: {
       maxHeight: "calc(100vh - 185px)",
       overflow: "hidden"
     }, children: [
@@ -30178,7 +30225,7 @@ function xL(e) {
 const mL = k(({
   panel: e
 }) => {
-  const t = Et(), n = oe(), s = le(), [i, a] = q("Data"), o = e.queries, c = xL(e.viz.type) && e.dataLoading, d = c || e.queryErrors.length > 0 || e.queryStateMessages !== "" || o.length === 0, u = n.editor.path[1];
+  const t = Et(), n = le(), s = ce(), [i, a] = q("Data"), o = e.queries, c = xL(e.viz.type) && e.dataLoading, d = c || e.queryErrors.length > 0 || e.queryStateMessages !== "" || o.length === 0, u = n.editor.path[1];
   O(() => {
     a((x) => d && x === "Visualization" ? "Data" : x);
   }, [e.id, d]);
@@ -30220,8 +30267,8 @@ const mL = k(({
       /* @__PURE__ */ r.jsxs(f.List, { children: [
         /* @__PURE__ */ r.jsx(f.Tab, { value: "Data", disabled: c, children: "Data" }),
         /* @__PURE__ */ r.jsx(f.Tab, { value: "Panel", children: "Panel" }),
-        /* @__PURE__ */ r.jsx(f.Tab, { value: "Variables", disabled: d, children: /* @__PURE__ */ r.jsx(ge, { label: "Requires data", disabled: !d, withinPortal: !0, zIndex: 310, children: /* @__PURE__ */ r.jsx(j, { children: "Variables" }) }) }),
-        /* @__PURE__ */ r.jsx(f.Tab, { value: "Visualization", disabled: d, children: /* @__PURE__ */ r.jsx(ge, { label: "Requires data", disabled: !d, withinPortal: !0, zIndex: 310, children: /* @__PURE__ */ r.jsx(j, { children: "Visualization" }) }) }),
+        /* @__PURE__ */ r.jsx(f.Tab, { value: "Variables", disabled: d, children: /* @__PURE__ */ r.jsx(be, { label: "Requires data", disabled: !d, withinPortal: !0, zIndex: 310, children: /* @__PURE__ */ r.jsx(j, { children: "Variables" }) }) }),
+        /* @__PURE__ */ r.jsx(f.Tab, { value: "Visualization", disabled: d, children: /* @__PURE__ */ r.jsx(be, { label: "Requires data", disabled: !d, withinPortal: !0, zIndex: 310, children: /* @__PURE__ */ r.jsx(j, { children: "Visualization" }) }) }),
         /* @__PURE__ */ r.jsx(f.Tab, { value: "Interactions", children: "Interactions" })
       ] }),
       /* @__PURE__ */ r.jsxs(f.Panel, { value: "Data", children: [
@@ -30238,7 +30285,7 @@ const mL = k(({
   viewID: e,
   panelID: t
 }) => {
-  const n = le();
+  const n = ce();
   if (!n.views.findByID(e))
     return /* @__PURE__ */ r.jsxs(j, { size: 14, children: [
       "View by ID[",
@@ -30252,7 +30299,7 @@ const mL = k(({
     "] is not found"
   ] });
 }), gL = k(() => {
-  const [e, t] = q([]), n = Et(), s = oe(), i = (h) => {
+  const [e, t] = q([]), n = Et(), s = le(), i = (h) => {
     s.editor.setPath(["_QUERIES_", h]);
   }, a = () => {
     n.openConfirmModal({
@@ -30359,7 +30406,7 @@ const mL = k(({
 }), bL = (e) => {
   const {
     queryModel: t
-  } = e, n = oe(), s = le(), a = s.findQueryUsage(t.id).length > 0, o = Et(), l = () => {
+  } = e, n = le(), s = ce(), a = s.findQueryUsage(t.id).length > 0, o = Et(), l = () => {
     o.openConfirmModal({
       title: "Delete this query?",
       labels: {
@@ -30376,7 +30423,7 @@ const mL = k(({
       zIndex: 320
     });
   };
-  return a ? /* @__PURE__ */ r.jsx(ge, { label: "Can't delete this query for it's being used, check out Usage tab for details", withArrow: !0, events: {
+  return a ? /* @__PURE__ */ r.jsx(be, { label: "Can't delete this query for it's being used, check out Usage tab for details", withArrow: !0, events: {
     hover: !0,
     focus: !1,
     touch: !1
@@ -30397,14 +30444,14 @@ const mL = k(({
   /* @__PURE__ */ r.jsx(eo, { width: t, height: n, radius: "xs" })
 ] }), or = ({
   value: e
-}) => e === null || e === "" ? null : /* @__PURE__ */ r.jsx(ge, { label: e, disabled: !e, multiline: !0, children: /* @__PURE__ */ r.jsx(W, { children: /* @__PURE__ */ r.jsx(Tn, { size: 14 }) }) }), jL = ({
+}) => e === null || e === "" ? null : /* @__PURE__ */ r.jsx(be, { label: e, disabled: !e, multiline: !0, children: /* @__PURE__ */ r.jsx(W, { children: /* @__PURE__ */ r.jsx(Tn, { size: 14 }) }) }), jL = ({
   column: e
 }) => {
   const {
     column_key: t,
     column_key_text: n
   } = e;
-  return t ? /* @__PURE__ */ r.jsx(ge, { label: n, disabled: !n, children: /* @__PURE__ */ r.jsx(bn, { children: t }) }) : null;
+  return t ? /* @__PURE__ */ r.jsx(be, { label: n, disabled: !n, children: /* @__PURE__ */ r.jsx(bn, { children: t }) }) : null;
 }, vL = k(({
   dataSource: e
 }) => {
@@ -30743,7 +30790,7 @@ const TL = k(({
 }) => {
   const [n, s] = q(!1);
   return e.type === "http" ? null : /* @__PURE__ */ r.jsxs(r.Fragment, { children: [
-    /* @__PURE__ */ r.jsx(fe, { opened: n, onClose: () => s(!1), title: /* @__PURE__ */ r.jsxs(b, { position: "apart", sx: {
+    /* @__PURE__ */ r.jsx(ge, { opened: n, onClose: () => s(!1), title: /* @__PURE__ */ r.jsxs(b, { position: "apart", sx: {
       flexGrow: 1
     }, children: [
       /* @__PURE__ */ r.jsx(j, { fw: 500, children: "Explorer Data Source" }),
@@ -30766,7 +30813,7 @@ const TL = k(({
       }
     }, ...t, children: "See Table Structure" })
   ] });
-}), FL = ue(({
+}), FL = he(({
   label: e,
   type: t,
   ...n
@@ -30789,7 +30836,7 @@ const TL = k(({
   value: e,
   onChange: t
 }) => {
-  const n = oe(), {
+  const n = le(), {
     data: s = [],
     loading: i
   } = yn(Ai, {
@@ -30834,7 +30881,7 @@ const TL = k(({
       }
     }
   }, disabled: i, value: e.key, onChange: l });
-}), Xo = ue((e, t) => {
+}), Xo = he((e, t) => {
   const {
     label: n,
     description: s,
@@ -30888,7 +30935,7 @@ function PL({
   ] });
 }
 const VL = k(() => {
-  const t = [...oe().globalSQLSnippets.list];
+  const t = [...le().globalSQLSnippets.list];
   return t.length === 0 ? null : /* @__PURE__ */ r.jsxs(We, { horizontalSpacing: "xs", verticalSpacing: "xs", fontSize: "sm", highlightOnHover: !0, children: [
     /* @__PURE__ */ r.jsx("thead", { children: /* @__PURE__ */ r.jsxs("tr", { children: [
       /* @__PURE__ */ r.jsx("th", { children: "Key" }),
@@ -30922,7 +30969,7 @@ WHERE
   showSQLSnippets: t = !0,
   sx: n = {}
 }) {
-  const s = oe(), i = le(), a = s.context.current, o = (() => {
+  const s = le(), i = ce(), a = s.context.current, o = (() => {
     const l = {
       context: {
         ...i.mock_context.current,
@@ -30955,7 +31002,7 @@ WHERE
 }), Da = k(() => {
   const [e, t] = q(!1);
   return /* @__PURE__ */ r.jsxs(r.Fragment, { children: [
-    /* @__PURE__ */ r.jsx(fe, { opened: e, onClose: () => t(!1), title: "Query Variables", zIndex: 320, size: "800px", children: /* @__PURE__ */ r.jsx(Tu, {}) }),
+    /* @__PURE__ */ r.jsx(ge, { opened: e, onClose: () => t(!1), title: "Query Variables", zIndex: 320, size: "800px", children: /* @__PURE__ */ r.jsx(Tu, {}) }),
     /* @__PURE__ */ r.jsx(C, { variant: "subtle", onClick: () => t(!0), px: 16, styles: {
       inner: {
         justifyContent: "flex-start"
@@ -30985,7 +31032,7 @@ WHERE
   queryID: e,
   usage: t
 }) => {
-  const n = oe().editor, s = (a) => {
+  const n = le().editor, s = (a) => {
     if (a.type === "filter") {
       n.setPath(["_FILTERS_", a.id]);
       return;
@@ -31060,7 +31107,7 @@ WHERE
         }
       }, children: /* @__PURE__ */ r.jsx(Ti, { size: 12 }) }), children: o.key }, o.key)) })
     ] }, i)) }) })
-  ] }) : /* @__PURE__ */ r.jsx(ge, { label: "This query has no dependency", children: /* @__PURE__ */ r.jsx(C, { size: "xs", variant: "subtle", color: "gray", leftIcon: /* @__PURE__ */ r.jsx(vp, { size: 16, style: {
+  ] }) : /* @__PURE__ */ r.jsx(be, { label: "This query has no dependency", children: /* @__PURE__ */ r.jsx(C, { size: "xs", variant: "subtle", color: "gray", leftIcon: /* @__PURE__ */ r.jsx(vp, { size: 16, style: {
     transform: "rotate(180deg)"
   } }), sx: {
     transform: "none !important"
@@ -31152,7 +31199,7 @@ WHERE
 }, XL = k(({
   queryModel: e
 }) => {
-  const t = le();
+  const t = ce();
   return e.isTransform ? /* @__PURE__ */ r.jsxs(w, { py: 20, px: 20, sx: {
     height: "100%"
   }, children: [
@@ -31170,7 +31217,7 @@ WHERE
 }, JL = k(({
   queryModel: e
 }) => {
-  const t = le(), n = T(() => e.datasource ? e.typedAsHTTP ? "HTTP" : "SQL" : "Configurations", [e.datasource, e.typedAsHTTP]), [s, i] = q(n);
+  const t = ce(), n = T(() => e.datasource ? e.typedAsHTTP ? "HTTP" : "SQL" : "Configurations", [e.datasource, e.typedAsHTTP]), [s, i] = q(n);
   O(() => {
     i((l) => l !== "Configurations" && n === "Configurations" ? "Configurations" : l);
   }, [n]);
@@ -31183,8 +31230,8 @@ WHERE
       e.typedAsSQL && /* @__PURE__ */ r.jsx(f.Tab, { value: "SQL", children: "Request" }),
       e.typedAsHTTP && /* @__PURE__ */ r.jsx(f.Tab, { value: "HTTP", children: "Request" }),
       e.isTransform && /* @__PURE__ */ r.jsx(f.Tab, { value: "Transform", children: "Transform" }),
-      /* @__PURE__ */ r.jsx(f.Tab, { value: "Data", disabled: !e.canPreviewData, children: /* @__PURE__ */ r.jsx(ge, { label: e.guideToPreviewData, disabled: e.canPreviewData, withinPortal: !0, children: /* @__PURE__ */ r.jsx(j, { children: "Data" }) }) }),
-      /* @__PURE__ */ r.jsx(f.Tab, { value: "Usage", disabled: o, children: /* @__PURE__ */ r.jsx(ge, { label: "This query is not used for any filter or panel", disabled: !o, withinPortal: !0, children: /* @__PURE__ */ r.jsx(j, { children: "Usage" }) }) })
+      /* @__PURE__ */ r.jsx(f.Tab, { value: "Data", disabled: !e.canPreviewData, children: /* @__PURE__ */ r.jsx(be, { label: e.guideToPreviewData, disabled: e.canPreviewData, withinPortal: !0, children: /* @__PURE__ */ r.jsx(j, { children: "Data" }) }) }),
+      /* @__PURE__ */ r.jsx(f.Tab, { value: "Usage", disabled: o, children: /* @__PURE__ */ r.jsx(be, { label: "This query is not used for any filter or panel", disabled: !o, withinPortal: !0, children: /* @__PURE__ */ r.jsx(j, { children: "Usage" }) }) })
     ] }),
     /* @__PURE__ */ r.jsx(f.Panel, { value: "Configurations", pt: 0, p: 0, children: /* @__PURE__ */ r.jsx($L, { queryModel: e }) }),
     e.typedAsSQL && /* @__PURE__ */ r.jsx(f.Panel, { value: "SQL", sx: nr, children: /* @__PURE__ */ r.jsx(w, { sx: {
@@ -31208,7 +31255,7 @@ WHERE
 }), ZL = k(({
   id: e
 }) => {
-  const n = le().queries.findByID(e);
+  const n = ce().queries.findByID(e);
   return e === "" ? null : n ? /* @__PURE__ */ r.jsx(JL, { queryModel: n }) : /* @__PURE__ */ r.jsx(j, { size: 14, color: "red", children: "Invalid Query ID" });
 }), eA = k(({
   value: e
@@ -31261,7 +31308,7 @@ WHERE
           sx: {
             flexGrow: "1 !important"
           },
-          rightSection: /* @__PURE__ */ r.jsx(W, { color: "blue", variant: "subtle", onClick: l, disabled: !c || d, children: /* @__PURE__ */ r.jsx(pe, { size: 16 }) }),
+          rightSection: /* @__PURE__ */ r.jsx(W, { color: "blue", variant: "subtle", onClick: l, disabled: !c || d, children: /* @__PURE__ */ r.jsx(xe, { size: 16 }) }),
           error: d
         }
       ),
@@ -31284,7 +31331,7 @@ WHERE
           position: "absolute",
           top: 0,
           right: 10
-        }, children: /* @__PURE__ */ r.jsx(pe, { size: 18 }) })
+        }, children: /* @__PURE__ */ r.jsx(xe, { size: 18 }) })
       ] }),
       /* @__PURE__ */ r.jsx(f.Panel, { value: "SQL", pt: "sm", children: /* @__PURE__ */ r.jsx(Ia, { height: "100%", value: u, onChange: h, defaultLanguage: "sql", theme: "sql-dark" }) }),
       /* @__PURE__ */ r.jsx(f.Panel, { value: "Preview", pt: "sm", children: /* @__PURE__ */ r.jsx(eA, { value: u }) })
@@ -31293,7 +31340,7 @@ WHERE
 }), nA = k(({
   id: e
 }) => {
-  const t = oe(), n = le(), s = T(() => n.sqlSnippets.findByKey(e), [e]);
+  const t = le(), n = ce(), s = T(() => n.sqlSnippets.findByKey(e), [e]);
   if (!e)
     return null;
   if (!s)
@@ -31311,7 +31358,7 @@ WHERE
   };
   return /* @__PURE__ */ r.jsx(tA, { item: s, remove: a, onKeyChanged: o });
 }), rA = k(() => {
-  const [e, t] = q([]), n = Et(), s = oe(), i = (h) => {
+  const [e, t] = q([]), n = Et(), s = le(), i = (h) => {
     s.editor.setPath(["_SQL_SNIPPETS_", h]);
   }, a = () => {
     n.openConfirmModal({
@@ -31407,7 +31454,7 @@ WHERE
 }), sA = k(({
   id: e
 }) => {
-  const t = Et(), n = oe(), s = le();
+  const t = Et(), n = le(), s = ce();
   if (e === "")
     return null;
   const i = s.views.findByID(e);
@@ -31478,10 +31525,10 @@ function xA(e) {
 const mA = k(() => /* @__PURE__ */ r.jsx(w, { sx: {
   height: "100%"
 }, p: "sm", children: /* @__PURE__ */ r.jsx(Tu, {}) })), fA = k(() => {
-  const e = oe().editor, t = e.path;
+  const e = le().editor, t = e.path;
   return iA(t) ? /* @__PURE__ */ r.jsx(mA, {}) : aA(t) ? /* @__PURE__ */ r.jsx(RM, {}) : oA(t) ? /* @__PURE__ */ r.jsx(AM, {}) : lA(t) ? /* @__PURE__ */ r.jsx(z, { p: "xs", pl: 20, children: /* @__PURE__ */ r.jsx(LM, { id: t[1] }) }) : cA(t) ? /* @__PURE__ */ r.jsx(rA, {}) : dA(t) ? /* @__PURE__ */ r.jsx(nA, { id: t[1] }) : hA(t) ? /* @__PURE__ */ r.jsx(gL, {}) : uA(t) ? /* @__PURE__ */ r.jsx(ZL, { id: t[1] }) : pA(t) ? /* @__PURE__ */ r.jsx(z, { p: "xs", pl: 20, children: /* @__PURE__ */ r.jsx(sA, { id: t[1] }) }) : xA(t) ? /* @__PURE__ */ r.jsx(fL, { viewID: t[1], panelID: t[3] }) : /* @__PURE__ */ r.jsx(z, { children: e.path });
 }), gA = k(() => /* @__PURE__ */ r.jsx(fA, {})), bA = k(() => {
-  const e = oe(), t = () => {
+  const e = le(), t = () => {
     const n = (/* @__PURE__ */ new Date()).getTime().toString(), s = {
       id: n,
       key: n,
@@ -31505,7 +31552,7 @@ const mA = k(() => /* @__PURE__ */ r.jsx(w, { sx: {
 }), yA = k(({
   parentID: e
 }) => {
-  const t = le();
+  const t = ce();
   if (!e)
     return null;
   const n = t.views.findByID(e);
@@ -31518,7 +31565,7 @@ const mA = k(() => /* @__PURE__ */ r.jsx(w, { sx: {
     }
   }, children: "Add a Panel" });
 }), jA = k(() => {
-  const e = oe(), t = () => {
+  const e = le(), t = () => {
     const n = (/* @__PURE__ */ new Date()).getTime().toString(), s = {
       id: n,
       name: n,
@@ -31537,7 +31584,7 @@ const mA = k(() => /* @__PURE__ */ r.jsx(w, { sx: {
     }
   }, children: "Add a Query" });
 }), vA = k(() => {
-  const e = oe(), t = () => {
+  const e = le(), t = () => {
     const n = (/* @__PURE__ */ new Date()).getTime().toString(), s = {
       key: n,
       value: ""
@@ -31553,7 +31600,7 @@ const mA = k(() => /* @__PURE__ */ r.jsx(w, { sx: {
     }
   }, children: "Add a SQL Snippet" });
 }), wA = k(() => {
-  const e = le();
+  const e = ce();
   return /* @__PURE__ */ r.jsx(C, { variant: "subtle", leftIcon: /* @__PURE__ */ r.jsx(ft, { size: 14 }), size: "sm", px: "xs", mb: 10, color: "blue", onClick: e.views.addARandomNewView, sx: {
     width: "100%",
     borderRadius: 0
@@ -31563,7 +31610,7 @@ const mA = k(() => /* @__PURE__ */ r.jsx(w, { sx: {
     }
   }, children: "Add a View" });
 }), _A = k(() => {
-  const e = oe();
+  const e = le();
   return /* @__PURE__ */ r.jsx(C, { variant: "subtle", rightIcon: /* @__PURE__ */ r.jsx(hs, { size: 14 }), size: "sm", px: 12, mb: 0, color: "blue", onClick: () => e.editor.setPath(["_QUERIES_"]), sx: {
     width: "100%",
     borderRadius: 0,
@@ -31574,7 +31621,7 @@ const mA = k(() => /* @__PURE__ */ r.jsx(w, { sx: {
     }
   }, children: "Manage Queries" });
 }), SA = k(() => {
-  const e = oe();
+  const e = le();
   return /* @__PURE__ */ r.jsx(C, { variant: "subtle", rightIcon: /* @__PURE__ */ r.jsx(hs, { size: 14 }), size: "sm", px: 12, mb: 0, color: "blue", onClick: () => e.editor.setPath(["_SQL_SNIPPETS_"]), sx: {
     width: "100%",
     borderRadius: 0,
@@ -31585,7 +31632,7 @@ const mA = k(() => /* @__PURE__ */ r.jsx(w, { sx: {
     }
   }, children: "Manage SQL Snippets" });
 }), CA = k(() => {
-  const e = oe();
+  const e = le();
   return /* @__PURE__ */ r.jsx(C, { variant: "subtle", rightIcon: /* @__PURE__ */ r.jsx(hs, { size: 14 }), size: "sm", px: 12, mb: 0, color: "blue", onClick: () => e.editor.setPath(["_FILTERS_"]), sx: {
     width: "100%",
     borderRadius: 0,
@@ -31602,17 +31649,17 @@ const mA = k(() => /* @__PURE__ */ r.jsx(w, { sx: {
   option: e
 }) => {
   var d;
-  const t = oe().editor, n = t.isOptionActive, s = n(t.path, e), i = t.isOptionOpened, a = t.navigate, o = i(e), [l, c] = q(o);
+  const t = le().editor, n = t.isOptionActive, s = n(t.path, e), i = t.isOptionOpened, a = t.navigate, o = i(e), [l, c] = q(o);
   return O(() => {
     c(o);
   }, [o]), /* @__PURE__ */ r.jsx(ri, { active: s, defaultOpened: o, opened: l, onChange: c, label: e.label, onClick: () => a(e), icon: e.Icon ? /* @__PURE__ */ r.jsx(e.Icon, { size: 18 }) : null, children: (d = e.children) == null ? void 0 : d.map((u) => u._type === "ACTION" ? /* @__PURE__ */ r.jsx(kA, { action_type: u._action_type, parentID: u.parentID }, `_ADD_${u.value}_`) : /* @__PURE__ */ r.jsx(Du, { option: u }, u.value)) }, e.label);
 }), TA = k(() => {
-  const e = oe();
+  const e = le();
   return /* @__PURE__ */ r.jsx(z, { sx: {
     position: "relative"
   }, children: e.editor.navOptions.map((t) => /* @__PURE__ */ r.jsx(Du, { option: t }, t.value)) });
 }), DA = k(() => {
-  const e = oe();
+  const e = le();
   return /* @__PURE__ */ r.jsxs(Nt, { p: 0, width: {
     base: 220,
     xs: 220,
@@ -31662,8 +31709,8 @@ const mA = k(() => /* @__PURE__ */ r.jsx(w, { sx: {
     height: "100vh"
   }
 }, zA = k(() => {
-  const e = oe().editor;
-  return /* @__PURE__ */ r.jsx(fe, { onClose: () => e.setSettingsOpen(!1), closeOnEscape: !1, closeOnClickOutside: !1, opened: e.settings_open, fullScreen: !0, title: null, transitionProps: {
+  const e = le().editor;
+  return /* @__PURE__ */ r.jsx(ge, { onClose: () => e.setSettingsOpen(!1), closeOnEscape: !1, closeOnClickOutside: !1, opened: e.settings_open, fullScreen: !0, title: null, transitionProps: {
     duration: 0
   }, withCloseButton: !1, withinPortal: !0, zIndex: 300, styles: {
     body: {
@@ -31749,7 +31796,7 @@ const AA = {
     }, children: x.content.views.visibleViews.map((F) => /* @__PURE__ */ r.jsx(HI, { view: F }, F.id)) }) }),
     /* @__PURE__ */ r.jsx(zA, {})
   ] }) }) }) }) }) }) });
-}, MR = k(ue(RA));
+}, MR = k(he(RA));
 const Iu = m.model({
   id: m.string,
   name: m.string,
@@ -32105,8 +32152,8 @@ export {
   TR as initialDashboardContent,
   ac as useDashboardContext,
   Vm as useDashboardThemeContext,
-  le as useEditContentModelContext,
-  oe as useEditDashboardContext,
+  ce as useEditContentModelContext,
+  le as useEditDashboardContext,
   It as useEditPanelContext,
   Bm as useFullScreenPanelContext,
   II as usePanelFullScreen,