@quillsql/react 2.10.31 → 2.10.32

package/dist/cjs/hooks/useOnClickOutside.d.ts

@@ -0,0 +1,3 @@
+declare const useOnClickOutside: (ref: React.RefObject<HTMLDivElement>, handler: (event: any) => void) => void;
+export default useOnClickOutside;
+//# sourceMappingURL=useOnClickOutside.d.ts.map

package/dist/cjs/hooks/useOnClickOutside.d.ts.map

@@ -0,0 +1 @@
+{"version":3,"file":"useOnClickOutside.d.ts","sourceRoot":"","sources":["../../../src/hooks/useOnClickOutside.tsx"],"names":[],"mappings":"AAEA,QAAA,MAAM,iBAAiB,QAChB,MAAM,SAAS,CAAC,cAAc,CAAC,mBACjB,GAAG,KAAG,IAAI,SAgB9B,CAAC;AAEF,eAAe,iBAAiB,CAAC"}

package/dist/cjs/hooks/useOnClickOutside.js

@@ -0,0 +1,20 @@
+"use strict";
+Object.defineProperty(exports, "__esModule", { value: true });
+const react_1 = require("react");
+const useOnClickOutside = (ref, handler) => {
+    (0, react_1.useEffect)(() => {
+        const listener = (event) => {
+            if (!ref.current || ref.current.contains(event.target)) {
+                return;
+            }
+            handler(event);
+        };
+        document.addEventListener("mousedown", listener);
+        document.addEventListener("touchstart", listener);
+        return () => {
+            document.removeEventListener("mousedown", listener);
+            document.removeEventListener("touchstart", listener);
+        };
+    }, [ref, handler]);
+};
+exports.default = useOnClickOutside;

package/dist/cjs/hooks/useOnWindowResize.d.ts

@@ -0,0 +1,5 @@
+declare const useOnWindowResize: (handler: {
+    (): void;
+}, initialWindowSize?: number) => void;
+export default useOnWindowResize;
+//# sourceMappingURL=useOnWindowResize.d.ts.map

package/dist/cjs/hooks/useOnWindowResize.d.ts.map

@@ -0,0 +1 @@
+{"version":3,"file":"useOnWindowResize.d.ts","sourceRoot":"","sources":["../../../src/hooks/useOnWindowResize.tsx"],"names":[],"mappings":"AAEA,QAAA,MAAM,iBAAiB,YAAa;IAAE,IAAI,IAAI,CAAA;CAAE,sBAAsB,MAAM,SAY3E,CAAC;AAEF,eAAe,iBAAiB,CAAC"}

package/dist/cjs/hooks/useOnWindowResize.js

@@ -0,0 +1,16 @@
+"use strict";
+Object.defineProperty(exports, "__esModule", { value: true });
+const react_1 = require("react");
+const useOnWindowResize = (handler, initialWindowSize) => {
+    const [windowSize, setWindowSize] = (0, react_1.useState)(initialWindowSize);
+    (0, react_1.useEffect)(() => {
+        const handleResize = () => {
+            setWindowSize(window.innerWidth);
+            handler();
+        };
+        handleResize();
+        window.addEventListener("resize", handleResize);
+        return () => window.removeEventListener("resize", handleResize);
+    }, [handler, windowSize]);
+};
+exports.default = useOnWindowResize;

package/dist/cjs/hooks/useQuill.d.ts

@@ -0,0 +1,46 @@
+interface Column {
+    _id: string;
+    label: string;
+    field: string;
+    format: string;
+}
+interface Field {
+    name: string;
+    tableID: number;
+    columnID: number;
+    dataTypeID: number;
+    dataTypeSize: number;
+    dataTypeModifier: number;
+    format: string;
+}
+interface YAxisField {
+    label: string;
+    field: string;
+    chartType: string;
+    format: string;
+}
+export interface QuillReport {
+    name: string;
+    rows: any[];
+    columns: Array<Column>;
+    dashboardName?: string;
+    chartType: string;
+    filters?: object;
+    fields: Array<Field>;
+    template?: boolean;
+    editEnabled?: boolean;
+    xAxisField: string;
+    yAxisFields: Array<YAxisField>;
+    xAxisLabel: string;
+    yAxisLabel: string;
+    queryString: string;
+    dateField?: object;
+    pivot: object;
+}
+export declare const useQuill: (chartId: string) => {
+    data: QuillReport | null;
+    loading: boolean;
+    error: string | null;
+};
+export {};
+//# sourceMappingURL=useQuill.d.ts.map

