@economic/taco 2.0.5 → 2.1.0
This diff represents the content of publicly available package versions that have been released to one of the supported registries. The information contained in this diff is provided for informational purposes only and reflects changes between package versions as they appear in their respective public registries.
- package/dist/components/Table3/types.d.ts +1 -0
- package/dist/esm/packages/taco/src/components/Table3/Table3.js +6 -0
- package/dist/esm/packages/taco/src/components/Table3/Table3.js.map +1 -1
- package/dist/esm/packages/taco/src/components/Table3/types.js.map +1 -1
- package/dist/taco.cjs.development.js +6 -0
- package/dist/taco.cjs.development.js.map +1 -1
- package/dist/taco.cjs.production.min.js +1 -1
- package/dist/taco.cjs.production.min.js.map +1 -1
- package/package.json +2 -2
- package/types.json +4816 -4788
|
@@ -138,6 +138,7 @@ export declare type Table3Options = {
|
|
|
138
138
|
export declare type Table3CommonProps<TType = unknown> = Partial<Table3Options> & {
|
|
139
139
|
actionsForRow?: Table3RowActionRenderer<TType>[];
|
|
140
140
|
actionsForRowLength?: number;
|
|
141
|
+
autoFocus?: boolean;
|
|
141
142
|
children: (JSX.Element | boolean | null | undefined)[];
|
|
142
143
|
data: TType[];
|
|
143
144
|
defaultColumnFreezingIndex?: number;
|
|
@@ -30,6 +30,12 @@ const Table = /*#__PURE__*/fixedForwardRef(function Table3(props, ref) {
|
|
|
30
30
|
length
|
|
31
31
|
} = useTable(props);
|
|
32
32
|
useTableRefInstanceSetup(table, internalRef);
|
|
33
|
+
React__default.useEffect(() => {
|
|
34
|
+
if (props.autoFocus) {
|
|
35
|
+
var _internalRef$current;
|
|
36
|
+
(_internalRef$current = internalRef.current) === null || _internalRef$current === void 0 ? void 0 : _internalRef$current.focus();
|
|
37
|
+
}
|
|
38
|
+
}, []);
|
|
33
39
|
const {
|
|
34
40
|
renderBody,
|
|
35
41
|
scrollToIndex
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"Table3.js","sources":["../../../../../../../src/components/Table3/Table3.tsx"],"sourcesContent":["import React from 'react';\nimport cn from 'classnames';\nimport { flexRender, TableMeta } from '@tanstack/react-table';\nimport { FocusScope } from '@react-aria/focus';\nimport { useMergedRef } from '../../hooks/useMergedRef';\nimport { useCssGrid } from './hooks/useCssGrid';\nimport { useTable } from './hooks/useTable';\nimport { useTableRenderStrategy } from './strategies';\nimport { Table3ColumnProps, Table3Props, Table3Ref } from './types';\nimport { Toolbar } from './components/toolbar/Toolbar';\nimport { useColumnFreezingStyle } from './hooks/features/useColumnFreezing';\nimport { useTableRefInstanceSetup } from './hooks/useTableRefInstanceSetup';\nimport { Summary } from './components/columns/footer/Summary';\nimport { useCssVars } from './hooks/useCssVars';\nimport './style.css';\n\nfunction Column<TType = unknown>(_: Table3ColumnProps<TType>) {\n return null;\n}\n\ntype FixedForwardRef = <T, P = {}>(\n render: (props: P, ref: React.Ref<T>) => JSX.Element\n) => (props: P & React.RefAttributes<T>) => JSX.Element;\n\n// Cast the old forwardRef to the new one\nexport const fixedForwardRef = React.forwardRef as FixedForwardRef;\n\nconst Table = fixedForwardRef(function Table3<TType = unknown>(props: Table3Props<TType>, ref: React.Ref<Table3Ref>) {\n const { emptyState: EmptyState, toolbarLeft, toolbarRight } = props;\n const internalRef = useMergedRef<Table3Ref>(ref);\n\n const { table, length } = useTable<TType>(props);\n useTableRefInstanceSetup(table, internalRef);\n\n const { renderBody, scrollToIndex } = useTableRenderStrategy<TType>(props, table, internalRef);\n const tableMeta = table.options.meta as TableMeta<TType>;\n const state = table.getState();\n\n const handleKeyDown = (event: React.KeyboardEvent) => {\n tableMeta.hoverState.handleKeyDown(event);\n tableMeta.currentRow.handleKeyDown(event, table.getRowModel().rows.length, scrollToIndex);\n tableMeta.rowClick.handleKeyDown(event, table);\n tableMeta.rowSelection.handleKeyDown(event, table);\n tableMeta.editing.handleKeyDown(event, internalRef);\n };\n\n const handleBlur = (event: React.FocusEvent) => {\n tableMeta.editing.handleBlur(event);\n };\n\n const handleScroll = async (event: React.MouseEvent<HTMLDivElement>) => {\n tableMeta.columnFreezing.handleScroll(event);\n };\n\n const className = cn(\n 'border-grey-300 relative grid h-full w-full flex-grow overflow-auto rounded border bg-white scroll-mt-[41px]',\n 'focus:yt-focus focus-within:yt-focus',\n '[&[data-resizing=\"true\"]]:select-none',\n {\n 'text-xs': tableMeta.fontSize.size === 'small',\n 'text-sm': tableMeta.fontSize.size === 'medium',\n 'text-base': tableMeta.fontSize.size === 'large',\n }\n );\n\n const { style: cssGridStyle } = useCssGrid<TType>(table);\n const { style: cssVars } = useCssVars(tableMeta.rowHeight.height, tableMeta.fontSize.size);\n\n const style = {\n ...cssVars,\n ...cssGridStyle,\n // create a new stacking context so our internal z-indexes don't effect external components\n // https://developer.mozilla.org/en-US/docs/Web/CSS/CSS_Positioning/Understanding_z_index/The_stacking_context\n opacity: 0.999,\n };\n\n const columnFreezingStyle = useColumnFreezingStyle(props.id, table);\n const isServerLoadingAndNotReady = tableMeta.isUsingServer && props.length === undefined;\n\n return (\n <>\n {columnFreezingStyle ? <style data-taco=\"table3-column-freezing-styles\">{columnFreezingStyle}</style> : null}\n <Toolbar\n table={table}\n tableProps={props}\n total={length}\n left={toolbarLeft}\n right={toolbarRight}\n scrollToIndex={scrollToIndex}\n />\n <div\n className={className}\n id={props.id}\n data-font-size={tableMeta.fontSize.size}\n data-editing={tableMeta.editing.isEditing}\n data-horizontally-scrolled={tableMeta.columnFreezing.horizontallyScrolled}\n data-pause-hover={tableMeta?.hoverState.isPaused}\n data-resizing={!!state.columnSizingInfo.isResizingColumn}\n data-taco=\"table2\"\n onBlur={handleBlur}\n onKeyDown={handleKeyDown}\n onScroll={handleScroll}\n ref={internalRef}\n role=\"table\"\n style={style}\n tabIndex={0}>\n {isServerLoadingAndNotReady ? null : (\n <div className=\"group/header contents\" data-taco=\"table2-header\" role=\"rowgroup\">\n {table.getHeaderGroups().map(headerGroup => (\n <div className=\"contents\" key={headerGroup.id} role=\"row\">\n {headerGroup.headers.map(header => (\n <React.Fragment key={header.id}>\n {flexRender(header.column.columnDef.header, { ...header.getContext(), scrollToIndex })}\n </React.Fragment>\n ))}\n </div>\n ))}\n </div>\n )}\n {table.getRowModel().rows.length ? (\n <>\n <FocusScope>\n <div className=\"group/body contents\" data-taco=\"table2-body\" role=\"rowgroup\">\n {renderBody()}\n <span className=\"col-span-full h-16 print:hidden\" />\n </div>\n </FocusScope>\n <div className=\"group/footer contents\" data-taco=\"table2-footer\" role=\"rowgroup\">\n {table.getFooterGroups().map(footerGroup => (\n <div className=\"contents\" key={footerGroup.id} role=\"row\">\n {footerGroup.headers.map(footer => (\n <React.Fragment key={footer.id}>\n {flexRender(footer.column.columnDef.footer, footer.getContext())}\n </React.Fragment>\n ))}\n </div>\n ))}\n {length ? <Summary length={length} table={table} /> : null}\n </div>\n </>\n ) : (\n <div className=\"col-span-full min-h-[theme(spacing.8)]\">{EmptyState ? <EmptyState /> : null}</div>\n )}\n </div>\n </>\n );\n});\n\ntype Table3WithStatics = (<TType = unknown>(props: Table3Props<TType> & React.RefAttributes<Table3Ref>) => JSX.Element) & {\n Column: typeof Column;\n};\n\nexport const Table3 = fixedForwardRef(function Table3<TType = unknown>(props: Table3Props<TType>, ref: React.Ref<Table3Ref>) {\n // we force a remount (using key) when the child columns change because there are too many places to add children as an effect\n // this is cheaper from a complexity perspective, and probably performance wise as well\n const key = React.useMemo(() => String('tableKey_' + String(props.children)), [props.children]);\n return <Table<TType> {...props} key={key} ref={ref} />;\n}) as Table3WithStatics;\nTable3.Column = Column;\n\n// hooks\nexport { useTable3DataLoader } from './hooks/useTableDataLoader';\n\n// types\nexport type {\n useTable3DataFetcher,\n useTable3DataOptions,\n useTable3DataFetcherValues as useTableDataValues,\n} from './hooks/useTableDataLoader';\n\nexport type {\n Table3Ref,\n Table3Props,\n Table3Preset,\n Table3Settings,\n Table3SettingsAdapter,\n Table3RowHeight,\n Table3FilterComparator,\n Table3FilterHandler,\n Table3SearchHandler,\n Table3LoadPageHandler,\n Table3LoadAllHandler,\n Table3RowGotoHandler,\n Table3SortHandler,\n Table3Shortcuts,\n Table3ShortcutHandlerFn,\n Table3ShortcutHandlerObject,\n Table3FontSize,\n Table3SortDirection,\n Table3SortFn,\n Table3RowActionRenderer,\n Table3RowSelectionHandler,\n Table3RowExpansionRenderer,\n Table3RowDropHandler,\n Table3RowDragHandler,\n Table3RowClickHandler,\n Table3ColumnProps,\n Table3ColumnAlignment,\n Table3ColumnDataType,\n Table3ColumnHeaderMenu,\n Table3ColumnClassNameHandler,\n Table3ColumnFooterRenderer,\n Table3ColumnRenderer,\n Table3ColumnControlRenderer,\n Table3ColumnControlProps,\n} from './types';\n"],"names":["Column","_","fixedForwardRef","React","forwardRef","Table","Table3","props","ref","emptyState","EmptyState","toolbarLeft","toolbarRight","internalRef","useMergedRef","table","length","useTable","useTableRefInstanceSetup","renderBody","scrollToIndex","useTableRenderStrategy","tableMeta","options","meta","state","getState","handleKeyDown","event","hoverState","currentRow","getRowModel","rows","rowClick","rowSelection","editing","handleBlur","handleScroll","columnFreezing","className","cn","fontSize","size","style","cssGridStyle","useCssGrid","cssVars","useCssVars","rowHeight","height","opacity","columnFreezingStyle","useColumnFreezingStyle","id","isServerLoadingAndNotReady","isUsingServer","undefined","Toolbar","tableProps","total","left","right","isEditing","horizontallyScrolled","isPaused","columnSizingInfo","isResizingColumn","onBlur","onKeyDown","onScroll","role","tabIndex","getHeaderGroups","map","headerGroup","key","headers","header","Fragment","flexRender","column","columnDef","getContext","FocusScope","getFooterGroups","footerGroup","footer","Summary","useMemo","String","children"],"mappings":"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"}
|
|
1
|
+
{"version":3,"file":"Table3.js","sources":["../../../../../../../src/components/Table3/Table3.tsx"],"sourcesContent":["import React from 'react';\nimport cn from 'classnames';\nimport { flexRender, TableMeta } from '@tanstack/react-table';\nimport { FocusScope } from '@react-aria/focus';\nimport { useMergedRef } from '../../hooks/useMergedRef';\nimport { useCssGrid } from './hooks/useCssGrid';\nimport { useTable } from './hooks/useTable';\nimport { useTableRenderStrategy } from './strategies';\nimport { Table3ColumnProps, Table3Props, Table3Ref } from './types';\nimport { Toolbar } from './components/toolbar/Toolbar';\nimport { useColumnFreezingStyle } from './hooks/features/useColumnFreezing';\nimport { useTableRefInstanceSetup } from './hooks/useTableRefInstanceSetup';\nimport { Summary } from './components/columns/footer/Summary';\nimport { useCssVars } from './hooks/useCssVars';\nimport './style.css';\n\nfunction Column<TType = unknown>(_: Table3ColumnProps<TType>) {\n return null;\n}\n\ntype FixedForwardRef = <T, P = {}>(\n render: (props: P, ref: React.Ref<T>) => JSX.Element\n) => (props: P & React.RefAttributes<T>) => JSX.Element;\n\n// Cast the old forwardRef to the new one\nexport const fixedForwardRef = React.forwardRef as FixedForwardRef;\n\nconst Table = fixedForwardRef(function Table3<TType = unknown>(props: Table3Props<TType>, ref: React.Ref<Table3Ref>) {\n const { emptyState: EmptyState, toolbarLeft, toolbarRight } = props;\n const internalRef = useMergedRef<Table3Ref>(ref);\n\n const { table, length } = useTable<TType>(props);\n useTableRefInstanceSetup(table, internalRef);\n\n React.useEffect(() => {\n if (props.autoFocus) {\n internalRef.current?.focus();\n }\n }, []);\n\n const { renderBody, scrollToIndex } = useTableRenderStrategy<TType>(props, table, internalRef);\n const tableMeta = table.options.meta as TableMeta<TType>;\n const state = table.getState();\n\n const handleKeyDown = (event: React.KeyboardEvent) => {\n tableMeta.hoverState.handleKeyDown(event);\n tableMeta.currentRow.handleKeyDown(event, table.getRowModel().rows.length, scrollToIndex);\n tableMeta.rowClick.handleKeyDown(event, table);\n tableMeta.rowSelection.handleKeyDown(event, table);\n tableMeta.editing.handleKeyDown(event, internalRef);\n };\n\n const handleBlur = (event: React.FocusEvent) => {\n tableMeta.editing.handleBlur(event);\n };\n\n const handleScroll = async (event: React.MouseEvent<HTMLDivElement>) => {\n tableMeta.columnFreezing.handleScroll(event);\n };\n\n const className = cn(\n 'border-grey-300 relative grid h-full w-full flex-grow overflow-auto rounded border bg-white scroll-mt-[41px]',\n 'focus:yt-focus focus-within:yt-focus',\n '[&[data-resizing=\"true\"]]:select-none',\n {\n 'text-xs': tableMeta.fontSize.size === 'small',\n 'text-sm': tableMeta.fontSize.size === 'medium',\n 'text-base': tableMeta.fontSize.size === 'large',\n }\n );\n\n const { style: cssGridStyle } = useCssGrid<TType>(table);\n const { style: cssVars } = useCssVars(tableMeta.rowHeight.height, tableMeta.fontSize.size);\n\n const style = {\n ...cssVars,\n ...cssGridStyle,\n // create a new stacking context so our internal z-indexes don't effect external components\n // https://developer.mozilla.org/en-US/docs/Web/CSS/CSS_Positioning/Understanding_z_index/The_stacking_context\n opacity: 0.999,\n };\n\n const columnFreezingStyle = useColumnFreezingStyle(props.id, table);\n const isServerLoadingAndNotReady = tableMeta.isUsingServer && props.length === undefined;\n\n return (\n <>\n {columnFreezingStyle ? <style data-taco=\"table3-column-freezing-styles\">{columnFreezingStyle}</style> : null}\n <Toolbar\n table={table}\n tableProps={props}\n total={length}\n left={toolbarLeft}\n right={toolbarRight}\n scrollToIndex={scrollToIndex}\n />\n <div\n className={className}\n id={props.id}\n data-font-size={tableMeta.fontSize.size}\n data-editing={tableMeta.editing.isEditing}\n data-horizontally-scrolled={tableMeta.columnFreezing.horizontallyScrolled}\n data-pause-hover={tableMeta?.hoverState.isPaused}\n data-resizing={!!state.columnSizingInfo.isResizingColumn}\n data-taco=\"table2\"\n onBlur={handleBlur}\n onKeyDown={handleKeyDown}\n onScroll={handleScroll}\n ref={internalRef}\n role=\"table\"\n style={style}\n tabIndex={0}>\n {isServerLoadingAndNotReady ? null : (\n <div className=\"group/header contents\" data-taco=\"table2-header\" role=\"rowgroup\">\n {table.getHeaderGroups().map(headerGroup => (\n <div className=\"contents\" key={headerGroup.id} role=\"row\">\n {headerGroup.headers.map(header => (\n <React.Fragment key={header.id}>\n {flexRender(header.column.columnDef.header, { ...header.getContext(), scrollToIndex })}\n </React.Fragment>\n ))}\n </div>\n ))}\n </div>\n )}\n {table.getRowModel().rows.length ? (\n <>\n <FocusScope>\n <div className=\"group/body contents\" data-taco=\"table2-body\" role=\"rowgroup\">\n {renderBody()}\n <span className=\"col-span-full h-16 print:hidden\" />\n </div>\n </FocusScope>\n <div className=\"group/footer contents\" data-taco=\"table2-footer\" role=\"rowgroup\">\n {table.getFooterGroups().map(footerGroup => (\n <div className=\"contents\" key={footerGroup.id} role=\"row\">\n {footerGroup.headers.map(footer => (\n <React.Fragment key={footer.id}>\n {flexRender(footer.column.columnDef.footer, footer.getContext())}\n </React.Fragment>\n ))}\n </div>\n ))}\n {length ? <Summary length={length} table={table} /> : null}\n </div>\n </>\n ) : (\n <div className=\"col-span-full min-h-[theme(spacing.8)]\">{EmptyState ? <EmptyState /> : null}</div>\n )}\n </div>\n </>\n );\n});\n\ntype Table3WithStatics = (<TType = unknown>(props: Table3Props<TType> & React.RefAttributes<Table3Ref>) => JSX.Element) & {\n Column: typeof Column;\n};\n\nexport const Table3 = fixedForwardRef(function Table3<TType = unknown>(props: Table3Props<TType>, ref: React.Ref<Table3Ref>) {\n // we force a remount (using key) when the child columns change because there are too many places to add children as an effect\n // this is cheaper from a complexity perspective, and probably performance wise as well\n const key = React.useMemo(() => String('tableKey_' + String(props.children)), [props.children]);\n return <Table<TType> {...props} key={key} ref={ref} />;\n}) as Table3WithStatics;\nTable3.Column = Column;\n\n// hooks\nexport { useTable3DataLoader } from './hooks/useTableDataLoader';\n\n// types\nexport type {\n useTable3DataFetcher,\n useTable3DataOptions,\n useTable3DataFetcherValues as useTableDataValues,\n} from './hooks/useTableDataLoader';\n\nexport type {\n Table3Ref,\n Table3Props,\n Table3Preset,\n Table3Settings,\n Table3SettingsAdapter,\n Table3RowHeight,\n Table3FilterComparator,\n Table3FilterHandler,\n Table3SearchHandler,\n Table3LoadPageHandler,\n Table3LoadAllHandler,\n Table3RowGotoHandler,\n Table3SortHandler,\n Table3Shortcuts,\n Table3ShortcutHandlerFn,\n Table3ShortcutHandlerObject,\n Table3FontSize,\n Table3SortDirection,\n Table3SortFn,\n Table3RowActionRenderer,\n Table3RowSelectionHandler,\n Table3RowExpansionRenderer,\n Table3RowDropHandler,\n Table3RowDragHandler,\n Table3RowClickHandler,\n Table3ColumnProps,\n Table3ColumnAlignment,\n Table3ColumnDataType,\n Table3ColumnHeaderMenu,\n Table3ColumnClassNameHandler,\n Table3ColumnFooterRenderer,\n Table3ColumnRenderer,\n Table3ColumnControlRenderer,\n Table3ColumnControlProps,\n} from './types';\n"],"names":["Column","_","fixedForwardRef","React","forwardRef","Table","Table3","props","ref","emptyState","EmptyState","toolbarLeft","toolbarRight","internalRef","useMergedRef","table","length","useTable","useTableRefInstanceSetup","useEffect","autoFocus","current","focus","renderBody","scrollToIndex","useTableRenderStrategy","tableMeta","options","meta","state","getState","handleKeyDown","event","hoverState","currentRow","getRowModel","rows","rowClick","rowSelection","editing","handleBlur","handleScroll","columnFreezing","className","cn","fontSize","size","style","cssGridStyle","useCssGrid","cssVars","useCssVars","rowHeight","height","opacity","columnFreezingStyle","useColumnFreezingStyle","id","isServerLoadingAndNotReady","isUsingServer","undefined","Toolbar","tableProps","total","left","right","isEditing","horizontallyScrolled","isPaused","columnSizingInfo","isResizingColumn","onBlur","onKeyDown","onScroll","role","tabIndex","getHeaderGroups","map","headerGroup","key","headers","header","Fragment","flexRender","column","columnDef","getContext","FocusScope","getFooterGroups","footerGroup","footer","Summary","useMemo","String","children"],"mappings":"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"}
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"types.js","sources":["../../../../../../../src/components/Table3/types.ts"],"sourcesContent":["import {\n ColumnFilter as RTColumnFilter,\n ColumnOrderState,\n ColumnPinningState,\n ColumnSizingState,\n ColumnSort as RTTableColumnSort,\n SortingState,\n VisibilityState,\n BuiltInSortingFn,\n} from '@tanstack/react-table';\nimport { MenuProps } from '../Menu/Menu';\n\nexport type Table3SortDirection = 'asc' | 'desc';\nexport type Table3SortFn<TType = unknown> =\n | ((rowA: TType, rowB: TType, columnId: string) => -1 | 0 | 1)\n | BuiltInSortingFn\n | 'auto';\n\n// columns\nexport type Table3ColumnRenderer<TValue = unknown, TType = unknown> = (\n value: TValue,\n row: TType\n) => JSX.Element | string | number | null;\nexport type Table3ColumnFooterRenderer<TValue = unknown> = (values: TValue[]) => JSX.Element | string | number | null;\nexport type Table3ColumnClassNameHandler<TType = unknown> = string | ((row: TType) => string | undefined);\nexport type Table3ColumnAlignment = 'left' | 'center' | 'right';\nexport type Table3ColumnDataType = 'auto' | 'alphanumeric' | 'alphanumericCaseSensitive' | 'datetime' | 'boolean';\nexport type Table3ColumnHeaderMenu = (props: Partial<MenuProps>) => JSX.Element;\n\nexport type Table3ColumnControlProps = {\n className?: string;\n disabled?: boolean;\n invalid?: boolean;\n onBlur?: (value: any) => void;\n onFocus?: React.FocusEventHandler;\n readOnly?: boolean;\n ref: React.RefObject<HTMLElement>;\n setValue: (value: any) => void;\n value: any;\n};\nexport type Table3ColumnControlRenderer<TType = unknown> =\n | ((props: Table3ColumnControlProps, row?: TType) => JSX.Element)\n | 'datepicker'\n | 'input'\n | 'switch';\n\ntype ValueOf<T> = T[keyof T];\n\nexport type Table3ColumnProps<TType = unknown> = ValueOf<{\n [K in keyof TType]: {\n accessor: K;\n } & {\n align?: Table3ColumnAlignment;\n className?: Table3ColumnClassNameHandler<TType>;\n control?: Table3ColumnControlRenderer<TType>;\n dataType?: Table3ColumnDataType;\n defaultHidden?: boolean;\n defaultWidth?: number | 'grow';\n enableFiltering?: boolean;\n enableHiding?: boolean;\n enableOrdering?: boolean;\n enableResizing?: boolean;\n enableSearch?: boolean;\n enableSorting?: boolean;\n enableTruncate?: boolean;\n footer?: Table3ColumnFooterRenderer;\n header: string;\n headerClassName?: string;\n menu?: Table3ColumnHeaderMenu;\n minWidth?: number;\n renderer?: Table3ColumnRenderer<TType[K], TType>;\n sort?: Table3SortDirection;\n sortFn?: Table3SortFn<TType>;\n tooltip?: string;\n };\n}>;\n\n// rows\nexport type DeprecatedRowDensity = 'compact' | 'normal' | 'comfortable' | 'spacious';\nexport type Table3RowHeight = 'short' | 'medium' | 'tall' | 'extra-tall';\nexport type Table3FontSize = 'small' | 'medium' | 'large';\nexport type Table3RowClickHandler<TType = unknown> = (row: TType) => void;\nexport type Table3RowDragHandler<TType = unknown> = (\n rows: TType[],\n showPlaceholder: (string) => void,\n setDataTransfer: (data: string) => void\n) => void;\nexport type Table3RowDropHandler<TType = any> = (event: React.DragEvent, row: TType) => void;\nexport type Table3RowExpansionRenderer<TType = unknown> = (row: TType) => (() => JSX.Element) | null;\nexport type Table3RowSelectionHandler<TType = unknown> = (rows: TType[]) => void;\nexport type Table3RowActionRenderer<TType = unknown> = (row: TType) => JSX.Element | null;\n\n// table\nexport type Table3Preset = 'display' | 'editable';\nexport type Table3Settings = {\n columnFreezingIndex?: number;\n columnOrder?: ColumnOrderState;\n columnPinning?: ColumnPinningState;\n columnSizing?: ColumnSizingState;\n columnVisibility?: VisibilityState;\n excludeUnmatchedRecordsInSearch?: boolean;\n fontSize?: Table3FontSize;\n rowHeight?: Table3RowHeight;\n sorting?: SortingState;\n};\nexport type Table3SettingsAdapter = (settings: Table3Settings) => void;\n\nexport enum Table3FilterComparator {\n Contains,\n DoesNotContain,\n IsEqualTo,\n IsNotEqualTo,\n IsGreaterThan,\n IsLessThan,\n IsBetween,\n IsOneOf,\n IsNoneOf,\n IsAllOf,\n IsEmpty,\n IsNotEmpty,\n}\n\nexport type Table3FilterValue = {\n comparator: Table3FilterComparator;\n value: any;\n};\n\nexport type Table3Filter = { id: string; value: Table3FilterValue };\n\nexport type ColumnFilter = RTColumnFilter;\nexport type Table3FilterHandler = (filters: ColumnFilter[]) => void;\nexport type Table3SearchHandler = (query: string | undefined) => Promise<void>;\nexport type Table3LoadPageHandler = (\n pageIndex: number,\n sorting: Table3ColumnSort[],\n filters: ColumnFilter[],\n search: string | undefined\n) => Promise<void>;\nexport type Table3LoadAllHandler = (\n sorting: Table3ColumnSort[],\n filters: ColumnFilter[],\n search: string | undefined\n) => Promise<void>;\nexport type Table3RowGotoHandler = (\n column: string,\n query: string,\n sorting: Table3ColumnSort[],\n filters: ColumnFilter[],\n search: string | undefined\n) => Promise<number>;\nexport type Table3ColumnSort = RTTableColumnSort;\nexport type Table3SortHandler = (sorting: Table3ColumnSort[]) => void;\nexport type TableStrategy = {\n renderBody: () => JSX.Element | JSX.Element[] | null;\n scrollToIndex: (index: number, options?: { align: 'start' | 'center' | 'end' | 'auto' }) => void;\n};\nexport type Table3ShortcutHandlerFn<TType = unknown> = (row: TType) => void;\nexport type Table3ShortcutHandlerObject<TType = unknown> = {\n handler: Table3ShortcutHandlerFn<TType>;\n meta?: boolean;\n shift?: boolean;\n};\nexport type Table3Shortcuts<TType = unknown> = Record<\n string,\n Table3ShortcutHandlerFn<TType> | Table3ShortcutHandlerObject<TType>\n>;\nexport type Table3SaveHandler<TType = unknown> = (data: TType) => Promise<void>;\n\nexport type Table3Options = {\n enableColumnFreezing: boolean;\n enableColumnHiding: boolean;\n enableColumnOrdering: boolean;\n enableColumnResizing: boolean;\n enableFontSize: boolean;\n enablePrinting: boolean;\n enableRowDrag: boolean;\n enableRowDrop: boolean;\n enableRowExpansion: boolean;\n enableRowGoto: boolean;\n enableRowHeight: boolean;\n enableRowSelection: boolean;\n enableRowSelectionSingle: boolean;\n enableEditing: boolean;\n enableFiltering: boolean;\n enableSearch: boolean;\n enableSorting: boolean;\n};\n\nexport type Table3CommonProps<TType = unknown> = Partial<Table3Options> & {\n actionsForRow?: Table3RowActionRenderer<TType>[];\n actionsForRowLength?: number;\n children: (JSX.Element | boolean | null | undefined)[];\n data: TType[];\n defaultColumnFreezingIndex?: number;\n defaultCurrentRowIndex?: number;\n defaultSettings?: Table3Settings;\n emptyState?: () => JSX.Element | null;\n expandedRowRenderer?: Table3RowExpansionRenderer<TType>;\n id: string;\n onChangeSettings?: Table3SettingsAdapter;\n onRowClick?: Table3RowClickHandler<TType>;\n onRowDrag?: Table3RowDragHandler<TType>;\n onRowDrop?: Table3RowDropHandler<TType>;\n onRowGoto?: Table3RowGotoHandler;\n onRowSelect?: Table3RowSelectionHandler<TType>;\n onFilter?: Table3FilterHandler;\n onSave?: Table3SaveHandler<TType>;\n onSearch?: Table3SearchHandler;\n onSort?: Table3SortHandler;\n preset?: Table3Preset;\n shortcuts?: Table3Shortcuts<TType>;\n toolbarLeft?: JSX.Element;\n toolbarRight?: JSX.Element;\n};\n\ninterface Table3ClientProps<TType = unknown> extends Table3CommonProps<TType> {\n length?: never;\n loadPage?: never;\n loadAll?: never;\n pageSize?: never;\n}\n\ninterface Table3ServerProps<TType = unknown> extends Table3CommonProps<TType> {\n length: number | undefined;\n loadPage: Table3LoadPageHandler;\n loadAll: Table3LoadAllHandler;\n pageSize?: number;\n}\n\nexport type Table3Props<TType = unknown> = Table3ClientProps<TType> | Table3ServerProps<TType>;\n\nexport type Table3Ref = HTMLDivElement & {\n instance: {\n resetFiltering: () => void;\n resetRowExpansion: () => void;\n resetRowSelection: () => void;\n resetSorting: () => void;\n toggleEditing: (enabled: boolean | undefined) => void;\n };\n};\n\nexport type Table3Texts = {\n columns: {\n actions: {\n tooltip: string;\n };\n drag: {\n tooltip: string;\n };\n expansion: {\n collapse: string;\n collapseAll: string;\n expand: string;\n expandAll: string;\n };\n menu: {\n freezeFirstColumn: string;\n freezeUptoColumn: string;\n gotoRow: string;\n hideColumn: string;\n unfreezeColumns: string;\n };\n resize: {\n tooltip: string;\n };\n select: {\n deselect: string;\n deselectAll: string;\n select: string;\n selectAll: string;\n };\n };\n columnSettings: {\n button: string;\n noResults: string;\n search: string;\n tooltip: string;\n };\n editing: {\n actions: {\n tooltip: string;\n save: string;\n clear: string;\n exit: string;\n };\n buttons: {\n edit: {\n text: string;\n tooltip: string;\n };\n };\n rowIndicator: {\n rowWillMove: string;\n rowWillBeHidden: string;\n rowWillMoveReasonSearch: string;\n rowWillMoveReasonFilter: string;\n rowWillMoveReasonSorting: string;\n };\n saving: {\n progress: string;\n complete: string;\n };\n };\n filters: {\n button: string;\n buttons: {\n addFilter: string;\n clearFilters: string;\n };\n comparators: {\n contains: string;\n doesNotContain: string;\n isEqualTo: string;\n isNotEqualTo: string;\n isGreaterThan: string;\n isLessThan: string;\n isBetween: string;\n isOneOf: string;\n isNoneOf: string;\n isAllOf: string;\n isEmpty: string;\n isNotEmpty: string;\n };\n conditions: {\n and: string;\n where: string;\n };\n emptyFilter: {\n condition: string;\n value: string;\n };\n tooltip: string;\n total: string;\n };\n fontSize: {\n tooltip: string;\n sizes: {\n small: string;\n medium: string;\n large: string;\n };\n };\n footer: {\n summary: {\n count: string;\n records: string;\n selected: string;\n };\n };\n print: {\n error: string;\n loading: string;\n tooltip: string;\n };\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};\n"],"names":["Table3FilterComparator"],"mappings":"IA2GYA;AAAZ,WAAYA,sBAAsB;EAC9BA,2EAAQ;EACRA,uFAAc;EACdA,6EAAS;EACTA,mFAAY;EACZA,qFAAa;EACbA,+EAAU;EACVA,6EAAS;EACTA,yEAAO;EACPA,2EAAQ;EACRA,yEAAO;EACPA,0EAAO;EACPA,gFAAU;AACd,CAAC,EAbWA,sBAAsB,KAAtBA,sBAAsB;;;;"}
|
|
1
|
+
{"version":3,"file":"types.js","sources":["../../../../../../../src/components/Table3/types.ts"],"sourcesContent":["import {\n ColumnFilter as RTColumnFilter,\n ColumnOrderState,\n ColumnPinningState,\n ColumnSizingState,\n ColumnSort as RTTableColumnSort,\n SortingState,\n VisibilityState,\n BuiltInSortingFn,\n} from '@tanstack/react-table';\nimport { MenuProps } from '../Menu/Menu';\n\nexport type Table3SortDirection = 'asc' | 'desc';\nexport type Table3SortFn<TType = unknown> =\n | ((rowA: TType, rowB: TType, columnId: string) => -1 | 0 | 1)\n | BuiltInSortingFn\n | 'auto';\n\n// columns\nexport type Table3ColumnRenderer<TValue = unknown, TType = unknown> = (\n value: TValue,\n row: TType\n) => JSX.Element | string | number | null;\nexport type Table3ColumnFooterRenderer<TValue = unknown> = (values: TValue[]) => JSX.Element | string | number | null;\nexport type Table3ColumnClassNameHandler<TType = unknown> = string | ((row: TType) => string | undefined);\nexport type Table3ColumnAlignment = 'left' | 'center' | 'right';\nexport type Table3ColumnDataType = 'auto' | 'alphanumeric' | 'alphanumericCaseSensitive' | 'datetime' | 'boolean';\nexport type Table3ColumnHeaderMenu = (props: Partial<MenuProps>) => JSX.Element;\n\nexport type Table3ColumnControlProps = {\n className?: string;\n disabled?: boolean;\n invalid?: boolean;\n onBlur?: (value: any) => void;\n onFocus?: React.FocusEventHandler;\n readOnly?: boolean;\n ref: React.RefObject<HTMLElement>;\n setValue: (value: any) => void;\n value: any;\n};\nexport type Table3ColumnControlRenderer<TType = unknown> =\n | ((props: Table3ColumnControlProps, row?: TType) => JSX.Element)\n | 'datepicker'\n | 'input'\n | 'switch';\n\ntype ValueOf<T> = T[keyof T];\n\nexport type Table3ColumnProps<TType = unknown> = ValueOf<{\n [K in keyof TType]: {\n accessor: K;\n } & {\n align?: Table3ColumnAlignment;\n className?: Table3ColumnClassNameHandler<TType>;\n control?: Table3ColumnControlRenderer<TType>;\n dataType?: Table3ColumnDataType;\n defaultHidden?: boolean;\n defaultWidth?: number | 'grow';\n enableFiltering?: boolean;\n enableHiding?: boolean;\n enableOrdering?: boolean;\n enableResizing?: boolean;\n enableSearch?: boolean;\n enableSorting?: boolean;\n enableTruncate?: boolean;\n footer?: Table3ColumnFooterRenderer;\n header: string;\n headerClassName?: string;\n menu?: Table3ColumnHeaderMenu;\n minWidth?: number;\n renderer?: Table3ColumnRenderer<TType[K], TType>;\n sort?: Table3SortDirection;\n sortFn?: Table3SortFn<TType>;\n tooltip?: string;\n };\n}>;\n\n// rows\nexport type DeprecatedRowDensity = 'compact' | 'normal' | 'comfortable' | 'spacious';\nexport type Table3RowHeight = 'short' | 'medium' | 'tall' | 'extra-tall';\nexport type Table3FontSize = 'small' | 'medium' | 'large';\nexport type Table3RowClickHandler<TType = unknown> = (row: TType) => void;\nexport type Table3RowDragHandler<TType = unknown> = (\n rows: TType[],\n showPlaceholder: (string) => void,\n setDataTransfer: (data: string) => void\n) => void;\nexport type Table3RowDropHandler<TType = any> = (event: React.DragEvent, row: TType) => void;\nexport type Table3RowExpansionRenderer<TType = unknown> = (row: TType) => (() => JSX.Element) | null;\nexport type Table3RowSelectionHandler<TType = unknown> = (rows: TType[]) => void;\nexport type Table3RowActionRenderer<TType = unknown> = (row: TType) => JSX.Element | null;\n\n// table\nexport type Table3Preset = 'display' | 'editable';\nexport type Table3Settings = {\n columnFreezingIndex?: number;\n columnOrder?: ColumnOrderState;\n columnPinning?: ColumnPinningState;\n columnSizing?: ColumnSizingState;\n columnVisibility?: VisibilityState;\n excludeUnmatchedRecordsInSearch?: boolean;\n fontSize?: Table3FontSize;\n rowHeight?: Table3RowHeight;\n sorting?: SortingState;\n};\nexport type Table3SettingsAdapter = (settings: Table3Settings) => void;\n\nexport enum Table3FilterComparator {\n Contains,\n DoesNotContain,\n IsEqualTo,\n IsNotEqualTo,\n IsGreaterThan,\n IsLessThan,\n IsBetween,\n IsOneOf,\n IsNoneOf,\n IsAllOf,\n IsEmpty,\n IsNotEmpty,\n}\n\nexport type Table3FilterValue = {\n comparator: Table3FilterComparator;\n value: any;\n};\n\nexport type Table3Filter = { id: string; value: Table3FilterValue };\n\nexport type ColumnFilter = RTColumnFilter;\nexport type Table3FilterHandler = (filters: ColumnFilter[]) => void;\nexport type Table3SearchHandler = (query: string | undefined) => Promise<void>;\nexport type Table3LoadPageHandler = (\n pageIndex: number,\n sorting: Table3ColumnSort[],\n filters: ColumnFilter[],\n search: string | undefined\n) => Promise<void>;\nexport type Table3LoadAllHandler = (\n sorting: Table3ColumnSort[],\n filters: ColumnFilter[],\n search: string | undefined\n) => Promise<void>;\nexport type Table3RowGotoHandler = (\n column: string,\n query: string,\n sorting: Table3ColumnSort[],\n filters: ColumnFilter[],\n search: string | undefined\n) => Promise<number>;\nexport type Table3ColumnSort = RTTableColumnSort;\nexport type Table3SortHandler = (sorting: Table3ColumnSort[]) => void;\nexport type TableStrategy = {\n renderBody: () => JSX.Element | JSX.Element[] | null;\n scrollToIndex: (index: number, options?: { align: 'start' | 'center' | 'end' | 'auto' }) => void;\n};\nexport type Table3ShortcutHandlerFn<TType = unknown> = (row: TType) => void;\nexport type Table3ShortcutHandlerObject<TType = unknown> = {\n handler: Table3ShortcutHandlerFn<TType>;\n meta?: boolean;\n shift?: boolean;\n};\nexport type Table3Shortcuts<TType = unknown> = Record<\n string,\n Table3ShortcutHandlerFn<TType> | Table3ShortcutHandlerObject<TType>\n>;\nexport type Table3SaveHandler<TType = unknown> = (data: TType) => Promise<void>;\n\nexport type Table3Options = {\n enableColumnFreezing: boolean;\n enableColumnHiding: boolean;\n enableColumnOrdering: boolean;\n enableColumnResizing: boolean;\n enableFontSize: boolean;\n enablePrinting: boolean;\n enableRowDrag: boolean;\n enableRowDrop: boolean;\n enableRowExpansion: boolean;\n enableRowGoto: boolean;\n enableRowHeight: boolean;\n enableRowSelection: boolean;\n enableRowSelectionSingle: boolean;\n enableEditing: boolean;\n enableFiltering: boolean;\n enableSearch: boolean;\n enableSorting: boolean;\n};\n\nexport type Table3CommonProps<TType = unknown> = Partial<Table3Options> & {\n actionsForRow?: Table3RowActionRenderer<TType>[];\n actionsForRowLength?: number;\n autoFocus?: boolean;\n children: (JSX.Element | boolean | null | undefined)[];\n data: TType[];\n defaultColumnFreezingIndex?: number;\n defaultCurrentRowIndex?: number;\n defaultSettings?: Table3Settings;\n emptyState?: () => JSX.Element | null;\n expandedRowRenderer?: Table3RowExpansionRenderer<TType>;\n id: string;\n onChangeSettings?: Table3SettingsAdapter;\n onRowClick?: Table3RowClickHandler<TType>;\n onRowDrag?: Table3RowDragHandler<TType>;\n onRowDrop?: Table3RowDropHandler<TType>;\n onRowGoto?: Table3RowGotoHandler;\n onRowSelect?: Table3RowSelectionHandler<TType>;\n onFilter?: Table3FilterHandler;\n onSave?: Table3SaveHandler<TType>;\n onSearch?: Table3SearchHandler;\n onSort?: Table3SortHandler;\n preset?: Table3Preset;\n shortcuts?: Table3Shortcuts<TType>;\n toolbarLeft?: JSX.Element;\n toolbarRight?: JSX.Element;\n};\n\ninterface Table3ClientProps<TType = unknown> extends Table3CommonProps<TType> {\n length?: never;\n loadPage?: never;\n loadAll?: never;\n pageSize?: never;\n}\n\ninterface Table3ServerProps<TType = unknown> extends Table3CommonProps<TType> {\n length: number | undefined;\n loadPage: Table3LoadPageHandler;\n loadAll: Table3LoadAllHandler;\n pageSize?: number;\n}\n\nexport type Table3Props<TType = unknown> = Table3ClientProps<TType> | Table3ServerProps<TType>;\n\nexport type Table3Ref = HTMLDivElement & {\n instance: {\n resetFiltering: () => void;\n resetRowExpansion: () => void;\n resetRowSelection: () => void;\n resetSorting: () => void;\n toggleEditing: (enabled: boolean | undefined) => void;\n };\n};\n\nexport type Table3Texts = {\n columns: {\n actions: {\n tooltip: string;\n };\n drag: {\n tooltip: string;\n };\n expansion: {\n collapse: string;\n collapseAll: string;\n expand: string;\n expandAll: string;\n };\n menu: {\n freezeFirstColumn: string;\n freezeUptoColumn: string;\n gotoRow: string;\n hideColumn: string;\n unfreezeColumns: string;\n };\n resize: {\n tooltip: string;\n };\n select: {\n deselect: string;\n deselectAll: string;\n select: string;\n selectAll: string;\n };\n };\n columnSettings: {\n button: string;\n noResults: string;\n search: string;\n tooltip: string;\n };\n editing: {\n actions: {\n tooltip: string;\n save: string;\n clear: string;\n exit: string;\n };\n buttons: {\n edit: {\n text: string;\n tooltip: string;\n };\n };\n rowIndicator: {\n rowWillMove: string;\n rowWillBeHidden: string;\n rowWillMoveReasonSearch: string;\n rowWillMoveReasonFilter: string;\n rowWillMoveReasonSorting: string;\n };\n saving: {\n progress: string;\n complete: string;\n };\n };\n filters: {\n button: string;\n buttons: {\n addFilter: string;\n clearFilters: string;\n };\n comparators: {\n contains: string;\n doesNotContain: string;\n isEqualTo: string;\n isNotEqualTo: string;\n isGreaterThan: string;\n isLessThan: string;\n isBetween: string;\n isOneOf: string;\n isNoneOf: string;\n isAllOf: string;\n isEmpty: string;\n isNotEmpty: string;\n };\n conditions: {\n and: string;\n where: string;\n };\n emptyFilter: {\n condition: string;\n value: string;\n };\n tooltip: string;\n total: string;\n };\n fontSize: {\n tooltip: string;\n sizes: {\n small: string;\n medium: string;\n large: string;\n };\n };\n footer: {\n summary: {\n count: string;\n records: string;\n selected: string;\n };\n };\n print: {\n error: string;\n loading: string;\n tooltip: string;\n };\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};\n"],"names":["Table3FilterComparator"],"mappings":"IA2GYA;AAAZ,WAAYA,sBAAsB;EAC9BA,2EAAQ;EACRA,uFAAc;EACdA,6EAAS;EACTA,mFAAY;EACZA,qFAAa;EACbA,+EAAU;EACVA,6EAAS;EACTA,yEAAO;EACPA,2EAAQ;EACRA,yEAAO;EACPA,0EAAO;EACPA,gFAAU;AACd,CAAC,EAbWA,sBAAsB,KAAtBA,sBAAsB;;;;"}
|
|
@@ -20003,6 +20003,12 @@ const Table$1 = /*#__PURE__*/fixedForwardRef(function Table3(props, ref) {
|
|
|
20003
20003
|
length
|
|
20004
20004
|
} = useTable$2(props);
|
|
20005
20005
|
useTableRefInstanceSetup(table, internalRef);
|
|
20006
|
+
React__default.useEffect(() => {
|
|
20007
|
+
if (props.autoFocus) {
|
|
20008
|
+
var _internalRef$current;
|
|
20009
|
+
(_internalRef$current = internalRef.current) === null || _internalRef$current === void 0 ? void 0 : _internalRef$current.focus();
|
|
20010
|
+
}
|
|
20011
|
+
}, []);
|
|
20006
20012
|
const {
|
|
20007
20013
|
renderBody,
|
|
20008
20014
|
scrollToIndex
|