@quillsql/admin 1.7.0 → 1.7.2

package/dist/cjs/components/QuillSelectWithCombo.js

@@ -1,353 +0,0 @@
-"use strict";
-var __createBinding = (this && this.__createBinding) || (Object.create ? (function(o, m, k, k2) {
-    if (k2 === undefined) k2 = k;
-    var desc = Object.getOwnPropertyDescriptor(m, k);
-    if (!desc || ("get" in desc ? !m.__esModule : desc.writable || desc.configurable)) {
-      desc = { enumerable: true, get: function() { return m[k]; } };
-    }
-    Object.defineProperty(o, k2, desc);
-}) : (function(o, m, k, k2) {
-    if (k2 === undefined) k2 = k;
-    o[k2] = m[k];
-}));
-var __setModuleDefault = (this && this.__setModuleDefault) || (Object.create ? (function(o, v) {
-    Object.defineProperty(o, "default", { enumerable: true, value: v });
-}) : function(o, v) {
-    o["default"] = v;
-});
-var __importStar = (this && this.__importStar) || (function () {
-    var ownKeys = function(o) {
-        ownKeys = Object.getOwnPropertyNames || function (o) {
-            var ar = [];
-            for (var k in o) if (Object.prototype.hasOwnProperty.call(o, k)) ar[ar.length] = k;
-            return ar;
-        };
-        return ownKeys(o);
-    };
-    return function (mod) {
-        if (mod && mod.__esModule) return mod;
-        var result = {};
-        if (mod != null) for (var k = ownKeys(mod), i = 0; i < k.length; i++) if (k[i] !== "default") __createBinding(result, mod, k[i]);
-        __setModuleDefault(result, mod);
-        return result;
-    };
-})();
-Object.defineProperty(exports, "__esModule", { value: true });
-exports.QuillSelectComponentWithCombo = QuillSelectComponentWithCombo;
-const jsx_runtime_1 = require("react/jsx-runtime");
-const useOnClickOutside_1 = __importStar(require("../hooks/useOnClickOutside"));
-const UiComponents_1 = require("./UiComponents");
-const react_1 = __importStar(require("react"));
-const QuillMultiSelectWithCombo_1 = require("./QuillMultiSelectWithCombo");
-const AdminProvider_1 = require("../AdminProvider");
-const react_dom_1 = require("react-dom");
-const ui_1 = require("../utils/ui");
-/**
- * A robust select component that implements the new minimal Select interface.
- */
-function QuillSelectComponentWithCombo({ options, value, width, onChange, label, isLoading, hideEmptyOption, disabled, badge, mimicReactSelect, testLabel, displayValue, }) {
-    const theme = (0, AdminProvider_1.useAdmin)().state.theme;
-    const [showModal, setShowModal] = (0, react_1.useState)(false);
-    const modalRef = (0, react_1.useRef)(null);
-    const buttonRef = (0, react_1.useRef)(null);
-    const [searchQuery, setSearchQuery] = react_1.default.useState('');
-    const [popoverPosition, setPopoverPosition] = (0, react_1.useState)(undefined);
-    const [z, setZ] = (0, react_1.useState)(10);
-    const scrollableParentRef = (0, react_1.useRef)(document.body);
-    // FIXME: Hacked this to display the option that has been filtered out, which is good
-    // But it doesn't have its proper label, since we haven't stored/passed in the label
-    const filteredItems = react_1.default.useMemo(() => {
-        // Sort null to top
-        if (searchQuery === '') {
-            return (options
-                ?.sort((a, b) => {
-                if (a.value === null) {
-                    return -1;
-                }
-                if (b.value === null) {
-                    return 1;
-                }
-                return 0;
-            })
-                ?.slice(0, 100) ?? []);
-        }
-        const uuidRegex = /^[0-9a-fA-F]{8}-[0-9a-fA-F]{4}-[1-5][0-9a-fA-F]{3}-[89abAB][0-9a-fA-F]{3}-[0-9a-fA-F]{12}$/;
-        const isUuid = options?.[0]?.value?.toString()?.match(uuidRegex);
-        const isNumber = typeof options?.[0]?.value === 'number';
-        return (options
-            ?.filter((option) => {
-            if (!option) {
-                return false;
-            }
-            return (option.label
-                .toString()
-                .toLowerCase()
-                .replace(/\s+/g, '')
-                .includes(searchQuery.toLowerCase().replace(/\s+/g, '')) ||
-                (isNumber || isUuid
-                    ? option.value
-                        .toString()
-                        .toLowerCase()
-                        .replace(/\s+/g, '')
-                        .includes(searchQuery.toLowerCase().replace(/\s+/g, ''))
-                    : false));
-        })
-            ?.sort((a, b) => {
-            if (a.value === null) {
-                return -1;
-            }
-            if (b.value === null) {
-                return 1;
-            }
-            return 0;
-        })
-            .slice(0, 100) ?? []);
-    }, [options, searchQuery]);
-    const nullLabel = (0, react_1.useMemo)(() => {
-        return filteredItems.some((item) => item.value === '-') ? 'None' : '-';
-    }, [filteredItems]);
-    const selectedLabel = (0, react_1.useMemo)(() => {
-        const selectedOption = options?.find((elem) => elem.value === value);
-        return selectedOption && selectedOption.label == '-'
-            ? nullLabel
-            : (selectedOption?.label ?? 'Select');
-    }, [value, options, nullLabel]);
-    const updatePosition = () => {
-        if (buttonRef.current) {
-            requestAnimationFrame(() => {
-                const rect = buttonRef?.current?.getBoundingClientRect();
-                if (rect) {
-                    const viewportHeight = window.innerHeight;
-                    // Calculate available space below the element with a 64px bottom margin
-                    const availableHeight = viewportHeight - rect.bottom - 64;
-                    setPopoverPosition({
-                        top: rect.bottom + window.scrollY,
-                        left: rect.left + window.scrollX,
-                        width: rect.width,
-                        maxHeight: availableHeight,
-                    });
-                }
-            });
-        }
-    };
-    (0, react_1.useEffect)(() => {
-        let resizeObserver;
-        let mutationObserver;
-        if (showModal && buttonRef.current) {
-            updatePosition();
-            setZ((0, useOnClickOutside_1.getEffectiveZIndex)(buttonRef.current) + 1);
-            resizeObserver = new ResizeObserver(() => updatePosition());
-            resizeObserver.observe(buttonRef.current);
-            mutationObserver = new MutationObserver(() => updatePosition());
-            mutationObserver.observe(buttonRef.current, {
-                attributes: true,
-                subtree: true,
-            });
-            // Track scrolling of the nearest scrollable ancestor
-            scrollableParentRef.current = (0, ui_1.getScrollableParent)(buttonRef.current);
-            scrollableParentRef.current.addEventListener('scroll', updatePosition, {
-                passive: true,
-            });
-            const handleResize = () => requestAnimationFrame(updatePosition);
-            window.addEventListener('resize', handleResize, { passive: true });
-            return () => {
-                resizeObserver.disconnect();
-                mutationObserver.disconnect();
-                scrollableParentRef.current.removeEventListener('scroll', updatePosition);
-                window.removeEventListener('resize', handleResize);
-            };
-        }
-    }, [showModal]);
-    (0, useOnClickOutside_1.default)(modalRef, (event) => {
-        if (!buttonRef.current?.contains(event.target))
-            setShowModal(false);
-    }, showModal);
-    return ((0, jsx_runtime_1.jsxs)("div", { style: {
-            position: 'relative',
-            borderRadius: '6px',
-            width: width,
-            minWidth: width,
-            color: '#384151',
-            fontWeight: mimicReactSelect ? 400 : 500,
-        }, children: [label && ((0, jsx_runtime_1.jsx)("div", { style: {
-                    fontSize: 14,
-                    color: theme?.secondaryTextColor,
-                    fontFamily: theme?.fontFamily,
-                    paddingBottom: 5,
-                    fontWeight: 600,
-                }, children: label })), (0, jsx_runtime_1.jsxs)("button", { style: {
-                    fontFamily: theme?.fontFamily,
-                    width: '100%',
-                    display: 'flex',
-                    alignItems: 'center',
-                    justifyContent: 'space-between',
-                    lineHeight: 'inherit',
-                    padding: '8px 12px',
-                    fontSize: 14,
-                    margin: 0,
-                    boxSizing: 'border-box',
-                    borderWidth: 1,
-                    borderStyle: 'solid',
-                    borderColor: theme?.borderColor,
-                    borderRadius: 6,
-                    paddingTop: 9,
-                    paddingBottom: 9,
-                    height: 40,
-                    minHeight: 40,
-                    maxHeight: 40,
-                }, className: 'quill-select-button', onClick: () => setShowModal((showModal) => !showModal), disabled: disabled, ref: buttonRef, children: [(0, jsx_runtime_1.jsx)("style", { children: ` 
-          .quill-select-button { background: ${theme?.backgroundColor}; color: ${theme?.primaryTextColor}; }
-          .quill-select-button:hover { background: ${theme?.hoverBackgroundColor}; color: ${theme?.hoverTextColor}; }
-          .quill-select-button:disabled { 
-            cursor: not-allowed;
-            opacity: 0.5;
-          }
-        ` }), (0, jsx_runtime_1.jsx)("span", { style: {
-                            textOverflow: 'ellipsis',
-                            whiteSpace: 'nowrap',
-                            overflow: 'hidden',
-                            fontWeight: isLoading ? undefined : 300,
-                        }, children: isLoading ? 'Loading...' : selectedLabel }), badge && ((0, jsx_runtime_1.jsx)("span", { style: {
-                            color: 'white',
-                            backgroundColor: 'black',
-                            borderRadius: 10,
-                            padding: '2px 6px',
-                            fontSize: 10,
-                            fontWeight: 600,
-                            marginBottom: -2,
-                            marginLeft: -42,
-                        }, children: badge })), (0, jsx_runtime_1.jsx)("svg", { xmlns: "http://www.w3.org/2000/svg", viewBox: "0 0 20 20", fill: "currentColor", "aria-hidden": "true", "data-slot": "icon", height: 20, width: 20, style: { minHeight: 20, minWidth: 20 }, children: (0, jsx_runtime_1.jsx)("path", { fillRule: "evenodd", d: "M5.22 8.22a.75.75 0 0 1 1.06 0L10 11.94l3.72-3.72a.75.75 0 1 1 1.06 1.06l-4.25 4.25a.75.75 0 0 1-1.06 0L5.22 9.28a.75.75 0 0 1 0-1.06Z", clipRule: "evenodd" }) })] }), showModal &&
-                (0, react_dom_1.createPortal)((0, jsx_runtime_1.jsxs)("div", { style: {
-                        position: 'absolute',
-                        top: `${popoverPosition?.top ?? 0}px`,
-                        left: `${popoverPosition?.left ?? 0}px`,
-                        width: `${popoverPosition?.width ?? 0}px`,
-                        maxHeight: `${Math.max(popoverPosition?.maxHeight ?? 0, 100)}px`,
-                        minHeight: options.length > 2 ? 120 : options.length * 40,
-                        visibility: popoverPosition ? 'visible' : 'hidden',
-                        display: 'flex',
-                        flexDirection: 'column',
-                        boxSizing: 'border-box',
-                        borderWidth: 1,
-                        borderStyle: 'solid',
-                        borderColor: theme?.borderColor,
-                        borderRadius: 6,
-                        background: theme?.backgroundColor,
-                        marginTop: 12,
-                        zIndex: z,
-                        padding: 6,
-                        fontFamily: theme?.fontFamily,
-                        overflow: 'scroll',
-                        fontSize: 14,
-                    }, ref: modalRef, "data-portal-ignore": "true", "data-testid": `quill-select-portal-${testLabel}`, children: [options && options.length > 20 && !isLoading && ((0, jsx_runtime_1.jsx)(QuillMultiSelectWithCombo_1.ListboxTextInput, { value: searchQuery, placeholder: "Search", onChange: (value) => {
-                                setSearchQuery(value);
-                            } })), searchQuery === '' &&
-                            !isLoading &&
-                            (!hideEmptyOption || !options.length) && ((0, jsx_runtime_1.jsxs)("button", { style: {
-                                display: 'flex',
-                                alignItems: 'center',
-                                justifyContent: 'space-between',
-                                padding: '8px 8px',
-                                margin: 0,
-                                boxSizing: 'border-box',
-                                borderWidth: 0,
-                                fontSize: 14,
-                                borderStyle: 'solid',
-                                borderColor: theme?.borderColor,
-                                borderRadius: 4,
-                                fontFamily: theme?.fontFamily,
-                                textOverflow: 'ellipsis',
-                                whiteSpace: 'nowrap',
-                                overflow: 'hidden',
-                                height: 34,
-                                minHeight: 34,
-                            }, className: "quill-option", onClick: () => {
-                                // Manually create a synthetic ChangeEvent and pass it to callback
-                                const changeEvent = { target: { value: undefined } };
-                                onChange(changeEvent);
-                                setShowModal(false);
-                            }, children: [(0, jsx_runtime_1.jsx)("style", { children: `
-                .quill-option {
-                  background: ${theme?.backgroundColor};
-                  color: ${theme?.secondaryTextColor};
-                }
-                  .quill-option:hover {
-                    background: ${theme?.hoverBackgroundColor};
-                    color: ${theme?.hoverTextColor};
-                  }
-                ` }), (0, jsx_runtime_1.jsx)("span", { style: {
-                                        fontWeight: 300,
-                                    }, children: "Select" })] })), !isLoading ? (filteredItems.map((option) => ((0, jsx_runtime_1.jsxs)("button", { style: {
-                                display: 'flex',
-                                alignItems: 'center',
-                                justifyContent: 'space-between',
-                                padding: '8px 8px',
-                                margin: 0,
-                                boxSizing: 'border-box',
-                                borderWidth: 0,
-                                fontSize: 14,
-                                borderStyle: 'solid',
-                                borderColor: theme?.borderColor,
-                                borderRadius: 4,
-                                fontFamily: theme?.fontFamily,
-                                textOverflow: 'ellipsis',
-                                whiteSpace: 'nowrap',
-                                height: 34,
-                                minHeight: 34,
-                                overflow: 'hidden',
-                            }, className: "quill-option", onClick: () => {
-                                // Manually create a synthetic ChangeEvent and pass it to callback
-                                const changeEvent = { target: { value: option.value } };
-                                onChange(changeEvent);
-                                setShowModal(false);
-                            }, children: [(0, jsx_runtime_1.jsx)("style", { children: `
-                .quill-option {
-                  background: ${theme?.backgroundColor};
-                  color: ${theme?.primaryTextColor};
-                }
-                  .quill-option:hover {
-                    background: ${theme?.hoverBackgroundColor};
-                    color: ${theme?.hoverTextColor};
-                  }
-                ` }), (0, jsx_runtime_1.jsxs)("div", { style: {
-                                        display: 'flex',
-                                        flexDirection: 'row',
-                                        flex: 1,
-                                        minWidth: 0,
-                                        overflow: 'hidden',
-                                        gap: 8,
-                                        alignItems: 'center',
-                                    }, children: [(0, jsx_runtime_1.jsx)("span", { style: {
-                                                textOverflow: 'ellipsis',
-                                                whiteSpace: 'nowrap',
-                                                overflow: 'hidden',
-                                                fontWeight: 400,
-                                                flex: 1,
-                                                minWidth: 0,
-                                                textAlign: 'left',
-                                            }, title: option.value !== null && option.value !== '-'
-                                                ? option.value.toString()
-                                                : undefined, children: option.label ?? nullLabel }), option.value !== null &&
-                                            option.value !== '-' &&
-                                            displayValue && ((0, jsx_runtime_1.jsx)("span", { style: {
-                                                fontSize: 11,
-                                                color: theme?.secondaryTextColor,
-                                                textOverflow: 'ellipsis',
-                                                whiteSpace: 'nowrap',
-                                                overflow: 'hidden',
-                                                fontWeight: 400,
-                                                flexShrink: 1,
-                                                maxWidth: '30%',
-                                                minWidth: 0,
-                                            }, title: option.value.toString(), children: option.value.toString().length > 15
-                                                ? `${option.value.toString().substring(0, 15)}...`
-                                                : option.value.toString() }))] })] }, option.value)))) : ((0, jsx_runtime_1.jsx)("div", { style: {
-                                width: '100%',
-                                alignItems: 'center',
-                                justifyContent: 'center',
-                                display: 'flex',
-                                marginLeft: 'auto',
-                                marginRight: 'auto',
-                                padding: 8,
-                            }, children: (0, jsx_runtime_1.jsx)(UiComponents_1.LoadingSpinner, {}) }))] }), document.body)] }));
-}

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

