react-semaphor 0.0.183 → 0.0.185

package/dist/chunks/{dashboard-plus-upSoeQoI.js → dashboard-plus-jyu8EApE.js}

@@ -1,12 +1,12 @@
-import { P as T, b as k, j as e, Q as ds, R as hs, U as w, V as Us, W as ms, X as us, Y as xs, Z as ps, _ as B, $ as ae, a0 as Js, J as Ps, O as Ee, a1 as Ia, a2 as qa, a3 as Va, a4 as Ra, a5 as _a, a6 as Ha, a7 as Fs, a8 as Re, a9 as $e, aa as We, T as fs, e as Gs, g as gs, ab as Oe, ac as Me, f as W, ad as Te, ae as Ae, af as _e, ag as Le, ah as X, ai as js, G as r, aj as Ke, ak as Ue, al as Ba, am as Je, w as Qs, v as Ws, t as he, an as $a, r as Ka, N as Ys, s as Ua, ao as Ja, B as Pa, ap as Xs, aq as Ga, L as He, S as bs, z as Qa, n as Os, ar as Ms, A as rs, u as es, as as Ce, at as ze, au as Zs, av as ea, aw as sa, ax as aa, ay as ta, az as Wa, aA as Ya, aB as na, aC as Xa, aD as Za, aE as et, aF as st, aG as at, aH as is, aI as tt, aJ as Qe, aK as os, aL as Fe, aM as cs, aN as Ts, aO as nt, aP as lt, aQ as rt, aR as it, aS as ot, aT as ls, aU as ct, aV as As, aW as dt, aX as Es, aY as ht, aZ as mt, a_ as ut, a$ as la, l as xt, C as pt, E as Ls, d as ft, h as gt, i as jt, o as bt, b0 as yt, m as vt, b1 as Nt, b2 as Ct, b3 as St, b4 as Ds, b5 as kt, b6 as Is, b7 as qs, K as wt, b8 as ys, b9 as zt, ba as ra, bb as Ye, bc as ia, bd as Ft, be as Ot, bf as Mt, bg as Tt, bh as At, bi as Et, bj as Se, bk as q, bl as V, bm as vs, bn as R, bo as Vs, bp as Lt, bq as Dt, br as It, bs as qt, bt as Rs, bu as Vt, bv as Rt, bw as _t, bx as Ht, by as Bt, bz as $t } from "./index-71zNxWPN.js";
-import me, { useState as M, useEffect as K, useMemo as Kt, useRef as Be } from "react";
+import { P as L, b as k, j as e, Q as us, R as xs, U as z, V as $s, W as ps, X as fs, Y as gs, Z as js, _ as R, $ as ae, a0 as Ks, J as Us, O as Ae, a1 as Ia, a2 as qa, a3 as Va, a4 as Ra, a5 as _a, a6 as Ha, a7 as Os, a8 as Re, a9 as $e, aa as We, T as bs, e as Ps, g as ys, ab as Fe, ac as Oe, f as W, ad as Me, ae as Te, af as _e, ag as Le, ah as X, ai as vs, G as r, aj as Ke, ak as Ue, al as Ba, am as Pe, w as Gs, v as Js, t as he, an as $a, r as Ka, N as Qs, s as Ua, ao as Pa, B as Ga, ap as Ws, aq as Ja, L as He, S as Ns, z as Qa, n as Ms, ar as Ts, A as cs, u as es, as as Ce, at as we, au as Ys, av as Xs, aw as Zs, ax as ea, ay as sa, az as Wa, aA as Ya, aB as aa, aC as Xa, aD as Za, aE as et, aF as st, aG as at, aH as ds, aI as tt, aJ as Ve, aK as hs, aL as ze, aM as ms, aN as As, aO as nt, aP as lt, aQ as rt, aR as it, aS as ot, aT as ls, aU as ct, aV as Ls, aW as dt, aX as Es, aY as ht, aZ as mt, a_ as ut, a$ as ta, l as xt, C as pt, E as Ds, d as ft, h as gt, i as jt, o as bt, b0 as yt, m as vt, H as Nt, b1 as Ct, b2 as St, b3 as kt, b4 as rs, b5 as wt, b6 as is, b7 as Is, K as zt, b8 as Cs, b9 as Ft, ba as na, bb as Ot, bc as la, bd as Ye, be as Mt, bf as Ee, bg as _, bh as H, bi as ra, bj as B, bk as qs, bl as Tt, bm as At, bn as Lt, bo as Et, bp as Dt, bq as It, br as qt, bs as Vt, bt as Vs, bu as Rt, bv as _t, bw as Ht, bx as Bt, by as $t, bz as Kt } from "./index-zzQRnCNa.js";
+import me, { useState as T, useEffect as K, useMemo as Ut, useRef as Be } from "react";
 /**
  * @license lucide-react v0.379.0 - ISC
  *
  * This source code is licensed under the ISC license.
  * See the LICENSE file in the root directory of this source tree.
  */
