@devtable/settings-form 12.10.2 → 12.11.0

package/dist/settings-form.es.js

@@ -1,16 +1,17 @@
-import F, { useEffect as Ot, forwardRef as ut, useState as or, Component as Vr } from "react";
-import { Box as X, TextInput as Q, Divider as ct, Group as z, NumberInput as Wr, PasswordInput as dt, Button as D, Modal as xe, Stack as Ke, Alert as Kr, SegmentedControl as Zr, Tooltip as at, Text as ke, ActionIcon as Dt, LoadingOverlay as pt, Table as ft, Select as Xr, Switch as Qr, createStyles as lr, rem as Ve, useComponentDefaultProps as Jr, useMantineTheme as en, ScrollArea as ur, Tabs as gt, HoverCard as _t } from "@mantine/core";
+import F, { useEffect as It, forwardRef as ct, useState as lr, Component as Wr } from "react";
+import { Box as X, TextInput as Q, Divider as dt, Group as z, NumberInput as Kr, PasswordInput as pt, Button as I, Modal as xe, Stack as Ze, Alert as Zr, SegmentedControl as Xr, Tooltip as it, Text as ke, ActionIcon as Dt, LoadingOverlay as ft, Table as gt, Select as Qr, Switch as Jr, createStyles as ur, rem as We, useComponentDefaultProps as en, useMantineTheme as tn, ScrollArea as cr, Tabs as ht, HoverCard as At } from "@mantine/core";
 import { showNotification as oe, updateNotification as P } from "@mantine/notifications";
-import { Recycle as tn, AlertCircle as rn, PlaylistAdd as ht, Trash as mt, Edit as nn } from "tabler-icons-react";
-import * as an from "crypto-js";
-import sn from "axios";
+import { Recycle as rn, AlertCircle as nn, PlaylistAdd as mt, Trash as bt, Edit as an } from "tabler-icons-react";
+import * as sn from "crypto-js";
+import on from "lodash";
+import ln from "axios";
 import { useForm as me, Controller as R } from "react-hook-form";
-import { useBoolean as on, useRequest as Te } from "ahooks";
-import cr, { loader as At } from "@monaco-editor/react";
-import { useModals as Ze, closeAllModals as ln } from "@mantine/modals";
-import { IconLock as dr, IconEdit as Tt, IconNetwork as un, IconBrandMysql as cn, IconDatabase as dn, IconEye as pn } from "@tabler/icons-react";
-import { useClipboard as fn } from "@mantine/hooks";
-var jt = { exports: {} }, Ue = {};
+import { IconDeviceFloppy as Pe, IconLock as dr, IconEdit as jt, IconNetwork as un, IconBrandMysql as cn, IconDatabase as dn, IconEye as pn } from "@tabler/icons-react";
+import { useBoolean as fn, useRequest as Te } from "ahooks";
+import pr, { loader as kt } from "@monaco-editor/react";
+import { useModals as Xe, closeAllModals as gn } from "@mantine/modals";
+import { useClipboard as hn } from "@mantine/hooks";
+var Ct = { exports: {} }, Ge = {};
 /**
  * @license React
  * react-jsx-runtime.production.min.js
@@ -20,11 +21,11 @@ var jt = { exports: {} }, Ue = {};
  * This source code is licensed under the MIT license found in the
  * LICENSE file in the root directory of this source tree.
  */
