@quillsql/react 2.10.31 → 2.10.32

package/dist/cjs/components/QuillCard.js

@@ -0,0 +1,56 @@
+"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: {
+            backgroundColor: theme.backgroundColor || 'white',
+            cursor: clickable ? 'pointer' : 'default',
+            padding: 16,
+            borderRadius: 8,
+            boxShadow: '0 1px 4px 0 rgba(56, 65, 81, 0.07)',
+            borderWidth: theme.borderWidth,
+            borderStyle: 'solid',
+            borderColor: isSelected ? '#aaaaaa' : theme.borderColor,
+            overflowX: 'hidden',
+            position: 'relative',
+            minHeight: minHeight,
+            ...style,
+        }, onClick: onClick, children: [(0, jsx_runtime_1.jsx)("style", { children: `
+        .quill-card-hover:hover {
+          background-color: #f9f9f9 !important;
+          .quill-delete-button {
+              background-color: #f9f9f9;
+          }
+          .quill-delete-button:hover {
+            background-color: #f5f5f5;
+          }
+        }
+      ` }), onClose && ((0, jsx_runtime_1.jsxs)("button", { className: "quill-delete-button", type: "button", onClick: e => {
+                    e.stopPropagation();
+                    onClose();
+                }, style: {
+                    height: 42,
+                    width: 42,
+                    top: 4,
+                    right: 4,
+                    // marginTop: -12,
+                    // marginRight: -12,
+                    position: 'absolute',
+                    cursor: 'pointer',
+                    border: 'none',
+                    display: 'flex',
+                    alignItems: 'center',
+                    justifyContent: 'center',
+                    borderRadius: 6,
+                    float: 'right',
+                }, children: [(0, jsx_runtime_1.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 })] }));
+}
+exports.QuillCard = QuillCard;

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

@@ -0,0 +1,3 @@
+import { SelectComponentProps } from './UiComponents';
+export declare function QuillSelectComponent({ options, value, onChange, theme, label, }: SelectComponentProps): import("react/jsx-runtime").JSX.Element;
+//# sourceMappingURL=QuillSelect.d.ts.map

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

@@ -0,0 +1 @@
+{"version":3,"file":"QuillSelect.d.ts","sourceRoot":"","sources":["../../../src/components/QuillSelect.tsx"],"names":[],"mappings":"AACA,OAAO,EAAE,oBAAoB,EAAE,MAAM,gBAAgB,CAAC;AAGtD,wBAAgB,oBAAoB,CAAC,EACnC,OAAO,EACP,KAAK,EACL,QAAQ,EACR,KAAK,EACL,KAAK,GACN,EAAE,oBAAoB,2CAgMtB"}

package/dist/cjs/components/QuillSelect.js

