@quillsql/react 2.8.8 → 2.8.9

package/dist/components/Modal/Modal.js

@@ -1,39 +1,14 @@
-"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 (mod) {
-    if (mod && mod.__esModule) return mod;
-    var result = {};
-    if (mod != null) for (var k in mod) if (k !== "default" && Object.prototype.hasOwnProperty.call(mod, k)) __createBinding(result, mod, k);
-    __setModuleDefault(result, mod);
-    return result;
-};
-Object.defineProperty(exports, "__esModule", { value: true });
-const jsx_runtime_1 = require("react/jsx-runtime");
+import { jsx as _jsx } from "react/jsx-runtime";
 // @ts-nocheck
 /* eslint-disable react/display-name */
-const react_1 = __importStar(require("react"));
-const hooks_1 = require("../../hooks");
-const lib_1 = require("../../lib");
-const Modal = react_1.default.forwardRef((props, ref) => {
+import React, { useCallback, useEffect, useRef, useState } from 'react';
+import { useOnClickOutside, useOnWindowResize } from '../../hooks';
+import { mergeRefs } from '../../lib';
+const Modal = React.forwardRef((props, ref) => {
     const { showModal, setShowModal, parentRef, width, maxHeight = '18rem', children, className, theme, ...other } = props;
-    const [modalExceedsWindow, setModalExceedsWindow] = (0, react_1.useState)(false);
-    const modalRef = (0, react_1.useRef)(null);
-    const checkModalExceedsWindow = (0, react_1.useCallback)((modalWidth, windowWidth) => {
+    const [modalExceedsWindow, setModalExceedsWindow] = useState(false);
+    const modalRef = useRef(null);
+    const checkModalExceedsWindow = useCallback((modalWidth, windowWidth) => {
         if (!parentRef.current) {
             return false;
         }
@@ -43,7 +18,7 @@ const Modal = react_1.default.forwardRef((props, ref) => {
     const getAbsoluteSpacing = () => {
         return modalExceedsWindow ? '0' : '0';
     };
-    (0, hooks_1.useOnClickOutside)(modalRef, e => {
+    useOnClickOutside(modalRef, e => {
         // Exclude click on trigger button (e.g. Dropdown Button) from outside click handler
         const isTriggerElem = parentRef
             ? parentRef.current?.contains(e.target)
@@ -53,17 +28,17 @@ const Modal = react_1.default.forwardRef((props, ref) => {
         }
     });
     // Execute only when modal is of absolute size
-    (0, react_1.useEffect)(() => {
+    useEffect(() => {
         if (width) {
             setModalExceedsWindow(checkModalExceedsWindow(width, window.innerWidth));
         }
     }, [checkModalExceedsWindow, parentRef, width]);
-    (0, hooks_1.useOnWindowResize)(() => {
+    useOnWindowResize(() => {
         if (width) {
             setModalExceedsWindow(checkModalExceedsWindow(width, window.innerWidth));
         }
     });
-    return showModal ? ((0, jsx_runtime_1.jsx)("div", { ref: (0, lib_1.mergeRefs)([modalRef, ref]), style: {
+    return showModal ? (_jsx("div", { ref: mergeRefs([modalRef, ref]), style: {
             position: 'absolute',
             zIndex: 10,
             overflowY: 'auto',
@@ -87,5 +62,4 @@ const Modal = react_1.default.forwardRef((props, ref) => {
             boxShadow: '0 4px 6px -1px rgb(0 0 0 / 0.1), 0 2px 4px -2px rgb(0 0 0 / 0.1)',
         }, ...other, children: children })) : null;
 });
-exports.default = Modal;
-//# sourceMappingURL=Modal.js.map
+export default Modal;

package/dist/components/Modal/index.js

@@ -1,9 +1 @@
-"use strict";
-var __importDefault = (this && this.__importDefault) || function (mod) {
-    return (mod && mod.__esModule) ? mod : { "default": mod };
-};
-Object.defineProperty(exports, "__esModule", { value: true });
-exports.default = void 0;
-var Modal_1 = require("./Modal");
-Object.defineProperty(exports, "default", { enumerable: true, get: function () { return __importDefault(Modal_1).default; } });
-//# sourceMappingURL=index.js.map
+export { default } from "./Modal";

package/dist/components/QuillCard.js

@@ -1,10 +1,7 @@
-"use strict";
-Object.defineProperty(exports, "__esModule", { value: true });
-exports.QuillCard = void 0;
-const jsx_runtime_1 = require("react/jsx-runtime");
-const assets_1 = require("../assets");
-function QuillCard({ children, theme, onClick, isSelected = false, clickable = true, onClose, minHeight = 0, style = {}, }) {
-    return ((0, jsx_runtime_1.jsxs)("div", { className: clickable ? 'quill-card-hover' : '', style: {
+import { jsx as _jsx, jsxs as _jsxs } from "react/jsx-runtime";
+import { XIcon } from '../assets';
+export function QuillCard({ children, theme, onClick, isSelected = false, clickable = true, onClose, minHeight = 0, style = {}, }) {
+    return (_jsxs("div", { className: clickable ? 'quill-card-hover' : '', style: {
             backgroundColor: theme.backgroundColor || 'white',
             cursor: clickable ? 'pointer' : 'default',
             padding: 16,
@@ -17,7 +14,7 @@ function QuillCard({ children, theme, onClick, isSelected = false, clickable = t
             position: 'relative',
             minHeight: minHeight,
             ...style,
-        }, onClick: onClick, children: [(0, jsx_runtime_1.jsx)("style", { children: `
+        }, onClick: onClick, children: [_jsx("style", { children: `
         .quill-card-hover:hover {
           background-color: #f9f9f9 !important;
           .quill-delete-button {
@@ -27,7 +24,7 @@ function QuillCard({ children, theme, onClick, isSelected = false, clickable = t
             background-color: #f5f5f5;
           }
         }
-      ` }), onClose && ((0, jsx_runtime_1.jsxs)("button", { className: "quill-delete-button", type: "button", onClick: e => {
+      ` }), onClose && (_jsxs("button", { className: "quill-delete-button", type: "button", onClick: e => {
                     e.stopPropagation();
                     onClose();
                 }, style: {
@@ -45,13 +42,11 @@ function QuillCard({ children, theme, onClick, isSelected = false, clickable = t
                     justifyContent: 'center',
                     borderRadius: 6,
                     float: 'right',
-                }, children: [(0, jsx_runtime_1.jsx)("style", { children: `
+                }, children: [_jsx("style", { children: `
       .quill-delete-button {
           background-color: white;
       }
       .quill-delete-button:hover {
         background-color: rgba(56, 65, 81, 0.03);
-      }` }), (0, jsx_runtime_1.jsx)(assets_1.XIcon, { height: "20", width: "20", fill: "#6C727F" })] })), (0, jsx_runtime_1.jsx)("div", { style: { overflowX: 'scroll' }, children: children })] }));
+      }` }), _jsx(XIcon, { height: "20", width: "20", fill: "#6C727F" })] })), _jsx("div", { style: { overflowX: 'scroll' }, children: children })] }));
 }
-exports.QuillCard = QuillCard;
-//# sourceMappingURL=QuillCard.js.map

package/dist/components/ReportBuilder/ColumnSelector.d.ts

@@ -0,0 +1,19 @@
+import React from 'react';
+interface Column {
+    name: string;
+    fieldType: string;
+    tableName: string;
+}
+interface ColumnSelectorProps {
+    schemaInfo: any[];
+    theme: any;
+    PopoverComponent?: any;
+    ButtonComponent?: any;
+    parentRef?: React.MutableRefObject<undefined>;
+    selectedTable: any;
+    setSelectedColumns: (columns: Column[]) => void;
+    customerFieldName: string;
+}
+export default function ColumnSelector({ schemaInfo, theme, parentRef, selectedTable, PopoverComponent, ButtonComponent, setSelectedColumns, customerFieldName }: ColumnSelectorProps): import("react/jsx-runtime").JSX.Element;
+export {};
+//# sourceMappingURL=ColumnSelector.d.ts.map

package/dist/components/ReportBuilder/ColumnSelector.d.ts.map

@@ -0,0 +1 @@
+{"version":3,"file":"ColumnSelector.d.ts","sourceRoot":"","sources":["../../../src/components/ReportBuilder/ColumnSelector.tsx"],"names":[],"mappings":"AAAA,OAAO,KAMN,MAAM,OAAO,CAAC;AAQf,UAAU,MAAM;IACd,IAAI,EAAE,MAAM,CAAC;IACb,SAAS,EAAE,MAAM,CAAC;IAClB,SAAS,EAAE,MAAM,CAAC;CACnB;AAED,UAAU,mBAAmB;IAC3B,UAAU,EAAE,GAAG,EAAE,CAAC;IAClB,KAAK,EAAE,GAAG,CAAC;IACX,gBAAgB,CAAC,EAAE,GAAG,CAAC;IACvB,eAAe,CAAC,EAAE,GAAG,CAAC;IACtB,SAAS,CAAC,EAAE,KAAK,CAAC,gBAAgB,CAAC,SAAS,CAAC,CAAC;IAC9C,aAAa,EAAE,GAAG,CAAC;IACnB,kBAAkB,EAAE,CAAC,OAAO,EAAE,MAAM,EAAE,KAAK,IAAI,CAAC;IAChD,iBAAiB,EAAE,MAAM,CAAA;CAC1B;AAED,MAAM,CAAC,OAAO,UAAU,cAAc,CAAC,EACrC,UAAU,EACV,KAAK,EACL,SAAS,EACT,aAAa,EACb,gBAAgB,EAChB,eAAe,EACf,kBAAkB,EAClB,iBAAiB,EAClB,EAAE,mBAAmB,2CA0IrB"}

package/dist/components/ReportBuilder/ColumnSelector.js

@@ -0,0 +1,87 @@
+import { jsx as _jsx, jsxs as _jsxs } from "react/jsx-runtime";
+import { useEffect, useState, } from 'react';
+import { MemoizedTextInput } from '../UiComponents';
+import { formatColumnData, } from '../../utils/schema';
+export default function ColumnSelector({ schemaInfo, theme, parentRef, selectedTable, PopoverComponent, ButtonComponent, setSelectedColumns, customerFieldName }) {
+    const [isOpen, setIsOpen] = useState(false);
+    const [allColumns, setAllCoumns] = useState([]);
+    const [searchQuery, setSearchQuery] = useState('');
+    useEffect(() => {
+        console.log('schemaInfo', schemaInfo);
+        setAllCoumns(formatColumnData(schemaInfo, selectedTable, customerFieldName));
+    }, [schemaInfo]);
+    const updateSelectedColumns = (selectedColumn) => {
+        const currentAllColumns = [...allColumns];
+        // loop through all columns if selected column is found then toggle selected
+        let selectedCount = 0;
+        let selectableTables = [];
+        currentAllColumns.forEach((column) => {
+            if (column.displayName === selectedColumn.displayName) {
+                column.selected = !column.selected;
+            }
+            if (column.selected) {
+                selectedCount++;
+                if (selectableTables.length === 0) {
+                    selectableTables = column.presentTables;
+                }
+                selectableTables.forEach((table) => {
+                    if (!column.presentTables.includes(table)) {
+                        // remove the table from selectableTables
+                        selectableTables = selectableTables.filter((item) => item !== table);
+                    }
+                });
+            }
+        });
+        currentAllColumns.forEach((column) => {
+            if (selectedCount === 0) {
+                column.selectable = true;
+            }
+            else {
+                const selectable = selectableTables.some((table) => column.presentTables.includes(table));
+                column.selectable = selectable;
+            }
+        });
+        setAllCoumns(currentAllColumns);
+    };
+    const memoizedTextInputChange = (value) => {
+        const currentAllColumns = [...allColumns];
+        currentAllColumns.forEach((column) => {
+            if (column.displayName.toLowerCase().includes(value.toLowerCase()) &&
+                column.selectable) {
+                column.textFiltered = true;
+            }
+            else {
+                column.textFiltered = false;
+            }
+            if (value === '' && column.selectable) {
+                column.textFiltered = true;
+            }
+        });
+        setSearchQuery(value);
+        setAllCoumns(currentAllColumns);
+    };
+    return (_jsx("div", { style: { display: 'flex', flexDirection: 'column' }, children: _jsxs(PopoverComponent, { parentRef: parentRef, label: "Columns", style: { right: 0, minWidth: 400, overflow: 'visible' }, isOpen: isOpen, onClose: () => setIsOpen(false), title: "Select Columns", setIsOpen: setIsOpen, children: [_jsx(MemoizedTextInput, { value: searchQuery, onChange: memoizedTextInputChange, placeholder: 'Search', id: 'quill-search-bar' }), allColumns.map((column, index) => {
+                    if (column.selectable && column.textFiltered) {
+                        return (_jsxs("div", { style: {
+                                display: 'flex',
+                                flexDirection: 'row',
+                                alignItems: 'center',
+                                marginTop: 2,
+                            }, children: [_jsx("input", { type: "checkbox", checked: column.selected, onChange: () => {
+                                        updateSelectedColumns(column);
+                                    } }), _jsx("div", { style: { width: 6 } }), _jsx("div", { children: column.displayName })] }, column.name + index));
+                    }
+                }), _jsx("div", { children: _jsx(ButtonComponent, { id: "custom-button", onClick: () => {
+                            const selectedColumns = allColumns.reduce((acc, column) => {
+                                if (column.selected) {
+                                    acc.push({
+                                        name: column.name,
+                                        fieldType: column.fieldType,
+                                        tableName: column.tableName,
+                                    });
+                                }
+                                return acc;
+                            }, []);
+                            setSelectedColumns(selectedColumns);
+                        }, label: 'Select' }) })] }) }));
+}

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

@@ -1 +1 @@
-{"version":3,"file":"SqlTextEditor.d.ts","sourceRoot":"","sources":["../../src/components/SqlTextEditor.tsx"],"names":[],"mappings":"AAAA,OAAc,EAAE,aAAa,EAAE,MAAM,OAAO,CAAC;AAG7C,MAAM,CAAC,OAAO,UAAU,aAAa,CAAC,EACpC,cAAc,EACd,KAAK,EACL,QAAQ,GACT,EAAE;IACD,cAAc,CAAC,EAAE,aAAa,CAAC;IAC/B,KAAK,EAAE,MAAM,CAAC;IACd,QAAQ,EAAE,CAAC,CAAC,EAAE,MAAM,KAAK,IAAI,CAAC;CAC/B,2CAuBA"}
+{"version":3,"file":"SqlTextEditor.d.ts","sourceRoot":"","sources":["../../src/components/SqlTextEditor.tsx"],"names":[],"mappings":"AAEA,OAAc,EAAE,aAAa,EAAE,MAAM,OAAO,CAAC;AA4B7C,MAAM,CAAC,OAAO,UAAU,aAAa,CAAC,EACpC,cAAc,EACd,KAAK,EACL,QAAQ,GACT,EAAE;IACD,cAAc,CAAC,EAAE,aAAa,CAAC;IAC/B,KAAK,EAAE,MAAM,CAAC;IACd,QAAQ,EAAE,CAAC,CAAC,EAAE,MAAM,KAAK,IAAI,CAAC;CAC/B,2CAwBA"}

package/dist/components/SqlTextEditor.js

@@ -1,21 +1,38 @@
-"use strict";
-var __importDefault = (this && this.__importDefault) || function (mod) {
-    return (mod && mod.__esModule) ? mod : { "default": mod };
-};
-Object.defineProperty(exports, "__esModule", { value: true });
-const jsx_runtime_1 = require("react/jsx-runtime");
-const react_1 = __importDefault(require("@monaco-editor/react"));
-function SqlTextEditor({ containerStyle, value, setValue, }) {
-    return ((0, jsx_runtime_1.jsx)("div", { style: { ...containerStyle, padding: '10px 0px' }, children: (0, jsx_runtime_1.jsx)(react_1.default, { height: "100px", defaultLanguage: "pgsql", defaultValue: "", value: value, loading: (0, jsx_runtime_1.jsx)("div", {}), options: {
+import { jsx as _jsx } from "react/jsx-runtime";
+import MonacoEditor from '@monaco-editor/react';
+function defineEditorTheme(monaco) {
+    monaco.editor.defineTheme('onedark', {
+        base: 'vs',
+        inherit: true,
+        rules: [
+            {
+                token: 'comment',
+                foreground: '#5d7988',
+                fontStyle: 'italic',
+            },
+            { token: 'constant', foreground: '#e06c75' },
+        ],
+        colors: {
+            'editor.background': '#F9F9F9',
+        },
+    });
+}
+function setEditorTheme(editor, monaco) {
+    try {
+        monaco.editor.setTheme('onedark');
+    }
+    catch (e) {
+        console.log('ERROR: ', e);
+    }
+}
+export default function SqlTextEditor({ containerStyle, value, setValue, }) {
+    return (_jsx("div", { style: { ...containerStyle }, children: _jsx(MonacoEditor, { height: "224px", defaultLanguage: "pgsql", defaultValue: "", value: value, loading: _jsx("div", {}), options: {
                 wordWrap: 'on',
                 minimap: {
                     enabled: false,
                 },
                 padding: { top: 16 },
             }, onChange: (query) => {
-                console.log(query);
                 setValue(query);
-            } }) }));
+            }, beforeMount: (monaco) => defineEditorTheme(monaco), onMount: setEditorTheme }) }));
 }
-exports.default = SqlTextEditor;
-//# sourceMappingURL=SqlTextEditor.js.map

package/dist/components/UiComponents.d.ts.map

@@ -1 +1 @@
-{"version":3,"file":"UiComponents.d.ts","sourceRoot":"","sources":["../../src/components/UiComponents.tsx"],"names":[],"mappings":"AAMA,MAAM,WAAW,MAAM;IACrB,KAAK,EAAE,MAAM,CAAC;IACd,KAAK,EAAE,MAAM,CAAC;CACf;AAED,MAAM,WAAW,oBAAoB;IACnC,QAAQ,EAAE,CAAC,KAAK,EAAE,MAAM,KAAK,IAAI,CAAC;IAClC,KAAK,EAAE,MAAM,CAAC;IACd,OAAO,EAAE,MAAM,EAAE,CAAC;IAClB,QAAQ,CAAC,EAAE,OAAO,CAAC;IACnB,KAAK,CAAC,EAAE,MAAM,CAAC;CAChB;AAED,MAAM,WAAW,uBAAuB;IACtC,QAAQ,EAAE,CAAC,CAAC,EAAE,GAAG,KAAK,IAAI,CAAC;IAC3B,KAAK,EAAE,MAAM,CAAC;IACd,EAAE,EAAE,MAAM,CAAC;IACX,WAAW,EAAE,MAAM,CAAC;CACrB;AAED,MAAM,WAAW,oBAAoB;IACnC,OAAO,EAAE,MAAM,IAAI,CAAC;IACpB,KAAK,EAAE,MAAM,CAAC;IACd,OAAO,CAAC,EAAE,OAAO,CAAC;CACnB;AAED,MAAM,WAAW,uBAAuB;IACtC,QAAQ,EAAE,CAAC,CAAC,EAAE,GAAG,KAAK,IAAI,CAAC;IAC3B,KAAK,EAAE,MAAM,CAAC;IACd,EAAE,EAAE,MAAM,CAAC;CACZ;AAED,MAAM,WAAW,mBAAmB;IAClC,QAAQ,EAAE,GAAG,CAAC;IACd,MAAM,EAAE,OAAO,CAAC;IAChB,OAAO,CAAC,EAAE,MAAM,IAAI,CAAC;IACrB,KAAK,CAAC,EAAE,MAAM,CAAC;IACf,SAAS,EAAE,CAAC,MAAM,EAAE,OAAO,KAAK,IAAI,CAAC;IACrC,KAAK,CAAC,EAAE,GAAG,CAAC;CACb;AAED,MAAM,WAAW,WAAW;IAC1B,QAAQ,EAAE,GAAG,CAAC;CACf;AAED,MAAM,WAAW,UAAU;IACzB,QAAQ,EAAE,GAAG,CAAC;CACf;AAED,MAAM,WAAW,SAAS;IACxB,QAAQ,EAAE,GAAG,CAAC;CACf;AAED,MAAM,WAAW,iBAAiB;IAChC,OAAO,EAAE,MAAM,IAAI,CAAC;IACpB,KAAK,EAAE,GAAG,CAAC;CACZ;AAED,eAAO,MAAM,iBAAiB;;;;;6CAgC7B,CAAC;AAEF,eAAO,MAAM,cAAc;;;;6CAgC1B,CAAC;AAEF,eAAO,MAAM,uBAAuB;;;6CA6BnC,CAAC;AAEF,eAAO,MAAM,cAAc;;;;;;6CA4D1B,CAAC;AAEF,eAAO,MAAM,cAAc;;6CAa1B,CAAC;AAEF,eAAO,MAAM,aAAa;;6CAYzB,CAAC;AAEF,eAAO,MAAM,YAAY;;6CAYxB,CAAC;AAsBF,MAAM,WAAW,qBAAqB;IACpC,QAAQ,EAAE,GAAG,CAAC;IACd,OAAO,CAAC,EAAE,MAAM,IAAI,CAAC;IACrB,SAAS,CAAC,EAAE,GAAG,CAAC;IAChB,KAAK,CAAC,EAAE,GAAG,CAAC;IACZ,OAAO,CAAC,EAAE,MAAM,IAAI,CAAC;IACrB,WAAW,CAAC,EAAE,OAAO,CAAC;IACtB,MAAM,EAAE,OAAO,CAAC;IAChB,SAAS,EAAE,CAAC,MAAM,EAAE,OAAO,KAAK,IAAI,CAAC;CACtC;AAED,wBAAgB,eAAe,CAAC,EAC9B,OAAO,EACP,SAAS,EACT,QAAQ,EACR,KAAU,EACV,OAAO,EACP,KAAK,EACL,WAAkB,EAClB,MAAM,EACN,SAAS,GACV;;;;;;;;;;CAAA,2CA4DA;AAED,wBAAgB,aAAa,CAAC,EAC5B,MAAM,EACN,OAAO,EACP,SAAS,EACT,KAAK,EACL,QAAQ,EACR,KAAK,GACN;;;;;;;CAAA,kDAyFA;AAED,eAAO,MAAM,oBAAoB;;;6CA0BhC,CAAC"}
+{"version":3,"file":"UiComponents.d.ts","sourceRoot":"","sources":["../../src/components/UiComponents.tsx"],"names":[],"mappings":"AAMA,MAAM,WAAW,MAAM;IACrB,KAAK,EAAE,MAAM,CAAC;IACd,KAAK,EAAE,MAAM,CAAC;CACf;AAED,MAAM,WAAW,oBAAoB;IACnC,QAAQ,EAAE,CAAC,KAAK,EAAE,MAAM,KAAK,IAAI,CAAC;IAClC,KAAK,EAAE,MAAM,CAAC;IACd,OAAO,EAAE,MAAM,EAAE,CAAC;IAClB,QAAQ,CAAC,EAAE,OAAO,CAAC;IACnB,KAAK,CAAC,EAAE,MAAM,CAAC;CAChB;AAED,MAAM,WAAW,uBAAuB;IACtC,QAAQ,EAAE,CAAC,CAAC,EAAE,GAAG,KAAK,IAAI,CAAC;IAC3B,KAAK,EAAE,MAAM,CAAC;IACd,EAAE,EAAE,MAAM,CAAC;IACX,WAAW,EAAE,MAAM,CAAC;CACrB;AAED,MAAM,WAAW,oBAAoB;IACnC,OAAO,EAAE,MAAM,IAAI,CAAC;IACpB,KAAK,EAAE,MAAM,CAAC;IACd,OAAO,CAAC,EAAE,OAAO,CAAC;CACnB;AAED,MAAM,WAAW,uBAAuB;IACtC,QAAQ,EAAE,CAAC,CAAC,EAAE,GAAG,KAAK,IAAI,CAAC;IAC3B,KAAK,EAAE,MAAM,CAAC;IACd,EAAE,EAAE,MAAM,CAAC;CACZ;AAED,MAAM,WAAW,mBAAmB;IAClC,QAAQ,EAAE,GAAG,CAAC;IACd,MAAM,EAAE,OAAO,CAAC;IAChB,OAAO,CAAC,EAAE,MAAM,IAAI,CAAC;IACrB,KAAK,CAAC,EAAE,MAAM,CAAC;IACf,SAAS,EAAE,CAAC,MAAM,EAAE,OAAO,KAAK,IAAI,CAAC;IACrC,KAAK,CAAC,EAAE,GAAG,CAAC;CACb;AAED,MAAM,WAAW,WAAW;IAC1B,QAAQ,EAAE,GAAG,CAAC;CACf;AAED,MAAM,WAAW,UAAU;IACzB,QAAQ,EAAE,GAAG,CAAC;CACf;AAED,MAAM,WAAW,SAAS;IACxB,QAAQ,EAAE,GAAG,CAAC;CACf;AAED,MAAM,WAAW,iBAAiB;IAChC,OAAO,EAAE,MAAM,IAAI,CAAC;IACpB,KAAK,EAAE,GAAG,CAAC;CACZ;AAED,eAAO,MAAM,iBAAiB;;;;;6CAgC7B,CAAC;AAEF,eAAO,MAAM,cAAc;;;;6CAgC1B,CAAC;AAEF,eAAO,MAAM,uBAAuB;;;6CA6BnC,CAAC;AAEF,eAAO,MAAM,cAAc;;;;;;6CA4D1B,CAAC;AAEF,eAAO,MAAM,cAAc;;6CAa1B,CAAC;AAEF,eAAO,MAAM,aAAa;;6CAYzB,CAAC;AAEF,eAAO,MAAM,YAAY;;6CAYxB,CAAC;AAsBF,MAAM,WAAW,qBAAqB;IACpC,QAAQ,EAAE,GAAG,CAAC;IACd,OAAO,CAAC,EAAE,MAAM,IAAI,CAAC;IACrB,SAAS,CAAC,EAAE,GAAG,CAAC;IAChB,KAAK,CAAC,EAAE,GAAG,CAAC;IACZ,OAAO,CAAC,EAAE,MAAM,IAAI,CAAC;IACrB,WAAW,CAAC,EAAE,OAAO,CAAC;IACtB,MAAM,EAAE,OAAO,CAAC;IAChB,SAAS,EAAE,CAAC,MAAM,EAAE,OAAO,KAAK,IAAI,CAAC;CACtC;AAED,wBAAgB,eAAe,CAAC,EAC9B,OAAO,EACP,SAAS,EACT,QAAQ,EACR,KAAU,EACV,OAAO,EACP,KAAK,EACL,WAAkB,EAClB,MAAM,EACN,SAAS,GACV;;;;;;;;;;CAAA,2CA4DA;AAED,wBAAgB,aAAa,CAAC,EAC5B,MAAM,EACN,OAAO,EACP,SAAS,EACT,KAAK,EACL,QAAQ,EACR,KAAK,GACN;;;;;;;CAAA,kDA2FA;AAED,eAAO,MAAM,oBAAoB;;;6CA0BhC,CAAC"}

package/dist/components/UiComponents.js

@@ -1,14 +1,11 @@
-"use strict";
-Object.defineProperty(exports, "__esModule", { value: true });
-exports.MemoizedDeleteButton = exports.MemoizedModal = exports.MemoizedPopover = exports.MemoizedText = exports.MemoizedLabel = exports.MemoizedHeader = exports.MemoizedSelect = exports.MemoizedSecondaryButton = exports.MemoizedButton = exports.MemoizedTextInput = void 0;
-const jsx_runtime_1 = require("react/jsx-runtime");
+import { jsx as _jsx, jsxs as _jsxs, Fragment as _Fragment } from "react/jsx-runtime";
 // @ts-nocheck
-const react_1 = require("react");
-const assets_1 = require("../assets");
-const Context_1 = require("../Context");
-const MemoizedTextInput = ({ value, onChange, placeholder, id }) => {
-    const [theme] = (0, react_1.useContext)(Context_1.ThemeContext);
-    return ((0, jsx_runtime_1.jsxs)("div", { style: { position: 'relative' }, children: [(0, jsx_runtime_1.jsx)("style", { children: `
+import { useContext, useEffect, useRef } from 'react';
+import { ArrowDownHeadIcon, XIcon } from '../assets';
+import { ThemeContext } from '../Context';
+export const MemoizedTextInput = ({ value, onChange, placeholder, id }) => {
+    const [theme] = useContext(ThemeContext);
+    return (_jsxs("div", { style: { position: 'relative' }, children: [_jsx("style", { children: `
     .quill-text-input {
         background-color: white;
         height: 40px;
@@ -23,12 +20,11 @@ const MemoizedTextInput = ({ value, onChange, placeholder, id }) => {
        padding-top: 0px;
        padding-bottom: 0px;
        box-sizing: content-box;
-    }` }), (0, jsx_runtime_1.jsx)("input", { id: id, className: "quill-text-input", type: "text", value: value, onChange: event => onChange(event.target.value), placeholder: placeholder, style: { fontFamily: theme?.fontFamily } })] }));
+    }` }), _jsx("input", { id: id, className: "quill-text-input", type: "text", value: value, onChange: (event) => onChange(event.target.value), placeholder: placeholder, style: { fontFamily: theme?.fontFamily } })] }));
 };
-exports.MemoizedTextInput = MemoizedTextInput;
-const MemoizedButton = ({ label, onClick, primary = true }) => {
-    const [theme] = (0, react_1.useContext)(Context_1.ThemeContext);
-    return ((0, jsx_runtime_1.jsxs)("button", { className: "quill-button", onClick: onClick, style: { fontFamily: theme?.fontFamily }, children: [(0, jsx_runtime_1.jsx)("style", { children: `
+export const MemoizedButton = ({ label, onClick, primary = true }) => {
+    const [theme] = useContext(ThemeContext);
+    return (_jsxs("button", { className: "quill-button", onClick: onClick, style: { fontFamily: theme?.fontFamily }, children: [_jsx("style", { children: `
     .quill-button {
         background-color: #384151;
         color: white;
@@ -49,10 +45,9 @@ const MemoizedButton = ({ label, onClick, primary = true }) => {
       overflow: hidden;
     }` }), label] }));
 };
-exports.MemoizedButton = MemoizedButton;
-const MemoizedSecondaryButton = ({ label, onClick }) => {
-    const [theme] = (0, react_1.useContext)(Context_1.ThemeContext);
-    return ((0, jsx_runtime_1.jsxs)("button", { className: "quill-secondary-button", onClick: onClick, style: { fontFamily: theme?.fontFamily }, children: [(0, jsx_runtime_1.jsx)("style", { children: `
+export const MemoizedSecondaryButton = ({ label, onClick }) => {
+    const [theme] = useContext(ThemeContext);
+    return (_jsxs("button", { className: "quill-secondary-button", onClick: onClick, style: { fontFamily: theme?.fontFamily }, children: [_jsx("style", { children: `
     .quill-secondary-button {
         background-color: #F5F5F6;
         color: rgba(56, 65, 81, 0.75);
@@ -70,13 +65,12 @@ const MemoizedSecondaryButton = ({ label, onClick }) => {
       background-color: rgba(56, 65, 81, 0.09);
     }` }), label] }));
 };
-exports.MemoizedSecondaryButton = MemoizedSecondaryButton;
-const MemoizedSelect = ({ value, onChange, options, disabled = false, label, }) => {
-    const [theme] = (0, react_1.useContext)(Context_1.ThemeContext);
-    return ((0, jsx_runtime_1.jsxs)("div", { style: {
+export const MemoizedSelect = ({ value, onChange, options, disabled = false, label, }) => {
+    const [theme] = useContext(ThemeContext);
+    return (_jsxs("div", { style: {
             position: 'relative',
             maxWidth: 206,
-        }, children: [(0, jsx_runtime_1.jsx)("style", { children: `
+        }, children: [_jsx("style", { children: `
     .quill-select {
         background-color: white;
         height: 42px;
@@ -88,7 +82,7 @@ const MemoizedSelect = ({ value, onChange, options, disabled = false, label, })
        box-shadow: 0px 1px 4px 0px rgba(56, 65, 81, 0.08);
        padding-left: 12px;
        padding-right: 12px;
-    }` }), (0, jsx_runtime_1.jsx)("select", { style: { WebkitAppearance: 'none', fontFamily: theme?.fontFamily }, className: "quill-select", value: value, disabled: disabled, onChange: event => onChange(event.target.value), children: options.map(option => ((0, jsx_runtime_1.jsx)("option", { className: "quill-option", value: option.value, children: option.label }, option.value))) }), (0, jsx_runtime_1.jsx)(assets_1.ArrowDownHeadIcon, { style: {
+    }` }), _jsx("select", { style: { WebkitAppearance: 'none', fontFamily: theme?.fontFamily }, className: "quill-select", value: value, disabled: disabled, onChange: (event) => onChange(event.target.value), children: options.map((option) => (_jsx("option", { className: "quill-option", value: option.value, children: option.label }, option.value))) }), _jsx(ArrowDownHeadIcon, { style: {
                     height: '20px',
                     width: '20px',
                     flex: 'none',
@@ -98,8 +92,7 @@ const MemoizedSelect = ({ value, onChange, options, disabled = false, label, })
                     color: '#6C727F',
                 }, "aria-hidden": "true" })] }));
 };
-exports.MemoizedSelect = MemoizedSelect;
-const MemoizedHeader = ({ children }) => ((0, jsx_runtime_1.jsx)("h1", { style: {
+export const MemoizedHeader = ({ children }) => (_jsx("h1", { style: {
         fontSize: 16,
         fontWeight: 600,
         color: '#384151',
@@ -107,25 +100,22 @@ const MemoizedHeader = ({ children }) => ((0, jsx_runtime_1.jsx)("h1", { style:
         margin: 0,
         padding: 0,
     }, children: children }));
-exports.MemoizedHeader = MemoizedHeader;
-const MemoizedLabel = ({ children }) => ((0, jsx_runtime_1.jsx)("h1", { style: {
+export const MemoizedLabel = ({ children }) => (_jsx("h1", { style: {
         fontSize: 14,
         fontWeight: 600,
         color: '#575E6A',
         userSelect: 'none',
         paddingBottom: 5,
     }, children: children }));
-exports.MemoizedLabel = MemoizedLabel;
-const MemoizedText = ({ children }) => ((0, jsx_runtime_1.jsx)("p", { style: {
+export const MemoizedText = ({ children }) => (_jsx("p", { style: {
         fontSize: 12,
         fontWeight: 400,
         margin: 0,
         color: '#575E6A',
         userSelect: 'none',
     }, children: children }));
-exports.MemoizedText = MemoizedText;
 const useOnClickOutside = (ref, handler) => {
-    (0, react_1.useEffect)(() => {
+    useEffect(() => {
         const listener = (event) => {
             if (!ref.current || ref.current.contains(event.target)) {
                 return;
@@ -140,9 +130,9 @@ const useOnClickOutside = (ref, handler) => {
         };
     }, [ref, handler]);
 };
-function MemoizedPopover({ onClose, parentRef, children, style = {}, onClick, label, showTrigger = true, isOpen, setIsOpen, }) {
-    const modalRef = (0, react_1.useRef)(null);
-    useOnClickOutside(modalRef, e => {
+export function MemoizedPopover({ onClose, parentRef, children, style = {}, onClick, label, showTrigger = true, isOpen, setIsOpen, }) {
+    const modalRef = useRef(null);
+    useOnClickOutside(modalRef, (e) => {
         // Exclude click on trigger button (e.g. Dropdown Button) from outside click handler
         const isTriggerElem = parentRef
             ? parentRef.current?.contains(e.target)
@@ -157,12 +147,12 @@ function MemoizedPopover({ onClose, parentRef, children, style = {}, onClick, la
             onClose();
         }
     };
-    return ((0, jsx_runtime_1.jsxs)("div", { children: [showTrigger && ((0, jsx_runtime_1.jsx)(exports.MemoizedSecondaryButton, { onClick: e => {
-                    setIsOpen(isOpen => !isOpen);
+    return (_jsxs("div", { children: [showTrigger && (_jsx(MemoizedSecondaryButton, { onClick: (e) => {
+                    setIsOpen((isOpen) => !isOpen);
                     if (onClick) {
                         onClick(e);
                     }
-                }, label: label })), isOpen && ((0, jsx_runtime_1.jsx)("div", { id: "quill-popover-modal", ref: modalRef, style: { position: 'relative' }, children: (0, jsx_runtime_1.jsx)("div", { style: {
+                }, label: label })), isOpen && (_jsx("div", { id: "quill-popover-modal", ref: modalRef, style: { position: 'relative' }, children: _jsx("div", { style: {
                         background: 'white',
                         position: 'absolute',
                         boxShadow: '0px 1px 12px 0px rgba(56, 65, 81, 0.1)',
@@ -176,12 +166,11 @@ function MemoizedPopover({ onClose, parentRef, children, style = {}, onClick, la
                         ...style,
                     }, children: children }) }))] }));
 }
-exports.MemoizedPopover = MemoizedPopover;
-function MemoizedModal({ isOpen, onClose, setIsOpen, title, children, theme, }) {
+export function MemoizedModal({ isOpen, onClose, setIsOpen, title, children, theme, }) {
     if (!isOpen) {
         return null;
     }
-    return ((0, jsx_runtime_1.jsxs)(jsx_runtime_1.Fragment, { children: [(0, jsx_runtime_1.jsx)("div", { style: {
+    return (_jsxs(_Fragment, { children: [_jsx("div", { style: {
                     position: 'fixed',
                     top: '0',
                     right: '0',
@@ -190,7 +179,7 @@ function MemoizedModal({ isOpen, onClose, setIsOpen, title, children, theme, })
                     zIndex: '50',
                     backgroundColor: 'rgba(255, 255, 255, 0.8)',
                     backdropFilter: 'blur(5px)',
-                }, onClick: onClose }), (0, jsx_runtime_1.jsx)("div", { style: {
+                }, onClick: onClose }), _jsx("div", { style: {
                     // position: "absolute",
                     position: 'fixed',
                     left: '50%',
@@ -210,7 +199,7 @@ function MemoizedModal({ isOpen, onClose, setIsOpen, title, children, theme, })
                     borderColor: '#e7e7e7',
                     overflow: 'hidden',
                     // zIndex: 1000,
-                }, children: (0, jsx_runtime_1.jsxs)("div", { style: {
+                }, children: _jsxs("div", { style: {
                         // width: "80%",
                         maxHeight: '90vh',
                         overflowY: 'scroll',
@@ -221,14 +210,15 @@ function MemoizedModal({ isOpen, onClose, setIsOpen, title, children, theme, })
                         display: 'flex',
                         flexDirection: 'column',
                         alignItems: 'center',
+                        position: 'relative',
                         fontFamily: theme?.fontFamily,
-                    }, children: [(0, jsx_runtime_1.jsxs)("div", { style: {
+                    }, children: [_jsxs("div", { id: "quill-modal-header", style: {
                                 display: 'flex',
                                 flexDirection: 'row',
                                 width: '100%',
                                 justifyContent: 'space-between',
                                 alignItems: 'center',
-                            }, children: [(0, jsx_runtime_1.jsx)("h2", { style: {
+                            }, children: [_jsx("h2", { style: {
                                         fontSize: 18,
                                         fontWeight: '600',
                                         marginLeft: 20,
@@ -236,10 +226,9 @@ function MemoizedModal({ isOpen, onClose, setIsOpen, title, children, theme, })
                                         textAlign: 'left',
                                         paddingTop: 18,
                                         color: theme?.primaryTextColor,
-                                    }, children: title }), (0, jsx_runtime_1.jsx)(exports.MemoizedDeleteButton, { onClick: onClose, style: { marginRight: 10, marginTop: 10 } })] }), children] }) })] }));
+                                    }, children: title }), _jsx(MemoizedDeleteButton, { onClick: onClose, style: { marginRight: 10, marginTop: 10 } })] }), children] }) })] }));
 }
-exports.MemoizedModal = MemoizedModal;
-const MemoizedDeleteButton = ({ onClick, style }) => ((0, jsx_runtime_1.jsxs)("button", { className: "quill-delete-button", type: "button", onClick: onClick, style: {
+export const MemoizedDeleteButton = ({ onClick, style }) => (_jsxs("button", { className: "quill-delete-button", type: "button", onClick: onClick, style: {
         height: 42,
         width: 42,
         border: 'none',
@@ -249,12 +238,10 @@ const MemoizedDeleteButton = ({ onClick, style }) => ((0, jsx_runtime_1.jsxs)("b
         justifyContent: 'center',
         borderRadius: 6,
         ...style,
-    }, children: [(0, jsx_runtime_1.jsx)("style", { children: `
+    }, children: [_jsx("style", { children: `
   .quill-delete-button {
       background-color: white;
   }
   .quill-delete-button:hover {
     background-color: rgba(56, 65, 81, 0.03);
-  }` }), (0, jsx_runtime_1.jsx)(assets_1.XIcon, { height: "20", width: "20", fill: "#6C727F" })] }));
-exports.MemoizedDeleteButton = MemoizedDeleteButton;
-//# sourceMappingURL=UiComponents.js.map
+  }` }), _jsx(XIcon, { height: "20", width: "20", fill: "#6C727F" })] }));

package/dist/components/selectUtils.js

@@ -1,19 +1,12 @@
-"use strict";
-var __importDefault = (this && this.__importDefault) || function (mod) {
-    return (mod && mod.__esModule) ? mod : { "default": mod };
-};
-Object.defineProperty(exports, "__esModule", { value: true });
-exports.hasValue = exports.getSelectButtonColors = exports.getFilteredOptions = exports.constructValueToNameMapping = void 0;
-const react_1 = __importDefault(require("react"));
-function constructValueToNameMapping(children) {
+import React from 'react';
+export function constructValueToNameMapping(children) {
     const valueToNameMapping = new Map();
-    react_1.default.Children.map(children, (child) => {
+    React.Children.map(children, (child) => {
         valueToNameMapping.set(child.props.value, child.props.text ?? child.props.value);
     });
     return valueToNameMapping;
 }
-exports.constructValueToNameMapping = constructValueToNameMapping;
-function getFilteredOptions(searchQuery, options) {
+export function getFilteredOptions(searchQuery, options) {
     return searchQuery === ''
         ? options
         : options.filter((option) => {
@@ -21,8 +14,7 @@ function getFilteredOptions(searchQuery, options) {
             return optionText.toLowerCase().includes(searchQuery.toLowerCase());
         });
 }
-exports.getFilteredOptions = getFilteredOptions;
-const getSelectButtonColors = (hasSelection, isDisabled, hasError = false) => {
+export const getSelectButtonColors = (hasSelection, isDisabled, hasError = false) => {
     return null;
     // return twMerge(
     //   isDisabled
@@ -42,7 +34,4 @@ const getSelectButtonColors = (hasSelection, isDisabled, hasError = false) => {
     //     : getColorClassNames(DEFAULT_COLOR, colorPalette.ring).borderColor
     // );
 };
-exports.getSelectButtonColors = getSelectButtonColors;
-const hasValue = (value) => value !== null && value !== undefined && value !== '';
-exports.hasValue = hasValue;
-//# sourceMappingURL=selectUtils.js.map
+export const hasValue = (value) => value !== null && value !== undefined && value !== '';

package/dist/contexts/BaseColorContext.js

@@ -1,6 +1,3 @@
-"use strict";
-Object.defineProperty(exports, "__esModule", { value: true });
-const react_1 = require("react");
-const BaseColorContext = (0, react_1.createContext)('blue');
-exports.default = BaseColorContext;
-//# sourceMappingURL=BaseColorContext.js.map
+import { createContext } from 'react';
+const BaseColorContext = createContext('blue');
+export default BaseColorContext;

package/dist/contexts/HoveredValueContext.js

@@ -1,8 +1,5 @@
-"use strict";
-Object.defineProperty(exports, "__esModule", { value: true });
-const react_1 = require("react");
-const HoveredValueContext = (0, react_1.createContext)({
+import { createContext } from 'react';
+const HoveredValueContext = createContext({
     hoveredValue: undefined,
 });
-exports.default = HoveredValueContext;
-//# sourceMappingURL=HoveredValueContext.js.map
+export default HoveredValueContext;

package/dist/contexts/RootStylesContext.js

@@ -1,6 +1,3 @@
-"use strict";
-Object.defineProperty(exports, "__esModule", { value: true });
-const react_1 = require("react");
-const RootStylesContext = (0, react_1.createContext)(undefined);
-exports.default = RootStylesContext;
-//# sourceMappingURL=RootStylesContext.js.map
+import { createContext } from 'react';
+const RootStylesContext = createContext(undefined);
+export default RootStylesContext;