package/dist/cjs/hooks/useQuill.d.ts.map

@@ -0,0 +1 @@
+{"version":3,"file":"useQuill.d.ts","sourceRoot":"","sources":["../../../src/hooks/useQuill.ts"],"names":[],"mappings":"AAUA,UAAU,MAAM;IACd,GAAG,EAAE,MAAM,CAAC;IACZ,KAAK,EAAE,MAAM,CAAC;IACd,KAAK,EAAE,MAAM,CAAC;IACd,MAAM,EAAE,MAAM,CAAC;CAChB;AAED,UAAU,KAAK;IACb,IAAI,EAAE,MAAM,CAAC;IACb,OAAO,EAAE,MAAM,CAAC;IAChB,QAAQ,EAAE,MAAM,CAAC;IACjB,UAAU,EAAE,MAAM,CAAC;IACnB,YAAY,EAAE,MAAM,CAAC;IACrB,gBAAgB,EAAE,MAAM,CAAC;IACzB,MAAM,EAAE,MAAM,CAAC;CAChB;AAED,UAAU,UAAU;IAClB,KAAK,EAAE,MAAM,CAAC;IACd,KAAK,EAAE,MAAM,CAAC;IACd,SAAS,EAAE,MAAM,CAAC;IAClB,MAAM,EAAE,MAAM,CAAC;CAChB;AAED,MAAM,WAAW,WAAW;IAC1B,IAAI,EAAE,MAAM,CAAC;IACb,IAAI,EAAE,GAAG,EAAE,CAAC;IACZ,OAAO,EAAE,KAAK,CAAC,MAAM,CAAC,CAAC;IACvB,aAAa,CAAC,EAAE,MAAM,CAAC;IACvB,SAAS,EAAE,MAAM,CAAC;IAClB,OAAO,CAAC,EAAE,MAAM,CAAC;IACjB,MAAM,EAAE,KAAK,CAAC,KAAK,CAAC,CAAC;IACrB,QAAQ,CAAC,EAAE,OAAO,CAAC;IACnB,WAAW,CAAC,EAAE,OAAO,CAAC;IACtB,UAAU,EAAE,MAAM,CAAC;IACnB,WAAW,EAAE,KAAK,CAAC,UAAU,CAAC,CAAC;IAC/B,UAAU,EAAE,MAAM,CAAC;IACnB,UAAU,EAAE,MAAM,CAAC;IACnB,WAAW,EAAE,MAAM,CAAC;IACpB,SAAS,CAAC,EAAE,MAAM,CAAC;IACnB,KAAK,EAAE,MAAM,CAAC;CACf;AAED,eAAO,MAAM,QAAQ,YACV,MAAM;UAET,WAAW,GAAG,IAAI;aACf,OAAO;WACT,MAAM,GAAG,IAAI;CAiFrB,CAAC"}

package/dist/cjs/hooks/useQuill.js