@@ -0,0 +1,128 @@
+"use strict";
+Object.defineProperty(exports, "__esModule", { value: true });
+exports.QuillSelectComponent = void 0;
+const jsx_runtime_1 = require("react/jsx-runtime");
+const hooks_1 = require("../hooks");
+const react_1 = require("react");
+function QuillSelectComponent({ options, value, onChange, theme, label, }) {
+    const [showModal, setShowModal] = (0, react_1.useState)(false);
+    const modalRef = (0, react_1.useRef)(null);
+    (0, hooks_1.useOnClickOutside)(modalRef, (e) => {
+        setShowModal(false);
+    });
+    return ((0, jsx_runtime_1.jsxs)("div", { style: { position: 'relative', width: 200, minWidth: 200 }, children: [label && ((0, jsx_runtime_1.jsx)("div", { style: {
+                    fontSize: 14,
+                    color: theme.primaryTextColor,
+                    fontFamily: theme.fontFamily,
+                    paddingBottom: 5,
+                    fontWeight: 600,
+                }, children: label })), (0, jsx_runtime_1.jsxs)("button", { style: {
+                    fontFamily: theme.fontFamily,
+                    color: theme.primaryTextColor,
+                    width: '100%',
+                    display: 'flex',
+                    alignItems: 'center',
+                    justifyContent: 'space-between',
+                    fontWeight: 'inherit',
+                    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), children: [(0, jsx_runtime_1.jsx)("style", { children: ` .quill-select-button { background: ${theme.backgroundColor}; } .quill-select-button:hover { background: ${theme.hoverBackgroundColor}; }` }), (0, jsx_runtime_1.jsx)("span", { style: {
+                            textOverflow: 'ellipsis',
+                            whiteSpace: 'nowrap',
+                            overflow: 'hidden',
+                        }, children: options.find((elem) => elem.value === value)?.label || 'Select' }), (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, jsx_runtime_1.jsxs)("div", { ref: modalRef, style: {
+                    position: 'absolute',
+                    width: '100%',
+                    display: 'flex',
+                    flexDirection: 'column',
+                    boxSizing: 'border-box',
+                    borderWidth: 1,
+                    borderStyle: 'solid',
+                    borderColor: theme.borderColor,
+                    borderRadius: 6,
+                    background: 'white',
+                    marginTop: 12,
+                    zIndex: 100,
+                    paddingTop: 6,
+                    paddingBottom: 6,
+                    paddingLeft: 6,
+                    paddingRight: 6,
+                    boxShadow: '0px 1px 12px 0px rgba(56, 65, 81, 0.1)',
+                    fontFamily: theme.fontFamily,
+                    maxHeight: '50vh',
+                    overflow: 'scroll',
+                }, children: [(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: () => {
+                            onChange('');
+                            setShowModal(false);
+                        }, children: [(0, jsx_runtime_1.jsx)("style", { children: `
+                .quill-option {
+                  background: white;
+                }
+                  .quill-option:hover {
+                    background: #F4F4F5;
+                  }
+                ` }), 'Select'] }), options.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: () => {
+                            onChange(option.value);
+                            setShowModal(false);
+                        }, children: [(0, jsx_runtime_1.jsx)("style", { children: `
+                .quill-option {
+                  background: white;
+                }
+                  .quill-option:hover {
+                    background: #F4F4F5;
+                  }
+                ` }), (0, jsx_runtime_1.jsx)("span", { style: {
+                                    textOverflow: 'ellipsis',
+                                    whiteSpace: 'nowrap',
+                                    overflow: 'hidden',
+                                }, children: option.label })] }, option.value)))] }))] }));
+}
+exports.QuillSelectComponent = QuillSelectComponent;

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

@@ -0,0 +1,3 @@
+import { TableComponentProps } from './UiComponents';
+export default function QuillTable({ rows, columns, loading, showDownloadCSVButton, downloadFileName, containerStyle, LoadingComponent, }: TableComponentProps): import("react/jsx-runtime").JSX.Element;
+//# sourceMappingURL=QuillTable.d.ts.map

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

@@ -0,0 +1 @@
+{"version":3,"file":"QuillTable.d.ts","sourceRoot":"","sources":["../../../src/components/QuillTable.tsx"],"names":[],"mappings":"AACA,OAAO,EAAkB,mBAAmB,EAAE,MAAM,gBAAgB,CAAC;AAKrE,MAAM,CAAC,OAAO,UAAU,UAAU,CAAC,EACjC,IAAI,EACJ,OAAO,EACP,OAAO,EACP,qBAAqB,EACrB,gBAAgB,EAChB,cAAc,EACd,gBAA2C,GAC5C,EAAE,mBAAmB,2CAmbrB"}

package/dist/cjs/components/QuillTable.js

