@quillsql/react 2.11.16 → 2.11.18

package/dist/esm/components/Dashboard/MetricComponent.js

@@ -1,23 +1,45 @@
 import { jsx as _jsx, jsxs as _jsxs } from "react/jsx-runtime";
+import { useContext, useMemo } from 'react';
 import { COMPARISON_OPTIONS } from '../../DateRangePicker/dateRangePickerUtils';
 import { valueFormatter } from '../../utils/valueFormatter';
 import ChartError from '../Chart/ChartError';
 import ChartSkeleton from '../Chart/ChartSkeleton';
-export default function QuillMetricComponent({ dashboardItem, onClickDashboardItem, error, isLoading, theme, style, }) {
+import { generatePivotTable } from '../../internals/ReportBuilder/PivotModal';
+import { DashboardFiltersContext } from '../../Context';
+import { useTheme } from '../../hooks';
+export default function QuillMetricComponent({ dashboardItem, onClick, error, isLoading, }) {
+    const theme = useTheme();
+    const { dashboardFilters } = useContext(DashboardFiltersContext);
     const data = dashboardItem;
-    const isComparison = data.rows.length > 0 &&
-        Object.keys(data.rows[0]).includes(`comparison_${data.xAxisField}`);
+    const config = dashboardItem;
+    const dateFilter = Object.values(dashboardFilters).find((filter) => filter.filterType == 'date_range');
+    const pivotTable = useMemo(() => {
+        const pivot = config?.pivot;
+        const data = config;
+        return pivot && data?.rows
+            ? generatePivotTable(pivot, JSON.parse(JSON.stringify(data.rows)), // deep copy
+            dateFilter
+                ? [dateFilter.startDate || null, dateFilter.endDate || null, null]
+                : [null, null, null], Boolean(dateFilter?.comparisonRange?.startDate), -1, dateFilter?.comparisonRange?.startDate
+                ? [
+                    dateFilter?.comparisonRange.startDate,
+                    dateFilter?.comparisonRange.endDate,
+                    null,
+                ]
+                : [null, null, null])
+            : null;
+    }, [config?.pivot]);
     const primaryMetricLabel = data?.filtersApplied?.date_range?.preset?.label;
     const comparisonKey = data?.filtersApplied?.date_range?.comparisonRange?.value;
     const comparisonLabel = COMPARISON_OPTIONS.find((opt) => opt.value === comparisonKey)?.text;
-    return (_jsx("div", { onClick: onClickDashboardItem
-            ? () => onClickDashboardItem(dashboardItem)
-            : () => { }, style: {
+    const rows = pivotTable?.rows ?? data.rows ?? [];
+    const isComparison = rows.length > 0 &&
+        Object.keys(rows[0]).includes(`comparison_${data.xAxisField}`);
+    return (_jsx("div", { onClick: () => onClick && onClick(dashboardItem), style: {
             cursor: 'pointer',
             boxSizing: 'content-box',
             borderRadius: 8,
             paddingBottom: isLoading ? 0 : 30,
-            ...style,
         }, children: _jsx("div", { style: {
                 width: '100%',
                 height: '100%',
@@ -50,7 +72,7 @@ export default function QuillMetricComponent({ dashboardItem, onClickDashboardIt
                                         display: 'block',
                                         maxWidth: '100%',
                                         overflow: 'hidden',
-                                    }, children: dashboardItem?.name }), onClickDashboardItem ? (_jsx("div", { style: {
+                                    }, children: dashboardItem?.name }), onClick ? (_jsx("div", { style: {
                                         fontFamily: theme.fontFamily,
                                         color: theme.primaryTextColor,
                                         boxSizing: 'content-box',
@@ -60,11 +82,13 @@ export default function QuillMetricComponent({ dashboardItem, onClickDashboardIt
                                         display: 'flex',
                                         alignItems: 'center',
                                         justifyContent: 'flex-end',
-                                    }, children: 'view report →' })) : null] }), isLoading ? (_jsx(ChartSkeleton, { containerStyle: { maxHeight: '78px', height: style?.height ?? '100%' } })) : error ? (_jsx(ChartError, {})) : data.rows?.length === 0 ||
-                            data.rows[0][data.xAxisField] === null ? (_jsx("div", { style: {
+                                    }, children: 'view report →' })) : null] }), isLoading ? (_jsx(ChartSkeleton, { containerStyle: {
+                                maxHeight: '78px',
+                                height: '100%',
+                            } })) : error ? (_jsx(ChartError, {})) : rows?.length === 0 || rows[0][data.xAxisField] === null ? (_jsx("div", { style: {
                                 display: 'flex',
                                 flex: '1 0 auto',
-                                height: style?.height ?? '100%',
+                                height: '100%',
                                 margin: 'auto',
                                 justifyContent: 'center',
                                 alignItems: 'center',
@@ -72,7 +96,6 @@ export default function QuillMetricComponent({ dashboardItem, onClickDashboardIt
                                 color: theme.secondaryTextColor,
                                 maxWidth: '100%',
                                 width: '100%',
-                                ...style,
                             }, children: "No results" })) : (_jsx("div", { style: {
                                 padding: 0,
                                 height: '100%',
@@ -99,9 +122,9 @@ export default function QuillMetricComponent({ dashboardItem, onClickDashboardIt
                                             gap: 4,
                                             alignItems: 'baseline',
                                             marginRight: 'auto',
-                                        }, children: [_jsx("span", { children: data.rows.length > 0 &&
+                                        }, children: [_jsx("span", { children: rows.length > 0 &&
                                                     valueFormatter({
-                                                        value: data.rows[0][data.xAxisField] ?? 0,
+                                                        value: rows[0][data.xAxisField] ?? 0,
                                                         field: data.xAxisField,
                                                         fields: [
                                                             {
@@ -130,10 +153,9 @@ export default function QuillMetricComponent({ dashboardItem, onClickDashboardIt
                                                     fontWeight: '500',
                                                     fontFamily: theme?.fontFamily,
                                                     color: theme?.secondaryTextColor,
-                                                }, children: data.rows.length > 0 &&
+                                                }, children: rows.length > 0 &&
                                                     valueFormatter({
-                                                        value: data.rows[0][`comparison_${data.xAxisField}`] ??
-                                                            0,
+                                                        value: rows[0][`comparison_${data.xAxisField}`] ?? 0,
                                                         field: data.xAxisField,
                                                         fields: [
                                                             {

package/dist/esm/components/Dashboard/TableComponent.d.ts

@@ -1,3 +1,4 @@
 /// <reference types="react" />
-export default function QuillTableComponent({ dashboardItem, onClickDashboardItem, isLoading, error, theme, style, children, }: any): JSX.Element;
+import { DashboardItemProps } from '../../Dashboard';
+export default function QuillTableComponent({ dashboardItem, onClick, isLoading, error, }: DashboardItemProps): JSX.Element;
 //# sourceMappingURL=TableComponent.d.ts.map

package/dist/esm/components/Dashboard/TableComponent.d.ts.map

@@ -1 +1 @@
-{"version":3,"file":"TableComponent.d.ts","sourceRoot":"","sources":["../../../../src/components/Dashboard/TableComponent.tsx"],"names":[],"mappings":";AASA,MAAM,CAAC,OAAO,UAAU,mBAAmB,CAAC,EAC1C,aAAa,EACb,oBAAoB,EACpB,SAAS,EACT,KAAK,EACL,KAAK,EACL,KAAK,EACL,QAAQ,GACT,EAAE,GAAG,GAAG,GAAG,CAAC,OAAO,CAiKnB"}
+{"version":3,"file":"TableComponent.d.ts","sourceRoot":"","sources":["../../../../src/components/Dashboard/TableComponent.tsx"],"names":[],"mappings":";AAQA,OAAO,EAAE,kBAAkB,EAAE,MAAM,iBAAiB,CAAC;AAGrD,MAAM,CAAC,OAAO,UAAU,mBAAmB,CAAC,EAC1C,aAAa,EACb,OAAO,EACP,SAAS,EACT,KAAK,GACN,EAAE,kBAAkB,GAAG,GAAG,CAAC,OAAO,CA2JlC"}

package/dist/esm/components/Dashboard/TableComponent.js

@@ -7,7 +7,9 @@ import { DashboardFiltersContext } from '../../Context';
 import { quillFormat } from '../../utils/valueFormatter';
 import ChartSkeleton from '../Chart/ChartSkeleton';
 import ChartError from '../Chart/ChartError';
-export default function QuillTableComponent({ dashboardItem, onClickDashboardItem, isLoading, error, theme, style, children, }) {
+import { useTheme } from '../../hooks';
+export default function QuillTableComponent({ dashboardItem, onClick, isLoading, error, }) {
+    const theme = useTheme();
     const { dashboardFilters } = useContext(DashboardFiltersContext);
     const config = dashboardItem;
     const data = dashboardItem;
@@ -57,12 +59,7 @@ export default function QuillTableComponent({ dashboardItem, onClickDashboardIte
             return formattedRow;
         }, {});
     });
-    return (_jsxs("div", { style: {
-            cursor: 'pointer',
-            ...style,
-        }, onClick: onClickDashboardItem
-            ? () => onClickDashboardItem(dashboardItem)
-            : () => { }, children: [_jsxs("div", { style: {
+    return (_jsxs("div", { style: { cursor: 'pointer' }, onClick: () => onClick && onClick(dashboardItem), children: [_jsxs("div", { style: {
                     display: 'flex',
                     flexDirection: 'row',
                     justifyContent: 'space-between',
@@ -81,7 +78,7 @@ export default function QuillTableComponent({ dashboardItem, onClickDashboardIte
                             display: 'block',
                             maxWidth: '100%',
                             overflow: 'hidden',
-                        }, children: dashboardItem?.name }), onClickDashboardItem ? (_jsx("div", { style: {
+                        }, children: dashboardItem?.name }), onClick ? (_jsx("div", { style: {
                             fontFamily: theme.fontFamily,
                             color: theme.primaryTextColor,
                             boxSizing: 'content-box',
@@ -97,7 +94,7 @@ export default function QuillTableComponent({ dashboardItem, onClickDashboardIte
                 } })) : error ? (_jsx(ChartError, { containerStyle: {
                     width: '100%',
                     height: '400px',
-                } })) : (_jsx(QuillTable, { rows: formattedRows ?? [], columns: columns ?? data.yAxisFields, rowsPerPage: config?.rowsPerPage || 10, containerStyle: {
+                } })) : (_jsx(QuillTable, { rows: formattedRows ?? [], columns: columns ?? data.yAxisFields, rowsPerPage: 10, containerStyle: {
                     width: '100%',
                     height: '400px',
                 }, showDownloadCSVButton: true, downloadCSV: () => {

package/dist/esm/components/QuillCard.d.ts

@@ -1,14 +1,9 @@
 import { ReactNode } from 'react';
-import { QuillTheme } from '../QuillProvider';
 interface QuillCardProps {
     children: ReactNode;
-    theme: QuillTheme;
     onClick?: () => void;
-    onClose?: () => void;
-    isSelected?: boolean;
-    clickable?: boolean;
-    minHeight?: number;
+    onDelete?: () => void;
 }
-export declare function QuillCard({ children, theme, onClick, isSelected, clickable, onClose, minHeight, style, }: QuillCardProps): import("react/jsx-runtime").JSX.Element;
+export declare function QuillCard({ children, onClick, onDelete, }: QuillCardProps): import("react/jsx-runtime").JSX.Element;
 export {};
 //# sourceMappingURL=QuillCard.d.ts.map

package/dist/esm/components/QuillCard.d.ts.map

@@ -1 +1 @@
-{"version":3,"file":"QuillCard.d.ts","sourceRoot":"","sources":["../../../src/components/QuillCard.tsx"],"names":[],"mappings":"AACA,OAAc,EAAE,SAAS,EAAE,MAAM,OAAO,CAAC;AACzC,OAAO,EAAE,UAAU,EAAE,MAAM,kBAAkB,CAAC;AAG9C,UAAU,cAAc;IACtB,QAAQ,EAAE,SAAS,CAAC;IACpB,KAAK,EAAE,UAAU,CAAC;IAClB,OAAO,CAAC,EAAE,MAAM,IAAI,CAAC;IACrB,OAAO,CAAC,EAAE,MAAM,IAAI,CAAC;IACrB,UAAU,CAAC,EAAE,OAAO,CAAC;IACrB,SAAS,CAAC,EAAE,OAAO,CAAC;IACpB,SAAS,CAAC,EAAE,MAAM,CAAC;CACpB;AAED,wBAAgB,SAAS,CAAC,EACxB,QAAQ,EACR,KAAK,EACL,OAAO,EACP,UAAkB,EAClB,SAAgB,EAChB,OAAO,EACP,SAAa,EACb,KAAU,GACX,EAAE,cAAc,2CAmEhB"}
+{"version":3,"file":"QuillCard.d.ts","sourceRoot":"","sources":["../../../src/components/QuillCard.tsx"],"names":[],"mappings":"AACA,OAAO,EAAE,SAAS,EAAE,MAAM,OAAO,CAAC;AAIlC,UAAU,cAAc;IACtB,QAAQ,EAAE,SAAS,CAAC;IACpB,OAAO,CAAC,EAAE,MAAM,IAAI,CAAC;IACrB,QAAQ,CAAC,EAAE,MAAM,IAAI,CAAC;CACvB;AAED,wBAAgB,SAAS,CAAC,EACxB,QAAQ,EACR,OAAO,EACP,QAAQ,GACT,EAAE,cAAc,2CA4EhB"}

package/dist/esm/components/QuillCard.js

@@ -1,19 +1,19 @@
 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: {
+import { useTheme } from '../hooks';
+export function QuillCard({ children, onClick, onDelete, }) {
+    const theme = useTheme();
+    return (_jsxs("div", { className: onClick ? 'quill-card-hover' : '', style: {
             backgroundColor: theme.backgroundColor || 'white',
-            cursor: clickable ? 'pointer' : 'default',
+            cursor: onClick ? '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,
+            borderColor: theme.borderColor,
             overflowX: 'hidden',
             position: 'relative',
-            minHeight: minHeight,
-            ...style,
         }, onClick: onClick, children: [_jsx("style", { children: `
         .quill-card-hover:hover {
           background-color: #f9f9f9 !important;
@@ -24,9 +24,11 @@ export function QuillCard({ children, theme, onClick, isSelected = false, clicka
             background-color: #f5f5f5;
           }
         }
-      ` }), onClose && (_jsxs("button", { className: "quill-delete-button", type: "button", onClick: e => {
+      ` }), onDelete && (_jsxs("button", { className: "quill-delete-button", type: "button", onClick: (e) => {
+                    onDelete();
+                    // Since this button is inside of the card, we do not want to fire
+                    // the onClick callback as well, if we fire the onDelete callback.
                     e.stopPropagation();
-                    onClose();
                 }, style: {
                     height: 40,
                     width: 40,
@@ -46,5 +48,9 @@ export function QuillCard({ children, theme, onClick, isSelected = false, clicka
       }
       .quill-delete-button:hover {
         background-color: rgba(56, 65, 81, 0.03);
-      }` }), _jsx(XIcon, { height: "20", width: "20", fill: "#6C727F" })] })), _jsx("div", { style: { overflowX: 'scroll' }, children: children })] }));
+      }` }), _jsx(XIcon, { height: "20", width: "20", fill: "#6C727F" })] })), _jsx("div", { style: {
+                    overflowX: 'scroll',
+                    display: 'flex',
+                    height: '100%',
+                }, children: children })] }));
 }

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

@@ -1,3 +1,6 @@
 import { SelectComponentProps } from './UiComponents';
-export declare function QuillSelectComponent({ options, value, onChange, theme, label, }: SelectComponentProps): import("react/jsx-runtime").JSX.Element;
+/**
+ * A robust select component that implements the new minimal Select interface.
+ */
+export declare function QuillSelectComponent({ options, value, onChange, label, }: SelectComponentProps): import("react/jsx-runtime").JSX.Element;
 //# sourceMappingURL=QuillSelect.d.ts.map

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

@@ -1 +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,2CAwMtB"}
+{"version":3,"file":"QuillSelect.d.ts","sourceRoot":"","sources":["../../../src/components/QuillSelect.tsx"],"names":[],"mappings":"AACA,OAAO,EAAE,oBAAoB,EAAE,MAAM,gBAAgB,CAAC;AAKtD;;GAEG;AACH,wBAAgB,oBAAoB,CAAC,EACnC,OAAO,EACP,KAAK,EACL,QAAQ,EACR,KAAK,GACN,EAAE,oBAAoB,2CA0MtB"}

package/dist/esm/components/QuillSelect.js

@@ -1,17 +1,19 @@
 import { jsx as _jsx, jsxs as _jsxs } from "react/jsx-runtime";
 import { useOnClickOutside } from '../hooks';
-import { useRef, useState } from 'react';
-export function QuillSelectComponent({ options, value, onChange, theme, label, }) {
+import { useContext, useRef, useState } from 'react';
+import { ThemeContext } from '../Context';
+/**
+ * A robust select component that implements the new minimal Select interface.
+ */
+export function QuillSelectComponent({ options, value, onChange, label, }) {
+    const [theme] = useContext(ThemeContext);
     const [showModal, setShowModal] = useState(false);
     const modalRef = useRef(null);
-    useOnClickOutside(modalRef, (e) => {
-        setShowModal(false);
-    });
+    useOnClickOutside(modalRef, (e) => setShowModal(false));
     return (_jsxs("div", { style: {
             position: 'relative',
             width: 200,
             minWidth: 200,
-            boxShadow: 'rgba(0, 0, 0, 0.1) 0px 1px 5px 0px',
             borderRadius: '6px',
         }, children: [label && (_jsx("div", { style: {
                     fontSize: 14,
@@ -62,7 +64,6 @@ export function QuillSelectComponent({ options, value, onChange, theme, label, }
                     paddingBottom: 6,
                     paddingLeft: 6,
                     paddingRight: 6,
-                    boxShadow: '0px 1px 12px 0px rgba(56, 65, 81, 0.1)',
                     fontFamily: theme.fontFamily,
                     maxHeight: '50vh',
                     overflow: 'scroll',
@@ -85,7 +86,9 @@ export function QuillSelectComponent({ options, value, onChange, theme, label, }
                             height: 34,
                             minHeight: 34,
                         }, className: "quill-option", onClick: () => {
-                            onChange('');
+                            // Manually create a synthetic ChangeEvent and pass it to callback
+                            const changeEvent = { target: { value: '' } };
+                            onChange(changeEvent);
                             setShowModal(false);
                         }, children: [_jsx("style", { children: `
                 .quill-option {
@@ -113,7 +116,9 @@ export function QuillSelectComponent({ options, value, onChange, theme, label, }
                             minHeight: 34,
                             overflow: 'hidden',
                         }, className: "quill-option", onClick: () => {
-                            onChange(option.value);
+                            // Manually create a synthetic ChangeEvent and pass it to callback
+                            const changeEvent = { target: { value: option.value } };
+                            onChange(changeEvent);
                             setShowModal(false);
                         }, children: [_jsx("style", { children: `
                 .quill-option {

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

@@ -1,3 +1,17 @@
-import { TableComponentProps } from './UiComponents';
-export default function QuillTable({ rows, columns, loading, showDownloadCSVButton, downloadFileName, containerStyle, LoadingComponent, rowsPerPage, emptyStateLabel, downloadCSV, }: TableComponentProps): import("react/jsx-runtime").JSX.Element;
+import React from 'react';
+import { ButtonComponentProps } from './UiComponents';
+export interface TableComponentProps {
+    rows: any[];
+    columns: any[];
+    containerStyle?: React.CSSProperties;
+    isLoading?: boolean;
+    showDownloadCSVButton?: boolean;
+    downloadFileName?: string;
+    downloadCSV?: () => void;
+    LoadingComponent?: () => JSX.Element;
+    DownloadCSVButtonComponent?: (props: ButtonComponentProps) => JSX.Element;
+    rowsPerPage?: number;
+    emptyStateLabel?: string;
+}
+export default function QuillTable({ rows, columns, isLoading, showDownloadCSVButton, downloadFileName, containerStyle, LoadingComponent, rowsPerPage, emptyStateLabel, downloadCSV, }: TableComponentProps): import("react/jsx-runtime").JSX.Element;
 //# sourceMappingURL=QuillTable.d.ts.map

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

@@ -1 +1 @@
-{"version":3,"file":"QuillTable.d.ts","sourceRoot":"","sources":["../../../src/components/QuillTable.tsx"],"names":[],"mappings":"AACA,OAAO,EAAE,mBAAmB,EAAE,MAAM,gBAAgB,CAAC;AAMrD,MAAM,CAAC,OAAO,UAAU,UAAU,CAAC,EACjC,IAAI,EACJ,OAAO,EACP,OAAO,EACP,qBAAqB,EACrB,gBAAgB,EAChB,cAAc,EACd,gBAA0C,EAC1C,WAAgB,EAChB,eAA8B,EAC9B,WAAW,GACZ,EAAE,mBAAmB,2CAwZrB"}
+{"version":3,"file":"QuillTable.d.ts","sourceRoot":"","sources":["../../../src/components/QuillTable.tsx"],"names":[],"mappings":"AAAA,OAAO,KAAmD,MAAM,OAAO,CAAC;AAKxE,OAAO,EAAE,oBAAoB,EAAE,MAAM,gBAAgB,CAAC;AAEtD,MAAM,WAAW,mBAAmB;IAClC,IAAI,EAAE,GAAG,EAAE,CAAC;IACZ,OAAO,EAAE,GAAG,EAAE,CAAC;IACf,cAAc,CAAC,EAAE,KAAK,CAAC,aAAa,CAAC;IACrC,SAAS,CAAC,EAAE,OAAO,CAAC;IACpB,qBAAqB,CAAC,EAAE,OAAO,CAAC;IAChC,gBAAgB,CAAC,EAAE,MAAM,CAAC;IAC1B,WAAW,CAAC,EAAE,MAAM,IAAI,CAAC;IACzB,gBAAgB,CAAC,EAAE,MAAM,GAAG,CAAC,OAAO,CAAC;IACrC,0BAA0B,CAAC,EAAE,CAAC,KAAK,EAAE,oBAAoB,KAAK,GAAG,CAAC,OAAO,CAAC;IAC1E,WAAW,CAAC,EAAE,MAAM,CAAC;IACrB,eAAe,CAAC,EAAE,MAAM,CAAC;CAC1B;AAED,MAAM,CAAC,OAAO,UAAU,UAAU,CAAC,EACjC,IAAI,EACJ,OAAO,EACP,SAAS,EACT,qBAAqB,EACrB,gBAAgB,EAChB,cAAc,EACd,gBAA0C,EAC1C,WAAgB,EAChB,eAA8B,EAC9B,WAAW,GACZ,EAAE,mBAAmB,2CAwZrB"}

package/dist/esm/components/QuillTable.js

@@ -3,7 +3,7 @@ import { useContext, useEffect, useState } from 'react';
 import { compareValues } from '../utils/valueFormatter';
 import { ThemeContext } from '../Context';
 import ChartSkeleton from './Chart/ChartSkeleton';
-export default function QuillTable({ rows, columns, loading, showDownloadCSVButton, downloadFileName, containerStyle, LoadingComponent = () => _jsx(ChartSkeleton, {}), rowsPerPage = 10, emptyStateLabel = 'No results', downloadCSV, }) {
+export default function QuillTable({ rows, columns, isLoading, showDownloadCSVButton, downloadFileName, containerStyle, LoadingComponent = () => _jsx(ChartSkeleton, {}), rowsPerPage = 10, emptyStateLabel = 'No results', downloadCSV, }) {
     const [activeRows, setActiveRows] = useState([]);
     const [page, setPage] = useState(1);
     const [maxPage, setMaxPage] = useState(1);
@@ -13,7 +13,7 @@ export default function QuillTable({ rows, columns, loading, showDownloadCSVButt
     const [isPaginating, setIsPaginating] = useState(true);
     useEffect(() => {
         setIsPaginating(true);
-        if (rows.length === 0 && loading) {
+        if (rows.length === 0 && isLoading) {
             return;
         }
         const sortedRows = [...rows];
@@ -30,7 +30,7 @@ export default function QuillTable({ rows, columns, loading, showDownloadCSVButt
         }
         setActiveRows(sortedRows.slice(start, end));
         setIsPaginating(false);
-    }, [page, rows, sortColumn, sortDirection, loading, columns]);
+    }, [page, rows, sortColumn, sortDirection, isLoading, columns]);
     const increasePage = () => {
         if (page === maxPage) {
             return;
@@ -52,7 +52,7 @@ export default function QuillTable({ rows, columns, loading, showDownloadCSVButt
             setSortDirection('desc');
         }
     };
-    if (loading || isPaginating) {
+    if (isLoading || isPaginating) {
         return (_jsx("div", { style: {
                 ...containerStyle,
             }, children: _jsx(LoadingComponent, {}) }));

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

@@ -1,6 +1,6 @@
 /// <reference types="react" />
 import { TextInputComponentProps } from '../UiComponents';
-export default function AddColumnPopover({ onSave, orderedColumnNames, setOrderedColumnNames, selectedColumns, setSelectedColumns, isSelectedAllColumns, clearAllState, nameToColumn, baseAst, setBaseAst, pivot, initialTableName, defaultAST, defaultTable, setPivot, TextInput, SelectColumn, SecondaryButton, Button, HandleButton, }: {
+export default function AddColumnPopover({ onSave, orderedColumnNames, setOrderedColumnNames, selectedColumns, setSelectedColumns, isSelectedAllColumns, clearAllState, nameToColumn, baseAst, setBaseAst, pivot, initialTableName, defaultAST, defaultTable, setPivot, TextInput, SelectColumn, SecondaryButton, Button, }: {
     onSave: any;
     orderedColumnNames: any;
     setOrderedColumnNames: any;
@@ -17,9 +17,15 @@ export default function AddColumnPopover({ onSave, orderedColumnNames, setOrdere
     defaultTable: any;
     setPivot: any;
     TextInput: (props: TextInputComponentProps) => JSX.Element;
-    SelectColumn: any;
+    SelectColumn: (props: {
+        label: string;
+        isSelected: boolean;
+        setSelected: () => void;
+        DragHandle: ({ dragIcon }: {
+            dragIcon: () => JSX.Element;
+        }) => JSX.Element;
+    }) => JSX.Element;
     SecondaryButton: any;
     Button: any;
-    HandleButton: any;
 }): import("react/jsx-runtime").JSX.Element;
 //# sourceMappingURL=AddColumnPopover.d.ts.map

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

@@ -1 +1 @@
-{"version":3,"file":"AddColumnPopover.d.ts","sourceRoot":"","sources":["../../../../src/components/ReportBuilder/AddColumnPopover.tsx"],"names":[],"mappings":";AAmBA,OAAO,EAAE,uBAAuB,EAAE,MAAM,iBAAiB,CAAC;AAI1D,MAAM,CAAC,OAAO,UAAU,gBAAgB,CAAC,EACvC,MAAM,EACN,kBAAkB,EAClB,qBAAqB,EACrB,eAAe,EACf,kBAAkB,EAClB,oBAAoB,EACpB,aAAa,EACb,YAAY,EACZ,OAAO,EACP,UAAU,EACV,KAAK,EACL,gBAAgB,EAChB,UAAU,EACV,YAAY,EACZ,QAAQ,EACR,SAAS,EACT,YAAY,EACZ,eAAe,EACf,MAAM,EACN,YAAY,GACb,EAAE;IACD,MAAM,EAAE,GAAG,CAAC;IACZ,kBAAkB,EAAE,GAAG,CAAC;IACxB,qBAAqB,EAAE,GAAG,CAAC;IAC3B,eAAe,EAAE,GAAG,CAAC;IACrB,kBAAkB,EAAE,GAAG,CAAC;IACxB,oBAAoB,EAAE,GAAG,CAAC;IAC1B,aAAa,EAAE,GAAG,CAAC;IACnB,YAAY,EAAE,GAAG,CAAC;IAClB,OAAO,EAAE,GAAG,CAAC;IACb,UAAU,EAAE,GAAG,CAAC;IAChB,KAAK,EAAE,GAAG,CAAC;IACX,gBAAgB,EAAE,GAAG,CAAC;IACtB,UAAU,EAAE,GAAG,CAAC;IAChB,YAAY,EAAE,GAAG,CAAC;IAClB,QAAQ,EAAE,GAAG,CAAC;IACd,SAAS,EAAE,CAAC,KAAK,EAAE,uBAAuB,KAAK,GAAG,CAAC,OAAO,CAAC;IAC3D,YAAY,EAAE,GAAG,CAAC;IAClB,eAAe,EAAE,GAAG,CAAC;IACrB,MAAM,EAAE,GAAG,CAAC;IACZ,YAAY,EAAE,GAAG,CAAC;CACnB,2CAsNA"}
+{"version":3,"file":"AddColumnPopover.d.ts","sourceRoot":"","sources":["../../../../src/components/ReportBuilder/AddColumnPopover.tsx"],"names":[],"mappings":";AAoBA,OAAO,EAAE,uBAAuB,EAAE,MAAM,iBAAiB,CAAC;AAI1D,MAAM,CAAC,OAAO,UAAU,gBAAgB,CAAC,EACvC,MAAM,EACN,kBAAkB,EAClB,qBAAqB,EACrB,eAAe,EACf,kBAAkB,EAClB,oBAAoB,EACpB,aAAa,EACb,YAAY,EACZ,OAAO,EACP,UAAU,EACV,KAAK,EACL,gBAAgB,EAChB,UAAU,EACV,YAAY,EACZ,QAAQ,EACR,SAAS,EACT,YAAY,EACZ,eAAe,EACf,MAAM,GACP,EAAE;IACD,MAAM,EAAE,GAAG,CAAC;IACZ,kBAAkB,EAAE,GAAG,CAAC;IACxB,qBAAqB,EAAE,GAAG,CAAC;IAC3B,eAAe,EAAE,GAAG,CAAC;IACrB,kBAAkB,EAAE,GAAG,CAAC;IACxB,oBAAoB,EAAE,GAAG,CAAC;IAC1B,aAAa,EAAE,GAAG,CAAC;IACnB,YAAY,EAAE,GAAG,CAAC;IAClB,OAAO,EAAE,GAAG,CAAC;IACb,UAAU,EAAE,GAAG,CAAC;IAChB,KAAK,EAAE,GAAG,CAAC;IACX,gBAAgB,EAAE,GAAG,CAAC;IACtB,UAAU,EAAE,GAAG,CAAC;IAChB,YAAY,EAAE,GAAG,CAAC;IAClB,QAAQ,EAAE,GAAG,CAAC;IACd,SAAS,EAAE,CAAC,KAAK,EAAE,uBAAuB,KAAK,GAAG,CAAC,OAAO,CAAC;IAC3D,YAAY,EAAE,CAAC,KAAK,EAAE;QACpB,KAAK,EAAE,MAAM,CAAC;QACd,UAAU,EAAE,OAAO,CAAC;QACpB,WAAW,EAAE,MAAM,IAAI,CAAC;QACxB,UAAU,EAAE,CAAC,EAAE,QAAQ,EAAE,EAAE;YAAE,QAAQ,EAAE,MAAM,GAAG,CAAC,OAAO,CAAA;SAAE,KAAK,GAAG,CAAC,OAAO,CAAC;KAC5E,KAAK,GAAG,CAAC,OAAO,CAAC;IAClB,eAAe,EAAE,GAAG,CAAC;IACrB,MAAM,EAAE,GAAG,CAAC;CACb,2CAqNA"}

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

@@ -1,4 +1,5 @@
 import { jsx as _jsx, jsxs as _jsxs } from "react/jsx-runtime";
+/* eslint-disable no-unused-vars */
 import { useContext, useState, useRef, useEffect } from 'react';
 import { DndContext, closestCenter, KeyboardSensor, PointerSensor, useSensor, useSensors, } from '@dnd-kit/core';
 import { arrayMove, SortableContext, sortableKeyboardCoordinates, verticalListSortingStrategy, useSortable, } from '@dnd-kit/sortable';
@@ -6,7 +7,7 @@ import { CSS as DND_CSS } from '@dnd-kit/utilities';
 import { ThemeContext } from '../../Context';
 import { updateFirstChildWidth } from '../../utils/width';
 import { snakeCaseToTitleCase } from '../../utils/textProcessing';
-export default function AddColumnPopover({ onSave, orderedColumnNames, setOrderedColumnNames, selectedColumns, setSelectedColumns, isSelectedAllColumns, clearAllState, nameToColumn, baseAst, setBaseAst, pivot, initialTableName, defaultAST, defaultTable, setPivot, TextInput, SelectColumn, SecondaryButton, Button, HandleButton, }) {
+export default function AddColumnPopover({ onSave, orderedColumnNames, setOrderedColumnNames, selectedColumns, setSelectedColumns, isSelectedAllColumns, clearAllState, nameToColumn, baseAst, setBaseAst, pivot, initialTableName, defaultAST, defaultTable, setPivot, TextInput, SelectColumn, SecondaryButton, Button, }) {
     const [theme] = useContext(ThemeContext);
     const [search, setSearch] = useState('');
     const [searchResults, setSearchResults] = useState(orderedColumnNames);
@@ -23,6 +24,8 @@ export default function AddColumnPopover({ onSave, orderedColumnNames, setOrdere
     // When a drag event ends, switch the item order.
     function handleDragEnd(event) {
         const { active, over } = event;
+        if (!active || !over)
+            return;
         if (active.id !== over.id) {
             setOrderedColumnNames((orderedColumnNames) => {
                 const oldIndex = orderedColumnNames.indexOf(active.id);
@@ -41,7 +44,8 @@ export default function AddColumnPopover({ onSave, orderedColumnNames, setOrdere
         setSearchResults(orderedColumnNames
             .filter((row) => {
             const [table, _column] = row.split('.');
-            return (selectedColumns.length === 0 || selectedColumns[0].startsWith(table));
+            const selectedTable = selectedColumns[0]?.split('.')[0];
+            return selectedColumns.length === 0 || selectedTable === table;
         })
             .filter((row) => search.length === 0 ||
             row.includes(search) ||
@@ -69,7 +73,7 @@ export default function AddColumnPopover({ onSave, orderedColumnNames, setOrdere
                             overflowY: 'auto',
                             maxWidth: '300px',
                         }, children: [searchResults.map((value) => {
-                                return (_jsx(SortableItem, { theme: theme, selectedColumns: selectedColumns, setSelectedColumns: setSelectedColumns, id: value, label: value.replace('.', ' | '), SelectColumn: SelectColumn, HandleButton: HandleButton }, value));
+                                return (_jsx(SortableItem, { selectedColumns: selectedColumns, setSelectedColumns: setSelectedColumns, id: value, label: value.replace('.', ' | '), SelectColumn: SelectColumn }, value));
                             }), search.length > 0 && searchResults.length === 0 && (_jsx("div", { style: { fontFamily: theme?.fontFamily }, children: "No results found" }))] }) }) }), _jsxs("div", { style: {
                     display: 'flex',
                     width: '100%',
@@ -122,7 +126,7 @@ export default function AddColumnPopover({ onSave, orderedColumnNames, setOrdere
                             onSave();
                         }, label: "Select columns" })] })] }));
 }
-const SortableItem = ({ id, label, setSelectedColumns, theme, selectedColumns, SelectColumn, HandleButton, }) => {
+const SortableItem = ({ id, label, setSelectedColumns, selectedColumns, SelectColumn, }) => {
     const { attributes, listeners, setNodeRef, transform, transition } = useSortable({ id: id });
     const style = {
         transform: DND_CSS.Transform.toString(transform),
@@ -138,7 +142,7 @@ const SortableItem = ({ id, label, setSelectedColumns, theme, selectedColumns, S
             }
         });
     };
-    return (_jsx("div", { style: { userSelect: 'none', ...style }, ref: setNodeRef, children: _jsx(SelectColumn, { selected: selectedColumns?.includes(id), setSelected: handleSelect, label: label, children: _jsx("div", { style: {
+    return (_jsx("div", { style: { userSelect: 'none', ...style }, ref: setNodeRef, children: _jsx(SelectColumn, { isSelected: selectedColumns?.includes(id), setSelected: handleSelect, label: label, DragHandle: (props) => (_jsx("div", { style: {
                     cursor: 'grab',
-                }, ...attributes, ...listeners, children: _jsx(HandleButton, {}) }) }) }));
+                }, ...attributes, ...listeners, children: _jsx(props.dragIcon, {}) })) }) }));
 };

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

@@ -1,6 +1,18 @@
 /// <reference types="react" />
 import { ButtonComponentProps, TextInputComponentProps } from '../UiComponents';
-export declare const LimitSentence: ({ limit, handleDelete, setOpenPopover, onSave, popoverTitle, LimitPopover, EditPopover, TextInput, Button, SecondaryButton, children, }: any) => import("react/jsx-runtime").JSX.Element;
+import { LimitPopoverComponentProps } from './ui';
+export declare const LimitSentence: ({ limit, handleDelete, setOpenPopover, onSave, popoverTitle, LimitPopover, EditPopover, TextInput, Button, SecondaryButton, }: {
+    limit: any;
+    handleDelete: () => void;
+    setOpenPopover: (arg: any) => void;
+    onSave: (column: any, direction: any) => void;
+    popoverTitle?: string | undefined;
+    LimitPopover: (props: LimitPopoverComponentProps) => JSX.Element;
+    EditPopover: any;
+    TextInput: any;
+    Button: (props: ButtonComponentProps) => JSX.Element;
+    SecondaryButton: (props: ButtonComponentProps) => JSX.Element;
+}) => import("react/jsx-runtime").JSX.Element;
 export interface AddLimitPopoverProps {
     onSave: (limit: number) => void;
     initialLimit?: number;

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

@@ -1 +1 @@
-{"version":3,"file":"AddLimitPopover.d.ts","sourceRoot":"","sources":["../../../../src/components/ReportBuilder/AddLimitPopover.tsx"],"names":[],"mappings":";AAEA,OAAO,EACL,oBAAoB,EAIpB,uBAAuB,EACxB,MAAM,iBAAiB,CAAC;AAUzB,eAAO,MAAM,aAAa,4IAYvB,GAAG,4CAoCL,CAAC;AAEF,MAAM,WAAW,oBAAoB;IACnC,MAAM,EAAE,CAAC,KAAK,EAAE,MAAM,KAAK,IAAI,CAAC;IAChC,YAAY,CAAC,EAAE,MAAM,CAAC;IACtB,MAAM,CAAC,EAAE,OAAO,CAAC;IACjB,QAAQ,CAAC,EAAE,MAAM,IAAI,CAAC;IACtB,SAAS,CAAC,EAAE,CAAC,KAAK,EAAE,uBAAuB,KAAK,GAAG,CAAC,OAAO,CAAC;IAC5D,MAAM,CAAC,EAAE,CAAC,KAAK,EAAE,oBAAoB,KAAK,GAAG,CAAC,OAAO,CAAC;IACtD,eAAe,CAAC,EAAE,CAAC,KAAK,EAAE,oBAAoB,KAAK,GAAG,CAAC,OAAO,CAAC;CAChE;AAED,eAAO,MAAM,eAAe,oFAQzB,oBAAoB,4CA+CtB,CAAC"}
+{"version":3,"file":"AddLimitPopover.d.ts","sourceRoot":"","sources":["../../../../src/components/ReportBuilder/AddLimitPopover.tsx"],"names":[],"mappings":";AACA,OAAO,EACL,oBAAoB,EAIpB,uBAAuB,EACxB,MAAM,iBAAiB,CAAC;AAGzB,OAAO,EAAE,0BAA0B,EAAE,MAAM,MAAM,CAAC;AAElD,eAAO,MAAM,aAAa;WAYjB,GAAG;kBACI,MAAM,IAAI;0BACF,GAAG,KAAK,IAAI;qBACjB,GAAG,aAAa,GAAG,KAAK,IAAI;;0BAEvB,0BAA0B,KAAK,WAAW;iBACnD,GAAG;eACL,GAAG;oBACE,oBAAoB,KAAK,WAAW;6BAC3B,oBAAoB,KAAK,WAAW;6CAiC9D,CAAC;AAEF,MAAM,WAAW,oBAAoB;IACnC,MAAM,EAAE,CAAC,KAAK,EAAE,MAAM,KAAK,IAAI,CAAC;IAChC,YAAY,CAAC,EAAE,MAAM,CAAC;IACtB,MAAM,CAAC,EAAE,OAAO,CAAC;IACjB,QAAQ,CAAC,EAAE,MAAM,IAAI,CAAC;IACtB,SAAS,CAAC,EAAE,CAAC,KAAK,EAAE,uBAAuB,KAAK,GAAG,CAAC,OAAO,CAAC;IAC5D,MAAM,CAAC,EAAE,CAAC,KAAK,EAAE,oBAAoB,KAAK,GAAG,CAAC,OAAO,CAAC;IACtD,eAAe,CAAC,EAAE,CAAC,KAAK,EAAE,oBAAoB,KAAK,GAAG,CAAC,OAAO,CAAC;CAChE;AAED,eAAO,MAAM,eAAe,oFAQzB,oBAAoB,4CA8CtB,CAAC"}

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

@@ -2,28 +2,18 @@ import { jsx as _jsx, Fragment as _Fragment, jsxs as _jsxs } from "react/jsx-run
 import { useState, useContext } from 'react';
 import { MemoizedButton, MemoizedSecondaryButton, QuillTextInput, } from '../UiComponents';
 import { ThemeContext } from '../../Context';
-const SORT_VALUE_TO_LABEL = {
-    ASC: 'ascending',
-    DESC: 'descending',
-};
-export const LimitSentence = ({ limit, handleDelete, setOpenPopover, onSave, popoverTitle = 'Edit limit', LimitPopover, EditPopover, TextInput = QuillTextInput, Button = MemoizedButton, SecondaryButton = MemoizedSecondaryButton, children, }) => {
+export const LimitSentence = ({ limit, handleDelete, setOpenPopover, onSave, popoverTitle = 'Edit limit', LimitPopover, EditPopover, TextInput = QuillTextInput, Button = MemoizedButton, SecondaryButton = MemoizedSecondaryButton, }) => {
     const [isOpen, setIsOpen] = useState(false);
     const handleClickDelete = (e) => {
         setOpenPopover(null);
         handleDelete();
     };
-    return (_jsx("div", { style: { width: '100%' }, children: _jsx(LimitPopover
-        // @ts-ignore
-        , { 
-            // @ts-ignore
-            filterLabel: `limit ${limit.value[0].value}`, onClickDelete: handleClickDelete, popoverTitle: popoverTitle, popoverChildren: _jsx(EditPopover, { onSave: (column, direction) => {
+    return (_jsx("div", { style: { width: '100%' }, children: _jsx(LimitPopover, { isOpen: isOpen, setIsOpen: setIsOpen, limitLabel: `limit ${limit.value[0].value}`, onClickDelete: handleClickDelete, popoverTitle: popoverTitle, popoverChildren: _jsx(EditPopover, { onSave: (column, direction) => {
                     setIsOpen(false);
                     onSave(column, direction);
-                }, isEdit: true, onDelete: handleClickDelete, initialLimit: limit.value[0].value, TextInput: TextInput, Button: Button, SecondaryButton: SecondaryButton }), isOpen: isOpen, setIsOpen: setIsOpen, onDelete: () => {
-                handleDelete();
-            } }) }));
+                }, isEdit: true, onDelete: handleClickDelete, initialLimit: limit.value[0].value, TextInput: TextInput, Button: Button, SecondaryButton: SecondaryButton }) }) }));
 };
-export const AddLimitPopover = ({ onSave, initialLimit = 0, isEdit = false, onDelete = () => { }, TextInput = QuillTextInput, Button = MemoizedButton, SecondaryButton = MemoizedSecondaryButton, }) => {
+export const AddLimitPopover = ({ onSave, initialLimit = 10, isEdit = false, onDelete = () => { }, TextInput = QuillTextInput, Button = MemoizedButton, SecondaryButton = MemoizedSecondaryButton, }) => {
     const [limit, setLimit] = useState(initialLimit);
     const [theme] = useContext(ThemeContext);
     return (_jsxs("div", { style: { display: 'flex', flexDirection: 'column', gap: 12 }, children: [_jsx("div", { style: {
@@ -31,7 +21,7 @@ export const AddLimitPopover = ({ onSave, initialLimit = 0, isEdit = false, onDe
                     flexDirection: 'row',
                     gap: 12,
                     padding: '6px 0px',
-                }, children: _jsx(TextInput, { id: 'add_limit_input', value: limit, width: 200, 
+                }, children: _jsx(TextInput, { id: 'add_limit_input', value: limit.toString() ?? initialLimit.toString(), width: 200, 
                     // style={{ minHeight: 32, padding: '6px 12px' }}
                     onChange: (e) => {
                         if (Number.isNaN(parseFloat(e.target.value || '0'))) {

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

@@ -1,3 +1,23 @@
-export declare const SortSentence: ({ sortData, keyPrefix, columns, handleDelete, setEditPopoverKey, setOpenPopover, setActiveEditItem, setIsPending, setActivePath, onSave, popoverTitle, SortPopover, EditPopover, Select, Button, SecondaryButton, children, }: any) => import("react/jsx-runtime").JSX.Element | null;
+/// <reference types="react" />
+import { ButtonComponentProps, SelectComponentProps } from '../UiComponents';
+import { SortPopoverComponentProps } from './ui';
+export declare const SortSentence: ({ sortData, keyPrefix, columns, handleDelete, setEditPopoverKey, setOpenPopover, setActiveEditItem, setIsPending, setActivePath, onSave, popoverTitle, SortPopover, EditPopover, Select, Button, SecondaryButton, }: {
+    sortData: any;
+    columns: any;
+    setIsPending: any;
+    setEditPopoverKey: any;
+    setActiveEditItem: any;
+    setOpenPopover: any;
+    setActivePath: any;
+    keyPrefix?: any;
+    handleDelete: any;
+    onSave: any;
+    popoverTitle?: string | undefined;
+    SortPopover: (props: SortPopoverComponentProps) => JSX.Element;
+    EditPopover: any;
+    Select?: ((props: SelectComponentProps) => JSX.Element) | undefined;
+    Button?: ((props: ButtonComponentProps) => JSX.Element) | undefined;
+    SecondaryButton?: ((props: ButtonComponentProps) => JSX.Element) | undefined;
+}) => import("react/jsx-runtime").JSX.Element | null;
 export declare const AddSortPopover: ({ onSave, columns, isEdit, onDelete, column, Select, Button, SecondaryButton, }: any) => import("react/jsx-runtime").JSX.Element;
 //# sourceMappingURL=AddSortPopover.d.ts.map

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

@@ -1 +1 @@
-{"version":3,"file":"AddSortPopover.d.ts","sourceRoot":"","sources":["../../../../src/components/ReportBuilder/AddSortPopover.tsx"],"names":[],"mappings":"AAYA,eAAO,MAAM,YAAY,kOAkBtB,GAAG,mDA8CL,CAAC;AAEF,eAAO,MAAM,cAAc,oFASxB,GAAG,4CAiEL,CAAC"}
+{"version":3,"file":"AddSortPopover.d.ts","sourceRoot":"","sources":["../../../../src/components/ReportBuilder/AddSortPopover.tsx"],"names":[],"mappings":";AAEA,OAAO,EACL,oBAAoB,EAGpB,oBAAoB,EACrB,MAAM,iBAAiB,CAAC;AAEzB,OAAO,EAAE,yBAAyB,EAAE,MAAM,MAAM,CAAC;AAOjD,eAAO,MAAM,YAAY;cAkBb,GAAG;aACJ,GAAG;kBACE,GAAG;uBACE,GAAG;uBACH,GAAG;oBACN,GAAG;mBACJ,GAAG;gBACN,GAAG;kBACD,GAAG;YACT,GAAG;;yBAEU,yBAAyB,KAAK,WAAW;iBACjD,GAAG;sBACC,oBAAoB,KAAK,WAAW;sBACpC,oBAAoB,KAAK,WAAW;+BAC3B,oBAAoB,KAAK,WAAW;oDAoD/D,CAAC;AAEF,eAAO,MAAM,cAAc,oFASxB,GAAG,4CA6DL,CAAC"}