@@ -0,0 +1,94 @@
+"use strict";
+Object.defineProperty(exports, "__esModule", { value: true });
+exports.useQuill = void 0;
+// @ts-nocheck
+const react_1 = require("react");
+const Context_1 = require("../Context");
+const dataFetcher_1 = require("../utils/dataFetcher");
+const merge_1 = require("../utils/merge");
+const useQuill = (chartId) => {
+    const { dashboard, dispatch } = (0, react_1.useContext)(Context_1.DashboardContext);
+    const { dashboardFilters } = (0, react_1.useContext)(Context_1.DashboardFiltersContext);
+    const [client] = (0, react_1.useContext)(Context_1.ClientContext);
+    const [data, setData] = (0, react_1.useState)(null);
+    const [loading, setLoading] = (0, react_1.useState)(true);
+    const [error, setError] = (0, react_1.useState)(null);
+    (0, react_1.useEffect)(() => {
+        let isSubscribed = true;
+        async function getChartOptions() {
+            if (isSubscribed) {
+                if (dashboard && dashboard[chartId]) {
+                    setLoading(false);
+                    if (dashboard[chartId].compareRows) {
+                        (0, merge_1.mergeComparisonRange)(dashboard[chartId]);
+                    }
+                    setData({ ...dashboard[chartId] });
+                    return;
+                }
+                try {
+                    setLoading(true);
+                    const hostedBody = {
+                        metadata: {
+                            dashboardItemId: chartId,
+                            orgId: client.customerId || '*',
+                            clientId: client.publicKey,
+                            task: 'item',
+                            filters: [...Object.values(dashboardFilters)],
+                            databaseType: client?.databaseType,
+                        },
+                    };
+                    const cloudBody = {
+                        id: chartId,
+                        filters: [...Object.values(dashboardFilters)],
+                    };
+                    const resp = await (0, dataFetcher_1.getData)(client, 'itempost', 'same-origin', hostedBody, cloudBody);
+                    if (resp) {
+                        if (resp.name === 'error') {
+                            setError(JSON.stringify(resp));
+                        }
+                        else {
+                            if (resp.compareRows) {
+                                (0, merge_1.mergeComparisonRange)(resp);
+                            }
+                            setData(resp);
+                            dispatch({
+                                type: 'UPDATE_DASHBOARD_ITEM',
+                                id: chartId,
+                                data: { ...resp, filtersApplied: dashboardFilters },
+                            });
+                        }
+                    }
+                    setLoading(false);
+                }
+                catch (e) {
+                    if (typeof e === 'string' || (typeof e === 'object' && e !== null)) {
+                        setError(stringifyIfObject(e));
+                    }
+                    else {
+                        setError('error');
+                    }
+                    setLoading(false);
+                }
+            }
+        }
+        if (chartId) {
+            getChartOptions();
+        }
+        return () => {
+            isSubscribed = false;
+        };
+    }, [chartId, dashboard]);
+    return { data, loading, error };
+};
+exports.useQuill = useQuill;
+function stringifyIfObject(e) {
+    if (typeof e === 'string') {
+        // do nothing if e is a string
+        return e;
+    }
+    else if (typeof e === 'object' && e !== null) {
+        // stringify e if it's an object
+        return JSON.stringify(e);
+    }
+    return e; // returns the input as is for other types
+}

package/dist/cjs/hooks/useSelectOnKeyDown.d.ts

@@ -0,0 +1,3 @@
+declare const useSelectOnKeyDown: (onValueChange: (value: string) => void, optionValues: string[], isFocused: boolean, handleFocusChange: (isFocused: boolean) => void, value?: string) => [string | null | undefined, (e: React.KeyboardEvent<HTMLDivElement | HTMLButtonElement>) => void];
+export default useSelectOnKeyDown;
+//# sourceMappingURL=useSelectOnKeyDown.d.ts.map

package/dist/cjs/hooks/useSelectOnKeyDown.d.ts.map

@@ -0,0 +1 @@
+{"version":3,"file":"useSelectOnKeyDown.d.ts","sourceRoot":"","sources":["../../../src/hooks/useSelectOnKeyDown.tsx"],"names":[],"mappings":"AAEA,QAAA,MAAM,kBAAkB,0BACC,MAAM,KAAK,IAAI,gBACxB,MAAM,EAAE,aACX,OAAO,iCACa,OAAO,KAAK,IAAI,UACvC,MAAM,qCAGV,mBAAmB,CAAC,cAAc,GAAG,iBAAiB,CAAC,KAAK,IAAI,CAmErE,CAAC;AAEF,eAAe,kBAAkB,CAAC"}

package/dist/cjs/hooks/useSelectOnKeyDown.js

@@ -0,0 +1,65 @@
+"use strict";
+Object.defineProperty(exports, "__esModule", { value: true });
+const react_1 = require("react");
+const useSelectOnKeyDown = (onValueChange, optionValues, isFocused, handleFocusChange, value) => {
+    const NO_SELECTION_IDX = -1;
+    const [hoveredIdx, setHoveredIdx] = (0, react_1.useState)(NO_SELECTION_IDX);
+    const getHoveredValue = (hoveredIdx, optionValues) => {
+        if (hoveredIdx < 0)
+            return undefined;
+        return optionValues[hoveredIdx];
+    };
+    (0, react_1.useEffect)(() => {
+        const getIndexOfSelectedValue = () => {
+            if (!isFocused) {
+                setHoveredIdx(NO_SELECTION_IDX);
+            }
+            if (!value)
+                return NO_SELECTION_IDX;
+            const indexOfValue = optionValues.indexOf(value);
+            return indexOfValue === -1 ? NO_SELECTION_IDX : indexOfValue;
+        };
+        setHoveredIdx(getIndexOfSelectedValue());
+    }, [value, isFocused]);
+    const hoveredValue = getHoveredValue(hoveredIdx, optionValues);
+    const getNextIdx = () => {
+        const nextIdx = hoveredIdx + 1;
+        return Math.min(nextIdx, optionValues.length - 1);
+    };
+    const getPrevIdx = () => {
+        const prevIdx = hoveredIdx - 1;
+        return Math.max(prevIdx, 0);
+    };
+    const handleKeyDown = (e) => {
+        if (!isFocused) {
+            return;
+        }
+        switch (e.key) {
+            case "ArrowUp": {
+                e.preventDefault();
+                setHoveredIdx(getPrevIdx());
+                break;
+            }
+            case "ArrowDown": {
+                e.preventDefault();
+                setHoveredIdx(getNextIdx());
+                break;
+            }
+            case "Enter": {
+                e.preventDefault();
+                if (hoveredValue) {
+                    onValueChange(hoveredValue);
+                }
+                break;
+            }
+            case "Escape": {
+                e.preventDefault();
+                handleFocusChange(false);
+                setHoveredIdx(NO_SELECTION_IDX);
+                break;
+            }
+        }
+    };
+    return [hoveredValue, handleKeyDown];
+};
+exports.default = useSelectOnKeyDown;