@@ -0,0 +1,259 @@
+"use strict";
+Object.defineProperty(exports, "__esModule", { value: true });
+const jsx_runtime_1 = require("react/jsx-runtime");
+const react_1 = require("react");
+const UiComponents_1 = require("./UiComponents");
+const useExport_1 = require("../hooks/useExport");
+const valueFormatter_1 = require("../utils/valueFormatter");
+const Context_1 = require("../Context");
+function QuillTable({ rows, columns, loading, showDownloadCSVButton, downloadFileName, containerStyle, LoadingComponent = () => (0, jsx_runtime_1.jsx)(UiComponents_1.LoadingSpinner, {}), }) {
+    const [activeRows, setActiveRows] = (0, react_1.useState)([]);
+    const [page, setPage] = (0, react_1.useState)(1);
+    const [maxPage, setMaxPage] = (0, react_1.useState)(1);
+    const [sortColumn, setSortColumn] = (0, react_1.useState)(null);
+    const [sortDirection, setSortDirection] = (0, react_1.useState)('desc');
+    const [theme] = (0, react_1.useContext)(Context_1.ThemeContext);
+    const [isFormatting, setIsFormatting] = (0, react_1.useState)(false);
+    const formattedRows = (0, react_1.useMemo)(() => {
+        setIsFormatting(true);
+        if (!rows || !columns) {
+            setIsFormatting(false);
+            return [];
+        }
+        return rows.map((row) => {
+            return columns.reduce((formattedRow, column) => {
+                // Apply the format function to each field in the row
+                const formattedValue = (0, valueFormatter_1.quillFormat)({
+                    value: row[column.field],
+                    format: column.format,
+                });
+                formattedRow[column.field] = formattedValue;
+                return formattedRow;
+            }, {});
+        });
+    }, [rows]);
+    const { downloadCSV } = (0, useExport_1.useExport)({
+        rows: formattedRows,
+        fields: columns,
+        name: downloadFileName,
+    });
+    (0, react_1.useEffect)(() => {
+        const sortedRows = [...formattedRows];
+        if (sortColumn) {
+            sortedRows.sort((a, b) => {
+                const result = (0, valueFormatter_1.compareValues)(a, b, sortColumn);
+                return sortDirection === 'asc' ? result : -result;
+            });
+        }
+        const start = (page - 1) * 10;
+        const end = page * 10;
+        if (sortedRows && sortedRows.length) {
+            setMaxPage(Math.ceil(sortedRows.length / 10));
+        }
+        setActiveRows(sortedRows.slice(start, end));
+        setIsFormatting(false);
+    }, [page, formattedRows, sortColumn, sortDirection]);
+    const increasePage = () => {
+        if (page === maxPage) {
+            return;
+        }
+        setPage((page) => page + 1);
+    };
+    const decreasePage = () => {
+        if (page === 1) {
+            return;
+        }
+        setPage((page) => page - 1);
+    };
+    const toggleSort = (column) => {
+        if (sortColumn === column.field) {
+            setSortDirection(sortDirection === 'asc' ? 'desc' : 'asc');
+        }
+        else {
+            setSortColumn(column.field);
+            setSortDirection('desc');
+        }
+    };
+    if (loading || isFormatting) {
+        return ((0, jsx_runtime_1.jsx)("div", { style: {
+                height: '100%',
+                width: '100%',
+                display: 'flex',
+                flexDirection: 'column',
+                justifyContent: 'center',
+                alignItems: 'center',
+                ...containerStyle,
+            }, children: (0, jsx_runtime_1.jsx)(LoadingComponent, {}) }));
+    }
+    return ((0, jsx_runtime_1.jsxs)("div", { style: {
+            width: '100%',
+            height: '100%',
+            overflow: 'visible',
+            display: 'flex',
+            flexDirection: 'column',
+            ...containerStyle,
+        }, children: [(0, jsx_runtime_1.jsx)("div", { style: {
+                    height: '100%',
+                    width: '100%',
+                    overflow: 'auto',
+                    borderRadius: 6,
+                    border: '1px solid rgb(229, 231, 235)',
+                    padding: 0,
+                    margin: 0,
+                    boxSizing: 'border-box',
+                    outline: 'none',
+                }, children: (0, jsx_runtime_1.jsxs)("div", { role: "table", className: "table", style: { minWidth: '0px', width: '100%', height: '100%' }, children: [(0, jsx_runtime_1.jsx)("div", { className: "thead", children: (0, jsx_runtime_1.jsx)("div", { role: "row", className: "tr", style: {
+                                    display: 'flex',
+                                    flex: '1 0 auto',
+                                    minWidth: '100px',
+                                    boxSizing: 'border-box',
+                                }, children: columns && columns.map((column, index) => ((0, jsx_runtime_1.jsxs)("div", { onClick: () => toggleSort(column), style: {
+                                        boxSizing: 'border-box',
+                                        flex: '150 0 auto',
+                                        minWidth: '50px',
+                                        width: '150px',
+                                        position: 'relative',
+                                        cursor: 'pointer',
+                                        background: 'rgb(249, 250, 251)',
+                                        borderRight: index + 1 === columns.length
+                                            ? '0px solid rgb(229, 231, 235)'
+                                            : '1px solid rgb(229, 231, 235)',
+                                        borderBottom: '1px solid rgb(229, 231, 235)',
+                                        whiteSpace: 'nowrap',
+                                        alignItems: 'center',
+                                        overflowX: 'visible',
+                                        margin: '0px',
+                                        textOverflow: 'ellipsis',
+                                        minHeight: '36px',
+                                        userSelect: 'none',
+                                        paddingLeft: 16,
+                                        paddingRight: 16,
+                                        display: 'flex',
+                                        flexDirection: 'row',
+                                        justifyContent: 'space-between',
+                                    }, children: [(0, jsx_runtime_1.jsx)("div", { "aria-haspopup": "dialog", "aria-expanded": "false", "aria-controls": "mantine-r6-dropdown", style: {
+                                                // fontFamily:
+                                                //   'Inter, -apple-system, BlinkMacSystemFont, "Segoe UI", Roboto, Helvetica, Arial, sans-serif, "Apple Color Emoji", "Segoe UI Emoji"',
+                                                WebkitTapHighlightColor: 'transparent',
+                                                fontFamily: theme?.fontFamily,
+                                                // color: 'rgb(55, 65, 81)',
+                                                color: theme?.primaryTextColor,
+                                                textDecoration: 'none',
+                                                fontSize: theme?.fontSizeSmall || '14px',
+                                                fontWeight: theme?.fontWeightMedium || '500',
+                                                lineHeight: '20px', // 1.25rem * 16px = 20px
+                                                textOverflow: 'ellipsis',
+                                                whiteSpace: 'nowrap',
+                                                overflow: 'hidden',
+                                            }, children: column.label || column.field }), column.field === sortColumn && ((0, jsx_runtime_1.jsx)("svg", { xmlns: "http://www.w3.org/2000/svg", viewBox: "0 0 20 20", fill: theme?.primaryTextColor, height: "14px", width: "14px", style: {
+                                                transform: sortDirection === 'desc'
+                                                    ? 'rotate(180deg)'
+                                                    : undefined,
+                                            }, children: (0, jsx_runtime_1.jsx)("path", { fillRule: "evenodd", d: "M10 3a.75.75 0 01.75.75v10.638l3.96-4.158a.75.75 0 111.08 1.04l-5.25 5.5a.75.75 0 01-1.08 0l-5.25-5.5a.75.75 0 111.08-1.04l3.96 4.158V3.75A.75.75 0 0110 3z", clipRule: "evenodd" }) }))] }, 'sqlcol' + index))) }) }), (activeRows && activeRows.length === 0) || (columns && columns.length === 0) ? ((0, jsx_runtime_1.jsx)("div", { style: {
+                                paddingTop: '60px',
+                                display: 'flex',
+                                flex: '1 0 auto',
+                                margin: 'auto',
+                                justifyContent: 'center',
+                                alignItems: 'center',
+                                fontSize: 13,
+                                color: theme?.secondaryTextColor || 'rgb(55, 65, 81)',
+                            }, children: "No results returned." })) : ((0, jsx_runtime_1.jsx)("div", { role: "rowgroup", className: "tbody", children: activeRows && activeRows.map((row, rowIndex) => ((0, jsx_runtime_1.jsx)("div", { role: "row", className: "tr", style: {
+                                    display: 'flex',
+                                    flex: '1 0 auto',
+                                    minWidth: '100px',
+                                    boxSizing: 'border-box',
+                                }, children: columns.map((column, columnIndex) => ((0, jsx_runtime_1.jsx)("div", { role: "cell", style: {
+                                        boxSizing: 'border-box',
+                                        flex: '150 0 auto',
+                                        minWidth: '50px',
+                                        width: '150px',
+                                        display: 'flex',
+                                        margin: '0px',
+                                        textOverflow: 'ellipsis',
+                                        minHeight: '36px',
+                                        borderRight: columnIndex + 1 === columns.length
+                                            ? '0px solid rgb(229, 231, 235)'
+                                            : '1px solid rgb(229, 231, 235)',
+                                        overflow: 'hidden',
+                                        borderTop: rowIndex > 0
+                                            ? '1px solid rgb(229, 231, 235)'
+                                            : undefined,
+                                        borderBottom: rowIndex === rows.length - 1
+                                            ? '1px solid rgb(229, 231, 235)'
+                                            : undefined,
+                                        userSelect: 'none',
+                                    }, children: (0, jsx_runtime_1.jsx)("div", { style: {
+                                            lineHeight: '24px',
+                                            width: '100%',
+                                            display: 'flex',
+                                            cursor: 'default',
+                                            position: 'relative',
+                                            userSelect: 'none',
+                                        }, "data-testid": "static-cell", children: (0, jsx_runtime_1.jsx)("div", { "aria-haspopup": "dialog", "aria-expanded": "false", style: {
+                                                fontFamily: theme?.fontFamily ||
+                                                    'Inter, -apple-system, BlinkMacSystemFont, "Segoe UI", Roboto, Helvetica, Arial, sans-serif, "Apple Color Emoji", "Segoe UI Emoji"',
+                                                WebkitTapHighlightColor: 'transparent',
+                                                // color: 'rgb(55, 65, 81)',
+                                                color: theme?.secondaryTextColor || 'rgb(55, 65, 81)',
+                                                textDecoration: 'none',
+                                                fontWeight: 400,
+                                                fontSize: theme?.fontSizeSmall || '14px',
+                                                lineHeight: '20px',
+                                                textOverflow: 'ellipsis',
+                                                whiteSpace: 'nowrap',
+                                                overflow: 'hidden',
+                                                padding: '8px 16px',
+                                                userSelect: 'none',
+                                            }, children: row[column.field] }) }) }, 'sqlcell' + columnIndex))) }, 'sqlrow' + rowIndex))) }))] }) }), (0, jsx_runtime_1.jsx)("div", { style: { position: 'relative' }, children: (0, jsx_runtime_1.jsx)("div", { style: {
+                        display: 'flex',
+                        flex: '1 0 auto',
+                        minWidth: '100px',
+                        boxSizing: 'border-box',
+                        position: 'absolute',
+                        bottom: 0,
+                        left: 0,
+                        right: 0,
+                        height: 38,
+                        background: '#F9FAFB',
+                        borderRight: '1px solid rgb(229, 231, 235)',
+                        borderLeft: '1px solid rgb(229, 231, 235)',
+                        borderBottom: '1px solid rgb(229, 231, 235)',
+                        borderTop: '1px solid rgb(229, 231, 235)',
+                        borderBottomRightRadius: 6,
+                        borderBottomLeftRadius: 6,
+                        width: '100%',
+                    }, children: (0, jsx_runtime_1.jsxs)("div", { style: {
+                            display: 'flex',
+                            flexDirection: 'row',
+                            alignItems: 'center',
+                            justifyContent: 'space-between',
+                            width: '100%',
+                        }, children: [showDownloadCSVButton ? ((0, jsx_runtime_1.jsx)("button", { onClick: downloadCSV, style: {
+                                    fontSize: 14,
+                                    paddingLeft: 12,
+                                    fontFamily: theme?.fontFamily,
+                                    color: theme?.primaryTextColor,
+                                    background: 'transparent',
+                                    fontWeight: 500,
+                                    cursor: 'pointer',
+                                    border: 'none',
+                                }, children: "Download CSV" })) : ((0, jsx_runtime_1.jsx)("div", {})), (0, jsx_runtime_1.jsxs)("div", { style: {
+                                    display: 'flex',
+                                    flexDirection: 'row',
+                                    alignItems: 'center',
+                                }, children: [(0, jsx_runtime_1.jsxs)("div", { style: {
+                                            fontSize: 12,
+                                            fontFamily: theme?.fontFamily,
+                                            color: theme?.primaryTextColor,
+                                        }, children: [page, ' of ', maxPage] }), (0, jsx_runtime_1.jsx)("div", { style: { width: 8 } }), (0, jsx_runtime_1.jsx)("button", { onClick: decreasePage, style: {
+                                            cursor: 'pointer',
+                                            border: 'none',
+                                            background: 'transparent',
+                                        }, children: (0, jsx_runtime_1.jsx)("svg", { xmlns: "http://www.w3.org/2000/svg", viewBox: "0 0 20 20", fill: theme?.chartLabelFontFamily || theme?.fontFamily, height: "16px", width: "16px", children: (0, jsx_runtime_1.jsx)("path", { fillRule: "evenodd", d: "M12.79 5.23a.75.75 0 01-.02 1.06L8.832 10l3.938 3.71a.75.75 0 11-1.04 1.08l-4.5-4.25a.75.75 0 010-1.08l4.5-4.25a.75.75 0 011.06.02z", clipRule: "evenodd" }) }) }), (0, jsx_runtime_1.jsx)("button", { onClick: increasePage, style: {
+                                            cursor: 'pointer',
+                                            border: 'none',
+                                            background: 'transparent',
+                                        }, children: (0, jsx_runtime_1.jsx)("svg", { xmlns: "http://www.w3.org/2000/svg", viewBox: "0 0 20 20", fill: theme?.chartLabelFontFamily || theme?.fontFamily, height: "16px", width: "16px", children: (0, jsx_runtime_1.jsx)("path", { fillRule: "evenodd", d: "M7.21 14.77a.75.75 0 01.02-1.06L11.168 10 7.23 6.29a.75.75 0 111.04-1.08l4.5 4.25a.75.75 0 010 1.08l-4.5 4.25a.75.75 0 01-1.06-.02z", clipRule: "evenodd" }) }) }), (0, jsx_runtime_1.jsx)("div", { style: { width: 12 } })] })] }) }) })] }));
+}
+exports.default = QuillTable;

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

