@economic/taco 2.5.0 → 2.6.0

package/dist/esm/packages/taco/src/components/Table3/hooks/useConvertChildrenToColumns.js.map

@@ -1 +1 @@
-{"version":3,"file":"useConvertChildrenToColumns.js","sources":["../../../../../../../../src/components/Table3/hooks/useConvertChildrenToColumns.tsx"],"sourcesContent":["import React from 'react';\nimport { ColumnDef, ColumnSizingState, createColumnHelper, ColumnSort, VisibilityState } from '@tanstack/react-table';\nimport { Table3ColumnProps, Table3Props, Table3Options, Table3ColumnDataType, Table3SortFn } from '../types';\nimport { Header } from '../components/columns/header/Header';\nimport { Footer } from '../components/columns/footer/Footer';\nimport { Cell } from '../components/columns/cell/Cell';\nimport { createRowSelectionColumn } from '../components/columns/internal/Selection';\nimport { MIN_COLUMN_SIZE } from '../components/columns/styles';\nimport { createRowActionsColumn } from '../components/columns/internal/Actions';\nimport { createRowExpansionColumn } from '../components/columns/internal/Expansion';\nimport { createRowDragColumn } from '../components/columns/internal/Drag';\nimport { createRowEditingActionsColumn } from '../components/columns/internal/EditingActions';\nimport { useEditing } from './features/useEditing';\n\nfunction getSortingFn<TType = unknown>(dataType?: Table3ColumnDataType, customFnOrBuiltIn?: Table3SortFn<TType>) {\n    if (typeof customFnOrBuiltIn === 'function') {\n        return (rowA, rowB, columnId) => customFnOrBuiltIn(rowA.original, rowB.original, columnId);\n    }\n\n    // if a built in is being used, just return that\n    if (customFnOrBuiltIn) {\n        return customFnOrBuiltIn;\n    }\n\n    // some times we alias based on the type\n    if (dataType && dataType !== 'boolean' && dataType !== 'number') {\n        return dataType;\n    }\n\n    // otherwise fall back to auto\n    return 'auto';\n}\n\nexport function useConvertChildrenToColumns<TType = unknown>(\n    props: Table3Props<TType>,\n    options: Table3Options,\n    editing: ReturnType<typeof useEditing>\n) {\n    const columnHelper = createColumnHelper<TType>();\n\n    const columns: ColumnDef<TType>[] = [];\n    const defaultColumnSizing: ColumnSizingState = {};\n    const defaultColumnVisibility: VisibilityState = {};\n    const defaultSorting: ColumnSort[] = [];\n\n    (React.Children.toArray(props.children) as React.ReactElement<Table3ColumnProps<TType>>[])\n        .filter(child => !!child) // remove falsey children\n        .forEach(child => {\n            if (React.isValidElement<Table3ColumnProps<TType>>(child) && child.props.accessor) {\n                if (child.props.defaultWidth) {\n                    defaultColumnSizing[child.props.accessor as string] =\n                        child.props.defaultWidth === 'grow' ? '1fr' : (child.props.defaultWidth as any);\n                }\n\n                if (child.props.defaultHidden && options.enableColumnHiding) {\n                    defaultColumnVisibility[child.props.accessor as string] = false;\n                }\n\n                if (child.props.sort !== undefined) {\n                    defaultSorting.push({\n                        id: child.props.accessor as string,\n                        desc: child.props.sort === 'desc',\n                    });\n                }\n\n                columns.push({\n                    accessorKey: child.props.accessor,\n                    id: child.props.accessor as string,\n                    header: Header,\n                    cell: Cell,\n                    footer: Footer,\n                    // sizing\n                    minSize: MIN_COLUMN_SIZE,\n                    enableResizing: child.props.enableResizing ?? true,\n                    // filtering\n                    enableColumnFilter: child.props.enableFiltering ?? true,\n                    filterFn: 'tacoFilter' as any,\n                    // sorting\n                    enableSorting: child.props.enableSorting ?? true,\n                    sortingFn: getSortingFn<TType>(child.props.dataType, child.props.sortFn),\n                    sortDescFirst: false,\n                    sortUndefined: 1,\n                    // visibility\n                    enableHiding: child.props.enableHiding ?? true,\n                    // custom options\n                    meta: {\n                        align: child.props.align,\n                        className: child.props.className,\n                        control: child.props.control,\n                        dataType: child.props.dataType,\n                        enableOrdering: child.props.enableOrdering ?? true,\n                        enableSearch: child.props.enableSearch ?? true,\n                        enableTruncate: child.props.enableTruncate ?? false,\n                        filters: child.props.filters,\n                        footer: child.props.footer,\n                        header: child.props.header,\n                        headerClassName: child.props.headerClassName,\n                        menu: child.props.menu,\n                        renderer: child.props.renderer,\n                        tooltip: child.props.tooltip,\n                    },\n                });\n            }\n        });\n\n    if (options.enableRowExpansion && props.expandedRowRenderer) {\n        columns.unshift(columnHelper.display(createRowExpansionColumn(props.expandedRowRenderer)));\n    }\n\n    if (options.enableRowSelection) {\n        columns.unshift(\n            columnHelper.display(\n                createRowSelectionColumn<TType>(!!(options.enableRowDrag && props.onRowDrag), !!props.expandedRowRenderer)\n            )\n        );\n    }\n\n    if (options.enableRowDrag && props.onRowDrag) {\n        columns.unshift(columnHelper.display(createRowDragColumn(props.onRowDrag)));\n    }\n\n    if (props.actionsForRow?.length) {\n        columns.push(columnHelper.display(createRowActionsColumn<TType>()));\n    }\n\n    if (editing.isEnabled && editing.isEditing) {\n        columns.push(columnHelper.display(createRowEditingActionsColumn<TType>()));\n    }\n\n    return { columns, defaultColumnSizing, defaultColumnVisibility, defaultSorting };\n}\n"],"names":["getSortingFn","dataType","customFnOrBuiltIn","rowA","rowB","columnId","original","useConvertChildrenToColumns","props","options","editing","columnHelper","createColumnHelper","columns","defaultColumnSizing","defaultColumnVisibility","defaultSorting","React","Children","toArray","children","filter","child","forEach","isValidElement","accessor","_child$props$enableRe","_child$props$enableFi","_child$props$enableSo","_child$props$enableHi","_child$props$enableOr","_child$props$enableSe","_child$props$enableTr","defaultWidth","defaultHidden","enableColumnHiding","sort","undefined","push","id","desc","accessorKey","header","Header","cell","Cell","footer","Footer","minSize","MIN_COLUMN_SIZE","enableResizing","enableColumnFilter","enableFiltering","filterFn","enableSorting","sortingFn","sortFn","sortDescFirst","sortUndefined","enableHiding","meta","align","className","control","enableOrdering","enableSearch","enableTruncate","filters","headerClassName","menu","renderer","tooltip","enableRowExpansion","expandedRowRenderer","unshift","display","createRowExpansionColumn","enableRowSelection","createRowSelectionColumn","enableRowDrag","onRowDrag","createRowDragColumn","_props$actionsForRow","actionsForRow","length","createRowActionsColumn","isEnabled","isEditing","createRowEditingActionsColumn"],"mappings":"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"}
+{"version":3,"file":"useConvertChildrenToColumns.js","sources":["../../../../../../../../src/components/Table3/hooks/useConvertChildrenToColumns.tsx"],"sourcesContent":["import React from 'react';\nimport { ColumnDef, ColumnSizingState, createColumnHelper, ColumnSort, VisibilityState } from '@tanstack/react-table';\nimport { Table3ColumnProps, Table3Props, Table3Options, Table3ColumnDataType, Table3SortFn } from '../types';\nimport { Header } from '../components/columns/header/Header';\nimport { Footer } from '../components/columns/footer/Footer';\nimport { Cell } from '../components/columns/cell/Cell';\nimport { createRowSelectionColumn } from '../components/columns/internal/Selection';\nimport { MIN_COLUMN_SIZE } from '../components/columns/styles';\nimport { createRowActionsColumn } from '../components/columns/internal/Actions';\nimport { createRowExpansionColumn } from '../components/columns/internal/Expansion';\nimport { createRowDragColumn } from '../components/columns/internal/Drag';\nimport { createRowEditingActionsColumn } from '../components/columns/internal/EditingActions';\nimport { useEditing } from './features/useEditing';\n\nfunction getSortingFn<TType = unknown>(dataType?: Table3ColumnDataType, customFnOrBuiltIn?: Table3SortFn<TType>) {\n    if (typeof customFnOrBuiltIn === 'function') {\n        return (rowA, rowB, columnId) => customFnOrBuiltIn(rowA.original, rowB.original, columnId);\n    }\n\n    // if a built in is being used, just return that\n    if (customFnOrBuiltIn) {\n        return customFnOrBuiltIn;\n    }\n\n    // some times we alias based on the type\n    if (dataType && dataType !== 'boolean' && dataType !== 'number') {\n        return dataType;\n    }\n\n    // otherwise fall back to auto\n    return 'auto';\n}\n\nexport function useConvertChildrenToColumns<TType = unknown>(\n    props: Table3Props<TType>,\n    options: Table3Options,\n    editing: ReturnType<typeof useEditing>\n) {\n    // It's important to memoise column definitions, because it prevents columns like \"Drag column\" to re-render on every state change,\n    // and break dragging at the moment it happens.\n    return React.useMemo(() => {\n        const columnHelper = createColumnHelper<TType>();\n\n        const columns: ColumnDef<TType>[] = [];\n        const defaultColumnSizing: ColumnSizingState = {};\n        const defaultColumnVisibility: VisibilityState = {};\n        const defaultSorting: ColumnSort[] = [];\n\n        (React.Children.toArray(props.children) as React.ReactElement<Table3ColumnProps<TType>>[])\n            .filter(child => !!child) // remove falsey children\n            .forEach(child => {\n                if (React.isValidElement<Table3ColumnProps<TType>>(child) && child.props.accessor) {\n                    if (child.props.defaultWidth) {\n                        defaultColumnSizing[child.props.accessor as string] =\n                            child.props.defaultWidth === 'grow' ? '1fr' : (child.props.defaultWidth as any);\n                    }\n\n                    if (child.props.defaultHidden && options.enableColumnHiding) {\n                        defaultColumnVisibility[child.props.accessor as string] = false;\n                    }\n\n                    if (child.props.sort !== undefined) {\n                        defaultSorting.push({\n                            id: child.props.accessor as string,\n                            desc: child.props.sort === 'desc',\n                        });\n                    }\n\n                    columns.push({\n                        accessorKey: child.props.accessor,\n                        id: child.props.accessor as string,\n                        header: Header,\n                        cell: Cell,\n                        footer: Footer,\n                        // sizing\n                        minSize: MIN_COLUMN_SIZE,\n                        enableResizing: child.props.enableResizing ?? true,\n                        // filtering\n                        enableColumnFilter: child.props.enableFiltering ?? true,\n                        filterFn: 'tacoFilter' as any,\n                        // sorting\n                        enableSorting: child.props.enableSorting ?? true,\n                        sortingFn: getSortingFn<TType>(child.props.dataType, child.props.sortFn),\n                        sortDescFirst: false,\n                        sortUndefined: 1,\n                        // visibility\n                        enableHiding: child.props.enableHiding ?? true,\n                        // custom options\n                        meta: {\n                            align: child.props.align,\n                            className: child.props.className,\n                            control: child.props.control,\n                            dataType: child.props.dataType,\n                            enableOrdering: child.props.enableOrdering ?? true,\n                            enableSearch: child.props.enableSearch ?? true,\n                            enableTruncate: child.props.enableTruncate ?? false,\n                            filters: child.props.filters,\n                            footer: child.props.footer,\n                            header: child.props.header,\n                            headerClassName: child.props.headerClassName,\n                            menu: child.props.menu,\n                            renderer: child.props.renderer,\n                            tooltip: child.props.tooltip,\n                        },\n                    });\n                }\n            });\n\n        if (options.enableRowExpansion && props.expandedRowRenderer) {\n            columns.unshift(columnHelper.display(createRowExpansionColumn(props.expandedRowRenderer)));\n        }\n\n        if (options.enableRowSelection) {\n            columns.unshift(\n                columnHelper.display(\n                    createRowSelectionColumn<TType>(!!(options.enableRowDrag && props.onRowDrag), !!props.expandedRowRenderer)\n                )\n            );\n        }\n\n        if (options.enableRowDrag && props.onRowDrag) {\n            columns.unshift(columnHelper.display(createRowDragColumn(props.onRowDrag)));\n        }\n\n        if (props.actionsForRow?.length) {\n            columns.push(columnHelper.display(createRowActionsColumn<TType>()));\n        }\n\n        if (editing.isEnabled && editing.isEditing) {\n            columns.push(columnHelper.display(createRowEditingActionsColumn<TType>()));\n        }\n\n        return { columns, defaultColumnSizing, defaultColumnVisibility, defaultSorting };\n    }, [props.children]);\n}\n"],"names":["getSortingFn","dataType","customFnOrBuiltIn","rowA","rowB","columnId","original","useConvertChildrenToColumns","props","options","editing","React","useMemo","columnHelper","createColumnHelper","columns","defaultColumnSizing","defaultColumnVisibility","defaultSorting","Children","toArray","children","filter","child","forEach","isValidElement","accessor","_child$props$enableRe","_child$props$enableFi","_child$props$enableSo","_child$props$enableHi","_child$props$enableOr","_child$props$enableSe","_child$props$enableTr","defaultWidth","defaultHidden","enableColumnHiding","sort","undefined","push","id","desc","accessorKey","header","Header","cell","Cell","footer","Footer","minSize","MIN_COLUMN_SIZE","enableResizing","enableColumnFilter","enableFiltering","filterFn","enableSorting","sortingFn","sortFn","sortDescFirst","sortUndefined","enableHiding","meta","align","className","control","enableOrdering","enableSearch","enableTruncate","filters","headerClassName","menu","renderer","tooltip","enableRowExpansion","expandedRowRenderer","unshift","display","createRowExpansionColumn","enableRowSelection","createRowSelectionColumn","enableRowDrag","onRowDrag","createRowDragColumn","_props$actionsForRow","actionsForRow","length","createRowActionsColumn","isEnabled","isEditing","createRowEditingActionsColumn"],"mappings":";;;;;;;;;;;;AAcA,SAASA,YAAYA,CAAkBC,QAA+B,EAAEC,iBAAuC;EAC3G,IAAI,OAAOA,iBAAiB,KAAK,UAAU,EAAE;IACzC,OAAO,CAACC,IAAI,EAAEC,IAAI,EAAEC,QAAQ,KAAKH,iBAAiB,CAACC,IAAI,CAACG,QAAQ,EAAEF,IAAI,CAACE,QAAQ,EAAED,QAAQ,CAAC;;;EAI9F,IAAIH,iBAAiB,EAAE;IACnB,OAAOA,iBAAiB;;;EAI5B,IAAID,QAAQ,IAAIA,QAAQ,KAAK,SAAS,IAAIA,QAAQ,KAAK,QAAQ,EAAE;IAC7D,OAAOA,QAAQ;;;EAInB,OAAO,MAAM;AACjB;SAEgBM,2BAA2BA,CACvCC,KAAyB,EACzBC,OAAsB,EACtBC,OAAsC;;;EAItC,OAAOC,cAAK,CAACC,OAAO,CAAC;;IACjB,MAAMC,YAAY,GAAGC,kBAAkB,EAAS;IAEhD,MAAMC,OAAO,GAAuB,EAAE;IACtC,MAAMC,mBAAmB,GAAsB,EAAE;IACjD,MAAMC,uBAAuB,GAAoB,EAAE;IACnD,MAAMC,cAAc,GAAiB,EAAE;IAEtCP,cAAK,CAACQ,QAAQ,CAACC,OAAO,CAACZ,KAAK,CAACa,QAAQ,CAAoD,CACrFC,MAAM,CAACC,KAAK,IAAI,CAAC,CAACA,KAAK,CAAC;KACxBC,OAAO,CAACD,KAAK;MACV,kBAAIZ,cAAK,CAACc,cAAc,CAA2BF,KAAK,CAAC,IAAIA,KAAK,CAACf,KAAK,CAACkB,QAAQ,EAAE;QAAA,IAAAC,qBAAA,EAAAC,qBAAA,EAAAC,qBAAA,EAAAC,qBAAA,EAAAC,qBAAA,EAAAC,qBAAA,EAAAC,qBAAA;QAC/E,IAAIV,KAAK,CAACf,KAAK,CAAC0B,YAAY,EAAE;UAC1BlB,mBAAmB,CAACO,KAAK,CAACf,KAAK,CAACkB,QAAkB,CAAC,GAC/CH,KAAK,CAACf,KAAK,CAAC0B,YAAY,KAAK,MAAM,GAAG,KAAK,GAAIX,KAAK,CAACf,KAAK,CAAC0B,YAAoB;;QAGvF,IAAIX,KAAK,CAACf,KAAK,CAAC2B,aAAa,IAAI1B,OAAO,CAAC2B,kBAAkB,EAAE;UACzDnB,uBAAuB,CAACM,KAAK,CAACf,KAAK,CAACkB,QAAkB,CAAC,GAAG,KAAK;;QAGnE,IAAIH,KAAK,CAACf,KAAK,CAAC6B,IAAI,KAAKC,SAAS,EAAE;UAChCpB,cAAc,CAACqB,IAAI,CAAC;YAChBC,EAAE,EAAEjB,KAAK,CAACf,KAAK,CAACkB,QAAkB;YAClCe,IAAI,EAAElB,KAAK,CAACf,KAAK,CAAC6B,IAAI,KAAK;WAC9B,CAAC;;QAGNtB,OAAO,CAACwB,IAAI,CAAC;UACTG,WAAW,EAAEnB,KAAK,CAACf,KAAK,CAACkB,QAAQ;UACjCc,EAAE,EAAEjB,KAAK,CAACf,KAAK,CAACkB,QAAkB;UAClCiB,MAAM,EAAEC,MAAM;UACdC,IAAI,EAAEC,IAAI;UACVC,MAAM,EAAEC,MAAM;;UAEdC,OAAO,EAAEC,eAAe;UACxBC,cAAc,GAAAxB,qBAAA,GAAEJ,KAAK,CAACf,KAAK,CAAC2C,cAAc,cAAAxB,qBAAA,cAAAA,qBAAA,GAAI,IAAI;;UAElDyB,kBAAkB,GAAAxB,qBAAA,GAAEL,KAAK,CAACf,KAAK,CAAC6C,eAAe,cAAAzB,qBAAA,cAAAA,qBAAA,GAAI,IAAI;UACvD0B,QAAQ,EAAE,YAAmB;;UAE7BC,aAAa,GAAA1B,qBAAA,GAAEN,KAAK,CAACf,KAAK,CAAC+C,aAAa,cAAA1B,qBAAA,cAAAA,qBAAA,GAAI,IAAI;UAChD2B,SAAS,EAAExD,YAAY,CAAQuB,KAAK,CAACf,KAAK,CAACP,QAAQ,EAAEsB,KAAK,CAACf,KAAK,CAACiD,MAAM,CAAC;UACxEC,aAAa,EAAE,KAAK;UACpBC,aAAa,EAAE,CAAC;;UAEhBC,YAAY,GAAA9B,qBAAA,GAAEP,KAAK,CAACf,KAAK,CAACoD,YAAY,cAAA9B,qBAAA,cAAAA,qBAAA,GAAI,IAAI;;UAE9C+B,IAAI,EAAE;YACFC,KAAK,EAAEvC,KAAK,CAACf,KAAK,CAACsD,KAAK;YACxBC,SAAS,EAAExC,KAAK,CAACf,KAAK,CAACuD,SAAS;YAChCC,OAAO,EAAEzC,KAAK,CAACf,KAAK,CAACwD,OAAO;YAC5B/D,QAAQ,EAAEsB,KAAK,CAACf,KAAK,CAACP,QAAQ;YAC9BgE,cAAc,GAAAlC,qBAAA,GAAER,KAAK,CAACf,KAAK,CAACyD,cAAc,cAAAlC,qBAAA,cAAAA,qBAAA,GAAI,IAAI;YAClDmC,YAAY,GAAAlC,qBAAA,GAAET,KAAK,CAACf,KAAK,CAAC0D,YAAY,cAAAlC,qBAAA,cAAAA,qBAAA,GAAI,IAAI;YAC9CmC,cAAc,GAAAlC,qBAAA,GAAEV,KAAK,CAACf,KAAK,CAAC2D,cAAc,cAAAlC,qBAAA,cAAAA,qBAAA,GAAI,KAAK;YACnDmC,OAAO,EAAE7C,KAAK,CAACf,KAAK,CAAC4D,OAAO;YAC5BrB,MAAM,EAAExB,KAAK,CAACf,KAAK,CAACuC,MAAM;YAC1BJ,MAAM,EAAEpB,KAAK,CAACf,KAAK,CAACmC,MAAM;YAC1B0B,eAAe,EAAE9C,KAAK,CAACf,KAAK,CAAC6D,eAAe;YAC5CC,IAAI,EAAE/C,KAAK,CAACf,KAAK,CAAC8D,IAAI;YACtBC,QAAQ,EAAEhD,KAAK,CAACf,KAAK,CAAC+D,QAAQ;YAC9BC,OAAO,EAAEjD,KAAK,CAACf,KAAK,CAACgE;;SAE5B,CAAC;;KAET,CAAC;IAEN,IAAI/D,OAAO,CAACgE,kBAAkB,IAAIjE,KAAK,CAACkE,mBAAmB,EAAE;MACzD3D,OAAO,CAAC4D,OAAO,CAAC9D,YAAY,CAAC+D,OAAO,CAACC,wBAAwB,CAACrE,KAAK,CAACkE,mBAAmB,CAAC,CAAC,CAAC;;IAG9F,IAAIjE,OAAO,CAACqE,kBAAkB,EAAE;MAC5B/D,OAAO,CAAC4D,OAAO,CACX9D,YAAY,CAAC+D,OAAO,CAChBG,wBAAwB,CAAQ,CAAC,EAAEtE,OAAO,CAACuE,aAAa,IAAIxE,KAAK,CAACyE,SAAS,CAAC,EAAE,CAAC,CAACzE,KAAK,CAACkE,mBAAmB,CAAC,CAC7G,CACJ;;IAGL,IAAIjE,OAAO,CAACuE,aAAa,IAAIxE,KAAK,CAACyE,SAAS,EAAE;MAC1ClE,OAAO,CAAC4D,OAAO,CAAC9D,YAAY,CAAC+D,OAAO,CAACM,mBAAmB,CAAC1E,KAAK,CAACyE,SAAS,CAAC,CAAC,CAAC;;IAG/E,KAAAE,oBAAA,GAAI3E,KAAK,CAAC4E,aAAa,cAAAD,oBAAA,eAAnBA,oBAAA,CAAqBE,MAAM,EAAE;MAC7BtE,OAAO,CAACwB,IAAI,CAAC1B,YAAY,CAAC+D,OAAO,CAACU,sBAAsB,EAAS,CAAC,CAAC;;IAGvE,IAAI5E,OAAO,CAAC6E,SAAS,IAAI7E,OAAO,CAAC8E,SAAS,EAAE;MACxCzE,OAAO,CAACwB,IAAI,CAAC1B,YAAY,CAAC+D,OAAO,CAACa,6BAA6B,EAAS,CAAC,CAAC;;IAG9E,OAAO;MAAE1E,OAAO;MAAEC,mBAAmB;MAAEC,uBAAuB;MAAEC;KAAgB;GACnF,EAAE,CAACV,KAAK,CAACa,QAAQ,CAAC,CAAC;AACxB;;;;"}

