@quillsql/react 2.12.37 → 2.12.38

package/dist/esm/components/ReportBuilder/ui.js

@@ -0,0 +1,382 @@
+import { jsx as _jsx, jsxs as _jsxs, Fragment as _Fragment } from "react/jsx-runtime";
+import { forwardRef, useContext, useEffect, useState } from 'react';
+import { MemoizedCheckbox, LoadingSpinner, MemoizedPopover, } from '../UiComponents';
+import MemoizedQuillTable from '../QuillTable';
+import { ThemeContext } from '../../Context';
+import { isNodeEmptyCollection, allNumericNodesValidInTree } from './util';
+import { downloadCSV } from '../../utils/csv';
+import { useTheme } from '../../hooks';
+/**
+ * This file is a collection of basic UI components that conform to the shape
+ * expected by the Report Builder. Where possible, we use our existing
+ * components and wrap them in a thin shim to make the interface match if
+ * needed.
+ */
+export const QuillButton = ({ children, ...props }) => {
+    const [theme] = useContext(ThemeContext);
+    return (_jsx("button", { ...props, style: {
+            borderRadius: '6px',
+            backgroundColor: '#000000',
+            opacity: 1,
+            paddingLeft: '16px',
+            paddingRight: '16px',
+            fontSize: '14px',
+            fontWeight: 600,
+            color: '#FFFFFF',
+            cursor: 'pointer',
+            outline: 'none',
+            border: 'none',
+            fontFamily: theme?.fontFamily,
+            height: 38,
+            whiteSpace: 'nowrap',
+            ...props.style,
+        }, children: children }));
+};
+export const QuillSecondaryButton = ({ children, ...props }) => {
+    const [theme] = useContext(ThemeContext);
+    return (_jsx("button", { ...props, style: {
+            borderRadius: '6px',
+            backgroundColor: theme?.secondaryButtonColor || '#F5F5F5',
+            opacity: 1,
+            paddingLeft: '16px',
+            paddingRight: '16px',
+            fontSize: '14px',
+            fontWeight: 600,
+            color: theme?.primaryTextColor,
+            cursor: 'pointer',
+            outline: 'none',
+            border: 'none',
+            fontFamily: theme?.fontFamily,
+            height: 38,
+            whiteSpace: 'nowrap',
+            ...props.style,
+        }, children: children }));
+};
+// TODO: remove this, I think it is unused.
+export const QuillReportBuilderTable = ({ rows, columns, error, ...props }) => {
+    const reformattedColumns = columns.map((c) => ({ label: c, field: c }));
+    return (_jsx("div", { style: { height: '100%', overflow: 'auto' }, children: _jsx(MemoizedQuillTable, { rows: rows, columns: reformattedColumns, rowsPerPage: 10, hideCSVDownloadButton: rows?.length > 0, downloadCSV: () => downloadCSV({ rows, fields: reformattedColumns, name: 'my_report' }), emptyStateLabel: error || 'No results', ...props }) }));
+};
+export const QuillTag = forwardRef(({ label, onClick, children, onClickDelete, hideDelete = false }, forwardedRef) => {
+    const [theme] = useContext(ThemeContext);
+    return (_jsxs("div", { style: {
+            boxShadow: '0px 1px 4px #E7E7E705',
+            border: '1px solid #E7E7E7',
+            borderRadius: 6,
+            paddingLeft: 8,
+            display: 'flex',
+            minHeight: 30,
+            flexDirection: 'row',
+            width: '100%',
+            alignItems: 'center',
+            backgroundColor: theme?.backgroundColor || 'white',
+            fontFamily: theme?.fontFamily,
+            fontSize: 14,
+            whiteSpace: 'nowrap',
+            textOverflow: 'ellipsis',
+            maxWidth: '100%',
+        }, ref: forwardedRef, onClick: onClick, children: [_jsx("div", { style: {
+                    alignItems: 'center',
+                    fontFamily: theme?.fontFamily,
+                    fontSize: 14,
+                    whiteSpace: 'nowrap',
+                    textOverflow: 'ellipsis',
+                    maxWidth: '90%',
+                    overflow: 'hidden',
+                }, children: label ?? children }), !hideDelete && (_jsx("div", { style: {
+                    marginLeft: 'auto',
+                    marginRight: '8px',
+                    display: 'flex',
+                    flexDirection: 'column',
+                    justifyContent: 'center',
+                }, children: _jsx("button", { onClick: onClickDelete, style: {
+                        margin: -4,
+                        border: 'none',
+                        backgroundColor: theme?.backgroundColor || 'white',
+                        fontFamily: theme?.fontFamily,
+                    }, children: _jsx("svg", { xmlns: "http://www.w3.org/2000/svg", viewBox: "0 0 20 20", fill: theme?.secondaryButtonColor || 'currentColor', style: { width: 16, height: 16 }, children: _jsx("path", { d: "M6.28 5.22a.75.75 0 0 0-1.06 1.06L8.94 10l-3.72 3.72a.75.75 0 1 0 1.06 1.06L10 11.06l3.72 3.72a.75.75 0 1 0 1.06-1.06L11.06 10l3.72-3.72a.75.75 0 0 0-1.06-1.06L10 8.94 6.28 5.22Z" }) }) }) }))] }));
+});
+// A heading element in the sidebar (eg. "Filters")
+export const QuillSidebarHeading = ({ label, }) => {
+    const theme = useTheme();
+    return (_jsx("h1", { style: {
+            fontSize: 16,
+            fontWeight: 600,
+            fontFamily: theme?.fontFamily,
+            color: theme?.primaryTextColor || '#384151',
+            userSelect: 'none',
+            margin: 0,
+            paddingBottom: 4,
+        }, children: label }));
+};
+// The gray thing on the left.
+export const QuillSidebar = ({ children }) => (_jsx("div", { style: {
+        overflowX: 'visible',
+        padding: '12px',
+        width: '25%',
+        height: '100%',
+        maxWidth: '300px',
+        boxSizing: 'border-box',
+        display: 'flex',
+        flexDirection: 'column',
+        gap: 28,
+        alignItems: 'flex-start',
+    }, children: children }));
+// A big wrapper around the main content (ie. Input, Button, and Table)
+export const CustomContainer = ({ children }) => (_jsx("div", { style: {
+        position: 'sticky',
+        top: 0,
+        display: 'flex',
+        flexDirection: 'column',
+        gap: '12px',
+        borderLeftStyle: 'solid',
+        borderLeftWidth: '1px',
+        borderColor: '#E7E7E7',
+        overflowY: 'auto',
+        padding: '1rem',
+        flexGrow: 1,
+        width: '75%',
+        height: '100%',
+        boxSizing: 'border-box',
+    }, children: children }));
+// The six-dot grab-handle icon.
+export const QuillHandleButton = () => {
+    return (_jsxs("div", { style: {
+            display: 'flex',
+            gap: 2,
+            flexDirection: 'row',
+            paddingTop: 8,
+            paddingBottom: 8,
+            paddingLeft: 8,
+            paddingRight: 8,
+            borderRadius: 4,
+        }, className: "handle", children: [_jsx("style", { children: `.handle{background:white;} .handle:hover{background:rgba(0,0,0,0.03);}` }), _jsxs("div", { style: { display: 'flex', gap: 2, flexDirection: 'column' }, children: [_jsx("div", { style: {
+                            width: 3,
+                            height: 3,
+                            borderRadius: 3,
+                            background: '#9CA0A7',
+                        } }), _jsx("div", { style: {
+                            width: 3,
+                            height: 3,
+                            borderRadius: 3,
+                            background: '#9CA0A7',
+                        } }), _jsx("div", { style: {
+                            width: 3,
+                            height: 3,
+                            borderRadius: 3,
+                            background: '#9CA0A7',
+                        } })] }), _jsxs("div", { style: { display: 'flex', gap: 2, flexDirection: 'column' }, children: [_jsx("div", { style: {
+                            width: 3,
+                            height: 3,
+                            borderRadius: 3,
+                            background: '#9CA0A7',
+                        } }), _jsx("div", { style: {
+                            width: 3,
+                            height: 3,
+                            borderRadius: 3,
+                            background: '#9CA0A7',
+                        } }), _jsx("div", { style: {
+                            width: 3,
+                            height: 3,
+                            borderRadius: 3,
+                            background: '#9CA0A7',
+                        } })] })] }));
+};
+export const QuillSelectColumn = ({ label, isSelected, setSelected, DragHandle, }) => {
+    const [theme] = useContext(ThemeContext);
+    return (_jsxs("div", { title: label, style: {
+            boxShadow: '0px 1px 4px #E7E7E705',
+            paddingTop: 4,
+            paddingBottom: 4,
+            paddingLeft: 5,
+            border: '1px solid #E7E7E7',
+            borderRadius: 4,
+            display: 'flex',
+            alignItems: 'center',
+            backgroundColor: theme?.backgroundColor || 'white',
+            whiteSpace: 'nowrap',
+            textOverflow: 'ellipsis',
+            overflow: 'hidden',
+        }, children: [_jsx(DragHandle, { dragIcon: QuillHandleButton }), _jsx(MemoizedCheckbox, { isChecked: isSelected, label: label, onChange: () => setSelected() })] }));
+};
+/**
+ * A draggable card with a grab-handle and a column name
+ */
+export const QuillDraggableColumn = ({ label, onDelete, DragHandle, }) => {
+    const [theme] = useContext(ThemeContext);
+    return (_jsxs("div", { style: {
+            boxShadow: '0px 1px 4px #E7E7E705',
+            border: '1px solid #E7E7E7',
+            borderRadius: 6,
+            display: 'flex',
+            alignItems: 'center',
+            backgroundColor: theme?.backgroundColor || 'white',
+        }, children: [_jsx(DragHandle, { dragIcon: QuillHandleButton }), _jsx("div", { style: {
+                    marginLeft: 2,
+                    marginRight: 'auto',
+                    fontSize: 14,
+                    display: 'block',
+                    whiteSpace: 'nowrap',
+                    textOverflow: 'ellipsis',
+                    overflow: 'hidden',
+                    fontFamily: theme?.fontFamily,
+                }, children: label }), _jsx("button", { onClick: onDelete, style: {
+                    paddingRight: 4,
+                    fontFamily: theme?.fontFamily,
+                    backgroundColor: theme?.backgroundColor || 'white',
+                    border: 'none',
+                    outline: 'none',
+                }, children: _jsx("svg", { xmlns: "http://www.w3.org/2000/svg", viewBox: "0 0 20 20", fill: theme?.secondaryButtonColor || 'currentColor', style: { width: 16, height: 16 }, children: _jsx("path", { d: "M6.28 5.22a.75.75 0 0 0-1.06 1.06L8.94 10l-3.72 3.72a.75.75 0 1 0 1.06 1.06L10 11.06l3.72 3.72a.75.75 0 1 0 1.06-1.06L11.06 10l3.72-3.72a.75.75 0 0 0-1.06-1.06L10 8.94 6.28 5.22Z" }) }) })] }));
+};
+// Three dots animated bouncing
+export const QuillButtonLoadingState = () => {
+    return (_jsx(QuillButton, { children: _jsx(LoadingSpinner, {}) }));
+};
+// Loading state for the table
+export const QuillTableLoadingState = () => {
+    return (_jsx("div", { style: { display: 'flex', flexDirection: 'column', margin: 'auto' }, children: _jsx(LoadingSpinner, {}) }));
+};
+export const EditPopover = ({ onSave, onDelete, Button, SecondaryButton, renderNode, activeEditItem, }) => {
+    const handleOnClick = () => {
+        if (!allNumericNodesValidInTree(activeEditItem)) {
+            alert('Please input a number.');
+            return;
+        }
+        onSave();
+    };
+    return (_jsxs("div", { style: {
+            display: 'flex',
+            flexDirection: 'column',
+            gap: 12,
+        }, children: [activeEditItem && renderNode(activeEditItem), _jsxs("div", { style: {
+                    display: 'flex',
+                    flexDirection: 'row',
+                    justifyContent: 'end',
+                    gap: 8,
+                    width: '100%',
+                }, children: [_jsx(SecondaryButton, { onClick: onDelete, label: "Delete" }), _jsx(Button, { onClick: handleOnClick, label: "Save" })] })] }));
+};
+export const QuillFilterPopover = ({ filterLabel, onClickDelete, popoverTitle, popoverChildren, isOpen, setIsOpen, }) => {
+    const handleSetIsOpen = (isOpen) => {
+        setIsOpen(isOpen);
+    };
+    return (_jsxs("div", { style: { position: 'relative' }, children: [_jsx(QuillTag, { label: filterLabel, onClickDelete: onClickDelete, onClick: () => setIsOpen(!isOpen) }), _jsx(MemoizedPopover, { isOpen: isOpen, setIsOpen: handleSetIsOpen, popoverTitle: popoverTitle, popoverChildren: popoverChildren })] }));
+};
+export const QuillSortPopover = ({ sortLabel, onClickDelete, popoverTitle, popoverChildren, isOpen, setIsOpen, }) => {
+    return (_jsxs(_Fragment, { children: [_jsx(QuillTag, { label: sortLabel, onClickDelete: onClickDelete, onClick: () => {
+                    setIsOpen(!isOpen);
+                } }), _jsx(MemoizedPopover, { isOpen: isOpen, popoverTitle: popoverTitle, setIsOpen: setIsOpen, popoverChildren: popoverChildren })] }));
+};
+export const QuillLimitPopover = ({ limitLabel, onClickDelete, popoverTitle, popoverChildren, isOpen, setIsOpen, }) => {
+    return (_jsxs(_Fragment, { children: [_jsx(QuillTag, { label: limitLabel, onClickDelete: onClickDelete, onClick: () => {
+                    setIsOpen(!isOpen);
+                } }), _jsx(MemoizedPopover, { isOpen: isOpen, popoverTitle: popoverTitle, setIsOpen: setIsOpen, popoverChildren: popoverChildren })] }));
+};
+export const TagWrapper = ({ isCard, isRow, editPopoverKey, keyPrefix, formData, activeEditItem, setEditPopoverKey, setActiveEditItem, setActivePath, setOpenPopover, setIsPending, clearCheckboxes, handleDelete, setCheckboxes, handleReplaceSubtree, FilterPopover, getByKey, EditPopover, Button, SecondaryButton, renderNode, children, }) => {
+    const [isOpen, setIsOpen] = useState(false);
+    const onOpen = () => {
+        setActiveEditItem(getByKey(formData, keyPrefix));
+        setActivePath(keyPrefix);
+        setIsPending(true);
+        setEditPopoverKey(keyPrefix);
+        setCheckboxes(getByKey(formData, keyPrefix));
+    };
+    const onClose = () => {
+        setEditPopoverKey(null);
+        setIsPending(false);
+        setOpenPopover(null);
+        setActivePath(null);
+        setTimeout(() => {
+            clearCheckboxes();
+            setActiveEditItem(null);
+        }, 300);
+    };
+    useEffect(() => {
+        if (isOpen) {
+            onOpen();
+        }
+        else {
+            onClose();
+        }
+    }, [isOpen]);
+    if (isCard && isRow) {
+        const handleClickDelete = (e) => {
+            e.stopPropagation(); // don't call onClick handler
+            setOpenPopover(null);
+            setIsPending(false);
+            setActiveEditItem(null);
+            setActivePath(null);
+            setEditPopoverKey(null);
+            handleDelete(keyPrefix);
+            setIsOpen(false);
+            clearCheckboxes();
+        };
+        return (_jsx("div", { style: { width: '100%' }, children: _jsx(FilterPopover, { isOpen: editPopoverKey === keyPrefix, popoverTitle: "Edit Filter", filterLabel: children, onClickDelete: handleClickDelete, setIsOpen: setIsOpen, popoverChildren: _jsx(EditPopover, { Button: Button, SecondaryButton: SecondaryButton, renderNode: renderNode, activeEditItem: activeEditItem, onSave: () => {
+                        if (isNodeEmptyCollection(activeEditItem)) {
+                            setOpenPopover(null);
+                            setIsPending(false);
+                            setActivePath(null);
+                            setEditPopoverKey(null);
+                            handleDelete(keyPrefix);
+                            setIsOpen(false);
+                            setTimeout(() => {
+                                setActiveEditItem(null);
+                                clearCheckboxes();
+                            }, 300);
+                        }
+                        else {
+                            setOpenPopover(null);
+                            setActivePath(null);
+                            setIsOpen(false);
+                            setEditPopoverKey(null);
+                            setIsPending(false);
+                            handleReplaceSubtree(keyPrefix, activeEditItem, false);
+                            setTimeout(() => {
+                                setActiveEditItem(null);
+                                clearCheckboxes();
+                            }, 300);
+                        }
+                    }, onDelete: () => {
+                        setOpenPopover(null);
+                        setActivePath(null);
+                        setEditPopoverKey(null);
+                        setIsOpen(false);
+                        handleDelete(keyPrefix);
+                        setTimeout(() => {
+                            setIsPending(false);
+                            setActiveEditItem(null);
+                            clearCheckboxes();
+                        }, 300);
+                    } }) }) })); // Make sure to close the <Tag> correctly
+    }
+    else if (isRow) {
+        return _jsx("div", { children: children });
+    }
+    else {
+        return _jsx(_Fragment, { children: children });
+    }
+};
+export const AddFilterPopover = ({ onSave, Button, renderNode, activeEditItem, }) => {
+    const handleOnClick = () => {
+        if (!allNumericNodesValidInTree(activeEditItem)) {
+            alert('Please input a number.');
+            return;
+        }
+        onSave();
+    };
+    return (_jsxs("div", { style: { display: 'flex', flexDirection: 'column', gap: 12 }, children: [activeEditItem && renderNode(activeEditItem), _jsx("div", { style: {
+                    display: 'flex',
+                    flexDirection: 'row',
+                    justifyContent: 'end',
+                }, children: _jsx(Button, { onClick: handleOnClick, label: 'Add filter' }) })] }));
+};
+export const FilterPopoverWrapper = ({ schema, filter, filterLabel, index, FilterTagComponent, FilterModal, fieldValuesMap, customOperatorOptions, ButtonComponent, SecondaryButtonComponent, SelectComponent, TextInputComponent, MultiSelectComponent, handleFilterDelete, handleFilterSave, containerStyle, }) => {
+    const [isOpen, setIsOpen] = useState(false);
+    function handleClickDelete() {
+        handleFilterDelete(index);
+    }
+    return (_jsx("div", { style: containerStyle, children: _jsx(FilterTagComponent, { isOpen: isOpen, popoverTitle: "Edit Filter", filterLabel: filterLabel, onClickDelete: handleClickDelete, setIsOpen: setIsOpen, popoverChildren: _jsx(FilterModal, { schema: schema, filter: filter, fieldValuesMap: fieldValuesMap, customOperatorOptions: customOperatorOptions, onSubmitFilter: (filter) => {
+                    handleFilterSave(filter);
+                    setIsOpen(false);
+                }, onDeleteFilter: handleClickDelete, ButtonComponent: ButtonComponent, SelectComponent: SelectComponent, TextInputComponent: TextInputComponent, SecondaryButtonComponent: SecondaryButtonComponent ?? undefined, MultiSelectComponent: MultiSelectComponent }) }) }));
+};