package/dist/cjs/index.d.ts

@@ -0,0 +1,19 @@
+export { default as Dashboard, type DashboardProps, type DashboardItemProps, type DashboardItem, type AxisFormat, } from './Dashboard';
+export { default as QuillProvider } from './QuillProvider';
+export { default as Chart } from './Chart';
+export { default as Table } from './Table';
+export { default as SQLEditor, SchemaListComponent } from './SQLEditor';
+export { default as ReportBuilder } from './ReportBuilder';
+export { default as ChartBuilder } from './ChartBuilder';
+export { default as ChartEditor } from './ChartEditor';
+export { quillFormat as format } from './utils/valueFormatter';
+export { useDashboard } from './hooks/useDashboard';
+export { useQuill } from './hooks/useQuill';
+export { useExport } from './hooks/useExport';
+export { useMemoizedRows } from './hooks/useFormat';
+export { downloadCSV } from './utils/csv';
+export type { QuillTheme } from './QuillProvider';
+export { ThemeContext } from './Context';
+export type { TextInputComponentProps, ButtonComponentProps, Option, PopoverComponentProps, ModalComponentProps, TableComponentProps, HeaderProps, } from './components/UiComponents';
+export type { DateRangePickerProps, DateRangePickerOption, DateRange, } from './DateRangePicker/DateRangePicker';
+//# sourceMappingURL=index.d.ts.map

package/dist/cjs/index.d.ts.map

@@ -0,0 +1 @@
+{"version":3,"file":"index.d.ts","sourceRoot":"","sources":["../../src/index.ts"],"names":[],"mappings":"AACA,OAAO,EACL,OAAO,IAAI,SAAS,EACpB,KAAK,cAAc,EACnB,KAAK,kBAAkB,EACvB,KAAK,aAAa,EAClB,KAAK,UAAU,GAChB,MAAM,aAAa,CAAC;AACrB,OAAO,EAAE,OAAO,IAAI,aAAa,EAAE,MAAM,iBAAiB,CAAC;AAC3D,OAAO,EAAE,OAAO,IAAI,KAAK,EAAE,MAAM,SAAS,CAAC;AAC3C,OAAO,EAAE,OAAO,IAAI,KAAK,EAAE,MAAM,SAAS,CAAC;AAC3C,OAAO,EAAE,OAAO,IAAI,SAAS,EAAE,mBAAmB,EAAE,MAAM,aAAa,CAAC;AACxE,OAAO,EAAE,OAAO,IAAI,aAAa,EAAE,MAAM,iBAAiB,CAAC;AAC3D,OAAO,EAAE,OAAO,IAAI,YAAY,EAAE,MAAM,gBAAgB,CAAC;AACzD,OAAO,EAAE,OAAO,IAAI,WAAW,EAAE,MAAM,eAAe,CAAC;AACvD,OAAO,EAAE,WAAW,IAAI,MAAM,EAAE,MAAM,wBAAwB,CAAC;AAC/D,OAAO,EAAE,YAAY,EAAE,MAAM,sBAAsB,CAAC;AACpD,OAAO,EAAE,QAAQ,EAAE,MAAM,kBAAkB,CAAC;AAC5C,OAAO,EAAE,SAAS,EAAE,MAAM,mBAAmB,CAAC;AAC9C,OAAO,EAAE,eAAe,EAAE,MAAM,mBAAmB,CAAC;AACpD,OAAO,EAAE,WAAW,EAAE,MAAM,aAAa,CAAC;AAC1C,YAAY,EAAE,UAAU,EAAE,MAAM,iBAAiB,CAAC;AAClD,OAAO,EAAE,YAAY,EAAE,MAAM,WAAW,CAAC;AACzC,YAAY,EACV,uBAAuB,EACvB,oBAAoB,EACpB,MAAM,EACN,qBAAqB,EACrB,mBAAmB,EACnB,mBAAmB,EACnB,WAAW,GACZ,MAAM,2BAA2B,CAAC;AACnC,YAAY,EACV,oBAAoB,EACpB,qBAAqB,EACrB,SAAS,GACV,MAAM,mCAAmC,CAAC"}

