@quillsql/admin 1.6.1 → 1.6.2

package/dist/cjs/components/QuillTab.d.ts

@@ -0,0 +1,12 @@
+export default function QuillTab({ modeToggleOptions, toggleMode, setToggleMode, disabledTooltip, width, disabled, }: {
+    modeToggleOptions: {
+        label: string;
+        value: string;
+    }[];
+    toggleMode: string;
+    setToggleMode: (mode: string) => void;
+    disabledTooltip?: string;
+    width?: string;
+    disabled?: boolean;
+}): import("react/jsx-runtime").JSX.Element;
+//# sourceMappingURL=QuillTab.d.ts.map

package/dist/cjs/components/QuillTab.d.ts.map

@@ -0,0 +1 @@
+{"version":3,"file":"QuillTab.d.ts","sourceRoot":"","sources":["../../../src/components/QuillTab.tsx"],"names":[],"mappings":"AAAA,MAAM,CAAC,OAAO,UAAU,QAAQ,CAAC,EAC/B,iBAAiB,EACjB,UAAU,EACV,aAAa,EACb,eAAe,EACf,KAAK,EACL,QAAQ,GACT,EAAE;IACD,iBAAiB,EAAE;QAAE,KAAK,EAAE,MAAM,CAAC;QAAC,KAAK,EAAE,MAAM,CAAA;KAAE,EAAE,CAAC;IACtD,UAAU,EAAE,MAAM,CAAC;IACnB,aAAa,EAAE,CAAC,IAAI,EAAE,MAAM,KAAK,IAAI,CAAC;IACtC,eAAe,CAAC,EAAE,MAAM,CAAC;IACzB,KAAK,CAAC,EAAE,MAAM,CAAC;IACf,QAAQ,CAAC,EAAE,OAAO,CAAC;CACpB,2CA2GA"}

package/dist/cjs/components/QuillTab.js

@@ -0,0 +1,84 @@
+"use strict";
+Object.defineProperty(exports, "__esModule", { value: true });
+exports.default = QuillTab;
+const jsx_runtime_1 = require("react/jsx-runtime");
+function QuillTab({ modeToggleOptions, toggleMode, setToggleMode, disabledTooltip, width, disabled, }) {
+    return ((0, jsx_runtime_1.jsxs)("div", { className: "quill-tab", style: {
+            width: width || 'fit-content',
+            borderRadius: '0.25rem',
+            borderStyle: 'none',
+            outlineStyle: 'none',
+            background: '#F9FAFB',
+            padding: 3.5,
+            display: 'flex',
+            flexDirection: 'row',
+            position: 'relative',
+        }, children: [modeToggleOptions.map((option) => ((0, jsx_runtime_1.jsx)("button", { "data-testid": `quill-tab-${option.value}`, onClick: disabledTooltip || disabled
+                    ? undefined
+                    : () => {
+                        setToggleMode(option.value);
+                    }, style: {
+                    cursor: disabledTooltip || disabled ? 'not-allowed' : 'pointer',
+                    borderRadius: '0.25rem',
+                    borderWidth: '1px',
+                    fontSize: '13px',
+                    outlineStyle: 'none',
+                    width: `${100 / modeToggleOptions.length}%`,
+                    transitionProperty: 'background-color, border-color, color, fill, stroke, opacity, box-shadow, transform',
+                    transitionTimingFunction: 'cubic-bezier(0.4, 0, 0.2, 1)',
+                    transitionDuration: '300ms',
+                    margin: '0px',
+                    paddingTop: '0.375rem',
+                    paddingBottom: '0.375rem',
+                    paddingLeft: '0.75rem',
+                    paddingRight: '0.75rem',
+                    ...(option.value === toggleMode
+                        ? {
+                            fontWeight: 500,
+                            backgroundColor: '#ffffff',
+                            boxShadow: '0 1px 2px 0 rgba(0, 0, 0, 0.05)',
+                            color: '#212121',
+                            borderColor: 'transparent',
+                        }
+                        : disabledTooltip || disabled
+                            ? {
+                                fontWeight: 400,
+                                color: '#adb1b9',
+                                borderColor: 'transparent',
+                            }
+                            : {
+                                borderColor: 'transparent',
+                                fontWeight: 400,
+                                backgroundColor: 'transparent',
+                                color: '#606572',
+                            }),
+                }, children: option.label }, option.value))), disabledTooltip && ((0, jsx_runtime_1.jsxs)("div", { className: "quill-tab-tooltip", style: {
+                    position: 'absolute',
+                    top: '100%',
+                    left: '0',
+                    backgroundColor: '#ffffff',
+                    padding: 8,
+                    borderRadius: 6,
+                    fontSize: 13,
+                    zIndex: 1,
+                    fontWeight: 600,
+                    boxShadow: '0px 1px 12px rgba(0, 0, 0, 0.09)',
+                    borderWidth: 1,
+                    width: 'fit-content',
+                    whiteSpace: 'nowrap',
+                    paddingLeft: 12,
+                    paddingRight: 12,
+                    marginTop: 10,
+                    borderStyle: 'solid',
+                    borderColor: '#e7e7e7',
+                    color: '#212121',
+                }, children: [disabledTooltip, (0, jsx_runtime_1.jsx)("style", { children: `
+          .quill-tab-tooltip {
+            opacity: 0;
+            pointer-events: none;
+          }
+          .quill-tab:hover .quill-tab-tooltip {
+            opacity: 1;
+          }
+        ` })] }))] }));
+}

