@economic/taco 2.47.0-server.3 → 2.47.0-server.4
Sign up to get free protection for your applications and to get access to all the features.
- package/dist/components/Select2/components/Option.d.ts +4 -4
- package/dist/esm/index.css +11 -2
- package/dist/esm/packages/taco/src/charts/utils/color.js.map +1 -1
- package/dist/esm/packages/taco/src/components/Badge/Badge.js +9 -6
- package/dist/esm/packages/taco/src/components/Badge/Badge.js.map +1 -1
- package/dist/esm/packages/taco/src/components/Select2/components/Option.js +7 -5
- 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 +56 -19
- package/dist/esm/packages/taco/src/components/Select2/components/Trigger.js.map +1 -1
- package/dist/esm/packages/taco/src/components/Table3/Table3.js +12 -14
- package/dist/esm/packages/taco/src/components/Table3/Table3.js.map +1 -1
- package/dist/esm/packages/taco/src/components/Tag/Tag.js +6 -4
- package/dist/esm/packages/taco/src/components/Tag/Tag.js.map +1 -1
- package/dist/esm/packages/taco/src/primitives/Table/Core/components/Row/Row.js +12 -10
- package/dist/esm/packages/taco/src/primitives/Table/Core/components/Row/Row.js.map +1 -1
- package/dist/esm/packages/taco/src/primitives/Table/Core/components/Toolbar/components/Filters/FilterContext.js +6 -0
- package/dist/esm/packages/taco/src/primitives/Table/Core/components/Toolbar/components/Filters/FilterContext.js.map +1 -0
- package/dist/esm/packages/taco/src/primitives/Table/Core/components/Toolbar/components/Filters/ManageFiltersPopover.js +5 -3
- package/dist/esm/packages/taco/src/primitives/Table/Core/components/Toolbar/components/Filters/ManageFiltersPopover.js.map +1 -1
- package/dist/esm/packages/taco/src/primitives/Table/Core/components/Toolbar/components/Filters/components/Filter.js +0 -2
- package/dist/esm/packages/taco/src/primitives/Table/Core/components/Toolbar/components/Filters/components/Filter.js.map +1 -1
- package/dist/esm/packages/taco/src/primitives/Table/Core/components/Toolbar/components/Filters/components/FilterColumn.js +2 -1
- package/dist/esm/packages/taco/src/primitives/Table/Core/components/Toolbar/components/Filters/components/FilterColumn.js.map +1 -1
- package/dist/esm/packages/taco/src/primitives/Table/Core/components/Toolbar/components/Filters/components/FilterValue.js +3 -1
- package/dist/esm/packages/taco/src/primitives/Table/Core/components/Toolbar/components/Filters/components/FilterValue.js.map +1 -1
- package/dist/esm/packages/taco/src/primitives/Table/types.js.map +1 -1
- package/dist/esm/packages/taco/src/primitives/Table/useTableManager/features/useTableServerLoading.js +3 -1
- package/dist/esm/packages/taco/src/primitives/Table/useTableManager/features/useTableServerLoading.js.map +1 -1
- package/dist/esm/packages/taco/src/primitives/Table/useTableManager/useTableManager.js +1 -1
- package/dist/esm/packages/taco/src/primitives/Table/useTableManager/useTableManager.js.map +1 -1
- package/dist/index.css +11 -2
- package/dist/primitives/Table/Core/components/Toolbar/components/Filters/FilterContext.d.ts +3 -0
- package/dist/primitives/Table/Core/components/Toolbar/components/Filters/components/Filter.d.ts +0 -1
- package/dist/primitives/Table/Core/components/Toolbar/components/Filters/components/FilterColumn.d.ts +0 -3
- package/dist/primitives/Table/types.d.ts +1 -1
- package/dist/primitives/Table/useTableManager/features/useTableServerLoading.d.ts +2 -1
- package/dist/taco.cjs.development.js +115 -67
- 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 +1 -2
@@ -1 +1 @@
|
|
1
|
-
{"version":3,"file":"Table3.js","sources":["../../../../../../../src/components/Table3/Table3.tsx"],"sourcesContent":["import React from 'react';\nimport { fixedForwardRef } from '../../types';\nimport { useTable3 } from './useTable3';\nimport { Table } from '../../primitives/Table/Core/Table';\nimport { Alert } from './components/Editing/Alert';\nimport { Table3Props, Table3Ref, Table3ColumnProps, Table3GroupProps } from './types';\nimport { Editing } from './components/Toolbar/Editing/Editing';\nimport { CreateNewRow } from './components/Row/Editing/CreateNewRow';\nimport { TemporaryRow } from './components/Row/Editing/TemporaryRow';\nimport './style.css';\nimport { isTableScrolled } from './util/editing';\n\nfunction Column<TType = unknown>(_: Table3ColumnProps<TType>) {\n return null;\n}\nColumn.displayName = 'Table3Column';\n\nfunction Group(_: Table3GroupProps) {\n return null;\n}\nGroup.displayName = 'Table3Group';\n\nconst BaseTable3 = fixedForwardRef(function BaseTable3<TType = unknown>(props: Table3Props<TType>, ref: React.Ref<Table3Ref>) {\n const table3 = useTable3<TType>(props, ref);\n\n const gridAttributes = {\n 'data-table-editing-mode': table3.meta.editing?.isEditing\n ? table3.meta.editing?.isDetailedMode\n ? 'detailed'\n : 'normal'\n : undefined,\n enableHorizontalArrowKeyNavigation: table3.meta.editing.isEditing,\n };\n\n const hasAlertErrors = table3.meta.editing.getErrorsShownInAlert().length;\n const hasCreateWorkflow = table3.meta.editing.isEnabled && props.onEditingCreate;\n const isScrolled = isTableScrolled(table3.ref);\n\n return (\n <Table>\n <Table.Toolbar<TType> table={table3}>\n {table3.meta.editing.isEnabled ? (\n <Editing scrollToIndex={table3.renderer.scrollToIndex} table={table3.instance} />\n ) : null}\n </Table.Toolbar>\n {hasAlertErrors ? (\n <Alert\n className=\"mb-4\"\n scrollToIndex={table3.renderer.scrollToIndex}\n table={table3.instance}\n tableRef={table3.ref}\n />\n ) : null}\n <Table.Grid<TType>\n {...gridAttributes}\n data-taco=\"table3\"\n footerRows={
|
1
|
+
{"version":3,"file":"Table3.js","sources":["../../../../../../../src/components/Table3/Table3.tsx"],"sourcesContent":["import React from 'react';\nimport { fixedForwardRef } from '../../types';\nimport { useTable3 } from './useTable3';\nimport { Table } from '../../primitives/Table/Core/Table';\nimport { Alert } from './components/Editing/Alert';\nimport { Table3Props, Table3Ref, Table3ColumnProps, Table3GroupProps } from './types';\nimport { Editing } from './components/Toolbar/Editing/Editing';\nimport { CreateNewRow } from './components/Row/Editing/CreateNewRow';\nimport { TemporaryRow } from './components/Row/Editing/TemporaryRow';\nimport './style.css';\nimport { isTableScrolled } from './util/editing';\n\nfunction Column<TType = unknown>(_: Table3ColumnProps<TType>) {\n return null;\n}\nColumn.displayName = 'Table3Column';\n\nfunction Group(_: Table3GroupProps) {\n return null;\n}\nGroup.displayName = 'Table3Group';\n\nconst BaseTable3 = fixedForwardRef(function BaseTable3<TType = unknown>(props: Table3Props<TType>, ref: React.Ref<Table3Ref>) {\n const table3 = useTable3<TType>(props, ref);\n\n const gridAttributes = {\n 'data-table-editing-mode': table3.meta.editing?.isEditing\n ? table3.meta.editing?.isDetailedMode\n ? 'detailed'\n : 'normal'\n : undefined,\n enableHorizontalArrowKeyNavigation: table3.meta.editing.isEditing,\n };\n\n const hasAlertErrors = table3.meta.editing.getErrorsShownInAlert().length;\n const hasCreateWorkflow = table3.meta.editing.isEnabled && props.onEditingCreate;\n const isScrolled = isTableScrolled(table3.ref);\n\n let createWorkflow;\n\n if (hasCreateWorkflow) {\n createWorkflow = (\n <CreateNewRow\n buttonRef={table3.meta.editing.createRowButtonRef}\n isScrolled={isScrolled}\n scrollToIndex={table3.renderer.scrollToIndex}\n table={table3.instance}\n tableMeta={table3.meta}\n />\n );\n }\n\n return (\n <Table>\n <Table.Toolbar<TType> table={table3}>\n {table3.meta.editing.isEnabled ? (\n <Editing scrollToIndex={table3.renderer.scrollToIndex} table={table3.instance} />\n ) : null}\n </Table.Toolbar>\n {hasAlertErrors ? (\n <Alert\n className=\"mb-4\"\n scrollToIndex={table3.renderer.scrollToIndex}\n table={table3.instance}\n tableRef={table3.ref}\n />\n ) : null}\n <Table.Grid<TType>\n {...gridAttributes}\n data-taco=\"table3\"\n footerRows={hasCreateWorkflow && isScrolled ? createWorkflow : undefined}\n table={table3}>\n {hasCreateWorkflow ? (\n <>\n <TemporaryRow\n createRowButtonRef={table3.meta.editing.createRowButtonRef}\n isScrolled={isScrolled}\n table={table3.instance}\n tableMeta={table3.meta}\n tableRef={table3.ref}\n />\n {!isScrolled ? createWorkflow : null}\n </>\n ) : null}\n </Table.Grid>\n </Table>\n );\n});\n\nexport const Table3 = fixedForwardRef(function Table3<TType = unknown>(props: Table3Props<TType>, ref: React.Ref<Table3Ref>) {\n const stringifiedChildren = String(props.children);\n // we force a remount (using key) when the child columns change because there are too many places to add children as an effect\n // this is cheaper from a complexity perspective, and probably performance wise as well\n const key = React.useMemo(() => String('tableKey_' + stringifiedChildren), [stringifiedChildren]);\n return <BaseTable3<TType> {...props} key={key} ref={ref} />;\n}) as (<TType = unknown>(props: Table3Props<TType> & React.RefAttributes<Table3Ref>) => JSX.Element) & {\n Column: typeof Column;\n Group: typeof Group;\n};\nTable3.Column = Column;\nTable3.Group = Group;\n\nexport type {\n Table3Ref,\n Table3Props,\n Table3ColumnProps,\n Table3GroupProps,\n Table3EditingSaveHandler,\n Table3EditingValidatorFn,\n Table3Texts,\n Table3FeatureProps,\n Table3CommonProps,\n Table3WithoutEditingWithClientProps,\n Table3WithoutEditingWithServerProps,\n Table3WithEditingProps,\n Table3WithEditingWithClientProps,\n Table3WithEditingWithServerProps,\n Table3EditingChangeHandler,\n Table3EditingCreateHandler,\n} from './types';\n"],"names":["Column","_","displayName","Group","BaseTable3","fixedForwardRef","props","ref","table3","useTable3","gridAttributes","_table3$meta$editing","meta","editing","isEditing","_table3$meta$editing2","isDetailedMode","undefined","enableHorizontalArrowKeyNavigation","hasAlertErrors","getErrorsShownInAlert","length","hasCreateWorkflow","isEnabled","onEditingCreate","isScrolled","isTableScrolled","createWorkflow","React","CreateNewRow","buttonRef","createRowButtonRef","scrollToIndex","renderer","table","instance","tableMeta","Table","Toolbar","Editing","Alert","className","tableRef","Grid","footerRows","TemporaryRow","Table3","stringifiedChildren","String","children","key","useMemo"],"mappings":"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"}
|
@@ -25,14 +25,16 @@ const Tag = /*#__PURE__*/React__default.forwardRef((props, ref) => {
|
|
25
25
|
ref: ref,
|
26
26
|
"data-taco": "tag"
|
27
27
|
}), /*#__PURE__*/React__default.createElement("span", {
|
28
|
-
className: "truncate px-2",
|
28
|
+
className: "flex items-center truncate px-2",
|
29
29
|
ref: textRef
|
30
30
|
}, icon ? typeof icon === 'string' ? (/*#__PURE__*/React__default.createElement(Icon, {
|
31
31
|
name: icon,
|
32
|
-
className: "-ml-1
|
32
|
+
className: "-ml-1 mr-1 !h-5 !w-5"
|
33
33
|
})) : (/*#__PURE__*/React__default.cloneElement(icon, {
|
34
|
-
className: 'mr-1 -ml-1
|
35
|
-
})) : null,
|
34
|
+
className: 'mr-1 -ml-1 !h-5 !w-5'
|
35
|
+
})) : null, /*#__PURE__*/React__default.createElement("span", {
|
36
|
+
className: "truncate"
|
37
|
+
}, children)), onDelete ? (/*#__PURE__*/React__default.createElement(Icon, {
|
36
38
|
name: "close",
|
37
39
|
onClick: onDelete,
|
38
40
|
className: "-ml-1.5 !h-6 !w-5 flex-shrink-0 cursor-pointer rounded-r p-0.5 hover:bg-black/5"
|
@@ -1 +1 @@
|
|
1
|
-
{"version":3,"file":"Tag.js","sources":["../../../../../../../src/components/Tag/Tag.tsx"],"sourcesContent":["import React from 'react';\nimport cn from 'clsx';\nimport { Icon, IconName, IconProps } from '../Icon/Icon';\nimport { Color } from '../../types';\nimport { getSubtleColorShadeClasses } from '../../utils/tailwind';\n\nexport type TagProps = Omit<React.HTMLAttributes<HTMLSpanElement>, 'children'> & {\n children: string;\n color?: Color;\n disabled?: boolean;\n icon?: React.ReactElement<IconProps> | IconName;\n readOnly?: boolean;\n onDelete?: (event: React.MouseEvent<SVGSVGElement>) => void;\n};\n\nexport const Tag = React.forwardRef<HTMLSpanElement, TagProps>((props, ref) => {\n const { children, color, disabled, icon, readOnly, onDelete, ...otherProps } = props;\n const textRef = React.useRef<HTMLDivElement>(null);\n\n const className = cn(\n 'inline-flex items-center rounded h-6 cursor-default',\n {\n 'opacity-50': disabled,\n 'hover:bg-opacity-75': !disabled,\n 'cursor-pointer': !!otherProps.onClick,\n 'pointer-events-none': disabled || readOnly,\n },\n getSubtleColorShadeClasses(color),\n props.className\n );\n\n return (\n <span {...otherProps} className={className} ref={ref} data-taco=\"tag\">\n <span className=\"truncate px-2\" ref={textRef}>\n {icon ? (\n typeof icon === 'string' ? (\n <Icon name={icon} className=\"-ml-1
|
1
|
+
{"version":3,"file":"Tag.js","sources":["../../../../../../../src/components/Tag/Tag.tsx"],"sourcesContent":["import React from 'react';\nimport cn from 'clsx';\nimport { Icon, IconName, IconProps } from '../Icon/Icon';\nimport { Color } from '../../types';\nimport { getSubtleColorShadeClasses } from '../../utils/tailwind';\n\nexport type TagProps = Omit<React.HTMLAttributes<HTMLSpanElement>, 'children'> & {\n children: string;\n color?: Color;\n disabled?: boolean;\n icon?: React.ReactElement<IconProps> | IconName;\n readOnly?: boolean;\n onDelete?: (event: React.MouseEvent<SVGSVGElement>) => void;\n};\n\nexport const Tag = React.forwardRef<HTMLSpanElement, TagProps>((props, ref) => {\n const { children, color, disabled, icon, readOnly, onDelete, ...otherProps } = props;\n const textRef = React.useRef<HTMLDivElement>(null);\n\n const className = cn(\n 'inline-flex items-center rounded h-6 cursor-default',\n {\n 'opacity-50': disabled,\n 'hover:bg-opacity-75': !disabled,\n 'cursor-pointer': !!otherProps.onClick,\n 'pointer-events-none': disabled || readOnly,\n },\n getSubtleColorShadeClasses(color),\n props.className\n );\n\n return (\n <span {...otherProps} className={className} ref={ref} data-taco=\"tag\">\n <span className=\"flex items-center truncate px-2\" ref={textRef}>\n {icon ? (\n typeof icon === 'string' ? (\n <Icon name={icon} className=\"-ml-1 mr-1 !h-5 !w-5\" />\n ) : (\n React.cloneElement(icon, { className: 'mr-1 -ml-1 !h-5 !w-5' })\n )\n ) : null}\n <span className=\"truncate\">{children}</span>\n </span>\n {onDelete ? (\n <Icon\n name=\"close\"\n onClick={onDelete}\n className=\"-ml-1.5 !h-6 !w-5 flex-shrink-0 cursor-pointer rounded-r p-0.5 hover:bg-black/5\"\n />\n ) : null}\n </span>\n );\n});\n"],"names":["Tag","React","forwardRef","props","ref","children","color","disabled","icon","readOnly","onDelete","otherProps","textRef","useRef","className","cn","onClick","getSubtleColorShadeClasses","Icon","name","cloneElement"],"mappings":";;;;;MAeaA,GAAG,gBAAGC,cAAK,CAACC,UAAU,CAA4B,CAACC,KAAK,EAAEC,GAAG;EACtE,MAAM;IAAEC,QAAQ;IAAEC,KAAK;IAAEC,QAAQ;IAAEC,IAAI;IAAEC,QAAQ;IAAEC,QAAQ;IAAE,GAAGC;GAAY,GAAGR,KAAK;EACpF,MAAMS,OAAO,GAAGX,cAAK,CAACY,MAAM,CAAiB,IAAI,CAAC;EAElD,MAAMC,SAAS,GAAGC,EAAE,CAChB,qDAAqD,EACrD;IACI,YAAY,EAAER,QAAQ;IACtB,qBAAqB,EAAE,CAACA,QAAQ;IAChC,gBAAgB,EAAE,CAAC,CAACI,UAAU,CAACK,OAAO;IACtC,qBAAqB,EAAET,QAAQ,IAAIE;GACtC,EACDQ,0BAA0B,CAACX,KAAK,CAAC,EACjCH,KAAK,CAACW,SAAS,CAClB;EAED,oBACIb,uDAAUU,UAAU;IAAEG,SAAS,EAAEA,SAAS;IAAEV,GAAG,EAAEA,GAAG;iBAAY;mBAC5DH;IAAMa,SAAS,EAAC,iCAAiC;IAACV,GAAG,EAAEQ;KAClDJ,IAAI,GACD,OAAOA,IAAI,KAAK,QAAQ,iBACpBP,6BAACiB,IAAI;IAACC,IAAI,EAAEX,IAAI;IAAEM,SAAS,EAAC;IAAyB,kBAErDb,cAAK,CAACmB,YAAY,CAACZ,IAAI,EAAE;IAAEM,SAAS,EAAE;GAAwB,CAAC,CAClE,GACD,IAAI,eACRb;IAAMa,SAAS,EAAC;KAAYT,QAAQ,CAAQ,CACzC,EACNK,QAAQ,iBACLT,6BAACiB,IAAI;IACDC,IAAI,EAAC,OAAO;IACZH,OAAO,EAAEN,QAAQ;IACjBI,SAAS,EAAC;IACZ,IACF,IAAI,CACL;AAEf,CAAC;;;;"}
|
@@ -43,18 +43,20 @@ function Row(props) {
|
|
43
43
|
}
|
44
44
|
*/
|
45
45
|
// always load the next page
|
46
|
-
if (scrollDirection === 'forward' || !scrollDirection) {
|
46
|
+
if ((scrollDirection === 'forward' || !scrollDirection) && pageIndex + 2 < tableMeta.server.pageCount) {
|
47
47
|
pageIndexesToFetch.push(pageIndex + 1);
|
48
48
|
}
|
49
|
-
|
50
|
-
|
51
|
-
|
52
|
-
|
53
|
-
|
54
|
-
|
55
|
-
|
56
|
-
|
57
|
-
|
49
|
+
if (pageIndexesToFetch.length) {
|
50
|
+
// the virtualiser fetches a page ahead, so this won't get called in most cases
|
51
|
+
// but it provides a fallback for some edge cases
|
52
|
+
timeout = setTimeout(() => {
|
53
|
+
pageIndexesToFetch.forEach(index => {
|
54
|
+
var _tableMeta$server$loa, _tableMeta$server;
|
55
|
+
// this can be called by every row within the current page, but loadPage returns early if a pending request exists
|
56
|
+
(_tableMeta$server$loa = (_tableMeta$server = tableMeta.server).loadPage) === null || _tableMeta$server$loa === void 0 ? void 0 : _tableMeta$server$loa.call(_tableMeta$server, index, sorting, filters, tableMeta.search.enableGlobalFilter ? search : undefined, hiddenColumns);
|
57
|
+
});
|
58
|
+
}, DELAY_BEFORE_LOAD_MS);
|
59
|
+
}
|
58
60
|
}
|
59
61
|
return () => {
|
60
62
|
clearTimeout(timeout);
|
@@ -1 +1 @@
|
|
1
|
-
{"version":3,"file":"Row.js","sources":["../../../../../../../../../../src/primitives/Table/Core/components/Row/Row.tsx"],"sourcesContent":["import React from 'react';\nimport { TableMeta as ReactTableMeta } from '@tanstack/react-table';\nimport { RowContext } from './RowContext';\nimport { TableRowRenderer, TableRowRendererProps } from '../../types';\nimport { getHiddenColumns } from '../../../useTableManager/util/columns';\n\nconst DELAY_BEFORE_LOAD_MS = 250;\n\nexport type RowProps<TType = unknown> = React.HTMLAttributes<HTMLTableRowElement> &\n TableRowRendererProps<TType> & {\n renderer: TableRowRenderer<TType>;\n scrollDirection?: 'forward' | 'backward';\n skipPageLoading?: boolean;\n };\n\n/* anonymous functions will break the memoisation on each render, wrap handlers in callbacks */\nexport function Row<TType = unknown>(props: RowProps<TType>) {\n const {\n renderer: RowRenderer,\n cellRenderer: CellRenderer,\n hideInternalColumns = false,\n hideRowActions = false,\n scrollDirection,\n skipPageLoading = false,\n ...displayRowProps\n } = props;\n\n const tableMeta = props.table.options.meta as ReactTableMeta<TType>;\n const isHovered = tableMeta.rowActive.rowHoverIndex === props.index;\n // context - it must be here for cells to read it, since they render alongside the row inside DisplayRow\n const contextValue = React.useMemo(\n () => ({ isHovered, rowIndex: props.index, hideInternalColumns, hideRowActions }),\n [isHovered, props.index, hideInternalColumns, hideRowActions]\n );\n\n React.useEffect(() => {\n let timeout;\n\n if (tableMeta.server.isEnabled && tableMeta.server._experimentalDataLoader2 && !skipPageLoading) {\n const pageIndex =\n (Math.floor(props.index / tableMeta.server.pageSize) * tableMeta.server.pageSize) / tableMeta.server.pageSize;\n\n const sorting = props.table.getState().sorting;\n const filters = props.table.getState().columnFilters;\n const search = props.table.getState().globalFilter;\n const hiddenColumns = getHiddenColumns(props.table.getState().columnVisibility);\n\n const pageIndexesToFetch: number[] = [];\n\n /*\n // if there's no direction, it means the scroll bar got dropped un unloaded pages,\n // in that case, load forward and backward pages to prevent skeletons\n if (scrollDirection === 'backward' || !scrollDirection) {\n const backIndex = pageIndex - 1;\n\n if (backIndex > -1) {\n pageIndexesToFetch.push(backIndex);\n }\n }\n */\n\n // always load the next page\n if (scrollDirection === 'forward' || !scrollDirection) {\n pageIndexesToFetch.push(pageIndex + 1);\n }\n\n // the virtualiser fetches a page ahead, so this won't get called in most cases\n
|
1
|
+
{"version":3,"file":"Row.js","sources":["../../../../../../../../../../src/primitives/Table/Core/components/Row/Row.tsx"],"sourcesContent":["import React from 'react';\nimport { TableMeta as ReactTableMeta } from '@tanstack/react-table';\nimport { RowContext } from './RowContext';\nimport { TableRowRenderer, TableRowRendererProps } from '../../types';\nimport { getHiddenColumns } from '../../../useTableManager/util/columns';\n\nconst DELAY_BEFORE_LOAD_MS = 250;\n\nexport type RowProps<TType = unknown> = React.HTMLAttributes<HTMLTableRowElement> &\n TableRowRendererProps<TType> & {\n renderer: TableRowRenderer<TType>;\n scrollDirection?: 'forward' | 'backward';\n skipPageLoading?: boolean;\n };\n\n/* anonymous functions will break the memoisation on each render, wrap handlers in callbacks */\nexport function Row<TType = unknown>(props: RowProps<TType>) {\n const {\n renderer: RowRenderer,\n cellRenderer: CellRenderer,\n hideInternalColumns = false,\n hideRowActions = false,\n scrollDirection,\n skipPageLoading = false,\n ...displayRowProps\n } = props;\n\n const tableMeta = props.table.options.meta as ReactTableMeta<TType>;\n const isHovered = tableMeta.rowActive.rowHoverIndex === props.index;\n // context - it must be here for cells to read it, since they render alongside the row inside DisplayRow\n const contextValue = React.useMemo(\n () => ({ isHovered, rowIndex: props.index, hideInternalColumns, hideRowActions }),\n [isHovered, props.index, hideInternalColumns, hideRowActions]\n );\n\n React.useEffect(() => {\n let timeout;\n\n if (tableMeta.server.isEnabled && tableMeta.server._experimentalDataLoader2 && !skipPageLoading) {\n const pageIndex =\n (Math.floor(props.index / tableMeta.server.pageSize) * tableMeta.server.pageSize) / tableMeta.server.pageSize;\n\n const sorting = props.table.getState().sorting;\n const filters = props.table.getState().columnFilters;\n const search = props.table.getState().globalFilter;\n const hiddenColumns = getHiddenColumns(props.table.getState().columnVisibility);\n\n const pageIndexesToFetch: number[] = [];\n\n /*\n // if there's no direction, it means the scroll bar got dropped un unloaded pages,\n // in that case, load forward and backward pages to prevent skeletons\n if (scrollDirection === 'backward' || !scrollDirection) {\n const backIndex = pageIndex - 1;\n\n if (backIndex > -1) {\n pageIndexesToFetch.push(backIndex);\n }\n }\n */\n\n // always load the next page\n if ((scrollDirection === 'forward' || !scrollDirection) && pageIndex + 2 < tableMeta.server.pageCount) {\n pageIndexesToFetch.push(pageIndex + 1);\n }\n\n if (pageIndexesToFetch.length) {\n // the virtualiser fetches a page ahead, so this won't get called in most cases\n // but it provides a fallback for some edge cases\n timeout = setTimeout(() => {\n pageIndexesToFetch.forEach(index => {\n // this can be called by every row within the current page, but loadPage returns early if a pending request exists\n tableMeta.server.loadPage?.(\n index,\n sorting,\n filters,\n tableMeta.search.enableGlobalFilter ? search : undefined,\n hiddenColumns\n );\n });\n }, DELAY_BEFORE_LOAD_MS);\n }\n }\n\n return () => {\n clearTimeout(timeout);\n };\n }, [tableMeta.server.pages]);\n\n return (\n <RowContext.Provider value={contextValue}>\n <RowRenderer<TType> {...displayRowProps} cellRenderer={CellRenderer} />\n </RowContext.Provider>\n );\n}\n"],"names":["DELAY_BEFORE_LOAD_MS","Row","props","renderer","RowRenderer","cellRenderer","CellRenderer","hideInternalColumns","hideRowActions","scrollDirection","skipPageLoading","displayRowProps","tableMeta","table","options","meta","isHovered","rowActive","rowHoverIndex","index","contextValue","React","useMemo","rowIndex","useEffect","timeout","server","isEnabled","_experimentalDataLoader2","pageIndex","Math","floor","pageSize","sorting","getState","filters","columnFilters","search","globalFilter","hiddenColumns","getHiddenColumns","columnVisibility","pageIndexesToFetch","pageCount","push","length","setTimeout","forEach","_tableMeta$server$loa","_tableMeta$server","loadPage","call","enableGlobalFilter","undefined","clearTimeout","pages","RowContext","Provider","value"],"mappings":";;;;AAMA,MAAMA,oBAAoB,GAAG,GAAG;AAShC;SACgBC,GAAGA,CAAkBC,KAAsB;EACvD,MAAM;IACFC,QAAQ,EAAEC,WAAW;IACrBC,YAAY,EAAEC,YAAY;IAC1BC,mBAAmB,GAAG,KAAK;IAC3BC,cAAc,GAAG,KAAK;IACtBC,eAAe;IACfC,eAAe,GAAG,KAAK;IACvB,GAAGC;GACN,GAAGT,KAAK;EAET,MAAMU,SAAS,GAAGV,KAAK,CAACW,KAAK,CAACC,OAAO,CAACC,IAA6B;EACnE,MAAMC,SAAS,GAAGJ,SAAS,CAACK,SAAS,CAACC,aAAa,KAAKhB,KAAK,CAACiB,KAAK;;EAEnE,MAAMC,YAAY,GAAGC,cAAK,CAACC,OAAO,CAC9B,OAAO;IAAEN,SAAS;IAAEO,QAAQ,EAAErB,KAAK,CAACiB,KAAK;IAAEZ,mBAAmB;IAAEC;GAAgB,CAAC,EACjF,CAACQ,SAAS,EAAEd,KAAK,CAACiB,KAAK,EAAEZ,mBAAmB,EAAEC,cAAc,CAAC,CAChE;EAEDa,cAAK,CAACG,SAAS,CAAC;IACZ,IAAIC,OAAO;IAEX,IAAIb,SAAS,CAACc,MAAM,CAACC,SAAS,IAAIf,SAAS,CAACc,MAAM,CAACE,wBAAwB,IAAI,CAAClB,eAAe,EAAE;MAC7F,MAAMmB,SAAS,GACVC,IAAI,CAACC,KAAK,CAAC7B,KAAK,CAACiB,KAAK,GAAGP,SAAS,CAACc,MAAM,CAACM,QAAQ,CAAC,GAAGpB,SAAS,CAACc,MAAM,CAACM,QAAQ,GAAIpB,SAAS,CAACc,MAAM,CAACM,QAAQ;MAEjH,MAAMC,OAAO,GAAG/B,KAAK,CAACW,KAAK,CAACqB,QAAQ,EAAE,CAACD,OAAO;MAC9C,MAAME,OAAO,GAAGjC,KAAK,CAACW,KAAK,CAACqB,QAAQ,EAAE,CAACE,aAAa;MACpD,MAAMC,MAAM,GAAGnC,KAAK,CAACW,KAAK,CAACqB,QAAQ,EAAE,CAACI,YAAY;MAClD,MAAMC,aAAa,GAAGC,gBAAgB,CAACtC,KAAK,CAACW,KAAK,CAACqB,QAAQ,EAAE,CAACO,gBAAgB,CAAC;MAE/E,MAAMC,kBAAkB,GAAa,EAAE;;;;;;;;;;;;MAevC,IAAI,CAACjC,eAAe,KAAK,SAAS,IAAI,CAACA,eAAe,KAAKoB,SAAS,GAAG,CAAC,GAAGjB,SAAS,CAACc,MAAM,CAACiB,SAAS,EAAE;QACnGD,kBAAkB,CAACE,IAAI,CAACf,SAAS,GAAG,CAAC,CAAC;;MAG1C,IAAIa,kBAAkB,CAACG,MAAM,EAAE;;;QAG3BpB,OAAO,GAAGqB,UAAU,CAAC;UACjBJ,kBAAkB,CAACK,OAAO,CAAC5B,KAAK;;;YAE5B,CAAA6B,qBAAA,IAAAC,iBAAA,GAAArC,SAAS,CAACc,MAAM,EAACwB,QAAQ,cAAAF,qBAAA,uBAAzBA,qBAAA,CAAAG,IAAA,CAAAF,iBAAA,EACI9B,KAAK,EACLc,OAAO,EACPE,OAAO,EACPvB,SAAS,CAACyB,MAAM,CAACe,kBAAkB,GAAGf,MAAM,GAAGgB,SAAS,EACxDd,aAAa,CAChB;WACJ,CAAC;SACL,EAAEvC,oBAAoB,CAAC;;;IAIhC,OAAO;MACHsD,YAAY,CAAC7B,OAAO,CAAC;KACxB;GACJ,EAAE,CAACb,SAAS,CAACc,MAAM,CAAC6B,KAAK,CAAC,CAAC;EAE5B,oBACIlC,6BAACmC,UAAU,CAACC,QAAQ;IAACC,KAAK,EAAEtC;kBACxBC,6BAACjB,WAAW,oBAAYO,eAAe;IAAEN,YAAY,EAAEC;KAAgB,CACrD;AAE9B;;;;"}
|
@@ -0,0 +1 @@
|
|
1
|
+
{"version":3,"file":"FilterContext.js","sources":["../../../../../../../../../../../../src/primitives/Table/Core/components/Toolbar/components/Filters/FilterContext.tsx"],"sourcesContent":["import React from 'react';\nimport { TableFilter } from '../../../../../types';\n\nexport const FilterContext = React.createContext<TableFilter[]>([]);\n"],"names":["FilterContext","React","createContext"],"mappings":";;MAGaA,aAAa,gBAAGC,cAAK,CAACC,aAAa,CAAgB,EAAE;;;;"}
|
@@ -6,6 +6,7 @@ import { Group } from '../../../../../../../components/Group/Group.js';
|
|
6
6
|
import { TableFilterComparator } from '../../../../../types.js';
|
7
7
|
import { isInternalColumn } from '../../../../../useTableManager/util/columns.js';
|
8
8
|
import { sortByHeader, isEmptyFilter } from './util.js';
|
9
|
+
import { FilterContext } from './FilterContext.js';
|
9
10
|
import { Filter } from './components/Filter.js';
|
10
11
|
|
11
12
|
const placeholderFilter = {
|
@@ -91,7 +92,9 @@ function ManageFiltersPopover(props) {
|
|
91
92
|
};
|
92
93
|
return /*#__PURE__*/React__default.createElement(Popover, Object.assign({}, popoverProps, {
|
93
94
|
onChange: handleClose
|
94
|
-
}), /*#__PURE__*/React__default.createElement(Popover.Content, null, /*#__PURE__*/React__default.createElement(
|
95
|
+
}), /*#__PURE__*/React__default.createElement(Popover.Content, null, /*#__PURE__*/React__default.createElement(FilterContext.Provider, {
|
96
|
+
value: filters
|
97
|
+
}, /*#__PURE__*/React__default.createElement("div", {
|
95
98
|
className: "flex w-[40rem] flex-col gap-4"
|
96
99
|
}, /*#__PURE__*/React__default.createElement("div", {
|
97
100
|
className: "flex h-8"
|
@@ -107,7 +110,6 @@ function ManageFiltersPopover(props) {
|
|
107
110
|
key: `filter_${index}`,
|
108
111
|
allColumns: allColumns,
|
109
112
|
filter: filter,
|
110
|
-
filters: filters,
|
111
113
|
position: index,
|
112
114
|
onChange: handleChangeFilter,
|
113
115
|
onRemove: filters.length > 0 && filters.some(f => f.id) || filters.length > 1 ? handleRemoveFilter : undefined
|
@@ -123,7 +125,7 @@ function ManageFiltersPopover(props) {
|
|
123
125
|
}, texts.table.filters.buttons.clear), /*#__PURE__*/React__default.createElement(Button, {
|
124
126
|
appearance: "primary",
|
125
127
|
onClick: handleApply
|
126
|
-
}, texts.table.filters.buttons.apply)))));
|
128
|
+
}, texts.table.filters.buttons.apply))))));
|
127
129
|
}
|
128
130
|
|
129
131
|
export { ManageFiltersPopover };
|
@@ -1 +1 @@
|
|
1
|
-
{"version":3,"file":"ManageFiltersPopover.js","sources":["../../../../../../../../../../../../src/primitives/Table/Core/components/Toolbar/components/Filters/ManageFiltersPopover.tsx"],"sourcesContent":["import React from 'react';\nimport { Table as ReactTable } from '@tanstack/react-table';\nimport { Popover } from '../../../../../../../components/Popover/Popover';\nimport { useLocalization } from '../../../../../../../components/Provider/Localization';\nimport { Button } from '../../../../../../../components/Button/Button';\nimport { Group } from '../../../../../../../components/Group/Group';\nimport { isEmptyFilter, sortByHeader } from './util';\nimport { isInternalColumn } from '../../../../../useTableManager/util/columns';\nimport { TableFilter, TableFilterComparator, TableFilterValue } from '../../../../../types';\nimport { Filter } from './components/Filter';\n\nexport type ManageFiltersPopoverProps<TType = unknown> = {\n length: number;\n table: ReactTable<TType>;\n};\n\nconst placeholderFilter: TableFilter = { id: '', value: { comparator: TableFilterComparator.Contains, value: undefined } };\n\nexport function ManageFiltersPopover<TType = unknown>(props: ManageFiltersPopoverProps<TType>) {\n const { length, table, ...popoverProps } = props;\n const { locale, texts } = useLocalization();\n\n const allColumns = table\n .getAllLeafColumns()\n .filter(column => !isInternalColumn(column.id))\n .sort(sortByHeader);\n\n const columnFilters = table.getState().columnFilters as TableFilter[];\n\n // state, since we \"apply\" filters - our filter values have a special shape, so we force to our type\n const [filters, setFilters] = React.useState<TableFilter[]>(columnFilters.length ? columnFilters : [placeholderFilter]);\n\n // this runs if filters are set outside (e.g. through column header)\n React.useEffect(() => {\n setFilters(columnFilters.length === 0 ? [placeholderFilter] : columnFilters);\n\n // focus the filter value, as we preset the column/comparator.\n requestAnimationFrame(() => {\n const filterValues = document.querySelectorAll('[data-query-selector=\"filter-value\"]');\n const lastFilter = filterValues.length ? filterValues[filterValues.length - 1] : undefined;\n\n (lastFilter as HTMLElement)?.focus();\n });\n }, [columnFilters]);\n\n // filters\n const handleChangeFilter = (position: number, filter: { id: string; value: TableFilterValue }) => {\n setFilters(currentFilters => {\n return currentFilters.map((current, index) => {\n if (index === position) {\n return filter;\n }\n return current;\n });\n });\n };\n\n const handleRemoveFilter = position => {\n if (filters.length === 1) {\n setFilters([placeholderFilter]);\n return;\n }\n\n setFilters(currentFilters => currentFilters.filter((_, index) => index !== position));\n };\n\n const handleCreate = () => {\n setFilters(filters.concat(placeholderFilter));\n };\n\n //\n const handleApply = () => {\n table.setColumnFilters(() => {\n const newFilters = filters.filter(f => {\n if (f.id === null || f.id === '') {\n return false;\n }\n\n const controlRenderer = allColumns.find(c => c.id === f.id)?.columnDef.meta?.control;\n\n if (\n f.value.comparator === TableFilterComparator.IsEmpty ||\n f.value.comparator === TableFilterComparator.IsNotEmpty ||\n controlRenderer === 'switch'\n ) {\n return true;\n }\n\n const value = f.value.value;\n\n return value !== undefined && value !== null && value !== '';\n });\n\n return newFilters;\n });\n };\n\n const handleClear = () => {\n table.resetColumnFilters();\n setFilters([placeholderFilter]);\n };\n\n const handleClose = (open: boolean) => {\n if (!open) {\n const nonEmptyFilters = columnFilters.filter(f => !isEmptyFilter(f));\n table.setColumnFilters(nonEmptyFilters);\n setFilters(nonEmptyFilters.length === 0 ? [placeholderFilter] : nonEmptyFilters);\n }\n };\n\n return (\n <Popover {...popoverProps} onChange={handleClose}>\n <Popover.Content>\n <div className=\"flex w-[40rem] flex-col gap-4\">\n <div className=\"flex h-8\">\n <div className=\"flex w-full items-center gap-2\">\n <h4 className=\"mb-0 inline-flex\">{texts.table.filters.button}</h4>\n <p className=\"text-grey-700 mb-0 mr-auto mt-px inline-flex\">\n {texts.table.filters.total\n .replace(\n '[CURRENT]',\n new Intl.NumberFormat(locale).format(table.getFilteredRowModel().rows.length)\n )\n .replace('[TOTAL]', new Intl.NumberFormat(locale).format(length))}\n </p>\n </div>\n </div>\n <div className=\"flex flex-col gap-2\">\n {filters.map((filter, index) => (\n <Filter\n key={`filter_${index}`}\n allColumns={allColumns}\n filter={filter}\n filters={filters}\n position={index}\n onChange={handleChangeFilter}\n onRemove={\n (filters.length > 0 && filters.some(f => f.id)) || filters.length > 1\n ? handleRemoveFilter\n : undefined\n }\n />\n ))}\n <div className=\"justify-start\">\n <Button appearance=\"discrete\" onClick={handleCreate}>\n + {texts.table.filters.buttons.addFilter}\n </Button>\n </div>\n </div>\n <Group className=\"ml-auto\">\n <Popover.Close>\n <Button>{texts.table.filters.buttons.cancel}</Button>\n </Popover.Close>\n <Button onClick={handleClear}>{texts.table.filters.buttons.clear}</Button>\n <Button appearance=\"primary\" onClick={handleApply}>\n {texts.table.filters.buttons.apply}\n </Button>\n </Group>\n </div>\n </Popover.Content>\n </Popover>\n );\n}\n"],"names":["placeholderFilter","id","value","comparator","TableFilterComparator","Contains","undefined","ManageFiltersPopover","props","length","table","popoverProps","locale","texts","useLocalization","allColumns","getAllLeafColumns","filter","column","isInternalColumn","sort","sortByHeader","columnFilters","getState","filters","setFilters","React","useState","useEffect","requestAnimationFrame","filterValues","document","querySelectorAll","lastFilter","focus","handleChangeFilter","position","currentFilters","map","current","index","handleRemoveFilter","_","handleCreate","concat","handleApply","setColumnFilters","newFilters","f","controlRenderer","_allColumns$find","find","c","_allColumns$find$colu","columnDef","meta","control","IsEmpty","IsNotEmpty","handleClear","resetColumnFilters","handleClose","open","nonEmptyFilters","isEmptyFilter","Popover","onChange","Content","className","button","total","replace","Intl","NumberFormat","format","getFilteredRowModel","rows","Filter","key","onRemove","some","Button","appearance","onClick","buttons","addFilter","Group","Close","cancel","clear","apply"],"mappings":"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"}
|
1
|
+
{"version":3,"file":"ManageFiltersPopover.js","sources":["../../../../../../../../../../../../src/primitives/Table/Core/components/Toolbar/components/Filters/ManageFiltersPopover.tsx"],"sourcesContent":["import React from 'react';\nimport { Table as ReactTable } from '@tanstack/react-table';\nimport { Popover } from '../../../../../../../components/Popover/Popover';\nimport { useLocalization } from '../../../../../../../components/Provider/Localization';\nimport { Button } from '../../../../../../../components/Button/Button';\nimport { Group } from '../../../../../../../components/Group/Group';\nimport { isEmptyFilter, sortByHeader } from './util';\nimport { isInternalColumn } from '../../../../../useTableManager/util/columns';\nimport { TableFilter, TableFilterComparator, TableFilterValue } from '../../../../../types';\nimport { Filter } from './components/Filter';\nimport { FilterContext } from './FilterContext';\n\nexport type ManageFiltersPopoverProps<TType = unknown> = {\n length: number;\n table: ReactTable<TType>;\n};\n\nconst placeholderFilter: TableFilter = { id: '', value: { comparator: TableFilterComparator.Contains, value: undefined } };\n\nexport function ManageFiltersPopover<TType = unknown>(props: ManageFiltersPopoverProps<TType>) {\n const { length, table, ...popoverProps } = props;\n const { locale, texts } = useLocalization();\n\n const allColumns = table\n .getAllLeafColumns()\n .filter(column => !isInternalColumn(column.id))\n .sort(sortByHeader);\n\n const columnFilters = table.getState().columnFilters as TableFilter[];\n\n // state, since we \"apply\" filters - our filter values have a special shape, so we force to our type\n const [filters, setFilters] = React.useState<TableFilter[]>(columnFilters.length ? columnFilters : [placeholderFilter]);\n\n // this runs if filters are set outside (e.g. through column header)\n React.useEffect(() => {\n setFilters(columnFilters.length === 0 ? [placeholderFilter] : columnFilters);\n\n // focus the filter value, as we preset the column/comparator.\n requestAnimationFrame(() => {\n const filterValues = document.querySelectorAll('[data-query-selector=\"filter-value\"]');\n const lastFilter = filterValues.length ? filterValues[filterValues.length - 1] : undefined;\n\n (lastFilter as HTMLElement)?.focus();\n });\n }, [columnFilters]);\n\n // filters\n const handleChangeFilter = (position: number, filter: { id: string; value: TableFilterValue }) => {\n setFilters(currentFilters => {\n return currentFilters.map((current, index) => {\n if (index === position) {\n return filter;\n }\n return current;\n });\n });\n };\n\n const handleRemoveFilter = position => {\n if (filters.length === 1) {\n setFilters([placeholderFilter]);\n return;\n }\n\n setFilters(currentFilters => currentFilters.filter((_, index) => index !== position));\n };\n\n const handleCreate = () => {\n setFilters(filters.concat(placeholderFilter));\n };\n\n //\n const handleApply = () => {\n table.setColumnFilters(() => {\n const newFilters = filters.filter(f => {\n if (f.id === null || f.id === '') {\n return false;\n }\n\n const controlRenderer = allColumns.find(c => c.id === f.id)?.columnDef.meta?.control;\n\n if (\n f.value.comparator === TableFilterComparator.IsEmpty ||\n f.value.comparator === TableFilterComparator.IsNotEmpty ||\n controlRenderer === 'switch'\n ) {\n return true;\n }\n\n const value = f.value.value;\n\n return value !== undefined && value !== null && value !== '';\n });\n\n return newFilters;\n });\n };\n\n const handleClear = () => {\n table.resetColumnFilters();\n setFilters([placeholderFilter]);\n };\n\n const handleClose = (open: boolean) => {\n if (!open) {\n const nonEmptyFilters = columnFilters.filter(f => !isEmptyFilter(f));\n table.setColumnFilters(nonEmptyFilters);\n setFilters(nonEmptyFilters.length === 0 ? [placeholderFilter] : nonEmptyFilters);\n }\n };\n\n return (\n <Popover {...popoverProps} onChange={handleClose}>\n <Popover.Content>\n <FilterContext.Provider value={filters}>\n <div className=\"flex w-[40rem] flex-col gap-4\">\n <div className=\"flex h-8\">\n <div className=\"flex w-full items-center gap-2\">\n <h4 className=\"mb-0 inline-flex\">{texts.table.filters.button}</h4>\n <p className=\"text-grey-700 mb-0 mr-auto mt-px inline-flex\">\n {texts.table.filters.total\n .replace(\n '[CURRENT]',\n new Intl.NumberFormat(locale).format(table.getFilteredRowModel().rows.length)\n )\n .replace('[TOTAL]', new Intl.NumberFormat(locale).format(length))}\n </p>\n </div>\n </div>\n <div className=\"flex flex-col gap-2\">\n {filters.map((filter, index) => (\n <Filter\n key={`filter_${index}`}\n allColumns={allColumns}\n filter={filter}\n position={index}\n onChange={handleChangeFilter}\n onRemove={\n (filters.length > 0 && filters.some(f => f.id)) || filters.length > 1\n ? handleRemoveFilter\n : undefined\n }\n />\n ))}\n <div className=\"justify-start\">\n <Button appearance=\"discrete\" onClick={handleCreate}>\n + {texts.table.filters.buttons.addFilter}\n </Button>\n </div>\n </div>\n <Group className=\"ml-auto\">\n <Popover.Close>\n <Button>{texts.table.filters.buttons.cancel}</Button>\n </Popover.Close>\n <Button onClick={handleClear}>{texts.table.filters.buttons.clear}</Button>\n <Button appearance=\"primary\" onClick={handleApply}>\n {texts.table.filters.buttons.apply}\n </Button>\n </Group>\n </div>\n </FilterContext.Provider>\n </Popover.Content>\n </Popover>\n );\n}\n"],"names":["placeholderFilter","id","value","comparator","TableFilterComparator","Contains","undefined","ManageFiltersPopover","props","length","table","popoverProps","locale","texts","useLocalization","allColumns","getAllLeafColumns","filter","column","isInternalColumn","sort","sortByHeader","columnFilters","getState","filters","setFilters","React","useState","useEffect","requestAnimationFrame","filterValues","document","querySelectorAll","lastFilter","focus","handleChangeFilter","position","currentFilters","map","current","index","handleRemoveFilter","_","handleCreate","concat","handleApply","setColumnFilters","newFilters","f","controlRenderer","_allColumns$find","find","c","_allColumns$find$colu","columnDef","meta","control","IsEmpty","IsNotEmpty","handleClear","resetColumnFilters","handleClose","open","nonEmptyFilters","isEmptyFilter","Popover","onChange","Content","FilterContext","Provider","className","button","total","replace","Intl","NumberFormat","format","getFilteredRowModel","rows","Filter","key","onRemove","some","Button","appearance","onClick","buttons","addFilter","Group","Close","cancel","clear","apply"],"mappings":"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"}
|
@@ -11,7 +11,6 @@ function Filter(props) {
|
|
11
11
|
const {
|
12
12
|
allColumns,
|
13
13
|
filter,
|
14
|
-
filters,
|
15
14
|
onChange: handleChange,
|
16
15
|
onRemove,
|
17
16
|
position
|
@@ -86,7 +85,6 @@ function Filter(props) {
|
|
86
85
|
className: "flex min-h-[theme(spacing.8)] w-14 flex-shrink-0 items-center justify-end pr-2 text-right"
|
87
86
|
}, position > 0 ? texts.table.filters.conditions.and : texts.table.filters.conditions.where), /*#__PURE__*/React__default.createElement(FilterColumn, {
|
88
87
|
allColumns: allColumns,
|
89
|
-
filters: filters,
|
90
88
|
onChange: handleChangeColumn,
|
91
89
|
value: id,
|
92
90
|
ref: ref
|
@@ -1 +1 @@
|
|
1
|
-
{"version":3,"file":"Filter.js","sources":["../../../../../../../../../../../../../src/primitives/Table/Core/components/Toolbar/components/Filters/components/Filter.tsx"],"sourcesContent":["import React from 'react';\nimport { Column as ReactTableColumn } from '@tanstack/react-table';\nimport { IconButton } from '../../../../../../../../components/IconButton/IconButton';\nimport { useLocalization } from '../../../../../../../../components/Provider/Localization';\nimport { FilterColumn } from './FilterColumn';\nimport { FilterComparator } from './FilterComparator';\nimport { FilterValue } from './FilterValue';\nimport { TableFilter, TableFilterComparator } from '../../../../../../types';\nimport { guessComparatorsBasedOnControl } from '../util';\n\nexport type FilterProps<TType = unknown> = {\n allColumns: ReactTableColumn<TType, unknown>[];\n filter: TableFilter;\n
|
1
|
+
{"version":3,"file":"Filter.js","sources":["../../../../../../../../../../../../../src/primitives/Table/Core/components/Toolbar/components/Filters/components/Filter.tsx"],"sourcesContent":["import React from 'react';\nimport { Column as ReactTableColumn } from '@tanstack/react-table';\nimport { IconButton } from '../../../../../../../../components/IconButton/IconButton';\nimport { useLocalization } from '../../../../../../../../components/Provider/Localization';\nimport { FilterColumn } from './FilterColumn';\nimport { FilterComparator } from './FilterComparator';\nimport { FilterValue } from './FilterValue';\nimport { TableFilter, TableFilterComparator } from '../../../../../../types';\nimport { guessComparatorsBasedOnControl } from '../util';\n\nexport type FilterProps<TType = unknown> = {\n allColumns: ReactTableColumn<TType, unknown>[];\n filter: TableFilter;\n position: number;\n onChange: (position: number, value: TableFilter) => void;\n onRemove?: (position: number) => void;\n};\n\nexport function Filter<TType = unknown>(props: FilterProps<TType>) {\n const { allColumns, filter, onChange: handleChange, onRemove, position } = props;\n const { texts } = useLocalization();\n const column = allColumns.find(c => c.id === filter.id);\n const ref = React.useRef<HTMLButtonElement>(null);\n\n const {\n id,\n value: { comparator, value },\n } = filter;\n\n const handleChangeColumn = (columnId: string) => {\n const previousColumn = allColumns.find(column => column.id === id);\n const nextColumn = allColumns.find(column => column.id === columnId);\n // UX requirement: if old column data type is the same as next column data type,\n // then we applying the same filter value for the next column,\n // but when data types are different, we're reseting comparator ans value for the next column\n if (\n previousColumn?.columnDef.meta?.dataType &&\n previousColumn?.columnDef.meta?.dataType === nextColumn?.columnDef.meta?.dataType\n ) {\n handleChange(position, { id: columnId, value: filter.value });\n return;\n }\n const validComparators = guessComparatorsBasedOnControl(nextColumn);\n\n const value = {\n comparator: validComparators[0],\n value: undefined,\n };\n\n handleChange(position, { id: columnId, value });\n };\n\n const handleChangeComparator = (comparator: TableFilterComparator) => {\n let nextValue = filter.value.value;\n\n if (comparator === TableFilterComparator.IsEmpty || comparator === TableFilterComparator.IsNotEmpty) {\n nextValue = undefined;\n }\n handleChange(position, { id, value: { comparator, value: nextValue } });\n };\n\n const handleChangeValue = (value: any) => {\n handleChange(position, { id, value: { ...filter.value, value } });\n };\n\n const handleRemove = () => onRemove?.(position);\n\n React.useEffect(() => {\n if (ref.current && !id) {\n ref.current.focus(); // after adding a new filter placeholder, we want to focus it right way.\n }\n }, [id]);\n\n return (\n <div className=\"flex items-start gap-2\">\n <div className=\"flex min-h-[theme(spacing.8)] w-14 flex-shrink-0 items-center justify-end pr-2 text-right\">\n {position > 0 ? texts.table.filters.conditions.and : texts.table.filters.conditions.where}\n </div>\n <FilterColumn allColumns={allColumns as any} onChange={handleChangeColumn as any} value={id} ref={ref} />\n <FilterComparator column={column} onChange={handleChangeComparator as any} value={comparator} />\n <FilterValue column={column} comparator={comparator} onChange={handleChangeValue} value={value} />\n {onRemove ? <IconButton appearance=\"discrete\" className=\"ml-auto\" icon=\"close\" onClick={handleRemove} /> : null}\n </div>\n );\n}\n"],"names":["Filter","props","allColumns","filter","onChange","handleChange","onRemove","position","texts","useLocalization","column","find","c","id","ref","React","useRef","value","comparator","handleChangeColumn","columnId","previousColumn","nextColumn","_previousColumn$colum","columnDef","meta","dataType","_previousColumn$colum2","_nextColumn$columnDef","validComparators","guessComparatorsBasedOnControl","undefined","handleChangeComparator","nextValue","TableFilterComparator","IsEmpty","IsNotEmpty","handleChangeValue","handleRemove","useEffect","current","focus","className","table","filters","conditions","and","where","FilterColumn","FilterComparator","FilterValue","IconButton","appearance","icon","onClick"],"mappings":";;;;;;;;;SAkBgBA,MAAMA,CAAkBC,KAAyB;EAC7D,MAAM;IAAEC,UAAU;IAAEC,MAAM;IAAEC,QAAQ,EAAEC,YAAY;IAAEC,QAAQ;IAAEC;GAAU,GAAGN,KAAK;EAChF,MAAM;IAAEO;GAAO,GAAGC,eAAe,EAAE;EACnC,MAAMC,MAAM,GAAGR,UAAU,CAACS,IAAI,CAACC,CAAC,IAAIA,CAAC,CAACC,EAAE,KAAKV,MAAM,CAACU,EAAE,CAAC;EACvD,MAAMC,GAAG,GAAGC,cAAK,CAACC,MAAM,CAAoB,IAAI,CAAC;EAEjD,MAAM;IACFH,EAAE;IACFI,KAAK,EAAE;MAAEC,UAAU;MAAED;;GACxB,GAAGd,MAAM;EAEV,MAAMgB,kBAAkB,GAAIC,QAAgB;;IACxC,MAAMC,cAAc,GAAGnB,UAAU,CAACS,IAAI,CAACD,MAAM,IAAIA,MAAM,CAACG,EAAE,KAAKA,EAAE,CAAC;IAClE,MAAMS,UAAU,GAAGpB,UAAU,CAACS,IAAI,CAACD,MAAM,IAAIA,MAAM,CAACG,EAAE,KAAKO,QAAQ,CAAC;;;;IAIpE,IACIC,cAAc,aAAdA,cAAc,gBAAAE,qBAAA,GAAdF,cAAc,CAAEG,SAAS,CAACC,IAAI,cAAAF,qBAAA,eAA9BA,qBAAA,CAAgCG,QAAQ,IACxC,CAAAL,cAAc,aAAdA,cAAc,wBAAAM,sBAAA,GAAdN,cAAc,CAAEG,SAAS,CAACC,IAAI,cAAAE,sBAAA,uBAA9BA,sBAAA,CAAgCD,QAAQ,OAAKJ,UAAU,aAAVA,UAAU,wBAAAM,qBAAA,GAAVN,UAAU,CAAEE,SAAS,CAACC,IAAI,cAAAG,qBAAA,uBAA1BA,qBAAA,CAA4BF,QAAQ,GACnF;MACErB,YAAY,CAACE,QAAQ,EAAE;QAAEM,EAAE,EAAEO,QAAQ;QAAEH,KAAK,EAAEd,MAAM,CAACc;OAAO,CAAC;MAC7D;;IAEJ,MAAMY,gBAAgB,GAAGC,8BAA8B,CAACR,UAAU,CAAC;IAEnE,MAAML,KAAK,GAAG;MACVC,UAAU,EAAEW,gBAAgB,CAAC,CAAC,CAAC;MAC/BZ,KAAK,EAAEc;KACV;IAED1B,YAAY,CAACE,QAAQ,EAAE;MAAEM,EAAE,EAAEO,QAAQ;MAAEH;KAAO,CAAC;GAClD;EAED,MAAMe,sBAAsB,GAAId,UAAiC;IAC7D,IAAIe,SAAS,GAAG9B,MAAM,CAACc,KAAK,CAACA,KAAK;IAElC,IAAIC,UAAU,KAAKgB,qBAAqB,CAACC,OAAO,IAAIjB,UAAU,KAAKgB,qBAAqB,CAACE,UAAU,EAAE;MACjGH,SAAS,GAAGF,SAAS;;IAEzB1B,YAAY,CAACE,QAAQ,EAAE;MAAEM,EAAE;MAAEI,KAAK,EAAE;QAAEC,UAAU;QAAED,KAAK,EAAEgB;;KAAa,CAAC;GAC1E;EAED,MAAMI,iBAAiB,GAAIpB,KAAU;IACjCZ,YAAY,CAACE,QAAQ,EAAE;MAAEM,EAAE;MAAEI,KAAK,EAAE;QAAE,GAAGd,MAAM,CAACc,KAAK;QAAEA;;KAAS,CAAC;GACpE;EAED,MAAMqB,YAAY,GAAGA,MAAMhC,QAAQ,aAARA,QAAQ,uBAARA,QAAQ,CAAGC,QAAQ,CAAC;EAE/CQ,cAAK,CAACwB,SAAS,CAAC;IACZ,IAAIzB,GAAG,CAAC0B,OAAO,IAAI,CAAC3B,EAAE,EAAE;MACpBC,GAAG,CAAC0B,OAAO,CAACC,KAAK,EAAE,CAAC;;GAE3B,EAAE,CAAC5B,EAAE,CAAC,CAAC;EAER,oBACIE;IAAK2B,SAAS,EAAC;kBACX3B;IAAK2B,SAAS,EAAC;KACVnC,QAAQ,GAAG,CAAC,GAAGC,KAAK,CAACmC,KAAK,CAACC,OAAO,CAACC,UAAU,CAACC,GAAG,GAAGtC,KAAK,CAACmC,KAAK,CAACC,OAAO,CAACC,UAAU,CAACE,KAAK,CACvF,eACNhC,6BAACiC,YAAY;IAAC9C,UAAU,EAAEA,UAAiB;IAAEE,QAAQ,EAAEe,kBAAyB;IAAEF,KAAK,EAAEJ,EAAE;IAAEC,GAAG,EAAEA;IAAO,eACzGC,6BAACkC,gBAAgB;IAACvC,MAAM,EAAEA,MAAM;IAAEN,QAAQ,EAAE4B,sBAA6B;IAAEf,KAAK,EAAEC;IAAc,eAChGH,6BAACmC,WAAW;IAACxC,MAAM,EAAEA,MAAM;IAAEQ,UAAU,EAAEA,UAAU;IAAEd,QAAQ,EAAEiC,iBAAiB;IAAEpB,KAAK,EAAEA;IAAS,EACjGX,QAAQ,gBAAGS,6BAACoC,UAAU;IAACC,UAAU,EAAC,UAAU;IAACV,SAAS,EAAC,SAAS;IAACW,IAAI,EAAC,OAAO;IAACC,OAAO,EAAEhB;IAAgB,GAAG,IAAI,CAC7G;AAEd;;;;"}
|
@@ -4,11 +4,11 @@ import { Tooltip } from '../../../../../../../../components/Tooltip/Tooltip.js';
|
|
4
4
|
import { useLocalization } from '../../../../../../../../components/Provider/Localization.js';
|
5
5
|
import { Field } from '../../../../../../../../components/Field/Field.js';
|
6
6
|
import { Select2 } from '../../../../../../../../components/Select2/Select2.js';
|
7
|
+
import { FilterContext } from '../FilterContext.js';
|
7
8
|
|
8
9
|
const FilterColumn = /*#__PURE__*/React__default.forwardRef((props, ref) => {
|
9
10
|
const {
|
10
11
|
allColumns,
|
11
|
-
filters,
|
12
12
|
onChange: handleChange,
|
13
13
|
value = null,
|
14
14
|
...attributes
|
@@ -16,6 +16,7 @@ const FilterColumn = /*#__PURE__*/React__default.forwardRef((props, ref) => {
|
|
16
16
|
const {
|
17
17
|
texts
|
18
18
|
} = useLocalization();
|
19
|
+
const filters = React__default.useContext(FilterContext);
|
19
20
|
const selectedColumn = allColumns.find(column => column.id === value);
|
20
21
|
const warning = selectedColumn && !selectedColumn.getIsVisible();
|
21
22
|
return /*#__PURE__*/React__default.createElement("div", {
|
@@ -1 +1 @@
|
|
1
|
-
{"version":3,"file":"FilterColumn.js","sources":["../../../../../../../../../../../../../src/primitives/Table/Core/components/Toolbar/components/Filters/components/FilterColumn.tsx"],"sourcesContent":["import React from 'react';\nimport { Column as ReactTableColumn } from '@tanstack/react-table';\nimport { Select2, Select2Props } from '../../../../../../../../components/Select2/Select2';\nimport { Icon } from '../../../../../../../../components/Icon/Icon';\nimport { Tooltip } from '../../../../../../../../components/Tooltip/Tooltip';\nimport { useLocalization } from '../../../../../../../../components/Provider/Localization';\nimport { Field } from '../../../../../../../../components/Field/Field';\nimport {
|
1
|
+
{"version":3,"file":"FilterColumn.js","sources":["../../../../../../../../../../../../../src/primitives/Table/Core/components/Toolbar/components/Filters/components/FilterColumn.tsx"],"sourcesContent":["import React from 'react';\nimport { Column as ReactTableColumn } from '@tanstack/react-table';\nimport { Select2, Select2Props } from '../../../../../../../../components/Select2/Select2';\nimport { Icon } from '../../../../../../../../components/Icon/Icon';\nimport { Tooltip } from '../../../../../../../../components/Tooltip/Tooltip';\nimport { useLocalization } from '../../../../../../../../components/Provider/Localization';\nimport { Field } from '../../../../../../../../components/Field/Field';\nimport { FilterContext } from '../FilterContext';\n\nexport type FilterColumnProps<TType = unknown> = Omit<Select2Props, 'children'> & {\n allColumns: ReactTableColumn<TType, unknown>[];\n};\n\nexport const FilterColumn = React.forwardRef<HTMLButtonElement, FilterColumnProps>((props, ref) => {\n const { allColumns, onChange: handleChange, value = null, ...attributes } = props;\n const { texts } = useLocalization();\n const filters = React.useContext(FilterContext);\n const selectedColumn = allColumns.find(column => column.id === value);\n const warning = selectedColumn && !selectedColumn.getIsVisible();\n\n return (\n <div className=\"flex flex-col\">\n <Field\n message={warning ? texts.table.filters.hiddenColumn : undefined}\n warning={warning}\n className=\"min-h-[theme(spacing.8)]\">\n <Select2\n {...attributes}\n ref={ref}\n className=\"focus:yt-focus !w-32 flex-shrink-0 \"\n emptyValue={null}\n onChange={handleChange}\n value={value}>\n {allColumns.map(column => (\n <Select2.Option\n key={column.id}\n value={column.id}\n postfix={\n !column.getIsVisible() || column.getIsGrouped() ? (\n <Tooltip\n title={\n column.getIsGrouped()\n ? texts.table.filters.hiddenGroupedColumn\n : texts.table.filters.hiddenColumn\n }>\n <Icon name=\"eye-off\" className=\"text-grey-500 !h-5 !w-5\" />\n </Tooltip>\n ) : undefined\n }\n disabled={column.id !== value && (!column.getCanFilter() || !!filters.find(f => f.id === column.id))}>\n {(column.columnDef.meta?.header as string) +\n (column.parent ? ` (${column.parent?.columnDef.meta?.header})` : '')}\n </Select2.Option>\n ))}\n </Select2>\n </Field>\n </div>\n );\n});\n"],"names":["FilterColumn","React","forwardRef","props","ref","allColumns","onChange","handleChange","value","attributes","texts","useLocalization","filters","useContext","FilterContext","selectedColumn","find","column","id","warning","getIsVisible","className","Field","message","table","hiddenColumn","undefined","Select2","emptyValue","map","_column$columnDef$met","_column$parent","_column$parent$column","Option","key","postfix","getIsGrouped","Tooltip","title","hiddenGroupedColumn","Icon","name","disabled","getCanFilter","f","columnDef","meta","header","parent"],"mappings":";;;;;;;;MAaaA,YAAY,gBAAGC,cAAK,CAACC,UAAU,CAAuC,CAACC,KAAK,EAAEC,GAAG;EAC1F,MAAM;IAAEC,UAAU;IAAEC,QAAQ,EAAEC,YAAY;IAAEC,KAAK,GAAG,IAAI;IAAE,GAAGC;GAAY,GAAGN,KAAK;EACjF,MAAM;IAAEO;GAAO,GAAGC,eAAe,EAAE;EACnC,MAAMC,OAAO,GAAGX,cAAK,CAACY,UAAU,CAACC,aAAa,CAAC;EAC/C,MAAMC,cAAc,GAAGV,UAAU,CAACW,IAAI,CAACC,MAAM,IAAIA,MAAM,CAACC,EAAE,KAAKV,KAAK,CAAC;EACrE,MAAMW,OAAO,GAAGJ,cAAc,IAAI,CAACA,cAAc,CAACK,YAAY,EAAE;EAEhE,oBACInB;IAAKoB,SAAS,EAAC;kBACXpB,6BAACqB,KAAK;IACFC,OAAO,EAAEJ,OAAO,GAAGT,KAAK,CAACc,KAAK,CAACZ,OAAO,CAACa,YAAY,GAAGC,SAAS;IAC/DP,OAAO,EAAEA,OAAO;IAChBE,SAAS,EAAC;kBACVpB,6BAAC0B,OAAO,oBACAlB,UAAU;IACdL,GAAG,EAAEA,GAAG;IACRiB,SAAS,EAAC,qCAAqC;IAC/CO,UAAU,EAAE,IAAI;IAChBtB,QAAQ,EAAEC,YAAY;IACtBC,KAAK,EAAEA;MACNH,UAAU,CAACwB,GAAG,CAACZ,MAAM;IAAA,IAAAa,qBAAA,EAAAC,cAAA,EAAAC,qBAAA;IAAA,oBAClB/B,6BAAC0B,OAAO,CAACM,MAAM;MACXC,GAAG,EAAEjB,MAAM,CAACC,EAAE;MACdV,KAAK,EAAES,MAAM,CAACC,EAAE;MAChBiB,OAAO,EACH,CAAClB,MAAM,CAACG,YAAY,EAAE,IAAIH,MAAM,CAACmB,YAAY,EAAE,iBAC3CnC,6BAACoC,OAAO;QACJC,KAAK,EACDrB,MAAM,CAACmB,YAAY,EAAE,GACf1B,KAAK,CAACc,KAAK,CAACZ,OAAO,CAAC2B,mBAAmB,GACvC7B,KAAK,CAACc,KAAK,CAACZ,OAAO,CAACa;sBAE9BxB,6BAACuC,IAAI;QAACC,IAAI,EAAC,SAAS;QAACpB,SAAS,EAAC;QAA4B,CACrD,IACVK,SAAS;MAEjBgB,QAAQ,EAAEzB,MAAM,CAACC,EAAE,KAAKV,KAAK,KAAK,CAACS,MAAM,CAAC0B,YAAY,EAAE,IAAI,CAAC,CAAC/B,OAAO,CAACI,IAAI,CAAC4B,CAAC,IAAIA,CAAC,CAAC1B,EAAE,KAAKD,MAAM,CAACC,EAAE,CAAC;OACjG,EAAAY,qBAAA,GAAAb,MAAM,CAAC4B,SAAS,CAACC,IAAI,cAAAhB,qBAAA,uBAArBA,qBAAA,CAAuBiB,MAAiB,KACrC9B,MAAM,CAAC+B,MAAM,GAAG,MAAAjB,cAAA,GAAKd,MAAM,CAAC+B,MAAM,cAAAjB,cAAA,wBAAAC,qBAAA,GAAbD,cAAA,CAAec,SAAS,CAACC,IAAI,cAAAd,qBAAA,uBAA7BA,qBAAA,CAA+Be,MAAM,GAAG,GAAG,EAAE,CAAC,CAC3D;GACpB,CAAC,CACI,CACN,CACN;AAEd,CAAC;;;;"}
|
@@ -5,6 +5,7 @@ import { Input } from '../../../../../../../../components/Input/Input.js';
|
|
5
5
|
import { Datepicker } from '../../../../../../../../components/Datepicker/Datepicker.js';
|
6
6
|
import { Switch } from '../../../../../../../../components/Switch/Switch.js';
|
7
7
|
import { TableFilterComparator } from '../../../../../../types.js';
|
8
|
+
import { FilterContext } from '../FilterContext.js';
|
8
9
|
|
9
10
|
const querySelector = 'filter-value';
|
10
11
|
function FilterValue(props) {
|
@@ -83,6 +84,7 @@ function Control(props) {
|
|
83
84
|
} = props;
|
84
85
|
const controlRenderer = column === null || column === void 0 ? void 0 : (_column$columnDef$met2 = column.columnDef.meta) === null || _column$columnDef$met2 === void 0 ? void 0 : _column$columnDef$met2.control;
|
85
86
|
const dataType = column === null || column === void 0 ? void 0 : (_column$columnDef$met3 = column.columnDef.meta) === null || _column$columnDef$met3 === void 0 ? void 0 : _column$columnDef$met3.dataType;
|
87
|
+
const filters = React__default.useContext(FilterContext);
|
86
88
|
useEffect(() => {
|
87
89
|
// Set value to false only after first render of the control (when it's undefined) after setting the FilterColumn value, because we don't want to change then the value every time filter is opened
|
88
90
|
if ((controlRenderer === 'switch' || controlRenderer === 'checkbox') && value === undefined) {
|
@@ -94,7 +96,7 @@ function Control(props) {
|
|
94
96
|
...attributes,
|
95
97
|
setValue: value => onChange(value),
|
96
98
|
value
|
97
|
-
}), {
|
99
|
+
}, undefined, filters), {
|
98
100
|
['data-query-selector']: querySelector,
|
99
101
|
className: 'focus:yt-focus'
|
100
102
|
});
|
@@ -1 +1 @@
|
|
1
|
-
{"version":3,"file":"FilterValue.js","sources":["../../../../../../../../../../../../../src/primitives/Table/Core/components/Toolbar/components/Filters/components/FilterValue.tsx"],"sourcesContent":["import React, { useEffect } from 'react';\nimport { Column as ReactTableColumn } from '@tanstack/react-table';\nimport { Input } from '../../../../../../../../components/Input/Input';\nimport { Datepicker } from '../../../../../../../../components/Datepicker/Datepicker';\nimport { Switch } from '../../../../../../../../components/Switch/Switch';\nimport { useLocalization } from '../../../../../../../../components/Provider/Localization';\nimport { TableColumnDataType, TableFilterComparator } from '../../../../../../types';\nimport { Checkbox } from '../../../../../../../../components/Checkbox/Checkbox';\n\nexport type FilterValueProps<TType = unknown> = {\n column?: ReactTableColumn<TType, unknown>;\n comparator: TableFilterComparator;\n onChange: (value: any) => void;\n value: any;\n};\n\nconst querySelector = 'filter-value';\n\nexport function FilterValue<TType = unknown>(props: FilterValueProps<TType>) {\n const { column, comparator, onChange: handleChange, value } = props;\n const { texts } = useLocalization();\n\n if (comparator === TableFilterComparator.IsEmpty || comparator === TableFilterComparator.IsNotEmpty) {\n return null;\n }\n\n if (comparator === TableFilterComparator.IsBetween) {\n const fromValue = Array.isArray(value) ? value[0] : undefined;\n const toValue = Array.isArray(value) ? value[1] : undefined;\n\n if (column === undefined) {\n return (\n <Input\n aria-label={texts.table.filters.emptyFilter.value}\n className=\"flex-grow\"\n data-query-selector={querySelector}\n disabled\n value={texts.table.filters.emptyFilter.value}\n />\n );\n }\n\n if (column.columnDef.meta?.dataType === 'datetime') {\n return (\n <div className=\"flex flex-grow items-center gap-2\">\n <Control\n column={column}\n data-query-selector={querySelector}\n onChange={value => handleChange([value, toValue])}\n value={fromValue}\n />\n <Control\n column={column}\n data-query-selector={querySelector}\n onChange={value => handleChange([fromValue, value])}\n value={toValue}\n />\n </div>\n );\n }\n\n return (\n <div className=\"flex flex-grow items-center gap-2\">\n <Control\n column={column}\n data-query-selector={querySelector}\n onChange={value => handleChange([isNaN(value) ? undefined : value, toValue])}\n placeholder=\"from\"\n value={fromValue ?? ''}\n />\n <Control\n column={column}\n data-query-selector={querySelector}\n onChange={value => handleChange([fromValue, isNaN(value) ? undefined : value])}\n placeholder=\"to\"\n value={toValue ?? ''}\n />\n </div>\n );\n }\n return (\n <Control\n comparator={comparator}\n column={column}\n data-query-selector={querySelector}\n onChange={handleChange}\n value={value}\n />\n );\n}\n\nfunction Control(props) {\n const { column, comparator, onChange, value, ...attributes } = props;\n const controlRenderer = column?.columnDef.meta?.control;\n const dataType: TableColumnDataType = column?.columnDef.meta?.dataType;\n\n useEffect(() => {\n // Set value to false only after first render of the control (when it's undefined) after setting the FilterColumn value, because we don't want to change then the value every time filter is opened\n if ((controlRenderer === 'switch' || controlRenderer === 'checkbox') && value === undefined) {\n onChange(false);\n }\n }, [controlRenderer]);\n\n if (typeof controlRenderer === 'function') {\n return React.cloneElement(\n controlRenderer({\n ...attributes,\n setValue: value => onChange(value),\n value,\n }),\n { ['data-query-selector']: querySelector, className: 'focus:yt-focus' }\n );\n } else if (controlRenderer === 'datepicker' || dataType === 'datetime') {\n return <Datepicker {...attributes} onChange={event => onChange((event as any).detail)} value={value as Date} />;\n } else if (controlRenderer === 'switch') {\n return <Switch {...attributes} className=\"m-1.5\" checked={Boolean(value)} onChange={onChange} />;\n } else if (controlRenderer === 'checkbox') {\n return <Checkbox {...attributes} className=\"!m-1.5\" checked={Boolean(value)} onChange={onChange} />;\n } else if ((controlRenderer === 'input' || controlRenderer === undefined) && dataType === 'number') {\n return (\n <Input\n {...attributes}\n className=\"flex-grow\"\n type=\"number\"\n onChange={event => onChange(event.target.valueAsNumber)}\n value={String(value ?? '')}\n />\n );\n }\n\n return (\n <Input\n disabled={!column}\n {...attributes}\n className=\"flex-grow\"\n onChange={event => onChange(event.target.value)}\n value={String(value ?? '')}\n />\n );\n}\n"],"names":["querySelector","FilterValue","props","column","comparator","onChange","handleChange","value","texts","useLocalization","TableFilterComparator","IsEmpty","IsNotEmpty","IsBetween","_column$columnDef$met","fromValue","Array","isArray","undefined","toValue","React","Input","table","filters","emptyFilter","className","disabled","columnDef","meta","dataType","Control","isNaN","placeholder","attributes","controlRenderer","_column$columnDef$met2","control","_column$columnDef$met3","useEffect","cloneElement","setValue","Datepicker","event","detail","Switch","checked","Boolean","Checkbox","type","target","valueAsNumber","String"],"mappings":";;;;;;;;AAgBA,MAAMA,aAAa,GAAG,cAAc;SAEpBC,WAAWA,CAAkBC,KAA8B;EACvE,MAAM;IAAEC,MAAM;IAAEC,UAAU;IAAEC,QAAQ,EAAEC,YAAY;IAAEC;GAAO,GAAGL,KAAK;EACnE,MAAM;IAAEM;GAAO,GAAGC,eAAe,EAAE;EAEnC,IAAIL,UAAU,KAAKM,qBAAqB,CAACC,OAAO,IAAIP,UAAU,KAAKM,qBAAqB,CAACE,UAAU,EAAE;IACjG,OAAO,IAAI;;EAGf,IAAIR,UAAU,KAAKM,qBAAqB,CAACG,SAAS,EAAE;IAAA,IAAAC,qBAAA;IAChD,MAAMC,SAAS,GAAGC,KAAK,CAACC,OAAO,CAACV,KAAK,CAAC,GAAGA,KAAK,CAAC,CAAC,CAAC,GAAGW,SAAS;IAC7D,MAAMC,OAAO,GAAGH,KAAK,CAACC,OAAO,CAACV,KAAK,CAAC,GAAGA,KAAK,CAAC,CAAC,CAAC,GAAGW,SAAS;IAE3D,IAAIf,MAAM,KAAKe,SAAS,EAAE;MACtB,oBACIE,6BAACC,KAAK;sBACUb,KAAK,CAACc,KAAK,CAACC,OAAO,CAACC,WAAW,CAACjB,KAAK;QACjDkB,SAAS,EAAC,WAAW;+BACAzB,aAAa;QAClC0B,QAAQ;QACRnB,KAAK,EAAEC,KAAK,CAACc,KAAK,CAACC,OAAO,CAACC,WAAW,CAACjB;QACzC;;IAIV,IAAI,EAAAO,qBAAA,GAAAX,MAAM,CAACwB,SAAS,CAACC,IAAI,cAAAd,qBAAA,uBAArBA,qBAAA,CAAuBe,QAAQ,MAAK,UAAU,EAAE;MAChD,oBACIT;QAAKK,SAAS,EAAC;sBACXL,6BAACU,OAAO;QACJ3B,MAAM,EAAEA,MAAM;+BACOH,aAAa;QAClCK,QAAQ,EAAEE,KAAK,IAAID,YAAY,CAAC,CAACC,KAAK,EAAEY,OAAO,CAAC,CAAC;QACjDZ,KAAK,EAAEQ;QACT,eACFK,6BAACU,OAAO;QACJ3B,MAAM,EAAEA,MAAM;+BACOH,aAAa;QAClCK,QAAQ,EAAEE,KAAK,IAAID,YAAY,CAAC,CAACS,SAAS,EAAER,KAAK,CAAC,CAAC;QACnDA,KAAK,EAAEY;QACT,CACA;;IAId,oBACIC;MAAKK,SAAS,EAAC;oBACXL,6BAACU,OAAO;MACJ3B,MAAM,EAAEA,MAAM;6BACOH,aAAa;MAClCK,QAAQ,EAAEE,KAAK,IAAID,YAAY,CAAC,CAACyB,KAAK,CAACxB,KAAK,CAAC,GAAGW,SAAS,GAAGX,KAAK,EAAEY,OAAO,CAAC,CAAC;MAC5Ea,WAAW,EAAC,MAAM;MAClBzB,KAAK,EAAEQ,SAAS,aAATA,SAAS,cAATA,SAAS,GAAI;MACtB,eACFK,6BAACU,OAAO;MACJ3B,MAAM,EAAEA,MAAM;6BACOH,aAAa;MAClCK,QAAQ,EAAEE,KAAK,IAAID,YAAY,CAAC,CAACS,SAAS,EAAEgB,KAAK,CAACxB,KAAK,CAAC,GAAGW,SAAS,GAAGX,KAAK,CAAC,CAAC;MAC9EyB,WAAW,EAAC,IAAI;MAChBzB,KAAK,EAAEY,OAAO,aAAPA,OAAO,cAAPA,OAAO,GAAI;MACpB,CACA;;EAGd,oBACIC,6BAACU,OAAO;IACJ1B,UAAU,EAAEA,UAAU;IACtBD,MAAM,EAAEA,MAAM;2BACOH,aAAa;IAClCK,QAAQ,EAAEC,YAAY;IACtBC,KAAK,EAAEA;IACT;AAEV;AAEA,SAASuB,OAAOA,CAAC5B,KAAK;;EAClB,MAAM;IAAEC,MAAM;IAAEC,UAAU;IAAEC,QAAQ;IAAEE,KAAK;IAAE,GAAG0B;GAAY,GAAG/B,KAAK;EACpE,MAAMgC,eAAe,GAAG/B,MAAM,aAANA,MAAM,wBAAAgC,sBAAA,GAANhC,MAAM,CAAEwB,SAAS,CAACC,IAAI,cAAAO,sBAAA,uBAAtBA,sBAAA,CAAwBC,OAAO;EACvD,MAAMP,QAAQ,GAAwB1B,MAAM,aAANA,MAAM,wBAAAkC,sBAAA,GAANlC,MAAM,CAAEwB,SAAS,CAACC,IAAI,cAAAS,sBAAA,uBAAtBA,sBAAA,CAAwBR,QAAQ;EAEtES,SAAS,CAAC;;IAEN,IAAI,CAACJ,eAAe,KAAK,QAAQ,IAAIA,eAAe,KAAK,UAAU,KAAK3B,KAAK,KAAKW,SAAS,EAAE;MACzFb,QAAQ,CAAC,KAAK,CAAC;;GAEtB,EAAE,CAAC6B,eAAe,CAAC,CAAC;EAErB,IAAI,OAAOA,eAAe,KAAK,UAAU,EAAE;IACvC,oBAAOd,cAAK,CAACmB,YAAY,CACrBL,eAAe,CAAC;MACZ,GAAGD,UAAU;MACbO,QAAQ,EAAEjC,KAAK,IAAIF,QAAQ,CAACE,KAAK,CAAC;MAClCA;KACH,CAAC,EACF;MAAE,CAAC,qBAAqB,GAAGP,aAAa;MAAEyB,SAAS,EAAE;KAAkB,CAC1E;GACJ,MAAM,IAAIS,eAAe,KAAK,YAAY,IAAIL,QAAQ,KAAK,UAAU,EAAE;IACpE,oBAAOT,6BAACqB,UAAU,oBAAKR,UAAU;MAAE5B,QAAQ,EAAEqC,KAAK,IAAIrC,QAAQ,CAAEqC,KAAa,CAACC,MAAM,CAAC;MAAEpC,KAAK,EAAEA;OAAiB;GAClH,MAAM,IAAI2B,eAAe,KAAK,QAAQ,EAAE;IACrC,oBAAOd,6BAACwB,MAAM,oBAAKX,UAAU;MAAER,SAAS,EAAC,OAAO;MAACoB,OAAO,EAAEC,OAAO,CAACvC,KAAK,CAAC;MAAEF,QAAQ,EAAEA;OAAY;GACnG,MAAM,IAAI6B,eAAe,KAAK,UAAU,EAAE;IACvC,oBAAOd,6BAAC2B,QAAQ,oBAAKd,UAAU;MAAER,SAAS,EAAC,QAAQ;MAACoB,OAAO,EAAEC,OAAO,CAACvC,KAAK,CAAC;MAAEF,QAAQ,EAAEA;OAAY;GACtG,MAAM,IAAI,CAAC6B,eAAe,KAAK,OAAO,IAAIA,eAAe,KAAKhB,SAAS,KAAKW,QAAQ,KAAK,QAAQ,EAAE;IAChG,oBACIT,6BAACC,KAAK,oBACEY,UAAU;MACdR,SAAS,EAAC,WAAW;MACrBuB,IAAI,EAAC,QAAQ;MACb3C,QAAQ,EAAEqC,KAAK,IAAIrC,QAAQ,CAACqC,KAAK,CAACO,MAAM,CAACC,aAAa,CAAC;MACvD3C,KAAK,EAAE4C,MAAM,CAAC5C,KAAK,aAALA,KAAK,cAALA,KAAK,GAAI,EAAE;OAC3B;;EAIV,oBACIa,6BAACC,KAAK;IACFK,QAAQ,EAAE,CAACvB;KACP8B,UAAU;IACdR,SAAS,EAAC,WAAW;IACrBpB,QAAQ,EAAEqC,KAAK,IAAIrC,QAAQ,CAACqC,KAAK,CAACO,MAAM,CAAC1C,KAAK,CAAC;IAC/CA,KAAK,EAAE4C,MAAM,CAAC5C,KAAK,aAALA,KAAK,cAALA,KAAK,GAAI,EAAE;KAC3B;AAEV;;;;"}
|
1
|
+
{"version":3,"file":"FilterValue.js","sources":["../../../../../../../../../../../../../src/primitives/Table/Core/components/Toolbar/components/Filters/components/FilterValue.tsx"],"sourcesContent":["import React, { useEffect } from 'react';\nimport { Column as ReactTableColumn } from '@tanstack/react-table';\nimport { Input } from '../../../../../../../../components/Input/Input';\nimport { Datepicker } from '../../../../../../../../components/Datepicker/Datepicker';\nimport { Switch } from '../../../../../../../../components/Switch/Switch';\nimport { useLocalization } from '../../../../../../../../components/Provider/Localization';\nimport { TableColumnDataType, TableFilterComparator } from '../../../../../../types';\nimport { Checkbox } from '../../../../../../../../components/Checkbox/Checkbox';\nimport { FilterContext } from '../FilterContext';\n\nexport type FilterValueProps<TType = unknown> = {\n column?: ReactTableColumn<TType, unknown>;\n comparator: TableFilterComparator;\n onChange: (value: any) => void;\n value: any;\n};\n\nconst querySelector = 'filter-value';\n\nexport function FilterValue<TType = unknown>(props: FilterValueProps<TType>) {\n const { column, comparator, onChange: handleChange, value } = props;\n const { texts } = useLocalization();\n\n if (comparator === TableFilterComparator.IsEmpty || comparator === TableFilterComparator.IsNotEmpty) {\n return null;\n }\n\n if (comparator === TableFilterComparator.IsBetween) {\n const fromValue = Array.isArray(value) ? value[0] : undefined;\n const toValue = Array.isArray(value) ? value[1] : undefined;\n\n if (column === undefined) {\n return (\n <Input\n aria-label={texts.table.filters.emptyFilter.value}\n className=\"flex-grow\"\n data-query-selector={querySelector}\n disabled\n value={texts.table.filters.emptyFilter.value}\n />\n );\n }\n\n if (column.columnDef.meta?.dataType === 'datetime') {\n return (\n <div className=\"flex flex-grow items-center gap-2\">\n <Control\n column={column}\n data-query-selector={querySelector}\n onChange={value => handleChange([value, toValue])}\n value={fromValue}\n />\n <Control\n column={column}\n data-query-selector={querySelector}\n onChange={value => handleChange([fromValue, value])}\n value={toValue}\n />\n </div>\n );\n }\n\n return (\n <div className=\"flex flex-grow items-center gap-2\">\n <Control\n column={column}\n data-query-selector={querySelector}\n onChange={value => handleChange([isNaN(value) ? undefined : value, toValue])}\n placeholder=\"from\"\n value={fromValue ?? ''}\n />\n <Control\n column={column}\n data-query-selector={querySelector}\n onChange={value => handleChange([fromValue, isNaN(value) ? undefined : value])}\n placeholder=\"to\"\n value={toValue ?? ''}\n />\n </div>\n );\n }\n\n return (\n <Control\n comparator={comparator}\n column={column}\n data-query-selector={querySelector}\n onChange={handleChange}\n value={value}\n />\n );\n}\n\nfunction Control(props) {\n const { column, comparator, onChange, value, ...attributes } = props;\n const controlRenderer = column?.columnDef.meta?.control;\n const dataType: TableColumnDataType = column?.columnDef.meta?.dataType;\n const filters = React.useContext(FilterContext);\n\n useEffect(() => {\n // Set value to false only after first render of the control (when it's undefined) after setting the FilterColumn value, because we don't want to change then the value every time filter is opened\n if ((controlRenderer === 'switch' || controlRenderer === 'checkbox') && value === undefined) {\n onChange(false);\n }\n }, [controlRenderer]);\n\n if (typeof controlRenderer === 'function') {\n return React.cloneElement(\n controlRenderer(\n {\n ...attributes,\n setValue: value => onChange(value),\n value,\n },\n undefined,\n filters\n ),\n { ['data-query-selector']: querySelector, className: 'focus:yt-focus' }\n );\n } else if (controlRenderer === 'datepicker' || dataType === 'datetime') {\n return <Datepicker {...attributes} onChange={event => onChange((event as any).detail)} value={value as Date} />;\n } else if (controlRenderer === 'switch') {\n return <Switch {...attributes} className=\"m-1.5\" checked={Boolean(value)} onChange={onChange} />;\n } else if (controlRenderer === 'checkbox') {\n return <Checkbox {...attributes} className=\"!m-1.5\" checked={Boolean(value)} onChange={onChange} />;\n } else if ((controlRenderer === 'input' || controlRenderer === undefined) && dataType === 'number') {\n return (\n <Input\n {...attributes}\n className=\"flex-grow\"\n type=\"number\"\n onChange={event => onChange(event.target.valueAsNumber)}\n value={String(value ?? '')}\n />\n );\n }\n\n return (\n <Input\n disabled={!column}\n {...attributes}\n className=\"flex-grow\"\n onChange={event => onChange(event.target.value)}\n value={String(value ?? '')}\n />\n );\n}\n"],"names":["querySelector","FilterValue","props","column","comparator","onChange","handleChange","value","texts","useLocalization","TableFilterComparator","IsEmpty","IsNotEmpty","IsBetween","_column$columnDef$met","fromValue","Array","isArray","undefined","toValue","React","Input","table","filters","emptyFilter","className","disabled","columnDef","meta","dataType","Control","isNaN","placeholder","attributes","controlRenderer","_column$columnDef$met2","control","_column$columnDef$met3","useContext","FilterContext","useEffect","cloneElement","setValue","Datepicker","event","detail","Switch","checked","Boolean","Checkbox","type","target","valueAsNumber","String"],"mappings":"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"}
|
@@ -1 +1 @@
|
|
1
|
-
{"version":3,"file":"types.js","sources":["../../../../../../../src/primitives/Table/types.ts"],"sourcesContent":["import {\n ColumnFilter as ReactTableColumnFilter,\n ColumnFiltersState as ReactTableColumnFilterState,\n ColumnOrderState as ReactTableColumnOrderState,\n ColumnPinningState as ReactTableColumnPinningState,\n ColumnSort as ReactTableColumnSort,\n ColumnSizingState as ReactTableColumnSizingState,\n VisibilityState as ReactTableColumnVisibilityState,\n SortingState as ReactTableSortingState,\n BuiltInAggregationFn as ReactTableBuiltInAggregationFn,\n BuiltInSortingFn as ReactTableBuiltInSortingFn,\n} from '@tanstack/react-table';\nimport { FontSize, FontSizes, StringWithAutocompleteOptions, ValueOf } from '../../types';\nimport { MenuItemProps } from '../../components/Menu/components/Item';\n\nexport type TableRef = HTMLTableElement & {\n instance: {\n resetFiltering: () => void;\n resetRowExpansion: () => void;\n resetRowSelection: () => void;\n resetSorting: () => void;\n };\n};\n\n// filtering\nexport enum TableFilterComparator {\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}\nexport type TableFilterValue = {\n comparator: TableFilterComparator;\n value: any;\n};\nexport type TableFilter = {\n id: string;\n value: TableFilterValue;\n};\n\n// columns\nexport type TableColumnAlignment = 'left' | 'center' | 'right';\nexport type TableColumnClassNameHandler<TType = unknown> = string | ((row: TType) => string | undefined);\nexport type TableColumnDataType =\n // base\n | 'text'\n | 'number'\n | 'datetime'\n | 'boolean'\n // advanced\n | 'amount';\nexport type TableColumnFilter = ReactTableColumnFilter;\nexport type TableColumnMenu = ((columnId: string) => React.ReactNode | null)[];\nexport type TableColumnRenderer<TType, TValue> = (value: TValue, row: TType) => JSX.Element | string | number | null;\nexport type TableColumnRendererAggregate<TType, TValue> = (value: TValue, row: TType) => JSX.Element | string | number | null;\nexport type TableColumnRendererControl<TType = unknown> =\n | ((props: TableColumnRendererControlProps, row?: TType) => JSX.Element)\n | 'datepicker'\n | 'input'\n | 'switch'\n | 'checkbox'\n | 'textarea';\nexport type TableColumnRendererControlProps = {\n className?: string;\n disabled?: boolean;\n fontSize?: FontSize;\n invalid?: boolean;\n onBlur?: (value: any) => void;\n onFocus?: React.FocusEventHandler;\n readOnly?: boolean;\n ref: React.RefObject<HTMLElement> | ((instance: HTMLElement | null | undefined) => void);\n setValue: (value: any) => void;\n value: any;\n};\nexport type TableColumnRendererHeader = string;\nexport type TableColumnRendererFooter<TType> = (rows: TType[]) => JSX.Element | string | number | null;\nexport type TableColumnSort = ReactTableColumnSort;\nexport type TableColumnSortDirection = 'asc' | 'desc';\nexport type TableColumnSortFn<TType = unknown> =\n | ((rowA: TType, rowB: TType, columnId: string) => -1 | 0 | 1)\n | ReactTableBuiltInSortingFn\n | 'auto';\nexport type TableColumnWidth = number | 'grow';\n\n// rows\nexport type TableRowActionRenderer<TType = unknown> = (row: TType, internalRowId: string) => JSX.Element | null;\nexport type TableRowActionGroupRenderer<TType = unknown> = (rows: TType[]) => JSX.Element | null;\nexport type TableRowClickHandler<TType = unknown> = (row: TType) => void;\nexport type TableRowDragHandler<TType = unknown> = (\n rows: TType[],\n showPlaceholder: (string) => void,\n setDataTransfer: (data: string) => void\n) => void;\nexport type TableRowDropHandler<TType = unknown> = (event: React.DragEvent, row: TType) => void;\nexport type TableRowGotoHandler = (\n column: string,\n query: string,\n sorting: TableColumnSort[],\n filters: TableColumnFilter[],\n search: string | undefined\n) => Promise<number>;\nexport type TableRowHeight = 'short' | 'medium' | 'tall' | 'extra-tall';\nexport type TableRowSelectHandler<TType = unknown> = (rows: TType[], ids: string[]) => void;\nexport type TableRowWithMetaData<TType = unknown> = TType & {\n _meta?: {\n layout?: 'heading' | 'summary' | 'item';\n };\n};\n\n// shortcuts\nexport type TableShortcutHandlerFn<TType = unknown> = (row: TType) => void;\nexport type TableShortcutHandlerObject<TType = unknown> = {\n handler: TableShortcutHandlerFn<TType>;\n meta?: boolean;\n shift?: boolean;\n};\n\n// table\nexport type TableSortHandler = (sorting: TableColumnSort[]) => Promise<void>;\nexport type TableFilterHandler = (filters: TableColumnFilter[], hiddenColumns: string[]) => Promise<void>;\nexport type TableSearchHandler = (search: string | undefined, hiddenColumns: string[]) => Promise<void>;\nexport type TableFontSize = keyof typeof FontSizes;\nexport type TablePreset = 'complex' | 'list' | 'simple';\nexport type TableRowExpansionRenderer<TType = unknown> = (row: TType) => (() => JSX.Element) | null;\nexport type TableScrollToIndexHandler = (index: number, options?: { align: 'start' | 'center' | 'end' | 'auto' }) => void;\nexport type TableServerLoadPageHandler = (\n pageIndex: number,\n sorting: TableColumnSort[],\n filters: TableColumnFilter[],\n search: string | undefined,\n hiddenColumns: string[]\n) => Promise<void>;\nexport type TableServerLoadAllHandler = (\n sorting: TableColumnSort[],\n filters: TableColumnFilter[],\n search: string | undefined,\n hiddenColumns: string[]\n) => Promise<void>;\nexport enum TableServerLoadAllState {\n Incomplete,\n Loading,\n Completed,\n}\nexport type TableSettingsHandler = (settings: TableSettings) => void | Promise<void>;\nexport type TableShortcuts<TType = unknown> = Record<string, TableShortcutHandlerFn<TType> | TableShortcutHandlerObject<TType>>;\nexport type TableCustomSettingsRenderer = (props: TableSettings) => React.ReactElement<MenuItemProps>[];\nexport type TableEmptyStateReason = 'empty' | 'filtering' | 'searching';\nexport type TableEmptyStateRenderer = (props: { reason: TableEmptyStateReason }) => JSX.Element | null;\n\n// settings\nexport type TableSettings = {\n columnFilters?: ReactTableColumnFilterState;\n columnOrder?: ReactTableColumnOrderState;\n columnPinning?: ReactTableColumnPinningState;\n columnSizing?: ReactTableColumnSizingState;\n columnVisibility?: ReactTableColumnVisibilityState;\n excludeUnmatchedRecordsInSearch?: boolean;\n fontSize?: TableFontSize;\n rowHeight?: TableRowHeight;\n searchQuery?: string;\n sorting?: ReactTableSortingState;\n};\nexport type TableEnableSettingsOptions = {\n columnOrder: boolean;\n columnPinning: boolean;\n columnSizing: boolean;\n columnVisibility: boolean;\n excludeUnmatchedRecordsInSearch: boolean;\n fontSize: boolean;\n grouping: boolean;\n rowHeight: boolean;\n sorting: boolean;\n};\n\n// props\nexport type TableConditionalRowProp<TType = unknown> = boolean | ((row: TType) => boolean);\nexport type TableFeatureProps<TType = unknown> = {\n // react-table built-in\n enableFiltering?: boolean;\n enableSearch?: boolean;\n enableSorting?: boolean;\n enableColumnFreezing?: boolean;\n enableColumnHiding?: boolean;\n enableColumnResizing?: boolean;\n enableRowExpansion?: boolean;\n enableRowExpansionAll?: boolean;\n enableRowSelection?: TableConditionalRowProp<TType>;\n\n // custom -- common between all table types\n enableColumnOrdering?: boolean;\n enableFontSize?: boolean;\n enableFooter?: boolean;\n enablePrinting?: boolean;\n enableRowActions?: boolean;\n enableRowActive?: boolean;\n enableRowClick?: TableConditionalRowProp<TType>;\n enableRowDrag?: boolean;\n enableRowDrop?: boolean;\n enableRowGoto?: boolean;\n enableRowHeight?: boolean;\n enableSaveSettings?: boolean | Partial<TableEnableSettingsOptions>;\n};\n\nexport type TableChild = JSX.Element | boolean | null | undefined;\n\nexport type TableCommonProps<TType = unknown> = TableFeatureProps<TType> & {\n children: TableChild | TableChild[];\n data: TType[];\n id: string;\n\n // misc\n customSettings?: TableCustomSettingsRenderer;\n defaultColumnFreezingIndex?: number;\n defaultRowActiveIndex?: number;\n defaultRowGroupColumnId?: keyof TType;\n defaultSettings?: TableSettings;\n emptyState?: TableEmptyStateRenderer;\n preset?: TablePreset;\n rowActions?: TableRowActionRenderer<TType>[];\n rowActionsForGroup?: TableRowActionGroupRenderer<TType>[];\n rowActionsLength?: number;\n rowExpansionRenderer?: TableRowExpansionRenderer<TType>;\n rowIdentityAccessor?: keyof TType;\n shortcuts?: TableShortcuts<TType>;\n toolbarLeft?: JSX.Element;\n toolbarRight?: JSX.Element;\n toolbarPanel?: JSX.Element;\n\n // handlers\n onRowClick?: TableRowClickHandler<TType>;\n onRowDrag?: TableRowDragHandler<TType>;\n onRowDrop?: TableRowDropHandler<TType>;\n onRowGoto?: TableRowGotoHandler;\n onRowSelect?: TableRowSelectHandler<TType>;\n\n // state change handlers\n onChangeFilter?: TableFilterHandler;\n onChangeSearch?: TableSearchHandler;\n onChangeSettings?: TableSettingsHandler;\n onChangeSort?: TableSortHandler;\n};\n\nexport interface TableClientProps<TType = unknown> extends TableCommonProps<TType> {\n length?: never;\n loadAll?: never;\n loadPage?: never;\n pageSize?: never;\n pages?: never;\n\n // experimental\n _experimentalDataLoader2?: never;\n}\n\nexport interface TableServerProps<TType = unknown> extends TableCommonProps<TType> {\n length: number | undefined;\n loadAll: TableServerLoadAllHandler;\n loadPage: TableServerLoadPageHandler;\n pageSize?: number;\n pages?: number[];\n\n // experimental\n _experimentalDataLoader2?: boolean;\n}\n\nexport type TableProps<TType = unknown> = TableClientProps<TType> | TableServerProps<TType>;\n\nexport type TableColumnProps<TType = unknown> = ValueOf<{\n [Key in keyof TType]: {\n accessor?: Key;\n id: StringWithAutocompleteOptions<Key>;\n // renderers\n renderer?: TableColumnRenderer<TType, TType[Key]>;\n /** Renderer to use if the cell is an aggregate cell and part of a grouped row */\n aggregate?: TableColumnRendererAggregate<TType, TType[Key]>;\n control?: TableColumnRendererControl<TType>;\n footer?: TableColumnRendererFooter<TType>;\n header: TableColumnRendererHeader;\n // options\n /** Aggregation function to be used when the column is part of a grouped row */\n aggregationFn?: 'auto' | ReactTableBuiltInAggregationFn;\n align?: TableColumnAlignment;\n className?: TableColumnClassNameHandler<TType>;\n dataType?: TableColumnDataType;\n defaultHidden?: boolean;\n defaultWidth?: TableColumnWidth;\n enableEditing?: boolean;\n enableFiltering?: boolean;\n enableGrouping?: boolean;\n enableHiding?: boolean;\n enableOrdering?: boolean;\n enablePrinting?: boolean;\n enableResizing?: boolean;\n enableSearch?: boolean;\n enableSorting?: boolean;\n enableTruncate?: boolean;\n filters?: TableFilterComparator[];\n headerClassName?: string;\n menu?: TableColumnMenu;\n minWidth?: number;\n sort?: TableColumnSortDirection;\n sortFn?: TableColumnSortFn<TType>;\n tooltip?: string;\n };\n}>;\n\nexport type TableGroupProps = {\n children: (JSX.Element | boolean | null | undefined)[];\n header: string;\n id: string;\n};\n\nexport type TableTexts = {\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 editFilter: string;\n filter: string;\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 filters: {\n button: string;\n buttons: {\n addFilter: string;\n clearFilters: string;\n cancel: string;\n clear: string;\n apply: 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 hiddenGroupedColumn: 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 settingsDialog: {\n title: string;\n size: string;\n sizeA5: string;\n sizeA4: string;\n sizeA3: string;\n sizeLetter: string;\n sizeLegal: string;\n orientation: string;\n orientationLandscape: string;\n orientationPortrait: string;\n rows: string;\n rowsAll: string;\n rowsSelected: string;\n layout: string;\n layoutSplitGroups: 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":["TableFilterComparator","TableServerLoadAllState"],"mappings":"AAwBA;IACYA;AAAZ,WAAYA,qBAAqB;EAC7BA,yEAAQ;EACRA,qFAAc;EACdA,2EAAS;EACTA,iFAAY;EACZA,mFAAa;EACbA,6EAAU;EACVA,2EAAS;EACTA,uEAAO;EACPA,6EAAU;EACVA,+FAAmB;EACnBA,sGAAsB;EACtBA,0EAAQ;EACRA,0EAAQ;EACRA,4EAAS;AACb,CAAC,EAfWA,qBAAqB,KAArBA,qBAAqB;IA2HrBC;AAAZ,WAAYA,uBAAuB;EAC/BA,iFAAU;EACVA,2EAAO;EACPA,+EAAS;AACb,CAAC,EAJWA,uBAAuB,KAAvBA,uBAAuB;;;;"}
|
1
|
+
{"version":3,"file":"types.js","sources":["../../../../../../../src/primitives/Table/types.ts"],"sourcesContent":["import {\n ColumnFilter as ReactTableColumnFilter,\n ColumnFiltersState as ReactTableColumnFilterState,\n ColumnOrderState as ReactTableColumnOrderState,\n ColumnPinningState as ReactTableColumnPinningState,\n ColumnSort as ReactTableColumnSort,\n ColumnSizingState as ReactTableColumnSizingState,\n VisibilityState as ReactTableColumnVisibilityState,\n SortingState as ReactTableSortingState,\n BuiltInAggregationFn as ReactTableBuiltInAggregationFn,\n BuiltInSortingFn as ReactTableBuiltInSortingFn,\n} from '@tanstack/react-table';\nimport { FontSize, FontSizes, StringWithAutocompleteOptions, ValueOf } from '../../types';\nimport { MenuItemProps } from '../../components/Menu/components/Item';\n\nexport type TableRef = HTMLTableElement & {\n instance: {\n resetFiltering: () => void;\n resetRowExpansion: () => void;\n resetRowSelection: () => void;\n resetSorting: () => void;\n };\n};\n\n// filtering\nexport enum TableFilterComparator {\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}\nexport type TableFilterValue = {\n comparator: TableFilterComparator;\n value: any;\n};\nexport type TableFilter = {\n id: string;\n value: TableFilterValue;\n};\n\n// columns\nexport type TableColumnAlignment = 'left' | 'center' | 'right';\nexport type TableColumnClassNameHandler<TType = unknown> = string | ((row: TType) => string | undefined);\nexport type TableColumnDataType =\n // base\n | 'text'\n | 'number'\n | 'datetime'\n | 'boolean'\n // advanced\n | 'amount';\nexport type TableColumnFilter = ReactTableColumnFilter;\nexport type TableColumnMenu = ((columnId: string) => React.ReactNode | null)[];\nexport type TableColumnRenderer<TType, TValue> = (value: TValue, row: TType) => JSX.Element | string | number | null;\nexport type TableColumnRendererAggregate<TType, TValue> = (value: TValue, row: TType) => JSX.Element | string | number | null;\nexport type TableColumnRendererControl<TType = unknown> =\n | ((props: TableColumnRendererControlProps, row?: TType, filterState?: TableFilter[]) => JSX.Element)\n | 'datepicker'\n | 'input'\n | 'switch'\n | 'checkbox'\n | 'textarea';\nexport type TableColumnRendererControlProps = {\n className?: string;\n disabled?: boolean;\n fontSize?: FontSize;\n invalid?: boolean;\n onBlur?: (value: any) => void;\n onFocus?: React.FocusEventHandler;\n readOnly?: boolean;\n ref: React.RefObject<HTMLElement> | ((instance: HTMLElement | null | undefined) => void);\n setValue: (value: any) => void;\n value: any;\n};\nexport type TableColumnRendererHeader = string;\nexport type TableColumnRendererFooter<TType> = (rows: TType[]) => JSX.Element | string | number | null;\nexport type TableColumnSort = ReactTableColumnSort;\nexport type TableColumnSortDirection = 'asc' | 'desc';\nexport type TableColumnSortFn<TType = unknown> =\n | ((rowA: TType, rowB: TType, columnId: string) => -1 | 0 | 1)\n | ReactTableBuiltInSortingFn\n | 'auto';\nexport type TableColumnWidth = number | 'grow';\n\n// rows\nexport type TableRowActionRenderer<TType = unknown> = (row: TType, internalRowId: string) => JSX.Element | null;\nexport type TableRowActionGroupRenderer<TType = unknown> = (rows: TType[]) => JSX.Element | null;\nexport type TableRowClickHandler<TType = unknown> = (row: TType) => void;\nexport type TableRowDragHandler<TType = unknown> = (\n rows: TType[],\n showPlaceholder: (string) => void,\n setDataTransfer: (data: string) => void\n) => void;\nexport type TableRowDropHandler<TType = unknown> = (event: React.DragEvent, row: TType) => void;\nexport type TableRowGotoHandler = (\n column: string,\n query: string,\n sorting: TableColumnSort[],\n filters: TableColumnFilter[],\n search: string | undefined\n) => Promise<number>;\nexport type TableRowHeight = 'short' | 'medium' | 'tall' | 'extra-tall';\nexport type TableRowSelectHandler<TType = unknown> = (rows: TType[], ids: string[]) => void;\nexport type TableRowWithMetaData<TType = unknown> = TType & {\n _meta?: {\n layout?: 'heading' | 'summary' | 'item';\n };\n};\n\n// shortcuts\nexport type TableShortcutHandlerFn<TType = unknown> = (row: TType) => void;\nexport type TableShortcutHandlerObject<TType = unknown> = {\n handler: TableShortcutHandlerFn<TType>;\n meta?: boolean;\n shift?: boolean;\n};\n\n// table\nexport type TableSortHandler = (sorting: TableColumnSort[]) => Promise<void>;\nexport type TableFilterHandler = (filters: TableColumnFilter[], hiddenColumns: string[]) => Promise<void>;\nexport type TableSearchHandler = (search: string | undefined, hiddenColumns: string[]) => Promise<void>;\nexport type TableFontSize = keyof typeof FontSizes;\nexport type TablePreset = 'complex' | 'list' | 'simple';\nexport type TableRowExpansionRenderer<TType = unknown> = (row: TType) => (() => JSX.Element) | null;\nexport type TableScrollToIndexHandler = (index: number, options?: { align: 'start' | 'center' | 'end' | 'auto' }) => void;\nexport type TableServerLoadPageHandler = (\n pageIndex: number,\n sorting: TableColumnSort[],\n filters: TableColumnFilter[],\n search: string | undefined,\n hiddenColumns: string[]\n) => Promise<void>;\nexport type TableServerLoadAllHandler = (\n sorting: TableColumnSort[],\n filters: TableColumnFilter[],\n search: string | undefined,\n hiddenColumns: string[]\n) => Promise<void>;\nexport enum TableServerLoadAllState {\n Incomplete,\n Loading,\n Completed,\n}\nexport type TableSettingsHandler = (settings: TableSettings) => void | Promise<void>;\nexport type TableShortcuts<TType = unknown> = Record<string, TableShortcutHandlerFn<TType> | TableShortcutHandlerObject<TType>>;\nexport type TableCustomSettingsRenderer = (props: TableSettings) => React.ReactElement<MenuItemProps>[];\nexport type TableEmptyStateReason = 'empty' | 'filtering' | 'searching';\nexport type TableEmptyStateRenderer = (props: { reason: TableEmptyStateReason }) => JSX.Element | null;\n\n// settings\nexport type TableSettings = {\n columnFilters?: ReactTableColumnFilterState;\n columnOrder?: ReactTableColumnOrderState;\n columnPinning?: ReactTableColumnPinningState;\n columnSizing?: ReactTableColumnSizingState;\n columnVisibility?: ReactTableColumnVisibilityState;\n excludeUnmatchedRecordsInSearch?: boolean;\n fontSize?: TableFontSize;\n rowHeight?: TableRowHeight;\n searchQuery?: string;\n sorting?: ReactTableSortingState;\n};\nexport type TableEnableSettingsOptions = {\n columnOrder: boolean;\n columnPinning: boolean;\n columnSizing: boolean;\n columnVisibility: boolean;\n excludeUnmatchedRecordsInSearch: boolean;\n fontSize: boolean;\n grouping: boolean;\n rowHeight: boolean;\n sorting: boolean;\n};\n\n// props\nexport type TableConditionalRowProp<TType = unknown> = boolean | ((row: TType) => boolean);\nexport type TableFeatureProps<TType = unknown> = {\n // react-table built-in\n enableFiltering?: boolean;\n enableSearch?: boolean;\n enableSorting?: boolean;\n enableColumnFreezing?: boolean;\n enableColumnHiding?: boolean;\n enableColumnResizing?: boolean;\n enableRowExpansion?: boolean;\n enableRowExpansionAll?: boolean;\n enableRowSelection?: TableConditionalRowProp<TType>;\n\n // custom -- common between all table types\n enableColumnOrdering?: boolean;\n enableFontSize?: boolean;\n enableFooter?: boolean;\n enablePrinting?: boolean;\n enableRowActions?: boolean;\n enableRowActive?: boolean;\n enableRowClick?: TableConditionalRowProp<TType>;\n enableRowDrag?: boolean;\n enableRowDrop?: boolean;\n enableRowGoto?: boolean;\n enableRowHeight?: boolean;\n enableSaveSettings?: boolean | Partial<TableEnableSettingsOptions>;\n};\n\nexport type TableChild = JSX.Element | boolean | null | undefined;\n\nexport type TableCommonProps<TType = unknown> = TableFeatureProps<TType> & {\n children: TableChild | TableChild[];\n data: TType[];\n id: string;\n\n // misc\n customSettings?: TableCustomSettingsRenderer;\n defaultColumnFreezingIndex?: number;\n defaultRowActiveIndex?: number;\n defaultRowGroupColumnId?: keyof TType;\n defaultSettings?: TableSettings;\n emptyState?: TableEmptyStateRenderer;\n preset?: TablePreset;\n rowActions?: TableRowActionRenderer<TType>[];\n rowActionsForGroup?: TableRowActionGroupRenderer<TType>[];\n rowActionsLength?: number;\n rowExpansionRenderer?: TableRowExpansionRenderer<TType>;\n rowIdentityAccessor?: keyof TType;\n shortcuts?: TableShortcuts<TType>;\n toolbarLeft?: JSX.Element;\n toolbarRight?: JSX.Element;\n toolbarPanel?: JSX.Element;\n\n // handlers\n onRowClick?: TableRowClickHandler<TType>;\n onRowDrag?: TableRowDragHandler<TType>;\n onRowDrop?: TableRowDropHandler<TType>;\n onRowGoto?: TableRowGotoHandler;\n onRowSelect?: TableRowSelectHandler<TType>;\n\n // state change handlers\n onChangeFilter?: TableFilterHandler;\n onChangeSearch?: TableSearchHandler;\n onChangeSettings?: TableSettingsHandler;\n onChangeSort?: TableSortHandler;\n};\n\nexport interface TableClientProps<TType = unknown> extends TableCommonProps<TType> {\n length?: never;\n loadAll?: never;\n loadPage?: never;\n pageSize?: never;\n pages?: never;\n\n // experimental\n _experimentalDataLoader2?: never;\n}\n\nexport interface TableServerProps<TType = unknown> extends TableCommonProps<TType> {\n length: number | undefined;\n loadAll: TableServerLoadAllHandler;\n loadPage: TableServerLoadPageHandler;\n pageSize?: number;\n pages?: number[];\n\n // experimental\n _experimentalDataLoader2?: boolean;\n}\n\nexport type TableProps<TType = unknown> = TableClientProps<TType> | TableServerProps<TType>;\n\nexport type TableColumnProps<TType = unknown> = ValueOf<{\n [Key in keyof TType]: {\n accessor?: Key;\n id: StringWithAutocompleteOptions<Key>;\n // renderers\n renderer?: TableColumnRenderer<TType, TType[Key]>;\n /** Renderer to use if the cell is an aggregate cell and part of a grouped row */\n aggregate?: TableColumnRendererAggregate<TType, TType[Key]>;\n control?: TableColumnRendererControl<TType>;\n footer?: TableColumnRendererFooter<TType>;\n header: TableColumnRendererHeader;\n // options\n /** Aggregation function to be used when the column is part of a grouped row */\n aggregationFn?: 'auto' | ReactTableBuiltInAggregationFn;\n align?: TableColumnAlignment;\n className?: TableColumnClassNameHandler<TType>;\n dataType?: TableColumnDataType;\n defaultHidden?: boolean;\n defaultWidth?: TableColumnWidth;\n enableEditing?: boolean;\n enableFiltering?: boolean;\n enableGrouping?: boolean;\n enableHiding?: boolean;\n enableOrdering?: boolean;\n enablePrinting?: boolean;\n enableResizing?: boolean;\n enableSearch?: boolean;\n enableSorting?: boolean;\n enableTruncate?: boolean;\n filters?: TableFilterComparator[];\n headerClassName?: string;\n menu?: TableColumnMenu;\n minWidth?: number;\n sort?: TableColumnSortDirection;\n sortFn?: TableColumnSortFn<TType>;\n tooltip?: string;\n };\n}>;\n\nexport type TableGroupProps = {\n children: (JSX.Element | boolean | null | undefined)[];\n header: string;\n id: string;\n};\n\nexport type TableTexts = {\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 editFilter: string;\n filter: string;\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 filters: {\n button: string;\n buttons: {\n addFilter: string;\n clearFilters: string;\n cancel: string;\n clear: string;\n apply: 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 hiddenGroupedColumn: 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 settingsDialog: {\n title: string;\n size: string;\n sizeA5: string;\n sizeA4: string;\n sizeA3: string;\n sizeLetter: string;\n sizeLegal: string;\n orientation: string;\n orientationLandscape: string;\n orientationPortrait: string;\n rows: string;\n rowsAll: string;\n rowsSelected: string;\n layout: string;\n layoutSplitGroups: 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":["TableFilterComparator","TableServerLoadAllState"],"mappings":"AAwBA;IACYA;AAAZ,WAAYA,qBAAqB;EAC7BA,yEAAQ;EACRA,qFAAc;EACdA,2EAAS;EACTA,iFAAY;EACZA,mFAAa;EACbA,6EAAU;EACVA,2EAAS;EACTA,uEAAO;EACPA,6EAAU;EACVA,+FAAmB;EACnBA,sGAAsB;EACtBA,0EAAQ;EACRA,0EAAQ;EACRA,4EAAS;AACb,CAAC,EAfWA,qBAAqB,KAArBA,qBAAqB;IA2HrBC;AAAZ,WAAYA,uBAAuB;EAC/BA,iFAAU;EACVA,2EAAO;EACPA,+EAAS;AACb,CAAC,EAJWA,uBAAuB,KAAvBA,uBAAuB;;;;"}
|