package/dist/cjs/index.js

@@ -0,0 +1,38 @@
+"use strict";
+var __importDefault = (this && this.__importDefault) || function (mod) {
+    return (mod && mod.__esModule) ? mod : { "default": mod };
+};
+Object.defineProperty(exports, "__esModule", { value: true });
+exports.ThemeContext = exports.downloadCSV = exports.useMemoizedRows = exports.useExport = exports.useQuill = exports.useDashboard = exports.format = exports.ChartEditor = exports.ChartBuilder = exports.ReportBuilder = exports.SchemaListComponent = exports.SQLEditor = exports.Table = exports.Chart = exports.QuillProvider = exports.Dashboard = void 0;
+// src/index.ts
+var Dashboard_1 = require("./Dashboard");
+Object.defineProperty(exports, "Dashboard", { enumerable: true, get: function () { return __importDefault(Dashboard_1).default; } });
+var QuillProvider_1 = require("./QuillProvider");
+Object.defineProperty(exports, "QuillProvider", { enumerable: true, get: function () { return __importDefault(QuillProvider_1).default; } });
+var Chart_1 = require("./Chart");
+Object.defineProperty(exports, "Chart", { enumerable: true, get: function () { return __importDefault(Chart_1).default; } });
+var Table_1 = require("./Table");
+Object.defineProperty(exports, "Table", { enumerable: true, get: function () { return __importDefault(Table_1).default; } });
+var SQLEditor_1 = require("./SQLEditor");
+Object.defineProperty(exports, "SQLEditor", { enumerable: true, get: function () { return __importDefault(SQLEditor_1).default; } });
+Object.defineProperty(exports, "SchemaListComponent", { enumerable: true, get: function () { return SQLEditor_1.SchemaListComponent; } });
+var ReportBuilder_1 = require("./ReportBuilder");
+Object.defineProperty(exports, "ReportBuilder", { enumerable: true, get: function () { return __importDefault(ReportBuilder_1).default; } });
+var ChartBuilder_1 = require("./ChartBuilder");
+Object.defineProperty(exports, "ChartBuilder", { enumerable: true, get: function () { return __importDefault(ChartBuilder_1).default; } });
+var ChartEditor_1 = require("./ChartEditor");
+Object.defineProperty(exports, "ChartEditor", { enumerable: true, get: function () { return __importDefault(ChartEditor_1).default; } });
+var valueFormatter_1 = require("./utils/valueFormatter");
+Object.defineProperty(exports, "format", { enumerable: true, get: function () { return valueFormatter_1.quillFormat; } });
+var useDashboard_1 = require("./hooks/useDashboard");
+Object.defineProperty(exports, "useDashboard", { enumerable: true, get: function () { return useDashboard_1.useDashboard; } });
+var useQuill_1 = require("./hooks/useQuill");
+Object.defineProperty(exports, "useQuill", { enumerable: true, get: function () { return useQuill_1.useQuill; } });
+var useExport_1 = require("./hooks/useExport");
+Object.defineProperty(exports, "useExport", { enumerable: true, get: function () { return useExport_1.useExport; } });
+var useFormat_1 = require("./hooks/useFormat");
+Object.defineProperty(exports, "useMemoizedRows", { enumerable: true, get: function () { return useFormat_1.useMemoizedRows; } });
+var csv_1 = require("./utils/csv");
+Object.defineProperty(exports, "downloadCSV", { enumerable: true, get: function () { return csv_1.downloadCSV; } });
+var Context_1 = require("./Context");
+Object.defineProperty(exports, "ThemeContext", { enumerable: true, get: function () { return Context_1.ThemeContext; } });

package/dist/cjs/internals/ReportBuilder/PivotList.d.ts