package/dist/cjs/components/QuillToolTipPortal.d.ts

@@ -0,0 +1,11 @@
+import React from 'react';
+export interface QuillToolTipPortalProps {
+    children: React.ReactNode;
+    text: React.ReactNode;
+    enabled?: boolean;
+    containerStyle?: React.CSSProperties;
+    textStyle?: React.CSSProperties;
+    mirror?: boolean;
+}
+export declare const QuillToolTipPortal: ({ children, text, enabled, containerStyle, textStyle, mirror, }: QuillToolTipPortalProps) => import("react/jsx-runtime").JSX.Element;
+//# sourceMappingURL=QuillToolTipPortal.d.ts.map

package/dist/cjs/components/QuillToolTipPortal.d.ts.map

@@ -0,0 +1 @@
+{"version":3,"file":"QuillToolTipPortal.d.ts","sourceRoot":"","sources":["../../../src/components/QuillToolTipPortal.tsx"],"names":[],"mappings":"AAAA,OAAO,KAAsC,MAAM,OAAO,CAAC;AAK3D,MAAM,WAAW,uBAAuB;IACtC,QAAQ,EAAE,KAAK,CAAC,SAAS,CAAC;IAC1B,IAAI,EAAE,KAAK,CAAC,SAAS,CAAC;IACtB,OAAO,CAAC,EAAE,OAAO,CAAC;IAClB,cAAc,CAAC,EAAE,KAAK,CAAC,aAAa,CAAC;IACrC,SAAS,CAAC,EAAE,KAAK,CAAC,aAAa,CAAC;IAChC,MAAM,CAAC,EAAE,OAAO,CAAC;CAClB;AAED,eAAO,MAAM,kBAAkB,oEAO5B,uBAAuB,4CA2IzB,CAAC"}

package/dist/cjs/components/QuillToolTipPortal.js

