@quillsql/react 2.8.5 → 2.8.6

package/dist/ReportBuilder.js

@@ -1,39 +1,33 @@
-"use strict";
-var __importDefault = (this && this.__importDefault) || function (mod) {
-    return (mod && mod.__esModule) ? mod : { "default": mod };
-};
-Object.defineProperty(exports, "__esModule", { value: true });
-exports.getPostgresBasicType = void 0;
-const jsx_runtime_1 = require("react/jsx-runtime");
+import { jsx as _jsx, jsxs as _jsxs } from "react/jsx-runtime";
 // @ts-nocheck
-const react_1 = require("react");
+import { useState, useContext, useCallback, useEffect, useMemo, useRef, } from 'react';
 // import './nightOwlLight.css';
-const Context_1 = require("./Context");
-const SQLEditor_1 = require("./SQLEditor");
-const date_fns_1 = require("date-fns");
-const PivotModal_1 = require("./internals/ReportBuilder/PivotModal");
-const dataFetcher_1 = require("./utils/dataFetcher");
-const Dashboard_1 = require("./Dashboard");
-const dateRangePickerUtils_1 = require("./DateRangePicker/dateRangePickerUtils");
-const Table_1 = __importDefault(require("./Table"));
-const ChartBuilder_1 = __importDefault(require("./ChartBuilder"));
-const UiComponents_1 = require("./components/UiComponents");
-function ReportBuilder({ onChangeQuery, onChangeData, onChangeColumns, onChangeLoading, onChangePivot, onDateFilterChange, onChangeFields, onError, TextInput = UiComponents_1.MemoizedTextInput, containerStyle, Select = UiComponents_1.MemoizedSelect, Button = UiComponents_1.MemoizedButton, SecondaryButton = UiComponents_1.MemoizedSecondaryButton, Header = UiComponents_1.MemoizedHeader, Label = UiComponents_1.MemoizedLabel, DeleteButton = UiComponents_1.MemoizedDeleteButton, Text = UiComponents_1.MemoizedText, Modal = UiComponents_1.MemoizedModal, Popover = UiComponents_1.MemoizedPopover, showTableFormatOptions = false, showDateFieldOptions = false, showAccessControlOptions = false, tagStyle, tableName, dateColumn, selectedTagBorderColor, chartBuilderEnabled = false, destinationDashboard, chartBuilderTitle, chartBuilderButtonLabel, editSQLEnabled, navigateToSQLEditor, }) {
-    const [data, setData] = (0, react_1.useState)([]);
-    const [client, setClient] = (0, react_1.useContext)(Context_1.ClientContext);
-    const [schema, setSchema] = (0, react_1.useContext)(Context_1.SchemaContext);
-    const [theme] = (0, react_1.useContext)(Context_1.ThemeContext);
-    const [columns, setColumns] = (0, react_1.useState)([]);
-    const [fields, setFields] = (0, react_1.useState)([]);
-    const [loading, setLoading] = (0, react_1.useState)(false);
-    const [selectedPivot, setSelectedPivot] = (0, react_1.useState)(null);
+import { ClientContext, SchemaContext, ThemeContext } from './Context';
+import { convertPostgresColumn } from './SQLEditor';
+import { format } from 'date-fns';
+import { PivotModal, generatePivotTable, } from './internals/ReportBuilder/PivotModal';
+import { getData, getDataFromCloud } from './utils/dataFetcher';
+import { QuillDateRangePicker } from './Dashboard';
+import { getRangeFromPreset, reportBuilderOptions, } from './DateRangePicker/dateRangePickerUtils';
+import Table from './Table';
+import ChartBuilder from './ChartBuilder';
+import { MemoizedModal, MemoizedTextInput, MemoizedSelect, MemoizedButton, MemoizedSecondaryButton, MemoizedHeader, MemoizedLabel, MemoizedDeleteButton, MemoizedText, MemoizedPopover, } from './components/UiComponents';
+export default function ReportBuilder({ onChangeQuery, onChangeData, onChangeColumns, onChangeLoading, onChangePivot, onDateFilterChange, onChangeFields, onError, TextInput = MemoizedTextInput, containerStyle, Select = MemoizedSelect, Button = MemoizedButton, SecondaryButton = MemoizedSecondaryButton, Header = MemoizedHeader, Label = MemoizedLabel, DeleteButton = MemoizedDeleteButton, Text = MemoizedText, Modal = MemoizedModal, Popover = MemoizedPopover, showTableFormatOptions = false, showDateFieldOptions = false, showAccessControlOptions = false, tagStyle, tableName, dateColumn, selectedTagBorderColor, chartBuilderEnabled = false, destinationDashboard, chartBuilderTitle, chartBuilderButtonLabel, editSQLEnabled, navigateToSQLEditor, }) {
+    const [data, setData] = useState([]);
+    const [client, setClient] = useContext(ClientContext);
+    const [schema, setSchema] = useContext(SchemaContext);
+    const [theme] = useContext(ThemeContext);
+    const [columns, setColumns] = useState([]);
+    const [fields, setFields] = useState([]);
+    const [loading, setLoading] = useState(false);
+    const [selectedPivot, setSelectedPivot] = useState(null);
     const defaultDateRange = [null, null, null];
-    const [dateRange, setDateRange] = (0, react_1.useState)(defaultDateRange);
-    (0, react_1.useEffect)(() => {
+    const [dateRange, setDateRange] = useState(defaultDateRange);
+    useEffect(() => {
         let isSubscribed = true;
         async function getClient() {
             try {
-                const resp = await (0, dataFetcher_1.getDataFromCloud)(client, `client/${client.publicKey}/`, null, 'GET');
+                const resp = await getDataFromCloud(client, `client/${client.publicKey}/`, null, 'GET');
                 if (resp) {
                     setClient({ ...client, ...resp.client });
                 }
@@ -49,10 +43,10 @@ function ReportBuilder({ onChangeQuery, onChangeData, onChangeColumns, onChangeL
             isSubscribed = false;
         };
     }, []);
-    (0, react_1.useEffect)(() => {
+    useEffect(() => {
         let isSubscribed = true;
         async function getSchema() {
-            const resp = await (0, dataFetcher_1.getDataFromCloud)(client, `schema2/${client.publicKey}/`, null, 'GET');
+            const resp = await getDataFromCloud(client, `schema2/${client.publicKey}/`, null, 'GET');
             if (isSubscribed) {
                 setSchema(resp.tables);
             }
@@ -64,17 +58,17 @@ function ReportBuilder({ onChangeQuery, onChangeData, onChangeColumns, onChangeL
             isSubscribed = false;
         };
     }, []);
-    (0, react_1.useEffect)(() => {
+    useEffect(() => {
         if (onDateFilterChange) {
             onDateFilterChange(dateRange);
         }
     }, [dateRange]);
-    (0, react_1.useEffect)(() => {
+    useEffect(() => {
         if (onDateFilterChange) {
             onDateFilterChange(defaultDateRange);
         }
     }, []);
-    (0, react_1.useEffect)(() => {
+    useEffect(() => {
         setColumns([]);
     }, [tableName]);
     const runQuery = async (query) => {
@@ -85,7 +79,7 @@ function ReportBuilder({ onChangeQuery, onChangeData, onChangeColumns, onChangeL
                 : { query, task: 'query' },
         };
         const cloudBody = { query };
-        const resp = await (0, dataFetcher_1.getData)(client, 'dashquery', 'same-origin', hostedBody, cloudBody);
+        const resp = await getData(client, 'dashquery', 'same-origin', hostedBody, cloudBody);
         if (resp && resp.errorMessage) {
             onError(resp.errorMessage);
             setData([]);
@@ -100,9 +94,9 @@ function ReportBuilder({ onChangeQuery, onChangeData, onChangeColumns, onChangeL
             return;
         }
         setData(resp.rows);
-        setColumns(resp.fields.map(elem => (0, SQLEditor_1.convertPostgresColumn)(elem)));
+        setColumns(resp.fields.map(elem => convertPostgresColumn(elem)));
         if (selectedPivot) {
-            const { rows, columns } = (0, PivotModal_1.generatePivotTable)(selectedPivot, resp.rows, dateRange);
+            const { rows, columns } = generatePivotTable(selectedPivot, resp.rows, dateRange);
             if (onChangePivot) {
                 onChangePivot(selectedPivot, columns, rows);
             }
@@ -112,7 +106,7 @@ function ReportBuilder({ onChangeQuery, onChangeData, onChangeColumns, onChangeL
                 onChangeData(resp.rows);
             }
             if (onChangeColumns) {
-                onChangeColumns(resp.fields.map(elem => (0, SQLEditor_1.convertPostgresColumn)(elem)));
+                onChangeColumns(resp.fields.map(elem => convertPostgresColumn(elem)));
             }
         }
         setFields(resp.fields);
@@ -121,7 +115,7 @@ function ReportBuilder({ onChangeQuery, onChangeData, onChangeColumns, onChangeL
         }
         setLoading(false);
     };
-    (0, react_1.useEffect)(() => {
+    useEffect(() => {
         if (onChangeLoading) {
             onChangeLoading(loading);
         }
@@ -129,18 +123,17 @@ function ReportBuilder({ onChangeQuery, onChangeData, onChangeColumns, onChangeL
     if (!schema || !schema.length || !tableName) {
         return null;
     }
-    return ((0, jsx_runtime_1.jsx)(ReportingTool, { containerStyle: containerStyle, destinationDashboard: destinationDashboard, client: client, editSQLEnabled: editSQLEnabled, navigateToSQLEditor: navigateToSQLEditor, theme: theme, data: data, columns: columns, fields: fields, chartBuilderTitle: chartBuilderTitle, chartBuilderButtonLabel: chartBuilderButtonLabel, onChangeData: onChangeData, onChangeColumns: onChangeColumns, onChangePivot: onChangePivot, selectedPivot: selectedPivot, setSelectedPivot: pivot => {
+    return (_jsx(ReportingTool, { containerStyle: containerStyle, destinationDashboard: destinationDashboard, client: client, editSQLEnabled: editSQLEnabled, navigateToSQLEditor: navigateToSQLEditor, theme: theme, data: data, columns: columns, fields: fields, chartBuilderTitle: chartBuilderTitle, chartBuilderButtonLabel: chartBuilderButtonLabel, onChangeData: onChangeData, onChangeColumns: onChangeColumns, onChangePivot: onChangePivot, selectedPivot: selectedPivot, setSelectedPivot: pivot => {
             setSelectedPivot(pivot);
             if (onChangePivot) {
                 const table = pivot
-                    ? (0, PivotModal_1.generatePivotTable)(pivot, data, dateRange)
+                    ? generatePivotTable(pivot, data, dateRange)
                     : { rows: null, columns: null };
                 onChangePivot(pivot, table.columns, table.rows);
             }
         }, schema: schema, tableName: tableName, dateColumn: dateColumn, selectedTagBorderColor: selectedTagBorderColor, onChangeQuery: onChangeQuery, runQuery: runQuery, dateRange: dateRange, setDateRange: setDateRange, defaultDateRange: defaultDateRange, chartBuilderEnabled: chartBuilderEnabled, HeaderComponent: Header, LabelComponent: Label, SelectComponent: Select, TextComponent: Text, ButtonComponent: Button, SecondaryButtonComponent: SecondaryButton, ModalComponent: Modal, PopoverComponent: Popover, TextInputComponent: TextInput, tagStyle: tagStyle, showTableFormatOptions: showTableFormatOptions, showDateFieldOptions: showDateFieldOptions, showAccessControlOptions: showAccessControlOptions }));
 }
-exports.default = ReportBuilder;
-function getPostgresBasicType(column) {
+export function getPostgresBasicType(column) {
     let format;
     // first check if column.dataTypeID exists
     if (column.dataTypeID) {
@@ -188,7 +181,6 @@ function getPostgresBasicType(column) {
     }
     return format;
 }
-exports.getPostgresBasicType = getPostgresBasicType;
 const newDateWhereAST = (column, dateRange, databaseType) => {
     // all time means no filter
     if (dateRange[2] === 'at') {
@@ -196,7 +188,7 @@ const newDateWhereAST = (column, dateRange, databaseType) => {
     }
     // if using preset
     if (dateRange[2]) {
-        const timeInterval = dateRangePickerUtils_1.reportBuilderOptions.find(elem => elem.value === dateRange[2])?.dayInterval;
+        const timeInterval = reportBuilderOptions.find(elem => elem.value === dateRange[2])?.dayInterval;
         switch (databaseType) {
             case 'BigQuery': {
                 return {
@@ -328,11 +320,11 @@ const newDateWhereAST = (column, dateRange, databaseType) => {
                 value: [
                     {
                         type: 'single_quote_string',
-                        value: (0, date_fns_1.format)(new Date(dateRange[0]), 'MM/dd/yyyy'),
+                        value: format(new Date(dateRange[0]), 'MM/dd/yyyy'),
                     },
                     {
                         type: 'single_quote_string',
-                        value: (0, date_fns_1.format)(new Date(dateRange[1]), 'MM/dd/yyyy'),
+                        value: format(new Date(dateRange[1]), 'MM/dd/yyyy'),
                     },
                 ],
             },
@@ -340,11 +332,11 @@ const newDateWhereAST = (column, dateRange, databaseType) => {
     }
 };
 function ReportingTool({ schema, data, columns, runQuery, SelectComponent, ButtonComponent, SecondaryButtonComponent, editSQLEnabled, navigateToSQLEditor, onChangeQuery, onChangePivot, selectedPivot, setSelectedPivot, theme, ModalComponent, HeaderComponent, PopoverComponent, TextComponent, TextInputComponent, LabelComponent, tagStyle, tableName, dateColumn, selectedTagBorderColor, dateRange, setDateRange, defaultDateRange, chartBuilderEnabled, fields, containerStyle, showTableFormatOptions = false, showDateFieldOptions = false, showAccessControlOptions = false, client, destinationDashboard, chartBuilderTitle, chartBuilderButtonLabel, }) {
-    const selectedTable = (0, react_1.useMemo)(() => schema.find(t => t.displayName === tableName), [schema, tableName]);
-    const [selectedColumn, setSelectedColumn] = (0, react_1.useState)(schema[0].columns.find(elem => elem.name !== 'id'));
-    const parentRef = (0, react_1.useRef)();
-    const [filters, setFilters] = (0, react_1.useState)([]);
-    const [AST, setAST] = (0, react_1.useState)({
+    const selectedTable = useMemo(() => schema.find(t => t.displayName === tableName), [schema, tableName]);
+    const [selectedColumn, setSelectedColumn] = useState(schema[0].columns.find(elem => elem.name !== 'id'));
+    const parentRef = useRef();
+    const [filters, setFilters] = useState([]);
+    const [AST, setAST] = useState({
         with: null,
         type: 'select',
         options: null,
@@ -360,32 +352,32 @@ function ReportingTool({ schema, data, columns, runQuery, SelectComponent, Butto
         limit: { seperator: '', value: [] },
         window: null,
     });
-    const [ASTNoDateColumn, setASTNoDateColumn] = (0, react_1.useState)(AST);
-    const [numberStart, setNumberStart] = (0, react_1.useState)(0);
-    const [numberEnd, setNumberEnd] = (0, react_1.useState)(0);
-    const [filterDateRange, setFilterDateRange] = (0, react_1.useState)((0, dateRangePickerUtils_1.getRangeFromPreset)('90d'));
-    const [computedColumns, setComputedColumns] = (0, react_1.useState)({});
-    const [stringFilterValues, setStringFilterValues] = (0, react_1.useState)([]);
-    const [columnType, setColumnType] = (0, react_1.useState)(getPostgresBasicType(schema[0].columns[0]));
-    const [sqlQuery, setSqlQuery] = (0, react_1.useState)('');
-    const [sqlQueryNoDateColumn, setSqlQueryNoDateColumn] = (0, react_1.useState)('');
-    const [indexBeingEdited, setIndexBeingEdited] = (0, react_1.useState)(-1);
-    const [isAddFilterModalOpen, setIsAddFilterModalOpen] = (0, react_1.useState)(false);
-    const [isEdittingPivot, setIsEdittingPivot] = (0, react_1.useState)(false);
-    const [isPivotModalOpen, setIsPivotModalOpen] = (0, react_1.useState)(false);
-    const [isChartBuilderOpen, setIsChartBuilderOpen] = (0, react_1.useState)(false);
-    const [selectedPivotIndex, setSelectedPivotIndex] = (0, react_1.useState)(-1);
-    const [createdPivots, setCreatedPivots] = (0, react_1.useState)([]);
-    const [recommendedPivots, setRecommendedPivots] = (0, react_1.useState)([]);
-    const [pivotRowField, setPivotRowField] = (0, react_1.useState)(undefined);
-    const [pivotColumnField, setPivotColumnField] = (0, react_1.useState)(undefined);
-    const [pivotValueField, setPivotValueField] = (0, react_1.useState)(undefined);
-    const [pivotAggregation, setPivotAggregation] = (0, react_1.useState)(undefined);
-    const [pivotPopUpTitle, setPivotPopUpTitle] = (0, react_1.useState)('Add Pivot');
-    (0, react_1.useEffect)(() => {
+    const [ASTNoDateColumn, setASTNoDateColumn] = useState(AST);
+    const [numberStart, setNumberStart] = useState(0);
+    const [numberEnd, setNumberEnd] = useState(0);
+    const [filterDateRange, setFilterDateRange] = useState(getRangeFromPreset('90d'));
+    const [computedColumns, setComputedColumns] = useState({});
+    const [stringFilterValues, setStringFilterValues] = useState([]);
+    const [columnType, setColumnType] = useState(getPostgresBasicType(schema[0].columns[0]));
+    const [sqlQuery, setSqlQuery] = useState('');
+    const [sqlQueryNoDateColumn, setSqlQueryNoDateColumn] = useState('');
+    const [indexBeingEdited, setIndexBeingEdited] = useState(-1);
+    const [isAddFilterModalOpen, setIsAddFilterModalOpen] = useState(false);
+    const [isEdittingPivot, setIsEdittingPivot] = useState(false);
+    const [isPivotModalOpen, setIsPivotModalOpen] = useState(false);
+    const [isChartBuilderOpen, setIsChartBuilderOpen] = useState(false);
+    const [selectedPivotIndex, setSelectedPivotIndex] = useState(-1);
+    const [createdPivots, setCreatedPivots] = useState([]);
+    const [recommendedPivots, setRecommendedPivots] = useState([]);
+    const [pivotRowField, setPivotRowField] = useState(undefined);
+    const [pivotColumnField, setPivotColumnField] = useState(undefined);
+    const [pivotValueField, setPivotValueField] = useState(undefined);
+    const [pivotAggregation, setPivotAggregation] = useState(undefined);
+    const [pivotPopUpTitle, setPivotPopUpTitle] = useState('Add Pivot');
+    useEffect(() => {
         setColumnType(getPostgresBasicType(selectedColumn));
     }, [selectedColumn]);
-    (0, react_1.useEffect)(() => {
+    useEffect(() => {
         removePivot();
         setCreatedPivots([]);
         setRecommendedPivots([]);
@@ -398,7 +390,7 @@ function ReportingTool({ schema, data, columns, runQuery, SelectComponent, Butto
             setStringFilterValues([]);
             setNumberStart(0);
             setNumberEnd(0);
-            setFilterDateRange((0, dateRangePickerUtils_1.getRangeFromPreset)('90d'));
+            setFilterDateRange(getRangeFromPreset('90d'));
             return;
         }
         setSelectedColumn(matchingColumn);
@@ -416,9 +408,9 @@ function ReportingTool({ schema, data, columns, runQuery, SelectComponent, Butto
             setIndexBeingEdited(index);
         }
     };
-    const selectedPivotTable = (0, react_1.useMemo)(() => {
+    const selectedPivotTable = useMemo(() => {
         if (selectedPivot && data) {
-            return (0, PivotModal_1.generatePivotTable)(selectedPivot, data, dateRange);
+            return generatePivotTable(selectedPivot, data, dateRange);
         }
         else {
             return {};
@@ -434,7 +426,7 @@ function ReportingTool({ schema, data, columns, runQuery, SelectComponent, Butto
     const selectPivot = (pivot, index) => {
         setSelectedPivotIndex(index);
         setSelectedPivot(pivot);
-        const pivotTable = (0, PivotModal_1.generatePivotTable)(pivot, data, dateRange);
+        const pivotTable = generatePivotTable(pivot, data, dateRange);
         if (onChangePivot) {
             onChangePivot(pivot, pivotTable.columns, pivotTable.rows);
         }
@@ -468,9 +460,9 @@ function ReportingTool({ schema, data, columns, runQuery, SelectComponent, Butto
             }
             else if (columnType === 'date') {
                 const label = filterDateRange[2]
-                    ? dateRangePickerUtils_1.reportBuilderOptions.find(elem => elem.value === filterDateRange[2])
+                    ? reportBuilderOptions.find(elem => elem.value === filterDateRange[2])
                         ?.text
-                    : `${(0, date_fns_1.format)(new Date(filterDateRange[0]), 'MMM dd')} - ${(0, date_fns_1.format)(new Date(filterDateRange[1]), 'MMM dd')}`;
+                    : `${format(new Date(filterDateRange[0]), 'MMM dd')} - ${format(new Date(filterDateRange[1]), 'MMM dd')}`;
                 setFilters(filters => {
                     const newFilters = [...filters];
                     newFilters[index] = {
@@ -485,7 +477,7 @@ function ReportingTool({ schema, data, columns, runQuery, SelectComponent, Butto
             setStringFilterValues([]);
             setNumberStart(0);
             setNumberEnd(0);
-            setFilterDateRange((0, dateRangePickerUtils_1.getRangeFromPreset)('90d'));
+            setFilterDateRange(getRangeFromPreset('90d'));
             setIndexBeingEdited(-1);
             return;
         }
@@ -510,7 +502,7 @@ function ReportingTool({ schema, data, columns, runQuery, SelectComponent, Butto
                 setStringFilterValues([]);
                 setNumberStart(0);
                 setNumberEnd(0);
-                setFilterDateRange((0, dateRangePickerUtils_1.getRangeFromPreset)('90d'));
+                setFilterDateRange(getRangeFromPreset('90d'));
                 return;
             }
             else if (columnType === 'number') {
@@ -529,14 +521,14 @@ function ReportingTool({ schema, data, columns, runQuery, SelectComponent, Butto
                 setStringFilterValues([]);
                 setNumberStart(0);
                 setNumberEnd(0);
-                setFilterDateRange((0, dateRangePickerUtils_1.getRangeFromPreset)('90d'));
+                setFilterDateRange(getRangeFromPreset('90d'));
                 return;
             }
             else if (columnType === 'date') {
                 const label = filterDateRange[2]
-                    ? dateRangePickerUtils_1.reportBuilderOptions.find(elem => elem.value === filterDateRange[2])
+                    ? reportBuilderOptions.find(elem => elem.value === filterDateRange[2])
                         ?.text
-                    : `${(0, date_fns_1.format)(new Date(filterDateRange[0]), 'MMM dd')} - ${(0, date_fns_1.format)(new Date(filterDateRange[1]), 'MMM dd')}`;
+                    : `${format(new Date(filterDateRange[0]), 'MMM dd')} - ${format(new Date(filterDateRange[1]), 'MMM dd')}`;
                 setFilters(filters => {
                     return [
                         ...filters,
@@ -551,7 +543,7 @@ function ReportingTool({ schema, data, columns, runQuery, SelectComponent, Butto
                 setStringFilterValues([]);
                 setNumberStart(0);
                 setNumberEnd(0);
-                setFilterDateRange((0, dateRangePickerUtils_1.getRangeFromPreset)('90d'));
+                setFilterDateRange(getRangeFromPreset('90d'));
             }
         }
     };
@@ -561,7 +553,7 @@ function ReportingTool({ schema, data, columns, runQuery, SelectComponent, Butto
             runQuery(queryToUse);
         }
     };
-    (0, react_1.useEffect)(() => {
+    useEffect(() => {
         // if selected table changes, clear everything
         if (selectedTable.displayName !== AST.from.table) {
             setSelectedColumn(selectedTable.columns.find(elem => elem.name !== 'id'));
@@ -669,7 +661,7 @@ function ReportingTool({ schema, data, columns, runQuery, SelectComponent, Butto
         }
     };
     // USE EFFECT HOOK THAT TRANSFORMS "FILTERS ARRAY INTO AST"
-    (0, react_1.useEffect)(() => {
+    useEffect(() => {
         if (filters.length || dateRange) {
             setAST(generateNewAST(true));
             setASTNoDateColumn(generateNewAST(false));
@@ -683,7 +675,7 @@ function ReportingTool({ schema, data, columns, runQuery, SelectComponent, Butto
         });
         setIndexBeingEdited(-1);
     };
-    const computeStats = (0, react_1.useCallback)(column => {
+    const computeStats = useCallback(column => {
         if ((!computedColumns[column.name] ||
             computedColumns[column.name].length === 0) &&
             data) {
@@ -721,7 +713,7 @@ function ReportingTool({ schema, data, columns, runQuery, SelectComponent, Butto
         }
     }, [data, computedColumns]);
     // Call this function whenever the selected column changes
-    (0, react_1.useEffect)(() => {
+    useEffect(() => {
         computeStats(selectedColumn);
     }, [selectedColumn, data]);
     // Use the results directly in your component
@@ -736,11 +728,11 @@ function ReportingTool({ schema, data, columns, runQuery, SelectComponent, Butto
     //     }
     //   }
     // }, [AST]);
-    (0, react_1.useEffect)(() => {
+    useEffect(() => {
         const getSqlQueryFromAST = async () => {
             try {
                 if (AST && AST.from[0].table) {
-                    const resp = await (0, dataFetcher_1.getDataFromCloud)(client, 'sqlify', {
+                    const resp = await getDataFromCloud(client, 'sqlify', {
                         ast: AST,
                     });
                     const newSqlQuery = resp.query; // assuming the response contains the SQL query
@@ -757,11 +749,11 @@ function ReportingTool({ schema, data, columns, runQuery, SelectComponent, Butto
         };
         getSqlQueryFromAST();
     }, [AST]);
-    (0, react_1.useEffect)(() => {
+    useEffect(() => {
         const getSqlQueryFromAST = async () => {
             try {
                 if (ASTNoDateColumn && ASTNoDateColumn.from[0].table) {
-                    const resp = await (0, dataFetcher_1.getDataFromCloud)(client, 'sqlify', {
+                    const resp = await getDataFromCloud(client, 'sqlify', {
                         ast: ASTNoDateColumn,
                     });
                     const newSqlQuery = resp.query; // assuming the response contains the SQL query
@@ -779,19 +771,19 @@ function ReportingTool({ schema, data, columns, runQuery, SelectComponent, Butto
     if (!schema || !schema.length) {
         return null;
     }
-    return ((0, jsx_runtime_1.jsxs)("div", { style: { fontFamily: theme?.fontFamily, ...containerStyle }, ref: parentRef, children: [(0, jsx_runtime_1.jsx)("div", { style: {
+    return (_jsxs("div", { style: { fontFamily: theme?.fontFamily, ...containerStyle }, ref: parentRef, children: [_jsx("div", { style: {
                     display: 'flex',
                     // marginLeft: '25px',
                     // marginRight: '25px',
                     justifyContent: 'end',
-                }, children: (0, jsx_runtime_1.jsxs)("div", { style: { display: 'flex', flexDirection: 'row', gap: '12px' }, children: [editSQLEnabled && ((0, jsx_runtime_1.jsx)(SecondaryButtonComponent, { onClick: () => {
+                }, children: _jsxs("div", { style: { display: 'flex', flexDirection: 'row', gap: '12px' }, children: [editSQLEnabled && (_jsx(SecondaryButtonComponent, { onClick: () => {
                                 if (navigateToSQLEditor) {
                                     navigateToSQLEditor(sqlQuery);
                                 }
-                            }, label: "Edit Query" })), (0, jsx_runtime_1.jsx)(AddFilterModal2, { filters: filters, selectedColumn: selectedColumn, numberStart: numberStart, numberEnd: numberEnd, setDateRange: setFilterDateRange, dateRange: filterDateRange, columnStats: columnStats, stringFilterValues: stringFilterValues, setStringFilterValues: setStringFilterValues, addFilter: addFilter, parentRef: parentRef, setSelectedColumn: setSelectedColumn, setNumberStart: setNumberStart, setNumberEnd: setNumberEnd, selectedTable: selectedTable, columnType: columnType, removeFilter: removeFilter, selectFilter: selectFilter, indexBeingEdited: indexBeingEdited, updateFilter: updateFilter, SelectComponent: SelectComponent, ButtonComponent: ButtonComponent, PopoverComponent: PopoverComponent, TextInputComponent: TextInputComponent, LabelComponent: LabelComponent, tagStyle: tagStyle, theme: theme, setIsOpen: setIsAddFilterModalOpen, isOpen: isAddFilterModalOpen, selectedTagBorderColor: selectedTagBorderColor }), (0, jsx_runtime_1.jsx)(PivotModal_1.PivotModal, { pivotRowField: pivotRowField, setPivotRowField: setPivotRowField, pivotColumnField: pivotColumnField, setPivotColumnField: setPivotColumnField, pivotValueField: pivotValueField, setPivotValueField: setPivotValueField, pivotAggregation: pivotAggregation, setPivotAggregation: setPivotAggregation, createdPivots: createdPivots, setCreatedPivots: setCreatedPivots, recommendedPivots: recommendedPivots, setRecommendedPivots: setRecommendedPivots, selectedTable: selectedTable, SelectComponent: SelectComponent, ButtonComponent: ButtonComponent, PopoverComponent: PopoverComponent, LabelComponent: LabelComponent, HeaderComponent: HeaderComponent, TextComponent: TextComponent, popUpTitle: pivotPopUpTitle, setPopUpTitle: setPivotPopUpTitle, theme: theme, data: data, parentRef: parentRef, columns: columns, setIsOpen: setIsPivotModalOpen, isOpen: isPivotModalOpen, showUpdatePivot: isEdittingPivot, setShowUpdatePivot: setIsEdittingPivot, selectedPivotIndex: selectedPivotIndex, setSelectedPivotIndex: setSelectedPivotIndex, removePivot: removePivot, selectPivot: selectPivot, dateRange: dateRange, rightAlign: true })] }) }), (0, jsx_runtime_1.jsx)(Table_1.default, { rows: selectedPivotTable?.rows || data, columns: selectedPivotTable?.columns || columns, containerStyle: {
+                            }, label: "Edit Query" })), _jsx(AddFilterModal2, { filters: filters, selectedColumn: selectedColumn, numberStart: numberStart, numberEnd: numberEnd, setDateRange: setFilterDateRange, dateRange: filterDateRange, columnStats: columnStats, stringFilterValues: stringFilterValues, setStringFilterValues: setStringFilterValues, addFilter: addFilter, parentRef: parentRef, setSelectedColumn: setSelectedColumn, setNumberStart: setNumberStart, setNumberEnd: setNumberEnd, selectedTable: selectedTable, columnType: columnType, removeFilter: removeFilter, selectFilter: selectFilter, indexBeingEdited: indexBeingEdited, updateFilter: updateFilter, SelectComponent: SelectComponent, ButtonComponent: ButtonComponent, PopoverComponent: PopoverComponent, TextInputComponent: TextInputComponent, LabelComponent: LabelComponent, tagStyle: tagStyle, theme: theme, setIsOpen: setIsAddFilterModalOpen, isOpen: isAddFilterModalOpen, selectedTagBorderColor: selectedTagBorderColor }), _jsx(PivotModal, { pivotRowField: pivotRowField, setPivotRowField: setPivotRowField, pivotColumnField: pivotColumnField, setPivotColumnField: setPivotColumnField, pivotValueField: pivotValueField, setPivotValueField: setPivotValueField, pivotAggregation: pivotAggregation, setPivotAggregation: setPivotAggregation, createdPivots: createdPivots, setCreatedPivots: setCreatedPivots, recommendedPivots: recommendedPivots, setRecommendedPivots: setRecommendedPivots, selectedTable: selectedTable, SelectComponent: SelectComponent, ButtonComponent: ButtonComponent, PopoverComponent: PopoverComponent, LabelComponent: LabelComponent, HeaderComponent: HeaderComponent, TextComponent: TextComponent, popUpTitle: pivotPopUpTitle, setPopUpTitle: setPivotPopUpTitle, theme: theme, data: data, parentRef: parentRef, columns: columns, setIsOpen: setIsPivotModalOpen, isOpen: isPivotModalOpen, showUpdatePivot: isEdittingPivot, setShowUpdatePivot: setIsEdittingPivot, selectedPivotIndex: selectedPivotIndex, setSelectedPivotIndex: setSelectedPivotIndex, removePivot: removePivot, selectPivot: selectPivot, dateRange: dateRange, rightAlign: true })] }) }), _jsx(Table, { rows: selectedPivotTable?.rows || data, columns: selectedPivotTable?.columns || columns, containerStyle: {
                     height: 400,
                     marginTop: 10,
-                } }), chartBuilderEnabled && columns.length > 0 && ((0, jsx_runtime_1.jsxs)("div", { children: [(0, jsx_runtime_1.jsx)("div", { style: {
+                } }), chartBuilderEnabled && columns.length > 0 && (_jsxs("div", { children: [_jsx("div", { style: {
                             display: 'flex',
                             flexDirection: 'row',
                             alignItems: 'center',
@@ -799,7 +791,7 @@ function ReportingTool({ schema, data, columns, runQuery, SelectComponent, Butto
                             width: '100%',
                             height: '70px',
                             gap: '8px',
-                        }, children: (0, jsx_runtime_1.jsx)(ButtonComponent, { onClick: () => setIsChartBuilderOpen(true), label: "Add to dashboard" }) }), (0, jsx_runtime_1.jsx)(ChartBuilder_1.default, { rows: data, columns: columns, fields: fields, query: sqlQuery, queryNoDateColumn: sqlQueryNoDateColumn, pivot: selectedPivot, title: chartBuilderTitle, buttonLabel: chartBuilderButtonLabel, isOpen: isChartBuilderOpen, setIsOpen: setIsChartBuilderOpen, showTableFormatOptions: showTableFormatOptions, showDateFieldOptions: showDateFieldOptions, showAccessControlOptions: showAccessControlOptions, dateRange: dateRange, recommendedPivots: recommendedPivots, destinationDashboard: destinationDashboard, dateColumn: dateColumn })] }))] }));
+                        }, children: _jsx(ButtonComponent, { onClick: () => setIsChartBuilderOpen(true), label: "Add to dashboard" }) }), _jsx(ChartBuilder, { rows: data, columns: columns, fields: fields, query: sqlQuery, queryNoDateColumn: sqlQueryNoDateColumn, pivot: selectedPivot, title: chartBuilderTitle, buttonLabel: chartBuilderButtonLabel, isOpen: isChartBuilderOpen, setIsOpen: setIsChartBuilderOpen, showTableFormatOptions: showTableFormatOptions, showDateFieldOptions: showDateFieldOptions, showAccessControlOptions: showAccessControlOptions, dateRange: dateRange, recommendedPivots: recommendedPivots, destinationDashboard: destinationDashboard, dateColumn: dateColumn })] }))] }));
 }
 function FilterTag({ Label, id, label, removeFilter, isSelected, index, setIsOpen, selectFilter, theme, tagStyle, selectedTagBorderColor, }) {
     const handleRemoveFilter = () => {
@@ -833,11 +825,11 @@ function FilterTag({ Label, id, label, removeFilter, isSelected, index, setIsOpe
             ? selectedTagBorderColor || '#B3B4BD'
             : styles.borderColor || '#EFF0FC',
     };
-    return ((0, jsx_runtime_1.jsxs)("div", { id: id, onClick: handleSelectFilter, style: { ...styles, ...borderColor }, children: [(0, jsx_runtime_1.jsx)("div", { style: {
+    return (_jsxs("div", { id: id, onClick: handleSelectFilter, style: { ...styles, ...borderColor }, children: [_jsx("div", { style: {
                     textOverflow: 'ellipsis',
                     whiteSpace: 'nowrap',
                     overflow: 'hidden',
-                }, children: label }), (0, jsx_runtime_1.jsx)("div", { 
+                }, children: label }), _jsx("div", { 
                 // onClick={handleRemoveFilter}
                 onClick: e => {
                     e.stopPropagation(); // Prevents the event from bubbling up to the parent
@@ -848,19 +840,19 @@ function FilterTag({ Label, id, label, removeFilter, isSelected, index, setIsOpe
                     alignItems: 'center',
                     cursor: 'pointer',
                     paddingLeft: '6px',
-                }, children: (0, jsx_runtime_1.jsx)("svg", { xmlns: "http://www.w3.org/2000/svg", viewBox: "0 0 24 24", fill: tagStyle?.color || theme?.primaryTextColor, height: "20", width: "20", children: (0, jsx_runtime_1.jsx)("path", { fillRule: "evenodd", d: "M5.47 5.47a.75.75 0 011.06 0L12 10.94l5.47-5.47a.75.75 0 111.06 1.06L13.06 12l5.47 5.47a.75.75 0 11-1.06 1.06L12 13.06l-5.47 5.47a.75.75 0 01-1.06-1.06L10.94 12 5.47 6.53a.75.75 0 010-1.06z", clipRule: "evenodd" }) }) })] }));
+                }, children: _jsx("svg", { xmlns: "http://www.w3.org/2000/svg", viewBox: "0 0 24 24", fill: tagStyle?.color || theme?.primaryTextColor, height: "20", width: "20", children: _jsx("path", { fillRule: "evenodd", d: "M5.47 5.47a.75.75 0 011.06 0L12 10.94l5.47-5.47a.75.75 0 111.06 1.06L13.06 12l5.47 5.47a.75.75 0 11-1.06 1.06L12 13.06l-5.47 5.47a.75.75 0 01-1.06-1.06L10.94 12 5.47 6.53a.75.75 0 010-1.06z", clipRule: "evenodd" }) }) })] }));
 }
 const AddFilterModal2 = ({ filters, selectedColumn, numberStart, numberEnd, setDateRange, dateRange, columnStats, stringFilterValues, setStringFilterValues, addFilter, setSelectedColumn, setNumberStart, setNumberEnd, selectedTable, columnType, removeFilter, selectFilter, indexBeingEdited, updateFilter, SelectComponent, ButtonComponent, PopoverComponent, LabelComponent, theme, TextInputComponent, tagStyle, selectedTagBorderColor, parentRef, }) => {
-    const [isOpen, setIsOpen] = (0, react_1.useState)(false);
-    return ((0, jsx_runtime_1.jsxs)("div", { style: { display: 'flex', flexDirection: 'column' }, children: [(0, jsx_runtime_1.jsxs)("div", { style: {
+    const [isOpen, setIsOpen] = useState(false);
+    return (_jsxs("div", { style: { display: 'flex', flexDirection: 'column' }, children: [_jsxs("div", { style: {
                     position: 'relative',
                     display: 'inline-block',
                     textAlign: 'left',
-                }, children: [(0, jsx_runtime_1.jsx)("div", { style: {
+                }, children: [_jsx("div", { style: {
                             display: 'flex',
                             flexDirection: 'row',
                             alignItems: 'center',
-                        }, children: filters.length > 0 && ((0, jsx_runtime_1.jsx)("span", { style: {
+                        }, children: filters.length > 0 && (_jsx("span", { style: {
                                 height: 10,
                                 width: 10,
                                 backgroundColor: theme.primaryButtonColor,
@@ -868,11 +860,11 @@ const AddFilterModal2 = ({ filters, selectedColumn, numberStart, numberEnd, setD
                                 position: 'absolute',
                                 top: -2,
                                 right: -2,
-                            } })) }), (0, jsx_runtime_1.jsx)(PopoverComponent, { parentRef: parentRef, label: "Add filter", style: { right: 0, minWidth: 400, overflow: 'visible' }, isOpen: isOpen, onClose: () => setIsOpen(false), title: "Add filter", setIsOpen: setIsOpen, children: (0, jsx_runtime_1.jsxs)("div", { style: {
+                            } })) }), _jsx(PopoverComponent, { parentRef: parentRef, label: "Add filter", style: { right: 0, minWidth: 400, overflow: 'visible' }, isOpen: isOpen, onClose: () => setIsOpen(false), title: "Add filter", setIsOpen: setIsOpen, children: _jsxs("div", { style: {
                                 backgroundColor: 'rgb(255, 255, 255)',
                                 display: 'flex',
                                 flexDirection: 'column',
-                            }, children: [filters.length > 0 && ((0, jsx_runtime_1.jsx)("div", { style: { paddingBottom: 20 }, children: (0, jsx_runtime_1.jsx)("div", { style: {
+                            }, children: [filters.length > 0 && (_jsx("div", { style: { paddingBottom: 20 }, children: _jsx("div", { style: {
                                             overflowY: 'scroll',
                                             maxHeight: '300px',
                                             display: 'flex',
@@ -880,38 +872,38 @@ const AddFilterModal2 = ({ filters, selectedColumn, numberStart, numberEnd, setD
                                             flexDirection: 'row',
                                             flexWrap: 'wrap',
                                             alignItems: 'center',
-                                        }, children: filters.map((elem, index) => ((0, jsx_runtime_1.jsx)(FilterTag, { id: "filter-tag", Label: LabelComponent, label: elem.tag, removeFilter: removeFilter, selectFilter: selectFilter, isSelected: index === indexBeingEdited, index: index, theme: theme, setIsOpen: setIsOpen, tagStyle: tagStyle, selectedTagBorderColor: selectedTagBorderColor }, 'filter' + index))) }) })), (0, jsx_runtime_1.jsx)(LabelComponent, { children: "Column" }), (0, jsx_runtime_1.jsx)(SelectComponent, { label: 'Column', id: "custom-select", value: selectedColumn.name, onChange: e => {
+                                        }, children: filters.map((elem, index) => (_jsx(FilterTag, { id: "filter-tag", Label: LabelComponent, label: elem.tag, removeFilter: removeFilter, selectFilter: selectFilter, isSelected: index === indexBeingEdited, index: index, theme: theme, setIsOpen: setIsOpen, tagStyle: tagStyle, selectedTagBorderColor: selectedTagBorderColor }, 'filter' + index))) }) })), _jsx(LabelComponent, { children: "Column" }), _jsx(SelectComponent, { label: 'Column', id: "custom-select", value: selectedColumn.name, onChange: e => {
                                         const column = selectedTable.columns.find(c => c.name === e);
                                         setSelectedColumn(column);
                                     }, options: selectedTable.columns
                                         .filter(elem => !(elem.name === 'id' || elem.name.endsWith('_id')))
                                         .map(elem => {
                                         return { label: elem.name, value: elem.name };
-                                    }) }), columnType === 'number' && ((0, jsx_runtime_1.jsx)("div", { children: (0, jsx_runtime_1.jsxs)("div", { style: {
+                                    }) }), columnType === 'number' && (_jsx("div", { children: _jsxs("div", { style: {
                                             display: 'flex',
                                             flexDirection: 'row',
                                             alignItems: 'center',
                                             justifyContent: 'space-between',
-                                        }, children: [(0, jsx_runtime_1.jsxs)("div", { style: {
+                                        }, children: [_jsxs("div", { style: {
                                                     display: 'flex',
                                                     flexDirection: 'column',
                                                     marginTop: '20px',
-                                                }, children: [(0, jsx_runtime_1.jsx)(LabelComponent, { children: "Minimum" }), (0, jsx_runtime_1.jsx)(TextInputComponent, { id: "min-input", value: numberStart, placeholder: "Minimum", onChange: value => setNumberStart(value) })] }), (0, jsx_runtime_1.jsx)("div", { style: { width: 16 } }), (0, jsx_runtime_1.jsxs)("div", { style: {
+                                                }, children: [_jsx(LabelComponent, { children: "Minimum" }), _jsx(TextInputComponent, { id: "min-input", value: numberStart, placeholder: "Minimum", onChange: value => setNumberStart(value) })] }), _jsx("div", { style: { width: 16 } }), _jsxs("div", { style: {
                                                     display: 'flex',
                                                     flexDirection: 'column',
                                                     marginTop: '20px',
-                                                }, children: [(0, jsx_runtime_1.jsx)(LabelComponent, { children: "Maximum" }), (0, jsx_runtime_1.jsx)(TextInputComponent, { id: "max-input", placeholder: "Maximum", value: numberEnd, onChange: value => setNumberEnd(value) })] })] }) })), columnType === 'date' && ((0, jsx_runtime_1.jsx)("div", { style: {
+                                                }, children: [_jsx(LabelComponent, { children: "Maximum" }), _jsx(TextInputComponent, { id: "max-input", placeholder: "Maximum", value: numberEnd, onChange: value => setNumberEnd(value) })] })] }) })), columnType === 'date' && (_jsx("div", { style: {
                                         display: 'flex',
                                         flexDirection: 'row',
                                         justifyContent: 'space-between',
                                         marginTop: 20,
-                                    }, children: (0, jsx_runtime_1.jsx)(Dashboard_1.QuillDateRangePicker, { dateRange: dateRange ? [dateRange[0], dateRange[1]] : [null, null], label: '', onChangeDateRange: dateRange => {
+                                    }, children: _jsx(QuillDateRangePicker, { dateRange: dateRange ? [dateRange[0], dateRange[1]] : [null, null], label: '', onChangeDateRange: dateRange => {
                                             setDateRange([dateRange[0], dateRange[1], null]);
                                         }, preset: dateRange && dateRange.length === 3 && dateRange[2] !== null
                                             ? dateRange[2]
                                             : '', onChangePreset: preset => {
                                             if (typeof preset === 'string') {
-                                                setDateRange((0, dateRangePickerUtils_1.getRangeFromPreset)(preset));
+                                                setDateRange(getRangeFromPreset(preset));
                                                 return;
                                             }
                                             setDateRange([
@@ -919,28 +911,28 @@ const AddFilterModal2 = ({ filters, selectedColumn, numberStart, numberEnd, setD
                                                 new Date(),
                                                 preset?.value || '',
                                             ]);
-                                        }, presetOptions: dateRangePickerUtils_1.reportBuilderOptions }) })), columnType === 'string' &&
+                                        }, presetOptions: reportBuilderOptions }) })), columnType === 'string' &&
                                     columnStats &&
-                                    columnStats.length > 0 && ((0, jsx_runtime_1.jsx)("div", { style: {
+                                    columnStats.length > 0 && (_jsx("div", { style: {
                                         flex: 'flex',
                                         flexDirection: 'column',
                                         marginTop: '14px',
                                         overflow: 'hidden',
-                                    }, children: columnStats.map(value => ((0, jsx_runtime_1.jsx)("div", { style: {
+                                    }, children: columnStats.map(value => (_jsx("div", { style: {
                                             display: 'flex',
                                             flexDirection: 'row',
                                             alignItems: 'center',
-                                        }, children: (0, jsx_runtime_1.jsxs)("div", { style: {
+                                        }, children: _jsxs("div", { style: {
                                                 display: 'flex',
                                                 flexDirection: 'row',
                                                 alignItems: 'center',
                                                 paddingTop: 6,
                                                 paddingBottom: 6,
-                                            }, children: [(0, jsx_runtime_1.jsx)(DivCheckbox, { theme: theme, checked: stringFilterValues.includes(value), onChange: () => {
+                                            }, children: [_jsx(DivCheckbox, { theme: theme, checked: stringFilterValues.includes(value), onChange: () => {
                                                         setStringFilterValues(prev => prev.includes(value)
                                                             ? prev.filter(v => v !== value)
                                                             : [...prev, value]);
-                                                    } }), (0, jsx_runtime_1.jsx)("div", { style: {
+                                                    } }), _jsx("div", { style: {
                                                         marginLeft: 6,
                                                         display: 'block',
                                                         overflow: 'hidden',
@@ -948,7 +940,7 @@ const AddFilterModal2 = ({ filters, selectedColumn, numberStart, numberEnd, setD
                                                         whiteSpace: 'nowrap',
                                                         color: theme?.primaryTextColor,
                                                         fontFamily: theme?.fontFamily,
-                                                    }, children: value })] }, value) }, value))) })), (0, jsx_runtime_1.jsx)("div", { style: { height: 20 } }), (0, jsx_runtime_1.jsx)("div", { children: (0, jsx_runtime_1.jsx)(ButtonComponent, { id: "custom-button", onClick: () => {
+                                                    }, children: value })] }, value) }, value))) })), _jsx("div", { style: { height: 20 } }), _jsx("div", { children: _jsx(ButtonComponent, { id: "custom-button", onClick: () => {
                                             if (columnType === 'date' && !dateRange) {
                                                 return;
                                             }
@@ -957,7 +949,7 @@ const AddFilterModal2 = ({ filters, selectedColumn, numberStart, numberEnd, setD
                                                 return;
                                             }
                                             addFilter();
-                                        }, label: indexBeingEdited > -1 ? 'Edit filter' : 'Add filter' }) })] }) })] }), (0, jsx_runtime_1.jsx)("div", { style: { height: '12px' } })] }));
+                                        }, label: indexBeingEdited > -1 ? 'Edit filter' : 'Add filter' }) })] }) })] }), _jsx("div", { style: { height: '12px' } })] }));
 };
 const DivCheckbox = ({ onChange, checked, theme }) => {
     const toggleCheckbox = () => {
@@ -981,7 +973,7 @@ const DivCheckbox = ({ onChange, checked, theme }) => {
         alignItems: 'center',
         justifyContent: 'center',
     };
-    return ((0, jsx_runtime_1.jsx)("div", { style: style, onClick: toggleCheckbox, "aria-checked": checked, 
+    return (_jsx("div", { style: style, onClick: toggleCheckbox, "aria-checked": checked, 
         // className="shadow-sm"
         role: "checkbox", children: checked && (
         // <CheckIcon
@@ -989,5 +981,5 @@ const DivCheckbox = ({ onChange, checked, theme }) => {
         //   className="text-white"
         //   aria-hidden="true"
         // />
-        (0, jsx_runtime_1.jsx)("svg", { xmlns: "http://www.w3.org/2000/svg", viewBox: "0 0 24 24", fill: theme?.backgroundColor, height: "16", width: "16", children: (0, jsx_runtime_1.jsx)("path", { fillRule: "evenodd", d: "M19.916 4.626a.75.75 0 01.208 1.04l-9 13.5a.75.75 0 01-1.154.114l-6-6a.75.75 0 011.06-1.06l5.353 5.353 8.493-12.739a.75.75 0 011.04-.208z", clipRule: "evenodd" }) })) }));
+        _jsx("svg", { xmlns: "http://www.w3.org/2000/svg", viewBox: "0 0 24 24", fill: theme?.backgroundColor, height: "16", width: "16", children: _jsx("path", { fillRule: "evenodd", d: "M19.916 4.626a.75.75 0 01.208 1.04l-9 13.5a.75.75 0 01-1.154.114l-6-6a.75.75 0 011.06-1.06l5.353 5.353 8.493-12.739a.75.75 0 011.04-.208z", clipRule: "evenodd" }) })) }));
 };