@@ -0,0 +1,34 @@
+export declare const PivotCard: ({ pivotTable, theme, index, onSelectPivot, selectedPivotIndex, onEditPivot, ButtonComponent, showEdit, clickable, onClose, minHeight, LabelComponent, TextComponent, HeaderComponent, }: {
+    pivotTable: any;
+    theme: any;
+    index: any;
+    onSelectPivot: any;
+    selectedPivotIndex: any;
+    onEditPivot: any;
+    ButtonComponent: any;
+    showEdit?: boolean | undefined;
+    clickable?: boolean | undefined;
+    onClose?: null | undefined;
+    minHeight?: number | undefined;
+    LabelComponent: any;
+    TextComponent: any;
+    HeaderComponent: any;
+}) => import("react/jsx-runtime").JSX.Element;
+export declare const PivotList: ({ recommendedPivotTables, createdPivotTables, onSelectRecommendedPivot, onSelectCreatedPivot, theme, selectedPivotIndex, selectedPivotType, ButtonComponent, showCreatePivot, onEditRecommendedPivot, onEditCreatedPivot, showPivotEditButton, LabelComponent, TextComponent, HeaderComponent, }: {
+    recommendedPivotTables: any;
+    createdPivotTables: any;
+    onSelectRecommendedPivot: any;
+    onSelectCreatedPivot: any;
+    theme: any;
+    selectedPivotIndex: any;
+    selectedPivotType: any;
+    ButtonComponent: any;
+    showCreatePivot?: boolean | undefined;
+    onEditRecommendedPivot: any;
+    onEditCreatedPivot: any;
+    showPivotEditButton?: boolean | undefined;
+    LabelComponent: any;
+    TextComponent: any;
+    HeaderComponent: any;
+}) => import("react/jsx-runtime").JSX.Element;
+//# sourceMappingURL=PivotList.d.ts.map

package/dist/cjs/internals/ReportBuilder/PivotList.d.ts.map

@@ -0,0 +1 @@
+{"version":3,"file":"PivotList.d.ts","sourceRoot":"","sources":["../../../../src/internals/ReportBuilder/PivotList.tsx"],"names":[],"mappings":"AAIA,eAAO,MAAM,SAAS;;;;;;;;;;;;;;;6CAmIrB,CAAC;AAEF,eAAO,MAAM,SAAS;;;;;;;;;;;;;;;;6CAmFrB,CAAC"}

package/dist/cjs/internals/ReportBuilder/PivotList.js