@@ -0,0 +1,108 @@
+"use strict";
+Object.defineProperty(exports, "__esModule", { value: true });
+exports.QuillToolTipPortal = void 0;
+const jsx_runtime_1 = require("react/jsx-runtime");
+const react_1 = require("react");
+const react_dom_1 = require("react-dom");
+const AdminProvider_1 = require("../AdminProvider");
+const QuillToolTipPortal = ({ children, text, enabled = true, containerStyle = {}, textStyle = {}, mirror = false, }) => {
+    const { state: { theme }, } = (0, AdminProvider_1.useAdmin)();
+    const [isOpen, setIsOpen] = (0, react_1.useState)(false);
+    const tooltipRef = (0, react_1.useRef)(null);
+    const triggerRef = (0, react_1.useRef)(null);
+    const [tooltipPosition, setTooltipPosition] = (0, react_1.useState)(undefined);
+    const updatePosition = () => {
+        if (triggerRef.current && tooltipRef.current) {
+            const rect = triggerRef.current.getBoundingClientRect();
+            const tooltipRect = tooltipRef.current.getBoundingClientRect();
+            const viewportWidth = window.innerWidth;
+            // Position above the trigger by default
+            let top = rect.top + window.scrollY - tooltipRect.height - 8; // 8px margin above
+            let left = rect.left + window.scrollX;
+            // Center the tooltip horizontally on the trigger
+            if (!mirror) {
+                left =
+                    rect.left + rect.width / 2 - tooltipRect.width / 2 + window.scrollX;
+            }
+            else {
+                left = rect.right - tooltipRect.width + window.scrollX;
+            }
+            // Ensure tooltip doesn't go beyond the right edge
+            if (left + tooltipRect.width > viewportWidth) {
+                left = viewportWidth - tooltipRect.width - 16; // Keep 16px margin
+            }
+            // Ensure tooltip doesn't go beyond the left edge
+            if (left < 16) {
+                left = 16;
+            }
+            // If there's not enough space above, show below
+            if (top < window.scrollY + 16) {
+                top = rect.bottom + window.scrollY + 8; // 8px margin below
+            }
+            setTooltipPosition({ top, left });
+        }
+    };
+    (0, react_1.useEffect)(() => {
+        if (isOpen) {
+            // Update position after a small delay to ensure the tooltip has rendered
+            const timer = setTimeout(() => {
+                updatePosition();
+            }, 0);
+            window.addEventListener('resize', updatePosition, { passive: true });
+            window.addEventListener('scroll', updatePosition, { passive: true });
+            return () => {
+                clearTimeout(timer);
+                window.removeEventListener('resize', updatePosition);
+                window.removeEventListener('scroll', updatePosition);
+            };
+        }
+    }, [isOpen]);
+    if (!enabled) {
+        return (0, jsx_runtime_1.jsx)(jsx_runtime_1.Fragment, { children: children });
+    }
+    return ((0, jsx_runtime_1.jsxs)("div", { ref: triggerRef, style: {
+            display: 'inline-block',
+            position: 'relative',
+            ...containerStyle,
+        }, onMouseEnter: () => setIsOpen(true), onMouseLeave: () => setIsOpen(false), children: [children, isOpen &&
+                (0, react_dom_1.createPortal)((0, jsx_runtime_1.jsxs)("div", { ref: tooltipRef, style: {
+                        visibility: tooltipPosition ? 'visible' : 'hidden',
+                        position: 'absolute',
+                        top: `${tooltipPosition?.top ?? 0}px`,
+                        left: `${tooltipPosition?.left ?? 0}px`,
+                        backgroundColor: '#ffffff',
+                        color: '#212121',
+                        textAlign: 'center',
+                        borderRadius: 5,
+                        zIndex: 100,
+                        padding: 10,
+                        fontFamily: theme?.fontFamily,
+                        fontWeight: 600,
+                        fontSize: 'small',
+                        whiteSpace: 'nowrap',
+                        borderWidth: 1,
+                        borderStyle: 'solid',
+                        borderColor: '#e7e7e7',
+                        boxShadow: '0px 1px 8px rgba(0, 0, 0, 0.07)',
+                        ...textStyle,
+                    }, children: [text, (0, jsx_runtime_1.jsx)("div", { style: {
+                                position: 'absolute',
+                                top: '100%',
+                                left: '50%',
+                                marginLeft: -6,
+                                borderWidth: 6,
+                                borderStyle: 'solid',
+                                borderColor: 'transparent',
+                                borderTopColor: '#e7e7e7',
+                            } }), (0, jsx_runtime_1.jsx)("div", { style: {
+                                position: 'absolute',
+                                top: '100%',
+                                left: '50%',
+                                marginLeft: -5,
+                                borderWidth: 5,
+                                borderStyle: 'solid',
+                                borderColor: 'transparent',
+                                borderTopColor: '#ffffff',
+                            } })] }), document.body)] }));
+};
+exports.QuillToolTipPortal = QuillToolTipPortal;

package/dist/cjs/components/SegmentedControl.d.ts

@@ -3,7 +3,13 @@ export declare function SegmentedControl({ onChange, value, theme, left, right,
     onChange: (e: any) => void;
     value: string;
     theme?: QuillTheme;
-    left?: string;
-    right?: string;
+    left?: {
+        label: string;
+        value: string;
+    };
+    right?: {
+        label: string;
+        value: string;
+    };
 }): import("react/jsx-runtime").JSX.Element;
 //# sourceMappingURL=SegmentedControl.d.ts.map

package/dist/cjs/components/SegmentedControl.d.ts.map

@@ -1 +1 @@
-{"version":3,"file":"SegmentedControl.d.ts","sourceRoot":"","sources":["../../../src/components/SegmentedControl.tsx"],"names":[],"mappings":"AACA,OAAO,EAAE,UAAU,EAAE,MAAM,iBAAiB,CAAC;AAE7C,wBAAgB,gBAAgB,CAAC,EAC/B,QAAQ,EACR,KAAK,EACL,KAAK,EACL,IAAgB,EAChB,KAAqB,GACtB,EAAE;IACD,QAAQ,EAAE,CAAC,CAAC,EAAE,GAAG,KAAK,IAAI,CAAC;IAC3B,KAAK,EAAE,MAAM,CAAC;IACd,KAAK,CAAC,EAAE,UAAU,CAAC;IACnB,IAAI,CAAC,EAAE,MAAM,CAAC;IACd,KAAK,CAAC,EAAE,MAAM,CAAC;CAChB,2CA2EA"}
+{"version":3,"file":"SegmentedControl.d.ts","sourceRoot":"","sources":["../../../src/components/SegmentedControl.tsx"],"names":[],"mappings":"AACA,OAAO,EAAE,UAAU,EAAE,MAAM,iBAAiB,CAAC;AAE7C,wBAAgB,gBAAgB,CAAC,EAC/B,QAAQ,EACR,KAAK,EACL,KAAK,EACL,IAA4C,EAC5C,KAAgD,GACjD,EAAE;IACD,QAAQ,EAAE,CAAC,CAAC,EAAE,GAAG,KAAK,IAAI,CAAC;IAC3B,KAAK,EAAE,MAAM,CAAC;IACd,KAAK,CAAC,EAAE,UAAU,CAAC;IACnB,IAAI,CAAC,EAAE;QAAE,KAAK,EAAE,MAAM,CAAC;QAAC,KAAK,EAAE,MAAM,CAAA;KAAE,CAAC;IACxC,KAAK,CAAC,EAAE;QAAE,KAAK,EAAE,MAAM,CAAC;QAAC,KAAK,EAAE,MAAM,CAAA;KAAE,CAAC;CAC1C,2CA2EA"}