package/dist/esm/packages/taco/src/components/Table3/hooks/useCssGrid.js

@@ -20,6 +20,8 @@ const useCssGrid = table => {
         if (column.id === COLUMN_ID) {
           size = 'minmax(max-content, auto)';
         } else {
+          // getSize method is used instead of columnSizing state because columnSizing state doesn't have
+          // sizes of internal columns.
           size = `${column.getSize()}px`;
         }
       } else if (width !== undefined) {

package/dist/esm/packages/taco/src/components/Table3/hooks/useCssGrid.js.map

@@ -1 +1 @@
-{"version":3,"file":"useCssGrid.js","sources":["../../../../../../../../src/components/Table3/hooks/useCssGrid.ts"],"sourcesContent":["import React from 'react';\nimport { Table as RTable } from '@tanstack/react-table';\nimport { isInternalColumn } from '../util/columns';\nimport { MIN_COLUMN_SIZE } from '../components/columns/styles';\nimport { COLUMN_ID as ACTIONS_COLUMN_ID } from '../components/columns/internal/Actions';\n\nexport const useCssGrid = <TType = unknown>(table: RTable<TType>) => {\n    const allVisibleColumns = table.getVisibleLeafColumns();\n    const columnSizing = table.getState().columnSizing;\n    const rowsLength = table.getRowModel().rows.length;\n    const expandedRowsLength = Object.keys(table.getState().expanded).length;\n    const length = rowsLength + expandedRowsLength;\n\n    const gridTemplateColumns = React.useMemo(() => {\n        return allVisibleColumns.reduce((accum, column, index) => {\n            let size;\n            const isLastColumn = index === allVisibleColumns.length - 1;\n            // column has a getSize function, but it always returns a default value (150), and we want the\n            // first render to use auto layout - so we get the size directly from table state where it is undefined\n            const width = columnSizing[column.id] as number | '1fr';\n\n            if (isInternalColumn(column.id)) {\n                if (column.id === ACTIONS_COLUMN_ID) {\n                    size = 'minmax(max-content, auto)';\n                } else {\n                    size = `${column.getSize()}px`;\n                }\n            } else if (width !== undefined) {\n                if (width === '1fr') {\n                    size = 'minmax(max-content, 1fr)';\n                } else if (isLastColumn) {\n                    size = `minmax(${width}px, auto)`;\n                } else if (width < MIN_COLUMN_SIZE) {\n                    // the react-table getResizeHandler function does not respect the minSize property on columns, it is possible\n                    // to go below the minSize - so we have to prevent it entirely on the grid layout\n                    size = `${MIN_COLUMN_SIZE}px`;\n                } else {\n                    size = `${width}px`;\n                }\n            } else {\n                size = 'minmax(max-content, auto)';\n            }\n\n            return `${accum} ${size}`.trim();\n        }, '');\n    }, [allVisibleColumns, columnSizing]);\n\n    const gridTemplateRows = React.useMemo(() => {\n        // 1fr makes sure that there is always a free space between the rows and footer when table height exceeds the\n        // cumulative height of all rows\n        return `min-content repeat(${length}, min-content) 1fr min-content`;\n    }, [length]);\n\n    const style: React.CSSProperties = {\n        gridTemplateColumns,\n        gridTemplateRows,\n    };\n\n    return { style };\n};\n"],"names":["useCssGrid","table","allVisibleColumns","getVisibleLeafColumns","columnSizing","getState","rowsLength","getRowModel","rows","length","expandedRowsLength","Object","keys","expanded","gridTemplateColumns","React","useMemo","reduce","accum","column","index","size","isLastColumn","width","id","isInternalColumn","ACTIONS_COLUMN_ID","getSize","undefined","MIN_COLUMN_SIZE","trim","gridTemplateRows","style"],"mappings":";;;;;MAMaA,UAAU,GAAqBC,KAAoB;EAC5D,MAAMC,iBAAiB,GAAGD,KAAK,CAACE,qBAAqB,EAAE;EACvD,MAAMC,YAAY,GAAGH,KAAK,CAACI,QAAQ,EAAE,CAACD,YAAY;EAClD,MAAME,UAAU,GAAGL,KAAK,CAACM,WAAW,EAAE,CAACC,IAAI,CAACC,MAAM;EAClD,MAAMC,kBAAkB,GAAGC,MAAM,CAACC,IAAI,CAACX,KAAK,CAACI,QAAQ,EAAE,CAACQ,QAAQ,CAAC,CAACJ,MAAM;EACxE,MAAMA,MAAM,GAAGH,UAAU,GAAGI,kBAAkB;EAE9C,MAAMI,mBAAmB,GAAGC,cAAK,CAACC,OAAO,CAAC;IACtC,OAAOd,iBAAiB,CAACe,MAAM,CAAC,CAACC,KAAK,EAAEC,MAAM,EAAEC,KAAK;MACjD,IAAIC,IAAI;MACR,MAAMC,YAAY,GAAGF,KAAK,KAAKlB,iBAAiB,CAACO,MAAM,GAAG,CAAC;;;MAG3D,MAAMc,KAAK,GAAGnB,YAAY,CAACe,MAAM,CAACK,EAAE,CAAmB;MAEvD,IAAIC,gBAAgB,CAACN,MAAM,CAACK,EAAE,CAAC,EAAE;QAC7B,IAAIL,MAAM,CAACK,EAAE,KAAKE,SAAiB,EAAE;UACjCL,IAAI,GAAG,2BAA2B;SACrC,MAAM;UACHA,IAAI,MAAMF,MAAM,CAACQ,OAAO,MAAM;;OAErC,MAAM,IAAIJ,KAAK,KAAKK,SAAS,EAAE;QAC5B,IAAIL,KAAK,KAAK,KAAK,EAAE;UACjBF,IAAI,GAAG,0BAA0B;SACpC,MAAM,IAAIC,YAAY,EAAE;UACrBD,IAAI,aAAaE,gBAAgB;SACpC,MAAM,IAAIA,KAAK,GAAGM,eAAe,EAAE;;;UAGhCR,IAAI,MAAMQ,mBAAmB;SAChC,MAAM;UACHR,IAAI,MAAME,SAAS;;OAE1B,MAAM;QACHF,IAAI,GAAG,2BAA2B;;MAGtC,UAAUH,SAASG,MAAM,CAACS,IAAI,EAAE;KACnC,EAAE,EAAE,CAAC;GACT,EAAE,CAAC5B,iBAAiB,EAAEE,YAAY,CAAC,CAAC;EAErC,MAAM2B,gBAAgB,GAAGhB,cAAK,CAACC,OAAO,CAAC;;;IAGnC,6BAA6BP,sCAAsC;GACtE,EAAE,CAACA,MAAM,CAAC,CAAC;EAEZ,MAAMuB,KAAK,GAAwB;IAC/BlB,mBAAmB;IACnBiB;GACH;EAED,OAAO;IAAEC;GAAO;AACpB;;;;"}
+{"version":3,"file":"useCssGrid.js","sources":["../../../../../../../../src/components/Table3/hooks/useCssGrid.ts"],"sourcesContent":["import React from 'react';\nimport { Table as RTable } from '@tanstack/react-table';\nimport { isInternalColumn } from '../util/columns';\nimport { MIN_COLUMN_SIZE } from '../components/columns/styles';\nimport { COLUMN_ID as ACTIONS_COLUMN_ID } from '../components/columns/internal/Actions';\n\nexport const useCssGrid = <TType = unknown>(table: RTable<TType>) => {\n    const allVisibleColumns = table.getVisibleLeafColumns();\n    const columnSizing = table.getState().columnSizing;\n    const rowsLength = table.getRowModel().rows.length;\n    const expandedRowsLength = Object.keys(table.getState().expanded).length;\n    const length = rowsLength + expandedRowsLength;\n\n    const gridTemplateColumns = React.useMemo(() => {\n        return allVisibleColumns.reduce((accum, column, index) => {\n            let size;\n            const isLastColumn = index === allVisibleColumns.length - 1;\n            // column has a getSize function, but it always returns a default value (150), and we want the\n            // first render to use auto layout - so we get the size directly from table state where it is undefined\n            const width = columnSizing[column.id] as number | '1fr';\n\n            if (isInternalColumn(column.id)) {\n                if (column.id === ACTIONS_COLUMN_ID) {\n                    size = 'minmax(max-content, auto)';\n                } else {\n                    // getSize method is used instead of columnSizing state because columnSizing state doesn't have\n                    // sizes of internal columns.\n                    size = `${column.getSize()}px`;\n                }\n            } else if (width !== undefined) {\n                if (width === '1fr') {\n                    size = 'minmax(max-content, 1fr)';\n                } else if (isLastColumn) {\n                    size = `minmax(${width}px, auto)`;\n                } else if (width < MIN_COLUMN_SIZE) {\n                    // the react-table getResizeHandler function does not respect the minSize property on columns, it is possible\n                    // to go below the minSize - so we have to prevent it entirely on the grid layout\n                    size = `${MIN_COLUMN_SIZE}px`;\n                } else {\n                    size = `${width}px`;\n                }\n            } else {\n                size = 'minmax(max-content, auto)';\n            }\n\n            return `${accum} ${size}`.trim();\n        }, '');\n    }, [allVisibleColumns, columnSizing]);\n\n    const gridTemplateRows = React.useMemo(() => {\n        // 1fr makes sure that there is always a free space between the rows and footer when table height exceeds the\n        // cumulative height of all rows\n        return `min-content repeat(${length}, min-content) 1fr min-content`;\n    }, [length]);\n\n    const style: React.CSSProperties = {\n        gridTemplateColumns,\n        gridTemplateRows,\n    };\n\n    return { style };\n};\n"],"names":["useCssGrid","table","allVisibleColumns","getVisibleLeafColumns","columnSizing","getState","rowsLength","getRowModel","rows","length","expandedRowsLength","Object","keys","expanded","gridTemplateColumns","React","useMemo","reduce","accum","column","index","size","isLastColumn","width","id","isInternalColumn","ACTIONS_COLUMN_ID","getSize","undefined","MIN_COLUMN_SIZE","trim","gridTemplateRows","style"],"mappings":";;;;;MAMaA,UAAU,GAAqBC,KAAoB;EAC5D,MAAMC,iBAAiB,GAAGD,KAAK,CAACE,qBAAqB,EAAE;EACvD,MAAMC,YAAY,GAAGH,KAAK,CAACI,QAAQ,EAAE,CAACD,YAAY;EAClD,MAAME,UAAU,GAAGL,KAAK,CAACM,WAAW,EAAE,CAACC,IAAI,CAACC,MAAM;EAClD,MAAMC,kBAAkB,GAAGC,MAAM,CAACC,IAAI,CAACX,KAAK,CAACI,QAAQ,EAAE,CAACQ,QAAQ,CAAC,CAACJ,MAAM;EACxE,MAAMA,MAAM,GAAGH,UAAU,GAAGI,kBAAkB;EAE9C,MAAMI,mBAAmB,GAAGC,cAAK,CAACC,OAAO,CAAC;IACtC,OAAOd,iBAAiB,CAACe,MAAM,CAAC,CAACC,KAAK,EAAEC,MAAM,EAAEC,KAAK;MACjD,IAAIC,IAAI;MACR,MAAMC,YAAY,GAAGF,KAAK,KAAKlB,iBAAiB,CAACO,MAAM,GAAG,CAAC;;;MAG3D,MAAMc,KAAK,GAAGnB,YAAY,CAACe,MAAM,CAACK,EAAE,CAAmB;MAEvD,IAAIC,gBAAgB,CAACN,MAAM,CAACK,EAAE,CAAC,EAAE;QAC7B,IAAIL,MAAM,CAACK,EAAE,KAAKE,SAAiB,EAAE;UACjCL,IAAI,GAAG,2BAA2B;SACrC,MAAM;;;UAGHA,IAAI,MAAMF,MAAM,CAACQ,OAAO,MAAM;;OAErC,MAAM,IAAIJ,KAAK,KAAKK,SAAS,EAAE;QAC5B,IAAIL,KAAK,KAAK,KAAK,EAAE;UACjBF,IAAI,GAAG,0BAA0B;SACpC,MAAM,IAAIC,YAAY,EAAE;UACrBD,IAAI,aAAaE,gBAAgB;SACpC,MAAM,IAAIA,KAAK,GAAGM,eAAe,EAAE;;;UAGhCR,IAAI,MAAMQ,mBAAmB;SAChC,MAAM;UACHR,IAAI,MAAME,SAAS;;OAE1B,MAAM;QACHF,IAAI,GAAG,2BAA2B;;MAGtC,UAAUH,SAASG,MAAM,CAACS,IAAI,EAAE;KACnC,EAAE,EAAE,CAAC;GACT,EAAE,CAAC5B,iBAAiB,EAAEE,YAAY,CAAC,CAAC;EAErC,MAAM2B,gBAAgB,GAAGhB,cAAK,CAACC,OAAO,CAAC;;;IAGnC,6BAA6BP,sCAAsC;GACtE,EAAE,CAACA,MAAM,CAAC,CAAC;EAEZ,MAAMuB,KAAK,GAAwB;IAC/BlB,mBAAmB;IACnBiB;GACH;EAED,OAAO;IAAEC;GAAO;AACpB;;;;"}

package/dist/esm/packages/taco/src/hooks/useLocalStorage.js

@@ -2,6 +2,9 @@ import React__default from 'react';
 
 const useLocalStorage = (key, initialValue) => {
   const [state, setState] = React__default.useState(() => {
+    if (!key) {
+      return initialValue;
+    }
     try {
       const localStorageValue = localStorage.getItem(key);
       if (typeof localStorageValue !== 'string') {
@@ -18,6 +21,9 @@ const useLocalStorage = (key, initialValue) => {
     }
   });
   React__default.useEffect(() => {
+    if (!key) {
+      return;
+    }
     try {
       const serializedState = JSON.stringify(state);
       localStorage.setItem(key, serializedState);
@@ -26,7 +32,11 @@ const useLocalStorage = (key, initialValue) => {
       // localStorage can throw. Also JSON.stringify can throw.
     }
   }, [key, state]);
-  const clear = () => localStorage.removeItem(key);
+  const clear = () => {
+    if (key) {
+      localStorage.removeItem(key);
+    }
+  };
   return [state, setState, clear];
 };
 

package/dist/esm/packages/taco/src/hooks/useLocalStorage.js.map

@@ -1 +1 @@
-{"version":3,"file":"useLocalStorage.js","sources":["../../../../../../src/hooks/useLocalStorage.ts"],"sourcesContent":["import React from 'react';\n\nexport const useLocalStorage = <TType>(key: string, initialValue?: TType): [TType, (value: TType) => void, () => void] => {\n    const [state, setState] = React.useState<TType>(() => {\n        try {\n            const localStorageValue = localStorage.getItem(key);\n\n            if (typeof localStorageValue !== 'string') {\n                localStorage.setItem(key, JSON.stringify(initialValue));\n                return initialValue;\n            } else {\n                return JSON.parse(localStorageValue || 'null');\n            }\n        } catch {\n            // If user is in private mode or has storage restriction\n            // localStorage can throw. JSON.parse and JSON.stringify\n            // can throw, too.\n            return initialValue;\n        }\n    });\n\n    React.useEffect(() => {\n        try {\n            const serializedState = JSON.stringify(state);\n            localStorage.setItem(key, serializedState);\n        } catch {\n            // If user is in private mode or has storage restriction\n            // localStorage can throw. Also JSON.stringify can throw.\n        }\n    }, [key, state]);\n\n    const clear = () => localStorage.removeItem(key);\n\n    return [state, setState, clear];\n};\n"],"names":["useLocalStorage","key","initialValue","state","setState","React","useState","localStorageValue","localStorage","getItem","setItem","JSON","stringify","parse","useEffect","serializedState","clear","removeItem"],"mappings":";;MAEaA,eAAe,GAAGA,CAAQC,GAAW,EAAEC,YAAoB;EACpE,MAAM,CAACC,KAAK,EAAEC,QAAQ,CAAC,GAAGC,cAAK,CAACC,QAAQ,CAAQ;IAC5C,IAAI;MACA,MAAMC,iBAAiB,GAAGC,YAAY,CAACC,OAAO,CAACR,GAAG,CAAC;MAEnD,IAAI,OAAOM,iBAAiB,KAAK,QAAQ,EAAE;QACvCC,YAAY,CAACE,OAAO,CAACT,GAAG,EAAEU,IAAI,CAACC,SAAS,CAACV,YAAY,CAAC,CAAC;QACvD,OAAOA,YAAY;OACtB,MAAM;QACH,OAAOS,IAAI,CAACE,KAAK,CAACN,iBAAiB,IAAI,MAAM,CAAC;;KAErD,CAAC,MAAM;;;;MAIJ,OAAOL,YAAY;;GAE1B,CAAC;EAEFG,cAAK,CAACS,SAAS,CAAC;IACZ,IAAI;MACA,MAAMC,eAAe,GAAGJ,IAAI,CAACC,SAAS,CAACT,KAAK,CAAC;MAC7CK,YAAY,CAACE,OAAO,CAACT,GAAG,EAAEc,eAAe,CAAC;KAC7C,CAAC,MAAM;;;;GAIX,EAAE,CAACd,GAAG,EAAEE,KAAK,CAAC,CAAC;EAEhB,MAAMa,KAAK,GAAGA,MAAMR,YAAY,CAACS,UAAU,CAAChB,GAAG,CAAC;EAEhD,OAAO,CAACE,KAAK,EAAEC,QAAQ,EAAEY,KAAK,CAAC;AACnC;;;;"}
+{"version":3,"file":"useLocalStorage.js","sources":["../../../../../../src/hooks/useLocalStorage.ts"],"sourcesContent":["import React from 'react';\n\nexport const useLocalStorage = <TType>(key?: string, initialValue?: TType): [TType, (value: TType) => void, () => void] => {\n    const [state, setState] = React.useState<TType>(() => {\n        if (!key) {\n            return initialValue;\n        }\n\n        try {\n            const localStorageValue = localStorage.getItem(key);\n\n            if (typeof localStorageValue !== 'string') {\n                localStorage.setItem(key, JSON.stringify(initialValue));\n                return initialValue;\n            } else {\n                return JSON.parse(localStorageValue || 'null');\n            }\n        } catch {\n            // If user is in private mode or has storage restriction\n            // localStorage can throw. JSON.parse and JSON.stringify\n            // can throw, too.\n            return initialValue;\n        }\n    });\n\n    React.useEffect(() => {\n        if (!key) {\n            return;\n        }\n\n        try {\n            const serializedState = JSON.stringify(state);\n            localStorage.setItem(key, serializedState);\n        } catch {\n            // If user is in private mode or has storage restriction\n            // localStorage can throw. Also JSON.stringify can throw.\n        }\n    }, [key, state]);\n\n    const clear = () => {\n        if (key) {\n            localStorage.removeItem(key);\n        }\n    };\n\n    return [state, setState, clear];\n};\n"],"names":["useLocalStorage","key","initialValue","state","setState","React","useState","localStorageValue","localStorage","getItem","setItem","JSON","stringify","parse","useEffect","serializedState","clear","removeItem"],"mappings":";;MAEaA,eAAe,GAAGA,CAAQC,GAAY,EAAEC,YAAoB;EACrE,MAAM,CAACC,KAAK,EAAEC,QAAQ,CAAC,GAAGC,cAAK,CAACC,QAAQ,CAAQ;IAC5C,IAAI,CAACL,GAAG,EAAE;MACN,OAAOC,YAAY;;IAGvB,IAAI;MACA,MAAMK,iBAAiB,GAAGC,YAAY,CAACC,OAAO,CAACR,GAAG,CAAC;MAEnD,IAAI,OAAOM,iBAAiB,KAAK,QAAQ,EAAE;QACvCC,YAAY,CAACE,OAAO,CAACT,GAAG,EAAEU,IAAI,CAACC,SAAS,CAACV,YAAY,CAAC,CAAC;QACvD,OAAOA,YAAY;OACtB,MAAM;QACH,OAAOS,IAAI,CAACE,KAAK,CAACN,iBAAiB,IAAI,MAAM,CAAC;;KAErD,CAAC,MAAM;;;;MAIJ,OAAOL,YAAY;;GAE1B,CAAC;EAEFG,cAAK,CAACS,SAAS,CAAC;IACZ,IAAI,CAACb,GAAG,EAAE;MACN;;IAGJ,IAAI;MACA,MAAMc,eAAe,GAAGJ,IAAI,CAACC,SAAS,CAACT,KAAK,CAAC;MAC7CK,YAAY,CAACE,OAAO,CAACT,GAAG,EAAEc,eAAe,CAAC;KAC7C,CAAC,MAAM;;;;GAIX,EAAE,CAACd,GAAG,EAAEE,KAAK,CAAC,CAAC;EAEhB,MAAMa,KAAK,GAAGA;IACV,IAAIf,GAAG,EAAE;MACLO,YAAY,CAACS,UAAU,CAAChB,GAAG,CAAC;;GAEnC;EAED,OAAO,CAACE,KAAK,EAAEC,QAAQ,EAAEY,KAAK,CAAC;AACnC;;;;"}

package/dist/hooks/useLocalStorage.d.ts

@@ -1 +1 @@
-export declare const useLocalStorage: <TType>(key: string, initialValue?: TType | undefined) => [TType, (value: TType) => void, () => void];
+export declare const useLocalStorage: <TType>(key?: string | undefined, initialValue?: TType | undefined) => [TType, (value: TType) => void, () => void];

package/dist/taco.cjs.development.js

@@ -473,6 +473,79 @@ function IconCashReports(props, svgRef) {
 }
 var CashReports = /*#__PURE__*/React.forwardRef(IconCashReports);
 
+function IconChartArea(props, svgRef) {
+  return /*#__PURE__*/React.createElement("svg", Object.assign({
+    fill: "none",
+    xmlns: "http://www.w3.org/2000/svg",
+    viewBox: "0 0 24 24",
+    ref: svgRef
+  }, props), /*#__PURE__*/React.createElement("path", {
+    fillRule: "evenodd",
+    clipRule: "evenodd",
+    d: "M3.5 4.75a.75.75 0 00-1.5 0v14.5c0 .414.336.75.75.75h18.5a.75.75 0 000-1.5h-1.5V6a.75.75 0 00-1.14-.64l-6.88 4.188-3.045-2.682a.75.75 0 00-.921-.055L3.5 9.745V4.75zm0 6.816V18.5h14.75V7.335l-6.211 3.782a.75.75 0 01-.886-.078l-3.02-2.66L3.5 11.565z",
+    fill: "currentColor"
+  }));
+}
+var ChartArea = /*#__PURE__*/React.forwardRef(IconChartArea);
+
+function IconChartBar(props, svgRef) {
+  return /*#__PURE__*/React.createElement("svg", Object.assign({
+    fill: "none",
+    xmlns: "http://www.w3.org/2000/svg",
+    viewBox: "0 0 24 24",
+    ref: svgRef
+  }, props), /*#__PURE__*/React.createElement("path", {
+    fillRule: "evenodd",
+    clipRule: "evenodd",
+    d: "M11 17.75A1.75 1.75 0 009.25 16h-4.5A1.75 1.75 0 003 17.75v1.5c0 .966.784 1.75 1.75 1.75h4.5A1.75 1.75 0 0011 19.25v-1.5zm6-6.5a1.75 1.75 0 00-1.75-1.75H4.75A1.75 1.75 0 003 11.25v1.5c0 .966.784 1.75 1.75 1.75h10.5A1.75 1.75 0 0017 12.75v-1.5zm4-6.5A1.75 1.75 0 0019.25 3H4.75A1.75 1.75 0 003 4.75v1.5C3 7.216 3.784 8 4.75 8h14.5A1.75 1.75 0 0021 6.25v-1.5zm-11.5 13v1.5a.25.25 0 01-.193.243l-.057.007h-4.5a.25.25 0 01-.243-.193L4.5 19.25v-1.5a.25.25 0 01.193-.243l.057-.007h4.5a.25.25 0 01.243.193l.007.057zm6-6.5v1.5a.25.25 0 01-.193.243L15.25 13H4.75a.25.25 0 01-.243-.193L4.5 12.75v-1.5a.25.25 0 01.193-.243L4.75 11h10.5a.25.25 0 01.243.193l.007.057zm4-6.5v1.5a.25.25 0 01-.193.243l-.057.007H4.75a.25.25 0 01-.243-.193L4.5 6.25v-1.5a.25.25 0 01.193-.243L4.75 4.5h14.5a.25.25 0 01.243.193l.007.057z",
+    fill: "currentColor"
+  }));
+}
+var ChartBar = /*#__PURE__*/React.forwardRef(IconChartBar);
+
+function IconChartLine(props, svgRef) {
+  return /*#__PURE__*/React.createElement("svg", Object.assign({
+    fill: "none",
+    xmlns: "http://www.w3.org/2000/svg",
+    viewBox: "0 0 24 24",
+    ref: svgRef
+  }, props), /*#__PURE__*/React.createElement("path", {
+    fillRule: "evenodd",
+    clipRule: "evenodd",
+    d: "M3.5 4.75a.75.75 0 00-1.5 0v14.5c0 .414.336.75.75.75h18.5a.75.75 0 000-1.5H3.5V4.75zm18.06 2.53a.75.75 0 10-1.06-1.06l-5.97 5.97-3.47-3.47a.75.75 0 00-1.06 0l-4.47 4.47a.75.75 0 001.061 1.06l3.94-3.94L14 13.78a.75.75 0 001.06 0l6.5-6.5z",
+    fill: "currentColor"
+  }));
+}
+var ChartLine = /*#__PURE__*/React.forwardRef(IconChartLine);
+
+function IconChartPie(props, svgRef) {
+  return /*#__PURE__*/React.createElement("svg", Object.assign({
+    fill: "none",
+    xmlns: "http://www.w3.org/2000/svg",
+    viewBox: "0 0 24 24",
+    ref: svgRef
+  }, props), /*#__PURE__*/React.createElement("path", {
+    d: "M10.25 4.25A.75.75 0 0111 5v8h8a.75.75 0 01.743.648l.007.102c0 4.97-4.03 8.5-9 8.5a9 9 0 01-9-9c0-4.97 3.53-9 8.5-9zM9.5 5.787l-.209.024c-3.69.47-6.041 3.622-6.041 7.439a7.5 7.5 0 007.5 7.5c3.817 0 6.968-2.352 7.44-6.041l.022-.209H10.25a.75.75 0 01-.743-.648L9.5 13.75V5.787zm3.75-4.037a9 9 0 019 9 .75.75 0 01-.75.75h-8.25a.75.75 0 01-.75-.75V2.5a.75.75 0 01.75-.75zM14 3.287V10h6.712l-.023-.209a7.504 7.504 0 00-6.48-6.48L14 3.287z",
+    fill: "currentColor"
+  }));
+}
+var ChartPie = /*#__PURE__*/React.forwardRef(IconChartPie);
+
+function IconChartTable(props, svgRef) {
+  return /*#__PURE__*/React.createElement("svg", Object.assign({
+    fill: "none",
+    xmlns: "http://www.w3.org/2000/svg",
+    viewBox: "0 0 24 24",
+    ref: svgRef
+  }, props), /*#__PURE__*/React.createElement("path", {
+    fillRule: "evenodd",
+    clipRule: "evenodd",
+    d: "M4.5 4.5h15v3.75h-15V4.5zM3 9.75V4.5A1.5 1.5 0 014.5 3h15A1.5 1.5 0 0121 4.5v15a1.5 1.5 0 01-1.5 1.5h-15A1.5 1.5 0 013 19.5V9.75zM4.5 14V9.75h4V14h-4zm0 1.5v4h4v-4h-4zm5.5 4h4v-4h-4v4zm5.5 0h4v-4h-4v4zm4-5.5V9.75h-4V14h4zM10 9.75h4V14h-4V9.75z",
+    fill: "currentColor"
+  }));
+}
+var ChartTable = /*#__PURE__*/React.forwardRef(IconChartTable);
+
 function IconChatSolid(props, svgRef) {
   return /*#__PURE__*/React.createElement("svg", Object.assign({
     xmlns: "http://www.w3.org/2000/svg",
@@ -3140,6 +3213,11 @@ const icons = {
   calendar: Calendar,
   'cash-account': CashAccount,
   'cash-reports': CashReports,
+  'chart-area': ChartArea,
+  'chart-bar': ChartBar,
+  'chart-line': ChartLine,
+  'chart-pie': ChartPie,
+  'chart-table': ChartTable,
   'chat-solid': ChatSolid,
   chat: Chat,
   'chevron-down-double': ChevronDownDouble,
@@ -12992,9 +13070,14 @@ const Cell = function Cell(props) {
   };
   if (meta.editMode.onSave && hasCellControl && (canEditThisCell || isHoveringThisRowWhileEditing && isDataColumn)) {
     attributes.onMouseDown = event => {
-      handleMouseDown(event);
       const target = event.target;
       const isTargetInput = target !== null && target.nodeName === 'INPUT';
+      // In Edit mode, If mouse click is happening outside of cell (in case of any dropdowns like date picker or select),
+      // then it should not be processed as a click on a cell.
+      if (!event.currentTarget.contains(target)) {
+        return;
+      }
+      handleMouseDown(event);
       // event.target?.select is only truthy for input elements
       // if event.target is active element, then that means we should select the text
       if (isTargetInput && target !== document.activeElement) {
@@ -16401,6 +16484,8 @@ const useCssGrid = table => {
         if (column.id === COLUMN_ID) {
           size = 'minmax(max-content, auto)';
         } else {
+          // getSize method is used instead of columnSizing state because columnSizing state doesn't have
+          // sizes of internal columns.
           size = `${column.getSize()}px`;
         }
       } else if (width !== undefined) {
@@ -16909,17 +16994,26 @@ function useColumnFreezingStyle(tableId, table) {
     columnVisibility
   } = table.getState();
   const tableMeta = table.options.meta;
-  const frozenColumnIndex = ((_tableMeta$columnFree = tableMeta.columnFreezing.frozenColumnIndex) !== null && _tableMeta$columnFree !== void 0 ? _tableMeta$columnFree : -1) + tableMeta.columnFreezing.frozenInternalColumnCount;
+  const frozenColumnIndex =
+  // If column freezing is not enabled then only internal frozen column should be frozen.
+  (tableMeta.columnFreezing.isEnabled ? (_tableMeta$columnFree = tableMeta.columnFreezing.frozenColumnIndex) !== null && _tableMeta$columnFree !== void 0 ? _tableMeta$columnFree : -1 : -1) + tableMeta.columnFreezing.frozenInternalColumnCount;
   const style = React__default.useMemo(() => {
     if (tableMeta.columnFreezing.frozenInternalColumnCount > 0 || tableMeta.columnFreezing.isEnabled && frozenColumnIndex !== undefined) {
-      const visibleFrozenColumns = table.getVisibleLeafColumns().slice(0, frozenColumnIndex + 1).map(column => column.id);
+      var _visibleFrozenColumns;
+      const visibleFrozenColumns = table.getVisibleLeafColumns().slice(0, frozenColumnIndex + 1);
       // if all frozen columns haven't had their size set yet, then abort
-      if (visibleFrozenColumns.every(id => columnSizing[id] === undefined)) {
+      if (visibleFrozenColumns.every(column => columnSizing[column.id] === undefined)) {
         return undefined;
       }
       const offsets = {};
-      visibleFrozenColumns.reduce((offset, columnId) => {
+      visibleFrozenColumns.reduce((offset, column) => {
+        const columnId = column.id;
         offsets[columnId] = offset;
+        if (isInternalColumn$1(columnId)) {
+          // getSize method is used instead of columnSizing state because columnSizing state doesn't have
+          // sizes of internal columns.
+          return offset + column.getSize();
+        }
         return offset + columnSizing[columnId];
       }, 0);
       const styles = [Object.values(offsets).map((offset, index) => `#${tableId} [role="row"] > :nth-child(${index + 1}) { left: ${offset}px }`).join('\n'), `#${tableId} [role="row"] > :not(:nth-child(n+${frozenColumnIndex + 2})) {
@@ -16928,7 +17022,7 @@ function useColumnFreezingStyle(tableId, table) {
                 }`, `#${tableId}[data-horizontally-scrolled="true"] [role="row"] > :nth-child(${frozenColumnIndex + 1}) {
                     box-shadow: var(--tw-ring-offset-shadow, 0 0 #0000), var(--tw-ring-shadow, 0 0 #0000), 6px 0px 6px rgb(0 0 0/8%), 1px 0px 0px #DDDDDD;
                 }`];
-      const columnId = visibleFrozenColumns[frozenColumnIndex];
+      const columnId = (_visibleFrozenColumns = visibleFrozenColumns[frozenColumnIndex]) === null || _visibleFrozenColumns === void 0 ? void 0 : _visibleFrozenColumns.id;
       // frozenColumnIndex could not be in the visible frozen column so it is important to check if columnId
       // exists before checking if it is internal.
       //
@@ -17816,7 +17910,7 @@ const Cell$4 = /*#__PURE__*/React__default.memo(function MemoedCell(context) {
   return newTableMeta.currentRow.currentRowIndex === oldTableMeta.currentRow.currentRowIndex && newProps.row.getIsSelected() !== oldProps.row.getIsSelected();
 });
 function createRowSelectionColumn$1(hasDrag, hasExpansion) {
-  const size = hasDrag ? 22 : 40;
+  const size = hasDrag && hasExpansion ? 22 : 40;
   return {
     id: COLUMN_ID$2,
     header: Header$3,
@@ -17826,7 +17920,7 @@ function createRowSelectionColumn$1(hasDrag, hasExpansion) {
       align: 'center',
       className: cn('!pt-[var(--table3-row-padding)] !justify-end !p-0', {
         '!pr-0.5': hasExpansion,
-        '!pr-2.5': !hasExpansion
+        '!pr-3': !hasExpansion
       }),
       enableOrdering: false,
       enableSearch: false,
@@ -17834,7 +17928,7 @@ function createRowSelectionColumn$1(hasDrag, hasExpansion) {
       header: '',
       headerClassName: cn('items-center !justify-end !p-0', {
         '!pr-0.5': hasExpansion,
-        '!pr-2.5': !hasExpansion
+        '!pr-3': !hasExpansion
       })
     },
     // options
@@ -18009,8 +18103,8 @@ function createRowDragColumn(onRowDrag) {
     },
     // options
     enableResizing: false,
-    size: 15,
-    minSize: 15
+    size: 20,
+    minSize: 20
   };
 }
 
@@ -18030,88 +18124,92 @@ function getSortingFn$1(dataType, customFnOrBuiltIn) {
   return 'auto';
 }
 function useConvertChildrenToColumns(props, options, editing) {
-  var _props$actionsForRow;
-  const columnHelper = reactTable$1.createColumnHelper();
-  const columns = [];
-  const defaultColumnSizing = {};
-  const defaultColumnVisibility = {};
-  const defaultSorting = [];
-  React__default.Children.toArray(props.children).filter(child => !!child) // remove falsey children
-  .forEach(child => {
-    if ( /*#__PURE__*/React__default.isValidElement(child) && child.props.accessor) {
-      var _child$props$enableRe, _child$props$enableFi, _child$props$enableSo, _child$props$enableHi, _child$props$enableOr, _child$props$enableSe, _child$props$enableTr;
-      if (child.props.defaultWidth) {
-        defaultColumnSizing[child.props.accessor] = child.props.defaultWidth === 'grow' ? '1fr' : child.props.defaultWidth;
-      }
-      if (child.props.defaultHidden && options.enableColumnHiding) {
-        defaultColumnVisibility[child.props.accessor] = false;
-      }
-      if (child.props.sort !== undefined) {
-        defaultSorting.push({
+  // It's important to memoise column definitions, because it prevents columns like "Drag column" to re-render on every state change,
+  // and break dragging at the moment it happens.
+  return React__default.useMemo(() => {
+    var _props$actionsForRow;
+    const columnHelper = reactTable$1.createColumnHelper();
+    const columns = [];
+    const defaultColumnSizing = {};
+    const defaultColumnVisibility = {};
+    const defaultSorting = [];
+    React__default.Children.toArray(props.children).filter(child => !!child) // remove falsey children
+    .forEach(child => {
+      if ( /*#__PURE__*/React__default.isValidElement(child) && child.props.accessor) {
+        var _child$props$enableRe, _child$props$enableFi, _child$props$enableSo, _child$props$enableHi, _child$props$enableOr, _child$props$enableSe, _child$props$enableTr;
+        if (child.props.defaultWidth) {
+          defaultColumnSizing[child.props.accessor] = child.props.defaultWidth === 'grow' ? '1fr' : child.props.defaultWidth;
+        }
+        if (child.props.defaultHidden && options.enableColumnHiding) {
+          defaultColumnVisibility[child.props.accessor] = false;
+        }
+        if (child.props.sort !== undefined) {
+          defaultSorting.push({
+            id: child.props.accessor,
+            desc: child.props.sort === 'desc'
+          });
+        }
+        columns.push({
+          accessorKey: child.props.accessor,
           id: child.props.accessor,
-          desc: child.props.sort === 'desc'
+          header: Header$2,
+          cell: Cell$3,
+          footer: Footer$4,
+          // sizing
+          minSize: MIN_COLUMN_SIZE$1,
+          enableResizing: (_child$props$enableRe = child.props.enableResizing) !== null && _child$props$enableRe !== void 0 ? _child$props$enableRe : true,
+          // filtering
+          enableColumnFilter: (_child$props$enableFi = child.props.enableFiltering) !== null && _child$props$enableFi !== void 0 ? _child$props$enableFi : true,
+          filterFn: 'tacoFilter',
+          // sorting
+          enableSorting: (_child$props$enableSo = child.props.enableSorting) !== null && _child$props$enableSo !== void 0 ? _child$props$enableSo : true,
+          sortingFn: getSortingFn$1(child.props.dataType, child.props.sortFn),
+          sortDescFirst: false,
+          sortUndefined: 1,
+          // visibility
+          enableHiding: (_child$props$enableHi = child.props.enableHiding) !== null && _child$props$enableHi !== void 0 ? _child$props$enableHi : true,
+          // custom options
+          meta: {
+            align: child.props.align,
+            className: child.props.className,
+            control: child.props.control,
+            dataType: child.props.dataType,
+            enableOrdering: (_child$props$enableOr = child.props.enableOrdering) !== null && _child$props$enableOr !== void 0 ? _child$props$enableOr : true,
+            enableSearch: (_child$props$enableSe = child.props.enableSearch) !== null && _child$props$enableSe !== void 0 ? _child$props$enableSe : true,
+            enableTruncate: (_child$props$enableTr = child.props.enableTruncate) !== null && _child$props$enableTr !== void 0 ? _child$props$enableTr : false,
+            filters: child.props.filters,
+            footer: child.props.footer,
+            header: child.props.header,
+            headerClassName: child.props.headerClassName,
+            menu: child.props.menu,
+            renderer: child.props.renderer,
+            tooltip: child.props.tooltip
+          }
         });
       }
-      columns.push({
-        accessorKey: child.props.accessor,
-        id: child.props.accessor,
-        header: Header$2,
-        cell: Cell$3,
-        footer: Footer$4,
-        // sizing
-        minSize: MIN_COLUMN_SIZE$1,
-        enableResizing: (_child$props$enableRe = child.props.enableResizing) !== null && _child$props$enableRe !== void 0 ? _child$props$enableRe : true,
-        // filtering
-        enableColumnFilter: (_child$props$enableFi = child.props.enableFiltering) !== null && _child$props$enableFi !== void 0 ? _child$props$enableFi : true,
-        filterFn: 'tacoFilter',
-        // sorting
-        enableSorting: (_child$props$enableSo = child.props.enableSorting) !== null && _child$props$enableSo !== void 0 ? _child$props$enableSo : true,
-        sortingFn: getSortingFn$1(child.props.dataType, child.props.sortFn),
-        sortDescFirst: false,
-        sortUndefined: 1,
-        // visibility
-        enableHiding: (_child$props$enableHi = child.props.enableHiding) !== null && _child$props$enableHi !== void 0 ? _child$props$enableHi : true,
-        // custom options
-        meta: {
-          align: child.props.align,
-          className: child.props.className,
-          control: child.props.control,
-          dataType: child.props.dataType,
-          enableOrdering: (_child$props$enableOr = child.props.enableOrdering) !== null && _child$props$enableOr !== void 0 ? _child$props$enableOr : true,
-          enableSearch: (_child$props$enableSe = child.props.enableSearch) !== null && _child$props$enableSe !== void 0 ? _child$props$enableSe : true,
-          enableTruncate: (_child$props$enableTr = child.props.enableTruncate) !== null && _child$props$enableTr !== void 0 ? _child$props$enableTr : false,
-          filters: child.props.filters,
-          footer: child.props.footer,
-          header: child.props.header,
-          headerClassName: child.props.headerClassName,
-          menu: child.props.menu,
-          renderer: child.props.renderer,
-          tooltip: child.props.tooltip
-        }
-      });
+    });
+    if (options.enableRowExpansion && props.expandedRowRenderer) {
+      columns.unshift(columnHelper.display(createRowExpansionColumn$1(props.expandedRowRenderer)));
     }
-  });
-  if (options.enableRowExpansion && props.expandedRowRenderer) {
-    columns.unshift(columnHelper.display(createRowExpansionColumn$1(props.expandedRowRenderer)));
-  }
-  if (options.enableRowSelection) {
-    columns.unshift(columnHelper.display(createRowSelectionColumn$1(!!(options.enableRowDrag && props.onRowDrag), !!props.expandedRowRenderer)));
-  }
-  if (options.enableRowDrag && props.onRowDrag) {
-    columns.unshift(columnHelper.display(createRowDragColumn(props.onRowDrag)));
-  }
-  if ((_props$actionsForRow = props.actionsForRow) !== null && _props$actionsForRow !== void 0 && _props$actionsForRow.length) {
-    columns.push(columnHelper.display(createRowActionsColumn$1()));
-  }
-  if (editing.isEnabled && editing.isEditing) {
-    columns.push(columnHelper.display(createRowEditingActionsColumn()));
-  }
-  return {
-    columns,
-    defaultColumnSizing,
-    defaultColumnVisibility,
-    defaultSorting
-  };
+    if (options.enableRowSelection) {
+      columns.unshift(columnHelper.display(createRowSelectionColumn$1(!!(options.enableRowDrag && props.onRowDrag), !!props.expandedRowRenderer)));
+    }
+    if (options.enableRowDrag && props.onRowDrag) {
+      columns.unshift(columnHelper.display(createRowDragColumn(props.onRowDrag)));
+    }
+    if ((_props$actionsForRow = props.actionsForRow) !== null && _props$actionsForRow !== void 0 && _props$actionsForRow.length) {
+      columns.push(columnHelper.display(createRowActionsColumn$1()));
+    }
+    if (editing.isEnabled && editing.isEditing) {
+      columns.push(columnHelper.display(createRowEditingActionsColumn()));
+    }
+    return {
+      columns,
+      defaultColumnSizing,
+      defaultColumnVisibility,
+      defaultSorting
+    };
+  }, [props.children]);
 }
 
 function usePrinting(isEnabled, loadAll, showWarningWhenPrintingLargeDataset = true) {
@@ -18240,6 +18338,9 @@ function useRowActions$1(actionsForRow, actionsForRowLength = ACTIONS_ON_ROW_LEN
 
 const useLocalStorage = (key, initialValue) => {
   const [state, setState] = React__default.useState(() => {
+    if (!key) {
+      return initialValue;
+    }
     try {
       const localStorageValue = localStorage.getItem(key);
       if (typeof localStorageValue !== 'string') {
@@ -18256,6 +18357,9 @@ const useLocalStorage = (key, initialValue) => {
     }
   });
   React__default.useEffect(() => {
+    if (!key) {
+      return;
+    }
     try {
       const serializedState = JSON.stringify(state);
       localStorage.setItem(key, serializedState);
@@ -18264,7 +18368,11 @@ const useLocalStorage = (key, initialValue) => {
       // localStorage can throw. Also JSON.stringify can throw.
     }
   }, [key, state]);
-  const clear = () => localStorage.removeItem(key);
+  const clear = () => {
+    if (key) {
+      localStorage.removeItem(key);
+    }
+  };
   return [state, setState, clear];
 };
 
@@ -18278,7 +18386,10 @@ function useUniqueTableId(tableId) {
 }
 function useSettings(id, defaultSettings = {}, onChangeSettings) {
   const uniqueId = useUniqueTableId(id);
-  const [persistedSettings, setPersistedSettings] = useLocalStorage(uniqueId, defaultSettings);
+  // If the onChangeSettings prop is provided, we intend to handle settings changes externally rather than saving them
+  // to local storage.
+  const key = !onChangeSettings ? uniqueId : undefined;
+  const [persistedSettings, setPersistedSettings] = useLocalStorage(key, defaultSettings);
   return React__default.useMemo(() => {
     if (onChangeSettings) {
       return [defaultSettings, onChangeSettings];
@@ -19867,7 +19978,9 @@ function PrintIFrame({
     enableRowDrag: false,
     enableRowDrop: false,
     enableRowSelectionSingle: false,
-    preset: undefined
+    preset: undefined,
+    // The presence of the onChangeSettings prop ensures that settings won't be stored in local storage.
+    onChangeSettings: () => undefined
   };
   // -top-60 -left-60 styles make sure that iframe is added outside of the viewport
   return /*#__PURE__*/React__default.createElement("iframe", {
@@ -19944,7 +20057,6 @@ function PrintButton(props) {
     printWarningDialogVisibility
   } = tableMeta.printing;
   const printTableId = `${tableProps.id}_print`;
-  const printTableLocalStorageKey = useUniqueTableId(printTableId);
   const defaultSettings = React__default.useMemo(() => ({
     columnFreezingIndex: tableMeta.columnFreezing.frozenColumnIndex,
     columnOrder: state.columnOrder,
@@ -19977,9 +20089,6 @@ function PrintButton(props) {
     var _loadingToastRef$curr;
     setIsPrinting(false);
     (_loadingToastRef$curr = loadingToastRef.current) === null || _loadingToastRef$curr === void 0 ? void 0 : _loadingToastRef$curr.close();
-    // Remove print table settings after printing. Doing this will not only remove unwanted localstorage space, but
-    // will also make sure that the table that is getting printed will always have the fresh table settings
-    localStorage.removeItem(printTableLocalStorageKey);
   };
   const handleBeforePrint = () => {
     var _loadingToastRef$curr2;