@economic/taco 2.45.0-alpha.26 → 2.45.0-alpha.27
Sign up to get free protection for your applications and to get access to all the features.
- package/dist/components/Report/Report.d.ts +1 -1
- package/dist/components/Select/Select.d.ts +19 -5
- package/dist/esm/index.css +74 -4
- package/dist/esm/packages/taco/src/components/Combobox/useCombobox.js +2 -2
- package/dist/esm/packages/taco/src/components/Combobox/useCombobox.js.map +1 -1
- package/dist/esm/packages/taco/src/components/Select/Select.js +9 -0
- package/dist/esm/packages/taco/src/components/Select/Select.js.map +1 -1
- package/dist/esm/packages/taco/src/components/Table3/components/Columns/Cell/EditingControlCell.js +33 -26
- package/dist/esm/packages/taco/src/components/Table3/components/Columns/Cell/EditingControlCell.js.map +1 -1
- package/dist/esm/packages/taco/src/components/Table3/components/Toolbar/Editing/Editing.js +4 -0
- package/dist/esm/packages/taco/src/components/Table3/components/Toolbar/Editing/Editing.js.map +1 -1
- package/dist/esm/packages/taco/src/components/Table3/features/useTableEditing.js +0 -1
- package/dist/esm/packages/taco/src/components/Table3/features/useTableEditing.js.map +1 -1
- package/dist/esm/packages/taco/src/components/Toast/Toaster.js +16 -2
- package/dist/esm/packages/taco/src/components/Toast/Toaster.js.map +1 -1
- package/dist/esm/packages/taco/src/primitives/Table/Core/components/Footer/Footer.js +16 -4
- package/dist/esm/packages/taco/src/primitives/Table/Core/components/Footer/Footer.js.map +1 -1
- package/dist/esm/packages/taco/src/primitives/Table/Core/components/Header/Header.js +20 -6
- package/dist/esm/packages/taco/src/primitives/Table/Core/components/Header/Header.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/useTableManager.js +1 -0
- package/dist/esm/packages/taco/src/primitives/Table/useTableManager/useTableManager.js.map +1 -1
- package/dist/esm/packages/taco/src/primitives/Table/useTableManager/util/setup.js +4 -1
- package/dist/esm/packages/taco/src/primitives/Table/useTableManager/util/setup.js.map +1 -1
- package/dist/index.css +74 -4
- package/dist/primitives/Table/Core/components/Footer/Footer.d.ts +2 -2
- package/dist/primitives/Table/types.d.ts +5 -1
- package/dist/primitives/Table/useTableManager/useTableManager.d.ts +2 -1
- package/dist/taco.cjs.development.js +103 -42
- 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 +3 -2
- package/tailwind.config.js +1 -0
@@ -16,7 +16,11 @@ function Editing(props) {
|
|
16
16
|
const ref = React__default.useRef(null);
|
17
17
|
const tableMeta = table.options.meta;
|
18
18
|
const handleChange = enabled => {
|
19
|
+
var _tableMeta$onEvent;
|
19
20
|
tableMeta.editing.toggleEditing(enabled, table, scrollToIndex);
|
21
|
+
(_tableMeta$onEvent = tableMeta.onEvent) === null || _tableMeta$onEvent === void 0 ? void 0 : _tableMeta$onEvent.call(tableMeta, 'editing-mode', {
|
22
|
+
enabled
|
23
|
+
});
|
20
24
|
};
|
21
25
|
const tooltip = /*#__PURE__*/React__default.createElement(React__default.Fragment, null, texts.table3.editing.buttons.edit.tooltip, /*#__PURE__*/React__default.createElement(Shortcut, {
|
22
26
|
className: "ml-2",
|
package/dist/esm/packages/taco/src/components/Table3/components/Toolbar/Editing/Editing.js.map
CHANGED
@@ -1 +1 @@
|
|
1
|
-
{"version":3,"file":"Editing.js","sources":["../../../../../../../../../../src/components/Table3/components/Toolbar/Editing/Editing.tsx"],"sourcesContent":["import React from 'react';\nimport { Table as ReactTable, TableMeta as ReactTableMeta } from '@tanstack/react-table';\nimport { useLocalization } from '../../../../Provider/Localization';\nimport { Tooltip } from '../../../../Tooltip/Tooltip';\nimport { ModeSwitch } from '../../../../ModeSwitch/ModeSwitch';\nimport { Shortcut } from '../../../../Shortcut/Shortcut';\nimport { shortcut } from '../../../util/editing';\n\ntype EditingProps<TType = unknown> = React.HTMLAttributes<HTMLButtonElement> & {\n scrollToIndex: any;\n table: ReactTable<TType>;\n};\n\nexport function Editing<TType = unknown>(props: EditingProps<TType>) {\n const { scrollToIndex, table } = props;\n const { texts } = useLocalization();\n const ref = React.useRef<HTMLButtonElement>(null);\n const tableMeta = table.options.meta as ReactTableMeta<TType>;\n\n const handleChange = (enabled: boolean) => {\n tableMeta.editing.toggleEditing(enabled, table, scrollToIndex);\n };\n\n const tooltip = (\n <>\n {texts.table3.editing.buttons.edit.tooltip}\n <Shortcut className=\"ml-2\" keys={shortcut} />\n </>\n );\n\n return (\n <Tooltip title={tooltip}>\n <ModeSwitch data-table=\"editing-toggle\" checked={tableMeta.editing.isEditing} onChange={handleChange} ref={ref} />\n </Tooltip>\n );\n}\n"],"names":["Editing","props","scrollToIndex","table","texts","useLocalization","ref","React","useRef","tableMeta","options","meta","handleChange","enabled","editing","toggleEditing","tooltip","table3","buttons","edit","Shortcut","className","keys","shortcut","Tooltip","title","ModeSwitch","checked","isEditing","onChange"],"mappings":";;;;;;;SAagBA,OAAOA,CAAkBC,KAA0B;EAC/D,MAAM;IAAEC,aAAa;IAAEC;GAAO,GAAGF,KAAK;EACtC,MAAM;IAAEG;GAAO,GAAGC,eAAe,EAAE;EACnC,MAAMC,GAAG,GAAGC,cAAK,CAACC,MAAM,CAAoB,IAAI,CAAC;EACjD,MAAMC,SAAS,GAAGN,KAAK,CAACO,OAAO,CAACC,IAA6B;EAE7D,MAAMC,YAAY,GAAIC,OAAgB
|
1
|
+
{"version":3,"file":"Editing.js","sources":["../../../../../../../../../../src/components/Table3/components/Toolbar/Editing/Editing.tsx"],"sourcesContent":["import React from 'react';\nimport { Table as ReactTable, TableMeta as ReactTableMeta } from '@tanstack/react-table';\nimport { useLocalization } from '../../../../Provider/Localization';\nimport { Tooltip } from '../../../../Tooltip/Tooltip';\nimport { ModeSwitch } from '../../../../ModeSwitch/ModeSwitch';\nimport { Shortcut } from '../../../../Shortcut/Shortcut';\nimport { shortcut } from '../../../util/editing';\n\ntype EditingProps<TType = unknown> = React.HTMLAttributes<HTMLButtonElement> & {\n scrollToIndex: any;\n table: ReactTable<TType>;\n};\n\nexport function Editing<TType = unknown>(props: EditingProps<TType>) {\n const { scrollToIndex, table } = props;\n const { texts } = useLocalization();\n const ref = React.useRef<HTMLButtonElement>(null);\n const tableMeta = table.options.meta as ReactTableMeta<TType>;\n\n const handleChange = (enabled: boolean) => {\n tableMeta.editing.toggleEditing(enabled, table, scrollToIndex);\n tableMeta.onEvent?.('editing-mode', { enabled });\n };\n\n const tooltip = (\n <>\n {texts.table3.editing.buttons.edit.tooltip}\n <Shortcut className=\"ml-2\" keys={shortcut} />\n </>\n );\n\n return (\n <Tooltip title={tooltip}>\n <ModeSwitch data-table=\"editing-toggle\" checked={tableMeta.editing.isEditing} onChange={handleChange} ref={ref} />\n </Tooltip>\n );\n}\n"],"names":["Editing","props","scrollToIndex","table","texts","useLocalization","ref","React","useRef","tableMeta","options","meta","handleChange","enabled","editing","toggleEditing","_tableMeta$onEvent","onEvent","call","tooltip","table3","buttons","edit","Shortcut","className","keys","shortcut","Tooltip","title","ModeSwitch","checked","isEditing","onChange"],"mappings":";;;;;;;SAagBA,OAAOA,CAAkBC,KAA0B;EAC/D,MAAM;IAAEC,aAAa;IAAEC;GAAO,GAAGF,KAAK;EACtC,MAAM;IAAEG;GAAO,GAAGC,eAAe,EAAE;EACnC,MAAMC,GAAG,GAAGC,cAAK,CAACC,MAAM,CAAoB,IAAI,CAAC;EACjD,MAAMC,SAAS,GAAGN,KAAK,CAACO,OAAO,CAACC,IAA6B;EAE7D,MAAMC,YAAY,GAAIC,OAAgB;;IAClCJ,SAAS,CAACK,OAAO,CAACC,aAAa,CAACF,OAAO,EAAEV,KAAK,EAAED,aAAa,CAAC;IAC9D,CAAAc,kBAAA,GAAAP,SAAS,CAACQ,OAAO,cAAAD,kBAAA,uBAAjBA,kBAAA,CAAAE,IAAA,CAAAT,SAAS,EAAW,cAAc,EAAE;MAAEI;KAAS,CAAC;GACnD;EAED,MAAMM,OAAO,gBACTZ,4DACKH,KAAK,CAACgB,MAAM,CAACN,OAAO,CAACO,OAAO,CAACC,IAAI,CAACH,OAAO,eAC1CZ,6BAACgB,QAAQ;IAACC,SAAS,EAAC,MAAM;IAACC,IAAI,EAAEC;IAAY,CAEpD;EAED,oBACInB,6BAACoB,OAAO;IAACC,KAAK,EAAET;kBACZZ,6BAACsB,UAAU;kBAAY,gBAAgB;IAACC,OAAO,EAAErB,SAAS,CAACK,OAAO,CAACiB,SAAS;IAAEC,QAAQ,EAAEpB,YAAY;IAAEN,GAAG,EAAEA;IAAO,CAC5G;AAElB;;;;"}
|
@@ -72,7 +72,6 @@ function useTableEditing(isEnabled = false, handleSave, handleChange, handleCrea
|
|
72
72
|
var _tableMeta$rowActive$, _table$getRowModel$ro;
|
73
73
|
const index = (_tableMeta$rowActive$ = tableMeta.rowActive.rowActiveIndex) !== null && _tableMeta$rowActive$ !== void 0 ? _tableMeta$rowActive$ : 0;
|
74
74
|
if (tableMeta.rowActive.rowActiveIndex === undefined) {
|
75
|
-
console.log('edit toggle active', index);
|
76
75
|
tableMeta.rowActive.setRowActiveIndex(index);
|
77
76
|
}
|
78
77
|
if (!isTemporaryRow((_table$getRowModel$ro = table.getRowModel().rows[index]) === null || _table$getRowModel$ro === void 0 ? void 0 : _table$getRowModel$ro.id)) {
|
@@ -1 +1 @@
|
|
1
|
-
{"version":3,"file":"useTableEditing.js","sources":["../../../../../../../../src/components/Table3/features/useTableEditing.ts"],"sourcesContent":["import React from 'react';\nimport { Table as ReactTable, TableMeta as ReactTableMeta } from '@tanstack/react-table';\nimport {\n Table3EditingChangeHandler,\n Table3EditingCreateHandler,\n Table3EditingDiscardHandler,\n Table3EditingSaveHandler,\n Table3EditingValidatorFn,\n} from '../types';\nimport { usePendingChangesState } from './useEditingState';\nimport { isTemporaryRow } from '../util/editing';\nimport _ from 'lodash';\n\nexport function useTableEditing<TType = unknown>(\n isEnabled = false,\n handleSave: Table3EditingSaveHandler<TType> | undefined,\n handleChange: Table3EditingChangeHandler<TType> | undefined,\n handleCreate: Table3EditingCreateHandler<TType> | undefined,\n handleDiscard: Table3EditingDiscardHandler | undefined,\n rowIdentityAccessor: keyof TType | undefined,\n validator: Table3EditingValidatorFn<TType> | undefined\n) {\n // used to switch the table into editing mode\n const [isEditing, setEditing] = React.useState(false);\n\n // used to switch the editing between \"detailed\" mode\n const [isDetailedMode, toggleDetailedMode] = React.useState(false);\n\n // used to contain ref to the create button\n const createRowButtonRef = React.useRef<HTMLButtonElement>(null);\n\n // store the last focused cell, so that up/down arrow key navigation remains in the same column\n const [lastFocusedCellIndex, setLastFocusedCellIndex] = React.useState<number | undefined>(undefined);\n\n const pendingChangesFns = usePendingChangesState<TType>(\n handleSave,\n handleChange,\n handleDiscard,\n rowIdentityAccessor as keyof TType,\n validator\n );\n\n function toggleEditing<T extends TType>(\n enabled: React.SetStateAction<boolean>,\n table: ReactTable<T>,\n scrollToIndex: (index: number) => void\n ) {\n const tableMeta = table.options.meta as ReactTableMeta<TType>;\n\n if (enabled) {\n const index = tableMeta.rowActive.rowActiveIndex ?? 0;\n\n if (tableMeta.rowActive.rowActiveIndex === undefined) {\n
|
1
|
+
{"version":3,"file":"useTableEditing.js","sources":["../../../../../../../../src/components/Table3/features/useTableEditing.ts"],"sourcesContent":["import React from 'react';\nimport { Table as ReactTable, TableMeta as ReactTableMeta } from '@tanstack/react-table';\nimport {\n Table3EditingChangeHandler,\n Table3EditingCreateHandler,\n Table3EditingDiscardHandler,\n Table3EditingSaveHandler,\n Table3EditingValidatorFn,\n} from '../types';\nimport { usePendingChangesState } from './useEditingState';\nimport { isTemporaryRow } from '../util/editing';\nimport _ from 'lodash';\n\nexport function useTableEditing<TType = unknown>(\n isEnabled = false,\n handleSave: Table3EditingSaveHandler<TType> | undefined,\n handleChange: Table3EditingChangeHandler<TType> | undefined,\n handleCreate: Table3EditingCreateHandler<TType> | undefined,\n handleDiscard: Table3EditingDiscardHandler | undefined,\n rowIdentityAccessor: keyof TType | undefined,\n validator: Table3EditingValidatorFn<TType> | undefined\n) {\n // used to switch the table into editing mode\n const [isEditing, setEditing] = React.useState(false);\n\n // used to switch the editing between \"detailed\" mode\n const [isDetailedMode, toggleDetailedMode] = React.useState(false);\n\n // used to contain ref to the create button\n const createRowButtonRef = React.useRef<HTMLButtonElement>(null);\n\n // store the last focused cell, so that up/down arrow key navigation remains in the same column\n const [lastFocusedCellIndex, setLastFocusedCellIndex] = React.useState<number | undefined>(undefined);\n\n const pendingChangesFns = usePendingChangesState<TType>(\n handleSave,\n handleChange,\n handleDiscard,\n rowIdentityAccessor as keyof TType,\n validator\n );\n\n function toggleEditing<T extends TType>(\n enabled: React.SetStateAction<boolean>,\n table: ReactTable<T>,\n scrollToIndex: (index: number) => void\n ) {\n const tableMeta = table.options.meta as ReactTableMeta<TType>;\n\n if (enabled) {\n const index = tableMeta.rowActive.rowActiveIndex ?? 0;\n\n if (tableMeta.rowActive.rowActiveIndex === undefined) {\n tableMeta.rowActive.setRowActiveIndex(index);\n }\n\n if (!isTemporaryRow(table.getRowModel().rows[index]?.id)) {\n scrollToIndex(index);\n }\n } else if (!enabled) {\n // reset detailed mode\n toggleDetailedMode(false);\n // reset the last index back to the first focusable element, when editing gets turned off\n setLastFocusedCellIndex(undefined);\n }\n\n setEditing(enabled);\n pendingChangesFns.saveChanges(table);\n }\n\n async function createRow<T extends TType>(table: ReactTable<T>, row?: Partial<T>) {\n if (!handleCreate) {\n return;\n }\n\n const tableMeta = table.options.meta as ReactTableMeta<TType>;\n\n if (tableMeta.rowActive.rowActiveIndex !== undefined) {\n const saved = await tableMeta.editing.saveChanges(table);\n\n if (!saved) {\n return;\n }\n }\n\n const changeset = row ?? handleCreate();\n\n try {\n if (changeset) {\n // set the active row to the new row before toggling editing on\n const temporaryRows = tableMeta.editing.temporaryRows as TType[];\n const nextRowIndex = temporaryRows.length ? tableMeta.length + 1 : tableMeta.length;\n\n const newRowId = pendingChangesFns.insertTemporaryRow(changeset, nextRowIndex);\n\n // prep the row\n table.setRowPinning(currentState => ({\n ...currentState,\n bottom: (currentState.bottom ?? [])?.concat(newRowId),\n }));\n\n // prep editing mode\n toggleDetailedMode(false);\n setLastFocusedCellIndex(undefined);\n\n // wait until set states have run\n requestAnimationFrame(() => {\n tableMeta.rowActive.setRowActiveIndex(nextRowIndex);\n table.resetRowSelection();\n\n if (!tableMeta.editing.isEditing) {\n setEditing(true);\n }\n });\n }\n } catch (error) {\n console.error(error);\n }\n }\n\n return {\n isEnabled,\n isEditing,\n isDetailedMode,\n toggleDetailedMode: isEnabled ? toggleDetailedMode : () => undefined,\n toggleEditing: isEnabled ? toggleEditing : () => undefined,\n lastFocusedCellIndex,\n setLastFocusedCellIndex,\n createRow,\n createRowButtonRef,\n ...pendingChangesFns,\n };\n}\n"],"names":["useTableEditing","isEnabled","handleSave","handleChange","handleCreate","handleDiscard","rowIdentityAccessor","validator","createRow","table","row","changeset","temporaryRows","tableMeta","editing","nextRowIndex","length","newRowId","pendingChangesFns","insertTemporaryRow","setRowPinning","currentState","_ref","_currentState$bottom","bottom","concat","toggleDetailedMode","setLastFocusedCellIndex","undefined","requestAnimationFrame","rowActive","setRowActiveIndex","resetRowSelection","isEditing","setEditing","error","console","Promise","resolve","options","meta","_temp","rowActiveIndex","saveChanges","then","saved","_exit","_temp2","e","reject","React","useState","isDetailedMode","createRowButtonRef","useRef","lastFocusedCellIndex","usePendingChangesState","toggleEditing","enabled","scrollToIndex","_tableMeta$rowActive$","_table$getRowModel$ro","index","isTemporaryRow","getRowModel","rows","id"],"mappings":"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"}
|
@@ -1,7 +1,7 @@
|
|
1
|
-
import { useState, useCallback, useEffect, createElement, useContext, createContext } from 'react';
|
1
|
+
import { useState, useCallback, useEffect, createElement, useContext, createContext, useLayoutEffect } from 'react';
|
2
2
|
import { v4 } from 'uuid';
|
3
3
|
import { AnimatePresence, motion } from 'framer-motion';
|
4
|
-
import
|
4
|
+
import ReactDOM from 'react-dom';
|
5
5
|
import { Toast } from './Toast.js';
|
6
6
|
|
7
7
|
const DEFAULT_AUTO_CLOSE_TIMEOUT = 7500;
|
@@ -21,6 +21,20 @@ const insertToastWithoutDuplicates = (currentToasts, id, content, options, close
|
|
21
21
|
}
|
22
22
|
return nextToasts;
|
23
23
|
};
|
24
|
+
const Portal = props => {
|
25
|
+
var _globalThis$document;
|
26
|
+
const {
|
27
|
+
children,
|
28
|
+
container: containerProp,
|
29
|
+
...portalProps
|
30
|
+
} = props;
|
31
|
+
const [mounted, setMounted] = useState(false);
|
32
|
+
useLayoutEffect(() => setMounted(true), []);
|
33
|
+
const container = containerProp || mounted && (globalThis === null || globalThis === void 0 ? void 0 : (_globalThis$document = globalThis.document) === null || _globalThis$document === void 0 ? void 0 : _globalThis$document.body);
|
34
|
+
return container ? /*#__PURE__*/ReactDOM.createPortal(/*#__PURE__*/createElement("div", Object.assign({}, portalProps, {
|
35
|
+
"data-taco": "portal"
|
36
|
+
}), children), container) : null;
|
37
|
+
};
|
24
38
|
const ToastProvider = ({
|
25
39
|
children,
|
26
40
|
...props
|
@@ -1 +1 @@
|
|
1
|
-
{"version":3,"file":"Toaster.js","sources":["../../../../../../../src/components/Toast/Toaster.tsx"],"sourcesContent":["import * as React from 'react';\nimport { v4 as uuid } from 'uuid';\nimport { AnimatePresence, motion } from 'framer-motion';\nimport { Portal } from '@radix-ui/react-portal';\n\nimport { ToastOptions, Toast, ToastProps, ToastContent } from './Toast';\nimport './Toast.css';\n\nconst DEFAULT_AUTO_CLOSE_TIMEOUT = 7500;\n\ntype ToastCreator<T> = (content: ToastContent | ((close: () => void) => ToastContent), options?: ToastOptions) => T;\n\nexport interface Toaster<T> extends ToastCreator<T> {\n success: ToastCreator<T>;\n error: ToastCreator<T>;\n warning: ToastCreator<T>;\n information: ToastCreator<T>;\n loading: ToastCreator<T>;\n}\n\nexport interface ToastReference {\n /** Show a success toast */\n success: ToastCreator<void>;\n /** Show an error toast */\n error: ToastCreator<void>;\n /** Show a warning toast */\n warning: ToastCreator<void>;\n /** Show an information toast */\n information: ToastCreator<void>;\n /** Show a loading toast */\n loading: ToastCreator<void>;\n /**\n * Close an existing toast.\n * The toast function returns a reference to the active toast,\n * allowing you to programmatically close it when needed\n */\n close: () => void;\n}\n\nconst ToastContext = React.createContext<Toaster<ToastReference>>({} as Toaster<ToastReference>);\n\nexport interface ToastProviderProps {\n children: React.ReactNode;\n}\n\ntype InternalToast = Omit<ToastProps, 'onClose'>;\n\nconst insertToastWithoutDuplicates = (\n currentToasts: InternalToast[],\n id: string,\n content: ToastContent,\n options: ToastOptions,\n close: () => void\n): InternalToast[] => {\n const nextToasts = [...currentToasts];\n const existingToastIndex = currentToasts.findIndex(toast => JSON.stringify(toast.content) === JSON.stringify(content));\n\n if (existingToastIndex > -1) {\n nextToasts[existingToastIndex].lastDuplicateId = id;\n nextToasts[existingToastIndex].lastUpdated = Date.now();\n } else {\n nextToasts.push({\n id,\n content: typeof content === 'function' ? content(close) : content,\n options,\n });\n }\n\n return nextToasts;\n};\n\nexport const ToastProvider = ({ children, ...props }: ToastProviderProps): JSX.Element => {\n const [toasts, setToasts] = React.useState<InternalToast[]>([]);\n\n const handleClose = (id: string): void => {\n setToasts(currentToasts => currentToasts.filter(toast => toast.id !== id));\n };\n\n // memoize (useCallback) this function,\n // it is the value of the context provider and we don't want it to trigger state tree re-renders on provider children\n const toaster = React.useCallback((content: ToastContent, options: ToastOptions): ToastReference => {\n const id = uuid();\n const close = (): void => handleClose(id);\n\n setToasts(currentToasts => insertToastWithoutDuplicates(currentToasts, id, content, options, close));\n\n const update = (content: ToastContent, options: ToastOptions): void => {\n setToasts(currentToasts => {\n const nextToasts = currentToasts.filter(toast => {\n if (toast.lastDuplicateId) {\n return toast.lastDuplicateId !== id;\n }\n\n return toast.id !== id;\n });\n return insertToastWithoutDuplicates(nextToasts, uuid(), content, options, close);\n });\n };\n\n const success = (content: ToastContent, options?: Omit<ToastOptions, 'type'>): void => {\n update(content, { autoClose: DEFAULT_AUTO_CLOSE_TIMEOUT, ...options, type: 'success' });\n };\n const error = (content: ToastContent, options?: Omit<ToastOptions, 'type'>): void => {\n update(content, { ...options, type: 'error' });\n };\n const warning = (content: ToastContent, options?: Omit<ToastOptions, 'type'>): void => {\n update(content, { ...options, type: 'warning' });\n };\n const information = (content: ToastContent, options?: Omit<ToastOptions, 'type'>): void => {\n update(content, { ...options, type: 'information' });\n };\n const loading = (content: ToastContent, options?: Omit<ToastOptions, 'type'>): void => {\n update(content, { ...options, type: 'loading' });\n };\n\n return {\n success,\n error,\n warning,\n information,\n loading,\n close,\n };\n }, []) as Toaster<ToastReference>;\n\n // no need to rebind these every render, do them once in an effect\n React.useEffect(() => {\n toaster.success = (content: ToastContent, options?: Omit<ToastOptions, 'type'>): ToastReference =>\n toaster(content, { autoClose: DEFAULT_AUTO_CLOSE_TIMEOUT, ...options, type: 'success' });\n toaster.error = (content: ToastContent, options?: Omit<ToastOptions, 'type'>): ToastReference =>\n toaster(content, { ...options, type: 'error' });\n toaster.warning = (content: ToastContent, options?: Omit<ToastOptions, 'type'>): ToastReference =>\n toaster(content, { ...options, type: 'warning' });\n toaster.information = (content: ToastContent, options?: Omit<ToastOptions, 'type'>): ToastReference =>\n toaster(content, { ...options, type: 'information' });\n toaster.loading = (content: ToastContent, options?: Omit<ToastOptions, 'type'>): ToastReference =>\n toaster(content, { ...options, type: 'loading' });\n }, []);\n\n return (\n <ToastContext.Provider {...props} value={toaster}>\n {children}\n <Portal>\n <div\n id=\"yt-toast__container\"\n className=\"pointer-events-all absolute !left-auto bottom-0 right-0 z-[1000] mb-4 mr-4 flex max-w-md flex-col items-end justify-end\"\n role=\"log\">\n <AnimatePresence initial={false}>\n {toasts.map((toast: InternalToast) => (\n <motion.div\n key={toast.id}\n transition={{\n type: 'spring',\n damping: 20,\n stiffness: 300,\n }}\n initial={{ opacity: 0, y: 10, scale: 0.5 }}\n animate={{ opacity: 1, y: 0, scale: 1 }}\n exit={{ opacity: 0, scale: 0.5, transition: { duration: 0.2 } }}>\n <Toast {...toast} onClose={() => handleClose(toast.id)} />\n </motion.div>\n ))}\n </AnimatePresence>\n </div>\n </Portal>\n </ToastContext.Provider>\n );\n};\n\nexport const useToast = (): Toaster<ToastReference> => React.useContext(ToastContext);\n"],"names":["DEFAULT_AUTO_CLOSE_TIMEOUT","ToastContext","React","insertToastWithoutDuplicates","currentToasts","id","content","options","close","nextToasts","existingToastIndex","findIndex","toast","JSON","stringify","lastDuplicateId","lastUpdated","Date","now","push","ToastProvider","children","props","toasts","setToasts","handleClose","filter","toaster","uuid","update","success","autoClose","type","error","warning","information","loading","Provider","value","Portal","className","role","AnimatePresence","initial","map","motion","div","key","transition","damping","stiffness","opacity","y","scale","animate","exit","duration","Toast","onClose","useToast"],"mappings":"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"}
|
1
|
+
{"version":3,"file":"Toaster.js","sources":["../../../../../../../src/components/Toast/Toaster.tsx"],"sourcesContent":["import * as React from 'react';\nimport ReactDOM from 'react-dom';\nimport { v4 as uuid } from 'uuid';\nimport { AnimatePresence, motion } from 'framer-motion';\n\nimport { ToastOptions, Toast, ToastProps, ToastContent } from './Toast';\nimport './Toast.css';\n\nconst DEFAULT_AUTO_CLOSE_TIMEOUT = 7500;\n\ntype ToastCreator<T> = (content: ToastContent | ((close: () => void) => ToastContent), options?: ToastOptions) => T;\n\nexport interface Toaster<T> extends ToastCreator<T> {\n success: ToastCreator<T>;\n error: ToastCreator<T>;\n warning: ToastCreator<T>;\n information: ToastCreator<T>;\n loading: ToastCreator<T>;\n}\n\nexport interface ToastReference {\n /** Show a success toast */\n success: ToastCreator<void>;\n /** Show an error toast */\n error: ToastCreator<void>;\n /** Show a warning toast */\n warning: ToastCreator<void>;\n /** Show an information toast */\n information: ToastCreator<void>;\n /** Show a loading toast */\n loading: ToastCreator<void>;\n /**\n * Close an existing toast.\n * The toast function returns a reference to the active toast,\n * allowing you to programmatically close it when needed\n */\n close: () => void;\n}\n\nconst ToastContext = React.createContext<Toaster<ToastReference>>({} as Toaster<ToastReference>);\n\nexport interface ToastProviderProps {\n children: React.ReactNode;\n}\n\ntype InternalToast = Omit<ToastProps, 'onClose'>;\n\nconst insertToastWithoutDuplicates = (\n currentToasts: InternalToast[],\n id: string,\n content: ToastContent,\n options: ToastOptions,\n close: () => void\n): InternalToast[] => {\n const nextToasts = [...currentToasts];\n const existingToastIndex = currentToasts.findIndex(toast => JSON.stringify(toast.content) === JSON.stringify(content));\n\n if (existingToastIndex > -1) {\n nextToasts[existingToastIndex].lastDuplicateId = id;\n nextToasts[existingToastIndex].lastUpdated = Date.now();\n } else {\n nextToasts.push({\n id,\n content: typeof content === 'function' ? content(close) : content,\n options,\n });\n }\n\n return nextToasts;\n};\n\ntype PortalProps = React.ComponentPropsWithRef<'div'> & {\n container?: Element | DocumentFragment | null;\n};\n\nconst Portal = (props: PortalProps) => {\n const { children, container: containerProp, ...portalProps } = props;\n\n const [mounted, setMounted] = React.useState(false);\n React.useLayoutEffect(() => setMounted(true), []);\n const container = containerProp || (mounted && globalThis?.document?.body);\n\n return container\n ? ReactDOM.createPortal(\n <div {...portalProps} data-taco=\"portal\">\n {children}\n </div>,\n container\n )\n : null;\n};\n\nexport const ToastProvider = ({ children, ...props }: ToastProviderProps): JSX.Element => {\n const [toasts, setToasts] = React.useState<InternalToast[]>([]);\n\n const handleClose = (id: string): void => {\n setToasts(currentToasts => currentToasts.filter(toast => toast.id !== id));\n };\n\n // memoize (useCallback) this function,\n // it is the value of the context provider and we don't want it to trigger state tree re-renders on provider children\n const toaster = React.useCallback((content: ToastContent, options: ToastOptions): ToastReference => {\n const id = uuid();\n const close = (): void => handleClose(id);\n\n setToasts(currentToasts => insertToastWithoutDuplicates(currentToasts, id, content, options, close));\n\n const update = (content: ToastContent, options: ToastOptions): void => {\n setToasts(currentToasts => {\n const nextToasts = currentToasts.filter(toast => {\n if (toast.lastDuplicateId) {\n return toast.lastDuplicateId !== id;\n }\n\n return toast.id !== id;\n });\n return insertToastWithoutDuplicates(nextToasts, uuid(), content, options, close);\n });\n };\n\n const success = (content: ToastContent, options?: Omit<ToastOptions, 'type'>): void => {\n update(content, { autoClose: DEFAULT_AUTO_CLOSE_TIMEOUT, ...options, type: 'success' });\n };\n const error = (content: ToastContent, options?: Omit<ToastOptions, 'type'>): void => {\n update(content, { ...options, type: 'error' });\n };\n const warning = (content: ToastContent, options?: Omit<ToastOptions, 'type'>): void => {\n update(content, { ...options, type: 'warning' });\n };\n const information = (content: ToastContent, options?: Omit<ToastOptions, 'type'>): void => {\n update(content, { ...options, type: 'information' });\n };\n const loading = (content: ToastContent, options?: Omit<ToastOptions, 'type'>): void => {\n update(content, { ...options, type: 'loading' });\n };\n\n return {\n success,\n error,\n warning,\n information,\n loading,\n close,\n };\n }, []) as Toaster<ToastReference>;\n\n // no need to rebind these every render, do them once in an effect\n React.useEffect(() => {\n toaster.success = (content: ToastContent, options?: Omit<ToastOptions, 'type'>): ToastReference =>\n toaster(content, { autoClose: DEFAULT_AUTO_CLOSE_TIMEOUT, ...options, type: 'success' });\n toaster.error = (content: ToastContent, options?: Omit<ToastOptions, 'type'>): ToastReference =>\n toaster(content, { ...options, type: 'error' });\n toaster.warning = (content: ToastContent, options?: Omit<ToastOptions, 'type'>): ToastReference =>\n toaster(content, { ...options, type: 'warning' });\n toaster.information = (content: ToastContent, options?: Omit<ToastOptions, 'type'>): ToastReference =>\n toaster(content, { ...options, type: 'information' });\n toaster.loading = (content: ToastContent, options?: Omit<ToastOptions, 'type'>): ToastReference =>\n toaster(content, { ...options, type: 'loading' });\n }, []);\n\n return (\n <ToastContext.Provider {...props} value={toaster}>\n {children}\n <Portal>\n <div\n id=\"yt-toast__container\"\n className=\"pointer-events-all absolute !left-auto bottom-0 right-0 z-[1000] mb-4 mr-4 flex max-w-md flex-col items-end justify-end\"\n role=\"log\">\n <AnimatePresence initial={false}>\n {toasts.map((toast: InternalToast) => (\n <motion.div\n key={toast.id}\n transition={{\n type: 'spring',\n damping: 20,\n stiffness: 300,\n }}\n initial={{ opacity: 0, y: 10, scale: 0.5 }}\n animate={{ opacity: 1, y: 0, scale: 1 }}\n exit={{ opacity: 0, scale: 0.5, transition: { duration: 0.2 } }}>\n <Toast {...toast} onClose={() => handleClose(toast.id)} />\n </motion.div>\n ))}\n </AnimatePresence>\n </div>\n </Portal>\n </ToastContext.Provider>\n );\n};\n\nexport const useToast = (): Toaster<ToastReference> => React.useContext(ToastContext);\n"],"names":["DEFAULT_AUTO_CLOSE_TIMEOUT","ToastContext","React","insertToastWithoutDuplicates","currentToasts","id","content","options","close","nextToasts","existingToastIndex","findIndex","toast","JSON","stringify","lastDuplicateId","lastUpdated","Date","now","push","Portal","props","children","container","containerProp","portalProps","mounted","setMounted","globalThis","_globalThis$document","document","body","ReactDOM","createPortal","ToastProvider","toasts","setToasts","handleClose","filter","toaster","uuid","update","success","autoClose","type","error","warning","information","loading","Provider","value","className","role","AnimatePresence","initial","map","motion","div","key","transition","damping","stiffness","opacity","y","scale","animate","exit","duration","Toast","onClose","useToast"],"mappings":"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"}
|
@@ -1,31 +1,42 @@
|
|
1
1
|
import React__default from 'react';
|
2
2
|
import { flexRender } from '@tanstack/react-table';
|
3
|
+
import { isInternalColumn } from '../../../useTableManager/util/columns.js';
|
3
4
|
import { Summary } from './Summary.js';
|
4
5
|
|
5
6
|
function Foot(props) {
|
7
|
+
var _nonGroupedHeaders$fi;
|
6
8
|
const {
|
7
9
|
children,
|
8
10
|
table,
|
9
11
|
...attributes
|
10
12
|
} = props;
|
13
|
+
const tableMeta = table.options.meta;
|
11
14
|
const nonGroupedHeaders = table.getFooterGroups()[0].headers.filter(header => !header.column.getIsGrouped());
|
15
|
+
const firstVisibleExternalColumnIndex = (_nonGroupedHeaders$fi = nonGroupedHeaders.find(header => {
|
16
|
+
var _header$column$column;
|
17
|
+
return !isInternalColumn(header.id) && ((_header$column$column = header.column.columnDef.meta) === null || _header$column$column === void 0 ? void 0 : _header$column$column.enablePrinting) !== false;
|
18
|
+
})) === null || _nonGroupedHeaders$fi === void 0 ? void 0 : _nonGroupedHeaders$fi.index;
|
19
|
+
// During printing, the summary should be displayed in the first visible external column,
|
20
|
+
// as internal and hidden columns are excluded from the printed document.
|
21
|
+
// However, in the normal table view, the summary should appear in the first column.
|
22
|
+
const summaryColumnIndex = tableMeta.printing.isPrinting ? firstVisibleExternalColumnIndex : 0;
|
12
23
|
return /*#__PURE__*/React__default.createElement("tfoot", Object.assign({}, attributes), children, /*#__PURE__*/React__default.createElement("tr", null, nonGroupedHeaders.map((header, index) => (/*#__PURE__*/React__default.createElement(Footer, {
|
13
24
|
key: header.id,
|
14
25
|
header: header,
|
15
|
-
|
26
|
+
showSummary: index === summaryColumnIndex
|
16
27
|
})))));
|
17
28
|
}
|
18
29
|
function Footer(props) {
|
19
30
|
return /*#__PURE__*/React__default.createElement(MemoedFooter, {
|
20
31
|
footer: props.header,
|
21
|
-
|
32
|
+
showSummary: props.showSummary
|
22
33
|
});
|
23
34
|
}
|
24
35
|
const MemoedFooter = /*#__PURE__*/React__default.memo(function MemoedFooter(props) {
|
25
36
|
var _footer$subHeaders, _footer$subHeaders$fi;
|
26
37
|
const {
|
27
38
|
footer,
|
28
|
-
|
39
|
+
showSummary
|
29
40
|
} = props;
|
30
41
|
const columnMeta = footer.column.columnDef.meta;
|
31
42
|
// getIsPinned returns true for split header groups, even if the split group has no pinned sub headers
|
@@ -38,7 +49,8 @@ const MemoedFooter = /*#__PURE__*/React__default.memo(function MemoedFooter(prop
|
|
38
49
|
}
|
39
50
|
let content;
|
40
51
|
let align;
|
41
|
-
|
52
|
+
// Summary should only be appended to the first visible external column, as internal columns like the select column will be hidden in the print view.
|
53
|
+
if (showSummary) {
|
42
54
|
align = 'left';
|
43
55
|
content = /*#__PURE__*/React__default.createElement(Summary, {
|
44
56
|
table: footer.getContext().table
|
@@ -1 +1 @@
|
|
1
|
-
{"version":3,"file":"Footer.js","sources":["../../../../../../../../../../src/primitives/Table/Core/components/Footer/Footer.tsx"],"sourcesContent":["import React from 'react';\nimport {\n Header as ReactTableHeader,\n ColumnMeta as ReactTableColumnMeta,\n flexRender,\n Table as ReactTable,\n} from '@tanstack/react-table';\nimport { Summary } from './Summary';\n\nexport type FootProps<TType = unknown> = React.HTMLAttributes<HTMLTableSectionElement> & {\n table: ReactTable<TType>;\n};\nexport function Foot<TType = unknown>(props: FootProps<TType>) {\n const { children, table, ...attributes } = props;\n const nonGroupedHeaders = table.getFooterGroups()[0].headers.filter(header => !header.column.getIsGrouped());\n return (\n <tfoot {...attributes}>\n {children}\n <tr>\n {nonGroupedHeaders.map((header, index) => (\n <Footer key={header.id} header={header}
|
1
|
+
{"version":3,"file":"Footer.js","sources":["../../../../../../../../../../src/primitives/Table/Core/components/Footer/Footer.tsx"],"sourcesContent":["import React from 'react';\nimport {\n Header as ReactTableHeader,\n ColumnMeta as ReactTableColumnMeta,\n flexRender,\n Table as ReactTable,\n TableMeta as ReactTableMeta,\n} from '@tanstack/react-table';\n\nimport { Summary } from './Summary';\nimport { isInternalColumn } from '../../../useTableManager/util/columns';\n\nexport type FootProps<TType = unknown> = React.HTMLAttributes<HTMLTableSectionElement> & {\n table: ReactTable<TType>;\n};\nexport function Foot<TType = unknown>(props: FootProps<TType>) {\n const { children, table, ...attributes } = props;\n const tableMeta = table.options.meta as ReactTableMeta<TType>;\n const nonGroupedHeaders = table.getFooterGroups()[0].headers.filter(header => !header.column.getIsGrouped());\n const firstVisibleExternalColumnIndex = nonGroupedHeaders.find(\n header => !isInternalColumn(header.id) && header.column.columnDef.meta?.enablePrinting !== false\n )?.index;\n\n // During printing, the summary should be displayed in the first visible external column,\n // as internal and hidden columns are excluded from the printed document.\n // However, in the normal table view, the summary should appear in the first column.\n const summaryColumnIndex = tableMeta.printing.isPrinting ? firstVisibleExternalColumnIndex : 0;\n\n return (\n <tfoot {...attributes}>\n {children}\n <tr>\n {nonGroupedHeaders.map((header, index) => (\n <Footer key={header.id} header={header} showSummary={index === summaryColumnIndex} />\n ))}\n </tr>\n </tfoot>\n );\n}\n\nexport type FooterProps<TType = unknown> = {\n header: ReactTableHeader<TType, unknown>;\n showSummary: boolean;\n};\nexport function Footer<TType = unknown>(props: FooterProps<TType>) {\n return <MemoedFooter footer={props.header} showSummary={props.showSummary} />;\n}\n\nexport type MemoedFooterProps<TType = unknown> = {\n footer: ReactTableHeader<TType, unknown>;\n showSummary: boolean;\n};\n\nconst MemoedFooter = React.memo(function MemoedFooter<TType = unknown>(props: MemoedFooterProps<TType>) {\n const { footer, showSummary } = props;\n const columnMeta = footer.column.columnDef.meta as ReactTableColumnMeta<TType, unknown>;\n\n // getIsPinned returns true for split header groups, even if the split group has no pinned sub headers\n const isHeaderGroup = !!footer.subHeaders?.length;\n const isPinned = isHeaderGroup\n ? footer.subHeaders.find(x => x.column.getIsPinned())?.column.getIsPinned()\n : footer.column.getIsPinned();\n\n const style: React.CSSProperties = {};\n\n if (isPinned) {\n // pinned columns should be offset from either the left or right\n style[isPinned] = `${footer.column.getStart(isPinned)}px`;\n }\n\n let content;\n let align;\n\n // Summary should only be appended to the first visible external column, as internal columns like the select column will be hidden in the print view.\n if (showSummary) {\n align = 'left';\n content = <Summary table={footer.getContext().table} />;\n } else {\n align = columnMeta.align;\n content = footer.isPlaceholder ? null : flexRender(footer.column.columnDef.footer, footer.getContext());\n }\n\n return (\n <td\n key={footer.id}\n data-cell-align={align}\n data-cell-id={footer.id}\n data-cell-pinned={isPinned ? isPinned : undefined}\n style={style}>\n {content}\n </td>\n );\n}) as <TType = unknown>(props: MemoedFooterProps<TType>) => JSX.Element;\n"],"names":["Foot","props","children","table","attributes","tableMeta","options","meta","nonGroupedHeaders","getFooterGroups","headers","filter","header","column","getIsGrouped","firstVisibleExternalColumnIndex","_nonGroupedHeaders$fi","find","_header$column$column","isInternalColumn","id","columnDef","enablePrinting","index","summaryColumnIndex","printing","isPrinting","React","map","Footer","key","showSummary","MemoedFooter","footer","memo","columnMeta","isHeaderGroup","_footer$subHeaders","subHeaders","length","isPinned","_footer$subHeaders$fi","x","getIsPinned","style","getStart","content","align","Summary","getContext","isPlaceholder","flexRender","undefined"],"mappings":"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"}
|
@@ -9,6 +9,21 @@ import { Resizer } from './components/Resizer.js';
|
|
9
9
|
import { HeaderMenu } from './components/Menu.js';
|
10
10
|
import { getIsPinned, useSetInitialColumnSizing } from './util.js';
|
11
11
|
|
12
|
+
const HeaderContent = ({
|
13
|
+
children,
|
14
|
+
tooltip,
|
15
|
+
isInternalColumnHeader
|
16
|
+
}) => {
|
17
|
+
if (isInternalColumnHeader || typeof children !== 'string') {
|
18
|
+
return /*#__PURE__*/React__default.createElement(React__default.Fragment, null, children);
|
19
|
+
}
|
20
|
+
return /*#__PURE__*/React__default.createElement(Tooltip, {
|
21
|
+
title: String(tooltip !== null && tooltip !== void 0 ? tooltip : children),
|
22
|
+
placement: "top"
|
23
|
+
}, /*#__PURE__*/React__default.createElement("span", {
|
24
|
+
className: "truncate"
|
25
|
+
}, children));
|
26
|
+
};
|
12
27
|
function Header(props) {
|
13
28
|
var _header$column$column;
|
14
29
|
const {
|
@@ -178,12 +193,11 @@ const MemoedHeader = /*#__PURE__*/React__default.memo(function MemoedHeader(prop
|
|
178
193
|
"data-cell-pinned": isPinned ? isPinned : undefined,
|
179
194
|
style: style,
|
180
195
|
ref: setRef
|
181
|
-
}), isPlaceholder ?
|
182
|
-
|
183
|
-
|
184
|
-
|
185
|
-
|
186
|
-
}, children))), sortDirection ? /*#__PURE__*/React__default.createElement(SortIndicator, {
|
196
|
+
}), !isPlaceholder ? (/*#__PURE__*/React__default.createElement(HeaderContent, {
|
197
|
+
children: children,
|
198
|
+
tooltip: tooltip,
|
199
|
+
isInternalColumnHeader: !!isInternalColumn(id)
|
200
|
+
})) : null, sortDirection ? /*#__PURE__*/React__default.createElement(SortIndicator, {
|
187
201
|
direction: sortDirection
|
188
202
|
}) : null, hasMenu ? (/*#__PURE__*/React__default.createElement(HeaderMenu, {
|
189
203
|
canFilter: canFilter,
|
@@ -1 +1 @@
|
|
1
|
-
{"version":3,"file":"Header.js","sources":["../../../../../../../../../../src/primitives/Table/Core/components/Header/Header.tsx"],"sourcesContent":["import React from 'react';\nimport {\n TableMeta as ReactTableMeta,\n ColumnMeta as ReactTableColumnMeta,\n Header as ReactTableHeader,\n ColumnPinningPosition as ReactTableColumnPinningPosition,\n flexRender,\n} from '@tanstack/react-table';\nimport cn from 'clsx';\nimport { freezeUptoExternalColumn, isInternalColumn, unfreezeAllExternalColumns } from '../../../useTableManager/util/columns';\nimport { Tooltip } from '../../../../../components/Tooltip/Tooltip';\nimport { SortIndicator, getSortAttributes } from './components/SortIndicator';\nimport {\n TableColumnAlignment,\n TableColumnMenu,\n TableColumnSortDirection,\n TableColumnWidth,\n TableFilterComparator,\n} from '../../../types';\nimport { Resizer } from './components/Resizer';\nimport { HeaderMenu } from './components/Menu';\nimport { getIsPinned, useSetInitialColumnSizing } from './util';\n\nexport type HeaderProps<TType = unknown> = {\n header: ReactTableHeader<TType, unknown>;\n scrollToIndex: (index: number) => void;\n};\n\nexport function Header<TType = unknown>(props: HeaderProps<TType>) {\n const { header, scrollToIndex } = props;\n\n if (header.column.getIsGrouped()) {\n return null;\n }\n\n const { table } = header.getContext();\n\n const tableMeta = table.options.meta as ReactTableMeta<TType>;\n const columnMeta = (header.column.columnDef.meta ?? {}) as ReactTableColumnMeta<TType, unknown>;\n\n const isGroup = !!header.subHeaders.length;\n const isPinned = getIsPinned(header);\n\n const canFilter = !header.isPlaceholder && header.column.getCanFilter() && !!table.options.enableColumnFilters;\n const canHide = !header.isPlaceholder && !isGroup && header.column.getCanHide();\n const canMeasureSize = !!table.getRowModel().rows.length;\n const canPin = !header.isPlaceholder && !isGroup && header.column.getCanPin();\n const canResize = !header.isPlaceholder && !isGroup && header.column.getCanResize();\n const canSort = !header.isPlaceholder && !isGroup && header.column.getCanSort();\n const canGoto = canSort && !header.isPlaceholder && !isGroup && tableMeta.rowGoto.isEnabled && !!header.column.getIsSorted();\n\n const hasMenu = !isInternalColumn(header.id) && (canHide || canGoto || canPin || canSort || !!columnMeta.menu);\n\n const sorting = table.getState().sorting;\n const filters = table.getState().columnFilters;\n const search = table.getState().globalFilter;\n\n // passing header or column results in re-renders on scroll, so anything from those objects as memoed props\n const memoedProps: MemoedHeaderProps = {\n align: columnMeta.align,\n canFilter,\n canHide,\n canGoto,\n canMeasureSize,\n canPin,\n canResize,\n canSort,\n className: cn('group/header', columnMeta.headerClassName),\n children: flexRender(header.column.columnDef.header, header.getContext()),\n colSpan: header.colSpan,\n customMenu: columnMeta.menu,\n defaultWidth: columnMeta.defaultWidth,\n hasMenu,\n id: header.id,\n isFiltered: header.column.getIsFiltered(),\n index: header.index,\n isGroup,\n isPinned,\n isPlaceholder: header.isPlaceholder,\n offset: header.column.getStart(isPinned),\n scrollToIndex,\n setRowActiveIndex: tableMeta.rowActive.setRowActiveIndex,\n setColumnSizing: table.setColumnSizing,\n tooltip: columnMeta.tooltip,\n width: table.getState().columnSizing[header.id],\n };\n\n if (header.isPlaceholder) {\n const nextHeader = header.headerGroup.headers[header.index + 1];\n memoedProps.className = cn('!bg-white before:!content-none', memoedProps.className, {\n 'after:!content-none': nextHeader?.isPlaceholder,\n });\n }\n\n if (canFilter) {\n memoedProps.onFilter = () => {\n header.column.setFilterValue({ comparator: TableFilterComparator.Contains });\n };\n }\n\n if (canGoto) {\n memoedProps.onGoto = ((query: string) => tableMeta.rowGoto.handleGoto?.(header.id, query, sorting, filters, search)) as (\n query: string\n ) => Promise<number>;\n }\n\n if (canHide) {\n memoedProps.onHide = header.column.getToggleVisibilityHandler();\n }\n\n if (canPin) {\n memoedProps.onPin = (index: number | undefined) => {\n // TODO: this can probably be moved to a feature hook\n table.setColumnPinning(pinningState => {\n return {\n ...pinningState,\n left:\n index === undefined\n ? unfreezeAllExternalColumns(pinningState.left)\n : freezeUptoExternalColumn(\n index,\n table.getAllLeafColumns().map(column => column.id)\n ),\n };\n });\n };\n }\n\n if (canResize) {\n memoedProps.isResizing = header.column.getIsResizing();\n memoedProps.onResize = header.getResizeHandler();\n memoedProps.resetSize = header.column.resetSize;\n }\n\n if (canSort) {\n const handleSortToggle = (sortDirection: TableColumnSortDirection | false) => {\n if (sortDirection === false) {\n header.column.clearSorting();\n } else {\n header.column.toggleSorting(sortDirection === 'desc');\n }\n };\n\n memoedProps.onSort = header.column.getToggleSortingHandler();\n memoedProps.onSortToggle = handleSortToggle;\n memoedProps.sortDirection = header.column.getIsSorted();\n }\n\n return <MemoedHeader key={header.id} {...memoedProps} />;\n}\n\nexport type MemoedHeaderProps = {\n align?: TableColumnAlignment;\n canFilter: boolean;\n canHide: boolean;\n canGoto: boolean;\n canMeasureSize: boolean;\n canPin: boolean;\n canResize: boolean;\n canSort: boolean;\n children: JSX.Element | React.ReactNode;\n className?: string;\n colSpan: number;\n customMenu?: TableColumnMenu;\n defaultWidth?: TableColumnWidth;\n hasMenu: boolean;\n id: string;\n index: number;\n isFiltered: boolean;\n isGroup: boolean;\n isPinned?: ReactTableColumnPinningPosition;\n isPlaceholder: boolean;\n isResizing?: boolean;\n offset?: number;\n onFilter?: () => void;\n onGoto?: (query: string) => Promise<number>;\n onHide?: (event: unknown) => void;\n onPin?: (index: number | undefined) => void;\n onResize?: (event: unknown) => void;\n onSort?: (event: unknown) => void;\n onSortToggle?: (sortDirection: TableColumnSortDirection | false) => void;\n resetSize?: () => void;\n scrollToIndex: (index: number) => void;\n setRowActiveIndex: (index: number) => void;\n setColumnSizing: any;\n sortDirection?: TableColumnSortDirection | false;\n tooltip?: string;\n width?: TableColumnWidth;\n};\n\nconst MemoedHeader = React.memo(function MemoedHeader(props: MemoedHeaderProps) {\n const {\n align,\n canFilter,\n canGoto,\n canHide,\n canMeasureSize,\n canPin,\n canResize,\n canSort,\n children,\n className,\n colSpan,\n customMenu,\n defaultWidth,\n hasMenu,\n id,\n index,\n isFiltered,\n isGroup,\n isPinned,\n isPlaceholder,\n isResizing,\n offset,\n onFilter: handleFilter,\n onGoto: handleGoto,\n onHide: handleHide,\n onPin: handlePin,\n onResize: handleResize,\n onSort: handleSort,\n onSortToggle: handleSortToggle,\n resetSize: handleResetSize,\n scrollToIndex,\n setRowActiveIndex,\n setColumnSizing,\n sortDirection,\n tooltip,\n width,\n } = props;\n const [ref, setRef] = React.useState<HTMLTableCellElement | null>(null);\n\n // save column width if none is set\n useSetInitialColumnSizing(id, defaultWidth, width, ref, canMeasureSize, setColumnSizing);\n\n // feature specific styles\n const style: React.CSSProperties = {};\n\n // column groups often span multiple columns\n if (colSpan > 1) {\n style.gridColumn = `span ${colSpan}`;\n }\n\n // pinned columns should be offset from either the left or right\n if (isPinned) {\n style[isPinned] = `${offset}px`;\n }\n\n return (\n <th\n {...(getSortAttributes(canSort, handleSort, sortDirection) as any)}\n className={className}\n data-cell-align={isGroup ? 'center' : align}\n data-cell-id={id}\n data-cell-pinned={isPinned ? isPinned : undefined}\n style={style}\n ref={setRef}>\n {isPlaceholder ? null : isInternalColumn(id) ? (\n children\n ) : (\n <Tooltip title={String(tooltip ?? children)} placement=\"top\">\n <span className=\"truncate\">{children}</span>\n </Tooltip>\n )}\n {sortDirection ? <SortIndicator direction={sortDirection} /> : null}\n {hasMenu ? (\n <HeaderMenu\n canFilter={canFilter}\n canGoto={canGoto}\n canHide={canHide}\n canPin={canPin}\n canSort={canSort}\n className={cn({\n 'ml-auto': align !== 'right',\n 'ml-0': align === 'right',\n })}\n customMenu={customMenu}\n index={index}\n isFiltered={isFiltered}\n onFilter={handleFilter}\n onGoto={handleGoto}\n onHide={handleHide}\n onPin={handlePin}\n onSortToggle={handleSortToggle}\n scrollToIndex={scrollToIndex}\n setRowActiveIndex={setRowActiveIndex}\n sortDirection={sortDirection}\n columnId={id}\n />\n ) : null}\n {canResize ? (\n <Resizer\n headerRef={ref}\n id={id}\n isResizing={isResizing as boolean}\n onResize={handleResize as (event: unknown) => void}\n onResetSize={handleResetSize as () => void}\n setColumnSizing={setColumnSizing}\n width={width}\n />\n ) : null}\n </th>\n );\n});\n"],"names":["Header","props","header","scrollToIndex","column","getIsGrouped","table","getContext","tableMeta","options","meta","columnMeta","_header$column$column","columnDef","isGroup","subHeaders","length","isPinned","getIsPinned","canFilter","isPlaceholder","getCanFilter","enableColumnFilters","canHide","getCanHide","canMeasureSize","getRowModel","rows","canPin","getCanPin","canResize","getCanResize","canSort","getCanSort","canGoto","rowGoto","isEnabled","getIsSorted","hasMenu","isInternalColumn","id","menu","sorting","getState","filters","columnFilters","search","globalFilter","memoedProps","align","className","cn","headerClassName","children","flexRender","colSpan","customMenu","defaultWidth","isFiltered","getIsFiltered","index","offset","getStart","setRowActiveIndex","rowActive","setColumnSizing","tooltip","width","columnSizing","nextHeader","headerGroup","headers","onFilter","setFilterValue","comparator","TableFilterComparator","Contains","onGoto","query","_tableMeta$rowGoto$ha","_tableMeta$rowGoto","handleGoto","call","onHide","getToggleVisibilityHandler","onPin","setColumnPinning","pinningState","left","undefined","unfreezeAllExternalColumns","freezeUptoExternalColumn","getAllLeafColumns","map","isResizing","getIsResizing","onResize","getResizeHandler","resetSize","handleSortToggle","sortDirection","clearSorting","toggleSorting","onSort","getToggleSortingHandler","onSortToggle","React","MemoedHeader","key","memo","handleFilter","handleHide","handlePin","handleResize","handleSort","handleResetSize","ref","setRef","useState","useSetInitialColumnSizing","style","gridColumn","getSortAttributes","Tooltip","title","String","placement","SortIndicator","direction","HeaderMenu","columnId","Resizer","headerRef","onResetSize"],"mappings":";;;;;;;;;;;SA4BgBA,MAAMA,CAAkBC,KAAyB;;EAC7D,MAAM;IAAEC,MAAM;IAAEC;GAAe,GAAGF,KAAK;EAEvC,IAAIC,MAAM,CAACE,MAAM,CAACC,YAAY,EAAE,EAAE;IAC9B,OAAO,IAAI;;EAGf,MAAM;IAAEC;GAAO,GAAGJ,MAAM,CAACK,UAAU,EAAE;EAErC,MAAMC,SAAS,GAAGF,KAAK,CAACG,OAAO,CAACC,IAA6B;EAC7D,MAAMC,UAAU,IAAAC,qBAAA,GAAIV,MAAM,CAACE,MAAM,CAACS,SAAS,CAACH,IAAI,cAAAE,qBAAA,cAAAA,qBAAA,GAAI,EAA2C;EAE/F,MAAME,OAAO,GAAG,CAAC,CAACZ,MAAM,CAACa,UAAU,CAACC,MAAM;EAC1C,MAAMC,QAAQ,GAAGC,WAAW,CAAChB,MAAM,CAAC;EAEpC,MAAMiB,SAAS,GAAG,CAACjB,MAAM,CAACkB,aAAa,IAAIlB,MAAM,CAACE,MAAM,CAACiB,YAAY,EAAE,IAAI,CAAC,CAACf,KAAK,CAACG,OAAO,CAACa,mBAAmB;EAC9G,MAAMC,OAAO,GAAG,CAACrB,MAAM,CAACkB,aAAa,IAAI,CAACN,OAAO,IAAIZ,MAAM,CAACE,MAAM,CAACoB,UAAU,EAAE;EAC/E,MAAMC,cAAc,GAAG,CAAC,CAACnB,KAAK,CAACoB,WAAW,EAAE,CAACC,IAAI,CAACX,MAAM;EACxD,MAAMY,MAAM,GAAG,CAAC1B,MAAM,CAACkB,aAAa,IAAI,CAACN,OAAO,IAAIZ,MAAM,CAACE,MAAM,CAACyB,SAAS,EAAE;EAC7E,MAAMC,SAAS,GAAG,CAAC5B,MAAM,CAACkB,aAAa,IAAI,CAACN,OAAO,IAAIZ,MAAM,CAACE,MAAM,CAAC2B,YAAY,EAAE;EACnF,MAAMC,OAAO,GAAG,CAAC9B,MAAM,CAACkB,aAAa,IAAI,CAACN,OAAO,IAAIZ,MAAM,CAACE,MAAM,CAAC6B,UAAU,EAAE;EAC/E,MAAMC,OAAO,GAAGF,OAAO,IAAI,CAAC9B,MAAM,CAACkB,aAAa,IAAI,CAACN,OAAO,IAAIN,SAAS,CAAC2B,OAAO,CAACC,SAAS,IAAI,CAAC,CAAClC,MAAM,CAACE,MAAM,CAACiC,WAAW,EAAE;EAE5H,MAAMC,OAAO,GAAG,CAACC,gBAAgB,CAACrC,MAAM,CAACsC,EAAE,CAAC,KAAKjB,OAAO,IAAIW,OAAO,IAAIN,MAAM,IAAII,OAAO,IAAI,CAAC,CAACrB,UAAU,CAAC8B,IAAI,CAAC;EAE9G,MAAMC,OAAO,GAAGpC,KAAK,CAACqC,QAAQ,EAAE,CAACD,OAAO;EACxC,MAAME,OAAO,GAAGtC,KAAK,CAACqC,QAAQ,EAAE,CAACE,aAAa;EAC9C,MAAMC,MAAM,GAAGxC,KAAK,CAACqC,QAAQ,EAAE,CAACI,YAAY;;EAG5C,MAAMC,WAAW,GAAsB;IACnCC,KAAK,EAAEtC,UAAU,CAACsC,KAAK;IACvB9B,SAAS;IACTI,OAAO;IACPW,OAAO;IACPT,cAAc;IACdG,MAAM;IACNE,SAAS;IACTE,OAAO;IACPkB,SAAS,EAAEC,EAAE,CAAC,cAAc,EAAExC,UAAU,CAACyC,eAAe,CAAC;IACzDC,QAAQ,EAAEC,UAAU,CAACpD,MAAM,CAACE,MAAM,CAACS,SAAS,CAACX,MAAM,EAAEA,MAAM,CAACK,UAAU,EAAE,CAAC;IACzEgD,OAAO,EAAErD,MAAM,CAACqD,OAAO;IACvBC,UAAU,EAAE7C,UAAU,CAAC8B,IAAI;IAC3BgB,YAAY,EAAE9C,UAAU,CAAC8C,YAAY;IACrCnB,OAAO;IACPE,EAAE,EAAEtC,MAAM,CAACsC,EAAE;IACbkB,UAAU,EAAExD,MAAM,CAACE,MAAM,CAACuD,aAAa,EAAE;IACzCC,KAAK,EAAE1D,MAAM,CAAC0D,KAAK;IACnB9C,OAAO;IACPG,QAAQ;IACRG,aAAa,EAAElB,MAAM,CAACkB,aAAa;IACnCyC,MAAM,EAAE3D,MAAM,CAACE,MAAM,CAAC0D,QAAQ,CAAC7C,QAAQ,CAAC;IACxCd,aAAa;IACb4D,iBAAiB,EAAEvD,SAAS,CAACwD,SAAS,CAACD,iBAAiB;IACxDE,eAAe,EAAE3D,KAAK,CAAC2D,eAAe;IACtCC,OAAO,EAAEvD,UAAU,CAACuD,OAAO;IAC3BC,KAAK,EAAE7D,KAAK,CAACqC,QAAQ,EAAE,CAACyB,YAAY,CAAClE,MAAM,CAACsC,EAAE;GACjD;EAED,IAAItC,MAAM,CAACkB,aAAa,EAAE;IACtB,MAAMiD,UAAU,GAAGnE,MAAM,CAACoE,WAAW,CAACC,OAAO,CAACrE,MAAM,CAAC0D,KAAK,GAAG,CAAC,CAAC;IAC/DZ,WAAW,CAACE,SAAS,GAAGC,EAAE,CAAC,gCAAgC,EAAEH,WAAW,CAACE,SAAS,EAAE;MAChF,qBAAqB,EAAEmB,UAAU,aAAVA,UAAU,uBAAVA,UAAU,CAAEjD;KACtC,CAAC;;EAGN,IAAID,SAAS,EAAE;IACX6B,WAAW,CAACwB,QAAQ,GAAG;MACnBtE,MAAM,CAACE,MAAM,CAACqE,cAAc,CAAC;QAAEC,UAAU,EAAEC,qBAAqB,CAACC;OAAU,CAAC;KAC/E;;EAGL,IAAI1C,OAAO,EAAE;IACTc,WAAW,CAAC6B,MAAM,GAAKC,KAAa;MAAA,IAAAC,qBAAA,EAAAC,kBAAA;MAAA,QAAAD,qBAAA,GAAK,CAAAC,kBAAA,GAAAxE,SAAS,CAAC2B,OAAO,EAAC8C,UAAU,cAAAF,qBAAA,uBAA5BA,qBAAA,CAAAG,IAAA,CAAAF,kBAAA,EAA+B9E,MAAM,CAACsC,EAAE,EAAEsC,KAAK,EAAEpC,OAAO,EAAEE,OAAO,EAAEE,MAAM,CAAC;KAE/F;;EAGxB,IAAIvB,OAAO,EAAE;IACTyB,WAAW,CAACmC,MAAM,GAAGjF,MAAM,CAACE,MAAM,CAACgF,0BAA0B,EAAE;;EAGnE,IAAIxD,MAAM,EAAE;IACRoB,WAAW,CAACqC,KAAK,GAAIzB,KAAyB;;MAE1CtD,KAAK,CAACgF,gBAAgB,CAACC,YAAY;QAC/B,OAAO;UACH,GAAGA,YAAY;UACfC,IAAI,EACA5B,KAAK,KAAK6B,SAAS,GACbC,0BAA0B,CAACH,YAAY,CAACC,IAAI,CAAC,GAC7CG,wBAAwB,CACpB/B,KAAK,EACLtD,KAAK,CAACsF,iBAAiB,EAAE,CAACC,GAAG,CAACzF,MAAM,IAAIA,MAAM,CAACoC,EAAE,CAAC;SAEnE;OACJ,CAAC;KACL;;EAGL,IAAIV,SAAS,EAAE;IACXkB,WAAW,CAAC8C,UAAU,GAAG5F,MAAM,CAACE,MAAM,CAAC2F,aAAa,EAAE;IACtD/C,WAAW,CAACgD,QAAQ,GAAG9F,MAAM,CAAC+F,gBAAgB,EAAE;IAChDjD,WAAW,CAACkD,SAAS,GAAGhG,MAAM,CAACE,MAAM,CAAC8F,SAAS;;EAGnD,IAAIlE,OAAO,EAAE;IACT,MAAMmE,gBAAgB,GAAIC,aAA+C;MACrE,IAAIA,aAAa,KAAK,KAAK,EAAE;QACzBlG,MAAM,CAACE,MAAM,CAACiG,YAAY,EAAE;OAC/B,MAAM;QACHnG,MAAM,CAACE,MAAM,CAACkG,aAAa,CAACF,aAAa,KAAK,MAAM,CAAC;;KAE5D;IAEDpD,WAAW,CAACuD,MAAM,GAAGrG,MAAM,CAACE,MAAM,CAACoG,uBAAuB,EAAE;IAC5DxD,WAAW,CAACyD,YAAY,GAAGN,gBAAgB;IAC3CnD,WAAW,CAACoD,aAAa,GAAGlG,MAAM,CAACE,MAAM,CAACiC,WAAW,EAAE;;EAG3D,oBAAOqE,6BAACC,YAAY;IAACC,GAAG,EAAE1G,MAAM,CAACsC;KAAQQ,WAAW,EAAI;AAC5D;AAyCA,MAAM2D,YAAY,gBAAGD,cAAK,CAACG,IAAI,CAAC,SAASF,YAAYA,CAAC1G,KAAwB;EAC1E,MAAM;IACFgD,KAAK;IACL9B,SAAS;IACTe,OAAO;IACPX,OAAO;IACPE,cAAc;IACdG,MAAM;IACNE,SAAS;IACTE,OAAO;IACPqB,QAAQ;IACRH,SAAS;IACTK,OAAO;IACPC,UAAU;IACVC,YAAY;IACZnB,OAAO;IACPE,EAAE;IACFoB,KAAK;IACLF,UAAU;IACV5C,OAAO;IACPG,QAAQ;IACRG,aAAa;IACb0E,UAAU;IACVjC,MAAM;IACNW,QAAQ,EAAEsC,YAAY;IACtBjC,MAAM,EAAEI,UAAU;IAClBE,MAAM,EAAE4B,UAAU;IAClB1B,KAAK,EAAE2B,SAAS;IAChBhB,QAAQ,EAAEiB,YAAY;IACtBV,MAAM,EAAEW,UAAU;IAClBT,YAAY,EAAEN,gBAAgB;IAC9BD,SAAS,EAAEiB,eAAe;IAC1BhH,aAAa;IACb4D,iBAAiB;IACjBE,eAAe;IACfmC,aAAa;IACblC,OAAO;IACPC;GACH,GAAGlE,KAAK;EACT,MAAM,CAACmH,GAAG,EAAEC,MAAM,CAAC,GAAGX,cAAK,CAACY,QAAQ,CAA8B,IAAI,CAAC;;EAGvEC,yBAAyB,CAAC/E,EAAE,EAAEiB,YAAY,EAAEU,KAAK,EAAEiD,GAAG,EAAE3F,cAAc,EAAEwC,eAAe,CAAC;;EAGxF,MAAMuD,KAAK,GAAwB,EAAE;;EAGrC,IAAIjE,OAAO,GAAG,CAAC,EAAE;IACbiE,KAAK,CAACC,UAAU,GAAG,QAAQlE,OAAO,EAAE;;;EAIxC,IAAItC,QAAQ,EAAE;IACVuG,KAAK,CAACvG,QAAQ,CAAC,GAAG,GAAG4C,MAAM,IAAI;;EAGnC,oBACI6C,qDACSgB,iBAAiB,CAAC1F,OAAO,EAAEkF,UAAU,EAAEd,aAAa,CAAS;IAClElD,SAAS,EAAEA,SAAS;uBACHpC,OAAO,GAAG,QAAQ,GAAGmC,KAAK;oBAC7BT,EAAE;wBACEvB,QAAQ,GAAGA,QAAQ,GAAGwE,SAAS;IACjD+B,KAAK,EAAEA,KAAK;IACZJ,GAAG,EAAEC;MACJjG,aAAa,GAAG,IAAI,GAAGmB,gBAAgB,CAACC,EAAE,CAAC,GACxCa,QAAQ,iBAERqD,6BAACiB,OAAO;IAACC,KAAK,EAAEC,MAAM,CAAC3D,OAAO,aAAPA,OAAO,cAAPA,OAAO,GAAIb,QAAQ,CAAC;IAAEyE,SAAS,EAAC;kBACnDpB;IAAMxD,SAAS,EAAC;KAAYG,QAAQ,CAAQ,CACtC,CACb,EACA+C,aAAa,gBAAGM,6BAACqB,aAAa;IAACC,SAAS,EAAE5B;IAAiB,GAAG,IAAI,EAClE9D,OAAO,iBACJoE,6BAACuB,UAAU;IACP9G,SAAS,EAAEA,SAAS;IACpBe,OAAO,EAAEA,OAAO;IAChBX,OAAO,EAAEA,OAAO;IAChBK,MAAM,EAAEA,MAAM;IACdI,OAAO,EAAEA,OAAO;IAChBkB,SAAS,EAAEC,EAAE,CAAC;MACV,SAAS,EAAEF,KAAK,KAAK,OAAO;MAC5B,MAAM,EAAEA,KAAK,KAAK;KACrB,CAAC;IACFO,UAAU,EAAEA,UAAU;IACtBI,KAAK,EAAEA,KAAK;IACZF,UAAU,EAAEA,UAAU;IACtBc,QAAQ,EAAEsC,YAAY;IACtBjC,MAAM,EAAEI,UAAU;IAClBE,MAAM,EAAE4B,UAAU;IAClB1B,KAAK,EAAE2B,SAAS;IAChBP,YAAY,EAAEN,gBAAgB;IAC9BhG,aAAa,EAAEA,aAAa;IAC5B4D,iBAAiB,EAAEA,iBAAiB;IACpCqC,aAAa,EAAEA,aAAa;IAC5B8B,QAAQ,EAAE1F;IACZ,IACF,IAAI,EACPV,SAAS,iBACN4E,6BAACyB,OAAO;IACJC,SAAS,EAAEhB,GAAG;IACd5E,EAAE,EAAEA,EAAE;IACNsD,UAAU,EAAEA,UAAqB;IACjCE,QAAQ,EAAEiB,YAAwC;IAClDoB,WAAW,EAAElB,eAA6B;IAC1ClD,eAAe,EAAEA,eAAe;IAChCE,KAAK,EAAEA;IACT,IACF,IAAI,CACP;AAEb,CAAC,CAAC;;;;"}
|
1
|
+
{"version":3,"file":"Header.js","sources":["../../../../../../../../../../src/primitives/Table/Core/components/Header/Header.tsx"],"sourcesContent":["import React from 'react';\nimport {\n TableMeta as ReactTableMeta,\n ColumnMeta as ReactTableColumnMeta,\n Header as ReactTableHeader,\n ColumnPinningPosition as ReactTableColumnPinningPosition,\n flexRender,\n} from '@tanstack/react-table';\nimport cn from 'clsx';\nimport { freezeUptoExternalColumn, isInternalColumn, unfreezeAllExternalColumns } from '../../../useTableManager/util/columns';\nimport { Tooltip } from '../../../../../components/Tooltip/Tooltip';\nimport { SortIndicator, getSortAttributes } from './components/SortIndicator';\nimport {\n TableColumnAlignment,\n TableColumnMenu,\n TableColumnSortDirection,\n TableColumnWidth,\n TableFilterComparator,\n} from '../../../types';\nimport { Resizer } from './components/Resizer';\nimport { HeaderMenu } from './components/Menu';\nimport { getIsPinned, useSetInitialColumnSizing } from './util';\n\ninterface HeaderContentProps {\n children: React.ReactNode;\n tooltip?: React.ReactNode;\n isInternalColumnHeader: boolean;\n}\n\nconst HeaderContent = ({ children, tooltip, isInternalColumnHeader }: HeaderContentProps) => {\n if (isInternalColumnHeader || typeof children !== 'string') {\n return <>{children}</>;\n }\n\n return (\n <Tooltip title={String(tooltip ?? children)} placement=\"top\">\n <span className=\"truncate\">{children}</span>\n </Tooltip>\n );\n};\n\nexport type HeaderProps<TType = unknown> = {\n header: ReactTableHeader<TType, unknown>;\n scrollToIndex: (index: number) => void;\n};\n\nexport function Header<TType = unknown>(props: HeaderProps<TType>) {\n const { header, scrollToIndex } = props;\n\n if (header.column.getIsGrouped()) {\n return null;\n }\n\n const { table } = header.getContext();\n\n const tableMeta = table.options.meta as ReactTableMeta<TType>;\n const columnMeta = (header.column.columnDef.meta ?? {}) as ReactTableColumnMeta<TType, unknown>;\n\n const isGroup = !!header.subHeaders.length;\n const isPinned = getIsPinned(header);\n\n const canFilter = !header.isPlaceholder && header.column.getCanFilter() && !!table.options.enableColumnFilters;\n const canHide = !header.isPlaceholder && !isGroup && header.column.getCanHide();\n const canMeasureSize = !!table.getRowModel().rows.length;\n const canPin = !header.isPlaceholder && !isGroup && header.column.getCanPin();\n const canResize = !header.isPlaceholder && !isGroup && header.column.getCanResize();\n const canSort = !header.isPlaceholder && !isGroup && header.column.getCanSort();\n const canGoto = canSort && !header.isPlaceholder && !isGroup && tableMeta.rowGoto.isEnabled && !!header.column.getIsSorted();\n\n const hasMenu = !isInternalColumn(header.id) && (canHide || canGoto || canPin || canSort || !!columnMeta.menu);\n\n const sorting = table.getState().sorting;\n const filters = table.getState().columnFilters;\n const search = table.getState().globalFilter;\n\n // passing header or column results in re-renders on scroll, so anything from those objects as memoed props\n const memoedProps: MemoedHeaderProps = {\n align: columnMeta.align,\n canFilter,\n canHide,\n canGoto,\n canMeasureSize,\n canPin,\n canResize,\n canSort,\n className: cn('group/header', columnMeta.headerClassName),\n children: flexRender(header.column.columnDef.header, header.getContext()),\n colSpan: header.colSpan,\n customMenu: columnMeta.menu,\n defaultWidth: columnMeta.defaultWidth,\n hasMenu,\n id: header.id,\n isFiltered: header.column.getIsFiltered(),\n index: header.index,\n isGroup,\n isPinned,\n isPlaceholder: header.isPlaceholder,\n offset: header.column.getStart(isPinned),\n scrollToIndex,\n setRowActiveIndex: tableMeta.rowActive.setRowActiveIndex,\n setColumnSizing: table.setColumnSizing,\n tooltip: columnMeta.tooltip,\n width: table.getState().columnSizing[header.id],\n };\n\n if (header.isPlaceholder) {\n const nextHeader = header.headerGroup.headers[header.index + 1];\n memoedProps.className = cn('!bg-white before:!content-none', memoedProps.className, {\n 'after:!content-none': nextHeader?.isPlaceholder,\n });\n }\n\n if (canFilter) {\n memoedProps.onFilter = () => {\n header.column.setFilterValue({ comparator: TableFilterComparator.Contains });\n };\n }\n\n if (canGoto) {\n memoedProps.onGoto = ((query: string) => tableMeta.rowGoto.handleGoto?.(header.id, query, sorting, filters, search)) as (\n query: string\n ) => Promise<number>;\n }\n\n if (canHide) {\n memoedProps.onHide = header.column.getToggleVisibilityHandler();\n }\n\n if (canPin) {\n memoedProps.onPin = (index: number | undefined) => {\n // TODO: this can probably be moved to a feature hook\n table.setColumnPinning(pinningState => {\n return {\n ...pinningState,\n left:\n index === undefined\n ? unfreezeAllExternalColumns(pinningState.left)\n : freezeUptoExternalColumn(\n index,\n table.getAllLeafColumns().map(column => column.id)\n ),\n };\n });\n };\n }\n\n if (canResize) {\n memoedProps.isResizing = header.column.getIsResizing();\n memoedProps.onResize = header.getResizeHandler();\n memoedProps.resetSize = header.column.resetSize;\n }\n\n if (canSort) {\n const handleSortToggle = (sortDirection: TableColumnSortDirection | false) => {\n if (sortDirection === false) {\n header.column.clearSorting();\n } else {\n header.column.toggleSorting(sortDirection === 'desc');\n }\n };\n\n memoedProps.onSort = header.column.getToggleSortingHandler();\n memoedProps.onSortToggle = handleSortToggle;\n memoedProps.sortDirection = header.column.getIsSorted();\n }\n\n return <MemoedHeader key={header.id} {...memoedProps} />;\n}\n\nexport type MemoedHeaderProps = {\n align?: TableColumnAlignment;\n canFilter: boolean;\n canHide: boolean;\n canGoto: boolean;\n canMeasureSize: boolean;\n canPin: boolean;\n canResize: boolean;\n canSort: boolean;\n children: JSX.Element | React.ReactNode;\n className?: string;\n colSpan: number;\n customMenu?: TableColumnMenu;\n defaultWidth?: TableColumnWidth;\n hasMenu: boolean;\n id: string;\n index: number;\n isFiltered: boolean;\n isGroup: boolean;\n isPinned?: ReactTableColumnPinningPosition;\n isPlaceholder: boolean;\n isResizing?: boolean;\n offset?: number;\n onFilter?: () => void;\n onGoto?: (query: string) => Promise<number>;\n onHide?: (event: unknown) => void;\n onPin?: (index: number | undefined) => void;\n onResize?: (event: unknown) => void;\n onSort?: (event: unknown) => void;\n onSortToggle?: (sortDirection: TableColumnSortDirection | false) => void;\n resetSize?: () => void;\n scrollToIndex: (index: number) => void;\n setRowActiveIndex: (index: number) => void;\n setColumnSizing: any;\n sortDirection?: TableColumnSortDirection | false;\n tooltip?: string;\n width?: TableColumnWidth;\n};\n\nconst MemoedHeader = React.memo(function MemoedHeader(props: MemoedHeaderProps) {\n const {\n align,\n canFilter,\n canGoto,\n canHide,\n canMeasureSize,\n canPin,\n canResize,\n canSort,\n children,\n className,\n colSpan,\n customMenu,\n defaultWidth,\n hasMenu,\n id,\n index,\n isFiltered,\n isGroup,\n isPinned,\n isPlaceholder,\n isResizing,\n offset,\n onFilter: handleFilter,\n onGoto: handleGoto,\n onHide: handleHide,\n onPin: handlePin,\n onResize: handleResize,\n onSort: handleSort,\n onSortToggle: handleSortToggle,\n resetSize: handleResetSize,\n scrollToIndex,\n setRowActiveIndex,\n setColumnSizing,\n sortDirection,\n tooltip,\n width,\n } = props;\n const [ref, setRef] = React.useState<HTMLTableCellElement | null>(null);\n\n // save column width if none is set\n useSetInitialColumnSizing(id, defaultWidth, width, ref, canMeasureSize, setColumnSizing);\n\n // feature specific styles\n const style: React.CSSProperties = {};\n\n // column groups often span multiple columns\n if (colSpan > 1) {\n style.gridColumn = `span ${colSpan}`;\n }\n\n // pinned columns should be offset from either the left or right\n if (isPinned) {\n style[isPinned] = `${offset}px`;\n }\n\n return (\n <th\n {...(getSortAttributes(canSort, handleSort, sortDirection) as any)}\n className={className}\n data-cell-align={isGroup ? 'center' : align}\n data-cell-id={id}\n data-cell-pinned={isPinned ? isPinned : undefined}\n style={style}\n ref={setRef}>\n {!isPlaceholder ? (\n <HeaderContent children={children} tooltip={tooltip} isInternalColumnHeader={!!isInternalColumn(id)} />\n ) : null}\n {sortDirection ? <SortIndicator direction={sortDirection} /> : null}\n {hasMenu ? (\n <HeaderMenu\n canFilter={canFilter}\n canGoto={canGoto}\n canHide={canHide}\n canPin={canPin}\n canSort={canSort}\n className={cn({\n 'ml-auto': align !== 'right',\n 'ml-0': align === 'right',\n })}\n customMenu={customMenu}\n index={index}\n isFiltered={isFiltered}\n onFilter={handleFilter}\n onGoto={handleGoto}\n onHide={handleHide}\n onPin={handlePin}\n onSortToggle={handleSortToggle}\n scrollToIndex={scrollToIndex}\n setRowActiveIndex={setRowActiveIndex}\n sortDirection={sortDirection}\n columnId={id}\n />\n ) : null}\n {canResize ? (\n <Resizer\n headerRef={ref}\n id={id}\n isResizing={isResizing as boolean}\n onResize={handleResize as (event: unknown) => void}\n onResetSize={handleResetSize as () => void}\n setColumnSizing={setColumnSizing}\n width={width}\n />\n ) : null}\n </th>\n );\n});\n"],"names":["HeaderContent","children","tooltip","isInternalColumnHeader","React","Tooltip","title","String","placement","className","Header","props","header","scrollToIndex","column","getIsGrouped","table","getContext","tableMeta","options","meta","columnMeta","_header$column$column","columnDef","isGroup","subHeaders","length","isPinned","getIsPinned","canFilter","isPlaceholder","getCanFilter","enableColumnFilters","canHide","getCanHide","canMeasureSize","getRowModel","rows","canPin","getCanPin","canResize","getCanResize","canSort","getCanSort","canGoto","rowGoto","isEnabled","getIsSorted","hasMenu","isInternalColumn","id","menu","sorting","getState","filters","columnFilters","search","globalFilter","memoedProps","align","cn","headerClassName","flexRender","colSpan","customMenu","defaultWidth","isFiltered","getIsFiltered","index","offset","getStart","setRowActiveIndex","rowActive","setColumnSizing","width","columnSizing","nextHeader","headerGroup","headers","onFilter","setFilterValue","comparator","TableFilterComparator","Contains","onGoto","query","_tableMeta$rowGoto$ha","_tableMeta$rowGoto","handleGoto","call","onHide","getToggleVisibilityHandler","onPin","setColumnPinning","pinningState","left","undefined","unfreezeAllExternalColumns","freezeUptoExternalColumn","getAllLeafColumns","map","isResizing","getIsResizing","onResize","getResizeHandler","resetSize","handleSortToggle","sortDirection","clearSorting","toggleSorting","onSort","getToggleSortingHandler","onSortToggle","MemoedHeader","key","memo","handleFilter","handleHide","handlePin","handleResize","handleSort","handleResetSize","ref","setRef","useState","useSetInitialColumnSizing","style","gridColumn","getSortAttributes","SortIndicator","direction","HeaderMenu","columnId","Resizer","headerRef","onResetSize"],"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 IsOneOf,\n IsNoneOf,\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> = (\n row: TType,\n internalRowId: string,\n cleanup: (rowId: string) => void\n) => 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: any) => 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 hiddenColumns: string[],\n search: string | undefined\n) => Promise<void>;\nexport type TableServerLoadAllHandler = (\n sorting: TableColumnSort[],\n filters: TableColumnFilter[],\n hiddenColumns: string[],\n search: string | undefined\n) => Promise<void>;\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 isOneOf: string;\n isNoneOf: 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"],"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;EACTA,wEAAO;EACPA,0EAAQ;AACZ,CAAC,EAjBWA,qBAAqB,KAArBA,qBAAqB;;;;"}
|
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 IsOneOf,\n IsNoneOf,\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 onKeyDown?: React.KeyboardEventHandler;\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 | JSX.Element;\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> = (\n row: TType,\n internalRowId: string,\n cleanup: (rowId: string) => void\n) => 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: any) => 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 hiddenColumns: string[],\n search: string | undefined\n) => Promise<void>;\nexport type TableServerLoadAllHandler = (\n sorting: TableColumnSort[],\n filters: TableColumnFilter[],\n hiddenColumns: string[],\n search: string | undefined\n) => Promise<void>;\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;\nexport type TableEvent = 'editing-mode';\nexport type TableEventHandler = (event: TableEvent, data?: object) => void;\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 onEvent?: TableEventHandler;\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 isOneOf: string;\n isNoneOf: 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"],"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;EACTA,wEAAO;EACPA,0EAAQ;AACZ,CAAC,EAjBWA,qBAAqB,KAArBA,qBAAqB;;;;"}
|