package/dist/cjs/components/SegmentedControl.js

@@ -1,10 +1,10 @@
 "use strict";
 Object.defineProperty(exports, "__esModule", { value: true });
-exports.SegmentedControl = void 0;
+exports.SegmentedControl = SegmentedControl;
 const jsx_runtime_1 = require("react/jsx-runtime");
 const react_1 = require("react");
-function SegmentedControl({ onChange, value, theme, left = 'Default', right = 'Multiselect', }) {
-    const [leftSelected, setLeftSelected] = (0, react_1.useState)(value === 'default' ? true : false);
+function SegmentedControl({ onChange, value, theme, left = { label: 'Single', value: 'default' }, right = { label: 'Multi', value: 'multiselect' }, }) {
+    const [leftSelected, setLeftSelected] = (0, react_1.useState)(value === left?.value ? true : false);
     return ((0, jsx_runtime_1.jsxs)("div", { style: {
             display: 'flex',
             flexDirection: 'row',
@@ -16,13 +16,14 @@ function SegmentedControl({ onChange, value, theme, left = 'Default', right = 'M
             height: 40,
         }, children: [(0, jsx_runtime_1.jsx)("button", { className: "quill-tab", onClick: () => {
                     setLeftSelected(true);
-                    onChange(left.toLowerCase());
+                    onChange(left.value.toLowerCase());
                 }, style: {
                     border: leftSelected ? '1px solid #E7E7E7' : '1px solid transparent',
                     outline: 'none',
                     width: '100%',
                     borderRadius: 4,
-                    padding: 10,
+                    height: 32,
+                    padding: 8,
                     boxShadow: leftSelected
                         ? '0px 1px 4px 0px rgba(56, 65, 81, 0.08)'
                         : undefined,
@@ -32,12 +33,11 @@ function SegmentedControl({ onChange, value, theme, left = 'Default', right = 'M
                     fontWeight: leftSelected ? 600 : 500,
                     fontSize: 14,
                     fontFamily: theme?.fontFamily,
-                    height: '40px',
                     boxSizing: 'border-box',
                     backgroundColor: leftSelected ? 'white' : 'transparent',
-                }, children: left }), (0, jsx_runtime_1.jsx)("button", { className: "quill-tab2", onClick: () => {
+                }, children: (0, jsx_runtime_1.jsx)("div", { style: { marginTop: -3 }, children: left.label }) }), (0, jsx_runtime_1.jsx)("button", { className: "quill-tab2", onClick: () => {
                     setLeftSelected(false);
-                    onChange(right.toLowerCase());
+                    onChange(right.value.toLowerCase());
                 }, style: {
                     border: !leftSelected ? '1px solid #E7E7E7' : '1px solid transparent',
                     boxShadow: !leftSelected
@@ -46,15 +46,14 @@ function SegmentedControl({ onChange, value, theme, left = 'Default', right = 'M
                     outline: 'none',
                     width: '100%',
                     borderRadius: 4,
+                    height: 32,
                     color: !leftSelected
                         ? 'rgba(56, 65, 81, 1)'
                         : 'rgba(56, 65, 81, 0.85)',
-                    padding: 10,
+                    padding: 8,
                     fontWeight: !leftSelected ? 600 : 500,
                     fontSize: 14,
                     fontFamily: theme?.fontFamily,
-                    height: '40px',
                     backgroundColor: !leftSelected ? 'white' : 'transparent',
-                }, children: right })] }));
+                }, children: (0, jsx_runtime_1.jsx)("div", { style: { marginTop: -3 }, children: right.label }) })] }));
 }
-exports.SegmentedControl = SegmentedControl;

package/dist/cjs/components/SqlTextEditor.d.ts

@@ -1,15 +1,12 @@
 import { CSSProperties } from 'react';
-import { IDisposable } from 'monaco-editor';
 import { ColumnsByTable } from '../utils/table';
