react-semaphor 0.0.166 → 0.0.168

package/dist/chunks/dashboard-plus-TVsHMZ8Y.js

@@ -0,0 +1,4193 @@
+import { P as M, b as S, j as e, Q as is, R as os, U as k, V as cs, W as ds, X as hs, Y as us, Z as _, _ as Q, $ as Bs, J as $s, O as Oe, a0 as At, a1 as Et, a2 as Lt, a3 as Dt, a4 as It, a5 as qt, a6 as Os, a7 as Ee, a8 as Qe, a9 as $e, T as We, e as ms, g as Pe, aa as xs, ab as ps, f as W, ac as fs, ad as gs, ae as js, af as Ke, ag as me, G as i, ah as Ie, ai as qe, aj as Vt, ak as Ve, w as Ks, v as Us, t as oe, al as Rt, r as _t, N as Gs, s as Ht, am as Bt, B as $t, an as Js, L as Le, S as bs, z as Kt, n as zs, A as as, u as Ye, ao as ye, ap as we, aq as Ut, ar as Gt, as as Jt, at as Qs, au as Ws, av as Ps, aw as Ys, ax as Xs, ay as Qt, az as Zs, aA as et, aB as Wt, aC as Pt, aD as Yt, aE as Xt, aF as Zt, aG as ns, aH as ea, aI as Be, aJ as Ms, aK as sa, aL as ta, aM as aa, aN as na, aO as ra, aP as ts, aQ as la, aR as Ts, aS as ia, aT as As, aU as oa, aV as ca, aW as da, aX as st, l as ha, C as ua, E as Es, d as ma, h as xa, i as pa, o as fa, aY as ga, m as ja, aZ as ba, a_ as ya, a$ as va, b0 as Ls, b1 as Na, b2 as Ds, b3 as Is, K as Ca, b4 as tt, b5 as Sa, b6 as at, b7 as Ue, b8 as nt, b9 as ka, ba as wa, bb as Fa, bc as Oa, bd as za, be as Ma, bf as ve, bg as q, bh as V, bi as ys, bj as R, bk as Ta, bl as Aa, bm as Ea, bn as qs, bo as La, bp as Da, bq as Ia, br as qa, bs as Va } from "./index-QmXfLUnb.js";
+import ce, { useState as z, useEffect as $, useMemo as Ra, useRef as De } 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 _a = M("Activity", [
+  [
+    "path",
+    {
+      d: "M22 12h-2.48a2 2 0 0 0-1.93 1.46l-2.35 8.36a.25.25 0 0 1-.48 0L9.24 2.18a.25.25 0 0 0-.48 0l-2.35 8.36A2 2 0 0 1 4.49 12H2",
+      key: "169zse"
+    }
+  ]
+]);
+/**
+ * @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 Ha = M("AreaChart", [
+  ["path", { d: "M3 3v18h18", key: "1s2lah" }],
+  ["path", { d: "M7 12v5h12V8l-5 5-4-4Z", key: "zxz28u" }]
+]);
+/**
+ * @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 vs = M("BarChart4", [
+  ["path", { d: "M3 3v18h18", key: "1s2lah" }],
+  ["path", { d: "M13 17V9", key: "1fwyjl" }],
+  ["path", { d: "M18 17V5", key: "sfb6ij" }],
+  ["path", { d: "M8 17v-3", key: "17ska0" }]
+]);
+/**
+ * @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 Ba = M("Bookmark", [
+  ["path", { d: "m19 21-7-4-7 4V5a2 2 0 0 1 2-2h10a2 2 0 0 1 2 2v16z", key: "1fy3hk" }]
+]);
+/**
+ * @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 $a = M("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" }]
+]);
+/**
+ * @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 Ka = M("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" }]
+]);
+/**
+ * @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 Ua = M("Eraser", [
+  [
+    "path",
+    {
+      d: "m7 21-4.3-4.3c-1-1-1-2.5 0-3.4l9.6-9.6c1-1 2.5-1 3.4 0l5.6 5.6c1 1 1 2.5 0 3.4L13 21",
+      key: "182aya"
+    }
+  ],
+  ["path", { d: "M22 21H7", key: "t4ddhn" }],
+  ["path", { d: "m5 11 9 9", key: "1mo9qw" }]
+]);
+/**
+ * @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 rt = M("Filter", [
+  ["polygon", { points: "22 3 2 3 10 12.46 10 19 14 21 14 12.46 22 3", key: "1yg77f" }]
+]);
+/**
+ * @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 Ga = M("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" }],
+  ["path", { d: "M2.5 13 5 7c.7-1.3 1.4-2 3-2", key: "1hm1gs" }],
+  ["path", { d: "M21.5 13 19 7c-.7-1.3-1.5-2-3-2", key: "1r31ai" }]
+]);
+/**
+ * @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 Ja = M("GripVertical", [
+  ["circle", { cx: "9", cy: "12", r: "1", key: "1vctgf" }],
+  ["circle", { cx: "9", cy: "5", r: "1", key: "hp0tcf" }],
+  ["circle", { cx: "9", cy: "19", r: "1", key: "fkjjf6" }],
+  ["circle", { cx: "15", cy: "12", r: "1", key: "1tmaij" }],
+  ["circle", { cx: "15", cy: "5", r: "1", key: "19l28e" }],
+  ["circle", { cx: "15", cy: "19", r: "1", key: "f4zoj3" }]
+]);
+/**
+ * @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 Qa = M("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" }],
+  [
+    "path",
+    {
+      d: "m21.5 11.5-1.914-1.914A2 2 0 0 1 19 8.172V7l-2.26-2.26a6 6 0 0 0-4.202-1.756L9 2.96l.92.82A6.18 6.18 0 0 1 12 8.4V10l2 2h1.172a2 2 0 0 1 1.414.586L18.5 14.5",
+      key: "b7pghm"
+    }
+  ]
+]);
+/**
+ * @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 Wa = M("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" }],
+  ["line", { x1: "16", x2: "14", y1: "3", y2: "21", key: "weycgp" }]
+]);
+/**
+ * @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 Pa = M("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" }]
+]);
+/**
+ * @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 Ns = M("LineChart", [
+  ["path", { d: "M3 3v18h18", key: "1s2lah" }],
+  ["path", { d: "m19 9-5 5-4-4-3 3", key: "2osh9i" }]
+]);
+/**
+ * @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 Ya = M("ListEnd", [
+  ["path", { d: "M16 12H3", key: "1a2rj7" }],
+  ["path", { d: "M16 6H3", key: "1wxfjs" }],
+  ["path", { d: "M10 18H3", key: "13769t" }],
+  ["path", { d: "M21 6v10a2 2 0 0 1-2 2h-5", key: "ilrcs8" }],
+  ["path", { d: "m16 16-2 2 2 2", key: "kkc6pm" }]
+]);
+/**
+ * @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 Xa = M("ListStart", [
+  ["path", { d: "M16 12H3", key: "1a2rj7" }],
+  ["path", { d: "M16 18H3", key: "12xzn7" }],
+  ["path", { d: "M10 6H3", key: "lf8lx7" }],
+  ["path", { d: "M21 18V8a2 2 0 0 0-2-2h-5", key: "1hghli" }],
+  ["path", { d: "m16 8-2-2 2-2", key: "160uvd" }]
+]);
+/**
+ * @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 Za = M("ListX", [
+  ["path", { d: "M11 12H3", key: "51ecnj" }],
+  ["path", { d: "M16 6H3", key: "1wxfjs" }],
+  ["path", { d: "M16 18H3", key: "12xzn7" }],
+  ["path", { d: "m19 10-4 4", key: "1tz659" }],
+  ["path", { d: "m15 10 4 4", key: "1n7nei" }]
+]);
+/**
+ * @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 en = M("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" }],
+  ["path", { d: "M16 10h.01", key: "1m94wz" }]
+]);
+/**
+ * @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 sn = M("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" }],
+  ["path", { d: "M5 16v-3a1 1 0 0 1 1-1h12a1 1 0 0 1 1 1v3", key: "1jsf9p" }],
+  ["path", { d: "M12 12V8", key: "2874zd" }]
+]);
+/**
+ * @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 lt = M("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" }]
+]);
+/**
+ * @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 it = M("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" }]
+]);
+/**
+ * @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 tn = M("Play", [
+  ["polygon", { points: "6 3 20 12 6 21 6 3", key: "1oa8hb" }]
+]);
+/**
+ * @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 an = M("Plug2", [
+  ["path", { d: "M9 2v6", key: "17ngun" }],
+  ["path", { d: "M15 2v6", key: "s7yy2p" }],
+  ["path", { d: "M12 17v5", key: "bb1du9" }],
+  ["path", { d: "M5 8h14", key: "pcz4l3" }],
+  ["path", { d: "M6 11V8h12v3a6 6 0 1 1-12 0v0Z", key: "nd4hoy" }]
+]);
+/**
+ * @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 ot = M("Plus", [
+  ["path", { d: "M5 12h14", key: "1ays0h" }],
+  ["path", { d: "M12 5v14", key: "s699le" }]
+]);
+/**
+ * @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 nn = M("Save", [
+  [
+    "path",
+    {
+      d: "M15.2 3a2 2 0 0 1 1.4.6l3.8 3.8a2 2 0 0 1 .6 1.4V19a2 2 0 0 1-2 2H5a2 2 0 0 1-2-2V5a2 2 0 0 1 2-2z",
+      key: "1c8476"
+    }
+  ],
+  ["path", { d: "M17 21v-7a1 1 0 0 0-1-1H8a1 1 0 0 0-1 1v7", key: "1ydtos" }],
+  ["path", { d: "M7 3v4a1 1 0 0 0 1 1h7", key: "t51u73" }]
+]);
+/**
+ * @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 ct = M("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" }],
+  ["circle", { cx: "7.5", cy: "16.5", r: ".5", fill: "currentColor", key: "nkw3mc" }],
+  ["circle", { cx: "17.5", cy: "14.5", r: ".5", fill: "currentColor", key: "1gjh6j" }],
+  ["path", { d: "M3 3v18h18", key: "1s2lah" }]
+]);
+/**
+ * @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 rn = M("ShieldQuestion", [
+  [
+    "path",
+    {
+      d: "M20 13c0 5-3.5 7.5-7.66 8.95a1 1 0 0 1-.67-.01C7.5 20.5 4 18 4 13V6a1 1 0 0 1 1-1c2 0 4.5-1.2 6.24-2.72a1.17 1.17 0 0 1 1.52 0C14.51 3.81 17 5 19 5a1 1 0 0 1 1 1z",
+      key: "oel41y"
+    }
+  ],
+  ["path", { d: "M9.1 9a3 3 0 0 1 5.82 1c0 2-3 3-3 3", key: "mhlwft" }],
+  ["path", { d: "M12 17h.01", key: "p32p05" }]
+]);
+/**
+ * @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 Cs = M("Table", [
+  ["path", { d: "M12 3v18", key: "108xh3" }],
+  ["rect", { width: "18", height: "18", x: "3", y: "3", rx: "2", key: "afitv7" }],
+  ["path", { d: "M3 9h18", key: "1pudct" }],
+  ["path", { d: "M3 15h18", key: "5xshup" }]
+]);
+/**
+ * @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 ln = M("Tag", [
+  [
+    "path",
+    {
+      d: "M12.586 2.586A2 2 0 0 0 11.172 2H4a2 2 0 0 0-2 2v7.172a2 2 0 0 0 .586 1.414l8.704 8.704a2.426 2.426 0 0 0 3.42 0l6.58-6.58a2.426 2.426 0 0 0 0-3.42z",
+      key: "vktsd0"
+    }
+  ],
+  ["circle", { cx: "7.5", cy: "7.5", r: ".5", fill: "currentColor", key: "kqv944" }]
+]);
+/**
+ * @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 on = M("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" }]
+]);
+/**
+ * @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 cn = M("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" }]
+]);
+/**
+ * @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 dn = M("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 hn() {
+  const [s, n] = z(""), [t, a] = z(!1), [l, o] = z(!1), r = S((c) => c.dashboard);
+  function d() {
+    const c = $s(r), m = Oe(r.id), h = JSON.parse(localStorage.getItem(m) || "[]");
+    if (h.some(
+      (g) => g.name === s
+    )) {
+      a(!0);
+      return;
+    }
+    h.push({
+      name: s,
+      template: c
+    }), localStorage.setItem(m, JSON.stringify(h)), o(!1);
+  }
+  return /* @__PURE__ */ e.jsxs(is, { open: l, onOpenChange: o, children: [
+    /* @__PURE__ */ e.jsx(os, { asChild: !0, children: /* @__PURE__ */ e.jsxs(
+      k,
+      {
+        variant: "outline",
+        className: "h-7 p-2",
+        size: "sm",
+        children: [
+          /* @__PURE__ */ e.jsx(ot, { className: " mr-2 h-4 w-4", strokeWidth: 1.5 }),
+          "Add Lens"
+        ]
+      }
+    ) }),
+    /* @__PURE__ */ e.jsxs(cs, { className: "sm:max-w-[425px]", children: [
+      /* @__PURE__ */ e.jsxs(ds, { children: [
+        /* @__PURE__ */ e.jsx(hs, { children: "Add a Lens" }),
+        /* @__PURE__ */ e.jsx(us, { 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(_, { className: "text-right", children: "Name" }),
+        /* @__PURE__ */ e.jsx(
+          Q,
+          {
+            value: s,
+            onChange: (c) => {
+              t && a(!1), n(c.target.value);
+            },
+            id: "name",
+            className: "col-span-7 focus-visible:ring-0 focus-visible:ring-ring focus-visible:ring-offset-0"
+          }
+        )
+      ] }) }),
+      t && /* @__PURE__ */ e.jsx("p", { className: "text-sm", children: "The bookmark name already exists. Use a differnet name." }),
+      /* @__PURE__ */ e.jsx(Bs, { children: /* @__PURE__ */ e.jsx(
+        k,
+        {
+          variant: "outline",
+          type: "submit",
+          disabled: !s,
+          onClick: d,
+          children: "Save"
+        }
+      ) })
+    ] })
+  ] });
+}
+function un() {
+  const [s, n] = z(!1), [t, a] = z(""), l = S((p) => p.dashboard), o = S((p) => p.bookmarkKey), [r, d] = z([]), c = S((p) => p.actions.setDashboard), m = S(
+    (p) => p.actions.setFilterValues
+  ), h = S(
+    (p) => p.actions.setBookmarkKey
+  );
+  $(() => {
+    const p = Oe(l.id), j = JSON.parse(localStorage.getItem(p) || "[]");
+    d(j);
+    const C = j.find(
+      (v) => v.default
+    );
+    C && C.name === o && a(C.name);
+  }, [s, l, o]);
+  function u(p) {
+    if (p === t)
+      return;
+    const j = r.find((v) => v.name === p), C = j == null ? void 0 : j.template;
+    C && (c(C), m(j.filterValues || []), h(p === "Original" ? "" : p)), a(p);
+  }
+  function g(p) {
+    const j = Oe(l.id), v = JSON.parse(localStorage.getItem(j) || "[]").filter(
+      (y) => y.name !== p
+    );
+    localStorage.setItem(j, JSON.stringify(v)), d(v);
+  }
+  return /* @__PURE__ */ e.jsxs(At, { open: s, onOpenChange: n, children: [
+    /* @__PURE__ */ e.jsx(Et, { asChild: !0, children: /* @__PURE__ */ e.jsx(k, { variant: "outline", className: "h-7 p-2", children: /* @__PURE__ */ e.jsx(Ga, { className: "h-4 w-4", strokeWidth: 1.5 }) }) }),
+    /* @__PURE__ */ e.jsxs(Lt, { className: "w-56", children: [
+      /* @__PURE__ */ e.jsx(Dt, { children: "Lenses" }),
+      /* @__PURE__ */ e.jsx(It, {}),
+      /* @__PURE__ */ e.jsxs(
+        qt,
+        {
+          value: t,
+          onValueChange: u,
+          children: [
+            /* @__PURE__ */ e.jsx(Os, { value: "Original", children: "Original" }),
+            r.filter((p) => p.name != "Original").map((p, j) => /* @__PURE__ */ e.jsxs(
+              Os,
+              {
+                className: "xbg-red-100 flex justify-between",
+                value: p.name,
+                defaultChecked: p.name === o,
+                children: [
+                  /* @__PURE__ */ e.jsx("p", { children: p.name }),
+                  /* @__PURE__ */ e.jsx(
+                    Ee,
+                    {
+                      onClick: (C) => {
+                        C.preventDefault(), g(p.name);
+                      },
+                      className: "h-3 w-3 hover:cursor-pointer",
+                      strokeWidth: 1.5
+                    }
+                  )
+                ]
+              },
+              j
+            ))
+          ]
+        }
+      )
+    ] })
+  ] });
+}
+function mn() {
+  const [s, n] = z(!1), t = S((o) => o.dashboard), a = S((o) => o.bookmarkKey);
+  $(() => {
+    if (!a) {
+      n(!1);
+      return;
+    }
+    const o = Oe(t.id), d = JSON.parse(
+      localStorage.getItem(o) || "[]"
+    ).find(
+      (c) => c.name === a
+    );
+    n(d ? d.default : !1);
+  }, [a, t.id]);
+  function l(o) {
+    if (n(o), !a)
+      return;
+    const r = Oe(t.id), c = JSON.parse(
+      localStorage.getItem(r) || "[]"
+    ).map((m) => (m.name === a ? m.default = o : m.default = !1, m));
+    console.log(c), localStorage.setItem(r, JSON.stringify(c));
+  }
+  return /* @__PURE__ */ e.jsxs("div", { className: "flex items-center space-x-2", children: [
+    /* @__PURE__ */ e.jsx(
+      Qe,
+      {
+        checked: s,
+        onCheckedChange: l,
+        id: "terms"
+      }
+    ),
+    /* @__PURE__ */ e.jsx(
+      "label",
+      {
+        htmlFor: "terms",
+        className: "text-sm font-medium leading-none peer-disabled:cursor-not-allowed peer-disabled:opacity-70",
+        children: "Set as default"
+      }
+    )
+  ] });
+}
+function xn() {
+  const s = S((y) => y.bookmarkKey), n = S((y) => y.dashboard);
+  S((y) => y.selectedSheetId);
+  const t = S(
+    (y) => y.isDashboardEditing
+  ), a = S((y) => y.filterValues), l = S((y) => y.isVisualEditing), o = S((y) => y.showFilters);
+  S(
+    (y) => y.showDashboardJSON
+  );
+  const r = S((y) => y.onSaveFunction), d = S(
+    (y) => y.actions.setShowFilters
+  ), { addFrame: c, setSelectedFrameId: m } = S(
+    (y) => y.actions
+  ), { getSelectedSheet: h, setIsDashboardEditing: u, setShowDashboardJSON: g } = S((y) => y.actions), p = h(), j = () => {
+    if (!t || !p)
+      return;
+    const y = {
+      id: $e(),
+      title: "Title",
+      description: "Description",
+      preferences: {
+        onClickFilter: [
+          {
+            columnIndex: 0,
+            expression: ""
+          }
+        ]
+      },
+      type: "bar",
+      sql: "select COUNT(*) from YOUR_TABLE",
+      data: []
+    }, D = {
+      id: $e(),
+      cards: [y],
+      activeCardId: y.id
+    };
+    c(p.id, D), m(D.id);
+  }, C = () => {
+    u(!0);
+  };
+  function v() {
+    if (!s || s === "")
+      return;
+    const y = $s(n), D = Oe(n.id), A = JSON.parse(localStorage.getItem(D) || "[]"), f = A.findIndex(
+      (O) => O.name === s
+    );
+    f !== -1 ? A[f] = {
+      name: s,
+      template: y,
+      default: A[f].default,
+      filterValues: a
+    } : A.push({
+      name: s,
+      template: y,
+      filterValues: a
+    }), localStorage.setItem(D, JSON.stringify(A)), r == null || r(y);
+  }
+  return l ? null : /* @__PURE__ */ e.jsxs(
+    "div",
+    {
+      className: "flex items-center justify-between gap-2 px-2 pt-2",
+      role: "dashboard-controls",
+      children: [
+        !l && /* @__PURE__ */ e.jsxs("div", { className: "flex items-center gap-3", children: [
+          /* @__PURE__ */ e.jsx(_, { children: s }),
+          !!s && /* @__PURE__ */ e.jsxs(e.Fragment, { children: [
+            /* @__PURE__ */ e.jsx("span", { className: "text-muted-foreground", children: "|" }),
+            /* @__PURE__ */ e.jsx(mn, {})
+          ] })
+        ] }),
+        /* @__PURE__ */ e.jsxs("div", { className: "flex gap-2", children: [
+          t && !l && /* @__PURE__ */ e.jsx(hn, {}),
+          !l && /* @__PURE__ */ e.jsx(un, {}),
+          t && !l && /* @__PURE__ */ e.jsxs(
+            k,
+            {
+              variant: "outline",
+              className: "h-7 p-2",
+              size: "sm",
+              disabled: !t,
+              onClick: j,
+              children: [
+                /* @__PURE__ */ e.jsx(ot, { className: "mr-2 h-4 w-4", strokeWidth: 1.5 }),
+                "Add Frame"
+              ]
+            }
+          ),
+          !t && /* @__PURE__ */ e.jsx(
+            k,
+            {
+              variant: "outline",
+              className: "h-7 p-2",
+              onClick: C,
+              size: "sm",
+              children: /* @__PURE__ */ e.jsx(lt, { className: "h-4 w-4", strokeWidth: 1.5 })
+            }
+          ),
+          t && !l && /* @__PURE__ */ e.jsx(
+            k,
+            {
+              variant: "outline",
+              role: "close",
+              className: "h-7 p-2",
+              onClick: () => {
+                u(!1), g(!1);
+              },
+              size: "sm",
+              children: /* @__PURE__ */ e.jsx(Ee, { className: "h-4 w-4", strokeWidth: 1.5 })
+            }
+          ),
+          t && !l && /* @__PURE__ */ e.jsx(
+            k,
+            {
+              className: "h-7 p-2",
+              variant: "outline",
+              onClick: v,
+              size: "sm",
+              children: /* @__PURE__ */ e.jsx(nn, { className: "h-4 w-4", strokeWidth: 1.5 })
+            }
+          ),
+          !o && !l && t && /* @__PURE__ */ e.jsx(
+            k,
+            {
+              className: "h-7 p-2",
+              variant: "outline",
+              onClick: () => d(!0),
+              size: "sm",
+              children: /* @__PURE__ */ e.jsx(rt, { className: "h-4 w-4", strokeWidth: 1.5 })
+            }
+          ),
+          !l && t && !1,
+          !l && !1
+        ] })
+      ]
+    }
+  );
+}
+function He({
+  title: s,
+  items: n,
+  value: t,
+  isLoading: a,
+  isError: l,
+  connectionTooltip: o,
+  onChange: r,
+  className: d,
+  showIcon: c = !0,
+  disabled: m = !1
+}) {
+  const h = a ? "Loading..." : l ? "Error" : t;
+  function u() {
+    if (s === "Connection")
+      return /* @__PURE__ */ e.jsx(an, { className: "size-4 rotate-90" });
+    if (s === "Database")
+      return /* @__PURE__ */ e.jsx(Ka, { className: "size-4" });
+    if (s === "Schema")
+      return /* @__PURE__ */ e.jsx(sn, { className: "size-4" });
+    if (s === "Table")
+      return /* @__PURE__ */ e.jsx(Cs, { className: "size-4" });
+  }
+  return /* @__PURE__ */ e.jsxs("div", { className: "flex items-center gap-2", children: [
+    c && /* @__PURE__ */ e.jsx("div", { className: "shrink-0", children: o ? /* @__PURE__ */ e.jsxs(We, { children: [
+      /* @__PURE__ */ e.jsx(ms, { children: u() }),
+      /* @__PURE__ */ e.jsx(Pe, { className: "text-xs", align: "start", children: o })
+    ] }) : u() }),
+    /* @__PURE__ */ e.jsxs(xs, { disabled: m, value: h, onValueChange: r, children: [
+      /* @__PURE__ */ e.jsx(
+        ps,
+        {
+          className: W(
+            "h-9 w-[190px] focus:ring-1 focus:ring-offset-0",
+            d
+          ),
+          children: /* @__PURE__ */ e.jsx(
+            fs,
+            {
+              placeholder: a ? "Loading..." : l ? "Error" : `Select ${s}`
+            }
+          )
+        }
+      ),
+      /* @__PURE__ */ e.jsx(gs, { children: /* @__PURE__ */ e.jsxs(js, { children: [
+        a ? /* @__PURE__ */ e.jsx(Ke, { children: "Loading..." }) : /* @__PURE__ */ e.jsx(Ke, { children: s }),
+        /* @__PURE__ */ e.jsx(e.Fragment, { children: n && n.map((g, p) => /* @__PURE__ */ e.jsx(me, { value: g.id, children: g.name }, p)) }),
+        (a || l) && /* @__PURE__ */ e.jsx(me, { value: h, children: h })
+      ] }) })
+    ] })
+  ] });
+}
+function pn({ column: s }) {
+  const [n, t] = z(!1), a = i((h) => h.selectedTableName), l = i(
+    (h) => h.selectedSchemaName
+  ), o = i((h) => h.sqlGen), r = i((h) => h.actions.setSqlGen), d = i((h) => h.actions.setCardSql), c = i((h) => h.actions.setRunSql);
+  function m(h, u) {
+    const g = Ks(h, o, u);
+    r(g);
+    const p = Us(
+      g,
+      oe(l || ""),
+      oe(a)
+    );
+    p && (d(p), c(!0)), t(!1);
+  }
+  return /* @__PURE__ */ e.jsxs(Ie, { open: n, onOpenChange: t, children: [
+    /* @__PURE__ */ e.jsx(qe, { asChild: !0, children: /* @__PURE__ */ e.jsx(Vt, { className: "h-4 w-4 cursor-pointer text-foreground/40" }) }),
+    /* @__PURE__ */ e.jsx(
+      Ve,
+      {
+        align: "center",
+        className: "w-18 rounded-md p-0 shadow-none",
+        children: /* @__PURE__ */ e.jsxs("ul", { className: "text-xs", children: [
+          /* @__PURE__ */ e.jsx(
+            "li",
+            {
+              onClick: () => m(s, "COUNT"),
+              className: "cursor-pointer p-1 px-3 transition-colors hover:bg-muted",
+              children: "Count"
+            }
+          ),
+          /* @__PURE__ */ e.jsx(
+            "li",
+            {
+              onClick: () => m(s, "AVG"),
+              className: "cursor-pointer p-1 px-3 transition-colors hover:bg-muted",
+              children: "Avg"
+            }
+          ),
+          /* @__PURE__ */ e.jsx(
+            "li",
+            {
+              onClick: () => m(s, "SUM"),
+              className: "cursor-pointer p-1 px-3 transition-colors hover:bg-muted",
+              children: "Sum"
+            }
+          ),
+          /* @__PURE__ */ e.jsx(
+            "li",
+            {
+              onClick: () => m(s, "MAX"),
+              className: "cursor-pointer p-1 px-3 transition-colors hover:bg-muted",
+              children: "Max"
+            }
+          ),
+          /* @__PURE__ */ e.jsx(
+            "li",
+            {
+              onClick: () => m(s, "MIN"),
+              className: "cursor-pointer p-1 px-3 transition-colors hover:bg-muted",
+              children: "Min"
+            }
+          )
+        ] })
+      }
+    )
+  ] });
+}
+function dt({ column: s }) {
+  return /* @__PURE__ */ e.jsxs(We, { children: [
+    /* @__PURE__ */ e.jsx(Rt, { asChild: !0, children: _t.includes(s.data_type.toLowerCase()) ? (
+      // <span className=" font-thin">T</span>
+      /* @__PURE__ */ e.jsx(cn, { className: "size-3" })
+    ) : Gs.includes(s.data_type.toLowerCase()) ? (
+      //
+      /* @__PURE__ */ e.jsx(Wa, { className: "size-3" })
+    ) : Ht.includes(s.data_type.toLowerCase()) ? /* @__PURE__ */ e.jsx(Bt, { className: "size-3" }) : $t.includes(s.data_type.toLowerCase()) ? /* @__PURE__ */ e.jsx(on, { className: "size-3" }) : /* @__PURE__ */ e.jsx(rn, { className: "size-3" }) }),
+    /* @__PURE__ */ e.jsx(Pe, { children: /* @__PURE__ */ e.jsx("p", { className: "font-mono text-xs", children: s.data_type }) })
+  ] });
+}
+function fn({
+  schemaName: s,
+  tableName: n,
+  columns: t,
+  status: a
+}) {
+  const l = i((f) => f.sqlGen), o = i(
+    (f) => f.selectedConnectionId
+  ), r = i(
+    (f) => f.selectedDatabaseName
+  ), d = i(
+    (f) => f.selectedSchemaName
+  ), c = i((f) => f.selectedTableName), m = S(
+    (f) => f.dashboard.aiScopeTables
+  ), { setAIScopeTables: h } = S((f) => f.actions), u = i((f) => f.actions.setRunSql), g = i((f) => f.actions.setSqlGen), p = i(
+    (f) => f.actions.setIsShowingVisual
+  ), j = i((f) => f.actions.setCardSql), { connectionType: C } = ht();
+  function v(f) {
+    const O = Ks(f, l);
+    g(O);
+    const T = Us(O, oe(s), oe(n));
+    T && (j(T), u(!0));
+  }
+  function y(f) {
+    if (f === !0 && c && o) {
+      const O = {
+        connectinonId: o,
+        connectionType: C,
+        databaseName: r,
+        schemaName: d,
+        tableName: c
+      }, E = [...m || [], O].filter(
+        (U, Z, G) => G.findIndex(
+          (H) => H.connectinonId === U.connectinonId && H.tableName === U.tableName
+        ) === Z
+      );
+      h(E);
+    } else {
+      const O = (m || []).filter(
+        (T) => T.connectinonId !== o && T.tableName !== c
+      );
+      h(O);
+    }
+  }
+  function D() {
+    let O = as(s, n);
+    ((E) => E.charAt(0) === E.charAt(0).toUpperCase())(n) && (O = `"${n}"`), p(!1), j(`SELECT * FROM ${O} LIMIT 10`), u(!0);
+  }
+  function A() {
+    let O = as(s, n);
+    ((E) => E.charAt(0) === E.charAt(0).toUpperCase())(n) && (O = `"${n}"`), p(!1), j(`SELECT COUNT(*) FROM ${O}`), u(!0);
+  }
+  return /* @__PURE__ */ e.jsxs("div", { className: "flex grow flex-col space-y-4 px-6", children: [
+    /* @__PURE__ */ e.jsxs("div", { className: "flex items-center gap-2", children: [
+      /* @__PURE__ */ e.jsx(
+        Js,
+        {
+          title: "Add to AI Scope",
+          onPressedChange: y,
+          variant: "outline",
+          className: "h-9 px-2",
+          children: /* @__PURE__ */ e.jsx(Ba, { className: "size-4" })
+        }
+      ),
+      /* @__PURE__ */ e.jsxs(
+        k,
+        {
+          disabled: a !== "Success",
+          onClick: D,
+          size: "sm",
+          variant: "secondary",
+          className: "flex w-full",
+          children: [
+            a !== "Success" ? /* @__PURE__ */ e.jsx(Le, { className: "mr-2 h-4 w-4 animate-spin text-foreground/50" }) : null,
+            "Top 10"
+          ]
+        }
+      ),
+      /* @__PURE__ */ e.jsxs(
+        k,
+        {
+          disabled: a !== "Success",
+          onClick: A,
+          size: "sm",
+          variant: "secondary",
+          className: "flex w-full",
+          children: [
+            a !== "Success" ? /* @__PURE__ */ e.jsx(Le, { className: "mr-2 h-4 w-4 animate-spin text-foreground/50" }) : null,
+            "Count"
+          ]
+        }
+      )
+    ] }),
+    /* @__PURE__ */ e.jsxs(
+      bs,
+      {
+        className: "flex-1 basis-0 overflow-y-auto border-b border-t border-muted py-3",
+        children: [
+          t == null ? void 0 : t.map((f) => /* @__PURE__ */ e.jsxs(
+            "div",
+            {
+              onClick: () => v(f),
+              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": Kt(f, l)
+                }
+              ),
+              children: [
+                /* @__PURE__ */ e.jsxs("div", { className: "flex items-center space-x-2", children: [
+                  /* @__PURE__ */ e.jsx(dt, { column: f }),
+                  /* @__PURE__ */ e.jsx("span", { children: f.column_name })
+                ] }),
+                Gs.includes(f.data_type) && /* @__PURE__ */ e.jsx(
+                  "div",
+                  {
+                    onClick: (O) => O.stopPropagation(),
+                    className: "flex items-center justify-end",
+                    children: /* @__PURE__ */ e.jsx(pn, { column: f })
+                  }
+                )
+              ]
+            },
+            f.column_name
+          )),
+          /* @__PURE__ */ e.jsx(zs, { orientation: "vertical" }),
+          /* @__PURE__ */ e.jsx(zs, { orientation: "horizontal" })
+        ]
+      }
+    )
+  ] });
+}
+function ht(s, n) {
+  var Xe, ge, _e, Te;
+  let t = Ra(() => [], []);
+  const a = Ye().authToken || s, l = i(
+    (N) => N.selectedConnectionId
+  ), o = i(
+    (N) => N.selectedDatabaseName
+  ), r = i(
+    (N) => N.selectedSchemaName
+  ), d = i((N) => N.selectedTableName), c = i(
+    (N) => N.actions.setCurrentColumns
+  ), m = i(
+    (N) => N.actions.setSelectedConnectionId
+  ), h = i(
+    (N) => N.actions.setSelectedDatabaseName
+  ), u = i(
+    (N) => N.actions.setSelectedSchemaName
+  ), g = i(
+    (N) => N.actions.setSelectedTableName
+  ), p = i((N) => N.actions.setCardSql);
+  function j(N) {
+    return l && o && r && o !== "NA" ? !0 : l && N === "API" ? !1 : !!(l && N === "S3");
+  }
+  function C(N) {
+    return !!(l && o && o !== "NA" && r && d || l && (N === "S3" || N === "API"));
+  }
+  function v(N) {
+    return l && N ? !(N === "API" || N === "S3") : !1;
+  }
+  const {
+    data: y,
+    isLoading: D,
+    isError: A
+  } = ye({
+    queryKey: ["connections"],
+    queryFn: () => we(
+      "https://semaphor.cloud/api/v1/connections",
+      (a == null ? void 0 : a.accessToken) || ""
+    ),
+    enabled: !!(a != null && a.accessToken)
+    // Only fetch if authToken is present
+  }), f = y == null ? void 0 : y.connections.find(
+    (N) => N.id === l
+  ), O = f == null ? void 0 : f.type, T = (f == null ? void 0 : f.type) === "API" || (f == null ? void 0 : f.type) === "S3", {
+    data: E,
+    isLoading: U,
+    isFetching: Z,
+    isError: G,
+    refetch: H
+  } = ye({
+    queryKey: ["databases", l],
+    queryFn: () => we(
+      "https://semaphor.cloud/api/v1/databases",
+      (a == null ? void 0 : a.accessToken) || "",
+      {
+        connection_id: l
+      }
+    ),
+    enabled: v(O)
+    // !!selectedConnectionId && !isNonDbConnection, //currentConnection?.type !== 'API', // Only fetch if connectionId is present
+  }), {
+    data: I,
+    isLoading: ee,
+    isFetching: P,
+    isError: se,
+    refetch: X
+  } = ye({
+    queryKey: ["schemas", l, o],
+    queryFn: () => we(
+      "https://semaphor.cloud/api/v1/schemas",
+      (a == null ? void 0 : a.accessToken) || "",
+      {
+        connection_id: l,
+        database_name: o
+      }
+    ),
+    enabled: !!l && !!o && !T && o !== "NA"
+    //currentConnection?.type !== 'API', // Only fetch if connectionId and database is present
+  }), {
+    data: w,
+    isLoading: F,
+    isFetching: b,
+    isError: L,
+    refetch: K
+  } = ye({
+    queryKey: [
+      "tables",
+      l,
+      o,
+      r
+    ],
+    queryFn: () => we(
+      "https://semaphor.cloud/api/v1/tables",
+      (a == null ? void 0 : a.accessToken) || "",
+      {
+        connection_id: l,
+        database_name: o,
+        schema_name: r
+      }
+    ),
+    enabled: j(O)
+  }), {
+    data: B,
+    isLoading: de,
+    isFetching: te,
+    isError: xe
+  } = ye({
+    queryKey: [
+      "columns",
+      l,
+      o,
+      r,
+      d
+    ],
+    queryFn: () => we(
+      "https://semaphor.cloud/api/v1/columns",
+      (a == null ? void 0 : a.accessToken) || "",
+      {
+        connection_id: l,
+        database_name: o,
+        schema_name: r,
+        table_name: d
+      }
+    ),
+    enabled: C(O)
+    // (!!selectedConnectionId &&
+    //   !!selectedDatabaseName &&
+    //   !!selectedSchemaName &&
+    //   !!selectedTableName) ||
+    // isNonDbConnection,
+    //currentConnection?.type === 'API',
+    // && currentConnection?.type !== 'API', // Only fetch if connectionId, database, and table is present
+  });
+  $(() => {
+    c(t);
+  }, [B, c, t]), $(() => {
+  }, [
+    T,
+    p,
+    g,
+    u,
+    h,
+    f
+  ]);
+  const pe = (f == null ? void 0 : f.type) === "API" ? (Xe = f == null ? void 0 : f.type) == null ? void 0 : Xe.toLowerCase() : d || "", fe = T ? "" : r || "";
+  function he(N) {
+    u(N), g("");
+  }
+  function J(N) {
+    h(N), u(""), g("");
+  }
+  function ae(N) {
+    m(N);
+  }
+  E && ((ge = E == null ? void 0 : E.databases) == null ? void 0 : ge.length) > 0, I && ((_e = I == null ? void 0 : I.schemas) == null ? void 0 : _e.length) > 0, B && ((Te = B == null ? void 0 : B.columns) == null ? void 0 : Te.length) > 0 && (t = B.columns.map((N) => ({
+    ...N,
+    data_type: N.data_type.toLowerCase()
+  }))), G && (t = []), (xe || A) && (t = []);
+  const Ce = y == null ? void 0 : y.connections.map(
+    (N) => ({
+      id: N.id,
+      name: N.name,
+      type: N.type
+    })
+  ), Re = E == null ? void 0 : E.databases.map((N) => ({
+    id: N.database_name,
+    name: N.database_name
+  })), Se = I == null ? void 0 : I.schemas.map((N) => ({
+    id: N.schema_name,
+    name: N.schema_name
+  })), Me = w == null ? void 0 : w.tables.map((N) => ({
+    id: N.table_name,
+    name: N.table_name
+  }));
+  return {
+    connectionItems: Ce,
+    isConnectionsLoading: D,
+    isConnectionsError: A,
+    databaseItems: Re,
+    isDatabasesLoadingOrFetching: U || Z,
+    isDatabaseError: G,
+    schemaItems: Se,
+    isSchemaLoadingOrFetching: ee || P,
+    isSchemaError: se,
+    tableItems: Me,
+    isTableLoadingOrFetching: F || b,
+    isTableError: L,
+    columns: t,
+    isColumnsLoadingOrFetching: de || te,
+    isColumnsError: xe,
+    isNonDbConnection: T,
+    connectionType: O,
+    tableName: pe,
+    schemaName: fe,
+    handleConnectionChange: ae,
+    handleDatabaseChange: J,
+    handleSchemaChange: he
+  };
+}
+function ut({
+  ColumnsComponent: s
+}) {
+  var w;
+  const n = i(
+    (F) => F.selectedConnectionId
+  ), t = i(
+    (F) => F.selectedDatabaseName
+  ), a = i(
+    (F) => F.selectedSchemaName
+  ), l = i((F) => F.selectedTableName), o = i(
+    (F) => F.actions.setSelectedTableName
+  ), {
+    connectionItems: r,
+    schemaItems: d,
+    databaseItems: c,
+    tableItems: m,
+    columns: h,
+    isConnectionsLoading: u,
+    isConnectionsError: g,
+    isDatabasesLoadingOrFetching: p,
+    isDatabaseError: j,
+    isSchemaLoadingOrFetching: C,
+    isSchemaError: v,
+    isColumnsError: y,
+    isColumnsLoadingOrFetching: D,
+    isTableLoadingOrFetching: A,
+    isTableError: f,
+    connectionType: O,
+    isNonDbConnection: T,
+    handleConnectionChange: E,
+    handleDatabaseChange: U,
+    handleSchemaChange: Z,
+    tableName: G,
+    schemaName: H
+  } = ht();
+  function I() {
+    return s ? s(H, G, h) : /* @__PURE__ */ e.jsx(
+      fn,
+      {
+        schemaName: H,
+        tableName: G,
+        columns: h,
+        status: D ? "Loading..." : y ? "Error" : "Success"
+      }
+    );
+  }
+  function ee() {
+    window.location.href = "mailto:support@semaphor.cloud?subject=Help&body=I need help with...";
+  }
+  function P() {
+    return O === "S3" || O === "API" ? null : /* @__PURE__ */ e.jsx(
+      He,
+      {
+        onChange: U,
+        isError: j,
+        isLoading: p,
+        items: c,
+        value: t || "",
+        title: "Database"
+      }
+    );
+  }
+  function se() {
+    return O === "S3" || O === "API" ? null : /* @__PURE__ */ e.jsx(
+      He,
+      {
+        onChange: Z,
+        isError: v,
+        isLoading: C,
+        items: d,
+        value: a || "",
+        title: "Schema"
+      }
+    );
+  }
+  function X() {
+    return O === "API" ? null : /* @__PURE__ */ e.jsx(
+      He,
+      {
+        onChange: o,
+        isError: f,
+        items: m,
+        isLoading: A,
+        value: l || "",
+        title: "Table"
+      }
+    );
+  }
+  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(
+        He,
+        {
+          items: r,
+          title: "Connection",
+          value: n || "",
+          onChange: E,
+          isLoading: u,
+          isError: g,
+          connectionTooltip: ((w = r == null ? void 0 : r.find(
+            (F) => F.id === n
+          )) == null ? void 0 : w.type) || ""
+        }
+      ),
+      P(),
+      se(),
+      X()
+    ] }),
+    I(),
+    /* @__PURE__ */ e.jsx("div", { className: "flex items-end justify-center gap-2 px-6 py-4", children: /* @__PURE__ */ e.jsxs(
+      k,
+      {
+        onClick: ee,
+        size: "sm",
+        variant: "secondary",
+        className: "w-full",
+        children: [
+          /* @__PURE__ */ e.jsx(en, { className: "mr-2 size-4" }),
+          "Help"
+        ]
+      }
+    ) })
+  ] });
+}
+const rs = ({
+  className: s,
+  ...n
+}) => /* @__PURE__ */ e.jsx(
+  Ut,
+  {
+    className: W(
+      "flex h-full w-full data-[panel-group-direction=vertical]:flex-col",
+      s
+    ),
+    ...n
+  }
+), Fe = Gt, ls = ({
+  withHandle: s,
+  className: n,
+  ...t
+}) => /* @__PURE__ */ e.jsx(
+  Jt,
+  {
+    className: W(
+      "relative flex w-px items-center justify-center bg-border after:absolute after:inset-y-0 after:left-1/2 after:w-1 after:-translate-x-1/2 focus-visible:outline-none focus-visible:ring-1 focus-visible:ring-ring focus-visible:ring-offset-1 data-[panel-group-direction=vertical]:h-px data-[panel-group-direction=vertical]:w-full data-[panel-group-direction=vertical]:after:left-0 data-[panel-group-direction=vertical]:after:h-1 data-[panel-group-direction=vertical]:after:w-full data-[panel-group-direction=vertical]:after:-translate-y-1/2 data-[panel-group-direction=vertical]:after:translate-x-0 [&[data-panel-group-direction=vertical]>div]:rotate-90",
+      n
+    ),
+    ...t,
+    children: s && /* @__PURE__ */ e.jsx("div", { className: "z-10 flex h-4 w-3 items-center justify-center rounded-sm border bg-border", children: /* @__PURE__ */ e.jsx(Ja, { className: "h-2.5 w-2.5" }) })
+  }
+);
+function gn(s) {
+  const n = s.toUpperCase().indexOf("WHERE"), t = s.toUpperCase().indexOf("GROUP BY"), a = s.toUpperCase().indexOf("LIMIT"), l = s.toUpperCase().indexOf("ORDER BY");
+  let o = s.length;
+  if (l !== -1 && (o = l), a !== -1 && a < o && (o = a), n !== -1) {
+    const r = s.substring(0, n), d = s.substring(n);
+    return `${r} {{ filters | where }} AND ${d.substring(
+      6
+    )}`;
+  } else if (t !== -1) {
+    const r = s.substring(0, t), d = s.substring(t);
+    return `${r} {{ filters | where }} ${d}`;
+  } else {
+    const r = s.substring(0, o), d = s.substring(o);
+    return `${r} {{ filters | where }} ${d}`;
+  }
+}
+function jn({
+  error: s,
+  setShowAIDialog: n,
+  setUserInputforAI: t,
+  setTriggerAIRun: a
+}) {
+  return /* @__PURE__ */ e.jsxs(Qs, { openDelay: 0, children: [
+    /* @__PURE__ */ e.jsx(Ws, { asChild: !0, children: /* @__PURE__ */ e.jsx(k, { variant: "link", className: " p-0 h-5", children: /* @__PURE__ */ e.jsx($a, { className: "h-4 w-4 text-red-500" }) }) }),
+    /* @__PURE__ */ e.jsx(Ps, { 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(
+        k,
+        {
+          onClick: () => {
+            n(!0), t(s), a(!0);
+          },
+          size: "sm",
+          variant: "outline",
+          children: [
+            /* @__PURE__ */ e.jsx(Qa, { 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 }) })
+    ] }) }) })
+  ] });
+}
+function bn({
+  text: s,
+  onCheckedChange: n,
+  checked: t
+}) {
+  return /* @__PURE__ */ e.jsxs("div", { className: "xbg-red-100 ml-6 flex items-center gap-2", children: [
+    /* @__PURE__ */ e.jsx(Qe, { checked: t, onCheckedChange: n }),
+    /* @__PURE__ */ e.jsx("label", { className: "text-xs leading-none peer-disabled:cursor-not-allowed peer-disabled:opacity-70", children: s })
+  ] });
+}
+function yn() {
+  const { authToken: s } = Ye(), n = De(null), t = i((d) => d.applyFilters), [a, l] = z(""), o = i((d) => d.filterValues), r = i((d) => d.card.sql);
+  return /* @__PURE__ */ e.jsxs(
+    Qs,
+    {
+      openDelay: 0,
+      onOpenChange: async (d) => {
+        if (!d)
+          return;
+        console.log("onOpenChange");
+        const c = await Ys(
+          "https://semaphor.cloud/api/v1/filter-sql",
+          (s == null ? void 0 : s.accessToken) || "",
+          {
+            sql: r,
+            active_filters: o
+          }
+        );
+        console.log(c), c.sql ? (console.log(c.records), l(c.sql)) : l("Error");
+      },
+      children: [
+        /* @__PURE__ */ e.jsx(Ws, { asChild: !0, children: t && /* @__PURE__ */ e.jsx("p", { className: "p-0 text-xs hover:cursor-pointer", children: "|  Filter Query" }) }),
+        /* @__PURE__ */ e.jsxs(Ps, { 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: [
+            a,
+            /* @__PURE__ */ e.jsx(
+              Xs,
+              {
+                onClick: () => Qt(n),
+                className: "ml-3 inline-block h-4 w-4 opacity-70 hover:cursor-pointer hover:opacity-100"
+              }
+            )
+          ] }) }) }),
+          /* @__PURE__ */ e.jsxs("div", { className: "flex items-center gap-2 pt-2", children: [
+            /* @__PURE__ */ e.jsx(Zs, { className: "h-4 w-4 opacity-70" }),
+            /* @__PURE__ */ e.jsx("span", { className: "text-xs text-muted-foreground", children: "A preview of the query with filters applied." })
+          ] })
+        ] })
+      ]
+    }
+  );
+}
+const vn = `
+
+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.
+
+Bar / Line Chart: 
+
+SELECT x-axis, y-axis-1, y-axis-2, y-axis-3,... FROM table
+
+- X-axis - Category 
+- Y-axis - Number
+
+Stacked Chart: 
+
+SELECT x-axis, stack-by, y-axis FROM table
+
+- X-axis - Category
+- Stack by - Category
+- Y-axis - Number
+
+
+Scatter Chart:
+
+SELECT label, x-axis, y-axis FROM table
+
+- Label - Category
+- Group (opt) - Category 
+- X-axis - Number 
+- Y-axis - Number 
+
+
+Bubble Chart:
+
+SELECT label, x-axis, y-axis, radius FROM table
+
+- Label - Category 
+- Bubble Group (opt) - Category 
+- X-axis - Number 
+- Y-axis - Number 
+- Radius - Number 
+
+Pie / Dougnut Chart:
+
+SELECT label, measure FROM table
+
+- Label - Category 
+- Measure - Number 
+`;
+function Nn({
+  open: s,
+  setOpen: n,
+  userInput: t,
+  setUserInput: a,
+  triggerAIRun: l,
+  setTriggerAIRun: o
+}) {
+  const r = De(null), d = De(null), { authToken: c } = Ye(), [m, h] = z(!1), u = i((b) => b.actions.setCardSql), g = S((b) => b.dashboard.baseQueries), p = i((b) => b.actions.setRunSql), j = i((b) => b.actions.setCardType), [C, v] = z([]), y = i((b) => b.currentColumns), D = i((b) => b.card.sql), A = i((b) => b.selectedTableName), f = `
+  ${t}
+
+  Database Query Dialect: ${A === "api" || A === "s3" ? "DuckDb" : ""}
+  Table Name: ${A}   
+  Table Columns: ${y == null ? void 0 : y.map((b) => `${b.column_name} | ${b.data_type}`).join(", ")}
+  User SQL: ${D}  
+  ${g && `Base Queries: ${JSON.stringify(g)} `}`, O = ` 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: ${vn}`, { data: T, isLoading: E, isFetching: U, isError: Z, refetch: G } = ye({
+    queryKey: ["ai-query"],
+    queryFn: () => we(
+      "https://semaphor.cloud/api/v1/ai",
+      (c == null ? void 0 : c.accessToken) || "",
+      {
+        user_content: `userContent: ${f} ${m ? O : ""}`
+      }
+    ),
+    enabled: !1
+    // Do not run by default.
+  });
+  function H(b) {
+    if (b.toLowerCase().includes("bar"))
+      j("bar");
+    else if (b.toLowerCase().includes("line"))
+      j("line");
+    else if (b.toLowerCase().includes("bubble"))
+      j("bubble");
+    else if (b.toLowerCase().includes("scatter"))
+      j("scatter");
+    else if (b.toLowerCase().includes("stacked"))
+      j("stackedBar");
+    else if (b.toLowerCase().includes("pie"))
+      j("pie");
+    else if (b.toLowerCase().includes("donut") || b.toLowerCase().includes("doughnut"))
+      j("doughnut");
+    else if (b.toLowerCase().includes("radar"))
+      j("radar");
+    else
+      return j("bar"), !1;
+    return !0;
+  }
+  $(() => {
+    T && v((b) => [...b, { role: "ai", content: T.response }]);
+  }, [T]), $(() => {
+    const b = setTimeout(() => {
+      var L;
+      d.current && (d.current.scroll({
+        top: d.current.scrollHeight,
+        behavior: "smooth"
+      }), (L = r.current) == null || L.focus());
+    }, 100);
+    return () => clearTimeout(b);
+  }, [C]);
+  function I() {
+    t && (v((b) => [...b, { role: "user", content: t }]), H(t) && h(!0), a(""), G());
+  }
+  $(() => {
+    l && (I(), o(!1));
+  }, [l, o]);
+  const ee = {
+    //seleect a darker color
+    // color: '#000',
+    fontFamily: "Arial, sans-serif",
+    lineHeight: 1.6,
+    fontSize: 15,
+    // padding: '5px',
+    width: "100%"
+  }, P = {
+    // background: '#f6f8fa',
+    // color: '#000',
+    fontFamily: "monospace",
+    fontSize: 14,
+    lineHeight: 1.6
+    // padding: 20,
+  }, se = {
+    // color: '#000',
+    fontFamily: "Arial, sans-serif",
+    lineHeight: 1.6,
+    fontSize: 15,
+    padding: "2px 0",
+    // add a bit of left margin to make it look nice
+    marginLeft: 20,
+    // add bullet points for unordered lists
+    listStyleType: "disc"
+  }, X = {
+    // Override how paragraphs are rendered
+    p: ({ node: b, ...L }) => /* @__PURE__ */ e.jsx("p", { style: ee, ...L }),
+    code: ({ node: b, ...L }) => /* @__PURE__ */ e.jsx("code", { className: "rounded-sm bg-muted px-2 py-1 text-sm", ...L }),
+    pre: ({ node: b, ...L }) => /* @__PURE__ */ e.jsxs("pre", { className: "space-y-2 rounded-sm bg-muted/50 p-3", style: P, children: [
+      /* @__PURE__ */ e.jsx("code", { className: "whitespace-normal text-sm", children: L.children }),
+      /* @__PURE__ */ e.jsxs("div", { className: "flex justify-start gap-2", children: [
+        /* @__PURE__ */ e.jsx(k, { onClick: w, size: "sm", variant: "outline", children: /* @__PURE__ */ e.jsx(Xs, {}) }),
+        /* @__PURE__ */ e.jsx(
+          k,
+          {
+            onClick: (K) => {
+              const B = w(K);
+              B && (n(!1), u(B), p(!0));
+            },
+            size: "sm",
+            variant: "outline",
+            children: /* @__PURE__ */ e.jsx(Yt, {})
+          }
+        )
+      ] })
+    ] }),
+    li: ({ node: b, ...L }) => /* @__PURE__ */ e.jsx("li", { style: se, ...L })
+    // You can add more overrides for other elements like h1, h2, etc.
+  };
+  function w(b) {
+    const L = b.currentTarget.closest("pre");
+    if (!L)
+      return;
+    const K = L.textContent || L.innerText;
+    return navigator.clipboard.writeText(K).then(() => console.log("Text copied to clipboard")).catch((B) => console.error("Error in copying text: ", B)), K;
+  }
+  function F() {
+    return C == null ? void 0 : C.map((b, L) => b.role === "user" ? /* @__PURE__ */ e.jsxs(
+      "div",
+      {
+        className: "flex items-start rounded-md bg-muted p-3 text-sm",
+        children: [
+          /* @__PURE__ */ e.jsx(dn, { className: "mr-2 h-5 w-5" }),
+          /* @__PURE__ */ e.jsx("div", { children: b.content })
+        ]
+      },
+      L
+    ) : b.role === "ai" ? /* @__PURE__ */ e.jsx(
+      Pt,
+      {
+        className: "w-full overflow-auto py-1",
+        components: X,
+        children: T == null ? void 0 : T.response.replace(/DuckDB/gi, "Semaphor")
+      },
+      L
+    ) : /* @__PURE__ */ e.jsx("div", {}, L));
+  }
+  return /* @__PURE__ */ e.jsxs(is, { open: s, onOpenChange: n, children: [
+    /* @__PURE__ */ e.jsx(os, { asChild: !0, children: /* @__PURE__ */ e.jsx(
+      k,
+      {
+        size: "sm",
+        className: "w-full justify-start border font-normal text-muted-foreground focus-visible:ring-0 focus-visible:ring-offset-0",
+        variant: "secondary",
+        children: "Type your question here..."
+      }
+    ) }),
+    /* @__PURE__ */ e.jsxs(
+      cs,
+      {
+        className: "flex flex-col justify-between overflow-auto sm:max-w-[425px] md:max-h-[625px] md:min-w-[625px]",
+        children: [
+          /* @__PURE__ */ e.jsxs(ds, { children: [
+            /* @__PURE__ */ e.jsx(hs, { children: "Assistant" }),
+            /* @__PURE__ */ e.jsx(us, { children: "What can I help you with?" })
+          ] }),
+          /* @__PURE__ */ e.jsx(
+            "div",
+            {
+              ref: d,
+              className: "h-[625px] w-full overflow-auto border-t border-t-muted",
+              children: /* @__PURE__ */ e.jsx("div", { className: "space-y-4 py-2 pr-3", role: "messages", children: F() })
+            }
+          ),
+          /* @__PURE__ */ e.jsx(
+            "div",
+            {
+              children: /* @__PURE__ */ e.jsxs("div", { className: "flex w-full items-center rounded-md border", children: [
+                /* @__PURE__ */ e.jsx(
+                  et,
+                  {
+                    autoFocus: !0,
+                    ref: r,
+                    onKeyDown: (b) => {
+                      b.key === "Enter" && !b.shiftKey && (b.preventDefault(), a(""), I());
+                    },
+                    placeholder: "Type your question here...",
+                    onFocus: (b) => {
+                      const L = b.target, K = L.value.length;
+                      L.setSelectionRange(K, K);
+                    },
+                    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 || U,
+                    value: t,
+                    onChange: (b) => a(b.target.value)
+                  }
+                ),
+                " ",
+                /* @__PURE__ */ e.jsx(
+                  k,
+                  {
+                    className: "h-8",
+                    size: "sm",
+                    variant: "ghost",
+                    onClick: I,
+                    children: !E && !U ? /* @__PURE__ */ e.jsx(Wt, {}) : /* @__PURE__ */ e.jsx(Le, { className: "mr-2 h-4 w-4 animate-spin text-foreground/50" })
+                  }
+                )
+              ] })
+            }
+          )
+        ]
+      }
+    )
+  ] });
+}
+var mt = {
+  color: void 0,
+  size: void 0,
+  className: void 0,
+  style: void 0,
+  attr: void 0
+}, Vs = ce.createContext && /* @__PURE__ */ ce.createContext(mt), Cn = ["attr", "size", "title"];
+function Sn(s, n) {
+  if (s == null)
+    return {};
+  var t = kn(s, n), a, l;
+  if (Object.getOwnPropertySymbols) {
+    var o = Object.getOwnPropertySymbols(s);
+    for (l = 0; l < o.length; l++)
+      a = o[l], !(n.indexOf(a) >= 0) && Object.prototype.propertyIsEnumerable.call(s, a) && (t[a] = s[a]);
+  }
+  return t;
+}
+function kn(s, n) {
+  if (s == null)
+    return {};
+  var t = {}, a = Object.keys(s), l, o;
+  for (o = 0; o < a.length; o++)
+    l = a[o], !(n.indexOf(l) >= 0) && (t[l] = s[l]);
+  return t;
+}
+function Ge() {
+  return Ge = Object.assign ? Object.assign.bind() : function(s) {
+    for (var n = 1; n < arguments.length; n++) {
+      var t = arguments[n];
+      for (var a in t)
+        Object.prototype.hasOwnProperty.call(t, a) && (s[a] = t[a]);
+    }
+    return s;
+  }, Ge.apply(this, arguments);
+}
+function Rs(s, n) {
+  var t = Object.keys(s);
+  if (Object.getOwnPropertySymbols) {
+    var a = Object.getOwnPropertySymbols(s);
+    n && (a = a.filter(function(l) {
+      return Object.getOwnPropertyDescriptor(s, l).enumerable;
+    })), t.push.apply(t, a);
+  }
+  return t;
+}
+function Je(s) {
+  for (var n = 1; n < arguments.length; n++) {
+    var t = arguments[n] != null ? arguments[n] : {};
+    n % 2 ? Rs(Object(t), !0).forEach(function(a) {
+      wn(s, a, t[a]);
+    }) : Object.getOwnPropertyDescriptors ? Object.defineProperties(s, Object.getOwnPropertyDescriptors(t)) : Rs(Object(t)).forEach(function(a) {
+      Object.defineProperty(s, a, Object.getOwnPropertyDescriptor(t, a));
+    });
+  }
+  return s;
+}
+function wn(s, n, t) {
+  return n = Fn(n), n in s ? Object.defineProperty(s, n, { value: t, enumerable: !0, configurable: !0, writable: !0 }) : s[n] = t, s;
+}
+function Fn(s) {
+  var n = On(s, "string");
+  return typeof n == "symbol" ? n : String(n);
+}
+function On(s, n) {
+  if (typeof s != "object" || s === null)
+    return s;
+  var t = s[Symbol.toPrimitive];
+  if (t !== void 0) {
+    var a = t.call(s, n || "default");
+    if (typeof a != "object")
+      return a;
+    throw new TypeError("@@toPrimitive must return a primitive value.");
+  }
+  return (n === "string" ? String : Number)(s);
+}
+function xt(s) {
+  return s && s.map((n, t) => /* @__PURE__ */ ce.createElement(n.tag, Je({
+    key: t
+  }, n.attr), xt(n.child)));
+}
+function Ne(s) {
+  return (n) => /* @__PURE__ */ ce.createElement(zn, Ge({
+    attr: Je({}, s.attr)
+  }, n), xt(s.child));
+}
+function zn(s) {
+  var n = (t) => {
+    var {
+      attr: a,
+      size: l,
+      title: o
+    } = s, r = Sn(s, Cn), d = l || t.size || "1em", c;
+    return t.className && (c = t.className), s.className && (c = (c ? c + " " : "") + s.className), /* @__PURE__ */ ce.createElement("svg", Ge({
+      stroke: "currentColor",
+      fill: "currentColor",
+      strokeWidth: "0"
+    }, t.attr, a, r, {
+      className: c,
+      style: Je(Je({
+        color: s.color || t.color
+      }, t.style), s.style),
+      height: d,
+      width: d,
+      xmlns: "http://www.w3.org/2000/svg"
+    }), o && /* @__PURE__ */ ce.createElement("title", null, o), s.children);
+  };
+  return Vs !== void 0 ? /* @__PURE__ */ ce.createElement(Vs.Consumer, null, (t) => n(t)) : n(mt);
+}
+function Mn(s) {
+  return Ne({ 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 Tn() {
+  const { theme: s } = Xt(), n = De(), t = De(), [a, l] = z(!1), [o, r] = z(!1), [d, c] = z(!1), [m, h] = z(""), [u, g] = z(!1), { authToken: p } = Ye();
+  S((x) => x.selectedSheetId);
+  const j = S((x) => x.dashboard.baseQueries), C = i((x) => x.card), v = S((x) => x.theme), y = i((x) => x.isShowingVisual), D = i(
+    (x) => x.selectedConnectionId
+  ), A = i(
+    (x) => x.selectedDatabaseName
+  ), f = i(
+    (x) => x.selectedSchemaName
+  );
+  S(
+    (x) => x.actions.updateFrameCard
+  );
+  const O = i((x) => x.selectedTableName), T = i((x) => x.card.sql), E = i((x) => x.card.python), U = Zt(T, j), Z = i((x) => x.selectedConnectionId), G = i((x) => x.frame), H = i((x) => x.filterValues), I = i((x) => x.applyFilters), {
+    setCardCustomCfg: ee,
+    setQueryResultColumns: P,
+    setFilterValues: se,
+    setCardSql: X,
+    setCardPython: w,
+    setQueryError: F,
+    setPythonStdOut: b,
+    setCardPreferences: L
+  } = i((x) => x.actions), K = i((x) => x.onSave), B = i(
+    (x) => x.actions.setApplyFilters
+  ), de = i((x) => x.onClose), te = i((x) => x.actions.setCardData), xe = i((x) => x.actions.setSqlGen), pe = i((x) => x.runSql), fe = i((x) => x.actions.setRunSql), he = i(
+    (x) => x.actions.setIsSqlRunning
+  ), {
+    data: J,
+    isLoading: ae,
+    isFetching: Ce,
+    isSuccess: Re,
+    isError: Se,
+    error: Me,
+    status: Xe,
+    refetch: ge
+  } = ye({
+    queryKey: [U, E],
+    queryFn: () => Ys(
+      "https://semaphor.cloud/api/v1/query",
+      (p == null ? void 0 : p.accessToken) || "",
+      {
+        connection_id: Z,
+        sql: U,
+        python: E === Ms ? "" : E,
+        active_filters: I ? H : []
+      }
+    ),
+    enabled: !1,
+    retry: !1
+  });
+  $(() => {
+    if (J && (te(J.records), b((J == null ? void 0 : J.output) || ""), J.records.length > 0)) {
+      const { dimensionKeys: x } = ns(J.records);
+      P(x);
+    }
+  }, [J, te, P, b]), $(() => {
+    pe && (ge(), fe(!1));
+  }, [pe, ge, fe]), $(() => {
+    (ae || Ce) && he(!0), (Se || Re) && he(!1), Se ? (F(Me.message), te([]), P([]), b("")) : F("");
+  }, [
+    ae,
+    Ce,
+    J,
+    b,
+    Se,
+    Re,
+    he,
+    te,
+    P,
+    F,
+    Me
+  ]);
+  function _e() {
+    X(""), te([]), xe({}), ee(""), L({});
+  }
+  const Te = (x) => {
+    t.current = x;
+  };
+  function N() {
+    let x = T;
+    T && !T.includes("{{") && (x = gn(T), X(x));
+    const ne = {
+      ...C,
+      lastSelectedSchema: f,
+      lastSelectedDatabase: A,
+      lastSelectedTable: O,
+      connectionId: D,
+      type: y ? C.type : "table",
+      sql: x,
+      customCfg: y ? C.customCfg : null
+    }, Ae = G.cards.map(
+      (je) => je.id === C.id ? ne : je
+    );
+    K == null || K({
+      ...G,
+      cards: Ae
+    });
+  }
+  function Ct() {
+    de == null || de();
+  }
+  function St(x) {
+    const ne = getComputedStyle(
+      document.documentElement
+    ).getPropertyValue(x);
+    return kt(ne);
+  }
+  function kt(x) {
+    const [ne, Ae, je] = x.split(" "), Y = parseFloat(ne), Ot = parseFloat(Ae), zt = parseFloat(je), Mt = Ot / 100, Fs = zt / 100, ue = (1 - Math.abs(2 * Fs - 1)) * Mt, ke = ue * (1 - Math.abs(Y / 60 % 2 - 1)), Ze = Fs - ue / 2;
+    let re = 0, le = 0, ie = 0;
+    0 <= Y && Y < 60 ? (re = ue, le = ke, ie = 0) : 60 <= Y && Y < 120 ? (re = ke, le = ue, ie = 0) : 120 <= Y && Y < 180 ? (re = 0, le = ue, ie = ke) : 180 <= Y && Y < 240 ? (re = 0, le = ke, ie = ue) : 240 <= Y && Y < 300 ? (re = ke, le = 0, ie = ue) : 300 <= Y && Y < 360 && (re = ue, le = 0, ie = ke), re = Math.round((re + Ze) * 255), le = Math.round((le + Ze) * 255), ie = Math.round((ie + Ze) * 255);
+    const es = (Tt) => {
+      const ss = Tt.toString(16);
+      return ss.length == 1 ? "0" + ss : ss;
+    };
+    return `#${es(re)}${es(le)}${es(ie)}`;
+  }
+  $(() => {
+    const x = n.current, ne = t.current;
+    if (x) {
+      const Ae = window.matchMedia("(prefers-color-scheme: dark)").matches ? "dark" : "light", je = v === "system" ? Ae : v;
+      x.editor.defineTheme("default", {
+        // base: theme === 'light' ? 'hc-light' : 'vs-dark',
+        base: je === "light" ? "vs" : "vs-dark",
+        inherit: !0,
+        rules: [],
+        colors: {
+          // 'editor.background': activeTheme === 'light' ? '#ffffff' : '#020817',
+          "editor.background": je === "light" ? "#ffffff" : St("--background")
+        }
+      }), x.editor.setTheme("default");
+    }
+    return ne && x && ne.addCommand(
+      x.KeyMod.Shift | x.KeyCode.Enter,
+      function() {
+        return console.log("Executing query..."), ge(), !1;
+      }
+    ), () => {
+    };
+  }, [s, v, n.current]);
+  function ws(x) {
+    n.current = x;
+  }
+  function wt() {
+    return /* @__PURE__ */ e.jsxs(e.Fragment, { children: [
+      o && /* @__PURE__ */ e.jsx(
+        "div",
+        {
+          className: "xbg-yellow-100 relative flex w-1/3 min-w-0 grow overflow-hidden border-l p-1 text-xs",
+          role: "editor-filter-container",
+          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(
+                bn,
+                {
+                  checked: I,
+                  onCheckedChange: () => B(!I),
+                  text: "Apply Filters"
+                }
+              ),
+              /* @__PURE__ */ e.jsx(yn, {}),
+              H && o && /* @__PURE__ */ e.jsx(
+                Ee,
+                {
+                  onClick: () => r(!1),
+                  className: "bg-background/50 text-foreground/50 hover:cursor-pointer hover:text-foreground"
+                }
+              )
+            ] }),
+            /* @__PURE__ */ e.jsx(
+              Be,
+              {
+                theme: "default",
+                onChange: (x) => {
+                  if (x)
+                    try {
+                      JSON.parse(x), se(JSON.parse(x));
+                    } catch {
+                    }
+                },
+                defaultLanguage: "json",
+                className: "mt-1 min-h-[220px]",
+                value: JSON.stringify(H, null, 2),
+                options: {
+                  readOnly: !0,
+                  minimap: {
+                    enabled: !1
+                  },
+                  lineNumbers: "off",
+                  glyphMargin: !1,
+                  wordWrap: "on",
+                  scrollbar: {
+                    verticalScrollbarSize: 0,
+                    horizontalScrollbarSize: 0
+                  },
+                  fontSize: 12,
+                  renderLineHighlight: "none"
+                }
+              }
+            )
+          ] })
+        }
+      ),
+      H && !o && /* @__PURE__ */ e.jsx(
+        rt,
+        {
+          onClick: () => r(!0),
+          className: W(
+            "absolute bottom-4 right-6 h-3 w-3 text-foreground/50 hover:cursor-pointer hover:text-foreground",
+            {
+              "font-bold text-red-800": I
+            }
+          )
+        }
+      )
+    ] });
+  }
+  function Ft() {
+    return /* @__PURE__ */ e.jsxs(
+      rs,
+      {
+        className: "flex grow pb-1",
+        direction: "vertical",
+        role: "editor-resizable-group",
+        children: [
+          /* @__PURE__ */ e.jsxs(
+            Fe,
+            {
+              id: "1",
+              order: 1,
+              defaultSize: a ? 20 : 100,
+              className: "relative flex grow",
+              children: [
+                /* @__PURE__ */ e.jsx(
+                  "div",
+                  {
+                    role: "sql-container",
+                    className: "relative flex w-[99%]",
+                    children: /* @__PURE__ */ e.jsx(
+                      Be,
+                      {
+                        theme: "default",
+                        className: "pt-3",
+                        onChange: (x) => {
+                          X(x);
+                        },
+                        value: T,
+                        options: {
+                          minimap: {
+                            enabled: !1
+                          },
+                          wordWrap: "on",
+                          scrollbar: {
+                            verticalScrollbarSize: 0,
+                            horizontalScrollbarSize: 0
+                          },
+                          fontSize: 14,
+                          renderLineHighlight: "none"
+                        },
+                        defaultLanguage: "sql",
+                        defaultValue: "SELECT * FROM table",
+                        beforeMount: ws,
+                        onMount: Te
+                      }
+                    )
+                  }
+                ),
+                a && /* @__PURE__ */ e.jsx("code", { className: "absolute right-6 top-3 text-sm text-muted-foreground/70", children: "sql" })
+              ]
+            }
+          ),
+          a && /* @__PURE__ */ e.jsxs(e.Fragment, { children: [
+            /* @__PURE__ */ e.jsx(ls, { withHandle: !0, className: "border" }),
+            /* @__PURE__ */ e.jsxs(
+              Fe,
+              {
+                id: "2",
+                order: 2,
+                defaultSize: 80,
+                className: "relative flex grow",
+                children: [
+                  /* @__PURE__ */ e.jsx(
+                    "div",
+                    {
+                      role: "python-container",
+                      className: "relative flex w-[99%] pt-0",
+                      children: /* @__PURE__ */ e.jsx(
+                        Be,
+                        {
+                          className: "pt-3",
+                          theme: "default",
+                          onChange: (x) => {
+                            w(x && x.trim() || "");
+                          },
+                          value: E || Ms,
+                          options: {
+                            minimap: {
+                              enabled: !1
+                            },
+                            wordWrap: "on",
+                            scrollbar: {
+                              verticalScrollbarSize: 0,
+                              horizontalScrollbarSize: 0
+                            },
+                            fontSize: 14,
+                            renderLineHighlight: "none"
+                          },
+                          defaultLanguage: "python",
+                          beforeMount: ws,
+                          onMount: Te
+                        }
+                      )
+                    }
+                  ),
+                  /* @__PURE__ */ e.jsx("code", { className: "absolute right-6 top-3 text-sm text-muted-foreground/70", children: "python" })
+                ]
+              }
+            )
+          ] })
+        ]
+      }
+    );
+  }
+  return (
+    // This is a tricky css, the pt-8 is to make sure the editor doesn't slide under the header
+    /* @__PURE__ */ e.jsxs(
+      "section",
+      {
+        role: "editor-section",
+        className: "flex grow flex-col justify-end",
+        children: [
+          /* @__PURE__ */ e.jsxs(
+            "div",
+            {
+              role: "sql-editor",
+              className: "relative flex grow justify-between overflow-y-scroll",
+              children: [
+                Ft(),
+                wt()
+              ]
+            }
+          ),
+          /* @__PURE__ */ e.jsxs(
+            "div",
+            {
+              role: "editor-controls",
+              className: "item-center flex flex-wrap justify-between gap-2 px-6 py-4",
+              children: [
+                /* @__PURE__ */ e.jsxs("div", { className: "flex grow items-center gap-2", children: [
+                  /* @__PURE__ */ e.jsxs(
+                    k,
+                    {
+                      title: "Shift + Enter",
+                      disabled: ae || Ce,
+                      onClick: () => {
+                        ge();
+                      },
+                      className: "shrink-0",
+                      size: "sm",
+                      variant: "outline",
+                      children: [
+                        ae || Ce ? /* @__PURE__ */ e.jsx(Le, { className: "mr-2 h-4 w-4 animate-spin text-foreground/50" }) : /* @__PURE__ */ e.jsx(tn, { className: "mr-2 h-4 w-4" }),
+                        "Run"
+                      ]
+                    }
+                  ),
+                  Se && /* @__PURE__ */ e.jsx(
+                    jn,
+                    {
+                      error: Me.message,
+                      setShowAIDialog: c,
+                      setTriggerAIRun: g,
+                      setUserInputforAI: h
+                    }
+                  ),
+                  /* @__PURE__ */ e.jsxs(
+                    k,
+                    {
+                      onClick: _e,
+                      className: "",
+                      size: "sm",
+                      variant: "outline",
+                      children: [
+                        /* @__PURE__ */ e.jsx(Ua, { className: "mr-2 size-4" }),
+                        "Clear"
+                      ]
+                    }
+                  ),
+                  /* @__PURE__ */ e.jsx(
+                    Js,
+                    {
+                      pressed: a,
+                      onPressedChange: (x) => l(x),
+                      className: "",
+                      size: "sm",
+                      variant: "outline",
+                      children: /* @__PURE__ */ e.jsx(Mn, { className: "size-4 text-foreground/70" })
+                    }
+                  ),
+                  /* @__PURE__ */ e.jsx(
+                    Nn,
+                    {
+                      open: d,
+                      setOpen: c,
+                      userInput: m,
+                      triggerAIRun: u,
+                      setTriggerAIRun: g,
+                      setUserInput: (x) => h(x)
+                    }
+                  )
+                ] }),
+                /* @__PURE__ */ e.jsxs("div", { className: "flex items-end gap-2", children: [
+                  /* @__PURE__ */ e.jsxs(
+                    k,
+                    {
+                      onClick: N,
+                      size: "sm",
+                      variant: "outline",
+                      children: [
+                        /* @__PURE__ */ e.jsx(ea, { className: "mr-2 size-4 font-bold text-green-600" }),
+                        "Accept"
+                      ]
+                    }
+                  ),
+                  /* @__PURE__ */ e.jsxs(
+                    k,
+                    {
+                      onClick: Ct,
+                      className: "w-full",
+                      size: "sm",
+                      variant: "outline",
+                      children: [
+                        /* @__PURE__ */ e.jsx(Ee, { className: "mr-2 size-4" }),
+                        "Close"
+                      ]
+                    }
+                  )
+                ] })
+              ]
+            }
+          )
+        ]
+      }
+    )
+  );
+}
+function An({ data: s }) {
+  var r;
+  const [n, t] = ce.useState([]), l = Object.keys(s[0]).map((d) => ({
+    // header: key,
+    accessorKey: d,
+    header: ({ column: c }) => {
+      const m = c.getIsSorted();
+      return /* @__PURE__ */ e.jsx("div", { className: "flex gap-2", children: /* @__PURE__ */ e.jsxs(
+        "div",
+        {
+          className: "flex cursor-pointer items-center",
+          onClick: () => c.toggleSorting(c.getIsSorted() === "asc"),
+          children: [
+            d,
+            m === "asc" ? /* @__PURE__ */ e.jsx(sa, { className: "ml-2 h-5 w-5" }) : m === "desc" ? /* @__PURE__ */ e.jsx(ta, { className: "ml-2 h-5 w-5" }) : null
+          ]
+        }
+      ) });
+    }
+  })), o = aa({
+    data: s,
+    columns: l,
+    getCoreRowModel: oa(),
+    getPaginationRowModel: ca(),
+    onSortingChange: t,
+    getSortedRowModel: da(),
+    manualPagination: !0,
+    state: {
+      sorting: n
+    }
+  });
+  return /* @__PURE__ */ e.jsxs(na, { children: [
+    /* @__PURE__ */ e.jsx(ra, { children: o.getHeaderGroups().map((d) => /* @__PURE__ */ e.jsx(ts, { children: d.headers.map((c) => /* @__PURE__ */ e.jsx(la, { className: "sticky top-0 bg-muted", children: c.isPlaceholder ? null : Ts(
+      c.column.columnDef.header,
+      c.getContext()
+    ) }, c.id)) }, d.id)) }),
+    /* @__PURE__ */ e.jsx(ia, { children: (r = o.getRowModel().rows) != null && r.length ? o.getRowModel().rows.map((d) => /* @__PURE__ */ e.jsx(
+      ts,
+      {
+        className: "whitespace-nowrap py-2",
+        "data-state": d.getIsSelected() && "selected",
+        children: d.getVisibleCells().map((c) => /* @__PURE__ */ e.jsx(As, { children: Ts(c.column.columnDef.cell, c.getContext()) }, c.id))
+      },
+      d.id
+    )) : /* @__PURE__ */ e.jsx(ts, { children: /* @__PURE__ */ e.jsx(As, { colSpan: l.length, className: "h-24 text-center", children: "No results." }) }) })
+  ] });
+}
+function pt({
+  // card,
+  className: s,
+  ...n
+}) {
+  ce.useState(0);
+  const t = S((r) => r.themeStyle), a = i((r) => r.card), l = i((r) => r.actions.setCard);
+  if ($(() => {
+  }, [
+    a.data,
+    a.type,
+    a.cfg,
+    a.customCfg,
+    t,
+    a.preferences
+  ]), !a.id)
+    return null;
+  let o;
+  return a.data && a.data.length > 0 && (o = st({
+    data: a.data,
+    cardType: a.type,
+    cfg: a.cfg,
+    customCfg: a.customCfg,
+    preferences: a.preferences
+  })), /* @__PURE__ */ e.jsxs(
+    ha,
+    {
+      role: "editor-visual-card",
+      className: W("relative flex h-full flex-col rounded-none", s),
+      ...n,
+      children: [
+        /* @__PURE__ */ e.jsxs(ua, { className: "py-4", children: [
+          /* @__PURE__ */ e.jsx(
+            Es,
+            {
+              text: a.title,
+              onSave: (r) => l({ ...a, title: r }),
+              children: /* @__PURE__ */ e.jsx("div", { className: "flex items-center gap-2", children: /* @__PURE__ */ e.jsx(ma, { className: "text-base", children: a.title }) })
+            },
+            a.title
+          ),
+          /* @__PURE__ */ e.jsx(
+            Es,
+            {
+              text: a.description || "",
+              onSave: (r) => l({ ...a, description: r }),
+              children: /* @__PURE__ */ e.jsxs(xa, { children: [
+                " ",
+                a.description
+              ] })
+            },
+            a.description
+          )
+        ] }),
+        /* @__PURE__ */ e.jsxs(pa, { className: "flex grow flex-col pb-3", children: [
+          a.type !== "table" && o && // <ChartJsVisual key={visualKey} cfg={cfg} />
+          /* @__PURE__ */ e.jsx(
+            fa,
+            {
+              cfg: o
+            },
+            JSON.stringify(o) + JSON.stringify(a.preferences)
+          ),
+          a.type === "table" && a.data && a.data.length > 0 && // All of the below css classes are #IMPORTANT for the table to scroll properly
+          /* @__PURE__ */ e.jsx(ga, { className: "flex min-h-0 flex-1 grow basis-0", children: /* @__PURE__ */ e.jsx(ja, { card: a, data: a == null ? void 0 : a.data }) })
+        ] })
+      ]
+    }
+  );
+}
+function En() {
+  const [s, n] = z(!1), [t, a] = z(""), [l, o] = z(""), [r, d] = z(""), c = i((v) => v.card), m = i(
+    (v) => v.card.customCfg
+  ), h = i(
+    (v) => v.actions.setCardCustomCfg
+  );
+  function u(v) {
+    var A, f;
+    const y = {
+      ...v,
+      data: {
+        ...v == null ? void 0 : v.data,
+        datasets: (f = (A = v == null ? void 0 : v.data) == null ? void 0 : A.datasets) == null ? void 0 : f.map((O) => ({
+          ...O,
+          data: []
+        }))
+      }
+    };
+    return JSON.stringify(y, null, 1);
+  }
+  function g() {
+    if (!c.data || c.data.length === 0)
+      return;
+    const v = st({
+      data: c.data,
+      cardType: c.type,
+      cfg: c.cfg,
+      preferences: c.preferences
+    });
+    v && (a(JSON.stringify(v, null, 1)), m && o(JSON.stringify(m, null, 1)));
+  }
+  function p() {
+    if (l)
+      try {
+        const v = JSON.parse(l);
+        return v ? (h(v), d(""), o(""), v) : void 0;
+      } catch (v) {
+        console.log(v), d("Invalid JSON");
+      }
+  }
+  function j() {
+    o(""), h(null);
+  }
+  function C() {
+    let v;
+    if (m) {
+      const y = Is.cloneDeep(c.cfg), D = Is.merge(y, m);
+      return v = u(D), v;
+    }
+    return t ? (v = u(JSON.parse(t)), v) : "";
+  }
+  return /* @__PURE__ */ e.jsxs(is, { open: s, onOpenChange: n, children: [
+    /* @__PURE__ */ e.jsx(os, { asChild: !0, children: /* @__PURE__ */ e.jsx(
+      k,
+      {
+        onClick: g,
+        className: ` ${m && "border-foreground/50 dark:border-foreground/70"}`,
+        size: "sm",
+        variant: "outline",
+        children: /* @__PURE__ */ e.jsx(ba, { className: "h-4 w-4" })
+      }
+    ) }),
+    /* @__PURE__ */ e.jsxs(
+      cs,
+      {
+        className: "max-h-[70vh] min-h-[70vh] min-w-[900px] overflow-auto",
+        children: [
+          /* @__PURE__ */ e.jsxs(ds, { className: "", children: [
+            /* @__PURE__ */ e.jsxs("div", { className: "flex items-center gap-2", children: [
+              /* @__PURE__ */ e.jsx(hs, { children: "Customize Card" }),
+              /* @__PURE__ */ e.jsxs(We, { children: [
+                /* @__PURE__ */ e.jsx(ms, { children: /* @__PURE__ */ e.jsx(
+                  Pa,
+                  {
+                    onClick: () => {
+                      navigator.clipboard.writeText(c.id);
+                    },
+                    className: "size-3 cursor-pointer text-muted-foreground/70 transition-colors hover:text-muted-foreground"
+                  }
+                ) }),
+                /* @__PURE__ */ e.jsx(Pe, { side: "right", align: "center", children: /* @__PURE__ */ e.jsx("p", { className: "text-xs", children: "Copy Card ID" }) })
+              ] })
+            ] }),
+            /* @__PURE__ */ e.jsxs(us, { children: [
+              "See the configuration options and documentation",
+              /* @__PURE__ */ e.jsx(
+                "a",
+                {
+                  target: "_blank",
+                  className: "ml-1 text-blue-500 underline",
+                  href: "https://www.chartjs.org/docs/latest/samples/bar/vertical.html",
+                  children: "here."
+                }
+              )
+            ] })
+          ] }),
+          /* @__PURE__ */ e.jsxs("div", { className: "flex grow gap-2", children: [
+            /* @__PURE__ */ e.jsx(pt, { className: "w-1/2 rounded shadow-none" }),
+            /* @__PURE__ */ e.jsxs(ya, { defaultValue: "custom-config", className: "flex w-1/2 flex-col", children: [
+              /* @__PURE__ */ e.jsxs(va, { className: "justify-start rounded-sm rounded-b-none border border-b-0", children: [
+                /* @__PURE__ */ e.jsxs(Ls, { value: "custom-config", children: [
+                  m && /* @__PURE__ */ e.jsx(Na, { className: "mr-1 h-5 w-5 text-green-600" }),
+                  m ? "Custom Config" : "Default Config"
+                ] }),
+                /* @__PURE__ */ e.jsx(Ls, { className: "", value: "output", children: "Output" })
+              ] }),
+              /* @__PURE__ */ e.jsx(
+                Ds,
+                {
+                  className: "bg-red-x mt-0 grow rounded-b border border-t-0 p-2",
+                  value: "output",
+                  children: /* @__PURE__ */ e.jsx(
+                    et,
+                    {
+                      disabled: !0,
+                      value: t,
+                      className: "h-full resize-none border-none font-mono focus-visible:ring-0 focus-visible:ring-offset-0"
+                    }
+                  )
+                }
+              ),
+              /* @__PURE__ */ e.jsx(
+                Ds,
+                {
+                  className: "mt-0 grow rounded-b border border-t-0",
+                  value: "custom-config",
+                  children: /* @__PURE__ */ e.jsx(
+                    Be,
+                    {
+                      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: "json",
+                      value: C(),
+                      onChange: (v) => o(v)
+                    }
+                  )
+                }
+              )
+            ] })
+          ] }),
+          /* @__PURE__ */ e.jsxs(Bs, { className: "flex items-center", children: [
+            /* @__PURE__ */ e.jsx(_, { className: "mr-2 text-red-500", children: r }),
+            /* @__PURE__ */ e.jsx(
+              k,
+              {
+                disabled: !m,
+                onClick: j,
+                variant: "outline",
+                children: "Reset"
+              }
+            ),
+            /* @__PURE__ */ e.jsx(k, { onClick: p, variant: "outline", children: "Apply" }),
+            /* @__PURE__ */ e.jsx(k, { onClick: () => n(!1), variant: "outline", children: "Close" })
+          ] })
+        ]
+      }
+    )
+  ] });
+}
+function ft(s) {
+  return Ne({ tag: "svg", attr: { viewBox: "0 0 1024 1024" }, child: [{ tag: "path", attr: { d: "M926.8 397.1l-396-288a31.81 31.81 0 0 0-37.6 0l-396 288a31.99 31.99 0 0 0-11.6 35.8l151.3 466a32 32 0 0 0 30.4 22.1h489.5c13.9 0 26.1-8.9 30.4-22.1l151.3-466c4.2-13.2-.5-27.6-11.7-35.8zM838.6 417l-98.5 32-200-144.7V199.9L838.6 417zM466 567.2l-89.1 122.3-55.2-169.2L466 567.2zm-116.3-96.8L484 373.3v140.8l-134.3-43.7zM512 599.2l93.9 128.9H418.1L512 599.2zm28.1-225.9l134.2 97.1L540.1 514V373.3zM558 567.2l144.3-46.9-55.2 169.2L558 567.2zm-74-367.3v104.4L283.9 449l-98.5-32L484 199.9zM169.3 470.8l86.5 28.1 80.4 246.4-53.8 73.9-113.1-348.4zM327.1 853l50.3-69h269.3l50.3 69H327.1zm414.5-33.8l-53.8-73.9 80.4-246.4 86.5-28.1-113.1 348.4z" }, child: [] }] })(s);
+}
+function gt(s) {
+  return Ne({ tag: "svg", attr: { viewBox: "0 0 256 256", fill: "currentColor" }, child: [{ tag: "path", attr: { d: "M137.39,24.06A16,16,0,0,0,120,40V80.67a15.86,15.86,0,0,0,13.25,15.76A32,32,0,1,1,96,129.68c-.41-8.22,1.27-15,5-20.26h0a15.86,15.86,0,0,0-1.69-20.47L71.69,60.68a16,16,0,0,0-23.63,1.1A103.6,103.6,0,0,0,55,202.05,103.24,103.24,0,0,0,128,232h1.49A104.3,104.3,0,0,0,232,129.48C232.75,75.18,191.19,28.88,137.39,24.06ZM60.32,71.94l27.61,28.19,0,.06A43.29,43.29,0,0,0,80.44,120H40.36A87.13,87.13,0,0,1,60.32,71.94ZM40.37,136h40.3A48,48,0,0,0,120,175.34v40.3A88,88,0,0,1,40.37,136Zm149.77,54.14A87.45,87.45,0,0,1,136,215.61V175.34a47.55,47.55,0,0,0,24.73-12.23A48,48,0,0,0,136,80.66L136,40c45.52,4.08,80.67,43.28,80,89.25A87.45,87.45,0,0,1,190.14,190.14Z" }, child: [] }] })(s);
+}
+function jt(s) {
+  return Ne({ tag: "svg", attr: { viewBox: "0 0 256 256", fill: "currentColor" }, child: [{ tag: "path", attr: { d: "M128,24A104,104,0,1,0,232,128,104.11,104.11,0,0,0,128,24Zm87.63,96H191.48A64.1,64.1,0,0,0,136,64.52V40.37A88.13,88.13,0,0,1,215.63,120ZM120,120H80.68A48.09,48.09,0,0,1,120,80.68Zm0,16v39.32A48.09,48.09,0,0,1,80.68,136Zm16,0h39.32A48.09,48.09,0,0,1,136,175.32Zm0-16V80.68A48.09,48.09,0,0,1,175.32,120ZM120,40.37V64.52A64.1,64.1,0,0,0,64.52,120H40.37A88.13,88.13,0,0,1,120,40.37ZM40.37,136H64.52A64.1,64.1,0,0,0,120,191.48v24.15A88.13,88.13,0,0,1,40.37,136ZM136,215.63V191.48A64.1,64.1,0,0,0,191.48,136h24.15A88.13,88.13,0,0,1,136,215.63Z" }, child: [] }] })(s);
+}
+function bt(s) {
+  return Ne({ tag: "svg", attr: { viewBox: "0 0 24 24", strokeWidth: "2", stroke: "currentColor", fill: "none", strokeLinecap: "round", strokeLinejoin: "round" }, child: [{ tag: "path", attr: { stroke: "none", d: "M0 0h24v24H0z", fill: "none" }, child: [] }, { tag: "path", attr: { d: "M6 16m-3 0a3 3 0 1 0 6 0a3 3 0 1 0 -6 0" }, child: [] }, { tag: "path", attr: { d: "M16 19m-2 0a2 2 0 1 0 4 0a2 2 0 1 0 -4 0" }, child: [] }, { tag: "path", attr: { d: "M14.5 7.5m-4.5 0a4.5 4.5 0 1 0 9 0a4.5 4.5 0 1 0 -9 0" }, child: [] }] })(s);
+}
+function yt(s) {
+  return Ne({ tag: "svg", attr: { viewBox: "0 0 24 24" }, child: [{ tag: "path", attr: { fill: "none", d: "M0 0h24v24H0z" }, child: [] }, { tag: "path", attr: { d: "M4 9h4v11H4zM4 4h4v4H4zM10 7h4v4h-4zM16 10h4v4h-4zM16 15h4v5h-4zM10 12h4v8h-4z" }, child: [] }] })(s);
+}
+function vt(s) {
+  return Ne({ tag: "svg", attr: { version: "1.2", baseProfile: "tiny", viewBox: "0 0 24 24" }, child: [{ tag: "path", attr: { d: "M4 18c-.552 0-1-.448-1-1v-6.382l-.553.276c-.495.248-1.095.046-1.342-.447-.247-.494-.046-1.094.448-1.342l2-1c.31-.155.678-.139.973.044.294.183.474.504.474.851v8c0 .552-.448 1-1 1zM13 18h-5c-.404 0-.769-.244-.924-.617-.155-.374-.069-.804.217-1.09l4-4c.254-.254.394-.591.394-.95 0-.358-.14-.695-.394-.949-.508-.508-1.39-.508-1.9.001-.253.252-.393.589-.393.948 0 .552-.448 1-1 1s-1-.448-1-1c0-.894.348-1.733.98-2.364 1.265-1.263 3.464-1.263 4.727.001.632.631.979 1.471.979 2.363 0 .893-.348 1.733-.979 2.364l-2.293 2.293h2.586c.552 0 1 .448 1 1s-.448 1-1 1zM20.955 12.377c.338-.457.545-1.016.545-1.627 0-1.517-1.234-2.75-2.75-2.75-1.031 0-1.966.569-2.44 1.484-.254.49-.063 1.094.428 1.348.49.254 1.094.062 1.348-.428.128-.249.383-.404.664-.404.414 0 .75.336.75.75s-.336.75-.75.75c-.552 0-1 .448-1 1s.448 1 1 1c.689 0 1.25.561 1.25 1.25s-.561 1.25-1.25 1.25-1.25-.561-1.25-1.25c0-.552-.448-1-1-1s-1 .448-1 1c0 1.792 1.458 3.25 3.25 3.25s3.25-1.458 3.25-3.25c0-.939-.406-1.779-1.045-2.373z" }, child: [] }] })(s);
+}
+function Ln() {
+  const [s, n] = z(!1), t = i((d) => d.card.type), { setCardType: a, setCardPreferences: l } = i(
+    (d) => d.actions
+  ), o = i(
+    (d) => d.actions.setCardCustomCfg
+  );
+  function r(d) {
+    a(d), o(null), l({}), n(!1);
+  }
+  return /* @__PURE__ */ e.jsxs(Ie, { open: s, onOpenChange: n, children: [
+    /* @__PURE__ */ e.jsx(qe, { asChild: !0, children: /* @__PURE__ */ e.jsx(k, { size: "sm", variant: "outline", children: /* @__PURE__ */ e.jsx(Dn, { className: "h-4 w-4", chartType: t }) }) }),
+    /* @__PURE__ */ e.jsx(Ve, { className: "w-50", children: /* @__PURE__ */ e.jsxs("div", { className: "grid grid-cols-3 place-items-center", children: [
+      /* @__PURE__ */ e.jsx(
+        k,
+        {
+          onClick: () => r("bar"),
+          className: "font-normal",
+          variant: "ghost",
+          children: /* @__PURE__ */ e.jsx(vs, { className: "size-5" })
+        }
+      ),
+      /* @__PURE__ */ e.jsx(
+        k,
+        {
+          onClick: () => r("line"),
+          variant: "ghost",
+          children: /* @__PURE__ */ e.jsx(Ns, { className: "size-5" })
+        }
+      ),
+      /* @__PURE__ */ e.jsx(
+        k,
+        {
+          onClick: () => r("stackedBar"),
+          variant: "ghost",
+          children: /* @__PURE__ */ e.jsx(yt, { className: "size-5", strokeWidth: 0 })
+        }
+      ),
+      /* @__PURE__ */ e.jsx(
+        k,
+        {
+          onClick: () => r("scatter"),
+          variant: "ghost",
+          children: /* @__PURE__ */ e.jsx(ct, { className: "size-5" })
+        }
+      ),
+      /* @__PURE__ */ e.jsx(
+        k,
+        {
+          onClick: () => r("bubble"),
+          variant: "ghost",
+          children: /* @__PURE__ */ e.jsx(bt, { className: "size-4" })
+        }
+      ),
+      /* @__PURE__ */ e.jsx(
+        k,
+        {
+          onClick: () => r("pie"),
+          variant: "ghost",
+          children: /* @__PURE__ */ e.jsx(it, { className: "size-5" })
+        }
+      ),
+      /* @__PURE__ */ e.jsx(
+        k,
+        {
+          onClick: () => r("doughnut"),
+          variant: "ghost",
+          children: /* @__PURE__ */ e.jsx(gt, { className: "size-5", strokeWidth: 1 })
+        }
+      ),
+      /* @__PURE__ */ e.jsx(
+        k,
+        {
+          onClick: () => r("radar"),
+          variant: "ghost",
+          children: /* @__PURE__ */ e.jsx(
+            ft,
+            {
+              className: "size-5 font-extralight",
+              strokeWidth: 0.5
+            }
+          )
+        }
+      ),
+      /* @__PURE__ */ e.jsx(
+        k,
+        {
+          onClick: () => r("polarArea"),
+          variant: "ghost",
+          children: /* @__PURE__ */ e.jsx(jt, { className: "size-5" })
+        }
+      ),
+      /* @__PURE__ */ e.jsx(
+        k,
+        {
+          onClick: () => r("table"),
+          variant: "ghost",
+          children: /* @__PURE__ */ e.jsx(Cs, { className: "size-5" })
+        }
+      ),
+      /* @__PURE__ */ e.jsx(
+        k,
+        {
+          onClick: () => r("kpi"),
+          variant: "ghost",
+          children: /* @__PURE__ */ e.jsx(vt, { className: "size-6" })
+        }
+      )
+    ] }) })
+  ] });
+}
+function Dn({ chartType: s, className: n }) {
+  switch (s) {
+    case "bar":
+      return /* @__PURE__ */ e.jsx(vs, { className: n });
+    case "line":
+      return /* @__PURE__ */ e.jsx(Ns, { className: n });
+    case "pie":
+      return /* @__PURE__ */ e.jsx(it, { className: n });
+    case "radar":
+      return /* @__PURE__ */ e.jsx(ft, { className: n });
+    case "scatter":
+      return /* @__PURE__ */ e.jsx(ct, { className: n });
+    case "bubble":
+      return /* @__PURE__ */ e.jsx(bt, { className: n });
+    case "doughnut":
+      return /* @__PURE__ */ e.jsx(gt, { className: n });
+    case "stackedBar":
+      return /* @__PURE__ */ e.jsx(yt, { className: "size-4 text-foreground/70" });
+    case "polarArea":
+      return /* @__PURE__ */ e.jsx(jt, { className: n });
+    case "kpi":
+      return /* @__PURE__ */ e.jsx(vt, { className: n });
+    default:
+      return /* @__PURE__ */ e.jsx(Cs, { className: n });
+  }
+}
+function In() {
+  const s = i(
+    (t) => t.card.refreshInterval
+  ), n = i(
+    (t) => t.actions.setCardRefreshInterval
+  );
+  return /* @__PURE__ */ e.jsxs(Ie, { children: [
+    /* @__PURE__ */ e.jsx(qe, { asChild: !0, children: /* @__PURE__ */ e.jsx(k, { size: "sm", variant: "outline", children: /* @__PURE__ */ e.jsx(_a, { className: "w-4 h-4" }) }) }),
+    /* @__PURE__ */ e.jsx(Ve, { 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(_, { className: "col-span-3", htmlFor: "width", children: "Refresh Every" }),
+      /* @__PURE__ */ e.jsx(
+        Q,
+        {
+          value: s || "",
+          onChange: (t) => n(t.target.value),
+          id: "width",
+          placeholder: "30s",
+          className: "col-span-2 h-7 focus-visible:ring-1 focus-visible:ring-ring focus-visible:ring-offset-0"
+        }
+      )
+    ] }) }) }) })
+  ] });
+}
+function _s() {
+  i((r) => r.frame);
+  const s = i((r) => r.card), n = i((r) => r.card.data), t = i((r) => r.isShowingVisual), a = i((r) => r.isSqlRunning), l = i((r) => r.queryError), o = i((r) => r.pythonStdOut);
+  return i((r) => r.onSave), i((r) => r.onClose), i((r) => r.actions.setCardSql), i((r) => r.actions.setCardType), i((r) => r.actions.setSqlGen), s ? /* @__PURE__ */ e.jsxs("div", { className: "relative flex h-full flex-col pt-3", children: [
+    a && /* @__PURE__ */ e.jsx(Le, { 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: [
+      t && /* @__PURE__ */ e.jsxs("div", { className: "flex grow items-center gap-2", children: [
+        /* @__PURE__ */ e.jsx(Ln, {}),
+        /* @__PURE__ */ e.jsx(En, {}),
+        /* @__PURE__ */ e.jsx(In, {})
+      ] }),
+      /* @__PURE__ */ e.jsx(Vn, {})
+    ] }),
+    t ? 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(Ca, { isLoading: a, card: s }) }) }) : /* @__PURE__ */ e.jsx(pt, { 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(qn, {}),
+      s.data && s.data.length > 0 && /* @__PURE__ */ e.jsx(An, { data: n || [] }),
+      l && /* @__PURE__ */ e.jsx("span", { className: "font-mono text-sm", children: l })
+    ] })
+  ] }) : /* @__PURE__ */ e.jsx(e.Fragment, { children: "No Active Card" });
+}
+function qn() {
+  const s = i((t) => t.pythonStdOut);
+  if (!s)
+    return null;
+  const n = s.replace(/\n/g, "<br>");
+  return /* @__PURE__ */ e.jsxs(e.Fragment, { children: [
+    /* @__PURE__ */ e.jsx("p", { className: "font-mono text-sm", children: "Output:" }),
+    /* @__PURE__ */ e.jsx(
+      "div",
+      {
+        dangerouslySetInnerHTML: { __html: n },
+        className: "bg-muted p-2 font-mono text-sm"
+      }
+    ),
+    /* @__PURE__ */ e.jsx(tt, { className: "mb-2" })
+  ] });
+}
+function Vn() {
+  const s = i((t) => t.isShowingVisual), n = i(
+    (t) => t.actions.setIsShowingVisual
+  );
+  return /* @__PURE__ */ e.jsxs("div", { className: "flex items-center space-x-2", children: [
+    /* @__PURE__ */ e.jsx(_, { htmlFor: "visualize", children: "Chart" }),
+    /* @__PURE__ */ e.jsx(
+      Sa,
+      {
+        checked: s,
+        onCheckedChange: () => n(!s),
+        id: "visualize",
+        className: "data-[state=checked]:bg-foreground/50"
+      }
+    )
+  ] });
+}
+function ze() {
+  const [s, n] = z([]);
+  i(
+    (h) => h.card.cfg
+  );
+  const t = i((h) => h.card.preferences), { setCardCfg: a, setFilterOnClickColumnIndex: l, setCardPreferences: o } = i((h) => h.actions), r = i(
+    (h) => h.queryResultColumns
+  );
+  i(
+    (h) => {
+      var u;
+      return (u = h.card.preferences) == null ? void 0 : u.filterOnClickColumnIndex;
+    }
+  ), $(() => {
+    r && n(new Array(r.length).fill(!1));
+  }, [r]);
+  function d(h, u) {
+    var g, p;
+    u ? t != null && t.onClickFilter && ((g = t == null ? void 0 : t.onClickFilter) == null ? void 0 : g.length) > 0 ? o({
+      ...t,
+      onClickFilter: [
+        ...t.onClickFilter,
+        {
+          columnIndex: h,
+          expression: ""
+        }
+      ]
+    }) : o({
+      ...t,
+      onClickFilter: [
+        {
+          columnIndex: h,
+          expression: ""
+        }
+      ]
+    }) : (o({
+      ...t,
+      onClickFilter: (p = t == null ? void 0 : t.onClickFilter) == null ? void 0 : p.filter(
+        (j) => j.columnIndex !== h
+      )
+    }), n((j) => {
+      const C = [...j];
+      return C[h] = !1, C;
+    }));
+  }
+  function c(h, u) {
+    var p;
+    const g = (p = t == null ? void 0 : t.onClickFilter) == null ? void 0 : p.map((j) => j.columnIndex === h ? {
+      ...j,
+      expression: u.target.value
+    } : j);
+    o({
+      ...t,
+      onClickFilter: g
+    });
+  }
+  function m(h) {
+    var u, g, p, j;
+    if (s != null && s[h] || (g = (u = t == null ? void 0 : t.onClickFilter) == null ? void 0 : u.find((C) => C.columnIndex === h)) != null && g.expression)
+      return /* @__PURE__ */ e.jsx(
+        Q,
+        {
+          value: (j = (p = t == null ? void 0 : t.onClickFilter) == null ? void 0 : p.find((C) => C.columnIndex === h)) == null ? void 0 : j.expression,
+          onChange: (C) => c(h, C),
+          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: r == null ? void 0 : r.map((h, u) => {
+    var g, p;
+    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(
+              Qe,
+              {
+                checked: !!((g = t == null ? void 0 : t.onClickFilter) != null && g.find(
+                  (j) => j.columnIndex === u
+                )),
+                onCheckedChange: (j) => d(u, j)
+              }
+            ),
+            /* @__PURE__ */ e.jsx(
+              "label",
+              {
+                className: "text-sm font-medium leading-none peer-disabled:cursor-not-allowed peer-disabled:opacity-70",
+                children: h
+              }
+            ),
+            /* @__PURE__ */ e.jsx("div", { className: "flex gap-2 items-center ", children: ((p = t == null ? void 0 : t.onClickFilter) == null ? void 0 : p.find(
+              (j) => j.columnIndex === u
+            )) && /* @__PURE__ */ e.jsx(
+              lt,
+              {
+                onClick: () => {
+                  n((j) => {
+                    const C = [...j];
+                    return C[u] = !j[u], C;
+                  });
+                },
+                className: " invisible group-hover:visible size-3 text-gray-400 cursor-pointer"
+              }
+            ) })
+          ] }),
+          m(u)
+        ] })
+      },
+      h
+    );
+  }) });
+}
+function Ss() {
+  var o, r;
+  const s = i((d) => d.card.preferences), n = i(
+    (d) => d.card.cfg
+  ), { setCardCfg: t, setCardPreferences: a } = i(
+    (d) => d.actions
+  );
+  (o = n == null ? void 0 : n.options) != null && o.indexAxis;
+  function l(d) {
+    var h, u, g, p, j, C;
+    let c = {};
+    (h = s == null ? void 0 : s.chartOptions) != null && h.scales && (c = {
+      x: (g = (u = s == null ? void 0 : s.chartOptions) == null ? void 0 : u.scales) == null ? void 0 : g.y,
+      y: (j = (p = s == null ? void 0 : s.chartOptions) == null ? void 0 : p.scales) == null ? void 0 : j.x
+    });
+    const m = {
+      ...s,
+      chartOptions: {
+        ...s == null ? void 0 : s.chartOptions,
+        scales: {
+          ...(C = s == null ? void 0 : s.chartOptions) == null ? void 0 : C.scales,
+          ...c
+        },
+        indexAxis: d
+      }
+    };
+    a(m);
+  }
+  return /* @__PURE__ */ e.jsxs(
+    at,
+    {
+      value: ((r = s == null ? void 0 : s.chartOptions) == null ? void 0 : r.indexAxis) || "x",
+      onValueChange: l,
+      className: "flex gap-3",
+      defaultValue: "x",
+      children: [
+        /* @__PURE__ */ e.jsxs("div", { className: "flex items-center space-x-2", children: [
+          /* @__PURE__ */ e.jsx(Ue, { 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(Ue, { value: "y", id: "r2" }),
+          /* @__PURE__ */ e.jsx("label", { className: "text-sm", htmlFor: "r2", children: "Horizontal" })
+        ] })
+      ]
+    }
+  );
+}
+const be = "focus-visible:ring-0 focus-visible:ring-ring focus-visible:ring-offset-0";
+function Hs(s) {
+  var t, a, l;
+  const n = nt(s);
+  return ((l = (a = (t = s == null ? void 0 : s.chartOptions) == null ? void 0 : t.scales) == null ? void 0 : a[n]) == null ? void 0 : l.type) || "linear";
+}
+function Rn() {
+  var H, I, ee, P, se, X;
+  const [s, n] = z(!1), t = i((w) => {
+    var F;
+    return (F = w.card) == null ? void 0 : F.preferences;
+  }), a = nt(t), [l, o] = z(
+    Hs(t)
+  ), [r, d] = z(
+    ((ee = (I = (H = t == null ? void 0 : t.chartOptions) == null ? void 0 : H.scales) == null ? void 0 : I[a]) == null ? void 0 : ee.min) || ""
+  ), [c, m] = z(
+    ((X = (se = (P = t == null ? void 0 : t.chartOptions) == null ? void 0 : P.scales) == null ? void 0 : se[a]) == null ? void 0 : X.max) || ""
+  ), [h, u] = z(r || c ? "custom" : "auto"), [g, p] = z(""), [j, C] = z(""), [v, y] = z(""), [D, A] = z(""), [f, O] = z(""), T = i(
+    (w) => w.actions.setCardPreferences
+  );
+  $(() => {
+    var w, F, b, L, K, B, de, te, xe, pe, fe, he, J, ae;
+    o(Hs(t)), d(
+      ((b = (F = (w = t == null ? void 0 : t.chartOptions) == null ? void 0 : w.scales) == null ? void 0 : F[a]) == null ? void 0 : b.min) === 0 ? 0 : ""
+    ), m(((B = (K = (L = t == null ? void 0 : t.chartOptions) == null ? void 0 : L.scales) == null ? void 0 : K[a]) == null ? void 0 : B.max) || ""), p(
+      ((pe = (xe = (te = (de = t == null ? void 0 : t.chartOptions) == null ? void 0 : de.scales) == null ? void 0 : te[a]) == null ? void 0 : xe.ticks) == null ? void 0 : pe.stepSize) || ""
+    ), C(((fe = t == null ? void 0 : t.numberAxisFormat) == null ? void 0 : fe.format) || ""), y(((he = t == null ? void 0 : t.numberAxisFormat) == null ? void 0 : he.suffix) || ""), A(((J = t == null ? void 0 : t.numberAxisFormat) == null ? void 0 : J.currency) || ""), O(((ae = t == null ? void 0 : t.numberAxisFormat) == null ? void 0 : ae.locale) || "");
+  }, [s, t, a]);
+  function E(w, F) {
+    return F === "" || /^[0-9\b]+$/.test(F) ? Number(F) : Number(w);
+  }
+  function U() {
+    return /* @__PURE__ */ e.jsxs(e.Fragment, { children: [
+      /* @__PURE__ */ e.jsxs("div", { className: "grid grid-cols-9 items-center gap-2", children: [
+        /* @__PURE__ */ e.jsx(_, { className: "col-span-3", htmlFor: "format", children: "Format" }),
+        /* @__PURE__ */ e.jsx(
+          Q,
+          {
+            value: j,
+            placeholder: "000,0.00",
+            onChange: (w) => C(w.target.value),
+            id: "format",
+            className: `col-span-4 h-8 w-full tracking-wide ${be}`
+          }
+        ),
+        /* @__PURE__ */ e.jsx(
+          Q,
+          {
+            value: v,
+            placeholder: "M",
+            onChange: (w) => y(w.target.value),
+            id: "unit",
+            className: `col-span-2 h-8 w-full ${be}`
+          }
+        )
+      ] }),
+      /* @__PURE__ */ e.jsxs("div", { className: "grid grid-cols-6 items-center gap-2", children: [
+        /* @__PURE__ */ e.jsx(
+          _,
+          {
+            className: "col-span-2 hover:cursor-pointer hover:underline",
+            htmlFor: "currency",
+            children: /* @__PURE__ */ e.jsx(
+              "a",
+              {
+                target: "_blank",
+                href: "https://developer.mozilla.org/en-US/docs/Web/JavaScript/Reference/Global_Objects/Intl/NumberFormat",
+                children: "Currency"
+              }
+            )
+          }
+        ),
+        /* @__PURE__ */ e.jsx(
+          Q,
+          {
+            value: D,
+            placeholder: "USD",
+            onChange: (w) => A(w.target.value),
+            id: "currency",
+            className: `col-span-2 h-8 w-full ${be}`
+          }
+        ),
+        /* @__PURE__ */ e.jsx(
+          Q,
+          {
+            value: f,
+            placeholder: "en-US",
+            onChange: (w) => O(w.target.value),
+            id: "locale",
+            className: `col-span-2 h-8 w-full ${be}`
+          }
+        )
+      ] })
+    ] });
+  }
+  function Z() {
+    return /* @__PURE__ */ e.jsxs(e.Fragment, { children: [
+      /* @__PURE__ */ e.jsxs("div", { className: "grid grid-cols-3 items-center gap-2", children: [
+        /* @__PURE__ */ e.jsx(_, { htmlFor: "range", children: "Range" }),
+        /* @__PURE__ */ e.jsx(
+          Q,
+          {
+            id: "min",
+            value: r,
+            onChange: (w) => d((F) => E(F, w.target.value)),
+            className: `col-span-1 h-8 w-full ${be}`
+          }
+        ),
+        /* @__PURE__ */ e.jsx(
+          Q,
+          {
+            value: c,
+            onChange: (w) => m((F) => E(F, w.target.value)),
+            id: "max",
+            className: `col-span-1 h-8 w-full ${be}`
+          }
+        )
+      ] }),
+      /* @__PURE__ */ e.jsxs("div", { className: "grid grid-cols-3 items-center gap-2", children: [
+        /* @__PURE__ */ e.jsx(_, { htmlFor: "step-size", children: "Step Size" }),
+        /* @__PURE__ */ e.jsx(
+          Q,
+          {
+            value: g,
+            onChange: (w) => p((F) => E(F, w.target.value)),
+            id: "step-size",
+            className: `col-span-1 h-8 w-full ${be}`
+          }
+        )
+      ] })
+    ] });
+  }
+  function G() {
+    var b;
+    let w = {};
+    h === "custom" && (w = {
+      min: r,
+      max: c,
+      ticks: {
+        stepSize: g
+      }
+    });
+    const F = {
+      ...t || {},
+      chartOptions: {
+        ...t == null ? void 0 : t.chartOptions,
+        scales: {
+          ...(b = t == null ? void 0 : t.chartOptions) == null ? void 0 : b.scales,
+          [a]: {
+            // ...cardPreferences?.chartOptions?.scales?.[axis],
+            type: l,
+            ...l === "linear" ? w : {}
+          }
+        }
+      },
+      numberAxisFormat: {
+        format: j,
+        suffix: v,
+        currency: D,
+        locale: f
+      }
+    };
+    T(F);
+  }
+  return /* @__PURE__ */ e.jsxs(Ie, { onOpenChange: (w) => n(w), children: [
+    /* @__PURE__ */ e.jsx(qe, { asChild: !0, children: /* @__PURE__ */ e.jsx(ka, { className: "size-4 cursor-pointer text-muted-foreground hover:text-foreground" }) }),
+    /* @__PURE__ */ e.jsx(Ve, { 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(_, { htmlFor: "scale", children: "Type" }),
+          /* @__PURE__ */ e.jsxs(
+            xs,
+            {
+              value: l,
+              onValueChange: (w) => o(w),
+              children: [
+                /* @__PURE__ */ e.jsx(ps, { className: "col-span-2 h-8 w-full focus:ring-1 focus:ring-offset-0", children: /* @__PURE__ */ e.jsx(fs, {}) }),
+                /* @__PURE__ */ e.jsx(gs, { id: "type", children: /* @__PURE__ */ e.jsxs(js, { children: [
+                  /* @__PURE__ */ e.jsx(Ke, { children: "Option" }),
+                  /* @__PURE__ */ e.jsx(me, { value: "linear", children: "Linear" }),
+                  /* @__PURE__ */ e.jsx(me, { value: "logarithmic", children: "Logarithmic" })
+                ] }) })
+              ]
+            }
+          )
+        ] }),
+        l == "linear" && /* @__PURE__ */ e.jsxs("div", { className: "grid grid-cols-3 items-center gap-2 py-1", children: [
+          /* @__PURE__ */ e.jsx(_, { htmlFor: "scale-option", children: "Setup" }),
+          /* @__PURE__ */ e.jsxs(
+            at,
+            {
+              id: "scale-option",
+              value: h,
+              onValueChange: (w) => u(w),
+              className: "col-span-2 flex gap-3",
+              defaultValue: "x",
+              children: [
+                /* @__PURE__ */ e.jsxs("div", { className: "flex items-center space-x-2", children: [
+                  /* @__PURE__ */ e.jsx(Ue, { value: "auto", id: "r1" }),
+                  /* @__PURE__ */ e.jsx("label", { className: "text-sm", htmlFor: "r1", children: "Auto" })
+                ] }),
+                /* @__PURE__ */ e.jsxs("div", { className: "flex items-center space-x-2", children: [
+                  /* @__PURE__ */ e.jsx(Ue, { value: "custom", id: "r2" }),
+                  /* @__PURE__ */ e.jsx("label", { className: "text-sm", htmlFor: "r2", children: "Custom" })
+                ] })
+              ]
+            }
+          )
+        ] }),
+        h === "custom" && l == "linear" && Z(),
+        U(),
+        /* @__PURE__ */ e.jsx(wa, {}),
+        /* @__PURE__ */ e.jsx("div", { className: "grid grid-cols-3", children: /* @__PURE__ */ e.jsx(
+          k,
+          {
+            onClick: G,
+            variant: "secondary",
+            className: "col-span-1 col-start-3 h-8 w-full",
+            children: "Apply"
+          }
+        ) })
+      ] })
+    ] }) })
+  ] });
+}
+function _n({ idx: s }) {
+  var d;
+  const n = i((c) => {
+    var m;
+    return (m = c.card) == null ? void 0 : m.preferences;
+  }), t = i(
+    (c) => {
+      var m;
+      return (m = c.card.preferences) == null ? void 0 : m.datasetOptions;
+    }
+  ), a = i(
+    (c) => c.actions.setCardPreferences
+  ), l = (d = n == null ? void 0 : n.chartOptions) == null ? void 0 : d.indexAxis, o = t == null ? void 0 : t.find((c) => c.idx === s);
+  function r(c, m) {
+    (c === "end" || c === "start") && Oa(za());
+    const h = {
+      display: c !== "none",
+      align: c,
+      anchor: c,
+      clamp: !0
+    };
+    if (!o)
+      a({
+        ...n,
+        datasetOptions: [
+          ...t || [],
+          {
+            idx: m,
+            datalabels: h
+          }
+        ]
+      });
+    else {
+      const u = { ...o };
+      u.datalabels = h;
+      const g = t == null ? void 0 : t.map(
+        (p) => p.idx === m ? u : p
+      );
+      a({
+        ...n,
+        datasetOptions: g
+      });
+    }
+  }
+  return /* @__PURE__ */ e.jsxs(Ie, { children: [
+    /* @__PURE__ */ e.jsx(qe, { children: /* @__PURE__ */ e.jsx(ln, { className: "invisible size-4 rotate-[135deg] cursor-pointer text-muted-foreground hover:text-foreground group-hover:visible" }) }),
+    /* @__PURE__ */ e.jsx(Ve, { className: "w-fit p-1", children: /* @__PURE__ */ e.jsxs("div", { className: "flex gap-1", children: [
+      /* @__PURE__ */ e.jsx(
+        k,
+        {
+          onClick: () => r("none", s),
+          size: "sm",
+          variant: "secondary",
+          className: "h-7 p-1 text-xs font-normal",
+          children: /* @__PURE__ */ e.jsx(Fa, { className: "size-4" })
+        }
+      ),
+      /* @__PURE__ */ e.jsx(
+        k,
+        {
+          onClick: () => r("start", s),
+          size: "sm",
+          variant: "secondary",
+          className: "h-7 p-1 text-xs font-normal",
+          children: /* @__PURE__ */ e.jsx(
+            Ya,
+            {
+              className: W("h-4 w-4", {
+                "rotate-90": l === "y"
+              })
+            }
+          )
+        }
+      ),
+      /* @__PURE__ */ e.jsx(
+        k,
+        {
+          onClick: () => r("center", s),
+          size: "sm",
+          variant: "secondary",
+          className: "h-7 p-1 text-xs font-normal",
+          children: /* @__PURE__ */ e.jsx(
+            Za,
+            {
+              className: W("h-4 w-4", {
+                "rotate-90": l === "y"
+              })
+            }
+          )
+        }
+      ),
+      /* @__PURE__ */ e.jsx(
+        k,
+        {
+          onClick: () => r("end", s),
+          size: "sm",
+          variant: "secondary",
+          className: "h-7 p-1 text-xs font-normal",
+          children: /* @__PURE__ */ e.jsx(
+            Xa,
+            {
+              className: W("h-4 w-4", {
+                "rotate-90": l === "y"
+              })
+            }
+          )
+        }
+      )
+    ] }) })
+  ] });
+}
+function Nt() {
+  const s = i((c) => c.card), n = i(
+    (c) => {
+      var m, h, u;
+      return (u = (h = (m = c == null ? void 0 : c.card) == null ? void 0 : m.preferences) == null ? void 0 : h.chartOptions) == null ? void 0 : u.indexAxis;
+    }
+  ), t = n === "y" ? "Y axis" : "X axis", a = n === "y" ? "X axis" : "Y axis", {
+    keys: l,
+    metricKeys: o,
+    dimensionKeys: r
+  } = ns(s.data || []);
+  let d = o;
+  if (s.type === "stackedBar") {
+    const c = Ma({
+      dataArray: s.data || [],
+      groupKey: r[0],
+      pivotKey: r[1],
+      valueKey: d[0]
+    }), { metricKeys: m } = ns(c);
+    d = m;
+  }
+  return l.length === 0 ? null : /* @__PURE__ */ e.jsxs("div", { className: "space-y-4", children: [
+    /* @__PURE__ */ e.jsxs("div", { className: "space-y-2", children: [
+      /* @__PURE__ */ e.jsx(_, { children: t }),
+      /* @__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: r[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(_, { children: a }),
+        /* @__PURE__ */ e.jsx(Rn, {})
+      ] }),
+      /* @__PURE__ */ e.jsx("div", { className: "my-1 space-y-1", children: d.map((c, m) => /* @__PURE__ */ e.jsx(Hn, { col: c, idx: m }, c)) })
+    ] })
+  ] });
+}
+function Hn({ col: s, idx: n }) {
+  const t = i((d) => {
+    var c;
+    return (c = d.card) == null ? void 0 : c.preferences;
+  }), a = i(
+    (d) => {
+      var c;
+      return (c = d.card.preferences) == null ? void 0 : c.datasetOptions;
+    }
+  ), l = a == null ? void 0 : a.find((d) => d.idx === n), { setCardPreferences: o } = i((d) => d.actions);
+  function r(d) {
+    if (!l)
+      o({
+        ...t,
+        datasetOptions: [
+          ...a || [],
+          {
+            idx: n,
+            type: d === "area" ? "line" : d,
+            fill: d === "area" ? "origin" : ""
+          }
+        ]
+      });
+    else {
+      const c = { ...l };
+      c.type = d === "area" ? "line" : d, c.fill = d === "area" ? "origin" : "";
+      const m = a == null ? void 0 : a.map(
+        (h) => h.idx === n ? c : h
+      );
+      o({
+        ...t,
+        datasetOptions: m
+      });
+    }
+  }
+  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(
+        vs,
+        {
+          onClick: () => r("bar"),
+          className: "invisible size-4 cursor-pointer text-muted-foreground hover:text-foreground group-hover:visible"
+        }
+      ),
+      /* @__PURE__ */ e.jsx(
+        Ns,
+        {
+          onClick: () => r("line"),
+          className: "invisible size-4 cursor-pointer text-muted-foreground hover:text-foreground group-hover:visible"
+        }
+      ),
+      /* @__PURE__ */ e.jsx(
+        Ha,
+        {
+          onClick: () => r("area"),
+          className: "invisible size-4 cursor-pointer text-muted-foreground hover:text-foreground group-hover:visible"
+        }
+      ),
+      /* @__PURE__ */ e.jsx(
+        tt,
+        {
+          orientation: "vertical",
+          className: "invisible size-4 cursor-pointer py-2 text-muted-foreground hover:text-foreground group-hover:visible"
+        }
+      ),
+      /* @__PURE__ */ e.jsx(_n, { idx: n })
+    ] })
+  ] });
+}
+function Bn({
+  cardType: s
+}) {
+  return /* @__PURE__ */ e.jsx("div", { className: "space-y-6 px-6 py-2", children: /* @__PURE__ */ e.jsxs(ve, { defaultValue: ["item-2"], type: "multiple", children: [
+    /* @__PURE__ */ e.jsxs(q, { value: "item-1", children: [
+      /* @__PURE__ */ e.jsx(V, { children: `${ys(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(Nt, {})
+      ] })
+    ] }),
+    /* @__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(ze, {}) })
+    ] })
+  ] }) });
+}
+function ks() {
+  var a, l, o;
+  const s = i(
+    (r) => r.card.cfg
+  ), n = i((r) => r.actions.setCardCfg);
+  function t(r) {
+    var m;
+    const d = {
+      datalabels: {
+        display: r !== "none",
+        align: r,
+        anchor: r,
+        clamp: !0
+      }
+    }, c = {
+      ...s,
+      options: {
+        ...s == null ? void 0 : s.options,
+        plugins: {
+          ...(m = s == null ? void 0 : s.options) == null ? void 0 : m.plugins,
+          ...d
+        }
+      }
+    };
+    n(c), console.log(r);
+  }
+  return /* @__PURE__ */ e.jsxs("div", { className: "space-y-2", children: [
+    /* @__PURE__ */ e.jsx("label", { className: "font-medium", children: "Data Labels" }),
+    /* @__PURE__ */ e.jsxs(
+      xs,
+      {
+        value: (o = (l = (a = s == null ? void 0 : s.options) == null ? void 0 : a.plugins) == null ? void 0 : l.datalabels) == null ? void 0 : o.anchor,
+        onValueChange: t,
+        defaultValue: "none",
+        children: [
+          /* @__PURE__ */ e.jsx(ps, { className: "h-8 w-[180px] focus:ring-1 focus:ring-offset-0", children: /* @__PURE__ */ e.jsx(fs, { placeholder: "Select position" }) }),
+          /* @__PURE__ */ e.jsx(gs, { children: /* @__PURE__ */ e.jsxs(js, { children: [
+            /* @__PURE__ */ e.jsx(Ke, { children: "Data Labels" }),
+            /* @__PURE__ */ e.jsx(me, { value: "none", children: "None" }),
+            /* @__PURE__ */ e.jsx(me, { value: "start", children: "Start" }),
+            /* @__PURE__ */ e.jsx(me, { value: "center", children: "Center" }),
+            /* @__PURE__ */ e.jsx(me, { value: "end", children: "End" })
+          ] }) })
+        ]
+      }
+    )
+  ] });
+}
+function $n({
+  cardType: s
+}) {
+  function n(t) {
+    const a = "SELECT label, [group], x-axis, y-axis, radius FROM table", l = "SELECT label, [group], x-axis, y-axis FROM table";
+    return /* @__PURE__ */ e.jsxs(e.Fragment, { children: [
+      /* @__PURE__ */ e.jsx("div", { className: "bg-muted px-2 py-1 rounded    text-xs", children: t === "bubble" ? a : l }),
+      /* @__PURE__ */ e.jsxs("ul", { className: " ml-6 list-disc [&>li]:mt-2 text-xs", children: [
+        /* @__PURE__ */ e.jsx("li", { children: "label - category" }),
+        /* @__PURE__ */ e.jsx("li", { children: "group - category" }),
+        /* @__PURE__ */ e.jsx("li", { children: "x-axis - category" }),
+        /* @__PURE__ */ e.jsx("li", { children: "y-axis - category" }),
+        t === "bubble" && /* @__PURE__ */ e.jsx("li", { children: "radius - number" })
+      ] }),
+      /* @__PURE__ */ e.jsxs("div", { children: [
+        "See ",
+        /* @__PURE__ */ e.jsx(
+          "a",
+          {
+            target: "_blank",
+            onClick: (o) => o.stopPropagation(),
+            className: "text-blue-700",
+            href: "https://docs.semaphor.cloud/concepts/visuals#pie-chart",
+            children: "example"
+          }
+        ),
+        " in the docs."
+      ] })
+    ] });
+  }
+  return /* @__PURE__ */ e.jsx("div", { className: "px-6 py-2 space-y-6", children: /* @__PURE__ */ e.jsxs(ve, { defaultValue: ["item-2"], type: "multiple", children: [
+    /* @__PURE__ */ e.jsxs(q, { value: "item-1", children: [
+      /* @__PURE__ */ e.jsx(V, { children: `${ys(s)} Chart` }),
+      /* @__PURE__ */ e.jsx(R, { 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(q, { value: "item-3", children: [
+      /* @__PURE__ */ e.jsx(V, { children: "Filter on click" }),
+      /* @__PURE__ */ e.jsx(R, { className: "px-2", children: /* @__PURE__ */ e.jsx(ze, {}) })
+    ] })
+  ] }) });
+}
+const Kn = {
+  datasets: [
+    {
+      type: "line",
+      label: "Sum_sales",
+      data: []
+    },
+    {
+      type: "bar",
+      label: "Sum_profit",
+      data: []
+    }
+  ]
+}, Un = {
+  datasets: [
+    {
+      fill: "origin",
+      type: "line",
+      label: "Sum_sales",
+      data: []
+    }
+  ]
+};
+function Gn() {
+  const s = i((n) => n.card.type);
+  return /* @__PURE__ */ e.jsxs("div", { className: "p-6 space-y-6", children: [
+    /* @__PURE__ */ e.jsx(
+      ve,
+      {
+        className: " ",
+        type: "single",
+        collapsible: !0,
+        children: Jn(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(ze, {}) })
+  ] });
+}
+function Jn(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.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("p", { children: [
+            "Click ",
+            /* @__PURE__ */ e.jsx("b", { children: "Customize" }),
+            " and change the `type` property in the dataset."
+          ] }),
+          /* @__PURE__ */ e.jsx("pre", { children: JSON.stringify(Kn, 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("p", { children: [
+            "Click ",
+            /* @__PURE__ */ e.jsx("b", { children: "Customize" }),
+            " and add `fill` property to the dataset. See",
+            /* @__PURE__ */ e.jsx(
+              "a",
+              {
+                className: "text-blue-500 hover:underline mx-1",
+                href: "https://www.chartjs.org/docs/latest/samples/area/line-boundaries.html",
+                target: "_blank",
+                children: "docs"
+              }
+            ),
+            "for more options."
+          ] }),
+          /* @__PURE__ */ e.jsx("pre", { children: JSON.stringify(Un, 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: [
+        "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.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)" }),
+          /* @__PURE__ */ e.jsx("li", { children: "Y-axis - Number (ex. avg. weight)" }),
+          /* @__PURE__ */ e.jsx("li", { children: "Radius - Number (ex. population)" })
+        ] })
+      ] })
+    ] }) });
+  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: [
+        "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.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)" }),
+          /* @__PURE__ */ e.jsx("li", { children: "Y-axis - Number (ex. avg. weight)" })
+        ] })
+      ] })
+    ] }) });
+  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: [
+        /* @__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.jsx("li", { children: "Label - Category (ex. city)" }),
+          /* @__PURE__ */ e.jsx("li", { children: "Measure - Number (ex. population)" })
+        ] })
+      ] })
+    ] }) });
+}
+function Qn() {
+  var r, d, c;
+  const s = i((m) => m.card.preferences), n = i(
+    (m) => m.actions.setCardPreferences
+  ), t = i(
+    (m) => m.actions.setNumberFormat
+  ), a = i(
+    (m) => {
+      var h, u;
+      return (u = (h = m.card.preferences) == null ? void 0 : h.formatNumber) == null ? void 0 : u.format;
+    }
+  ), l = i(
+    (m) => {
+      var h, u;
+      return (u = (h = m.card.preferences) == null ? void 0 : h.formatNumber) == null ? void 0 : u.locale;
+    }
+  ), o = i(
+    (m) => {
+      var h, u;
+      return (u = (h = m.card.preferences) == null ? void 0 : h.formatNumber) == null ? void 0 : u.currency;
+    }
+  );
+  return i(
+    (m) => m.actions.setFilterOnClickField
+  ), /* @__PURE__ */ e.jsxs("div", { children: [
+    /* @__PURE__ */ e.jsxs("div", { className: "mb-3 flex items-center gap-2", children: [
+      /* @__PURE__ */ e.jsx(
+        Qe,
+        {
+          checked: !!((r = s == null ? void 0 : s.formatNumber) != null && r.enabled),
+          onCheckedChange: (m) => {
+            n({
+              ...s,
+              formatNumber: {
+                ...s == null ? void 0 : s.formatNumber,
+                enabled: m
+              }
+            });
+          }
+        }
+      ),
+      /* @__PURE__ */ e.jsx(_, { children: "Format Number" })
+    ] }),
+    ((d = s == null ? void 0 : s.formatNumber) == null ? void 0 : d.enabled) === !0 && /* @__PURE__ */ e.jsxs("div", { className: "flex flex-col gap-2", children: [
+      /* @__PURE__ */ e.jsxs("div", { children: [
+        /* @__PURE__ */ e.jsx(_, { className: "text-xs", children: "Currency" }),
+        /* @__PURE__ */ e.jsxs("div", { className: "flex gap-1", children: [
+          /* @__PURE__ */ e.jsx(
+            Q,
+            {
+              value: o || "",
+              className: "h-7 font-mono text-xs focus-visible:ring-0 focus-visible:ring-ring focus-visible:ring-offset-0",
+              placeholder: "USD",
+              onChange: (m) => {
+                var h, u, g;
+                return t(
+                  ((h = s == null ? void 0 : s.formatNumber) == null ? void 0 : h.format) || "",
+                  m.target.value,
+                  ((u = s == null ? void 0 : s.formatNumber) == null ? void 0 : u.locale) || "",
+                  ((g = s == null ? void 0 : s.formatNumber) == null ? void 0 : g.suffix) || ""
+                );
+              }
+            }
+          ),
+          /* @__PURE__ */ e.jsx(
+            Q,
+            {
+              value: l || "",
+              className: "h-7 font-mono text-xs focus-visible:ring-0 focus-visible:ring-ring focus-visible:ring-offset-0",
+              placeholder: "en-US",
+              onChange: (m) => {
+                var h, u, g;
+                return t(
+                  ((h = s == null ? void 0 : s.formatNumber) == null ? void 0 : h.format) || "",
+                  ((u = s == null ? void 0 : s.formatNumber) == null ? void 0 : u.currency) || "",
+                  m.target.value,
+                  ((g = s == null ? void 0 : s.formatNumber) == null ? void 0 : g.suffix) || ""
+                );
+              }
+            }
+          )
+        ] })
+      ] }),
+      /* @__PURE__ */ e.jsxs("div", { children: [
+        /* @__PURE__ */ e.jsxs("div", { className: "flex gap-1", children: [
+          /* @__PURE__ */ e.jsx(_, { className: "text-xs", children: "Format" }),
+          /* @__PURE__ */ e.jsxs(We, { children: [
+            /* @__PURE__ */ e.jsx(ms, { children: /* @__PURE__ */ e.jsx(
+              Zs,
+              {
+                strokeWidth: 1,
+                className: "h-3 w-3 opacity-70"
+              }
+            ) }),
+            /* @__PURE__ */ e.jsx(Pe, { children: /* @__PURE__ */ e.jsxs("div", { className: "max-w-[200px]", children: [
+              "Format number",
+              /* @__PURE__ */ e.jsx("div", { className: "mt-1 font-mono text-xs", children: "#.## for 123.43" })
+            ] }) })
+          ] })
+        ] }),
+        /* @__PURE__ */ e.jsx("div", { children: /* @__PURE__ */ e.jsx(
+          Q,
+          {
+            value: a || "",
+            className: "h-7 font-mono text-xs focus-visible:ring-0 focus-visible:ring-ring focus-visible:ring-offset-0",
+            placeholder: "###,###.##",
+            onChange: (m) => {
+              var h, u, g;
+              return t(
+                m.target.value,
+                ((h = s == null ? void 0 : s.formatNumber) == null ? void 0 : h.currency) || "",
+                ((u = s == null ? void 0 : s.formatNumber) == null ? void 0 : u.locale) || "",
+                ((g = s == null ? void 0 : s.formatNumber) == null ? void 0 : g.suffix) || ""
+              );
+            }
+          }
+        ) })
+      ] }),
+      /* @__PURE__ */ e.jsxs("div", { children: [
+        /* @__PURE__ */ e.jsx(_, { className: "text-xs", children: "Suffix" }),
+        /* @__PURE__ */ e.jsx(
+          Q,
+          {
+            value: ((c = s == null ? void 0 : s.formatNumber) == null ? void 0 : c.suffix) || "",
+            className: "h-7 font-mono text-xs focus-visible:ring-0 focus-visible:ring-ring focus-visible:ring-offset-0",
+            placeholder: "K, M, B",
+            onChange: (m) => {
+              var h, u, g;
+              return t(
+                ((h = s == null ? void 0 : s.formatNumber) == null ? void 0 : h.format) || "",
+                ((u = s == null ? void 0 : s.formatNumber) == null ? void 0 : u.currency) || "",
+                ((g = s == null ? void 0 : s.formatNumber) == null ? void 0 : g.locale) || "",
+                m.target.value
+              );
+            }
+          }
+        )
+      ] })
+    ] })
+  ] });
+}
+function Wn() {
+  return /* @__PURE__ */ e.jsxs("div", { className: "space-y-6 px-6 py-2", children: [
+    /* @__PURE__ */ e.jsx(ve, { 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("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" }),
+          /* @__PURE__ */ e.jsx("li", { children: "previous - number" })
+        ] }),
+        /* @__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#kpi",
+              children: "example"
+            }
+          ),
+          " in the docs."
+        ] })
+      ] })
+    ] }) }),
+    /* @__PURE__ */ e.jsx("section", { className: "", children: /* @__PURE__ */ e.jsx(Qn, {}) }),
+    /* @__PURE__ */ e.jsx("div", {}),
+    /* @__PURE__ */ e.jsx("div", {})
+  ] });
+}
+function Pn({
+  cardType: s
+}) {
+  return /* @__PURE__ */ e.jsx("div", { className: "px-6 py-2 space-y-6", children: /* @__PURE__ */ e.jsxs(ve, { defaultValue: ["item-2"], type: "multiple", children: [
+    /* @__PURE__ */ e.jsxs(q, { value: "item-1", children: [
+      /* @__PURE__ */ e.jsx(V, { children: `${ys(s)} Chart` }),
+      /* @__PURE__ */ e.jsxs(R, { className: " space-y-4 font-mono text-xs ", children: [
+        /* @__PURE__ */ e.jsx("div", { className: "bg-muted px-2 py-1 rounded    text-xs", children: "SELECT label, measure FROM table" }),
+        /* @__PURE__ */ e.jsxs("ul", { className: " ml-6 list-disc [&>li]:mt-2 text-xs", children: [
+          /* @__PURE__ */ e.jsx("li", { children: "label - category" }),
+          /* @__PURE__ */ e.jsx("li", { children: "measure - 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#pie-chart",
+              children: "example"
+            }
+          ),
+          " in the docs."
+        ] })
+      ] })
+    ] }),
+    /* @__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(q, { value: "item-3", children: [
+      /* @__PURE__ */ e.jsx(V, { children: "Filter on click" }),
+      /* @__PURE__ */ e.jsx(R, { className: "px-2", children: /* @__PURE__ */ e.jsx(ze, {}) })
+    ] })
+  ] }) });
+}
+function Yn() {
+  return /* @__PURE__ */ e.jsx("div", { className: "space-y-6 px-6 py-2", children: /* @__PURE__ */ e.jsxs(ve, { 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: [
+        /* @__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" }),
+          /* @__PURE__ */ e.jsx("li", { children: "stack by - category" }),
+          /* @__PURE__ */ e.jsx("li", { children: "y-axis - number" })
+        ] }),
+        /* @__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#stacked-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(Nt, {})
+      ] })
+    ] }),
+    /* @__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(ze, {}) })
+    ] })
+  ] }) });
+}
+function Xn({
+  cardType: s
+}) {
+  return console.log("TableVisualSettings", s), /* @__PURE__ */ e.jsx("div", { className: "space-y-6 px-6 py-2", children: /* @__PURE__ */ e.jsx(ve, { 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(ze, {}) })
+  ] }) }) });
+}
+function Zn() {
+  const s = i((t) => t.card.type);
+  function n(t) {
+    switch (t) {
+      case "stackedBar":
+        return /* @__PURE__ */ e.jsx(Yn, {});
+      case "kpi":
+        return /* @__PURE__ */ e.jsx(Wn, {});
+      case "line":
+      case "bar":
+        return /* @__PURE__ */ e.jsx(Bn, { cardType: t });
+      case "pie":
+      case "doughnut":
+      case "polarArea":
+      case "radar":
+        return /* @__PURE__ */ e.jsx(Pn, { cardType: t });
+      case "bubble":
+      case "scatter":
+        return /* @__PURE__ */ e.jsx($n, { cardType: t });
+      case "table":
+        return /* @__PURE__ */ e.jsx(Xn, { cardType: t });
+      default:
+        return /* @__PURE__ */ e.jsx(Gn, {});
+    }
+  }
+  return /* @__PURE__ */ e.jsx(bs, { className: "h-full w-full text-sm", children: n(s) });
+}
+function er() {
+  const s = i((n) => n.isShowingVisual);
+  return /* @__PURE__ */ e.jsxs(
+    rs,
+    {
+      direction: "vertical",
+      className: "min-w-full max-w-lg  min-h-[250px]",
+      children: [
+        /* @__PURE__ */ e.jsx(
+          Fe,
+          {
+            role: "query-section",
+            className: "flex",
+            minSize: 20,
+            defaultSize: 40,
+            children: /* @__PURE__ */ e.jsx(Tn, {})
+          }
+        ),
+        /* @__PURE__ */ e.jsx(ls, { withHandle: !0, className: "border " }),
+        /* @__PURE__ */ e.jsx(
+          Fe,
+          {
+            className: "pb-1",
+            role: "visual-section",
+            minSize: 0,
+            defaultSize: 60,
+            children: s ? /* @__PURE__ */ e.jsxs(rs, { direction: "horizontal", children: [
+              /* @__PURE__ */ e.jsx(e.Fragment, { children: /* @__PURE__ */ e.jsx(
+                Fe,
+                {
+                  className: "flex min-w-[275px]",
+                  minSize: 20,
+                  defaultSize: 25,
+                  maxSize: 30,
+                  children: /* @__PURE__ */ e.jsx(Zn, {})
+                }
+              ) }),
+              /* @__PURE__ */ e.jsx(ls, { className: "border " }),
+              /* @__PURE__ */ e.jsx(Fe, { minSize: 40, defaultSize: 75, maxSize: 100, children: /* @__PURE__ */ e.jsx(_s, {}) })
+            ] }) : /* @__PURE__ */ e.jsx(_s, {})
+          }
+        )
+      ]
+    }
+  );
+}
+function sr({ authToken: s, onSave: n, onClose: t }) {
+  const a = i((r) => r.actions.setOnSave), l = i((r) => r.actions.setOnClose), o = S((r) => r.actions.setAuthToken);
+  return $(() => {
+    n && a(n), t && l(t);
+  }, [n, a, t, l]), $(() => {
+    s && s.accessToken && o(s);
+  }, [s, o]), /* @__PURE__ */ e.jsxs(Ta, { className: "rounded-none", role: "editor-panel", children: [
+    /* @__PURE__ */ e.jsx(Aa, { className: "rounded-none border-r-[1.5px]", children: /* @__PURE__ */ e.jsx(ut, {}) }),
+    /* @__PURE__ */ e.jsx(Ea, { children: /* @__PURE__ */ e.jsx(er, {}) })
+  ] });
+}
+function tr() {
+  S((r) => r.selectedCardId);
+  const s = S((r) => r.selectedSheetId), { setIsVisualEditing: n } = S((r) => r.actions), t = S((r) => r.isVisualEditing), a = S((r) => r.actions.updateFrame);
+  function l(r) {
+    s && (a(s, r), n(!1));
+  }
+  function o() {
+    n(!1);
+  }
+  return /* @__PURE__ */ e.jsx(
+    "div",
+    {
+      role: "editor-container",
+      className: W("flex grow", {
+        block: t,
+        hidden: !t
+      }),
+      children: /* @__PURE__ */ e.jsx(sr, { onSave: l, onClose: o })
+    }
+  );
+}
+function ar({
+  columns: s,
+  tableName: n
+}) {
+  const t = i((u) => u.selectedConnectionId), a = i((u) => u.selectedDatabaseName), l = i((u) => u.selectedSchemaName), o = i((u) => u.selectedTableName), r = S((u) => u.dashboard.filters) || [], d = S((u) => u.actions.addFilter), c = S((u) => u.actions.removeFilter), m = S(
+    (u) => u.actions.removeFilterValue
+  );
+  function h(u) {
+    const g = oe(u.column_name), p = oe(a || ""), j = oe(l || ""), C = oe(n), v = as(
+      j,
+      C
+    ), y = `${v}.${g}`;
+    console.log(
+      "find",
+      y,
+      C,
+      p
+    );
+    const D = r == null ? void 0 : r.find(
+      (A) => A.column === y && A.table === C && (A.database === p || A.database === a)
+    );
+    if (D)
+      m(D.id), c(D.id);
+    else {
+      if (n === "api" && t) {
+        d({
+          id: $e(),
+          column: y,
+          title: u.column_name,
+          dataType: u.data_type,
+          table: "api",
+          database: "",
+          // database: 'NA',
+          connectionId: t,
+          operation: "in",
+          sql: qs(
+            u.data_type,
+            v,
+            g
+          )
+          //DATE_DATA_TYPES.includes(column.data_type) ? dateSql : sql,
+        });
+        return;
+      }
+      d({
+        id: $e(),
+        column: `${v}.${g}`,
+        title: u.column_name,
+        dataType: u.data_type,
+        table: o || "",
+        database: a || "",
+        connectionId: t || "",
+        operation: "in",
+        sql: qs(
+          u.data_type,
+          v,
+          g
+        )
+        //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 g = r == null ? void 0 : r.find(
+      (p) => p.column === oe(u.column_name) && p.table === o && p.database === a
+    );
+    return /* @__PURE__ */ e.jsx(
+      "div",
+      {
+        onClick: () => h(u),
+        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": g
+          }
+        ),
+        children: /* @__PURE__ */ e.jsxs("div", { className: "flex items-center gap-2", children: [
+          /* @__PURE__ */ e.jsx(dt, { column: u }),
+          /* @__PURE__ */ e.jsx("span", { children: u.column_name })
+        ] })
+      },
+      u.column_name
+    );
+  }) });
+}
+function nr() {
+  S((n) => n.showFilters);
+  const s = S(
+    (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(_, { className: "text-lg", children: "Filters" }),
+      /* @__PURE__ */ e.jsx(
+        k,
+        {
+          onClick: () => s(!1),
+          className: "h-7 w-7 p-0",
+          variant: "ghost",
+          children: /* @__PURE__ */ e.jsx(Ee, {})
+        }
+      )
+    ] }),
+    /* @__PURE__ */ e.jsx("div", { className: "flex grow", children: /* @__PURE__ */ e.jsx(
+      ut,
+      {
+        ColumnsComponent: (n, t, a) => /* @__PURE__ */ e.jsx(
+          ar,
+          {
+            schemaName: n,
+            tableName: t,
+            columns: a
+          }
+        )
+      }
+    ) })
+  ] });
+}
+function rr() {
+  S((t) => t.dashboard);
+  const s = S((t) => t.showFilters), n = S((t) => t.isVisualEditing);
+  return S((t) => t.bookmarkKey), /* @__PURE__ */ e.jsxs(
+    "div",
+    {
+      role: "dashboard-plus-main",
+      className: W("grow", {
+        hidden: n,
+        flex: !n
+      }),
+      children: [
+        /* @__PURE__ */ e.jsx(La, {}),
+        s && /* @__PURE__ */ e.jsx("div", { role: "filter-aside-container", className: "flex", children: /* @__PURE__ */ e.jsx(nr, {}) })
+      ]
+    }
+  );
+}
+function lr() {
+  const s = S((a) => a.dashboard), n = S((a) => a.actions.setDashboard), t = S(
+    (a) => a.showDashboardJSON
+  );
+  return S(
+    (a) => a.actions.setShowDashboardJSON
+  ), /* @__PURE__ */ e.jsx(
+    "div",
+    {
+      className: W(" p-2", {
+        hidden: !t
+      }),
+      children: /* @__PURE__ */ e.jsx(
+        Da,
+        {
+          onChange: (a) => {
+            if (a)
+              try {
+                JSON.parse(a), n(JSON.parse(a));
+              } catch {
+              }
+          },
+          defaultLanguage: "json",
+          className: "h-[550px] overflow-y-auto ",
+          value: JSON.stringify(s, null, 2),
+          options: {
+            minimap: {
+              enabled: !1
+            },
+            //   lineNumbers: 'off',
+            glyphMargin: !1,
+            wordWrap: "on",
+            scrollbar: {
+              verticalScrollbarSize: 0,
+              horizontalScrollbarSize: 0
+            },
+            fontSize: 12,
+            renderLineHighlight: "none"
+          }
+        }
+      )
+    }
+  );
+}
+function cr({
+  showControls: s = !1,
+  showFooter: n = !0,
+  ...t
+}) {
+  return /* @__PURE__ */ e.jsx(Ia, { dashboardProps: t, children: /* @__PURE__ */ e.jsxs(qa, { children: [
+    /* @__PURE__ */ e.jsx(lr, {}),
+    /* @__PURE__ */ e.jsxs(Va, { ...t, children: [
+      s && /* @__PURE__ */ e.jsx(xn, {}),
+      /* @__PURE__ */ e.jsx(tr, {}),
+      /* @__PURE__ */ e.jsx(rr, {})
+    ] })
+  ] }) });
+}
+export {
+  cr as D,
+  He as S,
+  ht as u
+};