@@ -0,0 +1,130 @@
+import React from 'react';
+export interface Option {
+    value: string;
+    label: string;
+}
+export interface SelectComponentProps {
+    onChange: (value: string) => void;
+    value: string;
+    options: Option[];
+    disabled?: boolean;
+    label?: string;
+    theme: any;
+}
+export interface TextInputComponentProps {
+    onChange: (e: any) => void;
+    value: string;
+    id: string;
+    placeholder: string;
+    width?: string;
+}
+export interface ButtonComponentProps {
+    onClick: () => void;
+    label: string;
+    primary?: boolean;
+    width?: string;
+}
+export interface TableComponentProps {
+    rows: any[];
+    columns: any[];
+    containerStyle?: React.CSSProperties;
+    loading?: boolean;
+    showDownloadCSVButton?: boolean;
+    downloadFileName?: string;
+    LoadingComponent?: () => JSX.Element;
+    DownloadCSVButtonComponent?: (props: ButtonComponentProps) => JSX.Element;
+}
+export interface TextInputComponentProps {
+    onChange: (e: any) => void;
+    value: string;
+    id: string;
+}
+export interface ModalComponentProps {
+    children: any;
+    isOpen: boolean;
+    onClose?: () => void;
+    title?: string;
+    setIsOpen: (isOpen: boolean) => void;
+    theme?: any;
+}
+export interface HeaderProps {
+    children: any;
+}
+export interface LabelProps {
+    children: any;
+}
+export interface TextProps {
+    children: any;
+}
+export interface DeleteButtonProps {
+    onClick: () => void;
+    style: any;
+}
+export declare const MemoizedTextInput: ({ value, onChange, placeholder, id }: {
+    value: any;
+    onChange: any;
+    placeholder: any;
+    id: any;
+}) => import("react/jsx-runtime").JSX.Element;
+export declare const MemoizedButton: ({ label, onClick, primary }: {
+    label: any;
+    onClick: any;
+    primary?: boolean | undefined;
+}) => import("react/jsx-runtime").JSX.Element;
+export declare const MemoizedSecondaryButton: ({ label, onClick }: {
+    label: any;
+    onClick: any;
+}) => import("react/jsx-runtime").JSX.Element;
+export declare const MemoizedSelect: ({ value, onChange, options, disabled, label, }: {
+    value: any;
+    onChange: any;
+    options: any;
+    disabled?: boolean | undefined;
+    label: any;
+}) => import("react/jsx-runtime").JSX.Element;
+export declare const MemoizedHeader: ({ children }: {
+    children: any;
+}) => import("react/jsx-runtime").JSX.Element;
+export declare const MemoizedLabel: ({ children }: {
+    children: any;
+}) => import("react/jsx-runtime").JSX.Element;
+export declare const MemoizedText: ({ children }: {
+    children: any;
+}) => import("react/jsx-runtime").JSX.Element;
+export interface PopoverComponentProps {
+    children: any;
+    onClose?: () => void;
+    parentRef?: any;
+    style?: any;
+    onClick?: () => void;
+    showTrigger?: boolean;
+    isOpen: boolean;
+    setIsOpen: (isOpen: boolean) => void;
+}
+export declare function MemoizedPopover({ onClose, parentRef, children, style, onClick, label, showTrigger, isOpen, setIsOpen, }: {
+    onClose: any;
+    parentRef: any;
+    children: any;
+    style?: {} | undefined;
+    onClick: any;
+    label: any;
+    showTrigger?: boolean | undefined;
+    isOpen: any;
+    setIsOpen: any;
+}): import("react/jsx-runtime").JSX.Element;
+export declare function MemoizedModal({ isOpen, onClose, setIsOpen, title, children, theme, }: {
+    isOpen: any;
+    onClose: any;
+    setIsOpen: any;
+    title: any;
+    children: any;
+    theme: any;
+}): import("react/jsx-runtime").JSX.Element | null;
+export declare const MemoizedDeleteButton: ({ onClick, style }: {
+    onClick: any;
+    style: any;
+}) => import("react/jsx-runtime").JSX.Element;
+export declare const LoadingSpinner: ({ ...props }: {
+    [x: string]: any;
+}) => import("react/jsx-runtime").JSX.Element;
+//# sourceMappingURL=UiComponents.d.ts.map

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

@@ -0,0 +1 @@
+{"version":3,"file":"UiComponents.d.ts","sourceRoot":"","sources":["../../../src/components/UiComponents.tsx"],"names":[],"mappings":"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"}