@@ -0,0 +1,61 @@
+"use strict";
+Object.defineProperty(exports, "__esModule", { value: true });
+exports.PivotList = exports.PivotCard = void 0;
+const jsx_runtime_1 = require("react/jsx-runtime");
+const QuillCard_1 = require("../../components/QuillCard");
+const PivotCard = ({ pivotTable, theme, index, onSelectPivot, selectedPivotIndex, onEditPivot, ButtonComponent, showEdit = false, clickable = true, onClose = null, minHeight = 0, LabelComponent, TextComponent, HeaderComponent, }) => {
+    const maxRowsInPivotPeak = 5;
+    return ((0, jsx_runtime_1.jsx)(QuillCard_1.QuillCard, { theme: theme, onClick: () => onSelectPivot(pivotTable.pivot, index), isSelected: index === selectedPivotIndex, clickable: clickable, onClose: onClose, minHeight: minHeight, children: (0, jsx_runtime_1.jsxs)("div", { style: {
+                fontSize: 14,
+                display: 'flex',
+                flexDirection: 'column',
+                justifyContent: 'space-between',
+                height: minHeight,
+            }, children: [(0, jsx_runtime_1.jsxs)("div", { style: { display: 'flex', flexDirection: 'column' }, children: [pivotTable.pivot.title && ((0, jsx_runtime_1.jsx)("div", { style: {
+                                display: 'flex',
+                                flex: 1,
+                                justifyContent: 'space-between',
+                                flexDirection: 'row',
+                                whiteSpace: 'nowrap',
+                                textOverflow: 'ellipsis',
+                                paddingBottom: 6,
+                            }, children: (0, jsx_runtime_1.jsx)(HeaderComponent, { children: pivotTable.pivot.title }) })), (0, jsx_runtime_1.jsxs)("table", { children: [(0, jsx_runtime_1.jsx)("thead", { children: (0, jsx_runtime_1.jsx)("tr", { children: pivotTable.columns.map(column => ((0, jsx_runtime_1.jsx)("th", { style: {
+                                                fontWeight: 600,
+                                                paddingRight: 5,
+                                                flex: 1,
+                                                textAlign: 'left',
+                                                whiteSpace: 'nowrap',
+                                                textOverflow: 'ellipsis',
+                                            }, children: (0, jsx_runtime_1.jsx)(LabelComponent, { children: column.label }) }, column.field))) }) }), (0, jsx_runtime_1.jsx)("tbody", { children: pivotTable.rows
+                                        .slice(0, maxRowsInPivotPeak)
+                                        .map((row, index) => ((0, jsx_runtime_1.jsx)("tr", { children: pivotTable.columns.map((colum, i) => ((0, jsx_runtime_1.jsx)("td", { style: {
+                                                paddingRight: 5,
+                                                flex: 1,
+                                                whiteSpace: 'nowrap',
+                                                textOverflow: 'ellipsis',
+                                            }, children: (0, jsx_runtime_1.jsx)(TextComponent, { children: row[colum.field] }) }, i))) }, index))) })] })] }), (0, jsx_runtime_1.jsxs)("div", { style: {
+                        display: 'flex',
+                        justifyContent: 'space-between',
+                    }, children: [pivotTable.rows.length > maxRowsInPivotPeak ? ((0, jsx_runtime_1.jsx)("div", { children: (0, jsx_runtime_1.jsxs)(TextComponent, { children: ["...", pivotTable.rows.length - maxRowsInPivotPeak < 5
+                                        ? ''
+                                        : pivotTable.rows.length - maxRowsInPivotPeak, ' ', "more rows"] }) })) : ((0, jsx_runtime_1.jsx)("div", {})), showEdit && ((0, jsx_runtime_1.jsx)("div", { children: (0, jsx_runtime_1.jsx)(ButtonComponent, { id: "edit-pivot", primary: false, onClick: (e) => {
+                                    e.stopPropagation();
+                                    onEditPivot(pivotTable.pivot, index);
+                                }, label: 'Edit' }) }))] })] }) }));
+};
+exports.PivotCard = PivotCard;
+const PivotList = ({ recommendedPivotTables, createdPivotTables, onSelectRecommendedPivot, onSelectCreatedPivot, theme, selectedPivotIndex, selectedPivotType, ButtonComponent, showCreatePivot = false, onEditRecommendedPivot, onEditCreatedPivot, showPivotEditButton = false, LabelComponent, TextComponent, HeaderComponent, }) => {
+    return ((0, jsx_runtime_1.jsx)("div", { children: (0, jsx_runtime_1.jsxs)("div", { style: {
+                display: 'grid',
+                gridTemplateColumns: 'repeat(2, 1fr)',
+                gap: 16,
+                gridAutoRows: '220px',
+            }, children: [recommendedPivotTables.map((pivotTable, index) => ((0, jsx_runtime_1.jsx)(exports.PivotCard, { pivotTable: pivotTable, theme: theme, index: index, onSelectPivot: onSelectRecommendedPivot, selectedPivotIndex: selectedPivotType === 'recommended' ? selectedPivotIndex : -1, onEditPivot: onEditRecommendedPivot, ButtonComponent: ButtonComponent, showPivotEditButton: showPivotEditButton, minHeight: 180, LabelComponent: LabelComponent, TextComponent: TextComponent, HeaderComponent: HeaderComponent }, index))), createdPivotTables.map((pivotTable, index) => ((0, jsx_runtime_1.jsx)(exports.PivotCard, { pivotTable: pivotTable, theme: theme, index: index, onSelectPivot: onSelectCreatedPivot, selectedPivotIndex: selectedPivotType === 'created' ? selectedPivotIndex : -1, onEditPivot: onEditCreatedPivot, ButtonComponent: ButtonComponent, showPivotEditButton: showPivotEditButton, minHeight: 180, LabelComponent: LabelComponent, TextComponent: TextComponent, HeaderComponent: HeaderComponent }, index))), showCreatePivot && ((0, jsx_runtime_1.jsx)(QuillCard_1.QuillCard, { theme: theme, onClick: () => onEditCreatedPivot({}, null), style: {
+                        display: 'flex',
+                        justifyContent: 'center',
+                        alignItems: 'center',
+                        border: `1px dashed ${theme.borderColor || '#e7e7e7'}`,
+                        boxShadow: 'none',
+                    }, children: "Create pivot +" }))] }) }));
+};
+exports.PivotList = PivotList;

package/dist/cjs/internals/ReportBuilder/PivotModal.d.ts

