@economic/taco 2.12.0 → 2.13.0
This diff represents the content of publicly available package versions that have been released to one of the supported registries. The information contained in this diff is provided for informational purposes only and reflects changes between package versions as they appear in their respective public registries.
- package/dist/components/Provider/Localization.d.ts +1 -0
- package/dist/components/Select2/components/Option.d.ts +7 -5
- package/dist/components/Table3/Table3.d.ts +9 -1
- package/dist/components/Table3/components/columns/header/Group.d.ts +15 -0
- package/dist/components/Table3/components/columns/header/Header.d.ts +5 -0
- package/dist/components/Table3/components/columns/internal/EditingActions.d.ts +1 -1
- package/dist/components/Table3/hooks/features/useHeaderOffsetStyle.d.ts +3 -0
- package/dist/components/Table3/types.d.ts +7 -0
- package/dist/esm/index.css +24 -6
- package/dist/esm/packages/taco/src/components/Combobox/useCombobox.js +1 -1
- package/dist/esm/packages/taco/src/components/Combobox/useCombobox.js.map +1 -1
- package/dist/esm/packages/taco/src/components/Drawer/components/Content.js +4 -1
- package/dist/esm/packages/taco/src/components/Drawer/components/Content.js.map +1 -1
- package/dist/esm/packages/taco/src/components/Provider/Localization.js +1 -0
- package/dist/esm/packages/taco/src/components/Provider/Localization.js.map +1 -1
- package/dist/esm/packages/taco/src/components/Select2/components/Option.js +13 -6
- package/dist/esm/packages/taco/src/components/Select2/components/Option.js.map +1 -1
- package/dist/esm/packages/taco/src/components/Select2/components/Trigger.js +7 -6
- package/dist/esm/packages/taco/src/components/Select2/components/Trigger.js.map +1 -1
- package/dist/esm/packages/taco/src/components/Table3/Table3.js +25 -8
- package/dist/esm/packages/taco/src/components/Table3/Table3.js.map +1 -1
- package/dist/esm/packages/taco/src/components/Table3/components/columns/header/Group.js +70 -0
- package/dist/esm/packages/taco/src/components/Table3/components/columns/header/Group.js.map +1 -0
- package/dist/esm/packages/taco/src/components/Table3/components/columns/header/Header.js +26 -8
- package/dist/esm/packages/taco/src/components/Table3/components/columns/header/Header.js.map +1 -1
- package/dist/esm/packages/taco/src/components/Table3/components/columns/internal/EditingActions.js +13 -9
- package/dist/esm/packages/taco/src/components/Table3/components/columns/internal/EditingActions.js.map +1 -1
- package/dist/esm/packages/taco/src/components/Table3/components/toolbar/ColumnSettings.js +8 -5
- package/dist/esm/packages/taco/src/components/Table3/components/toolbar/ColumnSettings.js.map +1 -1
- package/dist/esm/packages/taco/src/components/Table3/components/toolbar/Filter/filters/components/FilterColumn.js +14 -2
- package/dist/esm/packages/taco/src/components/Table3/components/toolbar/Filter/filters/components/FilterColumn.js.map +1 -1
- package/dist/esm/packages/taco/src/components/Table3/hooks/features/useHeaderOffsetStyle.js +24 -0
- package/dist/esm/packages/taco/src/components/Table3/hooks/features/useHeaderOffsetStyle.js.map +1 -0
- package/dist/esm/packages/taco/src/components/Table3/hooks/useConvertChildrenToColumns.js +30 -7
- package/dist/esm/packages/taco/src/components/Table3/hooks/useConvertChildrenToColumns.js.map +1 -1
- package/dist/esm/packages/taco/src/components/Table3/types.js.map +1 -1
- package/dist/index.css +24 -6
- package/dist/taco.cjs.development.js +221 -54
- package/dist/taco.cjs.development.js.map +1 -1
- package/dist/taco.cjs.production.min.js +1 -1
- package/dist/taco.cjs.production.min.js.map +1 -1
- package/package.json +2 -2
- package/types.json +7274 -6482
@@ -9,6 +9,7 @@ import { Cell } from '../components/columns/cell/Cell.js';
|
|
9
9
|
import { createRowSelectionColumn } from '../components/columns/internal/Selection.js';
|
10
10
|
import { createRowExpansionColumn } from '../components/columns/internal/Expansion.js';
|
11
11
|
import { createRowDragColumn } from '../components/columns/internal/Drag.js';
|
12
|
+
import { Group } from '../components/columns/header/Group.js';
|
12
13
|
|
13
14
|
function getSortingFn(dataType, customFnOrBuiltIn) {
|
14
15
|
if (typeof customFnOrBuiltIn === 'function') {
|
@@ -31,13 +32,12 @@ function useConvertChildrenToColumns(props, options, editing) {
|
|
31
32
|
return React__default.useMemo(() => {
|
32
33
|
var _props$actionsForRow;
|
33
34
|
const columnHelper = createColumnHelper();
|
34
|
-
const columns = [];
|
35
35
|
const defaultColumnSizing = {};
|
36
36
|
const defaultColumnVisibility = {};
|
37
37
|
const defaultSorting = [];
|
38
|
-
|
39
|
-
|
40
|
-
if ( /*#__PURE__*/React__default.isValidElement(child) && child.props.accessor) {
|
38
|
+
function processChild(child) {
|
39
|
+
var _child$type, _child$type2;
|
40
|
+
if ( /*#__PURE__*/React__default.isValidElement(child) && ((_child$type = child.type) === null || _child$type === void 0 ? void 0 : _child$type.displayName) === 'Table3Column' && child.props.accessor) {
|
41
41
|
var _child$props$enableRe, _child$props$enableFi, _child$props$enableSo, _child$props$enableHi, _child$props$enableOr, _child$props$enablePr, _child$props$enableSe, _child$props$enableTr;
|
42
42
|
if (child.props.defaultWidth) {
|
43
43
|
defaultColumnSizing[child.props.accessor] = child.props.defaultWidth === 'grow' ? '1fr' : child.props.defaultWidth;
|
@@ -51,7 +51,8 @@ function useConvertChildrenToColumns(props, options, editing) {
|
|
51
51
|
desc: child.props.sort === 'desc'
|
52
52
|
});
|
53
53
|
}
|
54
|
-
|
54
|
+
// return regular column definition
|
55
|
+
return {
|
55
56
|
accessorKey: child.props.accessor,
|
56
57
|
id: child.props.accessor,
|
57
58
|
header: Header,
|
@@ -88,9 +89,31 @@ function useConvertChildrenToColumns(props, options, editing) {
|
|
88
89
|
renderer: child.props.renderer,
|
89
90
|
tooltip: child.props.tooltip
|
90
91
|
}
|
92
|
+
};
|
93
|
+
} else if ( /*#__PURE__*/React__default.isValidElement(child) && ((_child$type2 = child.type) === null || _child$type2 === void 0 ? void 0 : _child$type2.displayName) === 'Table3Group' && child.props.children) {
|
94
|
+
// return column group definition
|
95
|
+
return columnHelper.group({
|
96
|
+
id: child.props.id,
|
97
|
+
header: Group,
|
98
|
+
columns: processChildren(child.props.children),
|
99
|
+
meta: {
|
100
|
+
align: 'center',
|
101
|
+
enableOrdering: false,
|
102
|
+
enableSearch: false,
|
103
|
+
enableTruncate: false,
|
104
|
+
header: child.props.header
|
105
|
+
}
|
91
106
|
});
|
92
107
|
}
|
93
|
-
|
108
|
+
return;
|
109
|
+
}
|
110
|
+
function processChildren(children) {
|
111
|
+
return React__default.Children.toArray(children).map(processChild)
|
112
|
+
// compiler cannot get filtering out undefined items, so using the type casting here
|
113
|
+
.filter(child => !!child); // need to remove undefined array items after processing the children
|
114
|
+
}
|
115
|
+
|
116
|
+
const columns = processChildren(props.children);
|
94
117
|
if (options.enableRowExpansion && props.expandedRowRenderer) {
|
95
118
|
columns.unshift(columnHelper.display(createRowExpansionColumn(props.expandedRowRenderer)));
|
96
119
|
}
|
@@ -112,7 +135,7 @@ function useConvertChildrenToColumns(props, options, editing) {
|
|
112
135
|
defaultColumnVisibility,
|
113
136
|
defaultSorting
|
114
137
|
};
|
115
|
-
}, []);
|
138
|
+
}, [editing.isEditing]);
|
116
139
|
}
|
117
140
|
|
118
141
|
export { useConvertChildrenToColumns };
|
package/dist/esm/packages/taco/src/components/Table3/hooks/useConvertChildrenToColumns.js.map
CHANGED
@@ -1 +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 // 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 enablePrinting: child.props.enablePrinting ?? 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}\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$enablePr","_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","enablePrinting","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,EAAAC,qBAAA;QAC/E,IAAIX,KAAK,CAACf,KAAK,CAAC2B,YAAY,EAAE;UAC1BnB,mBAAmB,CAACO,KAAK,CAACf,KAAK,CAACkB,QAAkB,CAAC,GAC/CH,KAAK,CAACf,KAAK,CAAC2B,YAAY,KAAK,MAAM,GAAG,KAAK,GAAIZ,KAAK,CAACf,KAAK,CAAC2B,YAAoB;;QAGvF,IAAIZ,KAAK,CAACf,KAAK,CAAC4B,aAAa,IAAI3B,OAAO,CAAC4B,kBAAkB,EAAE;UACzDpB,uBAAuB,CAACM,KAAK,CAACf,KAAK,CAACkB,QAAkB,CAAC,GAAG,KAAK;;QAGnE,IAAIH,KAAK,CAACf,KAAK,CAAC8B,IAAI,KAAKC,SAAS,EAAE;UAChCrB,cAAc,CAACsB,IAAI,CAAC;YAChBC,EAAE,EAAElB,KAAK,CAACf,KAAK,CAACkB,QAAkB;YAClCgB,IAAI,EAAEnB,KAAK,CAACf,KAAK,CAAC8B,IAAI,KAAK;WAC9B,CAAC;;QAGNvB,OAAO,CAACyB,IAAI,CAAC;UACTG,WAAW,EAAEpB,KAAK,CAACf,KAAK,CAACkB,QAAQ;UACjCe,EAAE,EAAElB,KAAK,CAACf,KAAK,CAACkB,QAAkB;UAClCkB,MAAM,EAAEC,MAAM;UACdC,IAAI,EAAEC,IAAI;UACVC,MAAM,EAAEC,MAAM;;UAEdC,OAAO,EAAEC,eAAe;UACxBC,cAAc,GAAAzB,qBAAA,GAAEJ,KAAK,CAACf,KAAK,CAAC4C,cAAc,cAAAzB,qBAAA,cAAAA,qBAAA,GAAI,IAAI;;UAElD0B,kBAAkB,GAAAzB,qBAAA,GAAEL,KAAK,CAACf,KAAK,CAAC8C,eAAe,cAAA1B,qBAAA,cAAAA,qBAAA,GAAI,IAAI;UACvD2B,QAAQ,EAAE,YAAmB;;UAE7BC,aAAa,GAAA3B,qBAAA,GAAEN,KAAK,CAACf,KAAK,CAACgD,aAAa,cAAA3B,qBAAA,cAAAA,qBAAA,GAAI,IAAI;UAChD4B,SAAS,EAAEzD,YAAY,CAAQuB,KAAK,CAACf,KAAK,CAACP,QAAQ,EAAEsB,KAAK,CAACf,KAAK,CAACkD,MAAM,CAAC;UACxEC,aAAa,EAAE,KAAK;UACpBC,aAAa,EAAE,CAAC;;UAEhBC,YAAY,GAAA/B,qBAAA,GAAEP,KAAK,CAACf,KAAK,CAACqD,YAAY,cAAA/B,qBAAA,cAAAA,qBAAA,GAAI,IAAI;;UAE9CgC,IAAI,EAAE;YACFC,KAAK,EAAExC,KAAK,CAACf,KAAK,CAACuD,KAAK;YACxBC,SAAS,EAAEzC,KAAK,CAACf,KAAK,CAACwD,SAAS;YAChCC,OAAO,EAAE1C,KAAK,CAACf,KAAK,CAACyD,OAAO;YAC5BhE,QAAQ,EAAEsB,KAAK,CAACf,KAAK,CAACP,QAAQ;YAC9BiE,cAAc,GAAAnC,qBAAA,GAAER,KAAK,CAACf,KAAK,CAAC0D,cAAc,cAAAnC,qBAAA,cAAAA,qBAAA,GAAI,IAAI;YAClDoC,cAAc,GAAAnC,qBAAA,GAAET,KAAK,CAACf,KAAK,CAAC2D,cAAc,cAAAnC,qBAAA,cAAAA,qBAAA,GAAI,IAAI;YAClDoC,YAAY,GAAAnC,qBAAA,GAAEV,KAAK,CAACf,KAAK,CAAC4D,YAAY,cAAAnC,qBAAA,cAAAA,qBAAA,GAAI,IAAI;YAC9CoC,cAAc,GAAAnC,qBAAA,GAAEX,KAAK,CAACf,KAAK,CAAC6D,cAAc,cAAAnC,qBAAA,cAAAA,qBAAA,GAAI,KAAK;YACnDoC,OAAO,EAAE/C,KAAK,CAACf,KAAK,CAAC8D,OAAO;YAC5BtB,MAAM,EAAEzB,KAAK,CAACf,KAAK,CAACwC,MAAM;YAC1BJ,MAAM,EAAErB,KAAK,CAACf,KAAK,CAACoC,MAAM;YAC1B2B,eAAe,EAAEhD,KAAK,CAACf,KAAK,CAAC+D,eAAe;YAC5CC,IAAI,EAAEjD,KAAK,CAACf,KAAK,CAACgE,IAAI;YACtBC,QAAQ,EAAElD,KAAK,CAACf,KAAK,CAACiE,QAAQ;YAC9BC,OAAO,EAAEnD,KAAK,CAACf,KAAK,CAACkE;;SAE5B,CAAC;;KAET,CAAC;IAEN,IAAIjE,OAAO,CAACkE,kBAAkB,IAAInE,KAAK,CAACoE,mBAAmB,EAAE;MACzD7D,OAAO,CAAC8D,OAAO,CAAChE,YAAY,CAACiE,OAAO,CAACC,wBAAwB,CAACvE,KAAK,CAACoE,mBAAmB,CAAC,CAAC,CAAC;;IAG9F,IAAInE,OAAO,CAACuE,kBAAkB,EAAE;MAC5BjE,OAAO,CAAC8D,OAAO,CACXhE,YAAY,CAACiE,OAAO,CAChBG,wBAAwB,CAAQ,CAAC,EAAExE,OAAO,CAACyE,aAAa,IAAI1E,KAAK,CAAC2E,SAAS,CAAC,EAAE,CAAC,CAAC3E,KAAK,CAACoE,mBAAmB,CAAC,CAC7G,CACJ;;IAGL,IAAInE,OAAO,CAACyE,aAAa,IAAI1E,KAAK,CAAC2E,SAAS,EAAE;MAC1CpE,OAAO,CAAC8D,OAAO,CAAChE,YAAY,CAACiE,OAAO,CAACM,mBAAmB,CAAC5E,KAAK,CAAC2E,SAAS,CAAC,CAAC,CAAC;;IAG/E,KAAAE,oBAAA,GAAI7E,KAAK,CAAC8E,aAAa,cAAAD,oBAAA,eAAnBA,oBAAA,CAAqBE,MAAM,EAAE;MAC7BxE,OAAO,CAACyB,IAAI,CAAC3B,YAAY,CAACiE,OAAO,CAACU,sBAAsB,EAAS,CAAC,CAAC;;IAGvE,IAAI9E,OAAO,CAAC+E,SAAS,IAAI/E,OAAO,CAACgF,SAAS,EAAE;MACxC3E,OAAO,CAACyB,IAAI,CAAC3B,YAAY,CAACiE,OAAO,CAACa,6BAA6B,EAAS,CAAC,CAAC;;IAG9E,OAAO;MAAE5E,OAAO;MAAEC,mBAAmB;MAAEC,uBAAuB;MAAEC;KAAgB;GACnF,EAAE,EAAE,CAAC;AACV;;;;"}
|
1
|
+
{"version":3,"file":"useConvertChildrenToColumns.js","sources":["../../../../../../../../src/components/Table3/hooks/useConvertChildrenToColumns.tsx"],"sourcesContent":["import React from 'react';\nimport {\n ColumnDef,\n ColumnSizingState,\n createColumnHelper,\n ColumnSort,\n VisibilityState,\n GroupColumnDef,\n} from '@tanstack/react-table';\nimport { Table3ColumnProps, Table3Props, Table3Options, Table3ColumnDataType, Table3SortFn, Table3GroupProps } 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';\nimport { Group } from '../components/columns/header/Group';\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 defaultColumnSizing: ColumnSizingState = {};\n const defaultColumnVisibility: VisibilityState = {};\n const defaultSorting: ColumnSort[] = [];\n\n function processChild<TType>(child: React.ReactChild | React.ReactFragment | React.ReactPortal) {\n if (\n React.isValidElement<Table3ColumnProps<TType>>(child) &&\n (child as any).type?.displayName === 'Table3Column' &&\n child.props.accessor\n ) {\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 // return regular column definition\n return {\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 enablePrinting: child.props.enablePrinting ?? 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 } else if (\n React.isValidElement<Table3GroupProps>(child) &&\n (child as any).type?.displayName === 'Table3Group' &&\n child.props.children\n ) {\n // return column group definition\n return columnHelper.group({\n id: child.props.id,\n header: Group,\n columns: processChildren(child.props.children),\n meta: {\n align: 'center',\n enableOrdering: false,\n enableSearch: false,\n enableTruncate: false,\n header: child.props.header,\n },\n });\n }\n return;\n }\n\n function processChildren<TType = unknown>(\n children: (JSX.Element | boolean | null | undefined)[]\n ): Array<ColumnDef<TType> | GroupColumnDef<TType>> {\n return (\n React.Children.toArray(children)\n .map(processChild)\n // compiler cannot get filtering out undefined items, so using the type casting here\n .filter(child => !!child) as Array<ColumnDef<TType> | GroupColumnDef<TType>>\n ); // need to remove undefined array items after processing the children\n }\n\n const columns: ColumnDef<TType>[] = processChildren(props.children);\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 }, [editing.isEditing]);\n}\n"],"names":["getSortingFn","dataType","customFnOrBuiltIn","rowA","rowB","columnId","original","useConvertChildrenToColumns","props","options","editing","React","useMemo","columnHelper","createColumnHelper","defaultColumnSizing","defaultColumnVisibility","defaultSorting","processChild","child","isValidElement","_child$type","type","displayName","accessor","_child$props$enableRe","_child$props$enableFi","_child$props$enableSo","_child$props$enableHi","_child$props$enableOr","_child$props$enablePr","_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","enablePrinting","enableSearch","enableTruncate","filters","headerClassName","menu","renderer","tooltip","_child$type2","children","group","Group","columns","processChildren","Children","toArray","map","filter","enableRowExpansion","expandedRowRenderer","unshift","display","createRowExpansionColumn","enableRowSelection","createRowSelectionColumn","enableRowDrag","onRowDrag","createRowDragColumn","_props$actionsForRow","actionsForRow","length","createRowActionsColumn","isEnabled","isEditing","createRowEditingActionsColumn"],"mappings":"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"}
|
@@ -1 +1 @@
|
|
1
|
-
{"version":3,"file":"types.js","sources":["../../../../../../../src/components/Table3/types.ts"],"sourcesContent":["import {\n ColumnFilter as RTColumnFilter,\n ColumnOrderState,\n ColumnSizingState,\n ColumnSort as RTTableColumnSort,\n SortingState,\n VisibilityState,\n BuiltInSortingFn,\n} from '@tanstack/react-table';\nimport { MenuProps } from '../Menu/Menu';\nimport { MenuItemProps } from '../Menu/components/Item';\n\nexport type Table3SortDirection = 'asc' | 'desc';\nexport type Table3SortFn<TType = unknown> =\n | ((rowA: TType, rowB: TType, columnId: string) => -1 | 0 | 1)\n | BuiltInSortingFn\n | 'auto';\n\n// columns\nexport type Table3ColumnRenderer<TValue = unknown, TType = unknown> = (\n value: TValue,\n row: TType\n) => JSX.Element | string | number | null;\nexport type Table3ColumnFooterRenderer<TValue = unknown> = (values: TValue[]) => JSX.Element | string | number | null;\nexport type Table3ColumnClassNameHandler<TType = unknown> = string | ((row: TType) => string | undefined);\nexport type Table3ColumnAlignment = 'left' | 'center' | 'right';\nexport type Table3ColumnDataType = 'auto' | 'number' | 'alphanumeric' | 'alphanumericCaseSensitive' | 'datetime' | 'boolean';\nexport type Table3ColumnHeaderMenu = (props: Partial<MenuProps>) => JSX.Element;\n\nexport type Table3ColumnControlProps = {\n className?: string;\n disabled?: boolean;\n invalid?: boolean;\n onBlur?: (value: any) => void;\n onFocus?: React.FocusEventHandler;\n readOnly?: boolean;\n ref: React.RefObject<HTMLElement>;\n setValue: (value: any) => void;\n value: any;\n};\nexport type Table3ColumnControlRenderer<TType = unknown> =\n | ((props: Table3ColumnControlProps, row?: TType) => JSX.Element)\n | 'datepicker'\n | 'input'\n | 'switch'\n | 'textarea';\n\ntype ValueOf<T> = T[keyof T];\n\nexport type Table3ColumnProps<TType = unknown> = ValueOf<{\n [K in keyof TType]: {\n accessor: K;\n } & {\n align?: Table3ColumnAlignment;\n className?: Table3ColumnClassNameHandler<TType>;\n control?: Table3ColumnControlRenderer<TType>;\n dataType?: Table3ColumnDataType;\n defaultHidden?: boolean;\n defaultWidth?: number | 'grow';\n enableFiltering?: boolean;\n enableHiding?: boolean;\n enableOrdering?: boolean;\n enablePrinting?: boolean;\n enableResizing?: boolean;\n enableSearch?: boolean;\n enableSorting?: boolean;\n enableTruncate?: boolean;\n filters?: Table3FilterComparator[];\n footer?: Table3ColumnFooterRenderer;\n header: string;\n headerClassName?: string;\n menu?: Table3ColumnHeaderMenu;\n minWidth?: number;\n renderer?: Table3ColumnRenderer<TType[K], TType>;\n sort?: Table3SortDirection;\n sortFn?: Table3SortFn<TType>;\n tooltip?: string;\n };\n}>;\n\n// rows\nexport type DeprecatedRowDensity = 'compact' | 'normal' | 'comfortable' | 'spacious';\nexport type Table3RowHeight = 'short' | 'medium' | 'tall' | 'extra-tall';\nexport type Table3FontSize = 'small' | 'medium' | 'large';\nexport type Table3RowClickHandler<TType = unknown> = (row: TType) => void;\nexport type Table3RowDragHandler<TType = unknown> = (\n rows: TType[],\n showPlaceholder: (string) => void,\n setDataTransfer: (data: string) => void\n) => void;\nexport type Table3RowDropHandler<TType = any> = (event: React.DragEvent, row: TType) => void;\nexport type Table3RowExpansionRenderer<TType = unknown> = (row: TType) => (() => JSX.Element) | null;\nexport type Table3RowSelectionHandler<TType = unknown> = (rows: TType[]) => void;\nexport type Table3RowActionRenderer<TType = unknown> = (row: TType) => JSX.Element | null;\n\n// table\nexport type Table3Preset = 'display' | 'editable';\nexport type Table3Settings = {\n columnFreezingIndex?: number;\n columnOrder?: ColumnOrderState;\n columnSizing?: ColumnSizingState;\n columnVisibility?: VisibilityState;\n excludeUnmatchedRecordsInSearch?: boolean;\n fontSize?: Table3FontSize;\n rowHeight?: Table3RowHeight;\n showWarningWhenPrintingLargeDataset?: boolean;\n sorting?: SortingState;\n};\nexport type Table3SettingsHandler = (settings: Table3Settings) => void | Promise<void>;\n\nexport enum Table3FilterComparator {\n Contains,\n DoesNotContain,\n IsEqualTo,\n IsNotEqualTo,\n IsGreaterThan,\n IsLessThan,\n IsBetween,\n IsEmpty,\n IsNotEmpty,\n IsLessThanOrEqualTo,\n IsGreaterThanOrEqualTo,\n HasAnyOf,\n HasAllOf,\n HasNoneOf,\n}\n\nexport type Table3FilterValue = {\n comparator: Table3FilterComparator;\n value: any;\n};\n\nexport type Table3Filter = { id: string; value: Table3FilterValue };\n\nexport type ColumnFilter = RTColumnFilter;\nexport type Table3FilterHandler = (filters: ColumnFilter[]) => void;\nexport type Table3LoadPageHandler = (\n pageIndex: number,\n sorting: Table3ColumnSort[],\n filters: ColumnFilter[],\n search: string | undefined\n) => Promise<void>;\nexport type Table3LoadAllHandler = (\n sorting: Table3ColumnSort[],\n filters: ColumnFilter[],\n search: string | undefined\n) => Promise<void>;\nexport type Table3RowGotoHandler = (\n column: string,\n query: string,\n sorting: Table3ColumnSort[],\n filters: ColumnFilter[],\n search: string | undefined\n) => Promise<number>;\nexport type Table3ColumnSort = RTTableColumnSort;\nexport type Table3SortHandler = (sorting: Table3ColumnSort[]) => void;\nexport type TableStrategy = {\n renderBody: () => JSX.Element | JSX.Element[] | null;\n scrollToIndex: (index: number, options?: { align: 'start' | 'center' | 'end' | 'auto' }) => void;\n};\nexport type Table3ShortcutHandlerFn<TType = unknown> = (row: TType) => void;\nexport type Table3ShortcutHandlerObject<TType = unknown> = {\n handler: Table3ShortcutHandlerFn<TType>;\n meta?: boolean;\n shift?: boolean;\n};\nexport type Table3Shortcuts<TType = unknown> = Record<\n string,\n Table3ShortcutHandlerFn<TType> | Table3ShortcutHandlerObject<TType>\n>;\nexport type Table3SaveHandler<TType = unknown> = (data: TType) => Promise<void>;\n\nexport type Table3Options = {\n enableColumnFreezing: boolean;\n enableColumnHiding: boolean;\n enableColumnOrdering: boolean;\n enableColumnResizing: boolean;\n enableFontSize: boolean;\n enableFooter: boolean;\n enablePrinting: boolean;\n enableRowDrag: boolean;\n enableRowDrop: boolean;\n enableRowExpansion: boolean;\n enableRowGoto: boolean;\n enableRowHeight: boolean;\n enableRowSelection: boolean;\n enableRowSelectionSingle: boolean;\n enableEditing: boolean;\n enableFiltering: boolean;\n enableSearch: boolean;\n enableSorting: boolean;\n};\n\nexport type Table3CustomSettingRenderer = (props: Table3Settings) => React.ReactElement<MenuItemProps> | null;\n\nexport type Table3CommonProps<TType = unknown> = Partial<Table3Options> & {\n actionsForRow?: Table3RowActionRenderer<TType>[];\n actionsForRowLength?: number;\n autoFocus?: boolean;\n children: (JSX.Element | boolean | null | undefined)[];\n customSettings?: Table3CustomSettingRenderer[];\n data: TType[];\n defaultColumnFreezingIndex?: number;\n defaultCurrentRowIndex?: number;\n defaultSettings?: Table3Settings;\n emptyState?: () => JSX.Element | null;\n expandedRowRenderer?: Table3RowExpansionRenderer<TType>;\n id: string;\n onChangeSettings?: Table3SettingsHandler;\n onRowClick?: Table3RowClickHandler<TType>;\n onRowDrag?: Table3RowDragHandler<TType>;\n onRowDrop?: Table3RowDropHandler<TType>;\n onRowGoto?: Table3RowGotoHandler;\n onRowSelect?: Table3RowSelectionHandler<TType>;\n onFilter?: Table3FilterHandler;\n onSave?: Table3SaveHandler<TType>;\n onSort?: Table3SortHandler;\n preset?: Table3Preset;\n shortcuts?: Table3Shortcuts<TType>;\n toolbarLeft?: JSX.Element;\n toolbarRight?: JSX.Element;\n};\n\ninterface Table3ClientProps<TType = unknown> extends Table3CommonProps<TType> {\n length?: never;\n loadPage?: never;\n loadAll?: never;\n pageSize?: never;\n}\n\ninterface Table3ServerProps<TType = unknown> extends Table3CommonProps<TType> {\n length: number | undefined;\n loadPage: Table3LoadPageHandler;\n loadAll: Table3LoadAllHandler;\n pageSize?: number;\n}\n\nexport type Table3Props<TType = unknown> = Table3ClientProps<TType> | Table3ServerProps<TType>;\n\nexport type Table3Ref = HTMLDivElement & {\n instance: {\n resetFiltering: () => void;\n resetRowExpansion: () => void;\n resetRowSelection: () => void;\n resetSorting: () => void;\n toggleEditing: (enabled: boolean | undefined) => void;\n };\n};\n\nexport type Table3Texts = {\n columns: {\n actions: {\n tooltip: string;\n };\n drag: {\n tooltip: string;\n };\n expansion: {\n collapse: string;\n collapseAll: string;\n expand: string;\n expandAll: string;\n };\n menu: {\n freezeFirstColumn: string;\n freezeUptoColumn: string;\n gotoRow: string;\n hideColumn: string;\n unfreezeColumns: string;\n sorting: string;\n sortingOrder: {\n ascending: string;\n descending: string;\n unsorted: string;\n };\n };\n resize: {\n tooltip: string;\n };\n select: {\n deselect: string;\n deselectAll: string;\n select: string;\n selectAll: string;\n };\n };\n columnSettings: {\n button: string;\n noResults: string;\n search: string;\n tooltip: string;\n };\n editing: {\n actions: {\n tooltip: string;\n save: string;\n clear: string;\n exit: string;\n };\n buttons: {\n edit: {\n tooltip: string;\n };\n };\n rowIndicator: {\n rowWillMove: string;\n rowWillBeHidden: string;\n rowWillMoveReasonSearch: string;\n rowWillMoveReasonFilter: string;\n rowWillMoveReasonSorting: string;\n };\n saving: {\n progress: string;\n complete: string;\n };\n };\n filters: {\n button: string;\n buttons: {\n addFilter: string;\n clearFilters: string;\n };\n comparators: {\n contains: string;\n doesNotContain: string;\n isEqualTo: string;\n isNotEqualTo: string;\n isGreaterThan: string;\n isLessThan: string;\n isBetween: string;\n isEmpty: string;\n isNotEmpty: string;\n isBefore: string;\n isAfter: string;\n isLessThanOrEqualTo: string;\n isGreaterThanOrEqualTo: string;\n isOnOrBefore: string;\n isOnOrAfter: string;\n hasAnyOf: string;\n hasAllOf: string;\n hasNoneOf: string;\n };\n conditions: {\n and: string;\n where: string;\n };\n emptyFilter: {\n condition: string;\n value: string;\n };\n tooltip: string;\n total: string;\n };\n fontSize: {\n tooltip: string;\n sizes: {\n small: string;\n medium: string;\n large: string;\n };\n };\n footer: {\n summary: {\n count: string;\n records: string;\n selected: string;\n };\n };\n print: {\n error: string;\n loading: string;\n tooltip: string;\n warningDialog: {\n title: string;\n description: string;\n checkboxVisibilityLabel: string;\n cancelButtonText: string;\n printButtonText: string;\n };\n };\n rowHeight: {\n tooltip: string;\n sizes: {\n short: string;\n medium: string;\n tall: string;\n extraTall: string;\n };\n };\n search: {\n excludeUnmatchedResults: string;\n placeholder: string;\n };\n otherOptions: {\n tooltip: string;\n };\n};\n"],"names":["Table3FilterComparator"],"mappings":"IA8GYA;AAAZ,WAAYA,sBAAsB;EAC9BA,2EAAQ;EACRA,uFAAc;EACdA,6EAAS;EACTA,mFAAY;EACZA,qFAAa;EACbA,+EAAU;EACVA,6EAAS;EACTA,yEAAO;EACPA,+EAAU;EACVA,iGAAmB;EACnBA,wGAAsB;EACtBA,4EAAQ;EACRA,4EAAQ;EACRA,8EAAS;AACb,CAAC,EAfWA,sBAAsB,KAAtBA,sBAAsB;;;;"}
|
1
|
+
{"version":3,"file":"types.js","sources":["../../../../../../../src/components/Table3/types.ts"],"sourcesContent":["import {\n ColumnFilter as RTColumnFilter,\n ColumnOrderState,\n ColumnSizingState,\n ColumnSort as RTTableColumnSort,\n SortingState,\n VisibilityState,\n BuiltInSortingFn,\n} from '@tanstack/react-table';\nimport { MenuProps } from '../Menu/Menu';\nimport { MenuItemProps } from '../Menu/components/Item';\n\nexport type Table3SortDirection = 'asc' | 'desc';\nexport type Table3SortFn<TType = unknown> =\n | ((rowA: TType, rowB: TType, columnId: string) => -1 | 0 | 1)\n | BuiltInSortingFn\n | 'auto';\n\n// columns\nexport type Table3ColumnRenderer<TValue = unknown, TType = unknown> = (\n value: TValue,\n row: TType\n) => JSX.Element | string | number | null;\nexport type Table3ColumnFooterRenderer<TValue = unknown> = (values: TValue[]) => JSX.Element | string | number | null;\nexport type Table3ColumnClassNameHandler<TType = unknown> = string | ((row: TType) => string | undefined);\nexport type Table3ColumnAlignment = 'left' | 'center' | 'right';\nexport type Table3ColumnDataType = 'auto' | 'number' | 'alphanumeric' | 'alphanumericCaseSensitive' | 'datetime' | 'boolean';\nexport type Table3ColumnHeaderMenu = (props: Partial<MenuProps>) => JSX.Element;\n\nexport type Table3ColumnControlProps = {\n className?: string;\n disabled?: boolean;\n invalid?: boolean;\n onBlur?: (value: any) => void;\n onFocus?: React.FocusEventHandler;\n readOnly?: boolean;\n ref: React.RefObject<HTMLElement>;\n setValue: (value: any) => void;\n value: any;\n};\nexport type Table3ColumnControlRenderer<TType = unknown> =\n | ((props: Table3ColumnControlProps, row?: TType) => JSX.Element)\n | 'datepicker'\n | 'input'\n | 'switch'\n | 'textarea';\n\ntype ValueOf<T> = T[keyof T];\n\nexport type Table3ColumnProps<TType = unknown> = ValueOf<{\n [K in keyof TType]: {\n accessor: K;\n } & {\n align?: Table3ColumnAlignment;\n className?: Table3ColumnClassNameHandler<TType>;\n control?: Table3ColumnControlRenderer<TType>;\n dataType?: Table3ColumnDataType;\n defaultHidden?: boolean;\n defaultWidth?: number | 'grow';\n enableFiltering?: boolean;\n enableHiding?: boolean;\n enableOrdering?: boolean;\n enablePrinting?: boolean;\n enableResizing?: boolean;\n enableSearch?: boolean;\n enableSorting?: boolean;\n enableTruncate?: boolean;\n filters?: Table3FilterComparator[];\n footer?: Table3ColumnFooterRenderer;\n header: string;\n headerClassName?: string;\n menu?: Table3ColumnHeaderMenu;\n minWidth?: number;\n renderer?: Table3ColumnRenderer<TType[K], TType>;\n sort?: Table3SortDirection;\n sortFn?: Table3SortFn<TType>;\n tooltip?: string;\n };\n}>;\n\nexport type Table3GroupProps = {\n id: string;\n header: string;\n colSpan?: number;\n children: (JSX.Element | boolean | null | undefined)[];\n};\n\n// rows\nexport type DeprecatedRowDensity = 'compact' | 'normal' | 'comfortable' | 'spacious';\nexport type Table3RowHeight = 'short' | 'medium' | 'tall' | 'extra-tall';\nexport type Table3FontSize = 'small' | 'medium' | 'large';\nexport type Table3RowClickHandler<TType = unknown> = (row: TType) => void;\nexport type Table3RowDragHandler<TType = unknown> = (\n rows: TType[],\n showPlaceholder: (string) => void,\n setDataTransfer: (data: string) => void\n) => void;\nexport type Table3RowDropHandler<TType = any> = (event: React.DragEvent, row: TType) => void;\nexport type Table3RowExpansionRenderer<TType = unknown> = (row: TType) => (() => JSX.Element) | null;\nexport type Table3RowSelectionHandler<TType = unknown> = (rows: TType[]) => void;\nexport type Table3RowActionRenderer<TType = unknown> = (row: TType) => JSX.Element | null;\n\n// table\nexport type Table3Preset = 'display' | 'editable';\nexport type Table3Settings = {\n columnFreezingIndex?: number;\n columnOrder?: ColumnOrderState;\n columnSizing?: ColumnSizingState;\n columnVisibility?: VisibilityState;\n excludeUnmatchedRecordsInSearch?: boolean;\n fontSize?: Table3FontSize;\n rowHeight?: Table3RowHeight;\n showWarningWhenPrintingLargeDataset?: boolean;\n sorting?: SortingState;\n};\nexport type Table3SettingsHandler = (settings: Table3Settings) => void | Promise<void>;\n\nexport enum Table3FilterComparator {\n Contains,\n DoesNotContain,\n IsEqualTo,\n IsNotEqualTo,\n IsGreaterThan,\n IsLessThan,\n IsBetween,\n IsEmpty,\n IsNotEmpty,\n IsLessThanOrEqualTo,\n IsGreaterThanOrEqualTo,\n HasAnyOf,\n HasAllOf,\n HasNoneOf,\n}\n\nexport type Table3FilterValue = {\n comparator: Table3FilterComparator;\n value: any;\n};\n\nexport type Table3Filter = { id: string; value: Table3FilterValue };\n\nexport type ColumnFilter = RTColumnFilter;\nexport type Table3FilterHandler = (filters: ColumnFilter[]) => void;\nexport type Table3LoadPageHandler = (\n pageIndex: number,\n sorting: Table3ColumnSort[],\n filters: ColumnFilter[],\n search: string | undefined\n) => Promise<void>;\nexport type Table3LoadAllHandler = (\n sorting: Table3ColumnSort[],\n filters: ColumnFilter[],\n search: string | undefined\n) => Promise<void>;\nexport type Table3RowGotoHandler = (\n column: string,\n query: string,\n sorting: Table3ColumnSort[],\n filters: ColumnFilter[],\n search: string | undefined\n) => Promise<number>;\nexport type Table3ColumnSort = RTTableColumnSort;\nexport type Table3SortHandler = (sorting: Table3ColumnSort[]) => void;\nexport type TableStrategy = {\n renderBody: () => JSX.Element | JSX.Element[] | null;\n scrollToIndex: (index: number, options?: { align: 'start' | 'center' | 'end' | 'auto' }) => void;\n};\nexport type Table3ShortcutHandlerFn<TType = unknown> = (row: TType) => void;\nexport type Table3ShortcutHandlerObject<TType = unknown> = {\n handler: Table3ShortcutHandlerFn<TType>;\n meta?: boolean;\n shift?: boolean;\n};\nexport type Table3Shortcuts<TType = unknown> = Record<\n string,\n Table3ShortcutHandlerFn<TType> | Table3ShortcutHandlerObject<TType>\n>;\nexport type Table3SaveHandler<TType = unknown> = (data: TType) => Promise<void>;\n\nexport type Table3Options = {\n enableColumnFreezing: boolean;\n enableColumnHiding: boolean;\n enableColumnOrdering: boolean;\n enableColumnResizing: boolean;\n enableFontSize: boolean;\n enableFooter: boolean;\n enablePrinting: boolean;\n enableRowDrag: boolean;\n enableRowDrop: boolean;\n enableRowExpansion: boolean;\n enableRowGoto: boolean;\n enableRowHeight: boolean;\n enableRowSelection: boolean;\n enableRowSelectionSingle: boolean;\n enableEditing: boolean;\n enableFiltering: boolean;\n enableSearch: boolean;\n enableSorting: boolean;\n};\n\nexport type Table3CustomSettingRenderer = (props: Table3Settings) => React.ReactElement<MenuItemProps> | null;\n\nexport type Table3CommonProps<TType = unknown> = Partial<Table3Options> & {\n actionsForRow?: Table3RowActionRenderer<TType>[];\n actionsForRowLength?: number;\n autoFocus?: boolean;\n children: (JSX.Element | boolean | null | undefined)[];\n customSettings?: Table3CustomSettingRenderer[];\n data: TType[];\n defaultColumnFreezingIndex?: number;\n defaultCurrentRowIndex?: number;\n defaultSettings?: Table3Settings;\n emptyState?: () => JSX.Element | null;\n expandedRowRenderer?: Table3RowExpansionRenderer<TType>;\n id: string;\n onChangeSettings?: Table3SettingsHandler;\n onRowClick?: Table3RowClickHandler<TType>;\n onRowDrag?: Table3RowDragHandler<TType>;\n onRowDrop?: Table3RowDropHandler<TType>;\n onRowGoto?: Table3RowGotoHandler;\n onRowSelect?: Table3RowSelectionHandler<TType>;\n onFilter?: Table3FilterHandler;\n onSave?: Table3SaveHandler<TType>;\n onSort?: Table3SortHandler;\n preset?: Table3Preset;\n shortcuts?: Table3Shortcuts<TType>;\n toolbarLeft?: JSX.Element;\n toolbarRight?: JSX.Element;\n};\n\ninterface Table3ClientProps<TType = unknown> extends Table3CommonProps<TType> {\n length?: never;\n loadPage?: never;\n loadAll?: never;\n pageSize?: never;\n}\n\ninterface Table3ServerProps<TType = unknown> extends Table3CommonProps<TType> {\n length: number | undefined;\n loadPage: Table3LoadPageHandler;\n loadAll: Table3LoadAllHandler;\n pageSize?: number;\n}\n\nexport type Table3Props<TType = unknown> = Table3ClientProps<TType> | Table3ServerProps<TType>;\n\nexport type Table3Ref = HTMLDivElement & {\n instance: {\n resetFiltering: () => void;\n resetRowExpansion: () => void;\n resetRowSelection: () => void;\n resetSorting: () => void;\n toggleEditing: (enabled: boolean | undefined) => void;\n };\n};\n\nexport type Table3Texts = {\n columns: {\n actions: {\n tooltip: string;\n };\n drag: {\n tooltip: string;\n };\n expansion: {\n collapse: string;\n collapseAll: string;\n expand: string;\n expandAll: string;\n };\n menu: {\n freezeFirstColumn: string;\n freezeUptoColumn: string;\n gotoRow: string;\n hideColumn: string;\n unfreezeColumns: string;\n sorting: string;\n sortingOrder: {\n ascending: string;\n descending: string;\n unsorted: string;\n };\n };\n resize: {\n tooltip: string;\n };\n select: {\n deselect: string;\n deselectAll: string;\n select: string;\n selectAll: string;\n };\n };\n columnSettings: {\n button: string;\n noResults: string;\n search: string;\n tooltip: string;\n };\n editing: {\n actions: {\n tooltip: string;\n save: string;\n clear: string;\n exit: string;\n };\n buttons: {\n edit: {\n tooltip: string;\n };\n };\n rowIndicator: {\n rowWillMove: string;\n rowWillBeHidden: string;\n rowWillMoveReasonSearch: string;\n rowWillMoveReasonFilter: string;\n rowWillMoveReasonSorting: string;\n };\n saving: {\n progress: string;\n complete: string;\n };\n };\n filters: {\n button: string;\n buttons: {\n addFilter: string;\n clearFilters: string;\n };\n comparators: {\n contains: string;\n doesNotContain: string;\n isEqualTo: string;\n isNotEqualTo: string;\n isGreaterThan: string;\n isLessThan: string;\n isBetween: string;\n isEmpty: string;\n isNotEmpty: string;\n isBefore: string;\n isAfter: string;\n isLessThanOrEqualTo: string;\n isGreaterThanOrEqualTo: string;\n isOnOrBefore: string;\n isOnOrAfter: string;\n hasAnyOf: string;\n hasAllOf: string;\n hasNoneOf: string;\n };\n conditions: {\n and: string;\n where: string;\n };\n emptyFilter: {\n condition: string;\n value: string;\n };\n hiddenColumn: string;\n tooltip: string;\n total: string;\n };\n fontSize: {\n tooltip: string;\n sizes: {\n small: string;\n medium: string;\n large: string;\n };\n };\n footer: {\n summary: {\n count: string;\n records: string;\n selected: string;\n };\n };\n print: {\n error: string;\n loading: string;\n tooltip: string;\n warningDialog: {\n title: string;\n description: string;\n checkboxVisibilityLabel: string;\n cancelButtonText: string;\n printButtonText: string;\n };\n };\n rowHeight: {\n tooltip: string;\n sizes: {\n short: string;\n medium: string;\n tall: string;\n extraTall: string;\n };\n };\n search: {\n excludeUnmatchedResults: string;\n placeholder: string;\n };\n otherOptions: {\n tooltip: string;\n };\n};\n"],"names":["Table3FilterComparator"],"mappings":"IAqHYA;AAAZ,WAAYA,sBAAsB;EAC9BA,2EAAQ;EACRA,uFAAc;EACdA,6EAAS;EACTA,mFAAY;EACZA,qFAAa;EACbA,+EAAU;EACVA,6EAAS;EACTA,yEAAO;EACPA,+EAAU;EACVA,iGAAmB;EACnBA,wGAAsB;EACtBA,4EAAQ;EACRA,4EAAQ;EACRA,8EAAS;AACb,CAAC,EAfWA,sBAAsB,KAAtBA,sBAAsB;;;;"}
|
package/dist/index.css
CHANGED
@@ -641,12 +641,14 @@
|
|
641
641
|
/* cells */
|
642
642
|
[role='cell'],
|
643
643
|
[role='columnheader'],
|
644
|
+
[data-taco='table3-column-group'] > div,
|
644
645
|
[data-taco='table2-footer-summary'] {
|
645
646
|
@apply border-grey-300;
|
646
647
|
}
|
647
648
|
|
648
649
|
[role='cell']:not([data-highlighted='true']),
|
649
|
-
[role='columnheader']
|
650
|
+
[role='columnheader'],
|
651
|
+
[data-taco='table3-column-group'] > div {
|
650
652
|
@apply flex;
|
651
653
|
}
|
652
654
|
|
@@ -657,17 +659,20 @@
|
|
657
659
|
}
|
658
660
|
|
659
661
|
[role='cell'][data-align='left'],
|
660
|
-
[role='columnheader'][data-align='left']
|
662
|
+
[role='columnheader'][data-align='left'],
|
663
|
+
[data-taco='table3-column-group'][data-align='left'] > div {
|
661
664
|
@apply justify-start text-left;
|
662
665
|
}
|
663
666
|
|
664
667
|
[role='cell'][data-align='center'],
|
665
|
-
[role='columnheader'][data-align='center']
|
668
|
+
[role='columnheader'][data-align='center'],
|
669
|
+
[data-taco='table3-column-group'][data-align='center'] > div {
|
666
670
|
@apply justify-center text-center;
|
667
671
|
}
|
668
672
|
|
669
673
|
[role='cell'][data-align='right'],
|
670
|
-
[role='columnheader'][data-align='right']
|
674
|
+
[role='columnheader'][data-align='right'],
|
675
|
+
[data-taco='table3-column-group'][data-align='right'] > div {
|
671
676
|
@apply justify-end text-right;
|
672
677
|
}
|
673
678
|
|
@@ -683,10 +688,18 @@
|
|
683
688
|
|
684
689
|
/* row/cell backgrounds */
|
685
690
|
|
686
|
-
[role='columnheader']
|
691
|
+
[role='columnheader'],
|
692
|
+
[data-taco='table3-column-group'] > div {
|
687
693
|
@apply bg-white;
|
688
694
|
}
|
689
695
|
|
696
|
+
[role='columnheader'] [data-taco='header-separator'] {
|
697
|
+
@apply -mr-1;
|
698
|
+
}
|
699
|
+
[data-taco='table3-column-group'] [data-taco='header-separator'] {
|
700
|
+
@apply -mr-3;
|
701
|
+
}
|
702
|
+
|
690
703
|
/* normal rows */
|
691
704
|
[role='row']:not([data-selected='true']):not([data-error='true']) [role='cell'] {
|
692
705
|
@apply bg-white;
|
@@ -797,7 +810,12 @@
|
|
797
810
|
@apply !-my-2;
|
798
811
|
}
|
799
812
|
|
800
|
-
[data-font-size='small'] [role='cell']
|
813
|
+
[data-font-size='small'] [role='cell'] [data-taco='spinner'] {
|
814
|
+
@apply !h-4 !w-4;
|
815
|
+
}
|
816
|
+
|
817
|
+
[data-font-size='small'] [role='cell'] > [data-taco='icon'],
|
818
|
+
[data-font-size='small'] [role='cell'] [data-taco='spinner'] {
|
801
819
|
@apply !-my-[3px];
|
802
820
|
}
|
803
821
|
|