@quillsql/react 2.11.12 → 2.11.13

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

@@ -3,6 +3,7 @@ import { useState, useContext } from 'react';
 import { QuillSelectComponent } from '../QuillSelect';
 import { MemoizedButton, MemoizedSecondaryButton } from '../UiComponents';
 import { ThemeContext } from '../../Context';
+import { snakeCaseToTitleCase } from '../../utils/textProcessing';
 const SORT_VALUE_TO_LABEL = {
     ASC: 'ascending',
     DESC: 'descending',
@@ -24,7 +25,7 @@ export const SortSentence = ({ sortData, keyPrefix, columns, handleDelete, setEd
         // @ts-ignore
         , { 
             // @ts-ignore
-            filterLabel: `${sortData.expr.column || sortData.expr.value} is ${SORT_VALUE_TO_LABEL[sortData.type]}`, onClickDelete: handleClickDelete, popoverTitle: popoverTitle, popoverChildren: _jsx(EditPopover, { onSave: (column, direction) => {
+            filterLabel: `${snakeCaseToTitleCase(sortData.expr.column) || snakeCaseToTitleCase(sortData.expr.value)} is ${SORT_VALUE_TO_LABEL[sortData.type]}`, onClickDelete: handleClickDelete, popoverTitle: popoverTitle, popoverChildren: _jsx(EditPopover, { onSave: (column, direction) => {
                     setIsOpen(false);
                     onSave(column, direction);
                 }, columns: columns, isEdit: true, onDelete: handleClickDelete, column: sortData.expr.column || sortData.expr.value }), isOpen: isOpen, setIsOpen: setIsOpen, onDelete: () => {
@@ -37,11 +38,16 @@ export const AddSortPopover = ({ onSave, columns, isEdit, onDelete, column, }) =
     const [sortColumn, setSortColumn] = useState(column || '');
     const [sortDirection, setSortDirection] = useState('ASC');
     const [theme] = useContext(ThemeContext);
-    return (_jsxs("div", { style: { display: 'flex', flexDirection: 'column', gap: 12 }, children: [_jsxs("div", { style: { display: 'flex', flexDirection: 'row', gap: 12 }, children: [_jsx(QuillSelectComponent, { theme: theme, value: sortColumn, onChange: (value) => {
+    return (_jsxs("div", { style: { display: 'flex', flexDirection: 'column', gap: 12 }, children: [_jsxs("div", { style: {
+                    display: 'flex',
+                    flexDirection: 'row',
+                    gap: 12,
+                    padding: '6px 0px',
+                }, children: [_jsx(QuillSelectComponent, { theme: theme, value: sortColumn, onChange: (value) => {
                             setSortColumn(value);
                         }, options: [
                             ...columns.map((column) => ({
-                                label: column.split('.')[1],
+                                label: snakeCaseToTitleCase(column.split('.')[1] || ''),
                                 value: column.split('.')[1],
                             })),
                         ] }), _jsx(QuillSelectComponent, { theme: theme, value: sortDirection, onChange: (value) => {
@@ -54,5 +60,5 @@ export const AddSortPopover = ({ onSave, columns, isEdit, onDelete, column, }) =
                     flexDirection: 'row',
                     justifyContent: 'end',
                     gap: 12,
-                }, children: isEdit ? (_jsxs(_Fragment, { children: [_jsx(MemoizedSecondaryButton, { onClick: onDelete, label: "Delete" }), _jsx(MemoizedButton, { onClick: () => onSave(sortColumn, sortDirection), label: "Add sort" })] })) : (_jsx(MemoizedButton, { onClick: () => onSave(sortColumn, sortDirection), label: "Add sort" })) })] }));
+                }, children: isEdit ? (_jsxs(_Fragment, { children: [_jsx(MemoizedSecondaryButton, { onClick: onDelete, label: "Delete" }), _jsx(MemoizedButton, { onClick: () => onSave(sortColumn, sortDirection), label: "Edit sort" })] })) : (_jsx(MemoizedButton, { onClick: () => onSave(sortColumn, sortDirection), label: "Add sort" })) })] }));
 };

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

@@ -1 +1 @@
-{"version":3,"file":"bigDateMap.d.ts","sourceRoot":"","sources":["../../../../src/components/ReportBuilder/bigDateMap.ts"],"names":[],"mappings":"AAWA;;GAEG;AACH,eAAO,MAAM,oBAAoB;wBAoCnB,GAAG;CAmpBhB,CAAC"}
+{"version":3,"file":"bigDateMap.d.ts","sourceRoot":"","sources":["../../../../src/components/ReportBuilder/bigDateMap.ts"],"names":[],"mappings":"AAaA;;GAEG;AACH,eAAO,MAAM,oBAAoB;wBAoCnB,GAAG;CAmpBhB,CAAC"}

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

@@ -1,12 +1,13 @@
 // A giant map of partial objects keys to functions that take the root node
 // and return a strinified version of the node. Used to populate the filters.
+import { snakeCaseToTitleCase } from '../../utils/textProcessing';
 /**
  * Trims off the _at suffix of columnNames so "created_at" becomes "created"
  */
 function cleanDateFieldName(fieldName) {
     if (!fieldName)
         return undefined;
-    return fieldName.replace('_at', '');
+    return snakeCaseToTitleCase(fieldName.replace('_at', ''));
 }
 /**
  * A big map of partial objects and a callback to convert each to a string.

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

@@ -1 +1 @@
-{"version":3,"file":"ui.d.ts","sourceRoot":"","sources":["../../../../src/components/ReportBuilder/ui.tsx"],"names":[],"mappings":";AAgBA;;;;;GAKG;AAEH,eAAO,MAAM,WAAW,2BAA4B,GAAG,4CA2BtD,CAAC;AAEF,eAAO,MAAM,oBAAoB,2BAA4B,GAAG,4CA2B/D,CAAC;AAEF,eAAO,MAAM,cAAc,UAAW,GAAG,4CAuBxC,CAAC;AAEF,eAAO,MAAM,uBAAuB,uCAKjC,GAAG,4CAiBL,CAAC;AAEF,eAAO,MAAM,QAAQ,sGAoEpB,CAAC;AAGF,eAAO,MAAM,mBAAmB,cAAe,GAAG,4CAEjD,CAAC;AAGF,eAAO,MAAM,sBAAsB,cAAe,GAAG,4CAEpD,CAAC;AAGF,eAAO,MAAM,YAAY,sGAiBxB,CAAC;AAGF,eAAO,MAAM,eAAe,sGAuB3B,CAAC;AAEF,eAAO,MAAM,WAAW,2BAA4B,GAAG,4CAUtD,CAAC;AAEF,wBAAgB,eAAe,CAAC,EAC9B,OAAO,EACP,QAAQ,EACR,KAAU,EACV,OAAO,EACP,MAAM,GACP,EAAE,GAAG,2CAgDL;AAED,eAAO,MAAM,YAAY,sGAkCxB,CAAC;AAGF,eAAO,MAAM,iBAAiB,+CAwE7B,CAAC;AAEF,eAAO,MAAM,iBAAiB,gDAK3B,GAAG,4CA6CL,CAAC;AAGF,eAAO,MAAM,oBAAoB,kCAAmC,GAAG,4CAiDtE,CAAC;AAGF,eAAO,MAAM,uBAAuB,+CAMnC,CAAC;AAGF,eAAO,MAAM,sBAAsB,+CAMlC,CAAC;AAEF,eAAO,MAAM,mBAAmB;;;GAG/B,CAAC;AAEF,eAAO,MAAM,SAAS,sGAIrB,CAAC;AAEF,eAAO,MAAM,WAAW,8DAMrB,GAAG,4CAwBL,CAAC;AAEF,eAAO,MAAM,kBAAkB,4FAO5B,GAAG,4CAqBL,CAAC;AAEF,eAAO,MAAM,gBAAgB,sFAO1B,GAAG,4CAqBL,CAAC;AAEF,eAAO,MAAM,UAAU,sTAuBpB,GAAG,4CAqFL,CAAC;AAEF,eAAO,MAAM,gBAAgB,oDAK1B,GAAG,4CAeL,CAAC"}
+{"version":3,"file":"ui.d.ts","sourceRoot":"","sources":["../../../../src/components/ReportBuilder/ui.tsx"],"names":[],"mappings":";AAiBA;;;;;GAKG;AAEH,eAAO,MAAM,WAAW,2BAA4B,GAAG,4CA2BtD,CAAC;AAEF,eAAO,MAAM,oBAAoB,2BAA4B,GAAG,4CA2B/D,CAAC;AAEF,eAAO,MAAM,cAAc,UAAW,GAAG,4CAuBxC,CAAC;AAEF,eAAO,MAAM,uBAAuB,uCAKjC,GAAG,4CAiBL,CAAC;AAEF,eAAO,MAAM,QAAQ,sGAoEpB,CAAC;AAGF,eAAO,MAAM,mBAAmB,cAAe,GAAG,4CAEjD,CAAC;AAGF,eAAO,MAAM,sBAAsB,cAAe,GAAG,4CAEpD,CAAC;AAGF,eAAO,MAAM,YAAY,sGAiBxB,CAAC;AAGF,eAAO,MAAM,eAAe,sGAuB3B,CAAC;AAEF,eAAO,MAAM,WAAW,2BAA4B,GAAG,4CAUtD,CAAC;AAEF,wBAAgB,eAAe,CAAC,EAC9B,OAAO,EACP,QAAQ,EACR,KAAU,EACV,OAAO,EACP,MAAM,GACP,EAAE,GAAG,2CAgDL;AAED,eAAO,MAAM,YAAY,sGAkCxB,CAAC;AAGF,eAAO,MAAM,iBAAiB,+CAwE7B,CAAC;AAEF,eAAO,MAAM,iBAAiB,gDAK3B,GAAG,4CA6CL,CAAC;AAGF,eAAO,MAAM,oBAAoB,kCAAmC,GAAG,4CAiDtE,CAAC;AAGF,eAAO,MAAM,uBAAuB,+CAMnC,CAAC;AAGF,eAAO,MAAM,sBAAsB,+CAMlC,CAAC;AAEF,eAAO,MAAM,mBAAmB;;;GAG/B,CAAC;AAEF,eAAO,MAAM,SAAS,sGAIrB,CAAC;AAEF,eAAO,MAAM,WAAW,8DAMrB,GAAG,4CAwBL,CAAC;AAEF,eAAO,MAAM,kBAAkB,4FAO5B,GAAG,4CAqBL,CAAC;AAEF,eAAO,MAAM,gBAAgB,sFAO1B,GAAG,4CAqBL,CAAC;AAEF,eAAO,MAAM,UAAU,sTAuBpB,GAAG,4CAqFL,CAAC;AAEF,eAAO,MAAM,gBAAgB,oDAK1B,GAAG,4CAeL,CAAC"}

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

@@ -5,6 +5,7 @@ import MemoizedQuillTable from '../QuillTable';
 import { ThemeContext } from '../../Context';
 import { isNodeEmptyCollection } from './util';
 import { downloadCSV } from '../../utils/csv';
+import { snakeCaseToTitleCase } from '../../utils/textProcessing';
 /**
  * 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
@@ -106,7 +107,7 @@ export const QuillSidebarHeading = ({ label }) => (_jsx(MemoizedHeader, { childr
 export const QuillSidebarSubHeading = ({ label }) => (_jsx(MemoizedLabel, { children: label }));
 // The gray thing on the left.
 export const QuillSidebar = forwardRef(({ children, ...props }, forwardedRef) => (_jsx("div", { style: {
-        overflow: 'visible',
+        overflowX: 'visible',
         padding: '12px',
         width: '25%',
         height: '100%',
@@ -175,7 +176,7 @@ export const QuillPopover = forwardRef(({ children, trigger, isOpen, onClose = (
                     fontSize: 18,
                     margin: 0,
                     textAlign: 'left',
-                    paddingBottom: 12,
+                    marginBottom: 5,
                     color: theme?.primaryTextColor,
                     fontFamily: theme?.fontFamily,
                 }, children: title })), children] }));
@@ -250,7 +251,7 @@ export const QuillSelectColumn = ({ label, selected, setSelected, children, }) =
                             overflow: 'hidden',
                             fontFamily: theme?.fontFamily,
                             color: theme?.primaryTextColor,
-                        }, children: label })] })] }));
+                        }, children: snakeCaseToTitleCase(label) })] })] }));
 };
 // A draggable card with a grab-handle and a column name
 export const QuillDraggableColumn = ({ label, children, onDelete }) => {

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

@@ -1 +1 @@
-{"version":3,"file":"util.d.ts","sourceRoot":"","sources":["../../../../src/components/ReportBuilder/util.ts"],"names":[],"mappings":"AAMA;;GAEG;AACH,eAAO,MAAM,qBAAqB,SAAU,GAAG,YAW9C,CAAC;AAEF,wBAAgB,iBAAiB,CAAC,IAAI,EAAE,GAAG,WAa1C;AAED,wBAAgB,oBAAoB,CAAC,GAAG,EAAE,GAAG,WAK5C;AAGD,eAAO,MAAM,WAAW,SAAU,GAAG,YAuBpC,CAAC;AAKF,eAAO,MAAM,oBAAoB,SAAU,GAAG,QAE7C,CAAC;AAEF,wBAAgB,kBAAkB,CAAC,IAAI,EAAE,GAAG;;;;;;;;EAU3C;AAKD,eAAO,MAAM,eAAe,QAAS,GAAG,QAMvC,CAAC;AAEF,wBAAgB,kBAAkB,CAAC,IAAI,EAAE,GAAG,EAAE,KAAK,EAAE,GAAG,WAiBvD;AAED,wBAAgB,wBAAwB,CAAC,IAAI,EAAE,GAAG,iBAQjD;AAED,wBAAgB,+BAA+B,CAC7C,IAAI,EAAE,GAAG,EACT,YAAY,EAAE,MAAM,GACnB,MAAM,GAAG,IAAI,CAOf;AAQD,wBAAgB,4BAA4B,CAC1C,IAAI,EAAE,GAAG,EACT,YAAY,EAAE,MAAM,GACnB,MAAM,GAAG,IAAI,CAWf;AAED,wBAAgB,gCAAgC,CAC9C,IAAI,EAAE,GAAG,EACT,YAAY,EAAE,MAAM,GACnB,MAAM,GAAG,IAAI,CAOf;AAMD,eAAO,MAAM,mBAAmB,SAAU,GAAG,gBAAgB,MAAM,YA4BlE,CAAC;AAIF,eAAO,MAAM,2BAA2B,SAAU,GAAG,YAUpD,CAAC;AAIF,eAAO,MAAM,oBAAoB,SACzB,GAAG,gBACK,MAAM,KACnB,OAmBF,CAAC;AAEF,eAAO,MAAM,qBAAqB,SAAU,GAAG,gBAAgB,MAAM,QAYpE,CAAC;AAEF,eAAO,MAAM,4BAA4B,SAAU,GAAG,KAAG,OAUxD,CAAC;AAEF;;;;GAIG;AACH,eAAO,MAAM,kBAAkB,SAAU,GAAG,QA4B3C,CAAC;AAGF,eAAO,MAAM,UAAU,eAAgB,MAAM,SAe5C,CAAC;AAmBF;;;;;;;GAOG;AACH,wBAAgB,uBAAuB,CAAC,IAAI,EAAE,GAAG,EAAE,YAAY,CAAC,EAAE,MAAM,UAsBvE;AAED;;;;;;;GAOG;AACH,wBAAgB,qBAAqB,CAAC,IAAI,EAAE,GAAG,UAgB9C;AAED,wBAAgB,sBAAsB,CAAC,IAAI,EAAE,GAAG,EAAE,YAAY,CAAC,EAAE,MAAM,sBAetE;AAED;;;GAGG;AACH,eAAO,MAAM,iBAAiB,SAAU,GAAG,YAU1C,CAAC;AAEF;;GAEG;AACH,eAAO,MAAM,eAAe,SAAU,GAAG,YAOxC,CAAC;AAEF,wBAAgB,aAAa,CAAC,IAAI,EAAE,GAAG,EAAE,GAAG,EAAE,GAAG,WAehD;AAED,wBAAgB,oBAAoB,CAClC,MAAM,EAAE,GAAG,GACV,QAAQ,GAAG,QAAQ,GAAG,MAAM,GAAG,SAAS,CAyB1C;AAED,eAAO,MAAM,QAAQ,QAAS,GAAG,QAAoC,CAAC;AAEtE,eAAO,MAAM,QAAQ,MAAO,MAAM,WAA2C,CAAC;AA4L9E,eAAO,MAAM,iBAAiB,SAAU,GAAG;;;;;;;CAc1C,CAAC;AAqCF,wBAAgB,gCAAgC,CAAC,GAAG,EAAE,GAAG,EAAE,KAAK,EAAE,MAAM,OAQvE"}
+{"version":3,"file":"util.d.ts","sourceRoot":"","sources":["../../../../src/components/ReportBuilder/util.ts"],"names":[],"mappings":"AAOA;;GAEG;AACH,eAAO,MAAM,qBAAqB,SAAU,GAAG,YAW9C,CAAC;AAEF,wBAAgB,iBAAiB,CAAC,IAAI,EAAE,GAAG,WAa1C;AAED,wBAAgB,oBAAoB,CAAC,GAAG,EAAE,GAAG,WAK5C;AAGD,eAAO,MAAM,WAAW,SAAU,GAAG,YAuBpC,CAAC;AAKF,eAAO,MAAM,oBAAoB,SAAU,GAAG,QAE7C,CAAC;AAEF,wBAAgB,kBAAkB,CAAC,IAAI,EAAE,GAAG;;;;;;;;EAU3C;AAKD,eAAO,MAAM,eAAe,QAAS,GAAG,QAMvC,CAAC;AAEF,wBAAgB,kBAAkB,CAAC,IAAI,EAAE,GAAG,EAAE,KAAK,EAAE,GAAG,WAiBvD;AAED,wBAAgB,wBAAwB,CAAC,IAAI,EAAE,GAAG,iBAQjD;AAED,wBAAgB,+BAA+B,CAC7C,IAAI,EAAE,GAAG,EACT,YAAY,EAAE,MAAM,GACnB,MAAM,GAAG,IAAI,CAOf;AAQD,wBAAgB,4BAA4B,CAC1C,IAAI,EAAE,GAAG,EACT,YAAY,EAAE,MAAM,GACnB,MAAM,GAAG,IAAI,CAWf;AAED,wBAAgB,gCAAgC,CAC9C,IAAI,EAAE,GAAG,EACT,YAAY,EAAE,MAAM,GACnB,MAAM,GAAG,IAAI,CAOf;AAMD,eAAO,MAAM,mBAAmB,SAAU,GAAG,gBAAgB,MAAM,YA4BlE,CAAC;AAIF,eAAO,MAAM,2BAA2B,SAAU,GAAG,YAUpD,CAAC;AAIF,eAAO,MAAM,oBAAoB,SACzB,GAAG,gBACK,MAAM,KACnB,OAoBF,CAAC;AAEF,eAAO,MAAM,qBAAqB,SAAU,GAAG,gBAAgB,MAAM,QAYpE,CAAC;AAEF,eAAO,MAAM,4BAA4B,SAAU,GAAG,KAAG,OAUxD,CAAC;AAEF;;;;GAIG;AACH,eAAO,MAAM,kBAAkB,SAAU,GAAG,QA4B3C,CAAC;AAGF,eAAO,MAAM,UAAU,eAAgB,MAAM,SAe5C,CAAC;AAmBF;;;;;;;GAOG;AACH,wBAAgB,uBAAuB,CAAC,IAAI,EAAE,GAAG,EAAE,YAAY,CAAC,EAAE,MAAM,UAsBvE;AAED;;;;;;;GAOG;AACH,wBAAgB,qBAAqB,CAAC,IAAI,EAAE,GAAG,UAgB9C;AAED,wBAAgB,sBAAsB,CAAC,IAAI,EAAE,GAAG,EAAE,YAAY,CAAC,EAAE,MAAM,sBAmBtE;AAED;;;GAGG;AACH,eAAO,MAAM,iBAAiB,SAAU,GAAG,YAU1C,CAAC;AAEF;;GAEG;AACH,eAAO,MAAM,eAAe,SAAU,GAAG,YAOxC,CAAC;AAEF,wBAAgB,aAAa,CAAC,IAAI,EAAE,GAAG,EAAE,GAAG,EAAE,GAAG,WAehD;AAED,wBAAgB,oBAAoB,CAClC,MAAM,EAAE,GAAG,GACV,QAAQ,GAAG,QAAQ,GAAG,MAAM,GAAG,SAAS,CAyB1C;AAED,eAAO,MAAM,QAAQ,QAAS,GAAG,QAAoC,CAAC;AAEtE,eAAO,MAAM,QAAQ,MAAO,MAAM,WAA2C,CAAC;AA4L9E,eAAO,MAAM,iBAAiB,SAAU,GAAG;;;;;;;CAc1C,CAAC;AAqCF,wBAAgB,gCAAgC,CAAC,GAAG,EAAE,GAAG,EAAE,KAAK,EAAE,MAAM,OAQvE"}

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

@@ -1,6 +1,7 @@
 // A collection of reusable, pure, utility functions for the Report Builder.
 import { getQuarter } from 'date-fns';
 import { DATE_DESCRIPTION_MAP } from './bigDateMap';
+import { snakeCaseToTitleCase } from '../../utils/textProcessing';
 /**
  * A node that is "in" or "not in" where none of the variants are selected.
  */
@@ -120,7 +121,7 @@ export function formatDateComparisonNode(node) {
 }
 export function getInTheCurrentIntervalSentence(node, databaseType) {
     if (databaseType === 'BigQuery') {
-        const dateColumn = node.left.args.value[0].column;
+        const dateColumn = snakeCaseToTitleCase(node.left.args.value[0].column);
         const periodValue = node.left.args.value[1].column.toLowerCase();
         return `${dateColumn} in the current ${periodValue}`;
     }
@@ -133,7 +134,7 @@ const BIG_QUERY_DAY_TO_INTERVAL_MAP = {
 };
 export function getInTheLastIntervalSentence(node, databaseType) {
     if (databaseType === 'BigQuery') {
-        const dateColumn = node.left.column;
+        const dateColumn = snakeCaseToTitleCase(node.left.column);
         const amount = node.right.args.value[1].expr.value;
         let unit = node.right.args.value[1].unit.toLowerCase();
         if (unit.includes('*')) {
@@ -145,7 +146,7 @@ export function getInTheLastIntervalSentence(node, databaseType) {
 }
 export function getInThePreviousIntervalSentence(node, databaseType) {
     if (databaseType === 'BigQuery') {
-        const dateColumn = node.left.args.value[0].column;
+        const dateColumn = snakeCaseToTitleCase(node.left.args.value[0].column);
         const periodValue = node.left.args.value[1].column.toLowerCase();
         return `${dateColumn} in the previous ${periodValue}`;
     }
@@ -201,6 +202,7 @@ export const isTheCurrentInterval = (node, databaseType) => {
     const isInsideOfDateTrunc = ['AND'].includes(node.operator) &&
         (node.left.operator === '=' || node.left.type === 'double_quote_string') &&
         node.right.operator === '=' &&
+        node.right.name &&
         node.right.name.toLowerCase() === 'date_trunc' &&
         node.args.value[0].type === 'single_quote_string' &&
         node.args.value[1].type === 'binary_expr' &&
@@ -356,14 +358,14 @@ export function tryConvertDateEquality(node, databaseType) {
     if (isDateTruncEquals(node)) {
         const columnNode = node.left.args.value[1];
         const columnName = columnNode.column ?? columnNode.value;
-        const cleanColumnName = columnName.replaceAll('_at', '');
+        const cleanColumnName = snakeCaseToTitleCase(columnName.replaceAll('_at', ''));
         const prettyDateSuffix = dateTruncSuffixToString(node, databaseType);
         return `${cleanColumnName} ${prettyDateSuffix}`;
     }
     else if (isExtractEquals(node)) {
         const columnNode = node.left.args.source;
         const columnName = columnNode.column ?? columnNode.value;
-        const cleanColumnName = columnName.replaceAll('_at', '');
+        const cleanColumnName = snakeCaseToTitleCase(columnName.replaceAll('_at', ''));
         const prettyDateSuffix = extractSuffixToString(node);
         return `${cleanColumnName} ${prettyDateSuffix}`;
     }

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

@@ -8,7 +8,7 @@ export interface Pivot {
     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, recommendPivotCount, }: {
+export declare const PivotModal: ({ pivotRowField, setPivotRowField, pivotColumnField, setPivotColumnField, pivotValueField, setPivotValueField, pivotAggregation, setPivotAggregation, popUpTitle, setPopUpTitle, selectedTable, SelectComponent, ButtonComponent, SecondaryButtonComponent, 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, recommendPivotCount, }: {
     pivotRowField: any;
     setPivotRowField: any;
     pivotColumnField: any;
@@ -22,6 +22,7 @@ export declare const PivotModal: ({ pivotRowField, setPivotRowField, pivotColumn
     selectedTable: any;
     SelectComponent: any;
     ButtonComponent: any;
+    SecondaryButtonComponent: any;
     PopoverComponent: any;
     HeaderComponent: any;
     LabelComponent: any;

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

@@ -1 +1 @@
-{"version":3,"file":"PivotModal.d.ts","sourceRoot":"","sources":["../../../../src/internals/ReportBuilder/PivotModal.tsx"],"names":[],"mappings":"AA+BA,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;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;6CAotBtB,CAAC;AAEF,wBAAgB,uBAAuB,CAAC,KAAK,KAAA,EAAE,IAAI,KAAA,EAAE,MAAM,KAAA,OAyB1D;AAkHD,wBAAgB,WAAW,CAAC,SAAS,KAAA,WAYpC;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;;;;;;EA6atB"}
+{"version":3,"file":"PivotModal.d.ts","sourceRoot":"","sources":["../../../../src/internals/ReportBuilder/PivotModal.tsx"],"names":[],"mappings":"AA+BA,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;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;6CAqtBtB,CAAC;AAEF,wBAAgB,uBAAuB,CAAC,KAAK,KAAA,EAAE,IAAI,KAAA,EAAE,MAAM,KAAA,OAyB1D;AAkHD,wBAAgB,WAAW,CAAC,SAAS,KAAA,WAYpC;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;;;;;;EA6atB"}

package/dist/esm/internals/ReportBuilder/PivotModal.js

@@ -3,13 +3,11 @@ import { jsx as _jsx, jsxs as _jsxs } from "react/jsx-runtime";
 import { useCallback, useContext, useMemo, useState, useEffect, useRef, } from 'react';
 import { ClientContext } from '../../Context';
 import { getDataFromCloud } from '../../utils/dataFetcher';
-import { RefreshIcon } from '../../assets';
 import { PivotList, PivotCard } from './PivotList';
 import { differenceInDays, eachDayOfInterval, eachMonthOfInterval, eachWeekOfInterval, eachYearOfInterval, endOfDay, isWithinInterval, subMilliseconds, min, max, add, } from 'date-fns';
 import { valueFormatter } from '../../utils/valueFormatter';
 import { numberFormatOptions, dateFormatOptions } from '../../ChartBuilder';
 import { snakeCaseToTitleCase } from '../../utils/textProcessing';
-import { QuillCard } from '../../components/QuillCard';
 const QuillHover = () => {
     return (_jsx("style", { children: `
   .quill-hover {
@@ -23,7 +21,7 @@ const QuillHover = () => {
   }
 ` }));
 };
-export 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 = 'Pivot', showPivotEditButton = false, showEditOnPivotClick = true, selectPivotOnEdit = false, showTrigger = true, rightAlign = false, parentRef, recommendPivotCount = 6, }) => {
+export const PivotModal = ({ pivotRowField, setPivotRowField, pivotColumnField, setPivotColumnField, pivotValueField, setPivotValueField, pivotAggregation, setPivotAggregation, popUpTitle, setPopUpTitle, selectedTable, SelectComponent, ButtonComponent, SecondaryButtonComponent, PopoverComponent, HeaderComponent, LabelComponent, TextComponent, selectedPivotIndex, setSelectedPivotIndex, removePivot, selectPivot, showUpdatePivot, setShowUpdatePivot, data, columns, theme, isOpen, setIsOpen, dateRange, createdPivots, setCreatedPivots, recommendedPivots, setRecommendedPivots, triggerButtonText = 'Pivot', showPivotEditButton = false, showEditOnPivotClick = true, selectPivotOnEdit = false, showTrigger = true, rightAlign = false, parentRef, recommendPivotCount = 6, }) => {
     const [isLoading, setIsLoading] = useState(false);
     const [pivotUpdateIndex, setPivotUpdateIndex] = useState(null);
     const [selectedPivotType, setSelectedPivotType] = useState('recommended');
@@ -93,7 +91,7 @@ export const PivotModal = ({ pivotRowField, setPivotRowField, pivotColumnField,
     const columnSelectOptions = useMemo(() => {
         return [
             ...Object.keys(columnsToShow).map((key) => {
-                return { label: key, value: key };
+                return { label: snakeCaseToTitleCase(key), value: key };
             }),
         ];
     }, [columnsToShow]);
@@ -227,6 +225,9 @@ export const PivotModal = ({ pivotRowField, setPivotRowField, pivotColumnField,
                         setShowUpdatePivot(false);
                         setPopUpTitle('Add Pivot');
                     }, style: rightAlign ? { right: 0 } : {}, parentRef: parentRef, showTrigger: showTrigger, label: triggerButtonText, isOpen: isOpen, setIsOpen: setIsOpen, onClick: () => {
+                        if (columns.length === 0) {
+                            setIsOpen(false);
+                        }
                         // table is not loaded yet, so pivot button is not clickable
                         if (Object.keys(columnsToShow).length === 0) {
                             return;
@@ -239,12 +240,10 @@ export const PivotModal = ({ pivotRowField, setPivotRowField, pivotColumnField,
                                 backgroundColor: 'rgb(255, 255, 255)',
                                 display: 'flex',
                                 flexDirection: 'column',
-                            }, children: [_jsx(HeaderComponent, { children: popUpTitle }), _jsx("div", { style: { height: 12 } }), _jsx("div", { style: { width: divWidth }, children: samplePivotTable ? (_jsx("div", { style: {
+                            }, children: [_jsx(HeaderComponent, { children: popUpTitle }), _jsx("div", { style: { height: 12 } }), _jsx("div", { style: { width: divWidth }, children: samplePivotTable && (_jsx("div", { style: {
                                             marginBottom: 20,
                                             minHeight: 160,
-                                        }, children: _jsx(PivotCard, { pivotTable: samplePivotTable, theme: theme, index: 0, onSelectPivot: () => { }, selectedPivotIndex: -1, onEditPivot: () => { }, ButtonComponent: ButtonComponent, showEdit: false, clickable: false, minHeight: 140, LabelComponent: LabelComponent, TextComponent: TextComponent, HeaderComponent: HeaderComponent }) })) : (_jsx("div", { style: { marginBottom: 20, maxWidth: 470 }, children: _jsx(QuillCard, { theme: theme, clickable: false, children: _jsx("div", { style: {
-                                                    color: theme.secondaryTextColor,
-                                                }, children: "Select a row field and aggregation type to see a preview" }) }) })) }), _jsxs("div", { style: {
+                                        }, children: _jsx(PivotCard, { pivotTable: samplePivotTable, theme: theme, index: 0, onSelectPivot: () => { }, selectedPivotIndex: -1, onEditPivot: () => { }, ButtonComponent: ButtonComponent, showEdit: false, clickable: false, minHeight: 140, LabelComponent: LabelComponent, TextComponent: TextComponent, HeaderComponent: HeaderComponent }) })) }), _jsxs("div", { style: {
                                         display: 'flex',
                                         flexDirection: 'column',
                                         gap: 10,
@@ -352,26 +351,24 @@ export const PivotModal = ({ pivotRowField, setPivotRowField, pivotColumnField,
                                             columns: selectedPivotTable?.columns,
                                         }, theme: theme, index: 0, onSelectPivot: () => { }, selectedPivotIndex: -1, onEditPivot: () => { }, ButtonComponent: ButtonComponent, showEdit: false, onClose: () => {
                                             removePivot();
-                                        }, clickable: true, minHeight: 180, LabelComponent: LabelComponent, TextComponent: TextComponent, HeaderComponent: HeaderComponent }) }) })) : (_jsxs("div", { style: { display: 'flex', flexDirection: 'column' }, children: [_jsx("div", { style: {
-                                            fontWeight: '600',
-                                            marginBottom: 5,
-                                            fontSize: 18,
-                                        }, children: "Recommended Pivots" }), _jsx("div", { children: _jsxs("div", { onClick: refreshPivots, style: {
-                                                color: theme?.secondaryTextColor,
-                                                cursor: 'pointer',
-                                                marginTop: 0,
-                                                marginBottom: 12,
-                                                display: 'flex',
-                                                flexDirection: 'row',
-                                                alignItems: 'center',
-                                                width: 'min-content',
-                                                fontSize: 14,
-                                                paddingLeft: 8,
-                                                paddingRight: 6,
-                                                paddingTop: 6,
-                                                paddingBottom: 6,
-                                                borderRadius: 5,
-                                            }, className: "quill-hover", children: [_jsx(QuillHover, {}), _jsx(RefreshIcon, { style: { marginRight: 5 } }), "Refresh"] }) }), isLoading ? (_jsxs("div", { style: {
+                                        }, clickable: true, minHeight: 180, LabelComponent: LabelComponent, TextComponent: TextComponent, HeaderComponent: HeaderComponent }) }) })) : (_jsxs("div", { style: { display: 'flex', flexDirection: 'column' }, children: [_jsxs("div", { style: {
+                                            display: 'flex',
+                                            flexDirection: 'row',
+                                            width: '100%',
+                                            alignItems: 'center',
+                                            justifyContent: 'space-between',
+                                            paddingBottom: 12,
+                                        }, children: [_jsx("div", { style: {
+                                                    fontWeight: '600',
+                                                    fontSize: 18,
+                                                }, children: "Recommended pivots" }), _jsx("div", { children: _jsx(SecondaryButtonComponent, { onClick: refreshPivots, label: _jsxs("div", { style: {
+                                                            display: 'flex',
+                                                            flexDirection: 'row',
+                                                            whiteSpace: 'nowrap',
+                                                            alignItems: 'center',
+                                                            gap: 6,
+                                                            fontSize: 14,
+                                                        }, children: [_jsx("svg", { xmlns: "http://www.w3.org/2000/svg", viewBox: "0 0 24 24", fill: "currentColor", style: { width: 16, height: 16 }, children: _jsx("path", { fillRule: "evenodd", d: "M9 4.5a.75.75 0 0 1 .721.544l.813 2.846a3.75 3.75 0 0 0 2.576 2.576l2.846.813a.75.75 0 0 1 0 1.442l-2.846.813a3.75 3.75 0 0 0-2.576 2.576l-.813 2.846a.75.75 0 0 1-1.442 0l-.813-2.846a3.75 3.75 0 0 0-2.576-2.576l-2.846-.813a.75.75 0 0 1 0-1.442l2.846-.813A3.75 3.75 0 0 0 7.466 7.89l.813-2.846A.75.75 0 0 1 9 4.5ZM18 1.5a.75.75 0 0 1 .728.568l.258 1.036c.236.94.97 1.674 1.91 1.91l1.036.258a.75.75 0 0 1 0 1.456l-1.036.258c-.94.236-1.674.97-1.91 1.91l-.258 1.036a.75.75 0 0 1-1.456 0l-.258-1.036a2.625 2.625 0 0 0-1.91-1.91l-1.036-.258a.75.75 0 0 1 0-1.456l1.036-.258a2.625 2.625 0 0 0 1.91-1.91l.258-1.036A.75.75 0 0 1 18 1.5ZM16.5 15a.75.75 0 0 1 .712.513l.394 1.183c.15.447.5.799.948.948l1.183.395a.75.75 0 0 1 0 1.422l-1.183.395c-.447.15-.799.5-.948.948l-.395 1.183a.75.75 0 0 1-1.422 0l-.395-1.183a1.5 1.5 0 0 0-.948-.948l-1.183-.395a.75.75 0 0 1 0-1.422l1.183-.395c.447-.15.799-.5.948-.948l.395-1.183A.75.75 0 0 1 16.5 15Z", clipRule: "evenodd" }) }), "Regenerate"] }) }) })] }), isLoading ? (_jsxs("div", { style: {
                                             background: theme.backgroundColor,
                                             width: 250,
                                             minWidth: 250,
@@ -382,7 +379,7 @@ export const PivotModal = ({ pivotRowField, setPivotRowField, pivotColumnField,
                                             display: 'flex',
                                             margin: '0px auto',
                                             justifyContent: 'center',
-                                        }, children: [_jsx("div", { style: { height: 100 } }), _jsxs("svg", { width: "24", height: "24", children: [_jsx("circle", { cx: "12", cy: "12", r: "9.375", strokeWidth: "3.75", strokeDasharray: "calc(2 * 3.14 * 9.375 / 3) calc(2 * 3.14 * 9.375 * 2 / 3)", strokeDashoffset: "calc(2 * 3.14 * 9.375 / 6)", stroke: theme?.primaryTextColor || '#364153', fill: "none", transform: "rotate(-90 12 12)", children: _jsx("animateTransform", { attributeName: "transform", attributeType: "XML", type: "rotate", from: "-180 12 12", to: "180 12 12", dur: "0.8s", repeatCount: "indefinite" }) }), _jsx("circle", { cx: "12", cy: "12", r: "9.375", strokeWidth: "3.75", strokeDasharray: "calc(2 * 3.14 * 9.375 / 3) calc(2 * 3.14 * 9.375 * 1 / 3)", strokeDashoffset: "calc(2 * 3.14 * 9.375 / 3) calc(2 * 3.14 * 9.375 * 2 / 3)", stroke: '#ADB1B9', fill: "none", transform: "rotate(90 12 12)", children: _jsx("animateTransform", { attributeName: "transform", attributeType: "XML", type: "rotate", from: "0 12 12", to: "360 12 12", dur: "0.8s", repeatCount: "indefinite" }) })] })] })) : (_jsxs("div", { children: [recommendedPivotTables.length == 0 && (_jsx("div", { style: { marginBottom: 20 }, children: "There are currently no recommended pivots available." })), _jsx(PivotList, { recommendedPivotTables: recommendedPivotTables, createdPivotTables: createdPivotTables, theme: theme, onSelectRecommendedPivot: onSelectRecommendedPivot, onSelectCreatedPivot: onSelectCreatedPivot, selectedPivotIndex: selectedPivotIndex, selectedPivotType: selectedPivotType, ButtonComponent: ButtonComponent, HeaderComponent: HeaderComponent, onEditRecommendedPivot: onEditRecommendedPivot, onEditCreatedPivot: onEditPivot, showCreatePivot: true, showPivotEditButton: showPivotEditButton, LabelComponent: LabelComponent, TextComponent: TextComponent })] }))] })) })) }) })] }) }));
+                                        }, children: [_jsx("div", { style: { height: 100 } }), _jsxs("svg", { width: "24", height: "24", children: [_jsx("circle", { cx: "12", cy: "12", r: "9.375", strokeWidth: "3.75", strokeDasharray: "calc(2 * 3.14 * 9.375 / 3) calc(2 * 3.14 * 9.375 * 2 / 3)", strokeDashoffset: "calc(2 * 3.14 * 9.375 / 6)", stroke: theme?.primaryTextColor || '#364153', fill: "none", transform: "rotate(-90 12 12)", children: _jsx("animateTransform", { attributeName: "transform", attributeType: "XML", type: "rotate", from: "-180 12 12", to: "180 12 12", dur: "0.8s", repeatCount: "indefinite" }) }), _jsx("circle", { cx: "12", cy: "12", r: "9.375", strokeWidth: "3.75", strokeDasharray: "calc(2 * 3.14 * 9.375 / 3) calc(2 * 3.14 * 9.375 * 1 / 3)", strokeDashoffset: "calc(2 * 3.14 * 9.375 / 3) calc(2 * 3.14 * 9.375 * 2 / 3)", stroke: '#ADB1B9', fill: "none", transform: "rotate(90 12 12)", children: _jsx("animateTransform", { attributeName: "transform", attributeType: "XML", type: "rotate", from: "0 12 12", to: "360 12 12", dur: "0.8s", repeatCount: "indefinite" }) })] })] })) : (_jsx("div", { children: _jsx(PivotList, { recommendedPivotTables: recommendedPivotTables, createdPivotTables: createdPivotTables, theme: theme, onSelectRecommendedPivot: onSelectRecommendedPivot, onSelectCreatedPivot: onSelectCreatedPivot, selectedPivotIndex: selectedPivotIndex, selectedPivotType: selectedPivotType, ButtonComponent: ButtonComponent, HeaderComponent: HeaderComponent, onEditRecommendedPivot: onEditRecommendedPivot, onEditCreatedPivot: onEditPivot, showCreatePivot: true, showPivotEditButton: showPivotEditButton, LabelComponent: LabelComponent, TextComponent: TextComponent }) }))] })) })) }) })] }) }));
 };
 export function generatePivotTableYAxis(pivot, cols, format) {
     // Use the column field for the field and label if there is one

package/dist/esm/utils/getDomain.d.ts.map

@@ -1 +1 @@
-{"version":3,"file":"getDomain.d.ts","sourceRoot":"","sources":["../../../src/utils/getDomain.ts"],"names":[],"mappings":"AAAA;;;;;GAKG;AACH,MAAM,CAAC,OAAO,UAAU,SAAS,CAAC,IAAI,EAAE,GAAG,EAAE,EAAE,MAAM,EAAE,GAAG,EAAE,GAAG,MAAM,EAAE,CA0BtE"}
+{"version":3,"file":"getDomain.d.ts","sourceRoot":"","sources":["../../../src/utils/getDomain.ts"],"names":[],"mappings":"AAAA;;;;;GAKG;AACH,MAAM,CAAC,OAAO,UAAU,SAAS,CAAC,IAAI,EAAE,GAAG,EAAE,EAAE,MAAM,EAAE,GAAG,EAAE,GAAG,MAAM,EAAE,CA8BtE"}

package/dist/esm/utils/getDomain.js

@@ -21,6 +21,9 @@ export default function getDomain(data, fields) {
         });
     });
     const [minValue, maxValue] = numericValues.reduce(([min, max], value) => [Math.min(min, value), Math.max(max, value)], [Infinity, -Infinity]);
+    if (minValue === 0 && maxValue === 0) {
+        return [0, 1];
+    }
     return fuzzyRound(Math.min(minValue, 0), maxValue);
 }
 // Rounds the range to 4 equally-spaced increments of nice,round numbers.

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "@quillsql/react",
-  "version": "2.11.12",
+  "version": "2.11.13",
   "exports": {
     ".": {
       "import": "./dist/esm/index.js",
@@ -24,7 +24,7 @@
     "@monaco-editor/react": "^4.5.1",
     "date-fns": "^2.29.3",
     "date-fns-tz": "^2.0.0",
-    "recharts": "^2.5.0"
+    "recharts": "^2.12.5"
   },
   "devDependencies": {
     "@repo/eslint-config": "*",