package/dist/esm/components/ReportBuilder/util.d.ts

@@ -0,0 +1,76 @@
+/**
+ * A node that is "in" or "not in" where none of the variants are selected.
+ */
+export declare const isNodeEmptyCollection: (node: any) => boolean;
+export declare function isTopLevelBoolean(node: any): boolean;
+export declare function hasTopLevelOrBoolean(ast: any): boolean;
+export declare const isDateTrunc: (node: any) => boolean;
+export declare const isColumnReferenceish: (node: any) => any;
+export declare function generateColumnExpr(name: any): any;
+export declare const isColumnDateish: (col: any) => any;
+export declare function areObjectsEqualish(left: any, right: any): boolean;
+export declare function formatDateComparisonNode(node: any): string | null;
+export declare function getInTheCurrentIntervalSentence(node: any, databaseType: string): string | null;
+export declare function getInTheLastIntervalSentence(node: any, databaseType: string): string | null;
+export declare function getInThePreviousIntervalSentence(node: any, databaseType: string): string | null;
+export declare function getIsEqualsSentence(node: any, databaseType: string): string | null;
+export declare function getIsAfterSentence(node: any, databaseType: string): string | null;
+export declare function getIsBeforeSentence(node: any, databaseType: string): string | null;
+export declare const isInTheLastInterval: (node: any, databaseType: string) => boolean;
+export declare const isAfter: (node: any, databaseType: string) => boolean | undefined;
+export declare const isBefore: (node: any, databaseType: string) => boolean | undefined;
+export declare const isTheCurrentInterval: (node: any, databaseType: string) => boolean;
+export declare const isEquals: (node: any, databaseType: string) => boolean;
+export declare const isThePreviousInterval: (node: any) => any;
+/**
+ * Returns whether this node is the root of a binary expression
+ * where the left child is a string but really should be
+ * interpreted as a column name.
+ */
+export declare const isColumnComparison: (node: any) => any;
+export declare const newUTCDate: (dateString: string) => Date;
+/**
+ * Takes the right side of a dateTruncEquals expression (ie. the suffix)
+ * and returns a pretty string representation of what that value means.
+ *
+ * eg. date_trunc('year', TIMESTAMP '2023-01-01') would be "in 2023"
+ * eg. date_trunc('month', TIMESTAMP '2023-01-01') would be "in Jan 2023"
+ * eg. date_trunc('quarter', TIMESTAMP '2023-01-01') would be "in Q1 2023"
+ */
+export declare function dateTruncSuffixToString(node: any, databaseType?: string): string;
+/**
+ * Takes an extract binary expression and returns a string version
+ * of what the AST means.
+ *
+ * eg. extract(YEAR FROM "created_at") = 2023 would be "in 2023"
+ * eg. extract(MONTH FROM "created_at") = 1 would be "in January"
+ * eg. TODO: add more variants as they come up
+ */
+export declare function extractSuffixToString(node: any): string;
+export declare function tryConvertDateEquality(node: any, databaseType?: string): string | undefined;
+/**
+ * Returns whether this node is an equality of a date column with a
+ * date trunc.
+ */
+export declare const isDateTruncEquals: (node: any) => boolean;
+/**
+ * Returns whether this node is an equality of a date column with extract.
+ */
+export declare const isExtractEquals: (node: any) => boolean;
+export declare function showNodeAsRow(node: any, ast: any): boolean;
+export declare function getPostgresBasicType(column: any): 'string' | 'number' | 'date' | 'boolean' | undefined;
+export declare const deepCopy: (obj: any) => any;
+export declare const trimEndS: (s: string) => string;
+export declare const getDateFilterInfo: (node: any) => {
+    dateColumn: any;
+    dateColumnPath: string;
+    dateFilterType: string;
+    intervalCount: number | null | undefined;
+    intervalType: any;
+    intervalPaths: any;
+};
+export declare function removeNonSelectedTableReferences(ast: any, table: string, columns: string[]): any;
+export declare function allNumericNodesValidInTree(node: any): boolean;
+export declare function isIdColumn(columnName?: string): boolean | "" | undefined;
+export declare function getCustomSentence(node: any, databaseType: string): string | null;
+//# sourceMappingURL=util.d.ts.map

package/dist/esm/components/ReportBuilder/util.d.ts.map

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