-export default function SqlTextEditor({ containerStyle, value, setValue, setEditorMounted, setPreviousProvier, previousProvider, schema, height, databaseType, }: {
+export default function SqlTextEditor({ containerStyle, value, setValue, setEditorMounted, schema, databaseType, resizable, }: {
     containerStyle?: CSSProperties;
     value: string;
     setValue: (e: string) => void;
     setEditorMounted: (e: boolean) => void;
-    setPreviousProvier?: (e: IDisposable | null) => void;
-    height?: string | number;
     schema: ColumnsByTable[];
     databaseType?: string;
-    previousProvider: IDisposable | null;
+    resizable?: boolean;
 }): import("react/jsx-runtime").JSX.Element;
 //# sourceMappingURL=SqlTextEditor.d.ts.map

package/dist/cjs/components/SqlTextEditor.d.ts.map

@@ -1 +1 @@
-{"version":3,"file":"SqlTextEditor.d.ts","sourceRoot":"","sources":["../../../src/components/SqlTextEditor.tsx"],"names":[],"mappings":"AACA,OAAc,EAAE,aAAa,EAAuB,MAAM,OAAO,CAAC;AAElE,OAAO,EAAE,WAAW,EAAE,MAAM,eAAe,CAAC;AAE5C,OAAO,EAAE,cAAc,EAAE,MAAM,gBAAgB,CAAC;AA+DhD,MAAM,CAAC,OAAO,UAAU,aAAa,CAAC,EACpC,cAAc,EACd,KAAK,EACL,QAAQ,EACR,gBAAgB,EAChB,kBAAkB,EAClB,gBAAgB,EAChB,MAAM,EACN,MAAgB,EAChB,YAA2B,GAC5B,EAAE;IACD,cAAc,CAAC,EAAE,aAAa,CAAC;IAC/B,KAAK,EAAE,MAAM,CAAC;IACd,QAAQ,EAAE,CAAC,CAAC,EAAE,MAAM,KAAK,IAAI,CAAC;IAC9B,gBAAgB,EAAE,CAAC,CAAC,EAAE,OAAO,KAAK,IAAI,CAAC;IACvC,kBAAkB,CAAC,EAAE,CAAC,CAAC,EAAE,WAAW,GAAG,IAAI,KAAK,IAAI,CAAC;IACrD,MAAM,CAAC,EAAE,MAAM,GAAG,MAAM,CAAC;IACzB,MAAM,EAAE,cAAc,EAAE,CAAC;IACzB,YAAY,CAAC,EAAE,MAAM,CAAC;IACtB,gBAAgB,EAAE,WAAW,GAAG,IAAI,CAAC;CACtC,2CAsEA"}
+{"version":3,"file":"SqlTextEditor.d.ts","sourceRoot":"","sources":["../../../src/components/SqlTextEditor.tsx"],"names":[],"mappings":"AACA,OAAc,EAAE,aAAa,EAA+B,MAAM,OAAO,CAAC;AAI1E,OAAO,EAAE,cAAc,EAAE,MAAM,gBAAgB,CAAC;AAuEhD,MAAM,CAAC,OAAO,UAAU,aAAa,CAAC,EACpC,cAAc,EACd,KAAK,EACL,QAAQ,EACR,gBAAgB,EAChB,MAAM,EACN,YAA2B,EAC3B,SAAgB,GACjB,EAAE;IACD,cAAc,CAAC,EAAE,aAAa,CAAC;IAC/B,KAAK,EAAE,MAAM,CAAC;IACd,QAAQ,EAAE,CAAC,CAAC,EAAE,MAAM,KAAK,IAAI,CAAC;IAC9B,gBAAgB,EAAE,CAAC,CAAC,EAAE,OAAO,KAAK,IAAI,CAAC;IACvC,MAAM,EAAE,cAAc,EAAE,CAAC;IACzB,YAAY,CAAC,EAAE,MAAM,CAAC;IACtB,SAAS,CAAC,EAAE,OAAO,CAAC;CACrB,2CAoEA"}

package/dist/cjs/components/SqlTextEditor.js

@@ -3,6 +3,7 @@ var __importDefault = (this && this.__importDefault) || function (mod) {
     return (mod && mod.__esModule) ? mod : { "default": mod };
 };
 Object.defineProperty(exports, "__esModule", { value: true });
+exports.default = SqlTextEditor;
 const jsx_runtime_1 = require("react/jsx-runtime");
 // eslint-disable-next-line @typescript-eslint/ban-ts-comment
 const react_1 = require("react");
@@ -31,12 +32,14 @@ function setEditorTheme(_editor, monaco, schema, databaseType) {
     try {
         monaco.editor.setTheme('onedark');
         monaco.languages.register({ id: 'quill' });
+        monaco.languages.setMonarchTokensProvider('quill', monacoAutocomplete_1.QUILL_LANGUAGE.monarchTokensProvider);
+        monaco.languages.setLanguageConfiguration('quill', monacoAutocomplete_1.QUILL_LANGUAGE.languageConfiguration);
         const provider = monaco.languages.registerCompletionItemProvider('quill', {
             provideCompletionItems: function (model, position) {
                 const word = model.getWordUntilPosition(position);
                 const range = new monaco.Range(position.lineNumber, word.startColumn, position.lineNumber, word.endColumn);
                 const databaseSuggestions = (0, monacoAutocomplete_1.generateSuggestionsByDatasource)(monaco, range, databaseType);
-                const schemaSuggestions = (0, monacoAutocomplete_1.generateSuggestionsBySchema)(schema, monaco, range, databaseType);
+                const schemaSuggestions = (0, monacoAutocomplete_1.generateSuggestionsBySchema)(schema, monaco, range);
                 return { suggestions: [...databaseSuggestions, ...schemaSuggestions] };
             },
         });
@@ -47,25 +50,27 @@ function setEditorTheme(_editor, monaco, schema, databaseType) {
         return null;
     }
 }
-function SqlTextEditor({ containerStyle, value, setValue, setEditorMounted, setPreviousProvier, previousProvider, schema, height = '224px', databaseType = 'postgresql', }) {
+function SqlTextEditor({ containerStyle, value, setValue, setEditorMounted, schema, databaseType = 'postgresql', resizable = true, }) {
     const [editorKey, setEditorKey] = (0, react_1.useState)(0);
+    const currentProvider = (0, react_1.useRef)(null);
     (0, react_1.useEffect)(() => {
-        if (previousProvider) {
-            previousProvider.dispose();
-        }
-    }, []);
-    (0, react_1.useEffect)(() => {
-        if (schema && schema.length !== 0 && editorKey === 0) {
-            setEditorKey((prevKey) => prevKey + 1);
+        if (currentProvider.current) {
+            currentProvider.current.dispose();
+            if (schema && schema.length !== 0) {
+                setEditorKey((prevKey) => prevKey + 1);
+            }
         }
-    }, [schema]);
+        return () => {
+            currentProvider.current?.dispose();
+        };
+    }, [schema, databaseType]);
     return ((0, jsx_runtime_1.jsx)("div", { style: { ...containerStyle }, children: (0, jsx_runtime_1.jsx)(re_resizable_1.Resizable, { defaultSize: {
                 width: 'auto',
-                height: 224,
-            }, minHeight: "100px", maxHeight: "800px", maxWidth: '100%', enable: {
-                top: true,
+                height: '200px', // default height for firefox
+            }, minHeight: "200px", maxHeight: "800px", maxWidth: '100%', enable: {
+                top: resizable,
                 right: false,
-                bottom: true,
+                bottom: resizable,
                 left: false,
                 topRight: false,
                 bottomRight: false,
@@ -82,11 +87,7 @@ function SqlTextEditor({ containerStyle, value, setValue, setEditorMounted, setP
                 }, onChange: (query) => {
                     setValue(query);
                 }, beforeMount: (monaco) => defineEditorTheme(monaco), onMount: (_editor, monaco) => {
-                    const disposable = setEditorTheme(_editor, monaco, schema, databaseType);
-                    if (setPreviousProvier) {
-                        setPreviousProvier(disposable);
-                    }
+                    currentProvider.current = setEditorTheme(_editor, monaco, schema, databaseType);
                     setEditorMounted(true);
                 } }, editorKey) }) }));
 }
-exports.default = SqlTextEditor;

package/dist/cjs/components/StepDisplay.d.ts.map

@@ -1 +1 @@
-{"version":3,"file":"StepDisplay.d.ts","sourceRoot":"","sources":["../../../src/components/StepDisplay.tsx"],"names":[],"mappings":"AAAA,OAAc,EAAE,aAAa,EAAY,MAAM,OAAO,CAAC;AAGvD,UAAU,gBAAgB;IACxB,KAAK,EAAE,MAAM,CAAC;IACd,SAAS,EAAE,OAAO,CAAC;IACnB,YAAY,EAAE,aAAa,CAAC;IAC5B,OAAO,CAAC,EAAE,MAAM,IAAI,CAAC;CACtB;AAED,MAAM,CAAC,OAAO,UAAU,WAAW,CAAC,EAClC,KAAK,EACL,SAAS,EACT,YAAY,EACZ,OAAO,GACR,EAAE,gBAAgB,2CA0ClB"}
+{"version":3,"file":"StepDisplay.d.ts","sourceRoot":"","sources":["../../../src/components/StepDisplay.tsx"],"names":[],"mappings":"AAAA,OAAc,EAAE,aAAa,EAAE,MAAM,OAAO,CAAC;AAG7C,UAAU,gBAAgB;IACxB,KAAK,EAAE,MAAM,CAAC;IACd,SAAS,EAAE,OAAO,CAAC;IACnB,YAAY,EAAE,aAAa,CAAC;IAC5B,OAAO,CAAC,EAAE,MAAM,IAAI,CAAC;CACtB;AAED,MAAM,CAAC,OAAO,UAAU,WAAW,CAAC,EAClC,KAAK,EACL,SAAS,EACT,YAAY,EACZ,OAAO,GACR,EAAE,gBAAgB,2CAyClB"}

package/dist/cjs/components/StepDisplay.js

@@ -1,5 +1,6 @@
 "use strict";
 Object.defineProperty(exports, "__esModule", { value: true });
+exports.default = StepDisplay;
 const jsx_runtime_1 = require("react/jsx-runtime");
 function StepDisplay({ label, completed, header1Style, onClick, }) {
     return ((0, jsx_runtime_1.jsxs)("div", { style: {
@@ -13,6 +14,5 @@ function StepDisplay({ label, completed, header1Style, onClick, }) {
             borderRadius: 6,
             backgroundColor: '#F6F6F6',
             padding: '24px 24px',
-        }, id: "connect-database-form", onClick: onClick, children: [(0, jsx_runtime_1.jsx)("h1", { style: { ...header1Style, marginBottom: '0px', fontSize: 16 }, children: label }), completed ? ((0, jsx_runtime_1.jsx)("div", { children: (0, jsx_runtime_1.jsx)("svg", { xmlns: "http://www.w3.org/2000/svg", viewBox: "0 0 20 20", fill: "currentColor", width: "24px", height: "24px", children: (0, jsx_runtime_1.jsx)("path", { fillRule: "evenodd", d: "M10 18a8 8 0 1 0 0-16 8 8 0 0 0 0 16Zm3.857-9.809a.75.75 0 0 0-1.214-.882l-3.483 4.79-1.88-1.88a.75.75 0 1 0-1.06 1.061l2.5 2.5a.75.75 0 0 0 1.137-.089l4-5.5Z", clipRule: "evenodd" }) }) })) : ((0, jsx_runtime_1.jsx)("div", {}))] }));
+        }, onClick: onClick, children: [(0, jsx_runtime_1.jsx)("h1", { style: { ...header1Style, marginBottom: '0px', fontSize: 16 }, children: label }), completed ? ((0, jsx_runtime_1.jsx)("div", { children: (0, jsx_runtime_1.jsx)("svg", { xmlns: "http://www.w3.org/2000/svg", viewBox: "0 0 20 20", fill: "currentColor", width: "24px", height: "24px", children: (0, jsx_runtime_1.jsx)("path", { fillRule: "evenodd", d: "M10 18a8 8 0 1 0 0-16 8 8 0 0 0 0 16Zm3.857-9.809a.75.75 0 0 0-1.214-.882l-3.483 4.79-1.88-1.88a.75.75 0 1 0-1.06 1.061l2.5 2.5a.75.75 0 0 0 1.137-.089l4-5.5Z", clipRule: "evenodd" }) }) })) : ((0, jsx_runtime_1.jsx)("div", {}))] }));
 }