@@ -0,0 +1,62 @@
+export interface Pivot {
+    rowField: string;
+    rowFieldType: string;
+    columnField?: string;
+    columnFieldType?: string;
+    valueField: string;
+    aggregationType: string;
+    title?: string;
+    triggerButtonText?: string;
+}
+export declare const PivotModal: ({ pivotRowField, setPivotRowField, pivotColumnField, setPivotColumnField, pivotValueField, setPivotValueField, pivotAggregation, setPivotAggregation, popUpTitle, setPopUpTitle, selectedTable, SelectComponent, ButtonComponent, PopoverComponent, HeaderComponent, LabelComponent, TextComponent, selectedPivotIndex, setSelectedPivotIndex, removePivot, selectPivot, showUpdatePivot, setShowUpdatePivot, data, columns, theme, isOpen, setIsOpen, dateRange, createdPivots, setCreatedPivots, recommendedPivots, setRecommendedPivots, triggerButtonText, showPivotEditButton, showEditOnPivotClick, selectPivotOnEdit, showTrigger, rightAlign, parentRef, }: {
+    pivotRowField: any;
+    setPivotRowField: any;
+    pivotColumnField: any;
+    setPivotColumnField: any;
+    pivotValueField: any;
+    setPivotValueField: any;
+    pivotAggregation: any;
+    setPivotAggregation: any;
+    popUpTitle: any;
+    setPopUpTitle: any;
+    selectedTable: any;
+    SelectComponent: any;
+    ButtonComponent: any;
+    PopoverComponent: any;
+    HeaderComponent: any;
+    LabelComponent: any;
+    TextComponent: any;
+    selectedPivotIndex: any;
+    setSelectedPivotIndex: any;
+    removePivot: any;
+    selectPivot: any;
+    showUpdatePivot: any;
+    setShowUpdatePivot: any;
+    data: any;
+    columns: any;
+    theme: any;
+    isOpen: any;
+    setIsOpen: any;
+    dateRange: any;
+    createdPivots: any;
+    setCreatedPivots: any;
+    recommendedPivots: any;
+    setRecommendedPivots: any;
+    triggerButtonText?: string | undefined;
+    showPivotEditButton?: boolean | undefined;
+    showEditOnPivotClick?: boolean | undefined;
+    selectPivotOnEdit?: boolean | undefined;
+    showTrigger?: boolean | undefined;
+    rightAlign?: boolean | undefined;
+    parentRef: any;
+}) => import("react/jsx-runtime").JSX.Element;
+export declare function generatePivotTableYAxis(pivot: any, cols: any, format: any): any;
+export declare function isDateField(fieldType: any): boolean;
+export declare function generatePivotTable(pivot: Pivot, data: any, dateRange: any, isComparison: boolean, rowLimit?: number, compRange?: any): {
+    rows: any[];
+    columns: {
+        label: any;
+        field: string;
+    }[];
+};
+//# sourceMappingURL=PivotModal.d.ts.map

package/dist/cjs/internals/ReportBuilder/PivotModal.d.ts.map

@@ -0,0 +1 @@
+{"version":3,"file":"PivotModal.d.ts","sourceRoot":"","sources":["../../../../src/internals/ReportBuilder/PivotModal.tsx"],"names":[],"mappings":"AA8BA,MAAM,WAAW,KAAK;IACpB,QAAQ,EAAE,MAAM,CAAC;IACjB,YAAY,EAAE,MAAM,CAAC;IACrB,WAAW,CAAC,EAAE,MAAM,CAAC;IACrB,eAAe,CAAC,EAAE,MAAM,CAAC;IACzB,UAAU,EAAE,MAAM,CAAC;IACnB,eAAe,EAAE,MAAM,CAAC;IACxB,KAAK,CAAC,EAAE,MAAM,CAAC;IACf,iBAAiB,CAAC,EAAE,MAAM,CAAC;CAC5B;AAkBD,eAAO,MAAM,UAAU;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;6CAqxBtB,CAAC;AAEF,wBAAgB,uBAAuB,CAAC,KAAK,KAAA,EAAE,IAAI,KAAA,EAAE,MAAM,KAAA,OAyB1D;AAkHD,wBAAgB,WAAW,CAAC,SAAS,KAAA,WAOpC;AAgCD,wBAAgB,kBAAkB,CAChC,KAAK,EAAE,KAAK,EACZ,IAAI,EAAE,GAAG,EACT,SAAS,EAAE,GAAG,EACd,YAAY,EAAE,OAAO,EACrB,QAAQ,SAAK,EACb,SAAS,GAAE,GAAU;;;;;;EA4YtB"}