@@ -1,12 +0,0 @@
-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

@@ -1 +0,0 @@
-{"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

@@ -1,84 +0,0 @@
-"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

@@ -1,11 +0,0 @@
-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

@@ -1 +0,0 @@
-{"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,GAAI,iEAOhC,uBAAuB,4CA2IzB,CAAC"}

package/dist/cjs/components/QuillToolTipPortal.js

@@ -1,108 +0,0 @@
-"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

@@ -1,15 +0,0 @@
-import { QuillTheme } from '@quillsql/react';
-export declare function SegmentedControl({ onChange, value, theme, left, right, }: {
-    onChange: (e: any) => void;
-    value: string;
-    theme?: QuillTheme;
-    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 +0,0 @@
-{"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,59 +0,0 @@
-"use strict";
-Object.defineProperty(exports, "__esModule", { value: true });
-exports.SegmentedControl = SegmentedControl;
-const jsx_runtime_1 = require("react/jsx-runtime");
-const react_1 = require("react");
-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',
-            alignItems: 'center',
-            background: '#F5F5F6',
-            maxWidth: 209,
-            padding: 4,
-            borderRadius: 6,
-            height: 40,
-        }, children: [(0, jsx_runtime_1.jsx)("button", { className: "quill-tab", onClick: () => {
-                    setLeftSelected(true);
-                    onChange(left.value.toLowerCase());
-                }, style: {
-                    border: leftSelected ? '1px solid #E7E7E7' : '1px solid transparent',
-                    outline: 'none',
-                    width: '100%',
-                    borderRadius: 4,
-                    height: 32,
-                    padding: 8,
-                    boxShadow: leftSelected
-                        ? '0px 1px 4px 0px rgba(56, 65, 81, 0.08)'
-                        : undefined,
-                    color: leftSelected
-                        ? 'rgba(56, 65, 81, 1)'
-                        : 'rgba(56, 65, 81, 0.85)',
-                    fontWeight: leftSelected ? 600 : 500,
-                    fontSize: 14,
-                    fontFamily: theme?.fontFamily,
-                    boxSizing: 'border-box',
-                    backgroundColor: leftSelected ? 'white' : 'transparent',
-                }, 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.value.toLowerCase());
-                }, style: {
-                    border: !leftSelected ? '1px solid #E7E7E7' : '1px solid transparent',
-                    boxShadow: !leftSelected
-                        ? '0px 1px 4px 0px rgba(56, 65, 81, 0.08)'
-                        : undefined,
-                    outline: 'none',
-                    width: '100%',
-                    borderRadius: 4,
-                    height: 32,
-                    color: !leftSelected
-                        ? 'rgba(56, 65, 81, 1)'
-                        : 'rgba(56, 65, 81, 0.85)',
-                    padding: 8,
-                    fontWeight: !leftSelected ? 600 : 500,
-                    fontSize: 14,
-                    fontFamily: theme?.fontFamily,
-                    backgroundColor: !leftSelected ? 'white' : 'transparent',
-                }, children: (0, jsx_runtime_1.jsx)("div", { style: { marginTop: -3 }, children: right.label }) })] }));
-}