-exports.default = StepDisplay;

package/dist/cjs/components/Tenants/EditTenant.d.ts

@@ -0,0 +1,41 @@
+import { ForwardRefExoticComponent, RefAttributes } from 'react';
+import { QuillTenant } from '../../utils/tenants';
+import { TextInputPrimitiveProps } from '../../primitives/TextInputPrimitive';
+import { ButtonPrimitiveProps } from '../../primitives/ButtonPrimitive';
+import { ButtonComponentProps } from '@quillsql/react';
+export declare function EditTenant({ tenant, setTenant, setCreateNewTenant, onSubmitEditTenant, onValidateEditTenant, HeaderComponent, TextInputComponent, ButtonComponent, ModalComponent, SecondaryButtonComponent, isSubmitTenantLoading, client, queryEndpoint, hideDiscardChanges, isOnboarding, }: {
+    tenant: QuillTenant | undefined;
+    setTenant: (tenant: QuillTenant | undefined) => void;
+    setCreateNewTenant: (adding: boolean) => void;
+    onSubmitEditTenant: (tenant: Partial<QuillTenant> & {
+        role: 'owner' | 'viewer';
+    }, creation: boolean, isOnboarding: boolean) => Promise<void>;
+    onValidateEditTenant: (tenant: Partial<QuillTenant>, isOnboarding: boolean) => Promise<{
+        id: string | number;
+        label: string;
+        flag: string;
+    }[]>;
+    HeaderComponent?: any;
+    ModalComponent: any;
+    TextInputComponent: ForwardRefExoticComponent<TextInputPrimitiveProps & RefAttributes<HTMLInputElement>> | ((props: TextInputPrimitiveProps) => JSX.Element);
+    ButtonComponent: React.FC<ButtonComponentProps & {
+        isLoading?: boolean;
+    }>;
+    SecondaryButtonComponent: React.FC<ButtonPrimitiveProps & {
+        isLoading?: boolean;
+    }>;
+    isSubmitTenantLoading: boolean;
+    client: {
+        _id: string;
+        id: string;
+        databaseType: string;
+        allTenantTypes: QuillTenant[];
+        ownerTenantFields: string[];
+        schemaNames: string[];
+        queryHeaders?: HeadersInit;
+    };
+    queryEndpoint: string;
+    hideDiscardChanges?: boolean;
+    isOnboarding: boolean;
+}): import("react/jsx-runtime").JSX.Element;
+//# sourceMappingURL=EditTenant.d.ts.map