-const Ut = T("Activity", [
+const Pt = L("Activity", [
   [
     "path",
     {
@@ -21,7 +21,7 @@ const Ut = T("Activity", [
  * This source code is licensed under the ISC license.
  * See the LICENSE file in the root directory of this source tree.
  */
-const Jt = T("AreaChart", [
+const Gt = L("AreaChart", [
   ["path", { d: "M3 3v18h18", key: "1s2lah" }],
   ["path", { d: "M7 12v5h12V8l-5 5-4-4Z", key: "zxz28u" }]
 ]);
@@ -31,7 +31,7 @@ const Jt = T("AreaChart", [
  * This source code is licensed under the ISC license.
  * See the LICENSE file in the root directory of this source tree.
  */
-const Ns = T("BarChart4", [
+const Ss = L("BarChart4", [
   ["path", { d: "M3 3v18h18", key: "1s2lah" }],
   ["path", { d: "M13 17V9", key: "1fwyjl" }],
   ["path", { d: "M18 17V5", key: "sfb6ij" }],
@@ -43,7 +43,7 @@ const Ns = T("BarChart4", [
  * This source code is licensed under the ISC license.
  * See the LICENSE file in the root directory of this source tree.
  */
-const Pt = T("CircleX", [
+const Jt = L("CircleX", [
   ["circle", { cx: "12", cy: "12", r: "10", key: "1mglay" }],
   ["path", { d: "m15 9-6 6", key: "1uzhvr" }],
   ["path", { d: "m9 9 6 6", key: "z0biqf" }]
@@ -54,7 +54,7 @@ const Pt = T("CircleX", [
  * This source code is licensed under the ISC license.
  * See the LICENSE file in the root directory of this source tree.
  */
-const Gt = T("Database", [
+const Qt = L("Database", [
   ["ellipse", { cx: "12", cy: "5", rx: "9", ry: "3", key: "msslwz" }],
   ["path", { d: "M3 5V19A9 3 0 0 0 21 19V5", key: "1wlel7" }],
   ["path", { d: "M3 12A9 3 0 0 0 21 12", key: "mv7ke4" }]
@@ -65,7 +65,7 @@ const Gt = T("Database", [
  * This source code is licensed under the ISC license.
  * See the LICENSE file in the root directory of this source tree.
  */
-const Qt = T("Eraser", [
+const Wt = L("Eraser", [
   [
     "path",
     {
@@ -82,7 +82,7 @@ const Qt = T("Eraser", [
  * This source code is licensed under the ISC license.
  * See the LICENSE file in the root directory of this source tree.
  */
-const oa = T("Filter", [
+const ia = L("Filter", [
   ["polygon", { points: "22 3 2 3 10 12.46 10 19 14 21 14 12.46 22 3", key: "1yg77f" }]
 ]);
 /**
@@ -91,7 +91,18 @@ const oa = T("Filter", [
  * This source code is licensed under the ISC license.
  * See the LICENSE file in the root directory of this source tree.
  */
-const Wt = T("Glasses", [
+const oa = L("GanttChart", [
+  ["path", { d: "M8 6h10", key: "9lnwnk" }],
+  ["path", { d: "M6 12h9", key: "1g9pqf" }],
+  ["path", { d: "M11 18h7", key: "c8dzvl" }]
+]);
+/**
+ * @license lucide-react v0.379.0 - ISC
+ *
+ * This source code is licensed under the ISC license.
+ * See the LICENSE file in the root directory of this source tree.
+ */
+const Yt = L("Glasses", [
   ["circle", { cx: "6", cy: "15", r: "4", key: "vux9w4" }],
   ["circle", { cx: "18", cy: "15", r: "4", key: "18o8ve" }],
   ["path", { d: "M14 15a2 2 0 0 0-2-2 2 2 0 0 0-2 2", key: "1ag4bs" }],
@@ -104,7 +115,7 @@ const Wt = T("Glasses", [
  * This source code is licensed under the ISC license.
  * See the LICENSE file in the root directory of this source tree.
  */
-const Yt = T("Hammer", [
+const Xt = L("Hammer", [
   ["path", { d: "m15 12-8.373 8.373a1 1 0 1 1-3-3L12 9", key: "eefl8a" }],
   ["path", { d: "m18 15 4-4", key: "16gjal" }],
   [
@@ -121,7 +132,7 @@ const Yt = T("Hammer", [
  * This source code is licensed under the ISC license.
  * See the LICENSE file in the root directory of this source tree.
  */
-const Xt = T("Hash", [
+const Zt = L("Hash", [
   ["line", { x1: "4", x2: "20", y1: "9", y2: "9", key: "4lhtct" }],
   ["line", { x1: "4", x2: "20", y1: "15", y2: "15", key: "vyu0kd" }],
   ["line", { x1: "10", x2: "8", y1: "3", y2: "21", key: "1ggp8o" }],
@@ -133,7 +144,7 @@ const Xt = T("Hash", [
  * This source code is licensed under the ISC license.
  * See the LICENSE file in the root directory of this source tree.
  */
-const Zt = T("Key", [
+const en = L("Key", [
   ["path", { d: "m15.5 7.5 2.3 2.3a1 1 0 0 0 1.4 0l2.1-2.1a1 1 0 0 0 0-1.4L19 4", key: "g0fldk" }],
   ["path", { d: "m21 2-9.6 9.6", key: "1j0ho8" }],
   ["circle", { cx: "7.5", cy: "15.5", r: "5.5", key: "yqb3hr" }]
@@ -144,7 +155,7 @@ const Zt = T("Key", [
  * This source code is licensed under the ISC license.
  * See the LICENSE file in the root directory of this source tree.
  */
-const Cs = T("LineChart", [
+const ks = L("LineChart", [
   ["path", { d: "M3 3v18h18", key: "1s2lah" }],
   ["path", { d: "m19 9-5 5-4-4-3 3", key: "2osh9i" }]
 ]);
@@ -154,7 +165,7 @@ const Cs = T("LineChart", [
  * This source code is licensed under the ISC license.
  * See the LICENSE file in the root directory of this source tree.
  */
-const en = T("ListEnd", [
+const sn = L("ListEnd", [
   ["path", { d: "M16 12H3", key: "1a2rj7" }],
   ["path", { d: "M16 6H3", key: "1wxfjs" }],
   ["path", { d: "M10 18H3", key: "13769t" }],
@@ -167,7 +178,7 @@ const en = T("ListEnd", [
  * This source code is licensed under the ISC license.
  * See the LICENSE file in the root directory of this source tree.
  */
-const sn = T("ListStart", [
+const an = L("ListStart", [
   ["path", { d: "M16 12H3", key: "1a2rj7" }],
   ["path", { d: "M16 18H3", key: "12xzn7" }],
   ["path", { d: "M10 6H3", key: "lf8lx7" }],
@@ -180,7 +191,7 @@ const sn = T("ListStart", [
  * This source code is licensed under the ISC license.
  * See the LICENSE file in the root directory of this source tree.
  */
-const an = T("ListX", [
+const tn = L("ListX", [
   ["path", { d: "M11 12H3", key: "51ecnj" }],
   ["path", { d: "M16 6H3", key: "1wxfjs" }],
   ["path", { d: "M16 18H3", key: "12xzn7" }],
@@ -193,7 +204,7 @@ const an = T("ListX", [
  * This source code is licensed under the ISC license.
  * See the LICENSE file in the root directory of this source tree.
  */
-const tn = T("MessageSquareMore", [
+const nn = L("MessageSquareMore", [
   ["path", { d: "M21 15a2 2 0 0 1-2 2H7l-4 4V5a2 2 0 0 1 2-2h14a2 2 0 0 1 2 2z", key: "1lielz" }],
   ["path", { d: "M8 10h.01", key: "19clt8" }],
   ["path", { d: "M12 10h.01", key: "1nrarc" }],
@@ -205,7 +216,7 @@ const tn = T("MessageSquareMore", [
  * This source code is licensed under the ISC license.
  * See the LICENSE file in the root directory of this source tree.
  */
-const nn = T("Network", [
+const ln = L("Network", [
   ["rect", { x: "16", y: "16", width: "6", height: "6", rx: "1", key: "4q2zg0" }],
   ["rect", { x: "2", y: "16", width: "6", height: "6", rx: "1", key: "8cvhb9" }],
   ["rect", { x: "9", y: "2", width: "6", height: "6", rx: "1", key: "1egb70" }],
@@ -218,7 +229,7 @@ const nn = T("Network", [
  * This source code is licensed under the ISC license.
  * See the LICENSE file in the root directory of this source tree.
  */
-const ca = T("Pencil", [
+const ca = L("Pencil", [
   ["path", { d: "M17 3a2.85 2.83 0 1 1 4 4L7.5 20.5 2 22l1.5-5.5Z", key: "5qss01" }],
   ["path", { d: "m15 5 4 4", key: "1mk7zo" }]
 ]);
@@ -228,7 +239,7 @@ const ca = T("Pencil", [
  * This source code is licensed under the ISC license.
  * See the LICENSE file in the root directory of this source tree.
  */
-const da = T("PieChart", [
+const da = L("PieChart", [
   ["path", { d: "M21.21 15.89A10 10 0 1 1 8 2.83", key: "k2fpak" }],
   ["path", { d: "M22 12A10 10 0 0 0 12 2v10z", key: "1rfc4y" }]
 ]);
@@ -238,7 +249,7 @@ const da = T("PieChart", [
  * This source code is licensed under the ISC license.
  * See the LICENSE file in the root directory of this source tree.
  */
-const ln = T("Play", [
+const rn = L("Play", [
   ["polygon", { points: "6 3 20 12 6 21 6 3", key: "1oa8hb" }]
 ]);
 /**
@@ -247,7 +258,7 @@ const ln = T("Play", [
  * This source code is licensed under the ISC license.
  * See the LICENSE file in the root directory of this source tree.
  */
-const rn = T("Plug2", [
+const on = L("Plug2", [
   ["path", { d: "M9 2v6", key: "17ngun" }],
   ["path", { d: "M15 2v6", key: "s7yy2p" }],
   ["path", { d: "M12 17v5", key: "bb1du9" }],
@@ -260,7 +271,7 @@ const rn = T("Plug2", [
  * This source code is licensed under the ISC license.
  * See the LICENSE file in the root directory of this source tree.
  */
-const on = T("Save", [
+const cn = L("Save", [
   [
     "path",
     {
@@ -277,7 +288,7 @@ const on = T("Save", [
  * This source code is licensed under the ISC license.
  * See the LICENSE file in the root directory of this source tree.
  */
-const ha = T("ScatterChart", [
+const ha = L("ScatterChart", [
   ["circle", { cx: "7.5", cy: "7.5", r: ".5", fill: "currentColor", key: "kqv944" }],
   ["circle", { cx: "18.5", cy: "5.5", r: ".5", fill: "currentColor", key: "lysivs" }],
   ["circle", { cx: "11.5", cy: "11.5", r: ".5", fill: "currentColor", key: "byv1b8" }],
@@ -291,7 +302,7 @@ const ha = T("ScatterChart", [
  * This source code is licensed under the ISC license.
  * See the LICENSE file in the root directory of this source tree.
  */
-const cn = T("ShieldQuestion", [
+const dn = L("ShieldQuestion", [
   [
     "path",
     {
@@ -308,7 +319,7 @@ const cn = T("ShieldQuestion", [
  * This source code is licensed under the ISC license.
  * See the LICENSE file in the root directory of this source tree.
  */
-const dn = T("Sigma", [
+const hn = L("Sigma", [
   ["path", { d: "M18 7V4H6l6 8-6 8h12v-3", key: "zis8ev" }]
 ]);
 /**
@@ -317,7 +328,7 @@ const dn = T("Sigma", [
  * This source code is licensed under the ISC license.
  * See the LICENSE file in the root directory of this source tree.
  */
-const hn = T("SwatchBook", [
+const mn = L("SwatchBook", [
   ["path", { d: "M11 17a4 4 0 0 1-8 0V5a2 2 0 0 1 2-2h4a2 2 0 0 1 2 2Z", key: "1ldrpk" }],
   ["path", { d: "M16.7 13H19a2 2 0 0 1 2 2v4a2 2 0 0 1-2 2H7", key: "11i5po" }],
   ["path", { d: "M 7 17h0.01", key: "10821z" }],
@@ -335,7 +346,7 @@ const hn = T("SwatchBook", [
  * This source code is licensed under the ISC license.
  * See the LICENSE file in the root directory of this source tree.
  */
-const mn = T("Tag", [
+const un = L("Tag", [
   [
     "path",
     {
@@ -351,7 +362,7 @@ const mn = T("Tag", [
  * This source code is licensed under the ISC license.
  * See the LICENSE file in the root directory of this source tree.
  */
-const un = T("ToggleLeft", [
+const xn = L("ToggleLeft", [
   ["rect", { width: "20", height: "12", x: "2", y: "6", rx: "6", ry: "6", key: "f2vt7d" }],
   ["circle", { cx: "8", cy: "12", r: "2", key: "1nvbw3" }]
 ]);
@@ -361,7 +372,7 @@ const un = T("ToggleLeft", [
  * This source code is licensed under the ISC license.
  * See the LICENSE file in the root directory of this source tree.
  */
-const xn = T("Type", [
+const pn = L("Type", [
   ["polyline", { points: "4 7 4 4 20 4 20 7", key: "1nosan" }],
   ["line", { x1: "9", x2: "15", y1: "20", y2: "20", key: "swin9y" }],
   ["line", { x1: "12", x2: "12", y1: "4", y2: "20", key: "1tx1rr" }]
@@ -372,51 +383,51 @@ const xn = T("Type", [
  * This source code is licensed under the ISC license.
  * See the LICENSE file in the root directory of this source tree.
  */
-const pn = T("User", [
+const fn = L("User", [
   ["path", { d: "M19 21v-2a4 4 0 0 0-4-4H9a4 4 0 0 0-4 4v2", key: "975kel" }],
   ["circle", { cx: "12", cy: "7", r: "4", key: "17ys0d" }]
 ]);
-function fn() {
-  const [s, n] = M(""), [a, t] = M(!1), [i, o] = M(!1), l = k((d) => d.dashboard);
+function gn() {
+  const [s, n] = T(""), [a, t] = T(!1), [i, o] = T(!1), l = k((h) => h.dashboard);
   function c() {
-    const d = Ps(l), f = Ee(l.id), m = JSON.parse(localStorage.getItem(f) || "[]");
+    const h = Us(l), g = Ae(l.id), m = JSON.parse(localStorage.getItem(g) || "[]");
     if (m.some(
-      (C) => C.name === s
+      (N) => N.name === s
     )) {
       t(!0);
       return;
     }
     m.push({
       name: s,
-      template: d
-    }), localStorage.setItem(f, JSON.stringify(m)), o(!1);
+      template: h
+    }), localStorage.setItem(g, JSON.stringify(m)), o(!1);
   }
-  return /* @__PURE__ */ e.jsxs(ds, { open: i, onOpenChange: o, children: [
-    /* @__PURE__ */ e.jsx(hs, { asChild: !0, children: /* @__PURE__ */ e.jsxs(
-      w,
+  return /* @__PURE__ */ e.jsxs(us, { open: i, onOpenChange: o, children: [
+    /* @__PURE__ */ e.jsx(xs, { asChild: !0, children: /* @__PURE__ */ e.jsxs(
+      z,
       {
         variant: "outline",
         className: "h-7 p-2",
         size: "sm",
         children: [
-          /* @__PURE__ */ e.jsx(Us, { className: " mr-2 h-4 w-4", strokeWidth: 1.5 }),
+          /* @__PURE__ */ e.jsx($s, { className: " mr-2 h-4 w-4", strokeWidth: 1.5 }),
           "Add Lens"
         ]
       }
     ) }),
-    /* @__PURE__ */ e.jsxs(ms, { className: "sm:max-w-[425px]", children: [
-      /* @__PURE__ */ e.jsxs(us, { children: [
-        /* @__PURE__ */ e.jsx(xs, { children: "Add a Lens" }),
-        /* @__PURE__ */ e.jsx(ps, { children: "Lenses are private by default and are only visible to you." })
+    /* @__PURE__ */ e.jsxs(ps, { className: "sm:max-w-[425px]", children: [
+      /* @__PURE__ */ e.jsxs(fs, { children: [
+        /* @__PURE__ */ e.jsx(gs, { children: "Add a Lens" }),
+        /* @__PURE__ */ e.jsx(js, { children: "Lenses are private by default and are only visible to you." })
       ] }),
       /* @__PURE__ */ e.jsx("div", { className: "grid gap-4 py-4", children: /* @__PURE__ */ e.jsxs("div", { className: "grid grid-cols-8 items-center gap-4", children: [
-        /* @__PURE__ */ e.jsx(B, { className: "text-right", children: "Name" }),
+        /* @__PURE__ */ e.jsx(R, { className: "text-right", children: "Name" }),
         /* @__PURE__ */ e.jsx(
           ae,
           {
             value: s,
-            onChange: (d) => {
-              a && t(!1), n(d.target.value);
+            onChange: (h) => {
+              a && t(!1), n(h.target.value);
             },
             id: "name",
             className: "col-span-7 focus-visible:ring-0 focus-visible:ring-ring focus-visible:ring-offset-0"
@@ -424,8 +435,8 @@ function fn() {
         )
       ] }) }),
       a && /* @__PURE__ */ e.jsx("p", { className: "text-sm", children: "The bookmark name already exists. Use a differnet name." }),
-      /* @__PURE__ */ e.jsx(Js, { children: /* @__PURE__ */ e.jsx(
-        w,
+      /* @__PURE__ */ e.jsx(Ks, { children: /* @__PURE__ */ e.jsx(
+        z,
         {
           variant: "outline",
           type: "submit",
@@ -437,34 +448,34 @@ function fn() {
     ] })
   ] });
 }
-function gn() {
-  const [s, n] = M(!1), [a, t] = M(""), i = k((h) => h.dashboard), o = k((h) => h.bookmarkKey), [l, c] = M([]), d = k((h) => h.actions.setDashboard), f = k(
-    (h) => h.actions.setFilterValues
+function jn() {
+  const [s, n] = T(!1), [a, t] = T(""), i = k((d) => d.dashboard), o = k((d) => d.bookmarkKey), [l, c] = T([]), h = k((d) => d.actions.setDashboard), g = k(
+    (d) => d.actions.setFilterValues
   ), m = k(
-    (h) => h.actions.setBookmarkKey
+    (d) => d.actions.setBookmarkKey
   );
   K(() => {
-    const h = Ee(i.id), x = JSON.parse(localStorage.getItem(h) || "[]");
+    const d = Ae(i.id), x = JSON.parse(localStorage.getItem(d) || "[]");
     c(x);
-    const g = x.find(
-      (j) => j.default
+    const f = x.find(
+      (w) => w.default
     );
-    g && g.name === o && t(g.name);
+    f && f.name === o && t(f.name);
   }, [s, i, o]);
-  function u(h) {
-    if (h === a)
+  function u(d) {
+    if (d === a)
       return;
-    const x = l.find((j) => j.name === h), g = x == null ? void 0 : x.template;
-    g && (d(g), f(x.filterValues || []), m(h === "Original" ? "" : h)), t(h);
+    const x = l.find((w) => w.name === d), f = x == null ? void 0 : x.template;
+    f && (h(f), g(x.filterValues || []), m(d === "Original" ? "" : d)), t(d);
   }
-  function C(h) {
-    const x = Ee(i.id), j = JSON.parse(localStorage.getItem(x) || "[]").filter(
-      (b) => b.name !== h
+  function N(d) {
+    const x = Ae(i.id), w = JSON.parse(localStorage.getItem(x) || "[]").filter(
+      (b) => b.name !== d
     );
-    localStorage.setItem(x, JSON.stringify(j)), c(j);
+    localStorage.setItem(x, JSON.stringify(w)), c(w);
   }
   return /* @__PURE__ */ e.jsxs(Ia, { open: s, onOpenChange: n, children: [
-    /* @__PURE__ */ e.jsx(qa, { asChild: !0, children: /* @__PURE__ */ e.jsx(w, { variant: "outline", className: "h-7 p-2", children: /* @__PURE__ */ e.jsx(Wt, { className: "h-4 w-4", strokeWidth: 1.5 }) }) }),
+    /* @__PURE__ */ e.jsx(qa, { asChild: !0, children: /* @__PURE__ */ e.jsx(z, { variant: "outline", className: "h-7 p-2", children: /* @__PURE__ */ e.jsx(Yt, { className: "h-4 w-4", strokeWidth: 1.5 }) }) }),
     /* @__PURE__ */ e.jsxs(Va, { className: "w-56", children: [
       /* @__PURE__ */ e.jsx(Ra, { children: "Lenses" }),
       /* @__PURE__ */ e.jsx(_a, {}),
@@ -474,20 +485,20 @@ function gn() {
           value: a,
           onValueChange: u,
           children: [
-            /* @__PURE__ */ e.jsx(Fs, { value: "Original", children: "Original" }),
-            l.filter((h) => h.name != "Original").map((h, x) => /* @__PURE__ */ e.jsxs(
-              Fs,
+            /* @__PURE__ */ e.jsx(Os, { value: "Original", children: "Original" }),
+            l.filter((d) => d.name != "Original").map((d, x) => /* @__PURE__ */ e.jsxs(
+              Os,
               {
                 className: "xbg-red-100 flex justify-between",
-                value: h.name,
-                defaultChecked: h.name === o,
+                value: d.name,
+                defaultChecked: d.name === o,
                 children: [
-                  /* @__PURE__ */ e.jsx("p", { children: h.name }),
+                  /* @__PURE__ */ e.jsx("p", { children: d.name }),
                   /* @__PURE__ */ e.jsx(
                     Re,
                     {
-                      onClick: (g) => {
-                        g.preventDefault(), C(h.name);
+                      onClick: (f) => {
+                        f.preventDefault(), N(d.name);
                       },
                       className: "h-3 w-3 hover:cursor-pointer",
                       strokeWidth: 1.5
@@ -503,27 +514,27 @@ function gn() {
     ] })
   ] });
 }
-function jn() {
-  const [s, n] = M(!1), a = k((o) => o.dashboard), t = k((o) => o.bookmarkKey);
+function bn() {
+  const [s, n] = T(!1), a = k((o) => o.dashboard), t = k((o) => o.bookmarkKey);
   K(() => {
     if (!t) {
       n(!1);
       return;
     }
-    const o = Ee(a.id), c = JSON.parse(
+    const o = Ae(a.id), c = JSON.parse(
       localStorage.getItem(o) || "[]"
     ).find(
-      (d) => d.name === t
+      (h) => h.name === t
     );
     n(c ? c.default : !1);
   }, [t, a.id]);
   function i(o) {
     if (n(o), !t)
       return;
-    const l = Ee(a.id), d = JSON.parse(
+    const l = Ae(a.id), h = JSON.parse(
       localStorage.getItem(l) || "[]"
-    ).map((f) => (f.name === t ? f.default = o : f.default = !1, f));
-    console.log(d), localStorage.setItem(l, JSON.stringify(d));
+    ).map((g) => (g.name === t ? g.default = o : g.default = !1, g));
+    console.log(h), localStorage.setItem(l, JSON.stringify(h));
   }
   return /* @__PURE__ */ e.jsxs("div", { className: "flex items-center space-x-2", children: [
     /* @__PURE__ */ e.jsx(
@@ -544,7 +555,7 @@ function jn() {
     )
   ] });
 }
-function bn() {
+function yn() {
   const s = k((b) => b.bookmarkKey), n = k((b) => b.dashboard);
   k((b) => b.selectedSheetId);
   const a = k(
@@ -555,10 +566,10 @@ function bn() {
   );
   const l = k((b) => b.onSaveFunction), c = k(
     (b) => b.actions.setShowFilters
-  ), { addFrame: d, setSelectedFrameId: f } = k(
+  ), { addFrame: h, setSelectedFrameId: g } = k(
     (b) => b.actions
-  ), { getSelectedSheet: m, setIsDashboardEditing: u, setShowDashboardJSON: C } = k((b) => b.actions), h = m(), x = () => {
-    if (!a || !h)
+  ), { getSelectedSheet: m, setIsDashboardEditing: u, setShowDashboardJSON: N } = k((b) => b.actions), d = m(), x = () => {
+    if (!a || !d)
       return;
     const b = {
       id: We(),
@@ -575,31 +586,31 @@ function bn() {
       type: "bar",
       sql: "select COUNT(*) from YOUR_TABLE",
       data: []
-    }, L = {
+    }, E = {
       id: We(),
       cards: [b],
       activeCardId: b.id
     };
-    d(h.id, L), f(L.id);
-  }, g = () => {
+    h(d.id, E), g(E.id);
+  }, f = () => {
     u(!0);
   };
-  function j() {
+  function w() {
     if (!s || s === "")
       return;
-    const b = Ps(n), L = Ee(n.id), A = JSON.parse(localStorage.getItem(L) || "[]"), O = A.findIndex(
-      (y) => y.name === s
+    const b = Us(n), E = Ae(n.id), C = JSON.parse(localStorage.getItem(E) || "[]"), O = C.findIndex(
+      (j) => j.name === s
     );
-    O !== -1 ? A[O] = {
+    O !== -1 ? C[O] = {
       name: s,
       template: b,
-      default: A[O].default,
+      default: C[O].default,
       filterValues: t
-    } : A.push({
+    } : C.push({
       name: s,
       template: b,
       filterValues: t
-    }), localStorage.setItem(L, JSON.stringify(A)), l == null || l(b);
+    }), localStorage.setItem(E, JSON.stringify(C)), l == null || l(b);
   }
   return i ? null : /* @__PURE__ */ e.jsxs(
     "div",
@@ -608,17 +619,17 @@ function bn() {
       role: "dashboard-controls",
       children: [
         !i && /* @__PURE__ */ e.jsxs("div", { className: "flex items-center gap-3", children: [
-          /* @__PURE__ */ e.jsx(B, { children: s }),
+          /* @__PURE__ */ e.jsx(R, { children: s }),
           !!s && /* @__PURE__ */ e.jsxs(e.Fragment, { children: [
             /* @__PURE__ */ e.jsx("span", { className: "text-muted-foreground", children: "|" }),
-            /* @__PURE__ */ e.jsx(jn, {})
+            /* @__PURE__ */ e.jsx(bn, {})
           ] })
         ] }),
         /* @__PURE__ */ e.jsxs("div", { className: "flex gap-2", children: [
-          a && !i && /* @__PURE__ */ e.jsx(fn, {}),
-          !i && /* @__PURE__ */ e.jsx(gn, {}),
+          a && !i && /* @__PURE__ */ e.jsx(gn, {}),
+          !i && /* @__PURE__ */ e.jsx(jn, {}),
           a && !i && /* @__PURE__ */ e.jsxs(
-            w,
+            z,
             {
               variant: "outline",
               className: "h-7 p-2",
@@ -626,52 +637,52 @@ function bn() {
               disabled: !a,
               onClick: x,
               children: [
-                /* @__PURE__ */ e.jsx(Us, { className: "mr-2 h-4 w-4", strokeWidth: 1.5 }),
+                /* @__PURE__ */ e.jsx($s, { className: "mr-2 h-4 w-4", strokeWidth: 1.5 }),
                 "Add Frame"
               ]
             }
           ),
           !a && /* @__PURE__ */ e.jsx(
-            w,
+            z,
             {
               variant: "outline",
               className: "h-7 p-2",
-              onClick: g,
+              onClick: f,
               size: "sm",
               children: /* @__PURE__ */ e.jsx(ca, { className: "h-4 w-4", strokeWidth: 1.5 })
             }
           ),
           a && !i && /* @__PURE__ */ e.jsx(
-            w,
+            z,
             {
               variant: "outline",
               role: "close",
               className: "h-7 p-2",
               onClick: () => {
-                u(!1), C(!1);
+                u(!1), N(!1);
               },
               size: "sm",
               children: /* @__PURE__ */ e.jsx(Re, { className: "h-4 w-4", strokeWidth: 1.5 })
             }
           ),
           a && !i && /* @__PURE__ */ e.jsx(
-            w,
+            z,
             {
               className: "h-7 p-2",
               variant: "outline",
-              onClick: j,
+              onClick: w,
               size: "sm",
-              children: /* @__PURE__ */ e.jsx(on, { className: "h-4 w-4", strokeWidth: 1.5 })
+              children: /* @__PURE__ */ e.jsx(cn, { className: "h-4 w-4", strokeWidth: 1.5 })
             }
           ),
           !o && !i && a && /* @__PURE__ */ e.jsx(
-            w,
+            z,
             {
               className: "h-7 p-2",
               variant: "outline",
               onClick: () => c(!0),
               size: "sm",
-              children: /* @__PURE__ */ e.jsx(oa, { className: "h-4 w-4", strokeWidth: 1.5 })
+              children: /* @__PURE__ */ e.jsx(ia, { className: "h-4 w-4", strokeWidth: 1.5 })
             }
           ),
           !i && a && !1,
@@ -681,7 +692,7 @@ function bn() {
     }
   );
 }
-function Ge({
+function Qe({
   title: s,
   items: n,
   value: a,
@@ -690,67 +701,67 @@ function Ge({
   connectionTooltip: o,
   onChange: l,
   className: c,
-  showIcon: d = !0,
-  disabled: f = !1
+  showIcon: h = !0,
+  disabled: g = !1
 }) {
   const m = t ? "Loading..." : i ? "Error" : a;
   function u() {
     if (s === "Connection")
-      return /* @__PURE__ */ e.jsx(rn, { className: "size-4 rotate-90" });
+      return /* @__PURE__ */ e.jsx(on, { className: "size-4 rotate-90" });
     if (s === "Database")
-      return /* @__PURE__ */ e.jsx(Gt, { className: "size-4" });
+      return /* @__PURE__ */ e.jsx(Qt, { className: "size-4" });
     if (s === "Schema")
-      return /* @__PURE__ */ e.jsx(nn, { className: "size-4" });
+      return /* @__PURE__ */ e.jsx(ln, { className: "size-4" });
     if (s === "Table")
-      return /* @__PURE__ */ e.jsx(js, { className: "size-4" });
+      return /* @__PURE__ */ e.jsx(vs, { className: "size-4" });
   }
   return /* @__PURE__ */ e.jsxs("div", { className: "flex items-center gap-2", children: [
-    d && /* @__PURE__ */ e.jsx("div", { className: "shrink-0", children: o ? /* @__PURE__ */ e.jsxs(fs, { children: [
-      /* @__PURE__ */ e.jsx(Gs, { children: u() }),
-      /* @__PURE__ */ e.jsx(gs, { className: "text-xs", align: "start", children: o })
+    h && /* @__PURE__ */ e.jsx("div", { className: "shrink-0", children: o ? /* @__PURE__ */ e.jsxs(bs, { children: [
+      /* @__PURE__ */ e.jsx(Ps, { children: u() }),
+      /* @__PURE__ */ e.jsx(ys, { className: "text-xs", align: "start", children: o })
     ] }) : u() }),
-    /* @__PURE__ */ e.jsxs(Oe, { disabled: f, value: m, onValueChange: l, children: [
+    /* @__PURE__ */ e.jsxs(Fe, { disabled: g, value: m, onValueChange: l, children: [
       /* @__PURE__ */ e.jsx(
-        Me,
+        Oe,
         {
           className: W(
             "h-9 w-full focus:ring-1 focus:ring-offset-0",
             c
           ),
           children: /* @__PURE__ */ e.jsx(
-            Te,
+            Me,
             {
               placeholder: t ? "Loading..." : i ? "Error" : `Select ${s}`
             }
           )
         }
       ),
-      /* @__PURE__ */ e.jsx(Ae, { children: /* @__PURE__ */ e.jsxs(_e, { children: [
+      /* @__PURE__ */ e.jsx(Te, { children: /* @__PURE__ */ e.jsxs(_e, { children: [
         t ? /* @__PURE__ */ e.jsx(Le, { children: "Loading..." }) : /* @__PURE__ */ e.jsx(Le, { children: s }),
-        /* @__PURE__ */ e.jsx(e.Fragment, { children: n && n.map((C, h) => /* @__PURE__ */ e.jsx(X, { value: C.id, children: C.name }, h)) }),
+        /* @__PURE__ */ e.jsx(e.Fragment, { children: n && n.map((N, d) => /* @__PURE__ */ e.jsx(X, { value: N.id, children: N.name }, d)) }),
         (t || i) && /* @__PURE__ */ e.jsx(X, { value: m, children: m })
       ] }) })
     ] })
   ] });
 }
-function yn({ column: s }) {
-  const [n, a] = M(!1), t = r((m) => m.selectedTableName), i = r(
+function vn({ column: s }) {
+  const [n, a] = T(!1), t = r((m) => m.selectedTableName), i = r(
     (m) => m.selectedSchemaName
-  ), o = r((m) => m.sqlGen), l = r((m) => m.actions.setSqlGen), c = r((m) => m.actions.setCardSql), d = r((m) => m.actions.setRunSql);
-  function f(m, u) {
-    const C = Qs(m, o, u);
-    l(C);
-    const h = Ws(
-      C,
+  ), o = r((m) => m.sqlGen), l = r((m) => m.actions.setSqlGen), c = r((m) => m.actions.setCardSql), h = r((m) => m.actions.setRunSql);
+  function g(m, u) {
+    const N = Gs(m, o, u);
+    l(N);
+    const d = Js(
+      N,
       he(i || ""),
       he(t)
     );
-    h && (c(h), d(!0)), a(!1);
+    d && (c(d), h(!0)), a(!1);
   }
   return /* @__PURE__ */ e.jsxs(Ke, { open: n, onOpenChange: a, children: [
     /* @__PURE__ */ e.jsx(Ue, { asChild: !0, children: /* @__PURE__ */ e.jsx(Ba, { className: "h-4 w-4 cursor-pointer text-foreground/40" }) }),
     /* @__PURE__ */ e.jsx(
-      Je,
+      Pe,
       {
         align: "center",
         className: "w-18 rounded-md p-0 shadow-none",
@@ -758,7 +769,7 @@ function yn({ column: s }) {
           /* @__PURE__ */ e.jsx(
             "li",
             {
-              onClick: () => f(s, "COUNT"),
+              onClick: () => g(s, "COUNT"),
               className: "cursor-pointer p-1 px-3 transition-colors hover:bg-muted",
               children: "Count"
             }
@@ -766,7 +777,7 @@ function yn({ column: s }) {
           /* @__PURE__ */ e.jsx(
             "li",
             {
-              onClick: () => f(s, "AVG"),
+              onClick: () => g(s, "AVG"),
               className: "cursor-pointer p-1 px-3 transition-colors hover:bg-muted",
               children: "Avg"
             }
@@ -774,7 +785,7 @@ function yn({ column: s }) {
           /* @__PURE__ */ e.jsx(
             "li",
             {
-              onClick: () => f(s, "SUM"),
+              onClick: () => g(s, "SUM"),
               className: "cursor-pointer p-1 px-3 transition-colors hover:bg-muted",
               children: "Sum"
             }
@@ -782,7 +793,7 @@ function yn({ column: s }) {
           /* @__PURE__ */ e.jsx(
             "li",
             {
-              onClick: () => f(s, "MAX"),
+              onClick: () => g(s, "MAX"),
               className: "cursor-pointer p-1 px-3 transition-colors hover:bg-muted",
               children: "Max"
             }
@@ -790,7 +801,7 @@ function yn({ column: s }) {
           /* @__PURE__ */ e.jsx(
             "li",
             {
-              onClick: () => f(s, "MIN"),
+              onClick: () => g(s, "MIN"),
               className: "cursor-pointer p-1 px-3 transition-colors hover:bg-muted",
               children: "Min"
             }
@@ -801,94 +812,94 @@ function yn({ column: s }) {
   ] });
 }
 function ma({ column: s }) {
-  return /* @__PURE__ */ e.jsxs(fs, { children: [
+  return /* @__PURE__ */ e.jsxs(bs, { children: [
     /* @__PURE__ */ e.jsx($a, { asChild: !0, children: Ka.includes(s.data_type.toLowerCase()) ? (
       // <span className=" font-thin">T</span>
-      /* @__PURE__ */ e.jsx(xn, { className: "size-3" })
-    ) : Ys.includes(s.data_type.toLowerCase()) ? (
+      /* @__PURE__ */ e.jsx(pn, { className: "size-3" })
+    ) : Qs.includes(s.data_type.toLowerCase()) ? (
       //
-      /* @__PURE__ */ e.jsx(Xt, { className: "size-3" })
-    ) : Ua.includes(s.data_type.toLowerCase()) ? /* @__PURE__ */ e.jsx(Ja, { className: "size-3" }) : Pa.includes(s.data_type.toLowerCase()) ? /* @__PURE__ */ e.jsx(un, { className: "size-3" }) : /* @__PURE__ */ e.jsx(cn, { className: "size-3" }) }),
-    /* @__PURE__ */ e.jsx(gs, { children: /* @__PURE__ */ e.jsx("p", { className: "font-mono text-xs", children: s.data_type }) })
+      /* @__PURE__ */ e.jsx(Zt, { className: "size-3" })
+    ) : Ua.includes(s.data_type.toLowerCase()) ? /* @__PURE__ */ e.jsx(Pa, { className: "size-3" }) : Ga.includes(s.data_type.toLowerCase()) ? /* @__PURE__ */ e.jsx(xn, { className: "size-3" }) : /* @__PURE__ */ e.jsx(dn, { className: "size-3" }) }),
+    /* @__PURE__ */ e.jsx(ys, { children: /* @__PURE__ */ e.jsx("p", { className: "font-mono text-xs", children: s.data_type }) })
   ] });
 }
-function vn({
+function Nn({
   schemaName: s,
   tableName: n,
   columns: a,
   status: t
 }) {
-  const i = r((y) => y.sqlGen), o = r(
-    (y) => y.selectedConnectionId
+  const i = r((j) => j.sqlGen), o = r(
+    (j) => j.selectedConnectionId
   ), l = r(
-    (y) => y.selectedDatabaseName
+    (j) => j.selectedDatabaseName
   ), c = r(
-    (y) => y.selectedSchemaName
-  ), d = r((y) => y.selectedTableName), f = k(
-    (y) => y.dashboard.aiScopeTables
-  ), { setAIScopeTables: m } = k((y) => y.actions), u = r((y) => y.actions.setRunSql), C = r((y) => y.actions.setSqlGen), h = r(
-    (y) => y.actions.setIsShowingVisual
-  ), x = r((y) => y.actions.setCardSql), { connectionType: g } = ua();
-  function j(y) {
-    const z = Qs(y, i);
-    C(z);
-    const E = Ws(z, he(s), he(n));
-    E && (x(E), u(!0));
+    (j) => j.selectedSchemaName
+  ), h = r((j) => j.selectedTableName), g = k(
+    (j) => j.dashboard.aiScopeTables
+  ), { setAIScopeTables: m } = k((j) => j.actions), u = r((j) => j.actions.setRunSql), N = r((j) => j.actions.setSqlGen), d = r(
+    (j) => j.actions.setIsShowingVisual
+  ), x = r((j) => j.actions.setCardSql), { connectionType: f } = ua();
+  function w(j) {
+    const F = Gs(j, i);
+    N(F);
+    const A = Js(F, he(s), he(n));
+    A && (x(A), u(!0));
   }
   function b() {
-    return (f == null ? void 0 : f.find(
-      (y) => y.connectinonId === o && y.tableName === d
+    return (g == null ? void 0 : g.find(
+      (j) => j.connectinonId === o && j.tableName === h
     )) !== void 0;
   }
-  function L(y) {
-    if (y === !0 && d && o) {
-      const z = {
+  function E(j) {
+    if (j === !0 && h && o) {
+      const F = {
         connectinonId: o,
-        connectionType: g,
+        connectionType: f,
         databaseName: l,
         schemaName: c,
-        tableName: d
-      }, _ = [...f || [], z].filter(
+        tableName: h
+      }, q = [...g || [], F].filter(
         (Y, $, U) => U.findIndex(
           (D) => D.connectinonId === Y.connectinonId && D.tableName === Y.tableName
         ) === $
       );
-      m(_), Ms.success(`Added '${d}' to AI Scope`, {
+      m(q), Ts.success(`Added '${h}' to AI Scope`, {
         position: "top-right",
         duration: 2500,
         richColors: !0
       });
     } else {
-      const z = (f || []).filter(
-        (E) => E.connectinonId !== o && E.tableName !== d
+      const F = (g || []).filter(
+        (A) => A.connectinonId !== o && A.tableName !== h
       );
-      m(z), Ms(`Removed '${d}' from AI Scope`, {
+      m(F), Ts(`Removed '${h}' from AI Scope`, {
         position: "top-right",
         duration: 2e3,
         richColors: !0
       });
     }
   }
-  function A() {
-    let z = rs(s, n);
-    ((_) => _.charAt(0) === _.charAt(0).toUpperCase())(n) && (z = `"${n}"`), h(!1), x(`SELECT * FROM ${z} LIMIT 10`), u(!0);
+  function C() {
+    let F = cs(s, n);
+    ((q) => q.charAt(0) === q.charAt(0).toUpperCase())(n) && (F = `"${n}"`), d(!1), x(`SELECT * FROM ${F} LIMIT 10`), u(!0);
   }
   function O() {
-    let z = rs(s, n);
-    ((_) => _.charAt(0) === _.charAt(0).toUpperCase())(n) && (z = `"${n}"`), h(!1), x(`SELECT COUNT(*) FROM ${z}`), u(!0);
+    let F = cs(s, n);
+    ((q) => q.charAt(0) === q.charAt(0).toUpperCase())(n) && (F = `"${n}"`), d(!1), x(`SELECT COUNT(*) FROM ${F}`), u(!0);
   }
   return /* @__PURE__ */ e.jsxs("div", { className: "flex grow flex-col space-y-4 px-4", children: [
     /* @__PURE__ */ e.jsxs("div", { className: "flex items-center justify-center gap-1", children: [
       /* @__PURE__ */ e.jsx(
-        Xs,
+        Ws,
         {
           title: `${b() ? "Remove from" : "Add to"} AI Scope`,
           pressed: b(),
-          onPressedChange: L,
+          onPressedChange: E,
           variant: "outline",
           className: "h-9 px-2",
           children: /* @__PURE__ */ e.jsx(
-            Ga,
+            Ja,
             {
               className: W("size-4", {
                 "text-primary": b(),
@@ -899,21 +910,21 @@ function vn({
         }
       ),
       /* @__PURE__ */ e.jsxs(
-        w,
+        z,
         {
           disabled: t !== "Success",
-          onClick: A,
+          onClick: C,
           size: "sm",
           variant: "secondary",
           className: "flex",
           children: [
-            t !== "Success" ? /* @__PURE__ */ e.jsx(He, { className: "mr-2 h-4 w-4 animate-spin text-foreground/50" }) : /* @__PURE__ */ e.jsx(hn, { className: "mr-2 size-4" }),
+            t !== "Success" ? /* @__PURE__ */ e.jsx(He, { className: "mr-2 h-4 w-4 animate-spin text-foreground/50" }) : /* @__PURE__ */ e.jsx(mn, { className: "mr-2 size-4" }),
             "Top 10"
           ]
         }
       ),
       /* @__PURE__ */ e.jsxs(
-        w,
+        z,
         {
           disabled: t !== "Success",
           onClick: O,
@@ -921,87 +932,87 @@ function vn({
           variant: "secondary",
           className: "flex",
           children: [
-            t !== "Success" ? /* @__PURE__ */ e.jsx(He, { className: "mr-2 h-4 w-4 animate-spin text-foreground/50" }) : /* @__PURE__ */ e.jsx(dn, { className: "mr-2 size-4" }),
+            t !== "Success" ? /* @__PURE__ */ e.jsx(He, { className: "mr-2 h-4 w-4 animate-spin text-foreground/50" }) : /* @__PURE__ */ e.jsx(hn, { className: "mr-2 size-4" }),
             "Count"
           ]
         }
       )
     ] }),
     /* @__PURE__ */ e.jsxs(
-      bs,
+      Ns,
       {
         className: "flex-1 basis-0 overflow-y-auto border-b border-t border-muted py-3",
         children: [
-          a == null ? void 0 : a.map((y) => /* @__PURE__ */ e.jsxs(
+          a == null ? void 0 : a.map((j) => /* @__PURE__ */ e.jsxs(
             "div",
             {
-              onClick: () => j(y),
+              onClick: () => w(j),
               className: W(
                 "mx-3 flex cursor-pointer items-center justify-between rounded px-2 py-[6px] text-sm transition-colors hover:bg-muted/50",
                 {
-                  "bg-muted": Qa(y, i)
+                  "bg-muted": Qa(j, i)
                 }
               ),
               children: [
                 /* @__PURE__ */ e.jsxs("div", { className: "flex items-center space-x-2", children: [
-                  /* @__PURE__ */ e.jsx(ma, { column: y }),
-                  /* @__PURE__ */ e.jsx("span", { children: y.column_name })
+                  /* @__PURE__ */ e.jsx(ma, { column: j }),
+                  /* @__PURE__ */ e.jsx("span", { children: j.column_name })
                 ] }),
-                Ys.includes(y.data_type) && /* @__PURE__ */ e.jsx(
+                Qs.includes(j.data_type) && /* @__PURE__ */ e.jsx(
                   "div",
                   {
-                    onClick: (z) => z.stopPropagation(),
+                    onClick: (F) => F.stopPropagation(),
                     className: "flex items-center justify-end",
-                    children: /* @__PURE__ */ e.jsx(yn, { column: y })
+                    children: /* @__PURE__ */ e.jsx(vn, { column: j })
                   }
                 )
               ]
             },
-            y.column_name
+            j.column_name
           )),
-          /* @__PURE__ */ e.jsx(Os, { orientation: "vertical" }),
-          /* @__PURE__ */ e.jsx(Os, { orientation: "horizontal" })
+          /* @__PURE__ */ e.jsx(Ms, { orientation: "vertical" }),
+          /* @__PURE__ */ e.jsx(Ms, { orientation: "horizontal" })
         ]
       }
     )
   ] });
 }
 function ua(s, n) {
-  var ss, ve, Pe, qe;
-  let a = Kt(() => [], []);
+  var ss, ve, Je, Ie;
+  let a = Ut(() => [], []);
   const t = es().authToken || s, i = r(
     (S) => S.selectedConnectionId
   ), o = r(
     (S) => S.selectedDatabaseName
   ), l = r(
     (S) => S.selectedSchemaName
-  ), c = r((S) => S.selectedTableName), d = r(
+  ), c = r((S) => S.selectedTableName), h = r(
     (S) => S.actions.setCurrentColumns
-  ), f = r(
+  ), g = r(
     (S) => S.actions.setSelectedConnectionId
   ), m = r(
     (S) => S.actions.setSelectedDatabaseName
   ), u = r(
     (S) => S.actions.setSelectedSchemaName
-  ), C = r(
+  ), N = r(
     (S) => S.actions.setSelectedTableName
-  ), h = r((S) => S.actions.setCardSql);
+  ), d = r((S) => S.actions.setCardSql);
   function x(S) {
     return i && o && l && o !== "NA" ? !0 : i && S === "API" ? !1 : !!(i && S === "S3");
   }
-  function g(S) {
+  function f(S) {
     return !!(i && o && o !== "NA" && l && c || i && (S === "S3" || S === "API"));
   }
-  function j(S) {
+  function w(S) {
     return i && S ? !(S === "API" || S === "S3") : !1;
   }
   const {
     data: b,
-    isLoading: L,
-    isError: A
+    isLoading: E,
+    isError: C
   } = Ce({
     queryKey: ["connections"],
-    queryFn: () => ze(
+    queryFn: () => we(
       "https://semaphor.cloud/api/v1/connections",
       (t == null ? void 0 : t.accessToken) || ""
     ),
@@ -1009,32 +1020,32 @@ function ua(s, n) {
     // Only fetch if authToken is present
   }), O = b == null ? void 0 : b.connections.find(
     (S) => S.id === i
-  ), y = O == null ? void 0 : O.type, z = (O == null ? void 0 : O.type) === "API" || (O == null ? void 0 : O.type) === "S3", {
-    data: E,
-    isLoading: _,
+  ), j = O == null ? void 0 : O.type, F = (O == null ? void 0 : O.type) === "API" || (O == null ? void 0 : O.type) === "S3", {
+    data: A,
+    isLoading: q,
     isFetching: Y,
     isError: $,
     refetch: U
   } = Ce({
     queryKey: ["databases", i],
-    queryFn: () => ze(
+    queryFn: () => we(
       "https://semaphor.cloud/api/v1/databases",
       (t == null ? void 0 : t.accessToken) || "",
       {
         connection_id: i
       }
     ),
-    enabled: j(y)
+    enabled: w(j)
     // !!selectedConnectionId && !isNonDbConnection, //currentConnection?.type !== 'API', // Only fetch if connectionId is present
   }), {
     data: D,
     isLoading: te,
-    isFetching: G,
+    isFetching: J,
     isError: ee,
     refetch: Z
   } = Ce({
     queryKey: ["schemas", i, o],
-    queryFn: () => ze(
+    queryFn: () => we(
       "https://semaphor.cloud/api/v1/schemas",
       (t == null ? void 0 : t.accessToken) || "",
       {
@@ -1042,14 +1053,14 @@ function ua(s, n) {
         database_name: o
       }
     ),
-    enabled: !!i && !!o && !z && o !== "NA"
+    enabled: !!i && !!o && !F && o !== "NA"
     //currentConnection?.type !== 'API', // Only fetch if connectionId and database is present
   }), {
-    data: J,
+    data: P,
     isLoading: I,
-    isFetching: v,
-    isError: N,
-    refetch: F
+    isFetching: y,
+    isError: v,
+    refetch: M
   } = Ce({
     queryKey: [
       "tables",
@@ -1057,7 +1068,7 @@ function ua(s, n) {
       o,
       l
     ],
-    queryFn: () => ze(
+    queryFn: () => we(
       "https://semaphor.cloud/api/v1/tables",
       (t == null ? void 0 : t.accessToken) || "",
       {
@@ -1066,9 +1077,9 @@ function ua(s, n) {
         schema_name: l
       }
     ),
-    enabled: x(y)
+    enabled: x(j)
   }), {
-    data: H,
+    data: V,
     isLoading: ue,
     isFetching: se,
     isError: ge
@@ -1080,7 +1091,7 @@ function ua(s, n) {
       l,
       c
     ],
-    queryFn: () => ze(
+    queryFn: () => we(
       "https://semaphor.cloud/api/v1/columns",
       (t == null ? void 0 : t.accessToken) || "",
       {
@@ -1090,7 +1101,7 @@ function ua(s, n) {
         table_name: c
       }
     ),
-    enabled: g(y)
+    enabled: f(j)
     // (!!selectedConnectionId &&
     //   !!selectedDatabaseName &&
     //   !!selectedSchemaName &&
@@ -1100,75 +1111,75 @@ function ua(s, n) {
     // && currentConnection?.type !== 'API', // Only fetch if connectionId, database, and table is present
   });
   K(() => {
-    d(a);
-  }, [H, d, a]), K(() => {
+    h(a);
+  }, [V, h, a]), K(() => {
   }, [
-    z,
-    h,
-    C,
+    F,
+    d,
+    N,
     u,
     m,
     O
   ]);
-  const je = (O == null ? void 0 : O.type) === "API" ? (ss = O == null ? void 0 : O.type) == null ? void 0 : ss.toLowerCase() : c || "", be = z ? "" : l || "";
+  const je = (O == null ? void 0 : O.type) === "API" ? (ss = O == null ? void 0 : O.type) == null ? void 0 : ss.toLowerCase() : c || "", be = F ? "" : l || "";
   function xe(S) {
-    u(S), C("");
+    u(S), N("");
   }
-  function P(S) {
-    m(S), u(""), C("");
+  function G(S) {
+    m(S), u(""), N("");
   }
   function ne(S) {
-    f(S);
+    g(S);
   }
-  E && ((ve = E == null ? void 0 : E.databases) == null ? void 0 : ve.length) > 0, D && ((Pe = D == null ? void 0 : D.schemas) == null ? void 0 : Pe.length) > 0, H && ((qe = H == null ? void 0 : H.columns) == null ? void 0 : qe.length) > 0 && (a = H.columns.map((S) => ({
+  A && ((ve = A == null ? void 0 : A.databases) == null ? void 0 : ve.length) > 0, D && ((Je = D == null ? void 0 : D.schemas) == null ? void 0 : Je.length) > 0, V && ((Ie = V == null ? void 0 : V.columns) == null ? void 0 : Ie.length) > 0 && (a = V.columns.map((S) => ({
     ...S,
     data_type: S.data_type.toLowerCase()
-  }))), $ && (a = []), (ge || A) && (a = []);
+  }))), $ && (a = []), (ge || C) && (a = []);
   const le = b == null ? void 0 : b.connections.map(
     (S) => ({
       id: S.id,
       name: S.name,
       type: S.type
     })
-  ), ye = E == null ? void 0 : E.databases.map((S) => ({
+  ), ye = A == null ? void 0 : A.databases.map((S) => ({
     id: S.database_name,
     name: S.database_name
   })), re = D == null ? void 0 : D.schemas.map((S) => ({
     id: S.schema_name,
     name: S.schema_name
-  })), Ie = J == null ? void 0 : J.tables.map((S) => ({
+  })), De = P == null ? void 0 : P.tables.map((S) => ({
     id: S.table_name,
     name: S.table_name
   }));
   return {
     connectionItems: le,
-    isConnectionsLoading: L,
-    isConnectionsError: A,
+    isConnectionsLoading: E,
+    isConnectionsError: C,
     databaseItems: ye,
-    isDatabasesLoadingOrFetching: _ || Y,
+    isDatabasesLoadingOrFetching: q || Y,
     isDatabaseError: $,
     schemaItems: re,
-    isSchemaLoadingOrFetching: te || G,
+    isSchemaLoadingOrFetching: te || J,
     isSchemaError: ee,
-    tableItems: Ie,
-    isTableLoadingOrFetching: I || v,
-    isTableError: N,
+    tableItems: De,
+    isTableLoadingOrFetching: I || y,
+    isTableError: v,
     columns: a,
     isColumnsLoadingOrFetching: ue || se,
     isColumnsError: ge,
-    isNonDbConnection: z,
-    connectionType: y,
+    isNonDbConnection: F,
+    connectionType: j,
     tableName: je,
     schemaName: be,
     handleConnectionChange: ne,
-    handleDatabaseChange: P,
+    handleDatabaseChange: G,
     handleSchemaChange: xe
   };
 }
 function xa({
   ColumnsComponent: s
 }) {
-  var J;
+  var P;
   const n = r(
     (I) => I.selectedConnectionId
   ), a = r(
@@ -1180,61 +1191,61 @@ function xa({
   ), {
     connectionItems: l,
     schemaItems: c,
-    databaseItems: d,
-    tableItems: f,
+    databaseItems: h,
+    tableItems: g,
     columns: m,
     isConnectionsLoading: u,
-    isConnectionsError: C,
-    isDatabasesLoadingOrFetching: h,
+    isConnectionsError: N,
+    isDatabasesLoadingOrFetching: d,
     isDatabaseError: x,
-    isSchemaLoadingOrFetching: g,
-    isSchemaError: j,
+    isSchemaLoadingOrFetching: f,
+    isSchemaError: w,
     isColumnsError: b,
-    isColumnsLoadingOrFetching: L,
-    isTableLoadingOrFetching: A,
+    isColumnsLoadingOrFetching: E,
+    isTableLoadingOrFetching: C,
     isTableError: O,
-    connectionType: y,
-    isNonDbConnection: z,
-    handleConnectionChange: E,
-    handleDatabaseChange: _,
+    connectionType: j,
+    isNonDbConnection: F,
+    handleConnectionChange: A,
+    handleDatabaseChange: q,
     handleSchemaChange: Y,
     tableName: $,
     schemaName: U
   } = ua();
   function D() {
     return s ? s(U, $, m) : /* @__PURE__ */ e.jsx(
-      vn,
+      Nn,
       {
         schemaName: U,
         tableName: $,
         columns: m,
-        status: L ? "Loading..." : b ? "Error" : "Success"
+        status: E ? "Loading..." : b ? "Error" : "Success"
       }
     );
   }
   function te() {
     window.location.href = "mailto:support@semaphor.cloud?subject=Help&body=I need help with...";
   }
-  function G() {
-    return y === "S3" || y === "API" ? null : /* @__PURE__ */ e.jsx(
-      Ge,
+  function J() {
+    return j === "S3" || j === "API" ? null : /* @__PURE__ */ e.jsx(
+      Qe,
       {
-        onChange: _,
+        onChange: q,
         isError: x,
-        isLoading: h,
-        items: d,
+        isLoading: d,
+        items: h,
         value: a || "",
         title: "Database"
       }
     );
   }
   function ee() {
-    return y === "S3" || y === "API" ? null : /* @__PURE__ */ e.jsx(
-      Ge,
+    return j === "S3" || j === "API" ? null : /* @__PURE__ */ e.jsx(
+      Qe,
       {
         onChange: Y,
-        isError: j,
-        isLoading: g,
+        isError: w,
+        isLoading: f,
         items: c,
         value: t || "",
         title: "Schema"
@@ -1242,13 +1253,13 @@ function xa({
     );
   }
   function Z() {
-    return y === "API" ? null : /* @__PURE__ */ e.jsx(
-      Ge,
+    return j === "API" ? null : /* @__PURE__ */ e.jsx(
+      Qe,
       {
         onChange: o,
         isError: O,
-        items: f,
-        isLoading: A,
+        items: g,
+        isLoading: C,
         value: i || "",
         title: "Table"
       }
@@ -1257,40 +1268,40 @@ function xa({
   return /* @__PURE__ */ e.jsxs("aside", { className: "xbg-red-100 flex grow flex-col justify-between", children: [
     /* @__PURE__ */ e.jsxs("section", { className: "space-y-3 px-6 py-4", children: [
       /* @__PURE__ */ e.jsx(
-        Ge,
+        Qe,
         {
           items: l,
           title: "Connection",
           value: n || "",
-          onChange: E,
+          onChange: A,
           isLoading: u,
-          isError: C,
-          connectionTooltip: ((J = l == null ? void 0 : l.find(
+          isError: N,
+          connectionTooltip: ((P = l == null ? void 0 : l.find(
             (I) => I.id === n
-          )) == null ? void 0 : J.type) || ""
+          )) == null ? void 0 : P.type) || ""
         }
       ),
-      G(),
+      J(),
       ee(),
       Z()
     ] }),
     D(),
     /* @__PURE__ */ e.jsx("div", { className: "flex items-end justify-center gap-2 px-6 py-4", children: /* @__PURE__ */ e.jsxs(
-      w,
+      z,
       {
         onClick: te,
         size: "sm",
         variant: "secondary",
         className: "w-full",
         children: [
-          /* @__PURE__ */ e.jsx(tn, { className: "mr-2 size-4" }),
+          /* @__PURE__ */ e.jsx(nn, { className: "mr-2 size-4" }),
           "Help"
         ]
       }
     ) })
   ] });
 }
-function Nn(s) {
+function Cn(s) {
   const n = s.toUpperCase().indexOf("WHERE"), a = s.toUpperCase().indexOf("GROUP BY"), t = s.toUpperCase().indexOf("LIMIT"), i = s.toUpperCase().indexOf("ORDER BY");
   let o = s.length;
   if (i !== -1 && (o = i), t !== -1 && t < o && (o = t), n !== -1) {
@@ -1306,17 +1317,17 @@ function Nn(s) {
     return `${l} {{ filters | where }} ${c}`;
   }
 }
-function Cn({
+function Sn({
   error: s,
   setShowAIDialog: n,
   setUserInputforAI: a,
   setTriggerAIRun: t
 }) {
-  return /* @__PURE__ */ e.jsxs(Zs, { openDelay: 0, children: [
-    /* @__PURE__ */ e.jsx(ea, { asChild: !0, children: /* @__PURE__ */ e.jsx(w, { variant: "link", className: " p-0 h-5", children: /* @__PURE__ */ e.jsx(Pt, { className: "h-4 w-4 text-red-500" }) }) }),
-    /* @__PURE__ */ e.jsx(sa, { align: "start", className: "  min-w-fit max-w-[500px]", children: /* @__PURE__ */ e.jsx("div", { className: "flex justify-between space-x-4", children: /* @__PURE__ */ e.jsxs("div", { className: "grow space-y-1 flex flex-col  ", children: [
+  return /* @__PURE__ */ e.jsxs(Ys, { openDelay: 0, children: [
+    /* @__PURE__ */ e.jsx(Xs, { asChild: !0, children: /* @__PURE__ */ e.jsx(z, { variant: "link", className: " p-0 h-5", children: /* @__PURE__ */ e.jsx(Jt, { className: "h-4 w-4 text-red-500" }) }) }),
+    /* @__PURE__ */ e.jsx(Zs, { align: "start", className: "  min-w-fit max-w-[500px]", children: /* @__PURE__ */ e.jsx("div", { className: "flex justify-between space-x-4", children: /* @__PURE__ */ e.jsxs("div", { className: "grow space-y-1 flex flex-col  ", children: [
       /* @__PURE__ */ e.jsxs(
-        w,
+        z,
         {
           onClick: () => {
             n(!0), a(s), t(!0);
@@ -1324,16 +1335,16 @@ function Cn({
           size: "sm",
           variant: "outline",
           children: [
-            /* @__PURE__ */ e.jsx(Yt, { className: "h-4 w-4 mr-2" }),
+            /* @__PURE__ */ e.jsx(Xt, { className: "h-4 w-4 mr-2" }),
             "Fix It"
           ]
         }
       ),
-      /* @__PURE__ */ e.jsx(bs, { className: " min-h-0 max-h-[250px] overflow-scroll ", children: /* @__PURE__ */ e.jsx("p", { className: " overflow-auto text-sm leading-relaxed  font-mono ", children: s }) })
+      /* @__PURE__ */ e.jsx(Ns, { className: " min-h-0 max-h-[250px] overflow-scroll ", children: /* @__PURE__ */ e.jsx("p", { className: " overflow-auto text-sm leading-relaxed  font-mono ", children: s }) })
     ] }) }) })
   ] });
 }
-function Sn({
+function kn({
   text: s,
   onCheckedChange: n,
   checked: a
@@ -1343,17 +1354,17 @@ function Sn({
     /* @__PURE__ */ e.jsx("label", { className: "text-xs leading-none peer-disabled:cursor-not-allowed peer-disabled:opacity-70", children: s })
   ] });
 }
-function kn() {
-  const { authToken: s } = es(), n = Be(null), a = r((c) => c.applyFilters), [t, i] = M(""), o = r((c) => c.filterValues), l = r((c) => c.card.sql);
+function wn() {
+  const { authToken: s } = es(), n = Be(null), a = r((c) => c.applyFilters), [t, i] = T(""), o = r((c) => c.filterValues), l = r((c) => c.card.sql);
   return /* @__PURE__ */ e.jsxs(
-    Zs,
+    Ys,
     {
       openDelay: 0,
       onOpenChange: async (c) => {
         if (!c)
           return;
         console.log("onOpenChange");
-        const d = await aa(
+        const h = await ea(
           "https://semaphor.cloud/api/v1/filter-sql",
           (s == null ? void 0 : s.accessToken) || "",
           {
@@ -1361,15 +1372,15 @@ function kn() {
             active_filters: o
           }
         );
-        console.log(d), d.sql ? (console.log(d.records), i(d.sql)) : i("Error");
+        console.log(h), h.sql ? (console.log(h.records), i(h.sql)) : i("Error");
       },
       children: [
-        /* @__PURE__ */ e.jsx(ea, { asChild: !0, children: a && /* @__PURE__ */ e.jsx("p", { className: "p-0 text-xs hover:cursor-pointer", children: "|  Filter Query" }) }),
-        /* @__PURE__ */ e.jsxs(sa, { align: "end", className: "w-[600px]", children: [
+        /* @__PURE__ */ e.jsx(Xs, { asChild: !0, children: a && /* @__PURE__ */ e.jsx("p", { className: "p-0 text-xs hover:cursor-pointer", children: "|  Filter Query" }) }),
+        /* @__PURE__ */ e.jsxs(Zs, { align: "end", className: "w-[600px]", children: [
           /* @__PURE__ */ e.jsx("div", { className: "flex justify-between space-x-4", children: /* @__PURE__ */ e.jsx("div", { className: "rounded-sm bg-muted p-2", children: /* @__PURE__ */ e.jsxs("code", { ref: n, className: "font-mono text-sm", children: [
             t,
             /* @__PURE__ */ e.jsx(
-              ta,
+              sa,
               {
                 onClick: () => Wa(n),
                 className: "ml-3 inline-block h-4 w-4 opacity-70 hover:cursor-pointer hover:opacity-100"
@@ -1385,7 +1396,7 @@ function kn() {
     }
   );
 }
-const wn = `
+const zn = `
 
 Use the following syntax to create a chart query. Please replace the x-axis, y-axis, stack-by, label, and measure with the actual column names of the table.
 
@@ -1432,7 +1443,7 @@ SELECT label, measure FROM table
 - Label - Category 
 - Measure - Number 
 `;
-function zn({
+function Fn({
   open: s,
   setOpen: n,
   userInput: a,
@@ -1440,61 +1451,61 @@ function zn({
   triggerAIRun: i,
   setTriggerAIRun: o
 }) {
-  const l = Be(null), c = Be(null), { authToken: d } = es(), [f, m] = M(!1), u = r((v) => v.actions.setCardSql), C = k((v) => v.dashboard.baseQueries), h = r((v) => v.actions.setRunSql), x = r((v) => v.actions.setCardType), [g, j] = M([]), b = r((v) => v.currentColumns), L = r((v) => v.card.sql), A = r((v) => v.selectedTableName), O = `
+  const l = Be(null), c = Be(null), { authToken: h } = es(), [g, m] = T(!1), u = r((y) => y.actions.setCardSql), N = k((y) => y.dashboard.baseQueries), d = r((y) => y.actions.setRunSql), x = r((y) => y.actions.setCardType), [f, w] = T([]), b = r((y) => y.currentColumns), E = r((y) => y.card.sql), C = r((y) => y.selectedTableName), O = `
   ${a}
 
-  Database Query Dialect: ${A === "api" || A === "s3" ? "DuckDb" : ""}
-  Table Name: ${A}   
-  Table Columns: ${b == null ? void 0 : b.map((v) => `${v.column_name} | ${v.data_type}`).join(", ")}
-  User SQL: ${L}  
-  ${C && `Base Queries: ${JSON.stringify(C)} `}`, y = ` When the user asks for a specific chart please use the following query structure to generate the chart query. Do not make up the column names. Use only the table columns provided above for the query. Replace x-axis, y-axis, and lables with the appropriate column names.
-  Visual Query Syntax: ${wn}`, { data: z, isLoading: E, isFetching: _, isError: Y, refetch: $ } = Ce({
+  Database Query Dialect: ${C === "api" || C === "s3" ? "DuckDb" : ""}
+  Table Name: ${C}   
+  Table Columns: ${b == null ? void 0 : b.map((y) => `${y.column_name} | ${y.data_type}`).join(", ")}
+  User SQL: ${E}  
+  ${N && `Base Queries: ${JSON.stringify(N)} `}`, j = ` When the user asks for a specific chart please use the following query structure to generate the chart query. Do not make up the column names. Use only the table columns provided above for the query. Replace x-axis, y-axis, and lables with the appropriate column names.
+  Visual Query Syntax: ${zn}`, { data: F, isLoading: A, isFetching: q, isError: Y, refetch: $ } = Ce({
     queryKey: ["ai-query"],
-    queryFn: () => ze(
+    queryFn: () => we(
       "https://semaphor.cloud/api/v1/ai",
-      (d == null ? void 0 : d.accessToken) || "",
+      (h == null ? void 0 : h.accessToken) || "",
       {
-        user_content: `userContent: ${O} ${f ? y : ""}`
+        user_content: `userContent: ${O} ${g ? j : ""}`
       }
     ),
     enabled: !1
     // Do not run by default.
   });
-  function U(v) {
-    if (v.toLowerCase().includes("bar"))
+  function U(y) {
+    if (y.toLowerCase().includes("bar"))
       x("bar");
-    else if (v.toLowerCase().includes("line"))
+    else if (y.toLowerCase().includes("line"))
       x("line");
-    else if (v.toLowerCase().includes("bubble"))
+    else if (y.toLowerCase().includes("bubble"))
       x("bubble");
-    else if (v.toLowerCase().includes("scatter"))
+    else if (y.toLowerCase().includes("scatter"))
       x("scatter");
-    else if (v.toLowerCase().includes("stacked"))
+    else if (y.toLowerCase().includes("stacked"))
       x("stackedBar");
-    else if (v.toLowerCase().includes("pie"))
+    else if (y.toLowerCase().includes("pie"))
       x("pie");
-    else if (v.toLowerCase().includes("donut") || v.toLowerCase().includes("doughnut"))
+    else if (y.toLowerCase().includes("donut") || y.toLowerCase().includes("doughnut"))
       x("doughnut");
-    else if (v.toLowerCase().includes("radar"))
+    else if (y.toLowerCase().includes("radar"))
       x("radar");
     else
       return x("bar"), !1;
     return !0;
   }
   K(() => {
-    z && j((v) => [...v, { role: "ai", content: z.response }]);
-  }, [z]), K(() => {
-    const v = setTimeout(() => {
-      var N;
+    F && w((y) => [...y, { role: "ai", content: F.response }]);
+  }, [F]), K(() => {
+    const y = setTimeout(() => {
+      var v;
       c.current && (c.current.scroll({
         top: c.current.scrollHeight,
         behavior: "smooth"
-      }), (N = l.current) == null || N.focus());
+      }), (v = l.current) == null || v.focus());
     }, 100);
-    return () => clearTimeout(v);
-  }, [g]);
+    return () => clearTimeout(y);
+  }, [f]);
   function D() {
-    a && (j((v) => [...v, { role: "user", content: a }]), U(a) && m(!0), t(""), $());
+    a && (w((y) => [...y, { role: "user", content: a }]), U(a) && m(!0), t(""), $());
   }
   K(() => {
     i && (D(), o(!1));
@@ -1507,7 +1518,7 @@ function zn({
     fontSize: 15,
     // padding: '5px',
     width: "100%"
-  }, G = {
+  }, J = {
     // background: '#f6f8fa',
     // color: '#000',
     fontFamily: "monospace",
@@ -1526,18 +1537,18 @@ function zn({
     listStyleType: "disc"
   }, Z = {
     // Override how paragraphs are rendered
-    p: ({ node: v, ...N }) => /* @__PURE__ */ e.jsx("p", { style: te, ...N }),
-    code: ({ node: v, ...N }) => /* @__PURE__ */ e.jsx("code", { className: "rounded-sm bg-muted px-2 py-1 text-sm", ...N }),
-    pre: ({ node: v, ...N }) => /* @__PURE__ */ e.jsxs("pre", { className: "space-y-2 rounded-sm bg-muted/50 p-3", style: G, children: [
-      /* @__PURE__ */ e.jsx("code", { className: "whitespace-normal text-sm", children: N.children }),
+    p: ({ node: y, ...v }) => /* @__PURE__ */ e.jsx("p", { style: te, ...v }),
+    code: ({ node: y, ...v }) => /* @__PURE__ */ e.jsx("code", { className: "rounded-sm bg-muted px-2 py-1 text-sm", ...v }),
+    pre: ({ node: y, ...v }) => /* @__PURE__ */ e.jsxs("pre", { className: "space-y-2 rounded-sm bg-muted/50 p-3", style: J, children: [
+      /* @__PURE__ */ e.jsx("code", { className: "whitespace-normal text-sm", children: v.children }),
       /* @__PURE__ */ e.jsxs("div", { className: "flex justify-start gap-2", children: [
-        /* @__PURE__ */ e.jsx(w, { onClick: J, size: "sm", variant: "outline", children: /* @__PURE__ */ e.jsx(ta, {}) }),
+        /* @__PURE__ */ e.jsx(z, { onClick: P, size: "sm", variant: "outline", children: /* @__PURE__ */ e.jsx(sa, {}) }),
         /* @__PURE__ */ e.jsx(
-          w,
+          z,
           {
-            onClick: (F) => {
-              const H = J(F);
-              H && (n(!1), u(H), h(!0));
+            onClick: (M) => {
+              const V = P(M);
+              V && (n(!1), u(V), d(!0));
             },
             size: "sm",
             variant: "outline",
@@ -1546,40 +1557,40 @@ function zn({
         )
       ] })
     ] }),
-    li: ({ node: v, ...N }) => /* @__PURE__ */ e.jsx("li", { style: ee, ...N })
+    li: ({ node: y, ...v }) => /* @__PURE__ */ e.jsx("li", { style: ee, ...v })
     // You can add more overrides for other elements like h1, h2, etc.
   };
-  function J(v) {
-    const N = v.currentTarget.closest("pre");
-    if (!N)
+  function P(y) {
+    const v = y.currentTarget.closest("pre");
+    if (!v)
       return;
-    const F = N.textContent || N.innerText;
-    return navigator.clipboard.writeText(F).then(() => console.log("Text copied to clipboard")).catch((H) => console.error("Error in copying text: ", H)), F;
+    const M = v.textContent || v.innerText;
+    return navigator.clipboard.writeText(M).then(() => console.log("Text copied to clipboard")).catch((V) => console.error("Error in copying text: ", V)), M;
   }
   function I() {
-    return g == null ? void 0 : g.map((v, N) => v.role === "user" ? /* @__PURE__ */ e.jsxs(
+    return f == null ? void 0 : f.map((y, v) => y.role === "user" ? /* @__PURE__ */ e.jsxs(
       "div",
       {
         className: "flex items-start rounded-md bg-muted p-3 text-sm",
         children: [
-          /* @__PURE__ */ e.jsx(pn, { className: "mr-2 h-5 w-5" }),
-          /* @__PURE__ */ e.jsx("div", { children: v.content })
+          /* @__PURE__ */ e.jsx(fn, { className: "mr-2 h-5 w-5" }),
+          /* @__PURE__ */ e.jsx("div", { children: y.content })
         ]
       },
-      N
-    ) : v.role === "ai" ? /* @__PURE__ */ e.jsx(
+      v
+    ) : y.role === "ai" ? /* @__PURE__ */ e.jsx(
       Za,
       {
         className: "w-full overflow-auto py-1",
         components: Z,
-        children: z == null ? void 0 : z.response.replace(/DuckDB/gi, "Semaphor")
+        children: F == null ? void 0 : F.response.replace(/DuckDB/gi, "Semaphor")
       },
-      N
-    ) : /* @__PURE__ */ e.jsx("div", {}, N));
+      v
+    ) : /* @__PURE__ */ e.jsx("div", {}, v));
   }
-  return /* @__PURE__ */ e.jsxs(ds, { open: s, onOpenChange: n, children: [
-    /* @__PURE__ */ e.jsx(hs, { asChild: !0, children: /* @__PURE__ */ e.jsx(
-      w,
+  return /* @__PURE__ */ e.jsxs(us, { open: s, onOpenChange: n, children: [
+    /* @__PURE__ */ e.jsx(xs, { asChild: !0, children: /* @__PURE__ */ e.jsx(
+      z,
       {
         size: "sm",
         className: "w-full justify-start border font-normal text-muted-foreground focus-visible:ring-0 focus-visible:ring-offset-0",
@@ -1588,13 +1599,13 @@ function zn({
       }
     ) }),
     /* @__PURE__ */ e.jsxs(
-      ms,
+      ps,
       {
         className: "flex flex-col justify-between overflow-auto sm:max-w-[425px] md:max-h-[625px] md:min-w-[625px]",
         children: [
-          /* @__PURE__ */ e.jsxs(us, { children: [
-            /* @__PURE__ */ e.jsx(xs, { children: "Assistant" }),
-            /* @__PURE__ */ e.jsx(ps, { children: "What can I help you with?" })
+          /* @__PURE__ */ e.jsxs(fs, { children: [
+            /* @__PURE__ */ e.jsx(gs, { children: "Assistant" }),
+            /* @__PURE__ */ e.jsx(js, { children: "What can I help you with?" })
           ] }),
           /* @__PURE__ */ e.jsx(
             "div",
@@ -1609,35 +1620,35 @@ function zn({
             {
               children: /* @__PURE__ */ e.jsxs("div", { className: "flex w-full items-center rounded-md border", children: [
                 /* @__PURE__ */ e.jsx(
-                  na,
+                  aa,
                   {
                     autoFocus: !0,
                     ref: l,
-                    onKeyDown: (v) => {
-                      v.key === "Enter" && !v.shiftKey && (v.preventDefault(), t(""), D());
+                    onKeyDown: (y) => {
+                      y.key === "Enter" && !y.shiftKey && (y.preventDefault(), t(""), D());
                     },
                     placeholder: "Type your question here...",
-                    onFocus: (v) => {
-                      const N = v.target, F = N.value.length;
-                      N.setSelectionRange(F, F);
+                    onFocus: (y) => {
+                      const v = y.target, M = v.value.length;
+                      v.setSelectionRange(M, M);
                     },
                     className: W(
                       "max-h-10 min-h-7 resize-none border-none focus-visible:ring-0 focus-visible:ring-ring focus-visible:ring-offset-0"
                     ),
-                    disabled: E || _,
+                    disabled: A || q,
                     value: a,
-                    onChange: (v) => t(v.target.value)
+                    onChange: (y) => t(y.target.value)
                   }
                 ),
                 " ",
                 /* @__PURE__ */ e.jsx(
-                  w,
+                  z,
                   {
                     className: "h-8",
                     size: "sm",
                     variant: "ghost",
                     onClick: D,
-                    children: !E && !_ ? /* @__PURE__ */ e.jsx(Xa, {}) : /* @__PURE__ */ e.jsx(He, { className: "mr-2 h-4 w-4 animate-spin text-foreground/50" })
+                    children: !A && !q ? /* @__PURE__ */ e.jsx(Xa, {}) : /* @__PURE__ */ e.jsx(He, { className: "mr-2 h-4 w-4 animate-spin text-foreground/50" })
                   }
                 )
               ] })
@@ -1654,11 +1665,11 @@ var pa = {
   className: void 0,
   style: void 0,
   attr: void 0
-}, _s = me.createContext && /* @__PURE__ */ me.createContext(pa), Fn = ["attr", "size", "title"];
-function On(s, n) {
+}, Rs = me.createContext && /* @__PURE__ */ me.createContext(pa), On = ["attr", "size", "title"];
+function Mn(s, n) {
   if (s == null)
     return {};
-  var a = Mn(s, n), t, i;
+  var a = Tn(s, n), t, i;
   if (Object.getOwnPropertySymbols) {
     var o = Object.getOwnPropertySymbols(s);
     for (i = 0; i < o.length; i++)
@@ -1666,7 +1677,7 @@ function On(s, n) {
   }
   return a;
 }
-function Mn(s, n) {
+function Tn(s, n) {
   if (s == null)
     return {};
   var a = {}, t = Object.keys(s), i, o;
@@ -1684,7 +1695,7 @@ function Xe() {
     return s;
   }, Xe.apply(this, arguments);
 }
-function Hs(s, n) {
+function _s(s, n) {
   var a = Object.keys(s);
   if (Object.getOwnPropertySymbols) {
     var t = Object.getOwnPropertySymbols(s);
@@ -1697,18 +1708,18 @@ function Hs(s, n) {
 function Ze(s) {
   for (var n = 1; n < arguments.length; n++) {
     var a = arguments[n] != null ? arguments[n] : {};
-    n % 2 ? Hs(Object(a), !0).forEach(function(t) {
-      Tn(s, t, a[t]);
-    }) : Object.getOwnPropertyDescriptors ? Object.defineProperties(s, Object.getOwnPropertyDescriptors(a)) : Hs(Object(a)).forEach(function(t) {
+    n % 2 ? _s(Object(a), !0).forEach(function(t) {
+      An(s, t, a[t]);
+    }) : Object.getOwnPropertyDescriptors ? Object.defineProperties(s, Object.getOwnPropertyDescriptors(a)) : _s(Object(a)).forEach(function(t) {
       Object.defineProperty(s, t, Object.getOwnPropertyDescriptor(a, t));
     });
   }
   return s;
 }
-function Tn(s, n, a) {
-  return n = An(n), n in s ? Object.defineProperty(s, n, { value: a, enumerable: !0, configurable: !0, writable: !0 }) : s[n] = a, s;
+function An(s, n, a) {
+  return n = Ln(n), n in s ? Object.defineProperty(s, n, { value: a, enumerable: !0, configurable: !0, writable: !0 }) : s[n] = a, s;
 }
-function An(s) {
+function Ln(s) {
   var n = En(s, "string");
   return typeof n == "symbol" ? n : String(n);
 }
@@ -1730,23 +1741,23 @@ function fa(s) {
   }, n.attr), fa(n.child)));
 }
 function fe(s) {
-  return (n) => /* @__PURE__ */ me.createElement(Ln, Xe({
+  return (n) => /* @__PURE__ */ me.createElement(Dn, Xe({
     attr: Ze({}, s.attr)
   }, n), fa(s.child));
 }
-function Ln(s) {
+function Dn(s) {
   var n = (a) => {
     var {
       attr: t,
       size: i,
       title: o
-    } = s, l = On(s, Fn), c = i || a.size || "1em", d;
-    return a.className && (d = a.className), s.className && (d = (d ? d + " " : "") + s.className), /* @__PURE__ */ me.createElement("svg", Xe({
+    } = s, l = Mn(s, On), c = i || a.size || "1em", h;
+    return a.className && (h = a.className), s.className && (h = (h ? h + " " : "") + s.className), /* @__PURE__ */ me.createElement("svg", Xe({
       stroke: "currentColor",
       fill: "currentColor",
       strokeWidth: "0"
     }, a.attr, t, l, {
-      className: d,
+      className: h,
       style: Ze(Ze({
         color: s.color || a.color
       }, a.style), s.style),
@@ -1755,17 +1766,17 @@ function Ln(s) {
       xmlns: "http://www.w3.org/2000/svg"
     }), o && /* @__PURE__ */ me.createElement("title", null, o), s.children);
   };
-  return _s !== void 0 ? /* @__PURE__ */ me.createElement(_s.Consumer, null, (a) => n(a)) : n(pa);
+  return Rs !== void 0 ? /* @__PURE__ */ me.createElement(Rs.Consumer, null, (a) => n(a)) : n(pa);
 }
-function Dn(s) {
+function In(s) {
   return fe({ tag: "svg", attr: { viewBox: "0 0 448 512" }, child: [{ tag: "path", attr: { d: "M439.8 200.5c-7.7-30.9-22.3-54.2-53.4-54.2h-40.1v47.4c0 36.8-31.2 67.8-66.8 67.8H172.7c-29.2 0-53.4 25-53.4 54.3v101.8c0 29 25.2 46 53.4 54.3 33.8 9.9 66.3 11.7 106.8 0 26.9-7.8 53.4-23.5 53.4-54.3v-40.7H226.2v-13.6h160.2c31.1 0 42.6-21.7 53.4-54.2 11.2-33.5 10.7-65.7 0-108.6zM286.2 404c11.1 0 20.1 9.1 20.1 20.3 0 11.3-9 20.4-20.1 20.4-11 0-20.1-9.2-20.1-20.4.1-11.3 9.1-20.3 20.1-20.3zM167.8 248.1h106.8c29.7 0 53.4-24.5 53.4-54.3V91.9c0-29-24.4-50.7-53.4-55.6-35.8-5.9-74.7-5.6-106.8.1-45.2 8-53.4 24.7-53.4 55.6v40.7h106.9v13.6h-147c-31.1 0-58.3 18.7-66.8 54.2-9.8 40.7-10.2 66.1 0 108.6 7.6 31.6 25.7 54.2 56.8 54.2H101v-48.8c0-35.3 30.5-66.4 66.8-66.4zm-6.7-142.6c-11.1 0-20.1-9.1-20.1-20.3.1-11.3 9-20.4 20.1-20.4 11 0 20.1 9.2 20.1 20.4s-9 20.3-20.1 20.3z" }, child: [] }] })(s);
 }
-function In() {
-  const { theme: s } = st(), n = Be(), a = Be(), [t, i] = M(!1), [o, l] = M(!1), [c, d] = M(!1), [f, m] = M(""), [u, C] = M(!1), { authToken: h } = es();
+function qn() {
+  const { theme: s } = st(), n = Be(), a = Be(), [t, i] = T(!1), [o, l] = T(!1), [c, h] = T(!1), [g, m] = T(""), [u, N] = T(!1), { authToken: d } = es();
   k((p) => p.selectedSheetId);
-  const x = k((p) => p.dashboard.baseQueries), g = r((p) => p.card), j = k((p) => p.theme), b = r((p) => p.isShowingVisual), L = r(
+  const x = k((p) => p.dashboard.baseQueries), f = r((p) => p.card), w = k((p) => p.theme), b = r((p) => p.isShowingVisual), E = r(
     (p) => p.selectedConnectionId
-  ), A = r(
+  ), C = r(
     (p) => p.selectedDatabaseName
   ), O = r(
     (p) => p.selectedSchemaName
@@ -1773,37 +1784,37 @@ function In() {
   k(
     (p) => p.actions.updateFrameCard
   );
-  const y = r((p) => p.selectedTableName), z = r((p) => p.card.sql), E = r((p) => p.card.python), _ = at(z, x), Y = r((p) => p.selectedConnectionId), $ = r((p) => p.frame), U = r((p) => p.filterValues), D = r((p) => p.applyFilters), {
+  const j = r((p) => p.selectedTableName), F = r((p) => p.card.sql), A = r((p) => p.card.python), q = at(F, x), Y = r((p) => p.selectedConnectionId), $ = r((p) => p.frame), U = r((p) => p.filterValues), D = r((p) => p.applyFilters), {
     setCardCustomCfg: te,
-    setQueryResultColumns: G,
+    setQueryResultColumns: J,
     setFilterValues: ee,
     setCardSql: Z,
-    setCardPython: J,
+    setCardPython: P,
     setQueryError: I,
-    setPythonStdOut: v,
-    setCardPreferences: N
-  } = r((p) => p.actions), F = r((p) => p.onSave), H = r(
+    setPythonStdOut: y,
+    setCardPreferences: v
+  } = r((p) => p.actions), M = r((p) => p.onSave), V = r(
     (p) => p.actions.setApplyFilters
   ), ue = r((p) => p.onClose), se = r((p) => p.actions.setCardData), ge = r((p) => p.actions.setSqlGen), je = r((p) => p.runSql), be = r((p) => p.actions.setRunSql), xe = r(
     (p) => p.actions.setIsSqlRunning
   ), {
-    data: P,
+    data: G,
     isLoading: ne,
     isFetching: le,
     isSuccess: ye,
     isError: re,
-    error: Ie,
+    error: De,
     status: ss,
     refetch: ve
   } = Ce({
-    queryKey: [_, E],
-    queryFn: () => aa(
+    queryKey: [q, A],
+    queryFn: () => ea(
       "https://semaphor.cloud/api/v1/query",
-      (h == null ? void 0 : h.accessToken) || "",
+      (d == null ? void 0 : d.accessToken) || "",
       {
         connection_id: Y,
-        sql: _,
-        python: E === Ts ? "" : E,
+        sql: q,
+        python: A === As ? "" : A,
         active_filters: D ? U : []
       }
     ),
@@ -1811,51 +1822,51 @@ function In() {
     retry: !1
   });
   K(() => {
-    if (P && (se(P.records), v((P == null ? void 0 : P.output) || ""), P.records.length > 0)) {
-      const { dimensionKeys: p } = is(P.records);
-      G(p);
+    if (G && (se(G.records), y((G == null ? void 0 : G.output) || ""), G.records.length > 0)) {
+      const { dimensionKeys: p } = ds(G.records);
+      J(p);
     }
-  }, [P, se, G, v]), K(() => {
+  }, [G, se, J, y]), K(() => {
     je && (ve(), be(!1));
   }, [je, ve, be]), K(() => {
-    (ne || le) && xe(!0), (re || ye) && xe(!1), re ? (I(Ie.message), se([]), G([]), v("")) : I("");
+    (ne || le) && xe(!0), (re || ye) && xe(!1), re ? (I(De.message), se([]), J([]), y("")) : I("");
   }, [
     ne,
     le,
-    P,
-    v,
+    G,
+    y,
     re,
     ye,
     xe,
     se,
-    G,
+    J,
     I,
-    Ie
+    De
   ]);
-  function Pe() {
-    Z(""), se([]), ge({}), te(""), N({});
+  function Je() {
+    Z(""), se([]), ge({}), te(""), v({});
   }
-  const qe = (p) => {
+  const Ie = (p) => {
     a.current = p;
   };
   function S() {
-    let p = z;
-    z && !z.includes("{{") && (p = Nn(z), Z(p));
+    let p = F;
+    F && !F.includes("{{") && (p = Cn(F), Z(p));
     const ie = {
-      ...g,
+      ...f,
       lastSelectedSchema: O,
-      lastSelectedDatabase: A,
-      lastSelectedTable: y,
-      connectionId: L,
-      type: b ? g.type : "table",
+      lastSelectedDatabase: C,
+      lastSelectedTable: j,
+      connectionId: E,
+      type: b ? f.type : "table",
       sql: p,
-      customCfg: b ? g.customCfg : null
-    }, Ve = $.cards.map(
-      (Ne) => Ne.id === g.id ? ie : Ne
+      customCfg: b ? f.customCfg : null
+    }, qe = $.cards.map(
+      (Ne) => Ne.id === f.id ? ie : Ne
     );
-    F == null || F({
+    M == null || M({
       ...$,
-      cards: Ve
+      cards: qe
     });
   }
   function za() {
@@ -1868,9 +1879,9 @@ function In() {
     return Oa(ie);
   }
   function Oa(p) {
-    const [ie, Ve, Ne] = p.split(" "), Q = parseFloat(ie), Aa = parseFloat(Ve), Ea = parseFloat(Ne), La = Aa / 100, zs = Ea / 100, pe = (1 - Math.abs(2 * zs - 1)) * La, ke = pe * (1 - Math.abs(Q / 60 % 2 - 1)), as = zs - pe / 2;
+    const [ie, qe, Ne] = p.split(" "), Q = parseFloat(ie), Aa = parseFloat(qe), La = parseFloat(Ne), Ea = Aa / 100, Fs = La / 100, pe = (1 - Math.abs(2 * Fs - 1)) * Ea, Se = pe * (1 - Math.abs(Q / 60 % 2 - 1)), as = Fs - pe / 2;
     let oe = 0, ce = 0, de = 0;
-    0 <= Q && Q < 60 ? (oe = pe, ce = ke, de = 0) : 60 <= Q && Q < 120 ? (oe = ke, ce = pe, de = 0) : 120 <= Q && Q < 180 ? (oe = 0, ce = pe, de = ke) : 180 <= Q && Q < 240 ? (oe = 0, ce = ke, de = pe) : 240 <= Q && Q < 300 ? (oe = ke, ce = 0, de = pe) : 300 <= Q && Q < 360 && (oe = pe, ce = 0, de = ke), oe = Math.round((oe + as) * 255), ce = Math.round((ce + as) * 255), de = Math.round((de + as) * 255);
+    0 <= Q && Q < 60 ? (oe = pe, ce = Se, de = 0) : 60 <= Q && Q < 120 ? (oe = Se, ce = pe, de = 0) : 120 <= Q && Q < 180 ? (oe = 0, ce = pe, de = Se) : 180 <= Q && Q < 240 ? (oe = 0, ce = Se, de = pe) : 240 <= Q && Q < 300 ? (oe = Se, ce = 0, de = pe) : 300 <= Q && Q < 360 && (oe = pe, ce = 0, de = Se), oe = Math.round((oe + as) * 255), ce = Math.round((ce + as) * 255), de = Math.round((de + as) * 255);
     const ts = (Da) => {
       const ns = Da.toString(16);
       return ns.length == 1 ? "0" + ns : ns;
@@ -1880,7 +1891,7 @@ function In() {
   K(() => {
     const p = n.current, ie = a.current;
     if (p) {
-      const Ve = window.matchMedia("(prefers-color-scheme: dark)").matches ? "dark" : "light", Ne = j === "system" ? Ve : j;
+      const qe = window.matchMedia("(prefers-color-scheme: dark)").matches ? "dark" : "light", Ne = w === "system" ? qe : w;
       p.editor.defineTheme("default", {
         // base: theme === 'light' ? 'hc-light' : 'vs-dark',
         base: Ne === "light" ? "vs" : "vs-dark",
@@ -1899,8 +1910,8 @@ function In() {
       }
     ), () => {
     };
-  }, [s, j, n.current]);
-  function ws(p) {
+  }, [s, w, n.current]);
+  function zs(p) {
     n.current = p;
   }
   function Ma() {
@@ -1913,14 +1924,14 @@ function In() {
           children: /* @__PURE__ */ e.jsxs("div", { className: "w-[99%]", children: [
             /* @__PURE__ */ e.jsxs("div", { className: "flex items-center gap-2 pt-3", children: [
               /* @__PURE__ */ e.jsx(
-                Sn,
+                kn,
                 {
                   checked: D,
-                  onCheckedChange: () => H(!D),
+                  onCheckedChange: () => V(!D),
                   text: "Apply Filters"
                 }
               ),
-              /* @__PURE__ */ e.jsx(kn, {}),
+              /* @__PURE__ */ e.jsx(wn, {}),
               U && o && /* @__PURE__ */ e.jsx(
                 Re,
                 {
@@ -1930,7 +1941,7 @@ function In() {
               )
             ] }),
             /* @__PURE__ */ e.jsx(
-              Qe,
+              Ve,
               {
                 theme: "default",
                 onChange: (p) => {
@@ -1964,7 +1975,7 @@ function In() {
         }
       ),
       U && !o && /* @__PURE__ */ e.jsx(
-        oa,
+        ia,
         {
           onClick: () => l(!0),
           className: W(
@@ -1979,14 +1990,14 @@ function In() {
   }
   function Ta() {
     return /* @__PURE__ */ e.jsxs(
-      os,
+      hs,
       {
         className: "flex grow pb-1",
         direction: "vertical",
         role: "editor-resizable-group",
         children: [
           /* @__PURE__ */ e.jsxs(
-            Fe,
+            ze,
             {
               id: "1",
               order: 1,
@@ -1999,14 +2010,14 @@ function In() {
                     role: "sql-container",
                     className: "relative flex w-[99%]",
                     children: /* @__PURE__ */ e.jsx(
-                      Qe,
+                      Ve,
                       {
                         theme: "default",
                         className: "pt-3",
                         onChange: (p) => {
                           Z(p);
                         },
-                        value: z,
+                        value: F,
                         options: {
                           minimap: {
                             enabled: !1
@@ -2021,8 +2032,8 @@ function In() {
                         },
                         defaultLanguage: "sql",
                         defaultValue: "SELECT * FROM table",
-                        beforeMount: ws,
-                        onMount: qe
+                        beforeMount: zs,
+                        onMount: Ie
                       }
                     )
                   }
@@ -2032,9 +2043,9 @@ function In() {
             }
           ),
           t && /* @__PURE__ */ e.jsxs(e.Fragment, { children: [
-            /* @__PURE__ */ e.jsx(cs, { withHandle: !0, className: "border" }),
+            /* @__PURE__ */ e.jsx(ms, { withHandle: !0, className: "border" }),
             /* @__PURE__ */ e.jsxs(
-              Fe,
+              ze,
               {
                 id: "2",
                 order: 2,
@@ -2047,14 +2058,14 @@ function In() {
                       role: "python-container",
                       className: "relative flex w-[99%] pt-0",
                       children: /* @__PURE__ */ e.jsx(
-                        Qe,
+                        Ve,
                         {
                           className: "pt-3",
                           theme: "default",
                           onChange: (p) => {
-                            J(p && p.trim() || "");
+                            P(p && p.trim() || "");
                           },
-                          value: E || Ts,
+                          value: A || As,
                           options: {
                             minimap: {
                               enabled: !1
@@ -2068,8 +2079,8 @@ function In() {
                             renderLineHighlight: "none"
                           },
                           defaultLanguage: "python",
-                          beforeMount: ws,
-                          onMount: qe
+                          beforeMount: zs,
+                          onMount: Ie
                         }
                       )
                     }
@@ -2110,7 +2121,7 @@ function In() {
               children: [
                 /* @__PURE__ */ e.jsxs("div", { className: "flex grow items-center gap-2", children: [
                   /* @__PURE__ */ e.jsxs(
-                    w,
+                    z,
                     {
                       title: "Shift + Enter",
                       disabled: ne || le,
@@ -2121,59 +2132,59 @@ function In() {
                       size: "sm",
                       variant: "outline",
                       children: [
-                        ne || le ? /* @__PURE__ */ e.jsx(He, { className: "mr-2 h-4 w-4 animate-spin text-foreground/50" }) : /* @__PURE__ */ e.jsx(ln, { className: "mr-2 h-4 w-4" }),
+                        ne || le ? /* @__PURE__ */ e.jsx(He, { className: "mr-2 h-4 w-4 animate-spin text-foreground/50" }) : /* @__PURE__ */ e.jsx(rn, { className: "mr-2 h-4 w-4" }),
                         "Run"
                       ]
                     }
                   ),
                   re && /* @__PURE__ */ e.jsx(
-                    Cn,
+                    Sn,
                     {
-                      error: Ie.message,
-                      setShowAIDialog: d,
-                      setTriggerAIRun: C,
+                      error: De.message,
+                      setShowAIDialog: h,
+                      setTriggerAIRun: N,
                       setUserInputforAI: m
                     }
                   ),
                   /* @__PURE__ */ e.jsxs(
-                    w,
+                    z,
                     {
-                      onClick: Pe,
+                      onClick: Je,
                       className: "",
                       size: "sm",
                       variant: "outline",
                       children: [
-                        /* @__PURE__ */ e.jsx(Qt, { className: "mr-2 size-4" }),
+                        /* @__PURE__ */ e.jsx(Wt, { className: "mr-2 size-4" }),
                         "Clear"
                       ]
                     }
                   ),
                   /* @__PURE__ */ e.jsx(
-                    Xs,
+                    Ws,
                     {
                       pressed: t,
                       onPressedChange: (p) => i(p),
                       className: "",
                       size: "sm",
                       variant: "outline",
-                      children: /* @__PURE__ */ e.jsx(Dn, { className: "size-4 text-foreground/70" })
+                      children: /* @__PURE__ */ e.jsx(In, { className: "size-4 text-foreground/70" })
                     }
                   ),
                   /* @__PURE__ */ e.jsx(
-                    zn,
+                    Fn,
                     {
                       open: c,
-                      setOpen: d,
-                      userInput: f,
+                      setOpen: h,
+                      userInput: g,
                       triggerAIRun: u,
-                      setTriggerAIRun: C,
+                      setTriggerAIRun: N,
                       setUserInput: (p) => m(p)
                     }
                   )
                 ] }),
                 /* @__PURE__ */ e.jsxs("div", { className: "flex items-end gap-2", children: [
                   /* @__PURE__ */ e.jsxs(
-                    w,
+                    z,
                     {
                       onClick: S,
                       size: "sm",
@@ -2185,7 +2196,7 @@ function In() {
                     }
                   ),
                   /* @__PURE__ */ e.jsxs(
-                    w,
+                    z,
                     {
                       onClick: za,
                       className: "w-full",
@@ -2206,21 +2217,21 @@ function In() {
     )
   );
 }
-function qn({ data: s }) {
+function Vn({ data: s }) {
   var l;
   const [n, a] = me.useState([]), i = Object.keys(s[0]).map((c) => ({
     // header: key,
     accessorKey: c,
-    header: ({ column: d }) => {
-      const f = d.getIsSorted();
+    header: ({ column: h }) => {
+      const g = h.getIsSorted();
       return /* @__PURE__ */ e.jsx("div", { className: "flex gap-2", children: /* @__PURE__ */ e.jsxs(
         "div",
         {
           className: "flex cursor-pointer items-center",
-          onClick: () => d.toggleSorting(d.getIsSorted() === "asc"),
+          onClick: () => h.toggleSorting(h.getIsSorted() === "asc"),
           children: [
             c,
-            f === "asc" ? /* @__PURE__ */ e.jsx(nt, { className: "ml-2 h-5 w-5" }) : f === "desc" ? /* @__PURE__ */ e.jsx(lt, { className: "ml-2 h-5 w-5" }) : null
+            g === "asc" ? /* @__PURE__ */ e.jsx(nt, { className: "ml-2 h-5 w-5" }) : g === "desc" ? /* @__PURE__ */ e.jsx(lt, { className: "ml-2 h-5 w-5" }) : null
           ]
         }
       ) });
@@ -2238,16 +2249,16 @@ function qn({ data: s }) {
     }
   });
   return /* @__PURE__ */ e.jsxs(it, { children: [
-    /* @__PURE__ */ e.jsx(ot, { children: o.getHeaderGroups().map((c) => /* @__PURE__ */ e.jsx(ls, { children: c.headers.map((d) => /* @__PURE__ */ e.jsx(ct, { className: "sticky top-0 bg-muted", children: d.isPlaceholder ? null : As(
-      d.column.columnDef.header,
-      d.getContext()
-    ) }, d.id)) }, c.id)) }),
+    /* @__PURE__ */ e.jsx(ot, { children: o.getHeaderGroups().map((c) => /* @__PURE__ */ e.jsx(ls, { children: c.headers.map((h) => /* @__PURE__ */ e.jsx(ct, { className: "sticky top-0 bg-muted", children: h.isPlaceholder ? null : Ls(
+      h.column.columnDef.header,
+      h.getContext()
+    ) }, h.id)) }, c.id)) }),
     /* @__PURE__ */ e.jsx(dt, { children: (l = o.getRowModel().rows) != null && l.length ? o.getRowModel().rows.map((c) => /* @__PURE__ */ e.jsx(
       ls,
       {
         className: "whitespace-nowrap py-2",
         "data-state": c.getIsSelected() && "selected",
-        children: c.getVisibleCells().map((d) => /* @__PURE__ */ e.jsx(Es, { children: As(d.column.columnDef.cell, d.getContext()) }, d.id))
+        children: c.getVisibleCells().map((h) => /* @__PURE__ */ e.jsx(Es, { children: Ls(h.column.columnDef.cell, h.getContext()) }, h.id))
       },
       c.id
     )) : /* @__PURE__ */ e.jsx(ls, { children: /* @__PURE__ */ e.jsx(Es, { colSpan: i.length, className: "h-24 text-center", children: "No results." }) }) })
@@ -2258,8 +2269,9 @@ function ga({
   className: s,
   ...n
 }) {
+  var l;
   me.useState(0);
-  const a = k((l) => l.themeStyle), t = r((l) => l.card), i = r((l) => l.actions.setCard);
+  const a = k((c) => c.themeStyle), t = r((c) => c.card), i = r((c) => c.actions.setCard);
   if (K(() => {
   }, [
     t.data,
@@ -2271,7 +2283,7 @@ function ga({
   ]), !t.id)
     return null;
   let o;
-  return t.data && t.data.length > 0 && (o = la({
+  return t.data && t.data.length > 0 && (o = ta({
     data: t.data,
     cardType: t.type,
     cfg: t.cfg,
@@ -2286,19 +2298,19 @@ function ga({
       children: [
         /* @__PURE__ */ e.jsxs(pt, { className: "py-4", children: [
           /* @__PURE__ */ e.jsx(
-            Ls,
+            Ds,
             {
               text: t.title,
-              onSave: (l) => i({ ...t, title: l }),
+              onSave: (c) => i({ ...t, title: c }),
               children: /* @__PURE__ */ e.jsx("div", { className: "flex items-center gap-2", children: /* @__PURE__ */ e.jsx(ft, { className: "text-base", children: t.title }) })
             },
             t.title
           ),
           /* @__PURE__ */ e.jsx(
-            Ls,
+            Ds,
             {
               text: t.description || "",
-              onSave: (l) => i({ ...t, description: l }),
+              onSave: (c) => i({ ...t, description: c }),
               children: /* @__PURE__ */ e.jsxs(gt, { children: [
                 " ",
                 t.description
@@ -2314,7 +2326,7 @@ function ga({
             {
               cfg: o
             },
-            JSON.stringify(o) + JSON.stringify(t.preferences)
+            JSON.stringify(o) + JSON.stringify(t.preferences) + ((l = t == null ? void 0 : t.preferences) == null ? void 0 : l.customVisualCode)
           ),
           t.type === "table" && t.data && t.data.length > 0 && // All of the below css classes are #IMPORTANT for the table to scroll properly
           /* @__PURE__ */ e.jsx(yt, { className: "flex min-h-0 flex-1 grow basis-0", children: /* @__PURE__ */ e.jsx(vt, { card: t, data: t == null ? void 0 : t.data }) })
@@ -2323,90 +2335,89 @@ function ga({
     }
   );
 }
-function Vn() {
-  const [s, n] = M(!1), [a, t] = M(""), [i, o] = M(""), [l, c] = M(""), d = r((j) => j.card), f = r(
-    (j) => j.card.customCfg
-  ), m = r(
-    (j) => j.actions.setCardCustomCfg
-  );
-  function u(j) {
-    var A, O;
-    const b = {
-      ...j,
+function Rn() {
+  const [s, n] = T(!1), [a, t] = T(""), [i, o] = T(""), [l, c] = T(""), [h, g] = T(""), m = r((C) => C.card), u = r(
+    (C) => C.card.customCfg
+  ), { setCardCustomCfg: N, setCustomVisualCode: d } = Nt();
+  function x(C) {
+    var F, A;
+    const O = {
+      ...C,
       data: {
-        ...j == null ? void 0 : j.data,
-        datasets: (O = (A = j == null ? void 0 : j.data) == null ? void 0 : A.datasets) == null ? void 0 : O.map((y) => ({
-          ...y,
+        ...C == null ? void 0 : C.data,
+        datasets: (A = (F = C == null ? void 0 : C.data) == null ? void 0 : F.datasets) == null ? void 0 : A.map((q) => ({
+          ...q,
           data: []
         }))
       }
     };
-    return JSON.stringify(b, null, 1);
+    return JSON.stringify(O, null, 1);
   }
-  function C() {
-    if (!d.data || d.data.length === 0)
+  function f() {
+    var O, j;
+    if (!m.data || m.data.length === 0)
       return;
-    const j = la({
-      data: d.data,
-      cardType: d.type,
-      cfg: d.cfg,
-      preferences: d.preferences
+    const C = ta({
+      data: m.data,
+      cardType: m.type,
+      cfg: m.cfg,
+      preferences: m.preferences
     });
-    j && (t(JSON.stringify(j, null, 1)), f && o(JSON.stringify(f, null, 1)));
+    C && (t(JSON.stringify(C, null, 1)), (O = m == null ? void 0 : m.preferences) != null && O.customVisualCode && c((j = m == null ? void 0 : m.preferences) == null ? void 0 : j.customVisualCode), u && o(JSON.stringify(u, null, 1)));
   }
-  function h() {
-    if (i)
+  function w() {
+    if (l && d(l), !!i)
       try {
-        const j = JSON.parse(i);
-        return j ? (m(j), c(""), o(""), j) : void 0;
-      } catch (j) {
-        console.log(j), c("Invalid JSON");
+        const C = JSON.parse(i);
+        return C ? (N(C), g(""), o(""), C) : void 0;
+      } catch (C) {
+        console.log(C), g("Invalid JSON");
       }
   }
-  function x() {
-    o(""), m(null);
+  function b() {
+    o(""), N(null);
   }
-  function g() {
-    let j;
-    if (f) {
-      const b = qs.cloneDeep(d.cfg), L = qs.merge(b, f);
-      return j = u(L), j;
+  function E() {
+    let C;
+    if (u) {
+      const O = Is.cloneDeep(m.cfg), j = Is.merge(O, u);
+      return C = x(j), C;
     }
-    return a ? (j = u(JSON.parse(a)), j) : "";
+    return a ? (C = x(JSON.parse(a)), C) : "";
   }
-  return /* @__PURE__ */ e.jsxs(ds, { open: s, onOpenChange: n, children: [
-    /* @__PURE__ */ e.jsx(hs, { asChild: !0, children: /* @__PURE__ */ e.jsx(
-      w,
+  return /* @__PURE__ */ e.jsxs(us, { open: s, onOpenChange: n, children: [
+    /* @__PURE__ */ e.jsx(xs, { asChild: !0, children: /* @__PURE__ */ e.jsx(
+      z,
       {
-        onClick: C,
-        className: ` ${f && "border-foreground/50 dark:border-foreground/70"}`,
+        onClick: f,
+        className: ` ${u && "border-foreground/50 dark:border-foreground/70"}`,
         size: "sm",
         variant: "outline",
-        children: /* @__PURE__ */ e.jsx(Nt, { className: "h-4 w-4" })
+        children: /* @__PURE__ */ e.jsx(Ct, { className: "h-4 w-4" })
       }
     ) }),
     /* @__PURE__ */ e.jsxs(
-      ms,
+      ps,
       {
-        className: "max-h-[70vh] min-h-[70vh] min-w-[900px] overflow-auto",
+        className: "max-h-[70vh] min-h-[70vh] overflow-auto sm:min-w-[900px] lg:min-w-[1200px]",
         children: [
-          /* @__PURE__ */ e.jsxs(us, { className: "", children: [
+          /* @__PURE__ */ e.jsxs(fs, { className: "", children: [
             /* @__PURE__ */ e.jsxs("div", { className: "flex items-center gap-2", children: [
-              /* @__PURE__ */ e.jsx(xs, { children: "Customize Card" }),
-              /* @__PURE__ */ e.jsxs(fs, { children: [
-                /* @__PURE__ */ e.jsx(Gs, { children: /* @__PURE__ */ e.jsx(
-                  Zt,
+              /* @__PURE__ */ e.jsx(gs, { children: "Customize Card" }),
+              /* @__PURE__ */ e.jsxs(bs, { children: [
+                /* @__PURE__ */ e.jsx(Ps, { children: /* @__PURE__ */ e.jsx(
+                  en,
                   {
                     onClick: () => {
-                      navigator.clipboard.writeText(d.id);
+                      navigator.clipboard.writeText(m.id);
                     },
                     className: "size-3 cursor-pointer text-muted-foreground/70 transition-colors hover:text-muted-foreground"
                   }
                 ) }),
-                /* @__PURE__ */ e.jsx(gs, { side: "right", align: "center", children: /* @__PURE__ */ e.jsx("p", { className: "text-xs", children: "Copy Card ID" }) })
+                /* @__PURE__ */ e.jsx(ys, { side: "right", align: "center", children: /* @__PURE__ */ e.jsx("p", { className: "text-xs", children: "Copy Card ID" }) })
               ] })
             ] }),
-            /* @__PURE__ */ e.jsxs(ps, { children: [
+            /* @__PURE__ */ e.jsxs(js, { children: [
               "See the configuration options and documentation",
               /* @__PURE__ */ e.jsx(
                 "a",
@@ -2421,21 +2432,22 @@ function Vn() {
           ] }),
           /* @__PURE__ */ e.jsxs("div", { className: "flex grow gap-2", children: [
             /* @__PURE__ */ e.jsx(ga, { className: "w-1/2 rounded shadow-none" }),
-            /* @__PURE__ */ e.jsxs(Ct, { defaultValue: "custom-config", className: "flex w-1/2 flex-col", children: [
-              /* @__PURE__ */ e.jsxs(St, { className: "justify-start rounded-sm rounded-b-none border border-b-0", children: [
-                /* @__PURE__ */ e.jsxs(Ds, { value: "custom-config", children: [
-                  f && /* @__PURE__ */ e.jsx(kt, { className: "mr-1 h-5 w-5 text-green-600" }),
-                  f ? "Custom Config" : "Default Config"
+            /* @__PURE__ */ e.jsxs(St, { defaultValue: "custom-config", className: "flex w-1/2 flex-col", children: [
+              /* @__PURE__ */ e.jsxs(kt, { className: "justify-start rounded-sm rounded-b-none border border-b-0", children: [
+                /* @__PURE__ */ e.jsxs(rs, { value: "custom-config", children: [
+                  u && /* @__PURE__ */ e.jsx(wt, { className: "mr-1 h-5 w-5 text-green-600" }),
+                  u ? "Custom Config" : "Default Config"
                 ] }),
-                /* @__PURE__ */ e.jsx(Ds, { className: "", value: "output", children: "Output" })
+                /* @__PURE__ */ e.jsx(rs, { className: "", value: "output", children: "Output" }),
+                /* @__PURE__ */ e.jsx(rs, { className: "", value: "custom-code", children: "Custom Code" })
               ] }),
               /* @__PURE__ */ e.jsx(
-                Is,
+                is,
                 {
                   className: "bg-red-x mt-0 grow rounded-b border border-t-0 p-2",
                   value: "output",
                   children: /* @__PURE__ */ e.jsx(
-                    na,
+                    aa,
                     {
                       disabled: !0,
                       value: a,
@@ -2445,12 +2457,12 @@ function Vn() {
                 }
               ),
               /* @__PURE__ */ e.jsx(
-                Is,
+                is,
                 {
                   className: "mt-0 grow rounded-b border border-t-0",
                   value: "custom-config",
                   children: /* @__PURE__ */ e.jsx(
-                    Qe,
+                    Ve,
                     {
                       className: "h-full w-full overflow-hidden",
                       theme: "default",
@@ -2467,27 +2479,56 @@ function Vn() {
                         renderLineHighlight: "none"
                       },
                       defaultLanguage: "json",
-                      value: g(),
-                      onChange: (j) => o(j)
+                      value: E(),
+                      onChange: (C) => o(C)
+                    }
+                  )
+                }
+              ),
+              /* @__PURE__ */ e.jsx(
+                is,
+                {
+                  className: "mt-0 grow rounded-b border border-t-0",
+                  value: "custom-code",
+                  children: /* @__PURE__ */ e.jsx(
+                    Ve,
+                    {
+                      className: "h-full w-full overflow-hidden",
+                      theme: "default",
+                      options: {
+                        minimap: {
+                          enabled: !1
+                        },
+                        wordWrap: "on",
+                        scrollbar: {
+                          verticalScrollbarSize: 0,
+                          horizontalScrollbarSize: 0
+                        },
+                        fontSize: 14,
+                        renderLineHighlight: "none"
+                      },
+                      defaultLanguage: "javascript",
+                      value: l,
+                      onChange: (C) => c(C || "")
                     }
                   )
                 }
               )
             ] })
           ] }),
-          /* @__PURE__ */ e.jsxs(Js, { className: "flex items-center", children: [
-            /* @__PURE__ */ e.jsx(B, { className: "mr-2 text-red-500", children: l }),
+          /* @__PURE__ */ e.jsxs(Ks, { className: "flex items-center", children: [
+            /* @__PURE__ */ e.jsx(R, { className: "mr-2 text-red-500", children: h }),
             /* @__PURE__ */ e.jsx(
-              w,
+              z,
               {
-                disabled: !f,
-                onClick: x,
+                disabled: !u,
+                onClick: b,
                 variant: "outline",
                 children: "Reset"
               }
             ),
-            /* @__PURE__ */ e.jsx(w, { onClick: h, variant: "outline", children: "Apply" }),
-            /* @__PURE__ */ e.jsx(w, { onClick: () => n(!1), variant: "outline", children: "Close" })
+            /* @__PURE__ */ e.jsx(z, { onClick: w, variant: "outline", children: "Apply" }),
+            /* @__PURE__ */ e.jsx(z, { onClick: () => n(!1), variant: "outline", children: "Close" })
           ] })
         ]
       }
@@ -2515,8 +2556,8 @@ function Ca(s) {
 function Sa(s) {
   return fe({ tag: "svg", attr: { viewBox: "0 0 512 512" }, child: [{ tag: "path", attr: { d: "M217 25v14h78V25h-78zm0 32v46h14V71h50v32h14V57h-78zm32 32v14h14V89h-14zm-64 32v46h30v-46h-30zm48 0v14h46v-14h-46zm64 0v46h30v-46h-30zm-64 32v14h46v-14h-46zm-80 32v46h62v-46h-62zm80 0v14h46v-14h-46zm64 0v46h62v-46h-62zm-64 32v14h46v-14h-46zm-112 32v46h94v-46h-94zm112 0v14h46v-14h-46zm64 0v46h94v-46h-94zm-64 32v14h46v-14h-46zM89 313v46h126v-46H89zm144 0v14h46v-14h-46zm64 0v46h126v-46H297zm-64 32v14h46v-14h-46zM57 377v46h158v-46H57zm176 0v14h46v-14h-46zm64 0v46h158v-46H297zm-64 32v14h46v-14h-46zM25 441v46h190v-46H25zm208 0v14h46v-14h-46zm64 0v46h190v-46H297zm-64 32v14h46v-14h-46z" }, child: [] }] })(s);
 }
-function Rn() {
-  const [s, n] = M(!1), a = r((c) => c.card.type), { setCardType: t, setCardPreferences: i } = r(
+function _n() {
+  const [s, n] = T(!1), a = r((c) => c.card.type), { setCardType: t, setCardPreferences: i } = r(
     (c) => c.actions
   ), o = r(
     (c) => c.actions.setCardCustomCfg
@@ -2525,27 +2566,27 @@ function Rn() {
     t(c), o(null), i({}), n(!1);
   }
   return /* @__PURE__ */ e.jsxs(Ke, { open: s, onOpenChange: n, children: [
-    /* @__PURE__ */ e.jsx(Ue, { asChild: !0, children: /* @__PURE__ */ e.jsx(w, { size: "sm", variant: "outline", children: /* @__PURE__ */ e.jsx(_n, { className: "h-4 w-4", chartType: a }) }) }),
-    /* @__PURE__ */ e.jsx(Je, { className: "w-50", children: /* @__PURE__ */ e.jsxs("div", { className: "grid grid-cols-3 place-items-center", children: [
+    /* @__PURE__ */ e.jsx(Ue, { asChild: !0, children: /* @__PURE__ */ e.jsx(z, { size: "sm", variant: "outline", children: /* @__PURE__ */ e.jsx(Hn, { className: "h-4 w-4", chartType: a }) }) }),
+    /* @__PURE__ */ e.jsx(Pe, { className: "w-50", children: /* @__PURE__ */ e.jsxs("div", { className: "grid grid-cols-3 place-items-center", children: [
       /* @__PURE__ */ e.jsx(
-        w,
+        z,
         {
           onClick: () => l("bar"),
           className: "font-normal",
           variant: "ghost",
-          children: /* @__PURE__ */ e.jsx(Ns, { className: "size-5" })
+          children: /* @__PURE__ */ e.jsx(Ss, { className: "size-5" })
         }
       ),
       /* @__PURE__ */ e.jsx(
-        w,
+        z,
         {
           onClick: () => l("line"),
           variant: "ghost",
-          children: /* @__PURE__ */ e.jsx(Cs, { className: "size-5" })
+          children: /* @__PURE__ */ e.jsx(ks, { className: "size-5" })
         }
       ),
       /* @__PURE__ */ e.jsx(
-        w,
+        z,
         {
           onClick: () => l("stackedBar"),
           variant: "ghost",
@@ -2553,7 +2594,7 @@ function Rn() {
         }
       ),
       /* @__PURE__ */ e.jsx(
-        w,
+        z,
         {
           onClick: () => l("scatter"),
           variant: "ghost",
@@ -2561,7 +2602,7 @@ function Rn() {
         }
       ),
       /* @__PURE__ */ e.jsx(
-        w,
+        z,
         {
           onClick: () => l("bubble"),
           variant: "ghost",
@@ -2569,7 +2610,7 @@ function Rn() {
         }
       ),
       /* @__PURE__ */ e.jsx(
-        w,
+        z,
         {
           onClick: () => l("pie"),
           variant: "ghost",
@@ -2577,7 +2618,7 @@ function Rn() {
         }
       ),
       /* @__PURE__ */ e.jsx(
-        w,
+        z,
         {
           onClick: () => l("doughnut"),
           variant: "ghost",
@@ -2585,7 +2626,7 @@ function Rn() {
         }
       ),
       /* @__PURE__ */ e.jsx(
-        w,
+        z,
         {
           onClick: () => l("radar"),
           variant: "ghost",
@@ -2599,7 +2640,7 @@ function Rn() {
         }
       ),
       /* @__PURE__ */ e.jsx(
-        w,
+        z,
         {
           onClick: () => l("polarArea"),
           variant: "ghost",
@@ -2607,7 +2648,7 @@ function Rn() {
         }
       ),
       /* @__PURE__ */ e.jsx(
-        w,
+        z,
         {
           onClick: () => l("pyramid"),
           variant: "ghost",
@@ -2615,15 +2656,23 @@ function Rn() {
         }
       ),
       /* @__PURE__ */ e.jsx(
-        w,
+        z,
+        {
+          onClick: () => l("range"),
+          variant: "ghost",
+          children: /* @__PURE__ */ e.jsx(oa, { className: "size-5" })
+        }
+      ),
+      /* @__PURE__ */ e.jsx(
+        z,
         {
           onClick: () => l("table"),
           variant: "ghost",
-          children: /* @__PURE__ */ e.jsx(js, { className: "size-5" })
+          children: /* @__PURE__ */ e.jsx(vs, { className: "size-5" })
         }
       ),
       /* @__PURE__ */ e.jsx(
-        w,
+        z,
         {
           onClick: () => l("kpi"),
           variant: "ghost",
@@ -2633,12 +2682,12 @@ function Rn() {
     ] }) })
   ] });
 }
-function _n({ chartType: s, className: n }) {
+function Hn({ chartType: s, className: n }) {
   switch (s) {
     case "bar":
-      return /* @__PURE__ */ e.jsx(Ns, { className: n });
+      return /* @__PURE__ */ e.jsx(Ss, { className: n });
     case "line":
-      return /* @__PURE__ */ e.jsx(Cs, { className: n });
+      return /* @__PURE__ */ e.jsx(ks, { className: n });
     case "pie":
       return /* @__PURE__ */ e.jsx(da, { className: n });
     case "radar":
@@ -2655,22 +2704,24 @@ function _n({ chartType: s, className: n }) {
       return /* @__PURE__ */ e.jsx(ya, { className: n });
     case "pyramid":
       return /* @__PURE__ */ e.jsx(Sa, { className: n });
+    case "range":
+      return /* @__PURE__ */ e.jsx(oa, { className: n });
     case "kpi":
       return /* @__PURE__ */ e.jsx(Ca, { className: n });
     default:
-      return /* @__PURE__ */ e.jsx(js, { className: n });
+      return /* @__PURE__ */ e.jsx(vs, { className: n });
   }
 }
-function Hn() {
+function Bn() {
   const s = r(
     (a) => a.card.refreshInterval
   ), n = r(
     (a) => a.actions.setCardRefreshInterval
   );
   return /* @__PURE__ */ e.jsxs(Ke, { children: [
-    /* @__PURE__ */ e.jsx(Ue, { asChild: !0, children: /* @__PURE__ */ e.jsx(w, { size: "sm", variant: "outline", children: /* @__PURE__ */ e.jsx(Ut, { className: "w-4 h-4" }) }) }),
-    /* @__PURE__ */ e.jsx(Je, { className: "w-[200px]", children: /* @__PURE__ */ e.jsx("div", { className: "grid gap-4", children: /* @__PURE__ */ e.jsx("div", { className: "grid gap-2", children: /* @__PURE__ */ e.jsxs("div", { className: "grid grid-cols-5 items-center gap-1", children: [
-      /* @__PURE__ */ e.jsx(B, { className: "col-span-3", htmlFor: "width", children: "Refresh Every" }),
+    /* @__PURE__ */ e.jsx(Ue, { asChild: !0, children: /* @__PURE__ */ e.jsx(z, { size: "sm", variant: "outline", children: /* @__PURE__ */ e.jsx(Pt, { className: "w-4 h-4" }) }) }),
+    /* @__PURE__ */ e.jsx(Pe, { className: "w-[200px]", children: /* @__PURE__ */ e.jsx("div", { className: "grid gap-4", children: /* @__PURE__ */ e.jsx("div", { className: "grid gap-2", children: /* @__PURE__ */ e.jsxs("div", { className: "grid grid-cols-5 items-center gap-1", children: [
+      /* @__PURE__ */ e.jsx(R, { className: "col-span-3", htmlFor: "width", children: "Refresh Every" }),
       /* @__PURE__ */ e.jsx(
         ae,
         {
@@ -2684,27 +2735,27 @@ function Hn() {
     ] }) }) }) })
   ] });
 }
-function Bs() {
+function Hs() {
   r((l) => l.frame);
   const s = r((l) => l.card), n = r((l) => l.card.data), a = r((l) => l.isShowingVisual), t = r((l) => l.isSqlRunning), i = r((l) => l.queryError), o = r((l) => l.pythonStdOut);
   return r((l) => l.onSave), r((l) => l.onClose), r((l) => l.actions.setCardSql), r((l) => l.actions.setCardType), r((l) => l.actions.setSqlGen), s ? /* @__PURE__ */ e.jsxs("div", { className: "relative flex h-full flex-col pt-3", children: [
     t && /* @__PURE__ */ e.jsx(He, { className: "absolute bottom-0 left-0 right-0 top-0 z-10 m-auto h-10 w-10 animate-spin text-foreground/10" }),
     /* @__PURE__ */ e.jsxs("div", { className: "mb-0 flex min-h-10 items-center justify-end gap-2 px-6", children: [
       a && /* @__PURE__ */ e.jsxs("div", { className: "flex grow items-center gap-2", children: [
-        /* @__PURE__ */ e.jsx(Rn, {}),
-        s.type !== "table" && /* @__PURE__ */ e.jsx(Vn, {}),
-        /* @__PURE__ */ e.jsx(Hn, {})
+        /* @__PURE__ */ e.jsx(_n, {}),
+        s.type !== "table" && /* @__PURE__ */ e.jsx(Rn, {}),
+        /* @__PURE__ */ e.jsx(Bn, {})
       ] }),
-      /* @__PURE__ */ e.jsx($n, {})
+      /* @__PURE__ */ e.jsx(Kn, {})
     ] }),
-    a ? s.type === "kpi" ? /* @__PURE__ */ e.jsx("div", { className: "flex grow items-center justify-center", children: /* @__PURE__ */ e.jsx("div", { className: "w-1/2 rounded-md border", children: /* @__PURE__ */ e.jsx(wt, { isLoading: t, card: s }) }) }) : /* @__PURE__ */ e.jsx(ga, { className: "grow border-none shadow-none" }) : /* @__PURE__ */ e.jsxs("div", { className: "flex min-h-0 w-full flex-1 grow basis-0 px-6", children: [
-      o && /* @__PURE__ */ e.jsx(Bn, {}),
-      s.data && s.data.length > 0 && /* @__PURE__ */ e.jsx(qn, { data: n || [] }),
+    a ? s.type === "kpi" ? /* @__PURE__ */ e.jsx("div", { className: "flex grow items-center justify-center", children: /* @__PURE__ */ e.jsx("div", { className: "w-1/2 rounded-md border", children: /* @__PURE__ */ e.jsx(zt, { isLoading: t, card: s }) }) }) : /* @__PURE__ */ e.jsx(ga, { className: "grow border-none shadow-none" }) : /* @__PURE__ */ e.jsxs("div", { className: "flex min-h-0 w-full flex-1 grow basis-0 px-6", children: [
+      o && /* @__PURE__ */ e.jsx($n, {}),
+      s.data && s.data.length > 0 && /* @__PURE__ */ e.jsx(Vn, { data: n || [] }),
       i && /* @__PURE__ */ e.jsx("span", { className: "font-mono text-sm", children: i })
     ] })
   ] }) : /* @__PURE__ */ e.jsx(e.Fragment, { children: "No Active Card" });
 }
-function Bn() {
+function $n() {
   const s = r((a) => a.pythonStdOut);
   if (!s)
     return null;
@@ -2718,17 +2769,17 @@ function Bn() {
         className: "bg-muted p-2 font-mono text-sm"
       }
     ),
-    /* @__PURE__ */ e.jsx(ys, { className: "mb-2" })
+    /* @__PURE__ */ e.jsx(Cs, { className: "mb-2" })
   ] });
 }
-function $n() {
+function Kn() {
   const s = r((a) => a.isShowingVisual), n = r(
     (a) => a.actions.setIsShowingVisual
   );
   return /* @__PURE__ */ e.jsxs("div", { className: "flex items-center space-x-2", children: [
-    /* @__PURE__ */ e.jsx(B, { htmlFor: "visualize", children: "Chart" }),
+    /* @__PURE__ */ e.jsx(R, { htmlFor: "visualize", children: "Chart" }),
     /* @__PURE__ */ e.jsx(
-      zt,
+      Ft,
       {
         checked: s,
         onCheckedChange: () => n(!s),
@@ -2738,212 +2789,48 @@ function $n() {
     )
   ] });
 }
-function De() {
-  const [s, n] = M([]);
-  r(
-    (m) => m.card.cfg
-  );
-  const a = r((m) => m.card.preferences), { setCardCfg: t, setFilterOnClickColumnIndex: i, setCardPreferences: o } = r((m) => m.actions), l = r(
-    (m) => m.queryResultColumns
-  );
-  r(
-    (m) => {
-      var u;
-      return (u = m.card.preferences) == null ? void 0 : u.filterOnClickColumnIndex;
-    }
-  ), K(() => {
-    l && n(new Array(l.length).fill(!1));
-  }, [l]);
-  function c(m, u) {
-    var C, h;
-    u ? a != null && a.onClickFilter && ((C = a == null ? void 0 : a.onClickFilter) == null ? void 0 : C.length) > 0 ? o({
-      ...a,
-      onClickFilter: [
-        ...a.onClickFilter,
-        {
-          columnIndex: m,
-          expression: ""
-        }
-      ]
-    }) : o({
-      ...a,
-      onClickFilter: [
-        {
-          columnIndex: m,
-          expression: ""
-        }
-      ]
-    }) : (o({
-      ...a,
-      onClickFilter: (h = a == null ? void 0 : a.onClickFilter) == null ? void 0 : h.filter(
-        (x) => x.columnIndex !== m
-      )
-    }), n((x) => {
-      const g = [...x];
-      return g[m] = !1, g;
-    }));
-  }
-  function d(m, u) {
-    var h;
-    const C = (h = a == null ? void 0 : a.onClickFilter) == null ? void 0 : h.map((x) => x.columnIndex === m ? {
-      ...x,
-      expression: u.target.value
-    } : x);
-    o({
-      ...a,
-      onClickFilter: C
-    });
-  }
-  function f(m) {
-    var u, C, h, x;
-    if (s != null && s[m] || (C = (u = a == null ? void 0 : a.onClickFilter) == null ? void 0 : u.find((g) => g.columnIndex === m)) != null && C.expression)
-      return /* @__PURE__ */ e.jsx(
-        ae,
-        {
-          value: (x = (h = a == null ? void 0 : a.onClickFilter) == null ? void 0 : h.find((g) => g.columnIndex === m)) == null ? void 0 : x.expression,
-          onChange: (g) => d(m, g),
-          type: "text",
-          className: " h-9 w-full focus-visible:ring-0 focus-visible:ring-ring focus-visible:ring-offset-0 font-mono text-xs",
-          placeholder: "Expression"
-        }
-      );
-  }
-  return /* @__PURE__ */ e.jsx(e.Fragment, { children: l == null ? void 0 : l.map((m, u) => {
-    var C, h;
-    return /* @__PURE__ */ e.jsx(
-      "div",
-      {
-        className: "flex items-center justify-between space-y-2 xbg-red-100 group",
-        children: /* @__PURE__ */ e.jsxs("div", { className: " grow", children: [
-          /* @__PURE__ */ e.jsxs("div", { className: "flex items-center py-2 space-x-2", children: [
-            /* @__PURE__ */ e.jsx(
-              $e,
-              {
-                checked: !!((C = a == null ? void 0 : a.onClickFilter) != null && C.find(
-                  (x) => x.columnIndex === u
-                )),
-                onCheckedChange: (x) => c(u, x)
-              }
-            ),
-            /* @__PURE__ */ e.jsx(
-              "label",
-              {
-                className: "text-sm font-medium leading-none peer-disabled:cursor-not-allowed peer-disabled:opacity-70",
-                children: m
-              }
-            ),
-            /* @__PURE__ */ e.jsx("div", { className: "flex gap-2 items-center ", children: ((h = a == null ? void 0 : a.onClickFilter) == null ? void 0 : h.find(
-              (x) => x.columnIndex === u
-            )) && /* @__PURE__ */ e.jsx(
-              ca,
-              {
-                onClick: () => {
-                  n((x) => {
-                    const g = [...x];
-                    return g[u] = !x[u], g;
-                  });
-                },
-                className: " invisible group-hover:visible size-3 text-gray-400 cursor-pointer"
-              }
-            ) })
-          ] }),
-          f(u)
-        ] })
-      },
-      m
-    );
-  }) });
-}
-function Ss() {
-  var o, l;
-  const s = r((c) => c.card.preferences), n = r(
-    (c) => c.card.cfg
-  ), { setCardCfg: a, setCardPreferences: t } = r(
-    (c) => c.actions
-  );
-  (o = n == null ? void 0 : n.options) != null && o.indexAxis;
-  function i(c) {
-    var m, u, C, h, x, g;
-    let d = {};
-    (m = s == null ? void 0 : s.chartOptions) != null && m.scales && (d = {
-      x: (C = (u = s == null ? void 0 : s.chartOptions) == null ? void 0 : u.scales) == null ? void 0 : C.y,
-      y: (x = (h = s == null ? void 0 : s.chartOptions) == null ? void 0 : h.scales) == null ? void 0 : x.x
-    });
-    const f = {
-      ...s,
-      chartOptions: {
-        ...s == null ? void 0 : s.chartOptions,
-        scales: {
-          ...(g = s == null ? void 0 : s.chartOptions) == null ? void 0 : g.scales,
-          ...d
-        },
-        indexAxis: c
-      }
-    };
-    t(f);
-  }
-  return /* @__PURE__ */ e.jsxs(
-    ra,
-    {
-      value: ((l = s == null ? void 0 : s.chartOptions) == null ? void 0 : l.indexAxis) || "x",
-      onValueChange: i,
-      className: "flex gap-3",
-      defaultValue: "x",
-      children: [
-        /* @__PURE__ */ e.jsxs("div", { className: "flex items-center space-x-2", children: [
-          /* @__PURE__ */ e.jsx(Ye, { value: "x", id: "r1" }),
-          /* @__PURE__ */ e.jsx("label", { className: "text-sm", htmlFor: "r1", children: "Vertical" })
-        ] }),
-        /* @__PURE__ */ e.jsxs("div", { className: "flex items-center space-x-2", children: [
-          /* @__PURE__ */ e.jsx(Ye, { value: "y", id: "r2" }),
-          /* @__PURE__ */ e.jsx("label", { className: "text-sm", htmlFor: "r2", children: "Horizontal" })
-        ] })
-      ]
-    }
-  );
-}
-const we = "focus-visible:ring-0 focus-visible:ring-ring focus-visible:ring-offset-0";
-function $s(s, n) {
+const ke = "focus-visible:ring-0 focus-visible:ring-ring focus-visible:ring-offset-0";
+function Bs(s, n) {
   var t, i, o;
-  const a = ia(s, n);
+  const a = na(s, n);
   return ((o = (i = (t = s == null ? void 0 : s.chartOptions) == null ? void 0 : t.scales) == null ? void 0 : i[a]) == null ? void 0 : o.type) || "linear";
 }
 function ka() {
-  var G, ee, Z, J, I, v;
-  const [s, n] = M(!1), a = r((N) => {
-    var F;
-    return (F = N.card) == null ? void 0 : F.preferences;
-  }), t = r((N) => {
-    var F;
-    return (F = N.card) == null ? void 0 : F.cfg;
-  }), i = ia(a, t), [o, l] = M(
-    $s(a)
-  ), [c, d] = M(
-    ((Z = (ee = (G = a == null ? void 0 : a.chartOptions) == null ? void 0 : G.scales) == null ? void 0 : ee[i]) == null ? void 0 : Z.min) || ""
-  ), [f, m] = M(
-    ((v = (I = (J = a == null ? void 0 : a.chartOptions) == null ? void 0 : J.scales) == null ? void 0 : I[i]) == null ? void 0 : v.max) || ""
-  ), [u, C] = M(c || f ? "custom" : "auto"), [h, x] = M(""), [g, j] = M(0), [b, L] = M(""), [A, O] = M(""), [y, z] = M(""), E = r(
-    (N) => N.actions.setCardPreferences
-  ), _ = r((N) => {
-    var F;
-    return (F = N.card) == null ? void 0 : F.type;
-  }), Y = ["pie", "doughnut", "polarArea"].includes(_);
+  var J, ee, Z, P, I, y;
+  const [s, n] = T(!1), a = r((v) => {
+    var M;
+    return (M = v.card) == null ? void 0 : M.preferences;
+  }), t = r((v) => {
+    var M;
+    return (M = v.card) == null ? void 0 : M.cfg;
+  }), i = na(a, t), [o, l] = T(
+    Bs(a)
+  ), [c, h] = T(
+    ((Z = (ee = (J = a == null ? void 0 : a.chartOptions) == null ? void 0 : J.scales) == null ? void 0 : ee[i]) == null ? void 0 : Z.min) || ""
+  ), [g, m] = T(
+    ((y = (I = (P = a == null ? void 0 : a.chartOptions) == null ? void 0 : P.scales) == null ? void 0 : I[i]) == null ? void 0 : y.max) || ""
+  ), [u, N] = T(c || g ? "custom" : "auto"), [d, x] = T(""), [f, w] = T(0), [b, E] = T(""), [C, O] = T(""), [j, F] = T(""), A = r(
+    (v) => v.actions.setCardPreferences
+  ), q = r((v) => {
+    var M;
+    return (M = v.card) == null ? void 0 : M.type;
+  }), Y = ["pie", "doughnut", "polarArea"].includes(q);
   K(() => {
-    var N, F, H, ue, se, ge, je, be, xe, P, ne, le, ye, re;
-    l($s(a)), d(
-      ((H = (F = (N = a == null ? void 0 : a.chartOptions) == null ? void 0 : N.scales) == null ? void 0 : F[i]) == null ? void 0 : H.min) === 0 ? 0 : ""
+    var v, M, V, ue, se, ge, je, be, xe, G, ne, le, ye, re;
+    l(Bs(a)), h(
+      ((V = (M = (v = a == null ? void 0 : a.chartOptions) == null ? void 0 : v.scales) == null ? void 0 : M[i]) == null ? void 0 : V.min) === 0 ? 0 : ""
     ), m(((ge = (se = (ue = a == null ? void 0 : a.chartOptions) == null ? void 0 : ue.scales) == null ? void 0 : se[i]) == null ? void 0 : ge.max) || ""), x(
-      ((P = (xe = (be = (je = a == null ? void 0 : a.chartOptions) == null ? void 0 : je.scales) == null ? void 0 : be[i]) == null ? void 0 : xe.ticks) == null ? void 0 : P.stepSize) || ""
-    ), j(((ne = a == null ? void 0 : a.numberAxisFormat) == null ? void 0 : ne.decimalPlaces) || 0), L(((le = a == null ? void 0 : a.numberAxisFormat) == null ? void 0 : le.suffix) || ""), O(((ye = a == null ? void 0 : a.numberAxisFormat) == null ? void 0 : ye.currency) || ""), z(((re = a == null ? void 0 : a.numberAxisFormat) == null ? void 0 : re.locale) || "");
+      ((G = (xe = (be = (je = a == null ? void 0 : a.chartOptions) == null ? void 0 : je.scales) == null ? void 0 : be[i]) == null ? void 0 : xe.ticks) == null ? void 0 : G.stepSize) || ""
+    ), w(((ne = a == null ? void 0 : a.numberAxisFormat) == null ? void 0 : ne.decimalPlaces) || 0), E(((le = a == null ? void 0 : a.numberAxisFormat) == null ? void 0 : le.suffix) || ""), O(((ye = a == null ? void 0 : a.numberAxisFormat) == null ? void 0 : ye.currency) || ""), F(((re = a == null ? void 0 : a.numberAxisFormat) == null ? void 0 : re.locale) || "");
   }, [s, a, i]);
-  function $(N, F) {
-    return F === "" || /^[0-9\b]+$/.test(F) ? Number(F) : Number(N);
+  function $(v, M) {
+    return M === "" || /^[0-9\b]+$/.test(M) ? Number(M) : Number(v);
   }
   function U() {
     return /* @__PURE__ */ e.jsxs(e.Fragment, { children: [
       /* @__PURE__ */ e.jsxs("div", { className: "grid grid-cols-6 items-center gap-2", children: [
         /* @__PURE__ */ e.jsx(
-          B,
+          R,
           {
             className: "col-span-2 hover:cursor-pointer hover:underline",
             htmlFor: "currency",
@@ -2960,33 +2847,33 @@ function ka() {
         /* @__PURE__ */ e.jsx(
           ae,
           {
-            value: A,
+            value: C,
             placeholder: "USD",
-            onChange: (N) => O(N.target.value),
+            onChange: (v) => O(v.target.value),
             id: "currency",
-            className: `col-span-2 h-8 w-full ${we}`
+            className: `col-span-2 h-8 w-full ${ke}`
           }
         ),
         /* @__PURE__ */ e.jsx(
           ae,
           {
-            value: y,
+            value: j,
             placeholder: "en-US",
-            onChange: (N) => z(N.target.value),
+            onChange: (v) => F(v.target.value),
             id: "locale",
-            className: `col-span-2 h-8 w-full ${we}`
+            className: `col-span-2 h-8 w-full ${ke}`
           }
         )
       ] }),
       /* @__PURE__ */ e.jsxs("div", { className: "grid grid-cols-9 items-center gap-2", children: [
-        /* @__PURE__ */ e.jsx(B, { className: "col-span-3", htmlFor: "format", children: "Decimals" }),
+        /* @__PURE__ */ e.jsx(R, { className: "col-span-3", htmlFor: "format", children: "Decimals" }),
         /* @__PURE__ */ e.jsx(
           ae,
           {
-            value: g,
-            onChange: (N) => j(Number(N.target.value)),
+            value: f,
+            onChange: (v) => w(Number(v.target.value)),
             id: "format",
-            className: `col-span-6 h-8 w-full tracking-wide ${we}`
+            className: `col-span-6 h-8 w-full tracking-wide ${ke}`
           }
         )
       ] })
@@ -2995,91 +2882,91 @@ function ka() {
   function D() {
     return /* @__PURE__ */ e.jsxs(e.Fragment, { children: [
       /* @__PURE__ */ e.jsxs("div", { className: "grid grid-cols-3 items-center gap-2", children: [
-        /* @__PURE__ */ e.jsx(B, { htmlFor: "range", children: "Range" }),
+        /* @__PURE__ */ e.jsx(R, { htmlFor: "range", children: "Range" }),
         /* @__PURE__ */ e.jsx(
           ae,
           {
             id: "min",
             value: c,
-            onChange: (N) => d((F) => $(F, N.target.value)),
-            className: `col-span-1 h-8 w-full ${we}`
+            onChange: (v) => h((M) => $(M, v.target.value)),
+            className: `col-span-1 h-8 w-full ${ke}`
           }
         ),
         /* @__PURE__ */ e.jsx(
           ae,
           {
-            value: f,
-            onChange: (N) => m((F) => $(F, N.target.value)),
+            value: g,
+            onChange: (v) => m((M) => $(M, v.target.value)),
             id: "max",
-            className: `col-span-1 h-8 w-full ${we}`
+            className: `col-span-1 h-8 w-full ${ke}`
           }
         )
       ] }),
       /* @__PURE__ */ e.jsxs("div", { className: "grid grid-cols-3 items-center gap-2", children: [
-        /* @__PURE__ */ e.jsx(B, { htmlFor: "step-size", children: "Step Size" }),
+        /* @__PURE__ */ e.jsx(R, { htmlFor: "step-size", children: "Step Size" }),
         /* @__PURE__ */ e.jsx(
           ae,
           {
-            value: h,
-            onChange: (N) => x((F) => $(F, N.target.value)),
+            value: d,
+            onChange: (v) => x((M) => $(M, v.target.value)),
             id: "step-size",
-            className: `col-span-1 h-8 w-full ${we}`
+            className: `col-span-1 h-8 w-full ${ke}`
           }
         )
       ] })
     ] });
   }
   function te() {
-    var H;
-    let N = {};
-    u === "custom" && (N = {
+    var V;
+    let v = {};
+    u === "custom" && (v = {
       min: c,
-      max: f,
+      max: g,
       ticks: {
-        stepSize: h
+        stepSize: d
       }
     });
-    const F = {
+    const M = {
       ...a || {},
       chartOptions: {
         ...a == null ? void 0 : a.chartOptions,
         scales: {
-          ...(H = a == null ? void 0 : a.chartOptions) == null ? void 0 : H.scales,
+          ...(V = a == null ? void 0 : a.chartOptions) == null ? void 0 : V.scales,
           [i]: {
             // ...cardPreferences?.chartOptions?.scales?.[axis],
             type: o,
-            ...o === "linear" ? N : {}
+            ...o === "linear" ? v : {}
           }
         }
       },
       numberAxisFormat: {
-        decimalPlaces: g,
+        decimalPlaces: f,
         suffix: b,
-        currency: A,
-        locale: y
+        currency: C,
+        locale: j
       }
     };
-    E(F);
+    A(M);
   }
-  return /* @__PURE__ */ e.jsxs(Ke, { onOpenChange: (N) => n(N), children: [
-    /* @__PURE__ */ e.jsx(Ue, { asChild: !0, children: /* @__PURE__ */ e.jsx(Ft, { className: "size-4 cursor-pointer text-muted-foreground hover:text-foreground" }) }),
-    /* @__PURE__ */ e.jsx(Je, { align: "center", className: "max-w-65", children: /* @__PURE__ */ e.jsxs("div", { className: "grid gap-4", children: [
+  return /* @__PURE__ */ e.jsxs(Ke, { onOpenChange: (v) => n(v), children: [
+    /* @__PURE__ */ e.jsx(Ue, { asChild: !0, children: /* @__PURE__ */ e.jsx(Ot, { className: "size-4 cursor-pointer text-muted-foreground hover:text-foreground" }) }),
+    /* @__PURE__ */ e.jsx(Pe, { align: "center", className: "max-w-65", children: /* @__PURE__ */ e.jsxs("div", { className: "grid gap-4", children: [
       /* @__PURE__ */ e.jsxs("div", { className: "space-y-2", children: [
         /* @__PURE__ */ e.jsx("h4", { className: "font-medium leading-none", children: "Scale Options" }),
         /* @__PURE__ */ e.jsx("p", { className: "text-sm text-muted-foreground", children: "Set the scale for the number axis" })
       ] }),
       /* @__PURE__ */ e.jsxs("div", { className: "grid gap-2", children: [
         /* @__PURE__ */ e.jsxs("div", { className: "grid grid-cols-3 items-center gap-2", children: [
-          /* @__PURE__ */ e.jsx(B, { htmlFor: "scale", children: "Type" }),
+          /* @__PURE__ */ e.jsx(R, { htmlFor: "scale", children: "Type" }),
           /* @__PURE__ */ e.jsxs(
-            Oe,
+            Fe,
             {
               disabled: Y,
               value: o,
-              onValueChange: (N) => l(N),
+              onValueChange: (v) => l(v),
               children: [
-                /* @__PURE__ */ e.jsx(Me, { className: "col-span-2 h-8 w-full focus:ring-1 focus:ring-offset-0", children: /* @__PURE__ */ e.jsx(Te, {}) }),
-                /* @__PURE__ */ e.jsx(Ae, { id: "type", children: /* @__PURE__ */ e.jsxs(_e, { children: [
+                /* @__PURE__ */ e.jsx(Oe, { className: "col-span-2 h-8 w-full focus:ring-1 focus:ring-offset-0", children: /* @__PURE__ */ e.jsx(Me, {}) }),
+                /* @__PURE__ */ e.jsx(Te, { id: "type", children: /* @__PURE__ */ e.jsxs(_e, { children: [
                   /* @__PURE__ */ e.jsx(Le, { children: "Option" }),
                   /* @__PURE__ */ e.jsx(X, { value: "linear", children: "Linear" }),
                   /* @__PURE__ */ e.jsx(X, { value: "logarithmic", children: "Logarithmic" })
@@ -3089,14 +2976,14 @@ function ka() {
           )
         ] }),
         o == "linear" && /* @__PURE__ */ e.jsxs("div", { className: "grid grid-cols-3 items-center gap-2 py-1", children: [
-          /* @__PURE__ */ e.jsx(B, { htmlFor: "scale-option", children: "Setup" }),
+          /* @__PURE__ */ e.jsx(R, { htmlFor: "scale-option", children: "Setup" }),
           /* @__PURE__ */ e.jsxs(
-            ra,
+            la,
             {
               disabled: Y,
               id: "scale-option",
               value: u,
-              onValueChange: (N) => C(N),
+              onValueChange: (v) => N(v),
               className: "col-span-2 flex gap-3",
               defaultValue: "x",
               children: [
@@ -3114,9 +3001,9 @@ function ka() {
         ] }),
         u === "custom" && o == "linear" && D(),
         U(),
-        /* @__PURE__ */ e.jsx(Ot, {}),
+        /* @__PURE__ */ e.jsx(Mt, {}),
         /* @__PURE__ */ e.jsx("div", { className: "grid grid-cols-3", children: /* @__PURE__ */ e.jsx(
-          w,
+          z,
           {
             onClick: te,
             variant: "secondary",
@@ -3128,304 +3015,46 @@ function ka() {
     ] }) })
   ] });
 }
-function Kn({ idx: s }) {
-  var c;
-  const n = r((d) => {
-    var f;
-    return (f = d.card) == null ? void 0 : f.preferences;
-  }), a = r(
-    (d) => {
-      var f;
-      return (f = d.card.preferences) == null ? void 0 : f.datasetOptions;
-    }
-  ), t = r(
-    (d) => d.actions.setCardPreferences
-  ), i = (c = n == null ? void 0 : n.chartOptions) == null ? void 0 : c.indexAxis, o = a == null ? void 0 : a.find((d) => d.idx === s);
-  function l(d, f) {
-    (d === "end" || d === "start") && Tt(At());
-    const m = {
-      display: d !== "none",
-      align: d,
-      anchor: d,
-      clamp: !0
+function ws() {
+  var i, o, l;
+  const s = r(
+    (c) => c.card.cfg
+  ), n = r((c) => c.actions.setCardCfg), a = r((c) => c.card.type);
+  function t(c) {
+    var m;
+    const h = {
+      datalabels: {
+        display: c !== "none",
+        align: c,
+        anchor: c,
+        clamp: !0
+      }
+    }, g = {
+      ...s,
+      options: {
+        ...s == null ? void 0 : s.options,
+        plugins: {
+          ...(m = s == null ? void 0 : s.options) == null ? void 0 : m.plugins,
+          ...h
+        }
+      }
     };
-    if (!o)
-      t({
-        ...n,
-        datasetOptions: [
-          ...a || [],
-          {
-            idx: f,
-            datalabels: m
-          }
-        ]
-      });
-    else {
-      const u = { ...o };
-      u.datalabels = m;
-      const C = a == null ? void 0 : a.map(
-        (h) => h.idx === f ? u : h
-      );
-      t({
-        ...n,
-        datasetOptions: C
-      });
-    }
-  }
-  return /* @__PURE__ */ e.jsxs(Ke, { children: [
-    /* @__PURE__ */ e.jsx(Ue, { children: /* @__PURE__ */ e.jsx(mn, { className: "invisible size-4 rotate-[135deg] cursor-pointer text-muted-foreground hover:text-foreground group-hover:visible" }) }),
-    /* @__PURE__ */ e.jsx(Je, { className: "w-fit p-1", children: /* @__PURE__ */ e.jsxs("div", { className: "flex gap-1", children: [
-      /* @__PURE__ */ e.jsx(
-        w,
-        {
-          onClick: () => l("none", s),
-          size: "sm",
-          variant: "secondary",
-          className: "h-7 p-1 text-xs font-normal",
-          children: /* @__PURE__ */ e.jsx(Mt, { className: "size-4" })
-        }
-      ),
-      /* @__PURE__ */ e.jsx(
-        w,
-        {
-          onClick: () => l("start", s),
-          size: "sm",
-          variant: "secondary",
-          className: "h-7 p-1 text-xs font-normal",
-          children: /* @__PURE__ */ e.jsx(
-            en,
-            {
-              className: W("h-4 w-4", {
-                "rotate-90": i === "y"
-              })
-            }
-          )
-        }
-      ),
-      /* @__PURE__ */ e.jsx(
-        w,
-        {
-          onClick: () => l("center", s),
-          size: "sm",
-          variant: "secondary",
-          className: "h-7 p-1 text-xs font-normal",
-          children: /* @__PURE__ */ e.jsx(
-            an,
-            {
-              className: W("h-4 w-4", {
-                "rotate-90": i === "y"
-              })
-            }
-          )
-        }
-      ),
-      /* @__PURE__ */ e.jsx(
-        w,
-        {
-          onClick: () => l("end", s),
-          size: "sm",
-          variant: "secondary",
-          className: "h-7 p-1 text-xs font-normal",
-          children: /* @__PURE__ */ e.jsx(
-            sn,
-            {
-              className: W("h-4 w-4", {
-                "rotate-90": i === "y"
-              })
-            }
-          )
-        }
-      )
-    ] }) })
-  ] });
-}
-function wa() {
-  const s = r((d) => d.card), n = r(
-    (d) => {
-      var f, m, u;
-      return (u = (m = (f = d == null ? void 0 : d.card) == null ? void 0 : f.preferences) == null ? void 0 : m.chartOptions) == null ? void 0 : u.indexAxis;
-    }
-  ), a = n === "y" ? "Y axis" : "X axis", t = n === "y" ? "X axis" : "Y axis", {
-    keys: i,
-    metricKeys: o,
-    dimensionKeys: l
-  } = is(s.data || []);
-  let c = o;
-  if (s.type === "stackedBar") {
-    const d = Et({
-      dataArray: s.data || [],
-      groupKey: l[0],
-      pivotKey: l[1],
-      valueKey: c[0]
-    }), { metricKeys: f } = is(d);
-    c = f;
-  }
-  return i.length === 0 ? null : /* @__PURE__ */ e.jsxs("div", { className: "space-y-4", children: [
-    /* @__PURE__ */ e.jsxs("div", { className: "space-y-2", children: [
-      /* @__PURE__ */ e.jsx(B, { children: a }),
-      /* @__PURE__ */ e.jsx("div", { className: "my-1 space-y-1", children: /* @__PURE__ */ e.jsx("div", { className: "rounded-md bg-muted/70 px-2 py-1 hover:bg-muted", children: /* @__PURE__ */ e.jsx("p", { children: l[0] }) }) })
-    ] }),
-    /* @__PURE__ */ e.jsxs("div", { className: "space-y-2", children: [
-      /* @__PURE__ */ e.jsxs("div", { className: "flex items-center justify-between gap-5", children: [
-        /* @__PURE__ */ e.jsx(B, { children: t }),
-        /* @__PURE__ */ e.jsx(ka, {})
-      ] }),
-      /* @__PURE__ */ e.jsx("div", { className: "my-1 space-y-1", children: c.map((d, f) => /* @__PURE__ */ e.jsx(Un, { col: d, idx: f }, d)) })
-    ] })
-  ] });
-}
-function Un({ col: s, idx: n }) {
-  const a = r((c) => {
-    var d;
-    return (d = c.card) == null ? void 0 : d.preferences;
-  }), t = r(
-    (c) => {
-      var d;
-      return (d = c.card.preferences) == null ? void 0 : d.datasetOptions;
-    }
-  ), i = t == null ? void 0 : t.find((c) => c.idx === n), { setCardPreferences: o } = r((c) => c.actions);
-  function l(c) {
-    if (!i)
-      o({
-        ...a,
-        datasetOptions: [
-          ...t || [],
-          {
-            idx: n,
-            type: c === "area" ? "line" : c,
-            fill: c === "area" ? "origin" : ""
-          }
-        ]
-      });
-    else {
-      const d = { ...i };
-      d.type = c === "area" ? "line" : c, d.fill = c === "area" ? "origin" : "";
-      const f = t == null ? void 0 : t.map(
-        (m) => m.idx === n ? d : m
-      );
-      o({
-        ...a,
-        datasetOptions: f
-      });
-    }
-  }
-  return /* @__PURE__ */ e.jsxs("div", { className: "group flex items-center justify-between gap-5 rounded-md bg-muted/70 px-2 py-1 hover:bg-muted", children: [
-    /* @__PURE__ */ e.jsx("p", { children: s }),
-    /* @__PURE__ */ e.jsxs("div", { className: "flex gap-2", children: [
-      /* @__PURE__ */ e.jsx(
-        Ns,
-        {
-          onClick: () => l("bar"),
-          className: "invisible size-4 cursor-pointer text-muted-foreground hover:text-foreground group-hover:visible"
-        }
-      ),
-      /* @__PURE__ */ e.jsx(
-        Cs,
-        {
-          onClick: () => l("line"),
-          className: "invisible size-4 cursor-pointer text-muted-foreground hover:text-foreground group-hover:visible"
-        }
-      ),
-      /* @__PURE__ */ e.jsx(
-        Jt,
-        {
-          onClick: () => l("area"),
-          className: "invisible size-4 cursor-pointer text-muted-foreground hover:text-foreground group-hover:visible"
-        }
-      ),
-      /* @__PURE__ */ e.jsx(
-        ys,
-        {
-          orientation: "vertical",
-          className: "invisible size-4 cursor-pointer py-2 text-muted-foreground hover:text-foreground group-hover:visible"
-        }
-      ),
-      /* @__PURE__ */ e.jsx(Kn, { idx: n })
-    ] })
-  ] });
-}
-function Jn({
-  cardType: s
-}) {
-  return /* @__PURE__ */ e.jsx("div", { className: "space-y-6 px-6 py-2", children: /* @__PURE__ */ e.jsxs(Se, { defaultValue: ["item-2"], type: "multiple", children: [
-    /* @__PURE__ */ e.jsxs(q, { value: "item-1", children: [
-      /* @__PURE__ */ e.jsx(V, { children: `${vs(s)} Chart` }),
-      /* @__PURE__ */ e.jsxs(R, { className: "space-y-4 font-mono text-xs", children: [
-        /* @__PURE__ */ e.jsx("div", { className: "rounded bg-muted px-2 py-1 text-xs", children: "SELECT x-axis, y-axis-1, y-axis-2,... FROM table" }),
-        /* @__PURE__ */ e.jsxs("ul", { className: "ml-6 list-disc text-xs [&>li]:mt-2", children: [
-          /* @__PURE__ */ e.jsx("li", { children: "x-axis - category" }),
-          /* @__PURE__ */ e.jsx("li", { children: "y-axis1 - number" }),
-          /* @__PURE__ */ e.jsx("li", { children: "y-axis2 - number" })
-        ] }),
-        /* @__PURE__ */ e.jsxs("div", { children: [
-          "See ",
-          /* @__PURE__ */ e.jsx(
-            "a",
-            {
-              target: "_blank",
-              onClick: (n) => n.stopPropagation(),
-              className: "text-blue-700",
-              href: "https://docs.semaphor.cloud/concepts/visuals#line-chart",
-              children: "example"
-            }
-          ),
-          " in the docs."
-        ] })
-      ] })
-    ] }),
-    /* @__PURE__ */ e.jsxs(q, { value: "item-2", children: [
-      /* @__PURE__ */ e.jsx(V, { children: "Settings" }),
-      /* @__PURE__ */ e.jsxs(R, { className: "space-y-4 px-2", children: [
-        /* @__PURE__ */ e.jsx(Ss, {}),
-        /* @__PURE__ */ e.jsx(wa, {})
-      ] })
-    ] }),
-    /* @__PURE__ */ e.jsxs(q, { value: "item-3", children: [
-      /* @__PURE__ */ e.jsx(V, { children: "Filter on click" }),
-      /* @__PURE__ */ e.jsx(R, { className: "px-2", children: /* @__PURE__ */ e.jsx(De, {}) })
-    ] })
-  ] }) });
-}
-function ks() {
-  var i, o, l;
-  const s = r(
-    (c) => c.card.cfg
-  ), n = r((c) => c.actions.setCardCfg), a = r((c) => c.card.type);
-  function t(c) {
-    var m;
-    const d = {
-      datalabels: {
-        display: c !== "none",
-        align: c,
-        anchor: c,
-        clamp: !0
-      }
-    }, f = {
-      ...s,
-      options: {
-        ...s == null ? void 0 : s.options,
-        plugins: {
-          ...(m = s == null ? void 0 : s.options) == null ? void 0 : m.plugins,
-          ...d
-        }
-      }
-    };
-    n(f), console.log(c);
+    n(g), console.log(c);
   }
   return /* @__PURE__ */ e.jsxs("div", { className: "space-y-2", children: [
     /* @__PURE__ */ e.jsxs("div", { className: "flex items-center justify-between", children: [
       /* @__PURE__ */ e.jsx("label", { className: "font-medium", children: "Data Labels" }),
-      a !== "pyramid" && /* @__PURE__ */ e.jsx(ka, {})
+      !["pyramid", "range"].includes(a) && /* @__PURE__ */ e.jsx(ka, {})
     ] }),
     /* @__PURE__ */ e.jsxs(
-      Oe,
+      Fe,
       {
         value: (l = (o = (i = s == null ? void 0 : s.options) == null ? void 0 : i.plugins) == null ? void 0 : o.datalabels) == null ? void 0 : l.anchor,
         onValueChange: t,
         defaultValue: "none",
         children: [
-          /* @__PURE__ */ e.jsx(Me, { className: "h-8 w-full focus:ring-1 focus:ring-offset-0", children: /* @__PURE__ */ e.jsx(Te, { placeholder: "Select position" }) }),
-          /* @__PURE__ */ e.jsx(Ae, { children: /* @__PURE__ */ e.jsxs(_e, { children: [
+          /* @__PURE__ */ e.jsx(Oe, { className: "h-8 w-full focus:ring-1 focus:ring-offset-0", children: /* @__PURE__ */ e.jsx(Me, { placeholder: "Select position" }) }),
+          /* @__PURE__ */ e.jsx(Te, { children: /* @__PURE__ */ e.jsxs(_e, { children: [
             /* @__PURE__ */ e.jsx(Le, { children: "Data Labels" }),
             /* @__PURE__ */ e.jsx(X, { value: "none", children: "None" }),
             a !== "pyramid" && /* @__PURE__ */ e.jsx(X, { value: "start", children: "Start" }),
@@ -3437,7 +3066,123 @@ function ks() {
     )
   ] });
 }
-function Pn({
+function Ge() {
+  const [s, n] = T([]);
+  r(
+    (m) => m.card.cfg
+  );
+  const a = r((m) => m.card.preferences), { setCardCfg: t, setFilterOnClickColumnIndex: i, setCardPreferences: o } = r((m) => m.actions), l = r(
+    (m) => m.queryResultColumns
+  );
+  r(
+    (m) => {
+      var u;
+      return (u = m.card.preferences) == null ? void 0 : u.filterOnClickColumnIndex;
+    }
+  ), K(() => {
+    l && n(new Array(l.length).fill(!1));
+  }, [l]);
+  function c(m, u) {
+    var N, d;
+    u ? a != null && a.onClickFilter && ((N = a == null ? void 0 : a.onClickFilter) == null ? void 0 : N.length) > 0 ? o({
+      ...a,
+      onClickFilter: [
+        ...a.onClickFilter,
+        {
+          columnIndex: m,
+          expression: ""
+        }
+      ]
+    }) : o({
+      ...a,
+      onClickFilter: [
+        {
+          columnIndex: m,
+          expression: ""
+        }
+      ]
+    }) : (o({
+      ...a,
+      onClickFilter: (d = a == null ? void 0 : a.onClickFilter) == null ? void 0 : d.filter(
+        (x) => x.columnIndex !== m
+      )
+    }), n((x) => {
+      const f = [...x];
+      return f[m] = !1, f;
+    }));
+  }
+  function h(m, u) {
+    var d;
+    const N = (d = a == null ? void 0 : a.onClickFilter) == null ? void 0 : d.map((x) => x.columnIndex === m ? {
+      ...x,
+      expression: u.target.value
+    } : x);
+    o({
+      ...a,
+      onClickFilter: N
+    });
+  }
+  function g(m) {
+    var u, N, d, x;
+    if (s != null && s[m] || (N = (u = a == null ? void 0 : a.onClickFilter) == null ? void 0 : u.find((f) => f.columnIndex === m)) != null && N.expression)
+      return /* @__PURE__ */ e.jsx(
+        ae,
+        {
+          value: (x = (d = a == null ? void 0 : a.onClickFilter) == null ? void 0 : d.find((f) => f.columnIndex === m)) == null ? void 0 : x.expression,
+          onChange: (f) => h(m, f),
+          type: "text",
+          className: " h-9 w-full focus-visible:ring-0 focus-visible:ring-ring focus-visible:ring-offset-0 font-mono text-xs",
+          placeholder: "Expression"
+        }
+      );
+  }
+  return /* @__PURE__ */ e.jsx(e.Fragment, { children: l == null ? void 0 : l.map((m, u) => {
+    var N, d;
+    return /* @__PURE__ */ e.jsx(
+      "div",
+      {
+        className: "flex items-center justify-between space-y-2 xbg-red-100 group",
+        children: /* @__PURE__ */ e.jsxs("div", { className: " grow", children: [
+          /* @__PURE__ */ e.jsxs("div", { className: "flex items-center py-2 space-x-2", children: [
+            /* @__PURE__ */ e.jsx(
+              $e,
+              {
+                checked: !!((N = a == null ? void 0 : a.onClickFilter) != null && N.find(
+                  (x) => x.columnIndex === u
+                )),
+                onCheckedChange: (x) => c(u, x)
+              }
+            ),
+            /* @__PURE__ */ e.jsx(
+              "label",
+              {
+                className: "text-sm font-medium leading-none peer-disabled:cursor-not-allowed peer-disabled:opacity-70",
+                children: m
+              }
+            ),
+            /* @__PURE__ */ e.jsx("div", { className: "flex gap-2 items-center ", children: ((d = a == null ? void 0 : a.onClickFilter) == null ? void 0 : d.find(
+              (x) => x.columnIndex === u
+            )) && /* @__PURE__ */ e.jsx(
+              ca,
+              {
+                onClick: () => {
+                  n((x) => {
+                    const f = [...x];
+                    return f[u] = !x[u], f;
+                  });
+                },
+                className: " invisible group-hover:visible size-3 text-gray-400 cursor-pointer"
+              }
+            ) })
+          ] }),
+          g(u)
+        ] })
+      },
+      m
+    );
+  }) });
+}
+function Un({
   cardType: s
 }) {
   function n(a) {
@@ -3467,22 +3212,70 @@ function Pn({
       ] })
     ] });
   }
-  return /* @__PURE__ */ e.jsx("div", { className: "px-6 py-2 space-y-6", children: /* @__PURE__ */ e.jsxs(Se, { defaultValue: ["item-2"], type: "multiple", children: [
-    /* @__PURE__ */ e.jsxs(q, { value: "item-1", children: [
-      /* @__PURE__ */ e.jsx(V, { children: `${vs(s)} Chart` }),
-      /* @__PURE__ */ e.jsx(R, { className: " space-y-4 font-mono text-xs ", children: n(s) })
+  return /* @__PURE__ */ e.jsx("div", { className: "px-6 py-2 space-y-6", children: /* @__PURE__ */ e.jsxs(Ee, { defaultValue: ["item-2"], type: "multiple", children: [
+    /* @__PURE__ */ e.jsxs(_, { value: "item-1", children: [
+      /* @__PURE__ */ e.jsx(H, { children: `${ra(s)} Chart` }),
+      /* @__PURE__ */ e.jsx(B, { className: " space-y-4 font-mono text-xs ", children: n(s) })
     ] }),
-    /* @__PURE__ */ e.jsxs(q, { value: "item-2", children: [
-      /* @__PURE__ */ e.jsx(V, { children: "Settings" }),
-      /* @__PURE__ */ e.jsx(R, { className: "px-2", children: /* @__PURE__ */ e.jsx(ks, {}) })
+    /* @__PURE__ */ e.jsxs(_, { value: "item-2", children: [
+      /* @__PURE__ */ e.jsx(H, { children: "Settings" }),
+      /* @__PURE__ */ e.jsx(B, { className: "px-2", children: /* @__PURE__ */ e.jsx(ws, {}) })
     ] }),
-    /* @__PURE__ */ e.jsxs(q, { value: "item-3", children: [
-      /* @__PURE__ */ e.jsx(V, { children: "Filter on click" }),
-      /* @__PURE__ */ e.jsx(R, { className: "px-2", children: /* @__PURE__ */ e.jsx(De, {}) })
+    /* @__PURE__ */ e.jsxs(_, { value: "item-3", children: [
+      /* @__PURE__ */ e.jsx(H, { children: "Filter on click" }),
+      /* @__PURE__ */ e.jsx(B, { className: "px-2", children: /* @__PURE__ */ e.jsx(Ge, {}) })
     ] })
   ] }) });
 }
-const Gn = {
+function wa() {
+  var o, l, c;
+  const s = r((h) => h.card.preferences), n = r(
+    (h) => h.card.cfg
+  ), { setCardCfg: a, setCardPreferences: t } = r(
+    (h) => h.actions
+  );
+  (o = n == null ? void 0 : n.options) != null && o.indexAxis;
+  function i(h) {
+    var u, N, d, x, f, w;
+    let g = {};
+    (u = s == null ? void 0 : s.chartOptions) != null && u.scales && (g = {
+      x: (d = (N = s == null ? void 0 : s.chartOptions) == null ? void 0 : N.scales) == null ? void 0 : d.y,
+      y: (f = (x = s == null ? void 0 : s.chartOptions) == null ? void 0 : x.scales) == null ? void 0 : f.x
+    });
+    const m = {
+      ...s,
+      chartOptions: {
+        ...s == null ? void 0 : s.chartOptions,
+        scales: {
+          ...(w = s == null ? void 0 : s.chartOptions) == null ? void 0 : w.scales,
+          ...g
+        },
+        indexAxis: h
+      }
+    };
+    t(m);
+  }
+  return /* @__PURE__ */ e.jsxs(
+    la,
+    {
+      value: ((l = s == null ? void 0 : s.chartOptions) == null ? void 0 : l.indexAxis) || ((c = n == null ? void 0 : n.options) == null ? void 0 : c.indexAxis) || "x",
+      onValueChange: i,
+      className: "flex gap-3",
+      defaultValue: "x",
+      children: [
+        /* @__PURE__ */ e.jsxs("div", { className: "flex items-center space-x-2", children: [
+          /* @__PURE__ */ e.jsx(Ye, { value: "x", id: "r1" }),
+          /* @__PURE__ */ e.jsx("label", { className: "text-sm", htmlFor: "r1", children: "Vertical" })
+        ] }),
+        /* @__PURE__ */ e.jsxs("div", { className: "flex items-center space-x-2", children: [
+          /* @__PURE__ */ e.jsx(Ye, { value: "y", id: "r2" }),
+          /* @__PURE__ */ e.jsx("label", { className: "text-sm", htmlFor: "r2", children: "Horizontal" })
+        ] })
+      ]
+    }
+  );
+}
+const Pn = {
   datasets: [
     {
       type: "line",
@@ -3495,7 +3288,7 @@ const Gn = {
       data: []
     }
   ]
-}, Qn = {
+}, Gn = {
   datasets: [
     {
       fill: "origin",
@@ -3505,50 +3298,50 @@ const Gn = {
     }
   ]
 };
-function Wn() {
+function Jn() {
   const s = r((n) => n.card.type);
-  return /* @__PURE__ */ e.jsxs("div", { className: "p-6 space-y-6", children: [
+  return /* @__PURE__ */ e.jsxs("div", { className: "space-y-6 p-6", children: [
     /* @__PURE__ */ e.jsx(
-      Se,
+      Ee,
       {
         className: " ",
         type: "single",
         collapsible: !0,
-        children: Yn(s)
+        children: Qn(s)
       }
     ),
-    /* @__PURE__ */ e.jsx("section", { className: "", children: ["line", "bar"].includes(s) && /* @__PURE__ */ e.jsx(Ss, {}) }),
-    /* @__PURE__ */ e.jsx("div", { children: !["kpi"].includes(s) && /* @__PURE__ */ e.jsx(ks, {}) }),
-    /* @__PURE__ */ e.jsx("div", { children: !["kpi"].includes(s) && /* @__PURE__ */ e.jsx(De, {}) })
+    /* @__PURE__ */ e.jsx("section", { className: "", children: ["line", "bar"].includes(s) && /* @__PURE__ */ e.jsx(wa, {}) }),
+    /* @__PURE__ */ e.jsx("div", { children: !["kpi"].includes(s) && /* @__PURE__ */ e.jsx(ws, {}) }),
+    /* @__PURE__ */ e.jsx("div", { children: !["kpi"].includes(s) && /* @__PURE__ */ e.jsx(Ge, {}) })
   ] });
 }
-function Yn(s) {
+function Qn(s) {
   if (["line", "bar"].includes(s))
     return /* @__PURE__ */ e.jsxs(e.Fragment, { children: [
-      /* @__PURE__ */ e.jsxs(q, { value: "item-1", children: [
-        /* @__PURE__ */ e.jsx(V, { className: " font-normal", children: /* @__PURE__ */ e.jsx("p", { children: "Chart Query" }) }),
-        /* @__PURE__ */ e.jsxs(R, { className: " ", children: [
-          /* @__PURE__ */ e.jsx("div", { className: "bg-muted px-2 py-1 rounded  font-mono font-semibold text-xs", children: "SELECT x-axis, y-axis-1, y-axis-2, y-axis-3,... FROM table" }),
-          /* @__PURE__ */ e.jsxs("ul", { className: "my-6 ml-6 list-disc [&>li]:mt-2 font-normal text-xs", children: [
+      /* @__PURE__ */ e.jsxs(_, { value: "item-1", children: [
+        /* @__PURE__ */ e.jsx(H, { className: "font-normal", children: /* @__PURE__ */ e.jsx("p", { children: "Chart Query" }) }),
+        /* @__PURE__ */ e.jsxs(B, { className: " ", children: [
+          /* @__PURE__ */ e.jsx("div", { className: "rounded bg-muted px-2 py-1 font-mono text-xs font-semibold", children: "SELECT x-axis, y-axis-1, y-axis-2, y-axis-3,... FROM table" }),
+          /* @__PURE__ */ e.jsxs("ul", { className: "my-6 ml-6 list-disc text-xs font-normal [&>li]:mt-2", children: [
             /* @__PURE__ */ e.jsx("li", { children: "X-axis - Category (ex. city)" }),
             /* @__PURE__ */ e.jsx("li", { children: "Y-axis - Number (ex. population)" })
           ] })
         ] })
       ] }),
-      /* @__PURE__ */ e.jsxs(q, { value: "item-2", children: [
-        /* @__PURE__ */ e.jsx(V, { className: " font-normal", children: "Mixed Chart" }),
-        /* @__PURE__ */ e.jsxs(R, { className: " text-xs space-y-2", children: [
+      /* @__PURE__ */ e.jsxs(_, { value: "item-2", children: [
+        /* @__PURE__ */ e.jsx(H, { className: "font-normal", children: "Mixed Chart" }),
+        /* @__PURE__ */ e.jsxs(B, { className: "space-y-2 text-xs", children: [
           /* @__PURE__ */ e.jsxs("p", { children: [
             "Click ",
             /* @__PURE__ */ e.jsx("b", { children: "Customize" }),
             " and change the `type` property in the dataset."
           ] }),
-          /* @__PURE__ */ e.jsx("pre", { children: JSON.stringify(Gn, null, 2) })
+          /* @__PURE__ */ e.jsx("pre", { children: JSON.stringify(Pn, null, 2) })
         ] })
       ] }),
-      /* @__PURE__ */ e.jsxs(q, { value: "item-3", children: [
-        /* @__PURE__ */ e.jsx(V, { className: " font-normal", children: "Area Chart" }),
-        /* @__PURE__ */ e.jsxs(R, { className: "  text-xs space-y-2", children: [
+      /* @__PURE__ */ e.jsxs(_, { value: "item-3", children: [
+        /* @__PURE__ */ e.jsx(H, { className: "font-normal", children: "Area Chart" }),
+        /* @__PURE__ */ e.jsxs(B, { className: "space-y-2 text-xs", children: [
           /* @__PURE__ */ e.jsxs("p", { children: [
             "Click ",
             /* @__PURE__ */ e.jsx("b", { children: "Customize" }),
@@ -3556,7 +3349,7 @@ function Yn(s) {
             /* @__PURE__ */ e.jsx(
               "a",
               {
-                className: "text-blue-500 hover:underline mx-1",
+                className: "mx-1 text-blue-500 hover:underline",
                 href: "https://www.chartjs.org/docs/latest/samples/area/line-boundaries.html",
                 target: "_blank",
                 children: "docs"
@@ -3564,20 +3357,20 @@ function Yn(s) {
             ),
             "for more options."
           ] }),
-          /* @__PURE__ */ e.jsx("pre", { children: JSON.stringify(Qn, null, 2) })
+          /* @__PURE__ */ e.jsx("pre", { children: JSON.stringify(Gn, null, 2) })
         ] })
       ] })
     ] });
   if (s === "bubble")
-    return /* @__PURE__ */ e.jsx(e.Fragment, { children: /* @__PURE__ */ e.jsxs(q, { value: "item-1", children: [
-      /* @__PURE__ */ e.jsx(V, { className: " font-normal", children: /* @__PURE__ */ e.jsxs("p", { children: [
+    return /* @__PURE__ */ e.jsx(e.Fragment, { children: /* @__PURE__ */ e.jsxs(_, { value: "item-1", children: [
+      /* @__PURE__ */ e.jsx(H, { className: "font-normal", children: /* @__PURE__ */ e.jsxs("p", { children: [
         "How to create a ",
         /* @__PURE__ */ e.jsx("span", { children: s }),
         " chart query?"
       ] }) }),
-      /* @__PURE__ */ e.jsxs(R, { className: " ", children: [
-        /* @__PURE__ */ e.jsx("div", { className: "bg-muted px-2 py-1 rounded  font-mono font-semibold text-xs", children: "SELECT label, x-axis, y-axis, radius FROM table" }),
-        /* @__PURE__ */ e.jsxs("ul", { className: "my-6 ml-6 list-disc [&>li]:mt-2 font-normal text-xs", children: [
+      /* @__PURE__ */ e.jsxs(B, { className: " ", children: [
+        /* @__PURE__ */ e.jsx("div", { className: "rounded bg-muted px-2 py-1 font-mono text-xs font-semibold", children: "SELECT label, x-axis, y-axis, radius FROM table" }),
+        /* @__PURE__ */ e.jsxs("ul", { className: "my-6 ml-6 list-disc text-xs font-normal [&>li]:mt-2", children: [
           /* @__PURE__ */ e.jsx("li", { children: "Label - Category (ex. city)" }),
           /* @__PURE__ */ e.jsx("li", { children: "Bubble Group (opt) - Category (ex. state)" }),
           /* @__PURE__ */ e.jsx("li", { children: "X-axis - Number (ex. avg. age)" }),
@@ -3587,15 +3380,15 @@ function Yn(s) {
       ] })
     ] }) });
   if (s === "scatter")
-    return /* @__PURE__ */ e.jsx(e.Fragment, { children: /* @__PURE__ */ e.jsxs(q, { value: "item-1", children: [
-      /* @__PURE__ */ e.jsx(V, { className: " font-normal", children: /* @__PURE__ */ e.jsxs("p", { children: [
+    return /* @__PURE__ */ e.jsx(e.Fragment, { children: /* @__PURE__ */ e.jsxs(_, { value: "item-1", children: [
+      /* @__PURE__ */ e.jsx(H, { className: "font-normal", children: /* @__PURE__ */ e.jsxs("p", { children: [
         "How to create a ",
         /* @__PURE__ */ e.jsx("span", { children: s }),
         " chart query?"
       ] }) }),
-      /* @__PURE__ */ e.jsxs(R, { className: " ", children: [
-        /* @__PURE__ */ e.jsx("div", { className: "bg-muted px-2 py-1 rounded  font-mono font-semibold text-xs", children: "SELECT label, x-axis, y-axis FROM table" }),
-        /* @__PURE__ */ e.jsxs("ul", { className: "my-6 ml-6 list-disc [&>li]:mt-2 font-normal text-xs", children: [
+      /* @__PURE__ */ e.jsxs(B, { className: " ", children: [
+        /* @__PURE__ */ e.jsx("div", { className: "rounded bg-muted px-2 py-1 font-mono text-xs font-semibold", children: "SELECT label, x-axis, y-axis FROM table" }),
+        /* @__PURE__ */ e.jsxs("ul", { className: "my-6 ml-6 list-disc text-xs font-normal [&>li]:mt-2", children: [
           /* @__PURE__ */ e.jsx("li", { children: "Label - Category (ex. city)" }),
           /* @__PURE__ */ e.jsx("li", { children: "Group (opt) - Category (ex. state)" }),
           /* @__PURE__ */ e.jsx("li", { children: "X-axis - Number (ex. avg. age)" }),
@@ -3604,124 +3397,124 @@ function Yn(s) {
       ] })
     ] }) });
   if (["pie", "doughnut", "polarArea"].includes(s))
-    return /* @__PURE__ */ e.jsx(e.Fragment, { children: /* @__PURE__ */ e.jsxs(q, { value: "item-1", children: [
-      /* @__PURE__ */ e.jsx(V, { className: " font-normal", children: /* @__PURE__ */ e.jsxs("p", { children: [
+    return /* @__PURE__ */ e.jsx(e.Fragment, { children: /* @__PURE__ */ e.jsxs(_, { value: "item-1", children: [
+      /* @__PURE__ */ e.jsx(H, { className: "font-normal", children: /* @__PURE__ */ e.jsxs("p", { children: [
         /* @__PURE__ */ e.jsx("span", { children: s === "polarArea" ? "Polar" : s.charAt(0).toUpperCase() + s.slice(1) }),
         " ",
         "chart query"
       ] }) }),
-      /* @__PURE__ */ e.jsxs(R, { className: " ", children: [
-        /* @__PURE__ */ e.jsx("div", { className: "bg-muted px-2 py-1 rounded  font-mono font-semibold text-xs", children: "SELECT label, measure FROM table" }),
-        /* @__PURE__ */ e.jsxs("ul", { className: "my-6 ml-6 list-disc [&>li]:mt-2 font-normal text-xs", children: [
+      /* @__PURE__ */ e.jsxs(B, { className: " ", children: [
+        /* @__PURE__ */ e.jsx("div", { className: "rounded bg-muted px-2 py-1 font-mono text-xs font-semibold", children: "SELECT label, measure FROM table" }),
+        /* @__PURE__ */ e.jsxs("ul", { className: "my-6 ml-6 list-disc text-xs font-normal [&>li]:mt-2", children: [
           /* @__PURE__ */ e.jsx("li", { children: "Label - Category (ex. city)" }),
           /* @__PURE__ */ e.jsx("li", { children: "Measure - Number (ex. population)" })
         ] })
       ] })
     ] }) });
 }
-function Xn() {
-  var d, f, m, u, C;
-  const s = r((h) => h.card.preferences), n = r(
-    (h) => h.actions.setCardPreferences
+function Wn() {
+  var h, g, m, u, N;
+  const s = r((d) => d.card.preferences), n = r(
+    (d) => d.actions.setCardPreferences
   ), a = r(
-    (h) => h.actions.setNumberFormat
+    (d) => d.actions.setNumberFormat
   );
   r(
-    (h) => {
-      var x, g;
-      return (g = (x = h.card.preferences) == null ? void 0 : x.formatNumber) == null ? void 0 : g.decimalPlaces;
+    (d) => {
+      var x, f;
+      return (f = (x = d.card.preferences) == null ? void 0 : x.formatNumber) == null ? void 0 : f.decimalPlaces;
     }
   );
   const t = r(
-    (h) => {
-      var x, g;
-      return (g = (x = h.card.preferences) == null ? void 0 : x.formatNumber) == null ? void 0 : g.locale;
+    (d) => {
+      var x, f;
+      return (f = (x = d.card.preferences) == null ? void 0 : x.formatNumber) == null ? void 0 : f.locale;
     }
   ), i = r(
-    (h) => {
-      var x, g;
-      return (g = (x = h.card.preferences) == null ? void 0 : x.formatNumber) == null ? void 0 : g.currency;
+    (d) => {
+      var x, f;
+      return (f = (x = d.card.preferences) == null ? void 0 : x.formatNumber) == null ? void 0 : f.currency;
     }
   );
   r(
-    (h) => h.actions.setFilterOnClickField
+    (d) => d.actions.setFilterOnClickField
   );
   const o = r(
-    (h) => {
-      var x, g;
-      return (g = (x = h.card.preferences) == null ? void 0 : x.formatNumber) == null ? void 0 : g.colorRanges;
+    (d) => {
+      var x, f;
+      return (f = (x = d.card.preferences) == null ? void 0 : x.formatNumber) == null ? void 0 : f.colorRanges;
     }
   ) || [], l = r(
-    (h) => h.actions.setColorRanges
-  ), c = [...new Set(Vs.map((h) => h.currency))];
+    (d) => d.actions.setColorRanges
+  ), c = [...new Set(qs.map((d) => d.currency))];
   return /* @__PURE__ */ e.jsxs("div", { children: [
     /* @__PURE__ */ e.jsxs("div", { className: "mb-3 flex items-center gap-2", children: [
       /* @__PURE__ */ e.jsx(
         $e,
         {
-          checked: !!((d = s == null ? void 0 : s.formatNumber) != null && d.enabled),
-          onCheckedChange: (h) => {
+          checked: !!((h = s == null ? void 0 : s.formatNumber) != null && h.enabled),
+          onCheckedChange: (d) => {
             n({
               ...s,
               formatNumber: {
                 ...s == null ? void 0 : s.formatNumber,
-                enabled: h
+                enabled: d
               }
             });
           }
         }
       ),
-      /* @__PURE__ */ e.jsx(B, { children: "Format Number" })
+      /* @__PURE__ */ e.jsx(R, { children: "Format Number" })
     ] }),
-    ((f = s == null ? void 0 : s.formatNumber) == null ? void 0 : f.enabled) === !0 && /* @__PURE__ */ e.jsxs("div", { className: "flex flex-col gap-2", children: [
+    ((g = s == null ? void 0 : s.formatNumber) == null ? void 0 : g.enabled) === !0 && /* @__PURE__ */ e.jsxs("div", { className: "flex flex-col gap-2", children: [
       /* @__PURE__ */ e.jsx("div", { children: /* @__PURE__ */ e.jsxs("div", { className: "space-y-4 p-2", children: [
         /* @__PURE__ */ e.jsxs("div", { className: "flex items-center gap-2", children: [
           /* @__PURE__ */ e.jsxs("div", { className: "w-full space-y-1", children: [
-            /* @__PURE__ */ e.jsx(B, { children: "Locale" }),
+            /* @__PURE__ */ e.jsx(R, { children: "Locale" }),
             /* @__PURE__ */ e.jsxs(
-              Oe,
+              Fe,
               {
                 value: t || "en-US",
-                onValueChange: (h) => {
-                  var x, g, j;
+                onValueChange: (d) => {
+                  var x, f, w;
                   return a(
                     ((x = s == null ? void 0 : s.formatNumber) == null ? void 0 : x.decimalPlaces) || 0,
-                    ((g = s == null ? void 0 : s.formatNumber) == null ? void 0 : g.currency) || "",
-                    h || "en-US",
-                    ((j = s == null ? void 0 : s.formatNumber) == null ? void 0 : j.suffix) || ""
+                    ((f = s == null ? void 0 : s.formatNumber) == null ? void 0 : f.currency) || "",
+                    d || "en-US",
+                    ((w = s == null ? void 0 : s.formatNumber) == null ? void 0 : w.suffix) || ""
                   );
                 },
                 children: [
-                  /* @__PURE__ */ e.jsx(Me, { className: "col-span-6 h-8 w-full focus:ring-1 focus:ring-offset-0", children: /* @__PURE__ */ e.jsx(Te, {}) }),
-                  /* @__PURE__ */ e.jsx(Ae, { children: /* @__PURE__ */ e.jsxs(_e, { children: [
+                  /* @__PURE__ */ e.jsx(Oe, { className: "col-span-6 h-8 w-full focus:ring-1 focus:ring-offset-0", children: /* @__PURE__ */ e.jsx(Me, {}) }),
+                  /* @__PURE__ */ e.jsx(Te, { children: /* @__PURE__ */ e.jsxs(_e, { children: [
                     /* @__PURE__ */ e.jsx(Le, { children: "Format" }),
-                    Vs.map((h) => /* @__PURE__ */ e.jsx(X, { value: h.locale, children: h.locale }, h.locale))
+                    qs.map((d) => /* @__PURE__ */ e.jsx(X, { value: d.locale, children: d.locale }, d.locale))
                   ] }) })
                 ]
               }
             )
           ] }),
           /* @__PURE__ */ e.jsxs("div", { className: "w-full space-y-1", children: [
-            /* @__PURE__ */ e.jsx(B, { children: "Currency" }),
+            /* @__PURE__ */ e.jsx(R, { children: "Currency" }),
             /* @__PURE__ */ e.jsxs(
-              Oe,
+              Fe,
               {
                 value: i || "none",
-                onValueChange: (h) => {
-                  var x, g, j;
+                onValueChange: (d) => {
+                  var x, f, w;
                   return a(
                     ((x = s == null ? void 0 : s.formatNumber) == null ? void 0 : x.decimalPlaces) || 0,
-                    h === "none" ? "" : h,
-                    ((g = s == null ? void 0 : s.formatNumber) == null ? void 0 : g.locale) || "",
-                    ((j = s == null ? void 0 : s.formatNumber) == null ? void 0 : j.suffix) || ""
+                    d === "none" ? "" : d,
+                    ((f = s == null ? void 0 : s.formatNumber) == null ? void 0 : f.locale) || "",
+                    ((w = s == null ? void 0 : s.formatNumber) == null ? void 0 : w.suffix) || ""
                   );
                 },
                 children: [
-                  /* @__PURE__ */ e.jsx(Me, { className: "col-span-6 h-8 w-full focus:ring-1 focus:ring-offset-0", children: /* @__PURE__ */ e.jsx(Te, {}) }),
-                  /* @__PURE__ */ e.jsx(Ae, { children: /* @__PURE__ */ e.jsxs(_e, { children: [
+                  /* @__PURE__ */ e.jsx(Oe, { className: "col-span-6 h-8 w-full focus:ring-1 focus:ring-offset-0", children: /* @__PURE__ */ e.jsx(Me, {}) }),
+                  /* @__PURE__ */ e.jsx(Te, { children: /* @__PURE__ */ e.jsxs(_e, { children: [
                     /* @__PURE__ */ e.jsx(Le, { children: "Currency" }),
                     /* @__PURE__ */ e.jsx(X, { value: "none", children: "None" }, "none"),
-                    c.map((h) => /* @__PURE__ */ e.jsx(X, { value: h, children: h }, h))
+                    c.map((d) => /* @__PURE__ */ e.jsx(X, { value: d, children: d }, d))
                   ] }) })
                 ]
               }
@@ -3730,42 +3523,42 @@ function Xn() {
         ] }),
         /* @__PURE__ */ e.jsxs("div", { className: "flex gap-2", children: [
           /* @__PURE__ */ e.jsxs("div", { className: "w-full space-y-1", children: [
-            /* @__PURE__ */ e.jsx(B, { children: "Decimals" }),
+            /* @__PURE__ */ e.jsx(R, { children: "Decimals" }),
             /* @__PURE__ */ e.jsxs(
-              Oe,
+              Fe,
               {
                 value: ((u = (m = s == null ? void 0 : s.formatNumber) == null ? void 0 : m.decimalPlaces) == null ? void 0 : u.toString()) || "0",
-                onValueChange: (h) => {
-                  var x, g, j;
+                onValueChange: (d) => {
+                  var x, f, w;
                   return a(
-                    Number(h),
+                    Number(d),
                     ((x = s == null ? void 0 : s.formatNumber) == null ? void 0 : x.currency) || "",
-                    ((g = s == null ? void 0 : s.formatNumber) == null ? void 0 : g.locale) || "",
-                    ((j = s == null ? void 0 : s.formatNumber) == null ? void 0 : j.suffix) || ""
+                    ((f = s == null ? void 0 : s.formatNumber) == null ? void 0 : f.locale) || "",
+                    ((w = s == null ? void 0 : s.formatNumber) == null ? void 0 : w.suffix) || ""
                   );
                 },
                 children: [
-                  /* @__PURE__ */ e.jsx(Me, { className: "col-span-3 h-8 w-full focus:ring-1 focus:ring-offset-0", children: /* @__PURE__ */ e.jsx(Te, {}) }),
-                  /* @__PURE__ */ e.jsx(Ae, { children: ["0", "1", "2", "3", "4"].map((h) => /* @__PURE__ */ e.jsx(X, { value: h, children: h }, h)) })
+                  /* @__PURE__ */ e.jsx(Oe, { className: "col-span-3 h-8 w-full focus:ring-1 focus:ring-offset-0", children: /* @__PURE__ */ e.jsx(Me, {}) }),
+                  /* @__PURE__ */ e.jsx(Te, { children: ["0", "1", "2", "3", "4"].map((d) => /* @__PURE__ */ e.jsx(X, { value: d, children: d }, d)) })
                 ]
               }
             )
           ] }),
           /* @__PURE__ */ e.jsxs("div", { className: "w-full space-y-1", children: [
-            /* @__PURE__ */ e.jsx(B, { children: "Suffix" }),
+            /* @__PURE__ */ e.jsx(R, { children: "Suffix" }),
             /* @__PURE__ */ e.jsx(
               ae,
               {
-                value: ((C = s == null ? void 0 : s.formatNumber) == null ? void 0 : C.suffix) || "",
+                value: ((N = s == null ? void 0 : s.formatNumber) == null ? void 0 : N.suffix) || "",
                 className: "h-8 font-mono text-xs focus-visible:ring-0 focus-visible:ring-ring focus-visible:ring-offset-0",
                 placeholder: "K, M, B, %",
-                onChange: (h) => {
-                  var x, g, j;
+                onChange: (d) => {
+                  var x, f, w;
                   return a(
                     ((x = s == null ? void 0 : s.formatNumber) == null ? void 0 : x.decimalPlaces) || 0,
-                    ((g = s == null ? void 0 : s.formatNumber) == null ? void 0 : g.currency) || "",
-                    ((j = s == null ? void 0 : s.formatNumber) == null ? void 0 : j.locale) || "",
-                    h.target.value
+                    ((f = s == null ? void 0 : s.formatNumber) == null ? void 0 : f.currency) || "",
+                    ((w = s == null ? void 0 : s.formatNumber) == null ? void 0 : w.locale) || "",
+                    d.target.value
                   );
                 }
               }
@@ -3773,9 +3566,9 @@ function Xn() {
           ] })
         ] })
       ] }) }),
-      /* @__PURE__ */ e.jsx(ys, { className: "my-3" }),
+      /* @__PURE__ */ e.jsx(Cs, { className: "my-3" }),
       /* @__PURE__ */ e.jsx(
-        Lt,
+        Tt,
         {
           colorRanges: o,
           setColorRanges: l
@@ -3784,11 +3577,11 @@ function Xn() {
     ] })
   ] });
 }
-function Zn() {
+function Yn() {
   return /* @__PURE__ */ e.jsxs("div", { className: "space-y-6 px-6 py-2", children: [
-    /* @__PURE__ */ e.jsx(Se, { type: "single", collapsible: !0, children: /* @__PURE__ */ e.jsxs(q, { value: "item-1", children: [
-      /* @__PURE__ */ e.jsx(V, { className: "", children: "KPI Query" }),
-      /* @__PURE__ */ e.jsxs(R, { className: "font-mono", children: [
+    /* @__PURE__ */ e.jsx(Ee, { type: "single", collapsible: !0, children: /* @__PURE__ */ e.jsxs(_, { value: "item-1", children: [
+      /* @__PURE__ */ e.jsx(H, { className: "", children: "KPI Query" }),
+      /* @__PURE__ */ e.jsxs(B, { className: "font-mono", children: [
         /* @__PURE__ */ e.jsx("div", { className: "rounded bg-muted px-2 py-1 font-mono text-xs", children: "SELECT current, previous FROM table" }),
         /* @__PURE__ */ e.jsxs("ul", { className: "my-6 ml-6 list-disc text-xs [&>li]:mt-2", children: [
           /* @__PURE__ */ e.jsx("li", { children: "current - number" }),
@@ -3810,19 +3603,19 @@ function Zn() {
         ] })
       ] })
     ] }) }),
-    /* @__PURE__ */ e.jsx("section", { className: "", children: /* @__PURE__ */ e.jsx(Xn, {}) }),
+    /* @__PURE__ */ e.jsx("section", { className: "", children: /* @__PURE__ */ e.jsx(Wn, {}) }),
     /* @__PURE__ */ e.jsx("div", {}),
     /* @__PURE__ */ e.jsx("div", {})
   ] });
 }
-function Ks({
+function os({
   cardType: s,
   docContent: n
 }) {
-  return /* @__PURE__ */ e.jsx("div", { className: "space-y-6 px-6 py-2", children: /* @__PURE__ */ e.jsxs(Se, { defaultValue: ["item-2"], type: "multiple", children: [
-    /* @__PURE__ */ e.jsxs(q, { value: "item-1", children: [
-      /* @__PURE__ */ e.jsx(V, { children: `${vs(s)} Chart` }),
-      /* @__PURE__ */ e.jsx(R, { children: n || /* @__PURE__ */ e.jsxs("div", { className: "space-y-4 font-mono text-xs", children: [
+  return /* @__PURE__ */ e.jsx("div", { className: "space-y-6 px-6 py-2", children: /* @__PURE__ */ e.jsxs(Ee, { defaultValue: ["item-2"], type: "multiple", children: [
+    /* @__PURE__ */ e.jsxs(_, { value: "item-1", children: [
+      /* @__PURE__ */ e.jsx(H, { children: `${ra(s)} Chart` }),
+      /* @__PURE__ */ e.jsx(B, { children: n || /* @__PURE__ */ e.jsxs("div", { className: "space-y-4 font-mono text-xs", children: [
         /* @__PURE__ */ e.jsx("div", { className: "rounded bg-muted px-2 py-1 text-xs", children: "SELECT label, measure FROM table" }),
         /* @__PURE__ */ e.jsxs("ul", { className: "ml-6 list-disc text-xs [&>li]:mt-2", children: [
           /* @__PURE__ */ e.jsx("li", { children: "label - category" }),
@@ -3844,21 +3637,237 @@ function Ks({
         ] })
       ] }) })
     ] }),
-    /* @__PURE__ */ e.jsxs(q, { value: "item-2", children: [
-      /* @__PURE__ */ e.jsx(V, { children: "Settings" }),
-      /* @__PURE__ */ e.jsx(R, { className: "px-2", children: /* @__PURE__ */ e.jsx(ks, {}) })
+    /* @__PURE__ */ e.jsxs(_, { value: "item-2", children: [
+      /* @__PURE__ */ e.jsx(H, { children: "Settings" }),
+      /* @__PURE__ */ e.jsx(B, { className: "px-2", children: /* @__PURE__ */ e.jsx(ws, {}) })
     ] }),
-    /* @__PURE__ */ e.jsxs(q, { value: "item-3", children: [
-      /* @__PURE__ */ e.jsx(V, { children: "Filter on click" }),
-      /* @__PURE__ */ e.jsx(R, { className: "px-2", children: /* @__PURE__ */ e.jsx(De, {}) })
+    s !== "range" && /* @__PURE__ */ e.jsxs(_, { value: "item-3", children: [
+      /* @__PURE__ */ e.jsx(H, { children: "Filter on click" }),
+      /* @__PURE__ */ e.jsx(B, { className: "px-2", children: /* @__PURE__ */ e.jsx(Ge, {}) })
     ] })
   ] }) });
 }
-function el() {
-  return /* @__PURE__ */ e.jsx("div", { className: "space-y-6 px-6 py-2", children: /* @__PURE__ */ e.jsxs(Se, { defaultValue: ["item-2"], type: "multiple", children: [
-    /* @__PURE__ */ e.jsxs(q, { value: "item-1", children: [
-      /* @__PURE__ */ e.jsx(V, { children: "Stacked Chart" }),
-      /* @__PURE__ */ e.jsxs(R, { className: "space-y-4 font-mono text-xs", children: [
+function Xn({ idx: s }) {
+  var c;
+  const n = r((h) => {
+    var g;
+    return (g = h.card) == null ? void 0 : g.preferences;
+  }), a = r(
+    (h) => {
+      var g;
+      return (g = h.card.preferences) == null ? void 0 : g.datasetOptions;
+    }
+  ), t = r(
+    (h) => h.actions.setCardPreferences
+  ), i = (c = n == null ? void 0 : n.chartOptions) == null ? void 0 : c.indexAxis, o = a == null ? void 0 : a.find((h) => h.idx === s);
+  function l(h, g) {
+    (h === "end" || h === "start") && Lt(Et());
+    const m = {
+      display: h !== "none",
+      align: h,
+      anchor: h,
+      clamp: !0
+    };
+    if (!o)
+      t({
+        ...n,
+        datasetOptions: [
+          ...a || [],
+          {
+            idx: g,
+            datalabels: m
+          }
+        ]
+      });
+    else {
+      const u = { ...o };
+      u.datalabels = m;
+      const N = a == null ? void 0 : a.map(
+        (d) => d.idx === g ? u : d
+      );
+      t({
+        ...n,
+        datasetOptions: N
+      });
+    }
+  }
+  return /* @__PURE__ */ e.jsxs(Ke, { children: [
+    /* @__PURE__ */ e.jsx(Ue, { children: /* @__PURE__ */ e.jsx(un, { className: "invisible size-4 rotate-[135deg] cursor-pointer text-muted-foreground hover:text-foreground group-hover:visible" }) }),
+    /* @__PURE__ */ e.jsx(Pe, { className: "w-fit p-1", children: /* @__PURE__ */ e.jsxs("div", { className: "flex gap-1", children: [
+      /* @__PURE__ */ e.jsx(
+        z,
+        {
+          onClick: () => l("none", s),
+          size: "sm",
+          variant: "secondary",
+          className: "h-7 p-1 text-xs font-normal",
+          children: /* @__PURE__ */ e.jsx(At, { className: "size-4" })
+        }
+      ),
+      /* @__PURE__ */ e.jsx(
+        z,
+        {
+          onClick: () => l("start", s),
+          size: "sm",
+          variant: "secondary",
+          className: "h-7 p-1 text-xs font-normal",
+          children: /* @__PURE__ */ e.jsx(
+            sn,
+            {
+              className: W("h-4 w-4", {
+                "rotate-90": i === "y"
+              })
+            }
+          )
+        }
+      ),
+      /* @__PURE__ */ e.jsx(
+        z,
+        {
+          onClick: () => l("center", s),
+          size: "sm",
+          variant: "secondary",
+          className: "h-7 p-1 text-xs font-normal",
+          children: /* @__PURE__ */ e.jsx(
+            tn,
+            {
+              className: W("h-4 w-4", {
+                "rotate-90": i === "y"
+              })
+            }
+          )
+        }
+      ),
+      /* @__PURE__ */ e.jsx(
+        z,
+        {
+          onClick: () => l("end", s),
+          size: "sm",
+          variant: "secondary",
+          className: "h-7 p-1 text-xs font-normal",
+          children: /* @__PURE__ */ e.jsx(
+            an,
+            {
+              className: W("h-4 w-4", {
+                "rotate-90": i === "y"
+              })
+            }
+          )
+        }
+      )
+    ] }) })
+  ] });
+}
+function Zn() {
+  const s = r((h) => h.card), n = r(
+    (h) => {
+      var g, m, u;
+      return (u = (m = (g = h == null ? void 0 : h.card) == null ? void 0 : g.preferences) == null ? void 0 : m.chartOptions) == null ? void 0 : u.indexAxis;
+    }
+  ), a = n === "y" ? "Y axis" : "X axis", t = n === "y" ? "X axis" : "Y axis", {
+    keys: i,
+    metricKeys: o,
+    dimensionKeys: l
+  } = ds(s.data || []);
+  let c = o;
+  if (s.type === "stackedBar") {
+    const h = Dt({
+      dataArray: s.data || [],
+      groupKey: l[0],
+      pivotKey: l[1],
+      valueKey: c[0]
+    }), { metricKeys: g } = ds(h);
+    c = g;
+  }
+  return i.length === 0 ? null : /* @__PURE__ */ e.jsxs("div", { className: "space-y-4", children: [
+    /* @__PURE__ */ e.jsxs("div", { className: "space-y-2", children: [
+      /* @__PURE__ */ e.jsx(R, { children: a }),
+      /* @__PURE__ */ e.jsx("div", { className: "my-1 space-y-1", children: /* @__PURE__ */ e.jsx("div", { className: "rounded-md bg-muted/70 px-2 py-1 hover:bg-muted", children: /* @__PURE__ */ e.jsx("p", { children: l[0] }) }) })
+    ] }),
+    /* @__PURE__ */ e.jsxs("div", { className: "space-y-2", children: [
+      /* @__PURE__ */ e.jsxs("div", { className: "flex items-center justify-between gap-5", children: [
+        /* @__PURE__ */ e.jsx(R, { children: t }),
+        /* @__PURE__ */ e.jsx(ka, {})
+      ] }),
+      /* @__PURE__ */ e.jsx("div", { className: "my-1 space-y-1", children: c.map((h, g) => /* @__PURE__ */ e.jsx(el, { col: h, idx: g }, h)) })
+    ] })
+  ] });
+}
+function el({ col: s, idx: n }) {
+  const a = r((c) => {
+    var h;
+    return (h = c.card) == null ? void 0 : h.preferences;
+  }), t = r(
+    (c) => {
+      var h;
+      return (h = c.card.preferences) == null ? void 0 : h.datasetOptions;
+    }
+  ), i = t == null ? void 0 : t.find((c) => c.idx === n), { setCardPreferences: o } = r((c) => c.actions);
+  function l(c) {
+    if (!i)
+      o({
+        ...a,
+        datasetOptions: [
+          ...t || [],
+          {
+            idx: n,
+            type: c === "area" ? "line" : c,
+            fill: c === "area" ? "origin" : ""
+          }
+        ]
+      });
+    else {
+      const h = { ...i };
+      h.type = c === "area" ? "line" : c, h.fill = c === "area" ? "origin" : "";
+      const g = t == null ? void 0 : t.map(
+        (m) => m.idx === n ? h : m
+      );
+      o({
+        ...a,
+        datasetOptions: g
+      });
+    }
+  }
+  return /* @__PURE__ */ e.jsxs("div", { className: "group flex items-center justify-between gap-5 rounded-md bg-muted/70 px-2 py-1 hover:bg-muted", children: [
+    /* @__PURE__ */ e.jsx("p", { children: s }),
+    /* @__PURE__ */ e.jsxs("div", { className: "flex gap-2", children: [
+      /* @__PURE__ */ e.jsx(
+        Ss,
+        {
+          onClick: () => l("bar"),
+          className: "invisible size-4 cursor-pointer text-muted-foreground hover:text-foreground group-hover:visible"
+        }
+      ),
+      /* @__PURE__ */ e.jsx(
+        ks,
+        {
+          onClick: () => l("line"),
+          className: "invisible size-4 cursor-pointer text-muted-foreground hover:text-foreground group-hover:visible"
+        }
+      ),
+      /* @__PURE__ */ e.jsx(
+        Gt,
+        {
+          onClick: () => l("area"),
+          className: "invisible size-4 cursor-pointer text-muted-foreground hover:text-foreground group-hover:visible"
+        }
+      ),
+      /* @__PURE__ */ e.jsx(
+        Cs,
+        {
+          orientation: "vertical",
+          className: "invisible size-4 cursor-pointer py-2 text-muted-foreground hover:text-foreground group-hover:visible"
+        }
+      ),
+      /* @__PURE__ */ e.jsx(Xn, { idx: n })
+    ] })
+  ] });
+}
+function sl() {
+  return /* @__PURE__ */ e.jsx("div", { className: "space-y-6 px-6 py-2", children: /* @__PURE__ */ e.jsxs(Ee, { defaultValue: ["item-2"], type: "multiple", children: [
+    /* @__PURE__ */ e.jsxs(_, { value: "item-1", children: [
+      /* @__PURE__ */ e.jsx(H, { children: "Stacked Chart" }),
+      /* @__PURE__ */ e.jsxs(B, { className: "space-y-4 font-mono text-xs", children: [
         /* @__PURE__ */ e.jsx("div", { className: "rounded bg-muted px-2 py-1 text-xs", children: "SELECT x-axis, stack-by, y-axis FROM table" }),
         /* @__PURE__ */ e.jsxs("ul", { className: "ml-6 list-disc text-xs [&>li]:mt-2", children: [
           /* @__PURE__ */ e.jsx("li", { children: "x-axis - category" }),
@@ -3881,20 +3890,20 @@ function el() {
         ] })
       ] })
     ] }),
-    /* @__PURE__ */ e.jsxs(q, { value: "item-2", children: [
-      /* @__PURE__ */ e.jsx(V, { children: "Settings" }),
-      /* @__PURE__ */ e.jsxs(R, { className: "space-y-4 px-2", children: [
-        /* @__PURE__ */ e.jsx(Ss, {}),
-        /* @__PURE__ */ e.jsx(wa, {})
+    /* @__PURE__ */ e.jsxs(_, { value: "item-2", children: [
+      /* @__PURE__ */ e.jsx(H, { children: "Settings" }),
+      /* @__PURE__ */ e.jsxs(B, { className: "space-y-4 px-2", children: [
+        /* @__PURE__ */ e.jsx(wa, {}),
+        /* @__PURE__ */ e.jsx(Zn, {})
       ] })
     ] }),
-    /* @__PURE__ */ e.jsxs(q, { value: "item-3", children: [
-      /* @__PURE__ */ e.jsx(V, { children: "Filter on click" }),
-      /* @__PURE__ */ e.jsx(R, { className: "px-2", children: /* @__PURE__ */ e.jsx(De, {}) })
+    /* @__PURE__ */ e.jsxs(_, { value: "item-3", children: [
+      /* @__PURE__ */ e.jsx(H, { children: "Filter on click" }),
+      /* @__PURE__ */ e.jsx(B, { className: "px-2", children: /* @__PURE__ */ e.jsx(Ge, {}) })
     ] })
   ] }) });
 }
-function sl({}) {
+function al({}) {
   const s = r((t) => {
     var i;
     return (i = t.card) == null ? void 0 : i.preferences;
@@ -3907,9 +3916,9 @@ function sl({}) {
     });
   };
   return /* @__PURE__ */ e.jsxs("div", { className: "space-y-6 px-6 py-2", children: [
-    /* @__PURE__ */ e.jsx(Se, { defaultValue: ["item-3"], type: "multiple", children: /* @__PURE__ */ e.jsxs(q, { value: "item-3", children: [
-      /* @__PURE__ */ e.jsx(V, { children: "Filter on click" }),
-      /* @__PURE__ */ e.jsx(R, { className: "px-2", children: /* @__PURE__ */ e.jsx(De, {}) })
+    /* @__PURE__ */ e.jsx(Ee, { defaultValue: ["item-3"], type: "multiple", children: /* @__PURE__ */ e.jsxs(_, { value: "item-3", children: [
+      /* @__PURE__ */ e.jsx(H, { children: "Filter on click" }),
+      /* @__PURE__ */ e.jsx(B, { className: "px-2", children: /* @__PURE__ */ e.jsx(Ge, {}) })
     ] }) }),
     /* @__PURE__ */ e.jsxs("div", { className: "flex items-center space-x-2", children: [
       /* @__PURE__ */ e.jsx($e, { onCheckedChange: a, id: "allow-download" }),
@@ -3924,7 +3933,7 @@ function sl({}) {
     ] })
   ] });
 }
-const al = /* @__PURE__ */ e.jsxs("div", { className: "space-y-4 font-mono text-xs", children: [
+const tl = /* @__PURE__ */ e.jsxs("div", { className: "space-y-4 font-mono text-xs", children: [
   /* @__PURE__ */ e.jsx("div", { className: "rounded bg-muted px-2 py-1 text-xs", children: "SELECT dimension, cohort, metric FROM table" }),
   /* @__PURE__ */ e.jsxs("div", { children: [
     "See ",
@@ -3940,100 +3949,111 @@ const al = /* @__PURE__ */ e.jsxs("div", { className: "space-y-4 font-mono text-
     ),
     " in the docs."
   ] })
+] }), nl = /* @__PURE__ */ e.jsxs("div", { className: "space-y-4 font-mono text-xs", children: [
+  /* @__PURE__ */ e.jsx("div", { className: "rounded bg-muted px-2 py-1 text-xs", children: "SELECT y-axis, label, range-from, range-to, range-value FROM table" }),
+  /* @__PURE__ */ e.jsxs("div", { children: [
+    "See ",
+    /* @__PURE__ */ e.jsx(
+      "a",
+      {
+        target: "_blank",
+        onClick: (s) => s.stopPropagation(),
+        className: "text-blue-700",
+        href: "https://docs.semaphor.cloud/concepts/visuals#range-chart",
+        children: "example"
+      }
+    ),
+    " in the docs."
+  ] })
 ] });
-function tl() {
+function ll() {
   const s = r((a) => a.card.type);
   function n(a) {
     switch (a) {
       case "stackedBar":
-        return /* @__PURE__ */ e.jsx(el, {});
+        return /* @__PURE__ */ e.jsx(sl, {});
       case "pyramid":
-        return /* @__PURE__ */ e.jsx(
-          Ks,
-          {
-            docContent: al,
-            cardType: a
-          }
-        );
+        return /* @__PURE__ */ e.jsx(os, { docContent: tl, cardType: a });
       case "kpi":
-        return /* @__PURE__ */ e.jsx(Zn, {});
+        return /* @__PURE__ */ e.jsx(Yn, {});
       case "line":
       case "bar":
-        return /* @__PURE__ */ e.jsx(Jn, { cardType: a });
+      case "range":
+        return /* @__PURE__ */ e.jsx(os, { docContent: nl, cardType: a });
       case "pie":
       case "doughnut":
       case "polarArea":
       case "radar":
-        return /* @__PURE__ */ e.jsx(Ks, { cardType: a });
+        return /* @__PURE__ */ e.jsx(os, { cardType: a });
       case "bubble":
       case "scatter":
-        return /* @__PURE__ */ e.jsx(Pn, { cardType: a });
+        return /* @__PURE__ */ e.jsx(Un, { cardType: a });
       case "table":
-        return /* @__PURE__ */ e.jsx(sl, { cardType: a });
+        return /* @__PURE__ */ e.jsx(al, { cardType: a });
       default:
-        return /* @__PURE__ */ e.jsx(Wn, {});
+        return /* @__PURE__ */ e.jsx(Jn, {});
     }
   }
-  return /* @__PURE__ */ e.jsx(bs, { className: "h-full w-full text-sm", children: n(s) });
+  return /* @__PURE__ */ e.jsx(Ns, { className: "h-full w-full text-sm", children: n(s) });
 }
-function nl() {
+function rl() {
   const s = r((n) => n.isShowingVisual);
   return /* @__PURE__ */ e.jsxs(
-    os,
+    hs,
     {
       direction: "vertical",
       className: "min-w-full max-w-lg  min-h-[250px]",
       children: [
         /* @__PURE__ */ e.jsx(
-          Fe,
+          ze,
           {
             role: "query-section",
             className: "flex",
             minSize: 20,
             defaultSize: 40,
-            children: /* @__PURE__ */ e.jsx(In, {})
+            children: /* @__PURE__ */ e.jsx(qn, {})
           }
         ),
-        /* @__PURE__ */ e.jsx(cs, { withHandle: !0, className: "border " }),
+        /* @__PURE__ */ e.jsx(ms, { withHandle: !0, className: "border " }),
         /* @__PURE__ */ e.jsx(
-          Fe,
+          ze,
           {
             className: "pb-1",
             role: "visual-section",
             minSize: 0,
             defaultSize: 60,
-            children: s ? /* @__PURE__ */ e.jsxs(os, { direction: "horizontal", children: [
+            children: s ? /* @__PURE__ */ e.jsxs(hs, { direction: "horizontal", children: [
               /* @__PURE__ */ e.jsx(e.Fragment, { children: /* @__PURE__ */ e.jsx(
-                Fe,
+                ze,
                 {
                   className: "flex min-w-[275px]",
                   minSize: 20,
                   defaultSize: 25,
                   maxSize: 30,
-                  children: /* @__PURE__ */ e.jsx(tl, {})
+                  children: /* @__PURE__ */ e.jsx(ll, {})
                 }
               ) }),
-              /* @__PURE__ */ e.jsx(cs, { className: "border " }),
-              /* @__PURE__ */ e.jsx(Fe, { minSize: 40, defaultSize: 75, maxSize: 100, children: /* @__PURE__ */ e.jsx(Bs, {}) })
-            ] }) : /* @__PURE__ */ e.jsx(Bs, {})
+              /* @__PURE__ */ e.jsx(ms, { className: "border " }),
+              /* @__PURE__ */ e.jsx(ze, { minSize: 40, defaultSize: 75, maxSize: 100, children: /* @__PURE__ */ e.jsx(Hs, {}) })
+            ] }) : /* @__PURE__ */ e.jsx(Hs, {})
           }
         )
       ]
     }
   );
 }
-function ll({ authToken: s, onSave: n, onClose: a }) {
+function il({ authToken: s, onSave: n, onClose: a }) {
   const t = r((l) => l.actions.setOnSave), i = r((l) => l.actions.setOnClose), o = k((l) => l.actions.setAuthToken);
   return K(() => {
     n && t(n), a && i(a);
   }, [n, t, a, i]), K(() => {
     s && s.accessToken && o(s);
-  }, [s, o]), /* @__PURE__ */ e.jsxs(Dt, { className: "rounded-none", role: "editor-panel", children: [
-    /* @__PURE__ */ e.jsx(It, { className: "rounded-none border-r-[1.5px]", children: /* @__PURE__ */ e.jsx(xa, {}) }),
-    /* @__PURE__ */ e.jsx(qt, { children: /* @__PURE__ */ e.jsx(nl, {}) })
+  }, [s, o]), /* @__PURE__ */ e.jsxs(It, { className: "rounded-none", role: "editor-panel", children: [
+    /* @__PURE__ */ e.jsx(qt, { className: "rounded-none border-r-[1.5px]", children: /* @__PURE__ */ e.jsx(xa, {}) }),
+    /* @__PURE__ */ e.jsx(Vt, { children: /* @__PURE__ */ e.jsx(rl, {}) })
   ] });
 }
-function rl() {
+function ol() {
   k((l) => l.selectedCardId);
   const s = k((l) => l.selectedSheetId), { setIsVisualEditing: n } = k((l) => l.actions), a = k((l) => l.isVisualEditing), t = k((l) => l.actions.updateFrame);
   function i(l) {
@@ -4050,33 +4070,33 @@ function rl() {
         block: a,
         hidden: !a
       }),
-      children: /* @__PURE__ */ e.jsx(ll, { onSave: i, onClose: o })
+      children: /* @__PURE__ */ e.jsx(il, { onSave: i, onClose: o })
     }
   );
 }
-function il({
+function cl({
   columns: s,
   tableName: n
 }) {
-  const a = r((u) => u.selectedConnectionId), t = r((u) => u.selectedDatabaseName), i = r((u) => u.selectedSchemaName), o = r((u) => u.selectedTableName), l = k((u) => u.dashboard.filters) || [], c = k((u) => u.actions.addFilter), d = k((u) => u.actions.removeFilter), f = k(
+  const a = r((u) => u.selectedConnectionId), t = r((u) => u.selectedDatabaseName), i = r((u) => u.selectedSchemaName), o = r((u) => u.selectedTableName), l = k((u) => u.dashboard.filters) || [], c = k((u) => u.actions.addFilter), h = k((u) => u.actions.removeFilter), g = k(
     (u) => u.actions.removeFilterValue
   );
   function m(u) {
-    const C = he(u.column_name), h = he(t || ""), x = he(i || ""), g = he(n), j = rs(
+    const N = he(u.column_name), d = he(t || ""), x = he(i || ""), f = he(n), w = cs(
       x,
-      g
-    ), b = `${j}.${C}`;
+      f
+    ), b = `${w}.${N}`;
     console.log(
       "find",
       b,
-      g,
-      h
+      f,
+      d
     );
-    const L = l == null ? void 0 : l.find(
-      (A) => A.column === b && A.table === g && (A.database === h || A.database === t)
+    const E = l == null ? void 0 : l.find(
+      (C) => C.column === b && C.table === f && (C.database === d || C.database === t)
     );
-    if (L)
-      f(L.id), d(L.id);
+    if (E)
+      g(E.id), h(E.id);
     else {
       if (n === "api" && a) {
         c({
@@ -4089,10 +4109,10 @@ function il({
           // database: 'NA',
           connectionId: a,
           operation: "in",
-          sql: Rs(
+          sql: Vs(
             u.data_type,
-            j,
-            C
+            w,
+            N
           )
           //DATE_DATA_TYPES.includes(column.data_type) ? dateSql : sql,
         });
@@ -4100,25 +4120,25 @@ function il({
       }
       c({
         id: We(),
-        column: `${j}.${C}`,
+        column: `${w}.${N}`,
         title: u.column_name,
         dataType: u.data_type,
         table: o || "",
         database: t || "",
         connectionId: a || "",
         operation: "in",
-        sql: Rs(
+        sql: Vs(
           u.data_type,
-          j,
-          C
+          w,
+          N
         )
         //DATE_DATA_TYPES.includes(column.data_type) ? dateSql : sql,
       });
     }
   }
   return /* @__PURE__ */ e.jsx("div", { className: "xbg-red-100 flex-1 basis-0 flex-col overflow-scroll px-3", children: s == null ? void 0 : s.map((u) => {
-    const C = l == null ? void 0 : l.find(
-      (h) => h.column === he(u.column_name) && h.table === o && h.database === t
+    const N = l == null ? void 0 : l.find(
+      (d) => d.column === he(u.column_name) && d.table === o && d.database === t
     );
     return /* @__PURE__ */ e.jsx(
       "div",
@@ -4127,7 +4147,7 @@ function il({
         className: W(
           "group flex cursor-pointer items-center justify-between border border-dashed border-background px-3 py-[6px] text-sm transition-colors hover:bg-muted/50",
           {
-            "bg-muted": C
+            "bg-muted": N
           }
         ),
         children: /* @__PURE__ */ e.jsxs("div", { className: "flex items-center gap-2", children: [
@@ -4139,16 +4159,16 @@ function il({
     );
   }) });
 }
-function ol() {
+function dl() {
   k((n) => n.showFilters);
   const s = k(
     (n) => n.actions.setShowFilters
   );
   return /* @__PURE__ */ e.jsxs("section", { className: "relative flex grow flex-col border-l px-4", children: [
     /* @__PURE__ */ e.jsxs("div", { className: "mt-4 flex items-center justify-between gap-2 px-3", children: [
-      /* @__PURE__ */ e.jsx(B, { className: "text-lg", children: "Filters" }),
+      /* @__PURE__ */ e.jsx(R, { className: "text-lg", children: "Filters" }),
       /* @__PURE__ */ e.jsx(
-        w,
+        z,
         {
           onClick: () => s(!1),
           className: "h-7 w-7 p-0",
@@ -4161,7 +4181,7 @@ function ol() {
       xa,
       {
         ColumnsComponent: (n, a, t) => /* @__PURE__ */ e.jsx(
-          il,
+          cl,
           {
             schemaName: n,
             tableName: a,
@@ -4172,7 +4192,7 @@ function ol() {
     ) })
   ] });
 }
-function cl() {
+function hl() {
   k((a) => a.dashboard);
   const s = k((a) => a.showFilters), n = k((a) => a.isVisualEditing);
   return k((a) => a.bookmarkKey), /* @__PURE__ */ e.jsxs(
@@ -4184,13 +4204,13 @@ function cl() {
         flex: !n
       }),
       children: [
-        /* @__PURE__ */ e.jsx(Vt, {}),
-        s && /* @__PURE__ */ e.jsx("div", { role: "filter-aside-container", className: "flex", children: /* @__PURE__ */ e.jsx(ol, {}) })
+        /* @__PURE__ */ e.jsx(Rt, {}),
+        s && /* @__PURE__ */ e.jsx("div", { role: "filter-aside-container", className: "flex", children: /* @__PURE__ */ e.jsx(dl, {}) })
       ]
     }
   );
 }
-function dl() {
+function ml() {
   const s = k((t) => t.dashboard), n = k((t) => t.actions.setDashboard), a = k(
     (t) => t.showDashboardJSON
   );
@@ -4203,7 +4223,7 @@ function dl() {
         hidden: !a
       }),
       children: /* @__PURE__ */ e.jsx(
-        Rt,
+        _t,
         {
           onChange: (t) => {
             if (t)
@@ -4234,25 +4254,25 @@ function dl() {
     }
   );
 }
-function ul({
+function pl({
   showControls: s = !1,
   showFooter: n = !0,
   ...a
 }) {
-  return /* @__PURE__ */ e.jsxs(_t, { dashboardProps: a, children: [
-    /* @__PURE__ */ e.jsx(Ht, {}),
-    /* @__PURE__ */ e.jsxs(Bt, { children: [
-      /* @__PURE__ */ e.jsx(dl, {}),
-      /* @__PURE__ */ e.jsxs($t, { ...a, children: [
-        s && /* @__PURE__ */ e.jsx(bn, {}),
-        /* @__PURE__ */ e.jsx(rl, {}),
-        /* @__PURE__ */ e.jsx(cl, {})
+  return /* @__PURE__ */ e.jsxs(Ht, { dashboardProps: a, children: [
+    /* @__PURE__ */ e.jsx(Bt, {}),
+    /* @__PURE__ */ e.jsxs($t, { children: [
+      /* @__PURE__ */ e.jsx(ml, {}),
+      /* @__PURE__ */ e.jsxs(Kt, { ...a, children: [
+        s && /* @__PURE__ */ e.jsx(yn, {}),
+        /* @__PURE__ */ e.jsx(ol, {}),
+        /* @__PURE__ */ e.jsx(hl, {})
       ] })
     ] })
   ] });
 }
 export {
-  ul as D,
-  Ge as S,
+  pl as D,
+  Qe as S,
   ua as u
 };