-var Xt;
-function gn() {
-  if (Xt)
-    return Ue;
-  Xt = 1;
+var Qt;
+function mn() {
+  if (Qt)
+    return Ge;
+  Qt = 1;
   var e = F, t = Symbol.for("react.element"), r = Symbol.for("react.fragment"), n = Object.prototype.hasOwnProperty, i = e.__SECRET_INTERNALS_DO_NOT_USE_OR_YOU_WILL_BE_FIRED.ReactCurrentOwner, s = { key: !0, ref: !0, __self: !0, __source: !0 };
   function l(d, p, f) {
     var h, c = {}, u = null, g = null;
@@ -36,9 +37,9 @@ function gn() {
         c[h] === void 0 && (c[h] = p[h]);
     return { $$typeof: t, type: d, key: u, ref: g, props: c, _owner: i.current };
   }
-  return Ue.Fragment = r, Ue.jsx = l, Ue.jsxs = l, Ue;
+  return Ge.Fragment = r, Ge.jsx = l, Ge.jsxs = l, Ge;
 }
-var Ge = {};
+var He = {};
 /**
  * @license React
  * react-jsx-runtime.development.js
@@ -48,9 +49,9 @@ var Ge = {};
  * This source code is licensed under the MIT license found in the
  * LICENSE file in the root directory of this source tree.
  */
-var Qt;
-function hn() {
-  return Qt || (Qt = 1, process.env.NODE_ENV !== "production" && function() {
+var Jt;
+function bn() {
+  return Jt || (Jt = 1, process.env.NODE_ENV !== "production" && function() {
     var e = F, t = Symbol.for("react.element"), r = Symbol.for("react.portal"), n = Symbol.for("react.fragment"), i = Symbol.for("react.strict_mode"), s = Symbol.for("react.profiler"), l = Symbol.for("react.provider"), d = Symbol.for("react.context"), p = Symbol.for("react.forward_ref"), f = Symbol.for("react.suspense"), h = Symbol.for("react.suspense_list"), c = Symbol.for("react.memo"), u = Symbol.for("react.lazy"), g = Symbol.for("react.offscreen"), v = Symbol.iterator, m = "@@iterator";
     function x(o) {
       if (o === null || typeof o != "object")
@@ -70,10 +71,10 @@ function hn() {
       {
         var A = w.ReactDebugCurrentFrame, C = A.getStackAddendum();
         C !== "" && (y += "%s", E = E.concat([C]));
-        var I = E.map(function(j) {
+        var D = E.map(function(j) {
           return String(j);
         });
-        I.unshift("Warning: " + y), Function.prototype.apply.call(console[o], console, I);
+        D.unshift("Warning: " + y), Function.prototype.apply.call(console[o], console, D);
       }
     }
     var k = !1, H = !1, J = !1, N = !1, q = !1, $;
@@ -130,9 +131,9 @@ function hn() {
             var A = o.displayName || null;
             return A !== null ? A : B(o.type) || "Memo";
           case u: {
-            var C = o, I = C._payload, j = C._init;
+            var C = o, D = C._payload, j = C._init;
             try {
-              return B(j(I));
+              return B(j(D));
             } catch {
               return null;
             }
@@ -202,18 +203,18 @@ function hn() {
         M < 0 && S("disabledDepth fell below zero. This is a bug in React. Please file an issue.");
       }
     }
-    var ge = w.ReactCurrentDispatcher, Me;
+    var ge = w.ReactCurrentDispatcher, Be;
     function je(o, y, E) {
       {
-        if (Me === void 0)
+        if (Be === void 0)
           try {
             throw Error();
           } catch (C) {
             var A = C.stack.trim().match(/\n( *(at )?)/);
-            Me = A && A[1] || "";
+            Be = A && A[1] || "";
           }
         return `
-` + Me + o;
+` + Be + o;
       }
     }
     var Ce = !1, _e;
@@ -221,7 +222,7 @@ function hn() {
       var Re = typeof WeakMap == "function" ? WeakMap : Map;
       _e = new Re();
     }
-    function $t(o, y) {
+    function zt(o, y) {
       if (!o || Ce)
         return "";
       {
@@ -233,8 +234,8 @@ function hn() {
       Ce = !0;
       var C = Error.prepareStackTrace;
       Error.prepareStackTrace = void 0;
-      var I;
-      I = ge.current, ge.current = null, fe();
+      var D;
+      D = ge.current, ge.current = null, fe();
       try {
         if (y) {
           var j = function() {
@@ -287,23 +288,23 @@ function hn() {
             }
         }
       } finally {
-        Ce = !1, ge.current = I, Ee(), Error.prepareStackTrace = C;
+        Ce = !1, ge.current = D, Ee(), Error.prepareStackTrace = C;
       }
-      var De = o ? o.displayName || o.name : "", Zt = De ? je(De) : "";
-      return typeof o == "function" && _e.set(o, Zt), Zt;
+      var Ie = o ? o.displayName || o.name : "", Xt = Ie ? je(Ie) : "";
+      return typeof o == "function" && _e.set(o, Xt), Xt;
     }
-    function Ar(o, y, E) {
-      return $t(o, !1);
+    function kr(o, y, E) {
+      return zt(o, !1);
     }
-    function kr(o) {
+    function Tr(o) {
       var y = o.prototype;
       return !!(y && y.isReactComponent);
     }
-    function Je(o, y, E) {
+    function et(o, y, E) {
       if (o == null)
         return "";
       if (typeof o == "function")
-        return $t(o, kr(o));
+        return zt(o, Tr(o));
       if (typeof o == "string")
         return je(o);
       switch (o) {
@@ -315,32 +316,32 @@ function hn() {
       if (typeof o == "object")
         switch (o.$$typeof) {
           case p:
-            return Ar(o.render);
+            return kr(o.render);
           case c:
-            return Je(o.type, y, E);
+            return et(o.type, y, E);
           case u: {
-            var A = o, C = A._payload, I = A._init;
+            var A = o, C = A._payload, D = A._init;
             try {
-              return Je(I(C), y, E);
+              return et(D(C), y, E);
             } catch {
             }
           }
         }
       return "";
     }
-    var et = Object.prototype.hasOwnProperty, zt = {}, Pt = w.ReactDebugCurrentFrame;
-    function tt(o) {
+    var tt = Object.prototype.hasOwnProperty, Pt = {}, Mt = w.ReactDebugCurrentFrame;
+    function rt(o) {
       if (o) {
-        var y = o._owner, E = Je(o.type, o._source, y ? y.type : null);
-        Pt.setExtraStackFrame(E);
+        var y = o._owner, E = et(o.type, o._source, y ? y.type : null);
+        Mt.setExtraStackFrame(E);
       } else
-        Pt.setExtraStackFrame(null);
+        Mt.setExtraStackFrame(null);
     }
-    function Tr(o, y, E, A, C) {
+    function jr(o, y, E, A, C) {
       {
-        var I = Function.call.bind(et);
+        var D = Function.call.bind(tt);
         for (var j in o)
-          if (I(o, j)) {
+          if (D(o, j)) {
             var T = void 0;
             try {
               if (typeof o[j] != "function") {
@@ -351,67 +352,67 @@ function hn() {
             } catch (U) {
               T = U;
             }
-            T && !(T instanceof Error) && (tt(C), S("%s: type specification of %s `%s` is invalid; the type checker function must return `null` or an `Error` but returned a %s. You may have forgotten to pass an argument to the type checker creator (arrayOf, instanceOf, objectOf, oneOf, oneOfType, and shape all require an argument).", A || "React class", E, j, typeof T), tt(null)), T instanceof Error && !(T.message in zt) && (zt[T.message] = !0, tt(C), S("Failed %s type: %s", E, T.message), tt(null));
+            T && !(T instanceof Error) && (rt(C), S("%s: type specification of %s `%s` is invalid; the type checker function must return `null` or an `Error` but returned a %s. You may have forgotten to pass an argument to the type checker creator (arrayOf, instanceOf, objectOf, oneOf, oneOfType, and shape all require an argument).", A || "React class", E, j, typeof T), rt(null)), T instanceof Error && !(T.message in Pt) && (Pt[T.message] = !0, rt(C), S("Failed %s type: %s", E, T.message), rt(null));
           }
       }
     }
-    var jr = Array.isArray;
-    function yt(o) {
-      return jr(o);
+    var Cr = Array.isArray;
+    function St(o) {
+      return Cr(o);
     }
-    function Cr(o) {
+    function Rr(o) {
       {
         var y = typeof Symbol == "function" && Symbol.toStringTag, E = y && o[Symbol.toStringTag] || o.constructor.name || "Object";
         return E;
       }
     }
-    function Rr(o) {
+    function Or(o) {
       try {
-        return Mt(o), !1;
+        return Bt(o), !1;
       } catch {
         return !0;
       }
     }
-    function Mt(o) {
+    function Bt(o) {
       return "" + o;
     }
-    function Bt(o) {
-      if (Rr(o))
-        return S("The provided key is an unsupported type %s. This value must be coerced to a string before before using it here.", Cr(o)), Mt(o);
+    function Ut(o) {
+      if (Or(o))
+        return S("The provided key is an unsupported type %s. This value must be coerced to a string before before using it here.", Rr(o)), Bt(o);
     }
-    var Be = w.ReactCurrentOwner, Or = {
+    var Ue = w.ReactCurrentOwner, Ir = {
       key: !0,
       ref: !0,
       __self: !0,
       __source: !0
-    }, Ut, Gt, St;
-    St = {};
+    }, Gt, Ht, xt;
+    xt = {};
     function Dr(o) {
-      if (et.call(o, "ref")) {
+      if (tt.call(o, "ref")) {
         var y = Object.getOwnPropertyDescriptor(o, "ref").get;
         if (y && y.isReactWarning)
           return !1;
       }
       return o.ref !== void 0;
     }
-    function Ir(o) {
-      if (et.call(o, "key")) {
+    function Lr(o) {
+      if (tt.call(o, "key")) {
         var y = Object.getOwnPropertyDescriptor(o, "key").get;
         if (y && y.isReactWarning)
           return !1;
       }
       return o.key !== void 0;
     }
-    function Lr(o, y) {
-      if (typeof o.ref == "string" && Be.current && y && Be.current.stateNode !== y) {
-        var E = B(Be.current.type);
-        St[E] || (S('Component "%s" contains the string ref "%s". Support for string refs will be removed in a future major release. This case cannot be automatically converted to an arrow function. We ask you to manually fix this case by using useRef() or createRef() instead. Learn more about using refs safely here: https://reactjs.org/link/strict-mode-string-ref', B(Be.current.type), o.ref), St[E] = !0);
+    function Fr(o, y) {
+      if (typeof o.ref == "string" && Ue.current && y && Ue.current.stateNode !== y) {
+        var E = B(Ue.current.type);
+        xt[E] || (S('Component "%s" contains the string ref "%s". Support for string refs will be removed in a future major release. This case cannot be automatically converted to an arrow function. We ask you to manually fix this case by using useRef() or createRef() instead. Learn more about using refs safely here: https://reactjs.org/link/strict-mode-string-ref', B(Ue.current.type), o.ref), xt[E] = !0);
       }
     }
-    function Fr(o, y) {
+    function Nr(o, y) {
       {
         var E = function() {
-          Ut || (Ut = !0, S("%s: `key` is not a prop. Trying to access it will result in `undefined` being returned. If you need to access the same value within the child component, you should pass it as a different prop. (https://reactjs.org/link/special-props)", y));
+          Gt || (Gt = !0, S("%s: `key` is not a prop. Trying to access it will result in `undefined` being returned. If you need to access the same value within the child component, you should pass it as a different prop. (https://reactjs.org/link/special-props)", y));
         };
         E.isReactWarning = !0, Object.defineProperty(o, "key", {
           get: E,
@@ -419,10 +420,10 @@ function hn() {
         });
       }
     }
-    function Nr(o, y) {
+    function $r(o, y) {
       {
         var E = function() {
-          Gt || (Gt = !0, S("%s: `ref` is not a prop. Trying to access it will result in `undefined` being returned. If you need to access the same value within the child component, you should pass it as a different prop. (https://reactjs.org/link/special-props)", y));
+          Ht || (Ht = !0, S("%s: `ref` is not a prop. Trying to access it will result in `undefined` being returned. If you need to access the same value within the child component, you should pass it as a different prop. (https://reactjs.org/link/special-props)", y));
         };
         E.isReactWarning = !0, Object.defineProperty(o, "ref", {
           get: E,
@@ -430,7 +431,7 @@ function hn() {
         });
       }
     }
-    var $r = function(o, y, E, A, C, I, j) {
+    var zr = function(o, y, E, A, C, D, j) {
       var T = {
         // This tag allows us to uniquely identify this as a React Element
         $$typeof: t,
@@ -440,7 +441,7 @@ function hn() {
         ref: E,
         props: j,
         // Record the component responsible for creating this element.
-        _owner: I
+        _owner: D
       };
       return T._store = {}, Object.defineProperty(T._store, "validated", {
         configurable: !1,
@@ -459,41 +460,41 @@ function hn() {
         value: C
       }), Object.freeze && (Object.freeze(T.props), Object.freeze(T)), T;
     };
-    function zr(o, y, E, A, C) {
+    function Pr(o, y, E, A, C) {
       {
-        var I, j = {}, T = null, ne = null;
-        E !== void 0 && (Bt(E), T = "" + E), Ir(y) && (Bt(y.key), T = "" + y.key), Dr(y) && (ne = y.ref, Lr(y, C));
-        for (I in y)
-          et.call(y, I) && !Or.hasOwnProperty(I) && (j[I] = y[I]);
+        var D, j = {}, T = null, ne = null;
+        E !== void 0 && (Ut(E), T = "" + E), Lr(y) && (Ut(y.key), T = "" + y.key), Dr(y) && (ne = y.ref, Fr(y, C));
+        for (D in y)
+          tt.call(y, D) && !Ir.hasOwnProperty(D) && (j[D] = y[D]);
         if (o && o.defaultProps) {
           var U = o.defaultProps;
-          for (I in U)
-            j[I] === void 0 && (j[I] = U[I]);
+          for (D in U)
+            j[D] === void 0 && (j[D] = U[D]);
         }
         if (T || ne) {
           var Y = typeof o == "function" ? o.displayName || o.name || "Unknown" : o;
-          T && Fr(j, Y), ne && Nr(j, Y);
+          T && Nr(j, Y), ne && $r(j, Y);
         }
-        return $r(o, T, ne, C, A, Be.current, j);
+        return zr(o, T, ne, C, A, Ue.current, j);
       }
     }
-    var xt = w.ReactCurrentOwner, Ht = w.ReactDebugCurrentFrame;
+    var wt = w.ReactCurrentOwner, qt = w.ReactDebugCurrentFrame;
     function Oe(o) {
       if (o) {
-        var y = o._owner, E = Je(o.type, o._source, y ? y.type : null);
-        Ht.setExtraStackFrame(E);
+        var y = o._owner, E = et(o.type, o._source, y ? y.type : null);
+        qt.setExtraStackFrame(E);
       } else
-        Ht.setExtraStackFrame(null);
+        qt.setExtraStackFrame(null);
     }
-    var wt;
-    wt = !1;
-    function Et(o) {
+    var Et;
+    Et = !1;
+    function _t(o) {
       return typeof o == "object" && o !== null && o.$$typeof === t;
     }
-    function qt() {
+    function Yt() {
       {
-        if (xt.current) {
-          var o = B(xt.current.type);
+        if (wt.current) {
+          var o = B(wt.current.type);
           if (o)
             return `
 
@@ -502,7 +503,7 @@ Check the render method of \`` + o + "`.";
         return "";
       }
     }
-    function Pr(o) {
+    function Mr(o) {
       {
         if (o !== void 0) {
           var y = o.fileName.replace(/^.*[\\\/]/, ""), E = o.lineNumber;
@@ -513,10 +514,10 @@ Check your code at ` + y + ":" + E + ".";
         return "";
       }
     }
-    var Yt = {};
-    function Mr(o) {
+    var Vt = {};
+    function Br(o) {
       {
-        var y = qt();
+        var y = Yt();
         if (!y) {
           var E = typeof o == "string" ? o : o.displayName || o.name;
           E && (y = `
@@ -526,39 +527,39 @@ Check the top-level render call using <` + E + ">.");
         return y;
       }
     }
-    function Vt(o, y) {
+    function Wt(o, y) {
       {
         if (!o._store || o._store.validated || o.key != null)
           return;
         o._store.validated = !0;
-        var E = Mr(y);
-        if (Yt[E])
+        var E = Br(y);
+        if (Vt[E])
           return;
-        Yt[E] = !0;
+        Vt[E] = !0;
         var A = "";
-        o && o._owner && o._owner !== xt.current && (A = " It was passed a child from " + B(o._owner.type) + "."), Oe(o), S('Each child in a list should have a unique "key" prop.%s%s See https://reactjs.org/link/warning-keys for more information.', E, A), Oe(null);
+        o && o._owner && o._owner !== wt.current && (A = " It was passed a child from " + B(o._owner.type) + "."), Oe(o), S('Each child in a list should have a unique "key" prop.%s%s See https://reactjs.org/link/warning-keys for more information.', E, A), Oe(null);
       }
     }
-    function Wt(o, y) {
+    function Kt(o, y) {
       {
         if (typeof o != "object")
           return;
-        if (yt(o))
+        if (St(o))
           for (var E = 0; E < o.length; E++) {
             var A = o[E];
-            Et(A) && Vt(A, y);
+            _t(A) && Wt(A, y);
           }
-        else if (Et(o))
+        else if (_t(o))
           o._store && (o._store.validated = !0);
         else if (o) {
           var C = x(o);
           if (typeof C == "function" && C !== o.entries)
-            for (var I = C.call(o), j; !(j = I.next()).done; )
-              Et(j.value) && Vt(j.value, y);
+            for (var D = C.call(o), j; !(j = D.next()).done; )
+              _t(j.value) && Wt(j.value, y);
         }
       }
     }
-    function Br(o) {
+    function Ur(o) {
       {
         var y = o.type;
         if (y == null || typeof y == "string")
@@ -574,16 +575,16 @@ Check the top-level render call using <` + E + ">.");
           return;
         if (E) {
           var A = B(y);
-          Tr(E, o.props, "prop", A, o);
-        } else if (y.PropTypes !== void 0 && !wt) {
-          wt = !0;
+          jr(E, o.props, "prop", A, o);
+        } else if (y.PropTypes !== void 0 && !Et) {
+          Et = !0;
           var C = B(y);
           S("Component %s declared `PropTypes` instead of `propTypes`. Did you misspell the property assignment?", C || "Unknown");
         }
         typeof y.getDefaultProps == "function" && !y.getDefaultProps.isReactClassApproved && S("getDefaultProps is only used on classic React.createClass definitions. Use a static property named `defaultProps` instead.");
       }
     }
-    function Ur(o) {
+    function Gr(o) {
       {
         for (var y = Object.keys(o.props), E = 0; E < y.length; E++) {
           var A = y[E];
@@ -595,49 +596,49 @@ Check the top-level render call using <` + E + ">.");
         o.ref !== null && (Oe(o), S("Invalid attribute `ref` supplied to `React.Fragment`."), Oe(null));
       }
     }
-    function Kt(o, y, E, A, C, I) {
+    function Zt(o, y, E, A, C, D) {
       {
         var j = te(o);
         if (!j) {
           var T = "";
           (o === void 0 || typeof o == "object" && o !== null && Object.keys(o).length === 0) && (T += " You likely forgot to export your component from the file it's defined in, or you might have mixed up default and named imports.");
-          var ne = Pr(C);
-          ne ? T += ne : T += qt();
+          var ne = Mr(C);
+          ne ? T += ne : T += Yt();
           var U;
-          o === null ? U = "null" : yt(o) ? U = "array" : o !== void 0 && o.$$typeof === t ? (U = "<" + (B(o.type) || "Unknown") + " />", T = " Did you accidentally export a JSX literal instead of a component?") : U = typeof o, S("React.jsx: type is invalid -- expected a string (for built-in components) or a class/function (for composite components) but got: %s.%s", U, T);
+          o === null ? U = "null" : St(o) ? U = "array" : o !== void 0 && o.$$typeof === t ? (U = "<" + (B(o.type) || "Unknown") + " />", T = " Did you accidentally export a JSX literal instead of a component?") : U = typeof o, S("React.jsx: type is invalid -- expected a string (for built-in components) or a class/function (for composite components) but got: %s.%s", U, T);
         }
-        var Y = zr(o, y, E, C, I);
+        var Y = Pr(o, y, E, C, D);
         if (Y == null)
           return Y;
         if (j) {
           var se = y.children;
           if (se !== void 0)
             if (A)
-              if (yt(se)) {
-                for (var De = 0; De < se.length; De++)
-                  Wt(se[De], o);
+              if (St(se)) {
+                for (var Ie = 0; Ie < se.length; Ie++)
+                  Kt(se[Ie], o);
                 Object.freeze && Object.freeze(se);
               } else
                 S("React.jsx: Static children should always be an array. You are likely explicitly calling React.jsxs or React.jsxDEV. Use the Babel transform instead.");
             else
-              Wt(se, o);
+              Kt(se, o);
         }
-        return o === n ? Ur(Y) : Br(Y), Y;
+        return o === n ? Gr(Y) : Ur(Y), Y;
       }
     }
-    function Gr(o, y, E) {
-      return Kt(o, y, E, !0);
-    }
     function Hr(o, y, E) {
-      return Kt(o, y, E, !1);
+      return Zt(o, y, E, !0);
     }
-    var qr = Hr, Yr = Gr;
-    Ge.Fragment = n, Ge.jsx = qr, Ge.jsxs = Yr;
-  }()), Ge;
+    function qr(o, y, E) {
+      return Zt(o, y, E, !1);
+    }
+    var Yr = qr, Vr = Hr;
+    He.Fragment = n, He.jsx = Yr, He.jsxs = Vr;
+  }()), He;
 }
-process.env.NODE_ENV === "production" ? jt.exports = gn() : jt.exports = hn();
-var a = jt.exports;
-function mn(e) {
+process.env.NODE_ENV === "production" ? Ct.exports = mn() : Ct.exports = bn();
+var a = Ct.exports;
+function vn(e) {
   e = e || {};
   const t = Object.keys(e).sort(), r = [];
   for (let n = 0; n < t.length; n++) {
@@ -654,11 +655,11 @@ function mn(e) {
   }
   return r.sort().join("&");
 }
-function bn(e, t) {
-  let r = mn(e);
-  return r += "&key=" + t, an.MD5(r).toString().toUpperCase();
+function yn(e, t) {
+  let r = vn(e);
+  return r += "&key=" + t, sn.MD5(r).toString().toUpperCase();
 }
-class vn {
+class Sn {
   constructor() {
     this.type = "default_api_client", this.baseURL = "http://localhost:31200", this.app_id = "", this.app_secret = "";
   }
@@ -669,7 +670,7 @@ class vn {
     return {
       app_id: this.app_id,
       nonce_str: r,
-      sign: bn({
+      sign: yn({
         app_id: this.app_id,
         nonce_str: r,
         ...t
@@ -679,7 +680,10 @@ class vn {
   getRequest(t, r) {
     return (n, i, s, l) => {
       const d = this.buildHeader(s), p = this.buildAxiosConfig(t, n, i, s, d, r);
-      return sn(p).then((f) => l ? f : f.data).catch((f) => Promise.reject(f));
+      return ln(p).then((f) => l ? f : f.data).catch((f) => {
+        const h = on.get(f, "response.data.detail.message", f.message);
+        return Promise.reject(new Error(h));
+      });
     };
   }
   get(t) {
@@ -712,7 +716,7 @@ class vn {
     };
   }
 }
-class yn {
+class xn {
   constructor(t) {
     this.implementation = t;
   }
@@ -729,11 +733,11 @@ class yn {
     return this.getRequest("PUT", t);
   }
 }
-const Ye = new vn(), Sn = new yn(Ye), G = Sn;
-function Xe(e) {
-  Ye.baseURL !== e.apiBaseURL && (Ye.baseURL = e.apiBaseURL), e.app_id && (Ye.app_id = e.app_id), e.app_secret && (Ye.app_secret = e.app_secret);
+const Ve = new Sn(), wn = new xn(Ve), G = wn;
+function Qe(e) {
+  Ve.baseURL !== e.apiBaseURL && (Ve.baseURL = e.apiBaseURL), e.app_id && (Ve.app_id = e.app_id), e.app_secret && (Ve.app_secret = e.app_secret);
 }
-const xn = {
+const En = {
   login: async (e, t) => {
     const r = {
       name: e,
@@ -789,7 +793,7 @@ const xn = {
         id: e
       }, {});
   }
-}, wn = {
+}, _n = {
   list: async () => await G.post()("/api/key/list", {
     filter: {
       search: ""
@@ -813,7 +817,7 @@ const xn = {
         id: e
       }, {});
   }
-}, En = {
+}, An = {
   list: async () => await G.post()("/datasource/list", {
     filter: {},
     sort: [{
@@ -839,11 +843,11 @@ const xn = {
       id: e
     }, {});
   }
-}, _n = {
+}, kn = {
   list: async () => await G.get()("/role/list", {}, {})
 };
-var pr = 60, fr = pr * 60, gr = fr * 24, An = gr * 7, ze = 1e3, kt = pr * ze, Jt = fr * ze, kn = gr * ze, Tn = An * ze, It = "millisecond", Le = "second", Fe = "minute", Ne = "hour", ve = "day", nt = "week", le = "month", hr = "quarter", ye = "year", $e = "date", jn = "YYYY-MM-DDTHH:mm:ssZ", er = "Invalid Date", Cn = /^(\d{4})[-/]?(\d{1,2})?[-/]?(\d{0,2})[Tt\s]*(\d{1,2})?:?(\d{1,2})?:?(\d{1,2})?[.:]?(\d+)?$/, Rn = /\[([^\]]+)]|Y{1,4}|M{1,4}|D{1,2}|d{1,4}|H{1,2}|h{1,2}|a|A|m{1,2}|s{1,2}|Z{1,2}|SSS/g;
-const On = {
+var fr = 60, gr = fr * 60, hr = gr * 24, Tn = hr * 7, ze = 1e3, Tt = fr * ze, er = gr * ze, jn = hr * ze, Cn = Tn * ze, Lt = "millisecond", Le = "second", Fe = "minute", Ne = "hour", ve = "day", at = "week", le = "month", mr = "quarter", ye = "year", $e = "date", Rn = "YYYY-MM-DDTHH:mm:ssZ", tr = "Invalid Date", On = /^(\d{4})[-/]?(\d{1,2})?[-/]?(\d{0,2})[Tt\s]*(\d{1,2})?:?(\d{1,2})?:?(\d{1,2})?[.:]?(\d+)?$/, In = /\[([^\]]+)]|Y{1,4}|M{1,4}|D{1,2}|d{1,4}|H{1,2}|h{1,2}|a|A|m{1,2}|s{1,2}|Z{1,2}|SSS/g;
+const Dn = {
   name: "en",
   weekdays: "Sunday_Monday_Tuesday_Wednesday_Thursday_Friday_Saturday".split("_"),
   months: "January_February_March_April_May_June_July_August_September_October_November_December".split("_"),
@@ -852,52 +856,52 @@ const On = {
     return "[" + t + (r[(n - 20) % 10] || r[n] || r[0]) + "]";
   }
 };
-var Ct = function(t, r, n) {
+var Rt = function(t, r, n) {
   var i = String(t);
   return !i || i.length >= r ? t : "" + Array(r + 1 - i.length).join(n) + t;
-}, Dn = function(t) {
+}, Ln = function(t) {
   var r = -t.utcOffset(), n = Math.abs(r), i = Math.floor(n / 60), s = n % 60;
-  return (r <= 0 ? "+" : "-") + Ct(i, 2, "0") + ":" + Ct(s, 2, "0");
-}, In = function e(t, r) {
+  return (r <= 0 ? "+" : "-") + Rt(i, 2, "0") + ":" + Rt(s, 2, "0");
+}, Fn = function e(t, r) {
   if (t.date() < r.date())
     return -e(r, t);
   var n = (r.year() - t.year()) * 12 + (r.month() - t.month()), i = t.clone().add(n, le), s = r - i < 0, l = t.clone().add(n + (s ? -1 : 1), le);
   return +(-(n + (r - i) / (s ? i - l : l - i)) || 0);
-}, Ln = function(t) {
+}, Nn = function(t) {
   return t < 0 ? Math.ceil(t) || 0 : Math.floor(t);
-}, Fn = function(t) {
+}, $n = function(t) {
   var r = {
     M: le,
     y: ye,
-    w: nt,
+    w: at,
     d: ve,
     D: $e,
     h: Ne,
     m: Fe,
     s: Le,
-    ms: It,
-    Q: hr
+    ms: Lt,
+    Q: mr
   };
   return r[t] || String(t || "").toLowerCase().replace(/s$/, "");
-}, Nn = function(t) {
+}, zn = function(t) {
   return t === void 0;
 };
-const $n = {
-  s: Ct,
-  z: Dn,
-  m: In,
-  a: Ln,
-  p: Fn,
-  u: Nn
+const Pn = {
+  s: Rt,
+  z: Ln,
+  m: Fn,
+  a: Nn,
+  p: $n,
+  u: zn
 };
-var We = "en", Ae = {};
-Ae[We] = On;
-var Lt = function(t) {
-  return t instanceof bt;
-}, it = function e(t, r, n) {
+var Ke = "en", Ae = {};
+Ae[Ke] = Dn;
+var Ft = function(t) {
+  return t instanceof vt;
+}, st = function e(t, r, n) {
   var i;
   if (!t)
-    return We;
+    return Ke;
   if (typeof t == "string") {
     var s = t.toLowerCase();
     Ae[s] && (i = s), r && (Ae[s] = r, i = s);
@@ -908,13 +912,13 @@ var Lt = function(t) {
     var d = t.name;
     Ae[d] = t, i = d;
   }
-  return !n && i && (We = i), i || !n && We;
+  return !n && i && (Ke = i), i || !n && Ke;
 }, K = function(t, r) {
-  if (Lt(t))
+  if (Ft(t))
     return t.clone();
   var n = typeof r == "object" ? r : {};
-  return n.date = t, n.args = arguments, new bt(n);
-}, zn = function(t, r) {
+  return n.date = t, n.args = arguments, new vt(n);
+}, Mn = function(t, r) {
   return K(t, {
     locale: r.$L,
     utc: r.$u,
@@ -922,11 +926,11 @@ var Lt = function(t) {
     $offset: r.$offset
     // todo: refactor; do not use this.$offset in you code
   });
-}, O = $n;
-O.l = it;
-O.i = Lt;
-O.w = zn;
-var Pn = function(t) {
+}, O = Pn;
+O.l = st;
+O.i = Ft;
+O.w = Mn;
+var Bn = function(t) {
   var r = t.date, n = t.utc;
   if (r === null)
     return /* @__PURE__ */ new Date(NaN);
@@ -935,27 +939,27 @@ var Pn = function(t) {
   if (r instanceof Date)
     return new Date(r);
   if (typeof r == "string" && !/Z$/i.test(r)) {
-    var i = r.match(Cn);
+    var i = r.match(On);
     if (i) {
       var s = i[2] - 1 || 0, l = (i[7] || "0").substring(0, 3);
       return n ? new Date(Date.UTC(i[1], s, i[3] || 1, i[4] || 0, i[5] || 0, i[6] || 0, l)) : new Date(i[1], s, i[3] || 1, i[4] || 0, i[5] || 0, i[6] || 0, l);
     }
   }
   return new Date(r);
-}, bt = /* @__PURE__ */ function() {
+}, vt = /* @__PURE__ */ function() {
   function e(r) {
-    this.$L = it(r.locale, null, !0), this.parse(r);
+    this.$L = st(r.locale, null, !0), this.parse(r);
   }
   var t = e.prototype;
   return t.parse = function(n) {
-    this.$d = Pn(n), this.$x = n.x || {}, this.init();
+    this.$d = Bn(n), this.$x = n.x || {}, this.init();
   }, t.init = function() {
     var n = this.$d;
     this.$y = n.getFullYear(), this.$M = n.getMonth(), this.$D = n.getDate(), this.$W = n.getDay(), this.$H = n.getHours(), this.$m = n.getMinutes(), this.$s = n.getSeconds(), this.$ms = n.getMilliseconds();
   }, t.$utils = function() {
     return O;
   }, t.isValid = function() {
-    return this.$d.toString() !== er;
+    return this.$d.toString() !== tr;
   }, t.isSame = function(n, i) {
     var s = K(n);
     return this.startOf(i) <= s && s <= this.endOf(i);
@@ -986,7 +990,7 @@ var Pn = function(t) {
         return l ? p(1, 0) : p(31, 11);
       case le:
         return l ? p(1, c) : p(0, c + 1);
-      case nt: {
+      case at: {
         var v = this.$locale().weekStart || 0, m = (h < v ? h + 7 : h) - v;
         return p(l ? u - m : u + (6 - m), c);
       }
@@ -1005,7 +1009,7 @@ var Pn = function(t) {
   }, t.endOf = function(n) {
     return this.startOf(n, !1);
   }, t.$set = function(n, i) {
-    var s, l = O.p(n), d = "set" + (this.$u ? "UTC" : ""), p = (s = {}, s[ve] = d + "Date", s[$e] = d + "Date", s[le] = d + "Month", s[ye] = d + "FullYear", s[Ne] = d + "Hours", s[Fe] = d + "Minutes", s[Le] = d + "Seconds", s[It] = d + "Milliseconds", s)[l], f = l === ve ? this.$D + (i - this.$W) : i;
+    var s, l = O.p(n), d = "set" + (this.$u ? "UTC" : ""), p = (s = {}, s[ve] = d + "Date", s[$e] = d + "Date", s[le] = d + "Month", s[ye] = d + "FullYear", s[Ne] = d + "Hours", s[Fe] = d + "Minutes", s[Le] = d + "Seconds", s[Lt] = d + "Milliseconds", s)[l], f = l === ve ? this.$D + (i - this.$W) : i;
     if (l === le || l === ye) {
       var h = this.clone().set($e, 1);
       h.$d[p](f), h.init(), this.$d = h.set($e, Math.min(this.$D, h.daysInMonth())).$d;
@@ -1029,17 +1033,17 @@ var Pn = function(t) {
       return this.set(ye, this.$y + n);
     if (d === ve)
       return p(1);
-    if (d === nt)
+    if (d === at)
       return p(7);
-    var f = (l = {}, l[Fe] = kt, l[Ne] = Jt, l[Le] = ze, l)[d] || 1, h = this.$d.getTime() + n * f;
+    var f = (l = {}, l[Fe] = Tt, l[Ne] = er, l[Le] = ze, l)[d] || 1, h = this.$d.getTime() + n * f;
     return O.w(h, this);
   }, t.subtract = function(n, i) {
     return this.add(n * -1, i);
   }, t.format = function(n) {
     var i = this, s = this.$locale();
     if (!this.isValid())
-      return s.invalidDate || er;
-    var l = n || jn, d = O.z(this), p = this.$H, f = this.$m, h = this.$M, c = s.weekdays, u = s.months, g = s.meridiem, v = function(_, k, H, J) {
+      return s.invalidDate || tr;
+    var l = n || Rn, d = O.z(this), p = this.$H, f = this.$m, h = this.$M, c = s.weekdays, u = s.months, g = s.meridiem, v = function(_, k, H, J) {
       return _ && (_[k] || _(i, l)) || H[k].slice(0, J);
     }, m = function(_) {
       return O.s(p % 12 || 12, _, "0");
@@ -1099,13 +1103,13 @@ var Pn = function(t) {
       }
       return null;
     };
-    return l.replace(Rn, function(S, _) {
+    return l.replace(In, function(S, _) {
       return _ || w(S) || d.replace(":", "");
     });
   }, t.utcOffset = function() {
     return -Math.round(this.$d.getTimezoneOffset() / 15) * 15;
   }, t.diff = function(n, i, s) {
-    var l = this, d = O.p(i), p = K(n), f = (p.utcOffset() - this.utcOffset()) * kt, h = this - p, c = function() {
+    var l = this, d = O.p(i), p = K(n), f = (p.utcOffset() - this.utcOffset()) * Tt, h = this - p, c = function() {
       return O.m(l, p);
     }, u;
     switch (d) {
@@ -1115,20 +1119,20 @@ var Pn = function(t) {
       case le:
         u = c();
         break;
-      case hr:
+      case mr:
         u = c() / 3;
         break;
-      case nt:
-        u = (h - f) / Tn;
+      case at:
+        u = (h - f) / Cn;
         break;
       case ve:
-        u = (h - f) / kn;
+        u = (h - f) / jn;
         break;
       case Ne:
-        u = h / Jt;
+        u = h / er;
         break;
       case Fe:
-        u = h / kt;
+        u = h / Tt;
         break;
       case Le:
         u = h / ze;
@@ -1145,7 +1149,7 @@ var Pn = function(t) {
   }, t.locale = function(n, i) {
     if (!n)
       return this.$L;
-    var s = this.clone(), l = it(n, i, !0);
+    var s = this.clone(), l = st(n, i, !0);
     return l && (s.$L = l), s;
   }, t.clone = function() {
     return O.w(this.$d, this);
@@ -1158,25 +1162,25 @@ var Pn = function(t) {
   }, t.toString = function() {
     return this.$d.toUTCString();
   }, e;
-}(), mr = bt.prototype;
-K.prototype = mr;
-[["$ms", It], ["$s", Le], ["$m", Fe], ["$H", Ne], ["$W", ve], ["$M", le], ["$y", ye], ["$D", $e]].forEach(function(e) {
-  mr[e[1]] = function(t) {
+}(), br = vt.prototype;
+K.prototype = br;
+[["$ms", Lt], ["$s", Le], ["$m", Fe], ["$H", Ne], ["$W", ve], ["$M", le], ["$y", ye], ["$D", $e]].forEach(function(e) {
+  br[e[1]] = function(t) {
     return this.$g(t, e[0], e[1]);
   };
 });
 K.extend = function(e, t) {
-  return e.$i || (e(t, bt, K), e.$i = !0), K;
+  return e.$i || (e(t, vt, K), e.$i = !0), K;
 };
-K.locale = it;
-K.isDayjs = Lt;
+K.locale = st;
+K.isDayjs = Ft;
 K.unix = function(e) {
   return K(e * 1e3);
 };
-K.en = Ae[We];
+K.en = Ae[Ke];
 K.Ls = Ae;
 K.p = {};
-const Mn = {
+const Un = {
   list: async ({
     pagination: e
   }, t) => {
@@ -1200,11 +1204,11 @@ const Mn = {
     id: e
   }, {})
 }, Z = {
-  datasource: En,
-  account: xn,
-  role: _n,
-  api_key: wn,
-  sql_snippet: Mn
+  datasource: An,
+  account: En,
+  role: kn,
+  api_key: _n,
+  sql_snippet: Un
 }, de = {
   size: "sm",
   spacing: "md",
@@ -1212,7 +1216,7 @@ const Mn = {
     size: "xs"
   }
 };
-function Bn({
+function Gn({
   submit: e,
   styles: t = de,
   type: r
@@ -1234,13 +1238,13 @@ function Bn({
       }
     }
   });
-  return Ot(() => {
+  return It(() => {
     i("type", r);
   }, [i, r]), /* @__PURE__ */ a.jsx(X, { mx: "auto", children: /* @__PURE__ */ a.jsxs("form", { onSubmit: s(e), children: [
     /* @__PURE__ */ a.jsx(R, { name: "key", control: n, render: ({
       field: l
     }) => /* @__PURE__ */ a.jsx(Q, { mb: t.spacing, size: t.size, required: !0, label: "Name", placeholder: "A unique name", ...l }) }),
-    /* @__PURE__ */ a.jsx(ct, { label: "Connection Info", labelPosition: "center" }),
+    /* @__PURE__ */ a.jsx(dt, { label: "Connection Info", labelPosition: "center" }),
     /* @__PURE__ */ a.jsxs(z, { grow: !0, children: [
       /* @__PURE__ */ a.jsx(R, { name: "config.host", control: n, render: ({
         field: l
@@ -1251,7 +1255,7 @@ function Bn({
         field: l
       }) => (
         // @ts-expect-error type of onChange
-        /* @__PURE__ */ a.jsx(Wr, { mb: t.spacing, size: t.size, required: !0, label: "Port", hideControls: !0, sx: {
+        /* @__PURE__ */ a.jsx(Kr, { mb: t.spacing, size: t.size, required: !0, label: "Port", hideControls: !0, sx: {
           width: "8em"
         }, ...l })
       ) })
@@ -1261,14 +1265,14 @@ function Bn({
     }) => /* @__PURE__ */ a.jsx(Q, { mb: t.spacing, size: t.size, required: !0, label: "Username", ...l }) }),
     /* @__PURE__ */ a.jsx(R, { name: "config.password", control: n, render: ({
       field: l
-    }) => /* @__PURE__ */ a.jsx(dt, { mb: t.spacing, size: t.size, required: !0, label: "Password", ...l }) }),
+    }) => /* @__PURE__ */ a.jsx(pt, { mb: t.spacing, size: t.size, required: !0, label: "Password", ...l }) }),
     /* @__PURE__ */ a.jsx(R, { name: "config.database", control: n, render: ({
       field: l
     }) => /* @__PURE__ */ a.jsx(Q, { mb: t.spacing, size: t.size, required: !0, label: "Database", ...l }) }),
-    /* @__PURE__ */ a.jsx(z, { position: "right", mt: t.spacing, children: /* @__PURE__ */ a.jsx(D, { type: "submit", size: t.button.size, children: "Save" }) })
+    /* @__PURE__ */ a.jsx(z, { position: "right", mt: t.spacing, children: /* @__PURE__ */ a.jsx(I, { type: "submit", color: "green", leftIcon: /* @__PURE__ */ a.jsx(Pe, { size: 16 }), size: t.button.size, children: "Submit" }) })
   ] }) });
 }
-const Un = ({
+const Hn = ({
   value: e,
   onChange: t
 }) => {
@@ -1277,12 +1281,12 @@ const Un = ({
   };
   return /* @__PURE__ */ a.jsx(X, { sx: {
     position: "relative"
-  }, children: /* @__PURE__ */ a.jsx(cr, { height: "500px", defaultLanguage: "javascript", value: e, onChange: r, theme: "vs-dark", options: {
+  }, children: /* @__PURE__ */ a.jsx(pr, { height: "500px", defaultLanguage: "javascript", value: e, onChange: r, theme: "vs-dark", options: {
     minimap: {
       enabled: !1
     }
   } }) });
-}, st = ut(({
+}, ot = ct(({
   value: e,
   onChange: t,
   label: r,
@@ -1293,37 +1297,37 @@ const Un = ({
   const [d, {
     setTrue: p,
     setFalse: f
-  }] = on(), [h, c] = or(e), u = () => {
+  }] = fn(), [h, c] = lr(e), u = () => {
     f(), t(h);
   }, g = () => {
     f(), c(e);
   }, v = () => {
     c(i);
   };
-  return Ot(() => {
+  return It(() => {
     c(e);
   }, [e]), /* @__PURE__ */ a.jsxs(a.Fragment, { children: [
-    /* @__PURE__ */ a.jsx(D, { variant: "filled", size: s.button.size, onClick: p, sx: {
+    /* @__PURE__ */ a.jsx(I, { variant: "filled", size: s.button.size, onClick: p, sx: {
       flexGrow: 1
     }, children: r }),
-    /* @__PURE__ */ a.jsx(xe, { size: 800, title: n, opened: d, onClose: f, closeOnClickOutside: !1, withCloseButton: !1, children: d && /* @__PURE__ */ a.jsxs(Ke, { children: [
-      /* @__PURE__ */ a.jsx(Un, { value: h, onChange: c }),
+    /* @__PURE__ */ a.jsx(xe, { size: 800, title: n, opened: d, onClose: f, closeOnClickOutside: !1, withCloseButton: !1, children: d && /* @__PURE__ */ a.jsxs(Ze, { children: [
+      /* @__PURE__ */ a.jsx(Hn, { value: h, onChange: c }),
       /* @__PURE__ */ a.jsxs(z, { position: "apart", children: [
-        /* @__PURE__ */ a.jsx(D, { onClick: v, color: "red", leftIcon: /* @__PURE__ */ a.jsx(tn, { size: 20 }), children: "Reset" }),
+        /* @__PURE__ */ a.jsx(I, { onClick: v, color: "red", leftIcon: /* @__PURE__ */ a.jsx(rn, { size: 20 }), children: "Reset" }),
         /* @__PURE__ */ a.jsxs(z, { position: "right", children: [
-          /* @__PURE__ */ a.jsx(D, { onClick: g, variant: "subtle", children: "Cancel" }),
-          /* @__PURE__ */ a.jsx(D, { onClick: u, children: "OK" })
+          /* @__PURE__ */ a.jsx(I, { onClick: g, variant: "subtle", children: "Cancel" }),
+          /* @__PURE__ */ a.jsx(I, { onClick: u, children: "OK" })
         ] })
       ] })
     ] }) })
   ] });
-}), rt = {
+}), nt = {
   pre: ["function pre_process({ method, url, params, headers, data }, utils) {", "    // your code goes here", "    return { method, url, params, headers, data }", "}"].join(`
 `),
   post: ["function post_process(res, utils) {", "    // your code goes here", "    return data", "}"].join(`
 `)
 };
-function Gn({
+function qn({
   submit: e,
   styles: t = de
 }) {
@@ -1338,8 +1342,8 @@ function Gn({
       config: {
         host: "",
         processing: {
-          pre: rt.pre,
-          post: rt.post
+          pre: nt.pre,
+          post: nt.post
         }
       }
     }
@@ -1348,7 +1352,7 @@ function Gn({
     /* @__PURE__ */ a.jsx(R, { name: "key", control: r, render: ({
       field: s
     }) => /* @__PURE__ */ a.jsx(Q, { mb: t.spacing, size: t.size, required: !0, label: "Name", placeholder: "A unique name", ...s }) }),
-    /* @__PURE__ */ a.jsx(ct, { label: "Connection Info", labelPosition: "center" }),
+    /* @__PURE__ */ a.jsx(dt, { label: "Connection Info", labelPosition: "center" }),
     /* @__PURE__ */ a.jsx(R, { name: "config.host", control: r, render: ({
       field: s
     }) => /* @__PURE__ */ a.jsx(Q, { mb: t.spacing, size: t.size, label: "Base URL", sx: {
@@ -1357,28 +1361,28 @@ function Gn({
     /* @__PURE__ */ a.jsxs(z, { grow: !0, children: [
       /* @__PURE__ */ a.jsx(R, { name: "config.processing.pre", control: r, render: ({
         field: s
-      }) => /* @__PURE__ */ a.jsx(st, { label: "Pre Processing", modalTitle: "This function will run before sending the request (for scenarios like encryption)", defaultValue: rt.pre, ...s, styles: t }) }),
+      }) => /* @__PURE__ */ a.jsx(ot, { label: "Pre Processing", modalTitle: "This function will run before sending the request (for scenarios like encryption)", defaultValue: nt.pre, ...s, styles: t }) }),
       /* @__PURE__ */ a.jsx(R, { name: "config.processing.post", control: r, render: ({
         field: s
-      }) => /* @__PURE__ */ a.jsx(st, { label: "Post Processing", modalTitle: "This function will run after sending the request (for scenarios like decryption)", defaultValue: rt.post, ...s, styles: t }) })
+      }) => /* @__PURE__ */ a.jsx(ot, { label: "Post Processing", modalTitle: "This function will run after sending the request (for scenarios like decryption)", defaultValue: nt.post, ...s, styles: t }) })
     ] }),
-    /* @__PURE__ */ a.jsx(z, { position: "right", mt: t.spacing, children: /* @__PURE__ */ a.jsx(D, { type: "submit", size: t.button.size, children: "Save" }) })
+    /* @__PURE__ */ a.jsx(z, { position: "right", mt: t.spacing, children: /* @__PURE__ */ a.jsx(I, { type: "submit", size: t.button.size, children: "Save" }) })
   ] }) });
 }
-function Hn({
+function Yn({
   styles: e = de
 }) {
-  return /* @__PURE__ */ a.jsx(X, { mx: "auto", children: /* @__PURE__ */ a.jsxs(Kr, { mt: e.spacing, icon: /* @__PURE__ */ a.jsx(rn, { size: 16 }), children: [
+  return /* @__PURE__ */ a.jsx(X, { mx: "auto", children: /* @__PURE__ */ a.jsxs(Zr, { mt: e.spacing, icon: /* @__PURE__ */ a.jsx(nn, { size: 16 }), children: [
     "Only ",
     /* @__PURE__ */ a.jsx("b", { children: "SELECT" }),
     " privilege is needed."
   ] }) });
 }
-function qn({
+function Vn({
   postSubmit: e,
   styles: t = de
 }) {
-  const [r, n] = or("postgresql"), i = async ({
+  const [r, n] = lr("postgresql"), i = async ({
     type: d,
     key: p,
     config: f
@@ -1413,7 +1417,7 @@ function qn({
     }
   }, s = r === "postgresql" || r === "mysql", l = r === "http";
   return /* @__PURE__ */ a.jsxs(X, { mx: "auto", children: [
-    /* @__PURE__ */ a.jsx(Zr, { fullWidth: !0, mb: t.spacing, size: t.size, data: [{
+    /* @__PURE__ */ a.jsx(Xr, { fullWidth: !0, mb: t.spacing, size: t.size, data: [{
       label: "PostgreSQL",
       value: "postgresql"
     }, {
@@ -1423,12 +1427,12 @@ function qn({
       label: "HTTP",
       value: "http"
     }], value: r, onChange: (d) => n(d) }),
-    s && /* @__PURE__ */ a.jsx(Hn, { styles: t }),
-    s && /* @__PURE__ */ a.jsx(Bn, { submit: i, styles: t, type: r }),
-    l && /* @__PURE__ */ a.jsx(Gn, { submit: i, styles: t })
+    s && /* @__PURE__ */ a.jsx(Yn, { styles: t }),
+    s && /* @__PURE__ */ a.jsx(Gn, { submit: i, styles: t, type: r }),
+    l && /* @__PURE__ */ a.jsx(qn, { submit: i, styles: t })
   ] });
 }
-function Yn({
+function Wn({
   onSuccess: e,
   styles: t = de
 }) {
@@ -1438,32 +1442,32 @@ function Yn({
   return /* @__PURE__ */ a.jsxs(a.Fragment, { children: [
     /* @__PURE__ */ a.jsx(xe, { opened: r, onClose: () => n(!1), title: "Add a data source", trapFocus: !0, onDragStart: (d) => {
       d.stopPropagation();
-    }, children: /* @__PURE__ */ a.jsx(qn, { postSubmit: l, styles: t }) }),
-    /* @__PURE__ */ a.jsx(D, { size: t.button.size, onClick: i, leftIcon: /* @__PURE__ */ a.jsx(ht, { size: 20 }), children: "Add a Data Source" })
+    }, children: /* @__PURE__ */ a.jsx(Vn, { postSubmit: l, styles: t }) }),
+    /* @__PURE__ */ a.jsx(I, { size: t.button.size, onClick: i, leftIcon: /* @__PURE__ */ a.jsx(mt, { size: 20 }), children: "Add a Data Source" })
   ] });
 }
-const Vn = (e) => e.replace(/([^:])(\/\/+)/g, "$1/");
-function Wn(e) {
-  Ot(() => {
-    if (At.__getMonacoInstance())
+const Kn = (e) => e.replace(/([^:])(\/\/+)/g, "$1/");
+function Zn(e) {
+  It(() => {
+    if (kt.__getMonacoInstance())
       return;
     console.log("loading monaco for @devtable/settings-form");
-    const r = Vn(e);
-    At.config({
+    const r = Kn(e);
+    kt.config({
       paths: {
         vs: r
       }
-    }), At.init().then((n) => console.log("monaco instance:", n));
+    }), kt.init().then((n) => console.log("monaco instance:", n));
   }, []);
 }
-function Kn({
+function Xn({
   id: e,
   name: t,
   isProtected: r,
   onSuccess: n,
   styles: i = de
 }) {
-  const s = Ze(), l = async () => {
+  const s = Xe(), l = async () => {
     e && (oe({
       id: "for-deleting",
       title: "Pending",
@@ -1487,21 +1491,21 @@ function Kn({
     onCancel: () => console.log("Cancel"),
     onConfirm: l
   });
-  return r ? /* @__PURE__ */ a.jsx(at, { withArrow: !0, events: {
+  return r ? /* @__PURE__ */ a.jsx(it, { withArrow: !0, events: {
     hover: !0,
     touch: !1,
     focus: !1
-  }, label: "This is a preset datasource, it can not be deleted", children: /* @__PURE__ */ a.jsx(D, { size: i.button.size, color: "gray", variant: "light", leftIcon: /* @__PURE__ */ a.jsx(dr, { size: 16 }), sx: {
+  }, label: "This is a preset datasource, it can not be deleted", children: /* @__PURE__ */ a.jsx(I, { size: i.button.size, color: "gray", variant: "light", leftIcon: /* @__PURE__ */ a.jsx(dr, { size: 16 }), sx: {
     transform: "none !important"
-  }, children: "Delete" }) }) : /* @__PURE__ */ a.jsx(D, { size: i.button.size, color: "red", onClick: d, leftIcon: /* @__PURE__ */ a.jsx(mt, { size: 16 }), children: "Delete" });
+  }, children: "Delete" }) }) : /* @__PURE__ */ a.jsx(I, { size: i.button.size, color: "red", onClick: d, leftIcon: /* @__PURE__ */ a.jsx(bt, { size: 16 }), children: "Delete" });
 }
-const tr = {
+const rr = {
   pre: ["function pre_process({ method, url, params, headers, data }, utils) {", "    // your code goes here", "    return { method, url, params, headers, data }", "}"].join(`
 `),
   post: ["function post_process(res, utils) {", "    // your code goes here", "    return data", "}"].join(`
 `)
 };
-function Zn({
+function Qn({
   name: e,
   config: t,
   submit: r,
@@ -1517,7 +1521,7 @@ function Zn({
   });
   return /* @__PURE__ */ a.jsx(X, { mx: "auto", children: /* @__PURE__ */ a.jsxs("form", { onSubmit: s(r), children: [
     /* @__PURE__ */ a.jsx(Q, { mb: n.spacing, size: n.size, required: !0, label: "Name", value: e, readOnly: !0 }),
-    /* @__PURE__ */ a.jsx(ct, { label: "Connection Info", labelPosition: "center" }),
+    /* @__PURE__ */ a.jsx(dt, { label: "Connection Info", labelPosition: "center" }),
     /* @__PURE__ */ a.jsx(R, { name: "config.host", control: i, render: ({
       field: l
     }) => /* @__PURE__ */ a.jsx(Q, { mb: n.spacing, size: n.size, label: "Base URL", sx: {
@@ -1526,15 +1530,15 @@ function Zn({
     /* @__PURE__ */ a.jsxs(z, { grow: !0, children: [
       /* @__PURE__ */ a.jsx(R, { name: "config.processing.pre", control: i, render: ({
         field: l
-      }) => /* @__PURE__ */ a.jsx(st, { label: "Pre Processing", modalTitle: "This function will run before sending the request (for scenarios like encryption)", defaultValue: tr.pre, ...l, styles: n }) }),
+      }) => /* @__PURE__ */ a.jsx(ot, { label: "Pre Processing", modalTitle: "This function will run before sending the request (for scenarios like encryption)", defaultValue: rr.pre, ...l, styles: n }) }),
       /* @__PURE__ */ a.jsx(R, { name: "config.processing.post", control: i, render: ({
         field: l
-      }) => /* @__PURE__ */ a.jsx(st, { label: "Post Processing", modalTitle: "This function will run after sending the request (for scenarios like decryption)", defaultValue: tr.post, ...l, styles: n }) })
+      }) => /* @__PURE__ */ a.jsx(ot, { label: "Post Processing", modalTitle: "This function will run after sending the request (for scenarios like decryption)", defaultValue: rr.post, ...l, styles: n }) })
     ] }),
-    /* @__PURE__ */ a.jsx(z, { position: "right", mt: n.spacing, children: /* @__PURE__ */ a.jsx(D, { type: "submit", size: n.button.size, children: "Save" }) })
+    /* @__PURE__ */ a.jsx(z, { position: "right", mt: n.spacing, children: /* @__PURE__ */ a.jsx(I, { type: "submit", color: "green", leftIcon: /* @__PURE__ */ a.jsx(Pe, { size: 16 }), size: n.button.size, children: "Submit" }) })
   ] }) });
 }
-function Xn({
+function Jn({
   dataSource: e,
   postSubmit: t,
   styles: r = de
@@ -1569,9 +1573,9 @@ function Xn({
       });
     }
   };
-  return e.config ? /* @__PURE__ */ a.jsx(X, { mx: "auto", children: /* @__PURE__ */ a.jsx(Zn, { name: e.key, config: e.config, submit: n, styles: r }) }) : (console.error(new Error("unexpected empty config of a http datasource")), null);
+  return e.config ? /* @__PURE__ */ a.jsx(X, { mx: "auto", children: /* @__PURE__ */ a.jsx(Qn, { name: e.key, config: e.config, submit: n, styles: r }) }) : (console.error(new Error("unexpected empty config of a http datasource")), null);
 }
-function Qn({
+function ea({
   dataSource: e,
   onSuccess: t,
   styles: r = de
@@ -1579,52 +1583,52 @@ function Qn({
   const [n, i] = F.useState(!1), s = () => i(!0), l = () => i(!1), d = () => {
     t(), l();
   };
-  return e.is_preset ? /* @__PURE__ */ a.jsx(at, { withArrow: !0, events: {
+  return e.is_preset ? /* @__PURE__ */ a.jsx(it, { withArrow: !0, events: {
     hover: !0,
     touch: !1,
     focus: !1
-  }, label: "This is a preset datasource, it can not be changed", children: /* @__PURE__ */ a.jsx(D, { size: r.button.size, color: "gray", variant: "light", leftIcon: /* @__PURE__ */ a.jsx(dr, { size: 16 }), sx: {
+  }, label: "This is a preset datasource, it can not be changed", children: /* @__PURE__ */ a.jsx(I, { size: r.button.size, color: "gray", variant: "light", leftIcon: /* @__PURE__ */ a.jsx(dr, { size: 16 }), sx: {
     transform: "none !important"
-  }, children: "Edit" }) }) : e.type !== "http" ? /* @__PURE__ */ a.jsx(at, { withArrow: !0, events: {
+  }, children: "Edit" }) }) : e.type !== "http" ? /* @__PURE__ */ a.jsx(it, { withArrow: !0, events: {
     hover: !0,
     touch: !1,
     focus: !1
-  }, label: "Only HTTP datasources can be edited", children: /* @__PURE__ */ a.jsx(D, { size: r.button.size, color: "gray", variant: "light", leftIcon: /* @__PURE__ */ a.jsx(Tt, { size: 16 }), sx: {
+  }, label: "Only HTTP datasources can be edited", children: /* @__PURE__ */ a.jsx(I, { size: r.button.size, color: "gray", variant: "light", leftIcon: /* @__PURE__ */ a.jsx(jt, { size: 16 }), sx: {
     transform: "none !important"
   }, children: "Edit" }) }) : /* @__PURE__ */ a.jsxs(a.Fragment, { children: [
     /* @__PURE__ */ a.jsx(xe, { opened: n, onClose: () => i(!1), title: "Add a data source", trapFocus: !0, onDragStart: (p) => {
       p.stopPropagation();
-    }, children: /* @__PURE__ */ a.jsx(Xn, { dataSource: e, postSubmit: d, styles: r }) }),
-    /* @__PURE__ */ a.jsx(D, { size: r.button.size, color: "blue", onClick: s, leftIcon: /* @__PURE__ */ a.jsx(Tt, { size: 16 }), children: "Edit" })
+    }, children: /* @__PURE__ */ a.jsx(Jn, { dataSource: e, postSubmit: d, styles: r }) }),
+    /* @__PURE__ */ a.jsx(I, { size: r.button.size, color: "blue", onClick: s, leftIcon: /* @__PURE__ */ a.jsx(jt, { size: 16 }), children: "Edit" })
   ] });
 }
-const Jn = {
+const ta = {
   http: "HTTP",
   mysql: "MySQL",
   postgresql: "PostgreSQL"
-}, ea = {
+}, ra = {
   http: /* @__PURE__ */ a.jsx(un, {}),
   mysql: /* @__PURE__ */ a.jsx(cn, {}),
   postgresql: /* @__PURE__ */ a.jsx(dn, {})
 };
-function ta({
+function na({
   type: e
 }) {
   return /* @__PURE__ */ a.jsxs(z, { children: [
     /* @__PURE__ */ a.jsx(Dt, { size: "xs", sx: {
       transform: "none !important"
-    }, children: ea[e] }),
+    }, children: ra[e] }),
     /* @__PURE__ */ a.jsx(ke, { sx: {
       cusor: "default",
       userSelect: "none"
-    }, children: Jn[e] })
+    }, children: ta[e] })
   ] });
 }
-function ti({
+function ai({
   styles: e = de,
   config: t
 }) {
-  Wn(t.monacoPath), Xe(t);
+  Zn(t.monacoPath), Qe(t);
   const {
     data: r = [],
     loading: n,
@@ -1638,12 +1642,12 @@ function ti({
     refreshDeps: []
   });
   return /* @__PURE__ */ a.jsxs(a.Fragment, { children: [
-    /* @__PURE__ */ a.jsx(z, { pt: e.spacing, position: "right", children: /* @__PURE__ */ a.jsx(Yn, { onSuccess: i }) }),
+    /* @__PURE__ */ a.jsx(z, { pt: e.spacing, position: "right", children: /* @__PURE__ */ a.jsx(Wn, { onSuccess: i }) }),
     /* @__PURE__ */ a.jsxs(X, { mt: e.spacing, sx: {
       position: "relative"
     }, children: [
-      /* @__PURE__ */ a.jsx(pt, { visible: n }),
-      /* @__PURE__ */ a.jsxs(ft, { horizontalSpacing: e.spacing, verticalSpacing: e.spacing, fontSize: e.size, highlightOnHover: !0, children: [
+      /* @__PURE__ */ a.jsx(ft, { visible: n }),
+      /* @__PURE__ */ a.jsxs(gt, { horizontalSpacing: e.spacing, verticalSpacing: e.spacing, fontSize: e.size, highlightOnHover: !0, children: [
         /* @__PURE__ */ a.jsx("thead", { children: /* @__PURE__ */ a.jsxs("tr", { children: [
           /* @__PURE__ */ a.jsx("th", { children: "Type" }),
           /* @__PURE__ */ a.jsx("th", { children: "Name" }),
@@ -1657,11 +1661,11 @@ function ti({
             is_preset: f
           } = s;
           return /* @__PURE__ */ a.jsxs("tr", { children: [
-            /* @__PURE__ */ a.jsx("td", { width: 200, children: /* @__PURE__ */ a.jsx(ta, { type: p }) }),
+            /* @__PURE__ */ a.jsx("td", { width: 200, children: /* @__PURE__ */ a.jsx(na, { type: p }) }),
             /* @__PURE__ */ a.jsx("td", { children: d }),
             /* @__PURE__ */ a.jsx("td", { width: 400, children: /* @__PURE__ */ a.jsxs(z, { position: "left", children: [
-              /* @__PURE__ */ a.jsx(Qn, { dataSource: s, onSuccess: i, styles: e }),
-              /* @__PURE__ */ a.jsx(Kn, { isProtected: f, id: l, name: d, onSuccess: i, styles: e })
+              /* @__PURE__ */ a.jsx(ea, { dataSource: s, onSuccess: i, styles: e }),
+              /* @__PURE__ */ a.jsx(Xn, { isProtected: f, id: l, name: d, onSuccess: i, styles: e })
             ] }) })
           ] }, d);
         }) })
@@ -1669,15 +1673,15 @@ function ti({
     ] })
   ] });
 }
-const ra = ut(({
+const aa = ct(({
   label: e,
   value: t,
   description: r,
   ...n
-}, i) => /* @__PURE__ */ a.jsxs(Ke, { spacing: 2, ref: i, ...n, children: [
+}, i) => /* @__PURE__ */ a.jsxs(Ze, { spacing: 2, ref: i, ...n, children: [
   /* @__PURE__ */ a.jsx(ke, { size: "sm", children: e }),
   /* @__PURE__ */ a.jsx(ke, { size: "xs", color: "dimmed", className: "role-description", children: r })
-] })), Ft = ut(({
+] })), Nt = ct(({
   styles: e,
   value: t,
   onChange: r
@@ -1693,7 +1697,7 @@ const ra = ut(({
   })), {
     refreshDeps: []
   });
-  return /* @__PURE__ */ a.jsx(Xr, { ref: n, mb: e.spacing, size: e.size, required: !0, label: "Role", itemComponent: ra, data: i, disabled: s, styles: () => ({
+  return /* @__PURE__ */ a.jsx(Qr, { ref: n, mb: e.spacing, size: e.size, required: !0, label: "Role", itemComponent: aa, data: i, disabled: s, styles: () => ({
     item: {
       "&[data-selected]": {
         "&, &:hover": {
@@ -1711,7 +1715,7 @@ const ra = ut(({
     size: "xs"
   }
 };
-function na({
+function ia({
   postSubmit: e,
   styles: t = we,
   initialRoleID: r
@@ -1765,14 +1769,14 @@ function na({
     }) => /* @__PURE__ */ a.jsx(Q, { mb: t.spacing, size: t.size, required: !0, label: "Email", ...l }) }),
     /* @__PURE__ */ a.jsx(R, { name: "password", control: n, render: ({
       field: l
-    }) => /* @__PURE__ */ a.jsx(dt, { mb: t.spacing, size: t.size, required: !0, label: "Password", description: "Password must be at least 8 characters long", ...l }) }),
+    }) => /* @__PURE__ */ a.jsx(pt, { mb: t.spacing, size: t.size, required: !0, label: "Password", description: "Password must be at least 8 characters long", ...l }) }),
     /* @__PURE__ */ a.jsx(R, { name: "role_id", control: n, render: ({
       field: l
-    }) => /* @__PURE__ */ a.jsx(Ft, { styles: t, ...l }) }),
-    /* @__PURE__ */ a.jsx(z, { position: "right", mt: t.spacing, children: /* @__PURE__ */ a.jsx(D, { type: "submit", size: t.button.size, children: "Save" }) })
+    }) => /* @__PURE__ */ a.jsx(Nt, { styles: t, ...l }) }),
+    /* @__PURE__ */ a.jsx(z, { position: "right", mt: t.spacing, children: /* @__PURE__ */ a.jsx(I, { type: "submit", color: "green", leftIcon: /* @__PURE__ */ a.jsx(Pe, { size: 16 }), size: t.button.size, children: "Submit" }) })
   ] }) });
 }
-function aa({
+function sa({
   onSuccess: e,
   styles: t = we,
   initialRoleID: r
@@ -1783,17 +1787,17 @@ function aa({
   return /* @__PURE__ */ a.jsxs(a.Fragment, { children: [
     /* @__PURE__ */ a.jsx(xe, { opened: n, onClose: () => i(!1), title: "Add an Account", trapFocus: !0, onDragStart: (p) => {
       p.stopPropagation();
-    }, children: /* @__PURE__ */ a.jsx(na, { postSubmit: d, styles: t, initialRoleID: r }) }),
-    /* @__PURE__ */ a.jsx(D, { size: t.button.size, onClick: s, leftIcon: /* @__PURE__ */ a.jsx(ht, { size: 20 }), children: "Add an Account" })
+    }, children: /* @__PURE__ */ a.jsx(ia, { postSubmit: d, styles: t, initialRoleID: r }) }),
+    /* @__PURE__ */ a.jsx(I, { size: t.button.size, onClick: s, leftIcon: /* @__PURE__ */ a.jsx(mt, { size: 20 }), children: "Add an Account" })
   ] });
 }
-function ia({
+function oa({
   id: e,
   name: t,
   onSuccess: r,
   styles: n = we
 }) {
-  const i = Ze(), s = async () => {
+  const i = Xe(), s = async () => {
     if (e) {
       oe({
         id: "for-deleting",
@@ -1829,9 +1833,9 @@ function ia({
     onCancel: () => console.log("Cancel"),
     onConfirm: s
   });
-  return /* @__PURE__ */ a.jsx(D, { size: n.button.size, color: "red", onClick: l, leftIcon: /* @__PURE__ */ a.jsx(mt, { size: 20 }), children: "Delete" });
+  return /* @__PURE__ */ a.jsx(I, { size: n.button.size, color: "red", onClick: l, leftIcon: /* @__PURE__ */ a.jsx(bt, { size: 20 }), children: "Delete" });
 }
-function sa({
+function la({
   id: e,
   name: t,
   email: r,
@@ -1898,11 +1902,11 @@ function sa({
     }) => /* @__PURE__ */ a.jsx(Q, { mb: s.spacing, size: s.size, required: !0, label: "Email", ...u }) }),
     /* @__PURE__ */ a.jsx(R, { name: "role_id", control: l, render: ({
       field: u
-    }) => /* @__PURE__ */ a.jsx(Ft, { styles: s, ...u }) }),
-    /* @__PURE__ */ a.jsx(ct, { my: 20, variant: "dashed", label: "", labelPosition: "center" }),
+    }) => /* @__PURE__ */ a.jsx(Nt, { styles: s, ...u }) }),
+    /* @__PURE__ */ a.jsx(dt, { my: 20, variant: "dashed", label: "", labelPosition: "center" }),
     /* @__PURE__ */ a.jsx(R, { name: "reset_password", control: l, render: ({
       field: u
-    }) => /* @__PURE__ */ a.jsx(Qr, { mb: s.spacing, size: s.size, label: "Reset password", checked: u.value, onChange: (g) => u.onChange(g.currentTarget.checked), styles: {
+    }) => /* @__PURE__ */ a.jsx(Jr, { mb: s.spacing, size: s.size, label: "Reset password", checked: u.value, onChange: (g) => u.onChange(g.currentTarget.checked), styles: {
       label: {
         verticalAlign: "middle"
       }
@@ -1914,13 +1918,13 @@ function sa({
         control: l,
         render: ({
           field: u
-        }) => /* @__PURE__ */ a.jsx(dt, { autoComplete: "off", mb: s.spacing, size: s.size, required: !0, description: "Password must be at least 8 characters long", label: "New Password", ...u })
+        }) => /* @__PURE__ */ a.jsx(pt, { autoComplete: "off", mb: s.spacing, size: s.size, required: !0, description: "Password must be at least 8 characters long", label: "New Password", ...u })
       }
     ),
-    /* @__PURE__ */ a.jsx(z, { position: "right", mt: s.spacing, children: /* @__PURE__ */ a.jsx(D, { type: "submit", size: s.button.size, children: "Submit" }) })
+    /* @__PURE__ */ a.jsx(z, { position: "right", mt: s.spacing, children: /* @__PURE__ */ a.jsx(I, { type: "submit", color: "green", leftIcon: /* @__PURE__ */ a.jsx(Pe, { size: 16 }), size: s.button.size, children: "Submit" }) })
   ] }) });
 }
-function oa({
+function ua({
   account: e,
   onSuccess: t,
   styles: r = we
@@ -1931,16 +1935,16 @@ function oa({
   return /* @__PURE__ */ a.jsxs(a.Fragment, { children: [
     /* @__PURE__ */ a.jsx(xe, { opened: n, onClose: () => i(!1), title: `Editing ${e.name}`, trapFocus: !0, onDragStart: (p) => {
       p.stopPropagation();
-    }, children: /* @__PURE__ */ a.jsx(sa, { ...e, postSubmit: d, styles: r }) }),
-    /* @__PURE__ */ a.jsx(D, { size: r.button.size, onClick: s, leftIcon: /* @__PURE__ */ a.jsx(nn, { size: 20 }), children: "Edit" })
+    }, children: /* @__PURE__ */ a.jsx(la, { ...e, postSubmit: d, styles: r }) }),
+    /* @__PURE__ */ a.jsx(I, { size: r.button.size, onClick: s, leftIcon: /* @__PURE__ */ a.jsx(an, { size: 20 }), children: "Edit" })
   ] });
 }
-function ri({
+function ii({
   styles: e = we,
   config: t
 }) {
   var d;
-  Xe(t);
+  Qe(t);
   const {
     data: r = [],
     loading: n,
@@ -1964,12 +1968,12 @@ function ri({
     refreshDeps: []
   });
   return /* @__PURE__ */ a.jsxs(a.Fragment, { children: [
-    /* @__PURE__ */ a.jsx(z, { pt: e.spacing, position: "right", children: /* @__PURE__ */ a.jsx(aa, { onSuccess: i, initialRoleID: ((d = s == null ? void 0 : s[0]) == null ? void 0 : d.value) ?? "INACTIVE" }) }),
+    /* @__PURE__ */ a.jsx(z, { pt: e.spacing, position: "right", children: /* @__PURE__ */ a.jsx(sa, { onSuccess: i, initialRoleID: ((d = s == null ? void 0 : s[0]) == null ? void 0 : d.value) ?? "INACTIVE" }) }),
     /* @__PURE__ */ a.jsxs(X, { mt: e.spacing, sx: {
       position: "relative"
     }, children: [
-      /* @__PURE__ */ a.jsx(pt, { visible: n || l }),
-      /* @__PURE__ */ a.jsxs(ft, { horizontalSpacing: e.spacing, verticalSpacing: e.spacing, fontSize: e.size, highlightOnHover: !0, children: [
+      /* @__PURE__ */ a.jsx(ft, { visible: n || l }),
+      /* @__PURE__ */ a.jsxs(gt, { horizontalSpacing: e.spacing, verticalSpacing: e.spacing, fontSize: e.size, highlightOnHover: !0, children: [
         /* @__PURE__ */ a.jsx("thead", { children: /* @__PURE__ */ a.jsxs("tr", { children: [
           /* @__PURE__ */ a.jsx("th", { children: "Username" }),
           /* @__PURE__ */ a.jsx("th", { children: "Email" }),
@@ -1988,8 +1992,8 @@ function ri({
             /* @__PURE__ */ a.jsx("td", { width: 200, children: c }),
             /* @__PURE__ */ a.jsx("td", { width: 200, children: u }),
             /* @__PURE__ */ a.jsx("td", { width: 200, children: /* @__PURE__ */ a.jsxs(z, { position: "left", children: [
-              /* @__PURE__ */ a.jsx(oa, { account: p, onSuccess: i }),
-              /* @__PURE__ */ a.jsx(ia, { id: f, name: h, onSuccess: i })
+              /* @__PURE__ */ a.jsx(ua, { account: p, onSuccess: i }),
+              /* @__PURE__ */ a.jsx(oa, { id: f, name: h, onSuccess: i })
             ] }) })
           ] }, f);
         }) })
@@ -1997,7 +2001,7 @@ function ri({
     ] })
   ] });
 }
-function la({
+function ca({
   postSubmit: e,
   styles: t = we
 }) {
@@ -2045,29 +2049,29 @@ function la({
     }) => /* @__PURE__ */ a.jsx(Q, { mb: t.spacing, size: t.size, required: !0, label: "Username", ...s }) }),
     /* @__PURE__ */ a.jsx(R, { name: "password", control: r, render: ({
       field: s
-    }) => /* @__PURE__ */ a.jsx(dt, { mb: t.spacing, size: t.size, required: !0, label: "Password", ...s }) }),
-    /* @__PURE__ */ a.jsx(z, { position: "right", mt: t.spacing, children: /* @__PURE__ */ a.jsx(D, { type: "submit", size: t.button.size, children: "Submit" }) })
+    }) => /* @__PURE__ */ a.jsx(pt, { mb: t.spacing, size: t.size, required: !0, label: "Password", ...s }) }),
+    /* @__PURE__ */ a.jsx(z, { position: "right", mt: t.spacing, children: /* @__PURE__ */ a.jsx(I, { type: "submit", size: t.button.size, children: "Submit" }) })
   ] }) });
 }
-function ni({
+function si({
   styles: e = we,
   config: t,
   onSuccess: r
 }) {
-  return Xe(t), /* @__PURE__ */ a.jsx(a.Fragment, { children: /* @__PURE__ */ a.jsx(X, { mt: e.spacing, sx: {
+  return Qe(t), /* @__PURE__ */ a.jsx(a.Fragment, { children: /* @__PURE__ */ a.jsx(X, { mt: e.spacing, sx: {
     position: "relative"
-  }, children: /* @__PURE__ */ a.jsx(la, { styles: e, postSubmit: r }) }) });
+  }, children: /* @__PURE__ */ a.jsx(ca, { styles: e, postSubmit: r }) }) });
 }
-const vt = {
+const yt = {
   size: "sm",
   spacing: "md",
   button: {
     size: "xs"
   }
 };
-function ua({
+function da({
   postSubmit: e,
-  styles: t = vt,
+  styles: t = yt,
   initialRoleID: r
 }) {
   const {
@@ -2117,19 +2121,19 @@ function ua({
     }) => /* @__PURE__ */ a.jsx(Q, { mb: t.spacing, size: t.size, required: !0, label: "Name", ...l }) }),
     /* @__PURE__ */ a.jsx(R, { name: "role_id", control: n, render: ({
       field: l
-    }) => /* @__PURE__ */ a.jsx(Ft, { styles: t, ...l }) }),
-    /* @__PURE__ */ a.jsx(z, { position: "right", mt: t.spacing, children: /* @__PURE__ */ a.jsx(D, { type: "submit", size: t.button.size, children: "Save" }) })
+    }) => /* @__PURE__ */ a.jsx(Nt, { styles: t, ...l }) }),
+    /* @__PURE__ */ a.jsx(z, { position: "right", mt: t.spacing, children: /* @__PURE__ */ a.jsx(I, { type: "submit", size: t.button.size, children: "Save" }) })
   ] }) });
 }
-function ca({
+function pa({
   onSuccess: e,
-  styles: t = vt,
+  styles: t = yt,
   initialRoleID: r
 }) {
-  const n = Ze(), [i, s] = F.useState(!1), l = () => s(!0), d = () => s(!1), p = (f, h) => {
+  const n = Xe(), [i, s] = F.useState(!1), l = () => s(!0), d = () => s(!1), p = (f, h) => {
     d(), n.openModal({
       title: "API Key is generated",
-      children: /* @__PURE__ */ a.jsxs(Ke, { children: [
+      children: /* @__PURE__ */ a.jsxs(Ze, { children: [
         /* @__PURE__ */ a.jsx(ke, { color: "dimmed", children: "Make sure you save it - you won't be able to access it again." }),
         /* @__PURE__ */ a.jsx(Q, { defaultValue: f, disabled: !0, label: "APP ID", styles: {
           input: {
@@ -2141,8 +2145,8 @@ function ca({
             cursor: "text !important"
           }
         } }),
-        /* @__PURE__ */ a.jsx(D, { size: "sm", onClick: () => {
-          ln();
+        /* @__PURE__ */ a.jsx(I, { size: "sm", onClick: () => {
+          gn();
         }, children: "I've saved this API Key" })
       ] }),
       onClose: () => {
@@ -2153,17 +2157,17 @@ function ca({
   return /* @__PURE__ */ a.jsxs(a.Fragment, { children: [
     /* @__PURE__ */ a.jsx(xe, { opened: i, onClose: () => s(!1), title: "Add an API Key", trapFocus: !0, onDragStart: (f) => {
       f.stopPropagation();
-    }, children: /* @__PURE__ */ a.jsx(ua, { postSubmit: p, styles: t, initialRoleID: r }) }),
-    /* @__PURE__ */ a.jsx(D, { size: t.button.size, onClick: l, leftIcon: /* @__PURE__ */ a.jsx(ht, { size: 20 }), children: "Add an API Key" })
+    }, children: /* @__PURE__ */ a.jsx(da, { postSubmit: p, styles: t, initialRoleID: r }) }),
+    /* @__PURE__ */ a.jsx(I, { size: t.button.size, onClick: l, leftIcon: /* @__PURE__ */ a.jsx(mt, { size: 20 }), children: "Add an API Key" })
   ] });
 }
-function da({
+function fa({
   id: e,
   name: t,
   onSuccess: r,
-  styles: n = vt
+  styles: n = yt
 }) {
-  const i = Ze(), s = async () => {
+  const i = Xe(), s = async () => {
     if (e) {
       oe({
         id: "for-deleting",
@@ -2199,14 +2203,14 @@ function da({
     onCancel: () => console.log("Cancel"),
     onConfirm: s
   });
-  return /* @__PURE__ */ a.jsx(D, { size: n.button.size, color: "red", onClick: l, leftIcon: /* @__PURE__ */ a.jsx(mt, { size: 20 }), children: "Delete" });
+  return /* @__PURE__ */ a.jsx(I, { size: n.button.size, color: "red", onClick: l, leftIcon: /* @__PURE__ */ a.jsx(bt, { size: 20 }), children: "Delete" });
 }
-function ai({
-  styles: e = vt,
+function oi({
+  styles: e = yt,
   config: t
 }) {
   var d;
-  Xe(t);
+  Qe(t);
   const {
     data: r = [],
     loading: n,
@@ -2230,12 +2234,12 @@ function ai({
     refreshDeps: []
   });
   return /* @__PURE__ */ a.jsxs(a.Fragment, { children: [
-    /* @__PURE__ */ a.jsx(z, { pt: e.spacing, position: "right", children: /* @__PURE__ */ a.jsx(ca, { onSuccess: i, initialRoleID: ((d = s == null ? void 0 : s[0]) == null ? void 0 : d.value) ?? "INACTIVE" }) }),
+    /* @__PURE__ */ a.jsx(z, { pt: e.spacing, position: "right", children: /* @__PURE__ */ a.jsx(pa, { onSuccess: i, initialRoleID: ((d = s == null ? void 0 : s[0]) == null ? void 0 : d.value) ?? "INACTIVE" }) }),
     /* @__PURE__ */ a.jsxs(X, { mt: e.spacing, sx: {
       position: "relative"
     }, children: [
-      /* @__PURE__ */ a.jsx(pt, { visible: n || l }),
-      /* @__PURE__ */ a.jsxs(ft, { horizontalSpacing: e.spacing, verticalSpacing: e.spacing, fontSize: e.size, highlightOnHover: !0, children: [
+      /* @__PURE__ */ a.jsx(ft, { visible: n || l }),
+      /* @__PURE__ */ a.jsxs(gt, { horizontalSpacing: e.spacing, verticalSpacing: e.spacing, fontSize: e.size, highlightOnHover: !0, children: [
         /* @__PURE__ */ a.jsx("thead", { children: /* @__PURE__ */ a.jsxs("tr", { children: [
           /* @__PURE__ */ a.jsx("th", { children: "Name" }),
           /* @__PURE__ */ a.jsx("th", { children: "APP ID" }),
@@ -2253,14 +2257,14 @@ function ai({
             /* @__PURE__ */ a.jsx("td", { width: 200, children: h }),
             /* @__PURE__ */ a.jsx("td", { width: 200, children: c }),
             /* @__PURE__ */ a.jsx("td", { width: 200, children: u }),
-            /* @__PURE__ */ a.jsx("td", { width: 200, children: /* @__PURE__ */ a.jsx(z, { position: "left", children: /* @__PURE__ */ a.jsx(da, { id: f, name: h, onSuccess: i }) }) })
+            /* @__PURE__ */ a.jsx("td", { width: 200, children: /* @__PURE__ */ a.jsx(z, { position: "left", children: /* @__PURE__ */ a.jsx(fa, { id: f, name: h, onSuccess: i }) }) })
           ] }, f);
         }) })
       ] })
     ] })
   ] });
 }
-const br = ({
+const vr = ({
   value: e,
   onChange: t,
   height: r = "200px",
@@ -2269,7 +2273,7 @@ const br = ({
   const i = (l) => {
     console.log("changing"), t == null || t(l ?? "");
   }, s = !t;
-  return /* @__PURE__ */ a.jsx(cr, { className: "minimal-monaco-editor", height: r, defaultLanguage: n, value: e, onChange: s ? void 0 : i, theme: "vs-dark", options: {
+  return /* @__PURE__ */ a.jsx(pr, { className: "minimal-monaco-editor", height: r, defaultLanguage: n, value: e, onChange: s ? void 0 : i, theme: "vs-dark", options: {
     lineNumbers: "off",
     folding: !1,
     lineDecorationsWidth: 20,
@@ -2280,16 +2284,16 @@ const br = ({
     },
     readOnly: s || !t
   } });
-}, Pe = {
+}, Me = {
   size: "sm",
   spacing: "md",
   button: {
     size: "xs"
   }
 };
-function pa({
+function ga({
   postSubmit: e,
-  styles: t = Pe
+  styles: t = Me
 }) {
   const {
     control: r,
@@ -2330,18 +2334,18 @@ function pa({
     }) => /* @__PURE__ */ a.jsx(Q, { mb: t.spacing, size: t.size, required: !0, label: "Name", ...s }) }),
     /* @__PURE__ */ a.jsx(R, { name: "content", control: r, render: ({
       field: s
-    }) => /* @__PURE__ */ a.jsxs(Ke, { spacing: 4, children: [
+    }) => /* @__PURE__ */ a.jsxs(Ze, { spacing: 4, children: [
       /* @__PURE__ */ a.jsx(ke, { size: 14, fw: 500, color: "#212529", sx: {
         cursor: "default"
       }, children: "Content" }),
-      /* @__PURE__ */ a.jsx(br, { height: "600px", ...s })
+      /* @__PURE__ */ a.jsx(vr, { height: "600px", ...s })
     ] }) }),
-    /* @__PURE__ */ a.jsx(z, { position: "right", mt: t.spacing, children: /* @__PURE__ */ a.jsx(D, { type: "submit", size: t.button.size, children: "Save" }) })
+    /* @__PURE__ */ a.jsx(z, { position: "right", mt: t.spacing, children: /* @__PURE__ */ a.jsx(I, { type: "submit", color: "green", leftIcon: /* @__PURE__ */ a.jsx(Pe, { size: 16 }), size: t.button.size, children: "Submit" }) })
   ] }) });
 }
-function fa({
+function ha({
   onSuccess: e,
-  styles: t = Pe
+  styles: t = Me
 }) {
   const [r, n] = F.useState(!1), i = () => n(!0), s = () => n(!1), l = () => {
     s(), e();
@@ -2349,13 +2353,13 @@ function fa({
   return /* @__PURE__ */ a.jsxs(a.Fragment, { children: [
     /* @__PURE__ */ a.jsx(xe, { opened: r, onClose: () => n(!1), title: "Add a SQL Snippet", trapFocus: !0, onDragStart: (d) => {
       d.stopPropagation();
-    }, size: "80vw", children: /* @__PURE__ */ a.jsx(pa, { postSubmit: l, styles: t }) }),
-    /* @__PURE__ */ a.jsx(D, { size: t.button.size, onClick: i, leftIcon: /* @__PURE__ */ a.jsx(ht, { size: 18 }), children: "Add a SQL Snippet" })
+    }, size: "80vw", children: /* @__PURE__ */ a.jsx(ga, { postSubmit: l, styles: t }) }),
+    /* @__PURE__ */ a.jsx(I, { size: t.button.size, onClick: i, leftIcon: /* @__PURE__ */ a.jsx(mt, { size: 18 }), children: "Add a SQL Snippet" })
   ] });
 }
-function ga({
+function ma({
   postSubmit: e,
-  styles: t = Pe,
+  styles: t = Me,
   id: r,
   content: n
 }) {
@@ -2398,18 +2402,18 @@ function ga({
     }) => /* @__PURE__ */ a.jsx(Q, { mb: t.spacing, size: t.size, required: !0, label: "Name", ...d }) }),
     /* @__PURE__ */ a.jsx(R, { name: "content", control: i, render: ({
       field: d
-    }) => /* @__PURE__ */ a.jsxs(Ke, { spacing: 4, children: [
+    }) => /* @__PURE__ */ a.jsxs(Ze, { spacing: 4, children: [
       /* @__PURE__ */ a.jsx(ke, { size: 14, fw: 500, color: "#212529", sx: {
         cursor: "default"
       }, children: "Content" }),
-      /* @__PURE__ */ a.jsx(br, { height: "600px", ...d })
+      /* @__PURE__ */ a.jsx(vr, { height: "600px", ...d })
     ] }) }),
-    /* @__PURE__ */ a.jsx(z, { position: "right", mt: t.spacing, children: /* @__PURE__ */ a.jsx(D, { type: "submit", size: t.button.size, children: "Save" }) })
+    /* @__PURE__ */ a.jsx(z, { position: "right", mt: t.spacing, children: /* @__PURE__ */ a.jsx(I, { type: "submit", color: "green", leftIcon: /* @__PURE__ */ a.jsx(Pe, { size: 16 }), size: t.button.size, children: "Submit" }) })
   ] }) });
 }
-function ha({
+function ba({
   onSuccess: e,
-  styles: t = Pe,
+  styles: t = Me,
   ...r
 }) {
   const [n, i] = F.useState(!1), s = () => i(!0), l = () => i(!1), d = () => {
@@ -2418,8 +2422,8 @@ function ha({
   return /* @__PURE__ */ a.jsxs(a.Fragment, { children: [
     /* @__PURE__ */ a.jsx(xe, { opened: n, onClose: () => i(!1), title: "Edit a SQL Snippet", trapFocus: !0, onDragStart: (p) => {
       p.stopPropagation();
-    }, size: "80vw", children: /* @__PURE__ */ a.jsx(ga, { postSubmit: d, styles: t, ...r }) }),
-    /* @__PURE__ */ a.jsx(D, { size: t.button.size, onClick: s, leftIcon: /* @__PURE__ */ a.jsx(Tt, { size: 18 }), children: "Edit" })
+    }, size: "80vw", children: /* @__PURE__ */ a.jsx(ma, { postSubmit: d, styles: t, ...r }) }),
+    /* @__PURE__ */ a.jsx(I, { size: t.button.size, onClick: s, leftIcon: /* @__PURE__ */ a.jsx(jt, { size: 18 }), children: "Edit" })
   ] });
 }
 /**
@@ -2430,7 +2434,7 @@ function ha({
  * @namespace
  * @public
  */
-var Rt = function() {
+var Ot = function() {
   var e = /(?:^|\s)lang(?:uage)?-([\w-]+)(?=\s|$)/i, t = 0, r = {}, n = {
     /**
      * A namespace for utility methods.
@@ -2926,8 +2930,8 @@ var Rt = function() {
     return u;
   }
   return n;
-}(), b = Rt;
-Rt.default = Rt;
+}(), b = Ot;
+Ot.default = Ot;
 b.languages.markup = {
   comment: {
     pattern: /<!--(?:(?!<!--)[\s\S])*?-->/,
@@ -5395,7 +5399,7 @@ b.languages.wasm = {
   number: /[+-]?\b(?:\d(?:_?\d)*(?:\.\d(?:_?\d)*)?(?:[eE][+-]?\d(?:_?\d)*)?|0x[\da-fA-F](?:_?[\da-fA-F])*(?:\.[\da-fA-F](?:_?[\da-fA-D])*)?(?:[pP][+-]?\d(?:_?\d)*)?)\b|\binf\b|\bnan(?::0x[\da-fA-F](?:_?[\da-fA-D])*)?\b/,
   punctuation: /[()]/
 };
-var ma = {
+var va = {
   plain: {
     backgroundColor: "#2a2734",
     color: "#9a86fd"
@@ -5462,13 +5466,13 @@ var ma = {
     }
   }]
 };
-const ba = ma;
-var va = {
+const ya = va;
+var Sa = {
   // $FlowFixMe
   Prism: b,
-  theme: ba
+  theme: ya
 };
-function He(e, t, r) {
+function qe(e, t, r) {
   return t in e ? Object.defineProperty(e, t, {
     value: r,
     enumerable: !0,
@@ -5486,7 +5490,7 @@ function Se() {
     return e;
   }, Se.apply(this, arguments);
 }
-var ya = /\r\n|\r|\n/, rr = function(e) {
+var xa = /\r\n|\r|\n/, nr = function(e) {
   e.length === 0 ? e.push({
     types: ["plain"],
     content: `
@@ -5494,32 +5498,32 @@ var ya = /\r\n|\r|\n/, rr = function(e) {
     empty: !0
   }) : e.length === 1 && e[0].content === "" && (e[0].content = `
 `, e[0].empty = !0);
-}, nr = function(e, t) {
+}, ar = function(e, t) {
   var r = e.length;
   return r > 0 && e[r - 1] === t ? e : e.concat(t);
-}, Sa = function(e) {
+}, wa = function(e) {
   for (var t = [[]], r = [e], n = [0], i = [e.length], s = 0, l = 0, d = [], p = [d]; l > -1; ) {
     for (; (s = n[l]++) < i[l]; ) {
       var f = void 0, h = t[l], c = r[l], u = c[s];
-      if (typeof u == "string" ? (h = l > 0 ? h : ["plain"], f = u) : (h = nr(h, u.type), u.alias && (h = nr(h, u.alias)), f = u.content), typeof f != "string") {
+      if (typeof u == "string" ? (h = l > 0 ? h : ["plain"], f = u) : (h = ar(h, u.type), u.alias && (h = ar(h, u.alias)), f = u.content), typeof f != "string") {
         l++, t.push(h), r.push(f), n.push(0), i.push(f.length);
         continue;
       }
-      var g = f.split(ya), v = g.length;
+      var g = f.split(xa), v = g.length;
       d.push({
         types: h,
         content: g[0]
       });
       for (var m = 1; m < v; m++)
-        rr(d), p.push(d = []), d.push({
+        nr(d), p.push(d = []), d.push({
           types: h,
           content: g[m]
         });
     }
     l--, t.pop(), r.pop(), n.pop(), i.pop();
   }
-  return rr(d), p;
-}, xa = function(e, t) {
+  return nr(d), p;
+}, Ea = function(e, t) {
   var r = e.plain, n = /* @__PURE__ */ Object.create(null), i = e.styles.reduce(function(s, l) {
     var d = l.languages, p = l.style;
     return d && !d.includes(t) || l.types.forEach(function(f) {
@@ -5531,30 +5535,30 @@ var ya = /\r\n|\r|\n/, rr = function(e) {
     backgroundColor: null
   }), i;
 };
-function ar(e, t) {
+function ir(e, t) {
   var r = {};
   for (var n in e)
     Object.prototype.hasOwnProperty.call(e, n) && t.indexOf(n) === -1 && (r[n] = e[n]);
   return r;
 }
-var wa = /* @__PURE__ */ function(e) {
+var _a = /* @__PURE__ */ function(e) {
   function t() {
     for (var r = this, n = [], i = arguments.length; i--; )
       n[i] = arguments[i];
-    e.apply(this, n), He(this, "getThemeDict", function(s) {
+    e.apply(this, n), qe(this, "getThemeDict", function(s) {
       if (r.themeDict !== void 0 && s.theme === r.prevTheme && s.language === r.prevLanguage)
         return r.themeDict;
       r.prevTheme = s.theme, r.prevLanguage = s.language;
-      var l = s.theme ? xa(s.theme, s.language) : void 0;
+      var l = s.theme ? Ea(s.theme, s.language) : void 0;
       return r.themeDict = l;
-    }), He(this, "getLineProps", function(s) {
-      var l = s.key, d = s.className, p = s.style, f = ar(s, ["key", "className", "style", "line"]), h = f, c = Se({}, h, {
+    }), qe(this, "getLineProps", function(s) {
+      var l = s.key, d = s.className, p = s.style, f = ir(s, ["key", "className", "style", "line"]), h = f, c = Se({}, h, {
         className: "token-line",
         style: void 0,
         key: void 0
       }), u = r.getThemeDict(r.props);
       return u !== void 0 && (c.style = u.plain), p !== void 0 && (c.style = c.style !== void 0 ? Se({}, c.style, p) : p), l !== void 0 && (c.key = l), d && (c.className += " " + d), c;
-    }), He(this, "getStyleForToken", function(s) {
+    }), qe(this, "getStyleForToken", function(s) {
       var l = s.types, d = s.empty, p = l.length, f = r.getThemeDict(r.props);
       if (f !== void 0) {
         {
@@ -5572,15 +5576,15 @@ var wa = /* @__PURE__ */ function(e) {
         });
         return Object.assign.apply(Object, [h].concat(c));
       }
-    }), He(this, "getTokenProps", function(s) {
-      var l = s.key, d = s.className, p = s.style, f = s.token, h = ar(s, ["key", "className", "style", "token"]), c = h, u = Se({}, c, {
+    }), qe(this, "getTokenProps", function(s) {
+      var l = s.key, d = s.className, p = s.style, f = s.token, h = ir(s, ["key", "className", "style", "token"]), c = h, u = Se({}, c, {
         className: "token " + f.types.join(" "),
         children: f.content,
         style: r.getStyleForToken(f),
         key: void 0
       });
       return p !== void 0 && (u.style = u.style !== void 0 ? Se({}, u.style, p) : p), l !== void 0 && (u.key = l), d && (u.className += " " + d), u;
-    }), He(this, "tokenize", function(s, l, d, p) {
+    }), qe(this, "tokenize", function(s, l, d, p) {
       var f = {
         code: l,
         grammar: d,
@@ -5593,7 +5597,7 @@ var wa = /* @__PURE__ */ function(e) {
     });
   }
   return e && (t.__proto__ = e), t.prototype = Object.create(e && e.prototype), t.prototype.constructor = t, t.prototype.render = function() {
-    var n = this.props, i = n.Prism, s = n.language, l = n.code, d = n.children, p = this.getThemeDict(this.props), f = i.languages[s], h = f !== void 0 ? this.tokenize(i, l, f, s) : [l], c = Sa(h);
+    var n = this.props, i = n.Prism, s = n.language, l = n.code, d = n.children, p = this.getThemeDict(this.props), f = i.languages[s], h = f !== void 0 ? this.tokenize(i, l, f, s) : [l], c = wa(h);
     return d({
       tokens: c,
       className: "prism-code language-" + s,
@@ -5602,9 +5606,9 @@ var wa = /* @__PURE__ */ function(e) {
       getTokenProps: this.getTokenProps
     });
   }, t;
-}(Vr);
-const Ea = wa;
-function vr({ copied: e }) {
+}(Wr);
+const Aa = _a;
+function yr({ copied: e }) {
   return /* @__PURE__ */ F.createElement("svg", {
     viewBox: "0 0 15 15",
     fill: "none",
@@ -5622,8 +5626,8 @@ function vr({ copied: e }) {
     clipRule: "evenodd"
   }));
 }
-vr.displayName = "@mantine/prism/CopyIcon";
-const _a = (e) => ({
+yr.displayName = "@mantine/prism/CopyIcon";
+const ka = (e) => ({
   plain: {
     color: e.colors.gray[4],
     backgroundColor: e.colors.dark[8]
@@ -5708,7 +5712,7 @@ const _a = (e) => ({
       }
     }
   ]
-}), Aa = (e) => ({
+}), Ta = (e) => ({
   plain: {
     color: e.colors.gray[9],
     backgroundColor: e.fn.rgba(e.colors.gray[0], 0.65)
@@ -5799,8 +5803,8 @@ const _a = (e) => ({
       }
     }
   ]
-}), ka = (e, t) => t === "dark" ? _a(e) : Aa(e);
-var Ta = lr((e, { colorScheme: t, native: r, maxLineSize: n, radius: i }) => ({
+}), ja = (e, t) => t === "dark" ? ka(e) : Ta(e);
+var Ca = ur((e, { colorScheme: t, native: r, maxLineSize: n, radius: i }) => ({
   scrollArea: {},
   root: {
     position: "relative"
@@ -5810,7 +5814,7 @@ var Ta = lr((e, { colorScheme: t, native: r, maxLineSize: n, radius: i }) => ({
     position: "relative",
     fontFamily: e.fontFamilyMonospace,
     lineHeight: 1.7,
-    fontSize: Ve(13),
+    fontSize: We(13),
     overflowX: r ? "auto" : void 0,
     borderRadius: e.fn.radius(i),
     padding: `${e.spacing.sm} 0`,
@@ -5837,7 +5841,7 @@ var Ta = lr((e, { colorScheme: t, native: r, maxLineSize: n, radius: i }) => ({
   lineNumber: {
     color: t === "dark" ? e.colors.dark[4] : e.colors.gray[4],
     textAlign: "right",
-    width: `calc(8 * ${Ve(n)})`,
+    width: `calc(8 * ${We(n)})`,
     marginRight: e.dir === "ltr" ? e.spacing.xs : void 0,
     marginLeft: e.dir === "rtl" ? e.spacing.xs : void 0,
     userSelect: "none"
@@ -5846,34 +5850,34 @@ var Ta = lr((e, { colorScheme: t, native: r, maxLineSize: n, radius: i }) => ({
     width: "100%"
   }
 }));
-const ja = Ta;
-var Ca = Object.defineProperty, Ra = Object.defineProperties, Oa = Object.getOwnPropertyDescriptors, ot = Object.getOwnPropertySymbols, yr = Object.prototype.hasOwnProperty, Sr = Object.prototype.propertyIsEnumerable, ir = (e, t, r) => t in e ? Ca(e, t, { enumerable: !0, configurable: !0, writable: !0, value: r }) : e[t] = r, Ie = (e, t) => {
+const Ra = Ca;
+var Oa = Object.defineProperty, Ia = Object.defineProperties, Da = Object.getOwnPropertyDescriptors, lt = Object.getOwnPropertySymbols, Sr = Object.prototype.hasOwnProperty, xr = Object.prototype.propertyIsEnumerable, sr = (e, t, r) => t in e ? Oa(e, t, { enumerable: !0, configurable: !0, writable: !0, value: r }) : e[t] = r, De = (e, t) => {
   for (var r in t || (t = {}))
-    yr.call(t, r) && ir(e, r, t[r]);
-  if (ot)
-    for (var r of ot(t))
-      Sr.call(t, r) && ir(e, r, t[r]);
+    Sr.call(t, r) && sr(e, r, t[r]);
+  if (lt)
+    for (var r of lt(t))
+      xr.call(t, r) && sr(e, r, t[r]);
   return e;
-}, qe = (e, t) => Ra(e, Oa(t)), Da = (e, t) => {
+}, Ye = (e, t) => Ia(e, Da(t)), La = (e, t) => {
   var r = {};
   for (var n in e)
-    yr.call(e, n) && t.indexOf(n) < 0 && (r[n] = e[n]);
-  if (e != null && ot)
-    for (var n of ot(e))
-      t.indexOf(n) < 0 && Sr.call(e, n) && (r[n] = e[n]);
+    Sr.call(e, n) && t.indexOf(n) < 0 && (r[n] = e[n]);
+  if (e != null && lt)
+    for (var n of lt(e))
+      t.indexOf(n) < 0 && xr.call(e, n) && (r[n] = e[n]);
   return r;
 };
-const Ia = {
+const Fa = {
   noCopy: !1,
   copyLabel: "Copy code",
   copiedLabel: "Copied",
   withLineNumbers: !1,
   trim: !0,
   highlightLines: {},
-  scrollAreaComponent: ur,
-  getPrismTheme: ka
-}, Nt = ut((e, t) => {
-  const r = Jr("Prism", Ia, e), {
+  scrollAreaComponent: cr,
+  getPrismTheme: ja
+}, $t = ct((e, t) => {
+  const r = en("Prism", Fa, e), {
     className: n,
     children: i,
     language: s,
@@ -5891,7 +5895,7 @@ const Ia = {
     radius: w,
     getPrismTheme: S,
     variant: _
-  } = r, k = Da(r, [
+  } = r, k = La(r, [
     "className",
     "children",
     "language",
@@ -5910,18 +5914,18 @@ const Ia = {
     "getPrismTheme",
     "variant"
   ]), H = m && typeof i == "string" ? i.trim() : i, J = H.split(`
-`).length.toString().length, N = en(), q = fn(), $ = v || N.colorScheme, { classes: te, cx: L } = ja({
+`).length.toString().length, N = tn(), q = hn(), $ = v || N.colorScheme, { classes: te, cx: L } = Ra({
     colorScheme: $,
-    native: g !== ur,
+    native: g !== cr,
     maxLineSize: J,
     radius: w
   }, { name: "Prism", classNames: d, styles: p, unstyled: x, variant: _ });
-  return /* @__PURE__ */ F.createElement(X, qe(Ie({
+  return /* @__PURE__ */ F.createElement(X, Ye(De({
     className: L(te.root, n),
     ref: t
   }, k), {
     translate: "no"
-  }), !l && /* @__PURE__ */ F.createElement(at, {
+  }), !l && /* @__PURE__ */ F.createElement(it, {
     label: q.copied ? h : f,
     position: "left",
     withArrow: !0,
@@ -5934,9 +5938,9 @@ const Ia = {
     "aria-label": q.copied ? h : f,
     onClick: () => q.copy(H),
     unstyled: x
-  }, /* @__PURE__ */ F.createElement(vr, {
+  }, /* @__PURE__ */ F.createElement(yr, {
     copied: q.copied
-  }))), /* @__PURE__ */ F.createElement(Ea, qe(Ie({}, va), {
+  }))), /* @__PURE__ */ F.createElement(Aa, Ye(De({}, Sa), {
     theme: S(N, $),
     code: H,
     language: s
@@ -5959,9 +5963,9 @@ const Ia = {
 `)
       return null;
     const ie = re + 1, fe = M({ line: W, key: re }), Ee = ie in u, ge = $ === "dark" ? N.fn.rgba(N.fn.themeColor((ue = u[ie]) == null ? void 0 : ue.color, 9), 0.25) : N.fn.themeColor((ce = u[ie]) == null ? void 0 : ce.color, 0);
-    return /* @__PURE__ */ F.createElement("div", qe(Ie({}, fe), {
+    return /* @__PURE__ */ F.createElement("div", Ye(De({}, fe), {
       className: L(te.line, fe.className),
-      style: Ie({}, Ee ? { backgroundColor: ge } : null)
+      style: De({}, Ee ? { backgroundColor: ge } : null)
     }), c && /* @__PURE__ */ F.createElement("div", {
       className: te.lineNumber,
       style: {
@@ -5969,24 +5973,24 @@ const Ia = {
       }
     }, ((be = u[ie]) == null ? void 0 : be.label) || ie), /* @__PURE__ */ F.createElement("div", {
       className: te.lineContent
-    }, W.map((Me, je) => {
+    }, W.map((Be, je) => {
       var Ce, _e;
-      const Re = ae({ token: Me, key: je });
-      return /* @__PURE__ */ F.createElement("span", qe(Ie({}, Re), {
-        style: qe(Ie({}, Re.style), {
+      const Re = ae({ token: Be, key: je });
+      return /* @__PURE__ */ F.createElement("span", Ye(De({}, Re), {
+        style: Ye(De({}, Re.style), {
           color: Ee ? N.fn.themeColor((Ce = u[ie]) == null ? void 0 : Ce.color, $ === "dark" ? 5 : 8) : (_e = Re == null ? void 0 : Re.style) == null ? void 0 : _e.color
         })
       }));
     })));
   }).filter(Boolean)))));
 });
-Nt.displayName = "@mantine/prism/Prism";
-var La = lr((e, { radius: t }) => ({
+$t.displayName = "@mantine/prism/Prism";
+var Na = ur((e, { radius: t }) => ({
   tab: {
     paddingLeft: e.spacing.sm,
     paddingRight: e.spacing.sm,
-    height: Ve(34),
-    border: `${Ve(1)} solid ${e.colorScheme === "dark" ? e.colors.dark[5] : e.colors.gray[3]}`,
+    height: We(34),
+    border: `${We(1)} solid ${e.colorScheme === "dark" ? e.colors.dark[5] : e.colors.gray[3]}`,
     borderBottom: 0,
     fontSize: e.fontSizes.sm,
     color: e.colorScheme === "dark" ? e.colors.dark[1] : e.colors.gray[7],
@@ -6016,7 +6020,7 @@ var La = lr((e, { radius: t }) => ({
     borderRadius: e.fn.radius(t),
     borderTopRightRadius: 0,
     borderTopLeftRadius: 0,
-    border: `${Ve(1)} solid ${e.colorScheme === "dark" ? e.colors.dark[4] : e.colors.gray[3]}`,
+    border: `${We(1)} solid ${e.colorScheme === "dark" ? e.colors.dark[4] : e.colors.gray[3]}`,
     borderTop: 0,
     overflow: "hidden"
   },
@@ -6026,32 +6030,32 @@ var La = lr((e, { radius: t }) => ({
     border: 0
   }
 }));
-const xr = La;
-var Fa = Object.defineProperty, Na = Object.defineProperties, $a = Object.getOwnPropertyDescriptors, lt = Object.getOwnPropertySymbols, wr = Object.prototype.hasOwnProperty, Er = Object.prototype.propertyIsEnumerable, sr = (e, t, r) => t in e ? Fa(e, t, { enumerable: !0, configurable: !0, writable: !0, value: r }) : e[t] = r, _r = (e, t) => {
+const wr = Na;
+var $a = Object.defineProperty, za = Object.defineProperties, Pa = Object.getOwnPropertyDescriptors, ut = Object.getOwnPropertySymbols, Er = Object.prototype.hasOwnProperty, _r = Object.prototype.propertyIsEnumerable, or = (e, t, r) => t in e ? $a(e, t, { enumerable: !0, configurable: !0, writable: !0, value: r }) : e[t] = r, Ar = (e, t) => {
   for (var r in t || (t = {}))
-    wr.call(t, r) && sr(e, r, t[r]);
-  if (lt)
-    for (var r of lt(t))
-      Er.call(t, r) && sr(e, r, t[r]);
+    Er.call(t, r) && or(e, r, t[r]);
+  if (ut)
+    for (var r of ut(t))
+      _r.call(t, r) && or(e, r, t[r]);
   return e;
-}, za = (e, t) => Na(e, $a(t)), Pa = (e, t) => {
+}, Ma = (e, t) => za(e, Pa(t)), Ba = (e, t) => {
   var r = {};
   for (var n in e)
-    wr.call(e, n) && t.indexOf(n) < 0 && (r[n] = e[n]);
-  if (e != null && lt)
-    for (var n of lt(e))
-      t.indexOf(n) < 0 && Er.call(e, n) && (r[n] = e[n]);
+    Er.call(e, n) && t.indexOf(n) < 0 && (r[n] = e[n]);
+  if (e != null && ut)
+    for (var n of ut(e))
+      t.indexOf(n) < 0 && _r.call(e, n) && (r[n] = e[n]);
   return r;
 };
-function Ma(e) {
-  const { classes: t } = xr({ radius: e.radius });
-  return /* @__PURE__ */ F.createElement(gt, za(_r({}, e), {
+function Ua(e) {
+  const { classes: t } = wr({ radius: e.radius });
+  return /* @__PURE__ */ F.createElement(ht, Ma(Ar({}, e), {
     variant: "outline",
     classNames: { tab: t.tab },
     translate: "no"
   }));
 }
-function Ba(e) {
+function Ga(e) {
   var t = e, {
     language: r,
     children: n,
@@ -6066,7 +6070,7 @@ function Ba(e) {
     getPrismTheme: u,
     colorScheme: g,
     variant: v
-  } = t, m = Pa(t, [
+  } = t, m = Ba(t, [
     "language",
     "children",
     "radius",
@@ -6081,8 +6085,8 @@ function Ba(e) {
     "colorScheme",
     "variant"
   ]);
-  const { classes: x } = xr({ radius: i });
-  return /* @__PURE__ */ F.createElement(gt.Panel, _r({}, m), /* @__PURE__ */ F.createElement(Nt, {
+  const { classes: x } = wr({ radius: i });
+  return /* @__PURE__ */ F.createElement(ht.Panel, Ar({}, m), /* @__PURE__ */ F.createElement($t, {
     language: r,
     classNames: { root: x.prism, code: x.code },
     radius: i,
@@ -6098,17 +6102,17 @@ function Ba(e) {
     variant: v
   }, n));
 }
-const Qe = Nt;
-Qe.Tabs = Ma;
-Qe.Tab = gt.Tab;
-Qe.TabsList = gt.List;
-Qe.Panel = Ba;
-function Ua({
+const Je = $t;
+Je.Tabs = Ua;
+Je.Tab = ht.Tab;
+Je.TabsList = ht.List;
+Je.Panel = Ga;
+function Ha({
   id: e,
   onSuccess: t,
-  styles: r = Pe
+  styles: r = Me
 }) {
-  const n = Ze(), i = async () => {
+  const n = Xe(), i = async () => {
     if (e) {
       oe({
         id: "for-deleting",
@@ -6147,21 +6151,21 @@ function Ua({
       color: "red"
     }
   });
-  return /* @__PURE__ */ a.jsx(D, { size: r.button.size, color: "red", onClick: s, leftIcon: /* @__PURE__ */ a.jsx(mt, { size: 20 }), children: "Delete" });
+  return /* @__PURE__ */ a.jsx(I, { size: r.button.size, color: "red", onClick: s, leftIcon: /* @__PURE__ */ a.jsx(bt, { size: 20 }), children: "Delete" });
 }
-function Ga({
+function qa({
   content: e
 }) {
-  return /* @__PURE__ */ a.jsxs(_t, { width: "60vw", shadow: "md", children: [
-    /* @__PURE__ */ a.jsx(_t.Target, { children: /* @__PURE__ */ a.jsx(Dt, { size: 16, children: /* @__PURE__ */ a.jsx(pn, {}) }) }),
-    /* @__PURE__ */ a.jsx(_t.Dropdown, { children: /* @__PURE__ */ a.jsx(Qe, { language: "sql", noCopy: !0, withLineNumbers: !0, children: e }) })
+  return /* @__PURE__ */ a.jsxs(At, { width: "60vw", shadow: "md", children: [
+    /* @__PURE__ */ a.jsx(At.Target, { children: /* @__PURE__ */ a.jsx(Dt, { size: 16, children: /* @__PURE__ */ a.jsx(pn, {}) }) }),
+    /* @__PURE__ */ a.jsx(At.Dropdown, { children: /* @__PURE__ */ a.jsx(Je, { language: "sql", noCopy: !0, withLineNumbers: !0, children: e }) })
   ] });
 }
-function ii({
-  styles: e = Pe,
+function li({
+  styles: e = Me,
   config: t
 }) {
-  Xe(t);
+  Qe(t);
   const {
     data: r = [],
     loading: n,
@@ -6180,12 +6184,12 @@ function ii({
     refreshDeps: []
   });
   return /* @__PURE__ */ a.jsxs(a.Fragment, { children: [
-    /* @__PURE__ */ a.jsx(z, { pt: e.spacing, position: "right", children: /* @__PURE__ */ a.jsx(fa, { onSuccess: i }) }),
+    /* @__PURE__ */ a.jsx(z, { pt: e.spacing, position: "right", children: /* @__PURE__ */ a.jsx(ha, { onSuccess: i }) }),
     /* @__PURE__ */ a.jsxs(X, { mt: e.spacing, sx: {
       position: "relative"
     }, children: [
-      /* @__PURE__ */ a.jsx(pt, { visible: n }),
-      /* @__PURE__ */ a.jsxs(ft, { horizontalSpacing: e.spacing, verticalSpacing: e.spacing, fontSize: e.size, highlightOnHover: !0, children: [
+      /* @__PURE__ */ a.jsx(ft, { visible: n }),
+      /* @__PURE__ */ a.jsxs(gt, { horizontalSpacing: e.spacing, verticalSpacing: e.spacing, fontSize: e.size, highlightOnHover: !0, children: [
         /* @__PURE__ */ a.jsx("thead", { children: /* @__PURE__ */ a.jsxs("tr", { children: [
           /* @__PURE__ */ a.jsx("th", { children: "Name" }),
           /* @__PURE__ */ a.jsx("th", {}),
@@ -6202,12 +6206,12 @@ function ii({
           } = s;
           return /* @__PURE__ */ a.jsxs("tr", { children: [
             /* @__PURE__ */ a.jsx("td", { children: l }),
-            /* @__PURE__ */ a.jsx("td", { width: 50, children: /* @__PURE__ */ a.jsx(Ga, { content: d }) }),
+            /* @__PURE__ */ a.jsx("td", { width: 50, children: /* @__PURE__ */ a.jsx(qa, { content: d }) }),
             /* @__PURE__ */ a.jsx("td", { width: 200, children: p }),
             /* @__PURE__ */ a.jsx("td", { width: 200, children: f }),
             /* @__PURE__ */ a.jsx("td", { width: 400, children: /* @__PURE__ */ a.jsxs(z, { position: "left", children: [
-              /* @__PURE__ */ a.jsx(ha, { ...s, onSuccess: i }),
-              /* @__PURE__ */ a.jsx(Ua, { id: l, onSuccess: i })
+              /* @__PURE__ */ a.jsx(ba, { ...s, onSuccess: i }),
+              /* @__PURE__ */ a.jsx(Ha, { id: l, onSuccess: i })
             ] }) })
           ] }, l);
         }) })
@@ -6215,28 +6219,28 @@ function ii({
     ] })
   ] });
 }
-const si = () => import("./package-10cf4bd1.mjs").then(({
+const ui = () => import("./package-e95cf677.mjs").then(({
   version: e
 }) => (console.log(`[@devtable/dashboard] version: ${e}`), e));
 export {
   G as APIClient,
-  ai as APIKeyList,
-  ri as AccountList,
-  ca as AddAPIKey,
-  aa as AddAccount,
-  Yn as AddDataSource,
-  fa as AddSQLSnippet,
-  ti as DataSourceList,
-  vn as DefaultApiClient,
-  da as DeleteAPIKey,
-  ia as DeleteAccount,
-  Kn as DeleteDataSource,
-  Ua as DeleteSQLSnippet,
-  yn as FacadeApiClient,
-  ni as Login,
-  ii as SQLSnippetList,
-  ha as UpdateSQLSnippet,
-  Xe as configureAPIClient,
-  Sn as facadeApiClient,
-  si as getVersion
+  oi as APIKeyList,
+  ii as AccountList,
+  pa as AddAPIKey,
+  sa as AddAccount,
+  Wn as AddDataSource,
+  ha as AddSQLSnippet,
+  ai as DataSourceList,
+  Sn as DefaultApiClient,
+  fa as DeleteAPIKey,
+  oa as DeleteAccount,
+  Xn as DeleteDataSource,
+  Ha as DeleteSQLSnippet,
+  xn as FacadeApiClient,
+  si as Login,
+  li as SQLSnippetList,
+  ba as UpdateSQLSnippet,
+  Qe as configureAPIClient,
+  wn as facadeApiClient,
+  ui as getVersion
 };