package/dist/cjs/components/Tenants/EditTenant.d.ts.map

@@ -0,0 +1 @@
+{"version":3,"file":"EditTenant.d.ts","sourceRoot":"","sources":["../../../../src/components/Tenants/EditTenant.tsx"],"names":[],"mappings":"AAAA,OAAO,EACL,yBAAyB,EACzB,aAAa,EAKd,MAAM,OAAO,CAAC;AACf,OAAO,EAAE,WAAW,EAAE,MAAM,qBAAqB,CAAC;AAClD,OAA2B,EACzB,uBAAuB,EACxB,MAAM,qCAAqC,CAAC;AAC7C,OAAO,EAAE,oBAAoB,EAAE,MAAM,kCAAkC,CAAC;AAGxE,OAAO,EACL,oBAAoB,EAIrB,MAAM,iBAAiB,CAAC;AAgDzB,wBAAgB,UAAU,CAAC,EACzB,MAAM,EACN,SAAS,EACT,kBAAkB,EAClB,kBAAkB,EAClB,oBAAoB,EACpB,eAAe,EACf,kBAAkB,EAClB,eAAe,EACf,cAAc,EACd,wBAAwB,EACxB,qBAAqB,EACrB,MAAM,EACN,aAAa,EACb,kBAAkB,EAClB,YAAY,GACb,EAAE;IACD,MAAM,EAAE,WAAW,GAAG,SAAS,CAAC;IAChC,SAAS,EAAE,CAAC,MAAM,EAAE,WAAW,GAAG,SAAS,KAAK,IAAI,CAAC;IACrD,kBAAkB,EAAE,CAAC,MAAM,EAAE,OAAO,KAAK,IAAI,CAAC;IAC9C,kBAAkB,EAAE,CAClB,MAAM,EAAE,OAAO,CAAC,WAAW,CAAC,GAAG;QAAE,IAAI,EAAE,OAAO,GAAG,QAAQ,CAAA;KAAE,EAC3D,QAAQ,EAAE,OAAO,EACjB,YAAY,EAAE,OAAO,KAClB,OAAO,CAAC,IAAI,CAAC,CAAC;IACnB,oBAAoB,EAAE,CACpB,MAAM,EAAE,OAAO,CAAC,WAAW,CAAC,EAC5B,YAAY,EAAE,OAAO,KAClB,OAAO,CAAC;QAAE,EAAE,EAAE,MAAM,GAAG,MAAM,CAAC;QAAC,KAAK,EAAE,MAAM,CAAC;QAAC,IAAI,EAAE,MAAM,CAAA;KAAE,EAAE,CAAC,CAAC;IACrE,eAAe,CAAC,EAAE,GAAG,CAAC;IACtB,cAAc,EAAE,GAAG,CAAC;IACpB,kBAAkB,EACd,yBAAyB,CACvB,uBAAuB,GAAG,aAAa,CAAC,gBAAgB,CAAC,CAC1D,GACD,CAAC,CAAC,KAAK,EAAE,uBAAuB,KAAK,GAAG,CAAC,OAAO,CAAC,CAAC;IACtD,eAAe,EAAE,KAAK,CAAC,EAAE,CACvB,oBAAoB,GAAG;QACrB,SAAS,CAAC,EAAE,OAAO,CAAC;KACrB,CACF,CAAC;IACF,wBAAwB,EAAE,KAAK,CAAC,EAAE,CAChC,oBAAoB,GAAG;QACrB,SAAS,CAAC,EAAE,OAAO,CAAC;KACrB,CACF,CAAC;IACF,qBAAqB,EAAE,OAAO,CAAC;IAC/B,MAAM,EAAE;QACN,GAAG,EAAE,MAAM,CAAC;QACZ,EAAE,EAAE,MAAM,CAAC;QACX,YAAY,EAAE,MAAM,CAAC;QACrB,cAAc,EAAE,WAAW,EAAE,CAAC;QAC9B,iBAAiB,EAAE,MAAM,EAAE,CAAC;QAC5B,WAAW,EAAE,MAAM,EAAE,CAAC;QACtB,YAAY,CAAC,EAAE,WAAW,CAAC;KAC5B,CAAC;IACF,aAAa,EAAE,MAAM,CAAC;IACtB,kBAAkB,CAAC,EAAE,OAAO,CAAC;IAC7B,YAAY,EAAE,OAAO,CAAC;CACvB,2CA+wBA"}