@economic/taco 2.34.1 → 2.35.1
Sign up to get free protection for your applications and to get access to all the features.
- package/dist/components/Drawer/Context.d.ts +1 -0
- package/dist/components/Drawer/Drawer.d.ts +6 -0
- package/dist/components/Provider/Localization.d.ts +1 -0
- package/dist/esm/index.css +4 -0
- package/dist/esm/packages/taco/src/components/Datepicker/Datepicker.js +13 -3
- package/dist/esm/packages/taco/src/components/Datepicker/Datepicker.js.map +1 -1
- package/dist/esm/packages/taco/src/components/Drawer/Context.js +1 -0
- package/dist/esm/packages/taco/src/components/Drawer/Context.js.map +1 -1
- package/dist/esm/packages/taco/src/components/Drawer/Drawer.js +3 -1
- package/dist/esm/packages/taco/src/components/Drawer/Drawer.js.map +1 -1
- package/dist/esm/packages/taco/src/components/Drawer/components/Content.js +41 -8
- package/dist/esm/packages/taco/src/components/Drawer/components/Content.js.map +1 -1
- package/dist/esm/packages/taco/src/components/Drawer/util.js +1 -1
- package/dist/esm/packages/taco/src/components/Drawer/util.js.map +1 -1
- package/dist/esm/packages/taco/src/components/List/components/Toggle.js +26 -15
- package/dist/esm/packages/taco/src/components/List/components/Toggle.js.map +1 -1
- package/dist/esm/packages/taco/src/components/Provider/Localization.js +2 -1
- package/dist/esm/packages/taco/src/components/Provider/Localization.js.map +1 -1
- package/dist/esm/packages/taco/src/components/Select2/Select2.js +10 -10
- package/dist/esm/packages/taco/src/components/Select2/Select2.js.map +1 -1
- package/dist/esm/packages/taco/src/components/Table3/components/Columns/Cell/util.js +2 -1
- package/dist/esm/packages/taco/src/components/Table3/components/Columns/Cell/util.js.map +1 -1
- package/dist/esm/packages/taco/src/components/Table3/components/Row/Row.js +1 -1
- package/dist/esm/packages/taco/src/components/Table3/components/Row/Row.js.map +1 -1
- package/dist/esm/packages/taco/src/primitives/Table/Core/components/Body/Body.js +2 -2
- package/dist/esm/packages/taco/src/primitives/Table/Core/components/Body/Body.js.map +1 -1
- package/dist/esm/packages/taco/src/primitives/Table/Core/components/Body/util.js +12 -5
- package/dist/esm/packages/taco/src/primitives/Table/Core/components/Body/util.js.map +1 -1
- package/dist/esm/packages/taco/src/primitives/Table/Core/components/Header/components/Menu.js +9 -1
- package/dist/esm/packages/taco/src/primitives/Table/Core/components/Header/components/Menu.js.map +1 -1
- package/dist/esm/packages/taco/src/primitives/Table/useTableDataLoader.js +0 -4
- package/dist/esm/packages/taco/src/primitives/Table/useTableDataLoader.js.map +1 -1
- package/dist/esm/packages/taco/src/primitives/Table/useTableManager/util/search.js +3 -2
- package/dist/esm/packages/taco/src/primitives/Table/useTableManager/util/search.js.map +1 -1
- package/dist/index.css +4 -0
- package/dist/primitives/Table/Core/components/Body/util.d.ts +2 -2
- package/dist/taco.cjs.development.js +122 -54
- package/dist/taco.cjs.development.js.map +1 -1
- package/dist/taco.cjs.production.min.js +1 -1
- package/dist/taco.cjs.production.min.js.map +1 -1
- package/package.json +2 -2
package/dist/esm/packages/taco/src/primitives/Table/Core/components/Header/components/Menu.js
CHANGED
@@ -150,7 +150,15 @@ function HeaderMenu(props) {
|
|
150
150
|
icon: "more",
|
151
151
|
menu: popoverElement ? undefined : menuProps => ( /*#__PURE__*/React__default.createElement(Menu, Object.assign({}, menuProps), /*#__PURE__*/React__default.createElement(Menu.Content, null, memoedMenuItems))),
|
152
152
|
popover: popoverElement,
|
153
|
-
onClickCapture: event => event.preventDefault()
|
153
|
+
onClickCapture: event => event.preventDefault(),
|
154
|
+
onKeyDown: event => {
|
155
|
+
// Removes focus from the column header menu button so that active row shortcuts execute when Tab,
|
156
|
+
// Shift+Tab, or any other keydown event occurs.
|
157
|
+
if (event.key === 'ArrowUp' || event.key === 'ArrowDown') {
|
158
|
+
var _event$currentTarget;
|
159
|
+
(_event$currentTarget = event.currentTarget) === null || _event$currentTarget === void 0 ? void 0 : _event$currentTarget.blur();
|
160
|
+
}
|
161
|
+
}
|
154
162
|
});
|
155
163
|
}
|
156
164
|
|
package/dist/esm/packages/taco/src/primitives/Table/Core/components/Header/components/Menu.js.map
CHANGED
@@ -1 +1 @@
|
|
1
|
-
{"version":3,"file":"Menu.js","sources":["../../../../../../../../../../../src/primitives/Table/Core/components/Header/components/Menu.tsx"],"sourcesContent":["import React from 'react';\nimport cn from 'clsx';\nimport { IconButton } from '../../../../../../components/IconButton/IconButton';\nimport { Menu as MenuPrimitive } from '../../../../../../components/Menu/Menu';\nimport { useLocalization } from '../../../../../../components/Provider/Localization';\nimport { GotoPopover } from './Goto';\nimport { TableColumnMenu, TableColumnSortDirection } from '../../../../types';\n\nexport type HeaderMenuProps = React.ButtonHTMLAttributes<HTMLButtonElement> & {\n canFilter: boolean;\n canGoto: boolean;\n canHide: boolean;\n canPin: boolean;\n canSort: boolean;\n customMenu?: TableColumnMenu;\n index: number;\n isFiltered: boolean;\n onFilter?: () => void;\n onGoto?: (query: string) => Promise<number>;\n onHide?: (event: unknown) => void;\n onPin?: (index: number | undefined) => void;\n onSortToggle?: (sortDirection: TableColumnSortDirection | false) => void;\n scrollToIndex: (index: number) => void;\n setRowActiveIndex: (index: number) => void;\n sortDirection?: TableColumnSortDirection | false;\n};\n\nexport function HeaderMenu(props: HeaderMenuProps) {\n const {\n canFilter,\n canGoto,\n canHide,\n canPin,\n canSort,\n customMenu,\n index,\n isFiltered,\n onFilter: handleFilter,\n onGoto: handleGoto,\n onHide: handleHide,\n onPin: handlePin,\n onSortToggle: handleSortToggle,\n scrollToIndex,\n setRowActiveIndex,\n sortDirection,\n } = props;\n const { texts } = useLocalization();\n const [popover, setPopover] = React.useState<string | undefined>(undefined);\n\n let popoverElement;\n\n if (popover) {\n const handleClosePopover = () => setPopover(undefined);\n\n switch (popover) {\n case 'goto': {\n if (handleGoto) {\n const goto = async (query: string) => {\n try {\n const index = await handleGoto(query);\n setRowActiveIndex(index);\n scrollToIndex(index);\n } catch (e) {\n console.error(e);\n //\n } finally {\n handleClosePopover();\n }\n };\n popoverElement = props => <GotoPopover {...props} open onChange={handleClosePopover} onGoto={goto} />;\n }\n }\n }\n }\n\n const memoedMenuItems = React.useMemo(() => {\n const menuItems: JSX.Element[] = [];\n\n if (canHide && handleHide) {\n // we do this in the next tick, otherwise the menu closes and react throws a \"state update on unmounted component\" error\n const handleClick = event => setTimeout(() => handleHide(event), 1);\n\n menuItems.push(\n <MenuPrimitive.Item icon=\"eye-off\" onClick={handleClick}>\n {texts.table.columns.menu.hideColumn}\n </MenuPrimitive.Item>\n );\n }\n\n if (canSort) {\n menuItems.push(\n <MenuPrimitive.Item\n icon=\"sort-by\"\n subMenu={() => (\n <MenuPrimitive.SubMenu>\n <MenuPrimitive.RadioGroup onChange={handleSortToggle as any} value={sortDirection}>\n <MenuPrimitive.RadioGroup.Item value=\"asc\">\n {texts.table.columns.menu.sortingOrder.ascending}\n </MenuPrimitive.RadioGroup.Item>\n <MenuPrimitive.RadioGroup.Item value=\"desc\">\n {texts.table.columns.menu.sortingOrder.descending}\n </MenuPrimitive.RadioGroup.Item>\n <MenuPrimitive.RadioGroup.Item value={false}>\n {texts.table.columns.menu.sortingOrder.unsorted}\n </MenuPrimitive.RadioGroup.Item>\n </MenuPrimitive.RadioGroup>\n </MenuPrimitive.SubMenu>\n )}>\n {texts.table.columns.menu.sorting}\n </MenuPrimitive.Item>\n );\n }\n\n if (canGoto) {\n menuItems.push(\n <MenuPrimitive.Item icon=\"move\" onClick={() => setPopover('goto')} shortcut=\"g\">\n {texts.table.columns.menu.gotoRow}...\n </MenuPrimitive.Item>\n );\n }\n\n if (canPin && handlePin) {\n menuItems.push(\n <MenuPrimitive.Item icon=\"column-freeze\" onClick={() => handlePin(index)}>\n {index === 0\n ? texts.table.columns.menu.freezeFirstColumn\n : texts.table.columns.menu.freezeUptoColumn.replace('[TOTAL]', String(index + 1))}\n </MenuPrimitive.Item>\n );\n\n menuItems.push(\n <MenuPrimitive.Item icon=\"column-unfreeze\" onClick={() => handlePin(undefined)}>\n {texts.table.columns.menu.unfreezeColumns}\n </MenuPrimitive.Item>\n );\n }\n if (canFilter && handleFilter) {\n menuItems.push(\n <MenuPrimitive.Item icon={isFiltered ? 'filter-solid' : 'filter'} onClick={() => handleFilter()}>\n {isFiltered ? texts.table.columns.menu.editFilter : texts.table.columns.menu.filter}\n </MenuPrimitive.Item>\n );\n }\n\n if (customMenu) {\n const menu = customMenu({ trigger: undefined });\n const customItems = React.Children.toArray(menu.props.children.props.children) as JSX.Element[];\n\n if (customItems.length) {\n if (menuItems.length) {\n menuItems.push(<MenuPrimitive.Separator />);\n }\n\n menuItems.push(...customItems);\n }\n }\n\n return menuItems.map((item, key) => React.cloneElement(item, { key }));\n }, [\n canFilter,\n canGoto,\n canHide,\n canPin,\n canSort,\n customMenu,\n handleGoto,\n handleSortToggle,\n index,\n isFiltered,\n sortDirection,\n ]);\n\n // can't use display: none because the button needs to be focusable\n const className = cn(\n // positioning\n 'justify-end overflow-hidden',\n // sizing\n '!h-6 !w-0 !min-h-[theme(spacing.6)] !min-w-0',\n // visible - hover\n 'group-hover/header:!w-6 group-hover/header:!min-w-[theme(spacing.6)] group-hover/header:-mr-1',\n // visible - expanded\n 'aria-expanded:!w-6 aria-expanded:!min-w-[theme(spacing.6)]',\n // visible - focus\n 'focus:!w-6 focus:!min-w-[theme(spacing.6)]',\n {\n '!w-6 !min-w-[theme(spacing.6)]': !!popoverElement,\n },\n props.className\n );\n\n return (\n <IconButton\n className={className}\n icon=\"more\"\n menu={\n popoverElement\n ? undefined\n : menuProps => (\n <MenuPrimitive {...menuProps}>\n <MenuPrimitive.Content>{memoedMenuItems}</MenuPrimitive.Content>\n </MenuPrimitive>\n )\n }\n popover={popoverElement}\n onClickCapture={event => event.preventDefault()}\n />\n );\n}\n"],"names":["HeaderMenu","props","canFilter","canGoto","canHide","canPin","canSort","customMenu","index","isFiltered","onFilter","handleFilter","onGoto","handleGoto","onHide","handleHide","onPin","handlePin","onSortToggle","handleSortToggle","scrollToIndex","setRowActiveIndex","sortDirection","texts","useLocalization","popover","setPopover","React","useState","undefined","popoverElement","handleClosePopover","goto","query","Promise","resolve","then","e","console","error","_wasThrown","_result","_temp","reject","GotoPopover","open","onChange","memoedMenuItems","useMemo","menuItems","handleClick","event","setTimeout","push","MenuPrimitive","Item","icon","onClick","table","columns","menu","hideColumn","subMenu","SubMenu","RadioGroup","value","sortingOrder","ascending","descending","unsorted","sorting","shortcut","gotoRow","freezeFirstColumn","freezeUptoColumn","replace","String","unfreezeColumns","editFilter","filter","trigger","customItems","Children","toArray","children","length","Separator","map","item","key","cloneElement","className","cn","IconButton","menuProps","Content","onClickCapture","preventDefault"],"mappings":"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"}
|
1
|
+
{"version":3,"file":"Menu.js","sources":["../../../../../../../../../../../src/primitives/Table/Core/components/Header/components/Menu.tsx"],"sourcesContent":["import React from 'react';\nimport cn from 'clsx';\nimport { IconButton } from '../../../../../../components/IconButton/IconButton';\nimport { Menu as MenuPrimitive } from '../../../../../../components/Menu/Menu';\nimport { useLocalization } from '../../../../../../components/Provider/Localization';\nimport { GotoPopover } from './Goto';\nimport { TableColumnMenu, TableColumnSortDirection } from '../../../../types';\n\nexport type HeaderMenuProps = React.ButtonHTMLAttributes<HTMLButtonElement> & {\n canFilter: boolean;\n canGoto: boolean;\n canHide: boolean;\n canPin: boolean;\n canSort: boolean;\n customMenu?: TableColumnMenu;\n index: number;\n isFiltered: boolean;\n onFilter?: () => void;\n onGoto?: (query: string) => Promise<number>;\n onHide?: (event: unknown) => void;\n onPin?: (index: number | undefined) => void;\n onSortToggle?: (sortDirection: TableColumnSortDirection | false) => void;\n scrollToIndex: (index: number) => void;\n setRowActiveIndex: (index: number) => void;\n sortDirection?: TableColumnSortDirection | false;\n};\n\nexport function HeaderMenu(props: HeaderMenuProps) {\n const {\n canFilter,\n canGoto,\n canHide,\n canPin,\n canSort,\n customMenu,\n index,\n isFiltered,\n onFilter: handleFilter,\n onGoto: handleGoto,\n onHide: handleHide,\n onPin: handlePin,\n onSortToggle: handleSortToggle,\n scrollToIndex,\n setRowActiveIndex,\n sortDirection,\n } = props;\n const { texts } = useLocalization();\n const [popover, setPopover] = React.useState<string | undefined>(undefined);\n\n let popoverElement;\n\n if (popover) {\n const handleClosePopover = () => setPopover(undefined);\n\n switch (popover) {\n case 'goto': {\n if (handleGoto) {\n const goto = async (query: string) => {\n try {\n const index = await handleGoto(query);\n setRowActiveIndex(index);\n scrollToIndex(index);\n } catch (e) {\n console.error(e);\n //\n } finally {\n handleClosePopover();\n }\n };\n popoverElement = props => <GotoPopover {...props} open onChange={handleClosePopover} onGoto={goto} />;\n }\n }\n }\n }\n\n const memoedMenuItems = React.useMemo(() => {\n const menuItems: JSX.Element[] = [];\n\n if (canHide && handleHide) {\n // we do this in the next tick, otherwise the menu closes and react throws a \"state update on unmounted component\" error\n const handleClick = event => setTimeout(() => handleHide(event), 1);\n\n menuItems.push(\n <MenuPrimitive.Item icon=\"eye-off\" onClick={handleClick}>\n {texts.table.columns.menu.hideColumn}\n </MenuPrimitive.Item>\n );\n }\n\n if (canSort) {\n menuItems.push(\n <MenuPrimitive.Item\n icon=\"sort-by\"\n subMenu={() => (\n <MenuPrimitive.SubMenu>\n <MenuPrimitive.RadioGroup onChange={handleSortToggle as any} value={sortDirection}>\n <MenuPrimitive.RadioGroup.Item value=\"asc\">\n {texts.table.columns.menu.sortingOrder.ascending}\n </MenuPrimitive.RadioGroup.Item>\n <MenuPrimitive.RadioGroup.Item value=\"desc\">\n {texts.table.columns.menu.sortingOrder.descending}\n </MenuPrimitive.RadioGroup.Item>\n <MenuPrimitive.RadioGroup.Item value={false}>\n {texts.table.columns.menu.sortingOrder.unsorted}\n </MenuPrimitive.RadioGroup.Item>\n </MenuPrimitive.RadioGroup>\n </MenuPrimitive.SubMenu>\n )}>\n {texts.table.columns.menu.sorting}\n </MenuPrimitive.Item>\n );\n }\n\n if (canGoto) {\n menuItems.push(\n <MenuPrimitive.Item icon=\"move\" onClick={() => setPopover('goto')} shortcut=\"g\">\n {texts.table.columns.menu.gotoRow}...\n </MenuPrimitive.Item>\n );\n }\n\n if (canPin && handlePin) {\n menuItems.push(\n <MenuPrimitive.Item icon=\"column-freeze\" onClick={() => handlePin(index)}>\n {index === 0\n ? texts.table.columns.menu.freezeFirstColumn\n : texts.table.columns.menu.freezeUptoColumn.replace('[TOTAL]', String(index + 1))}\n </MenuPrimitive.Item>\n );\n\n menuItems.push(\n <MenuPrimitive.Item icon=\"column-unfreeze\" onClick={() => handlePin(undefined)}>\n {texts.table.columns.menu.unfreezeColumns}\n </MenuPrimitive.Item>\n );\n }\n if (canFilter && handleFilter) {\n menuItems.push(\n <MenuPrimitive.Item icon={isFiltered ? 'filter-solid' : 'filter'} onClick={() => handleFilter()}>\n {isFiltered ? texts.table.columns.menu.editFilter : texts.table.columns.menu.filter}\n </MenuPrimitive.Item>\n );\n }\n\n if (customMenu) {\n const menu = customMenu({ trigger: undefined });\n const customItems = React.Children.toArray(menu.props.children.props.children) as JSX.Element[];\n\n if (customItems.length) {\n if (menuItems.length) {\n menuItems.push(<MenuPrimitive.Separator />);\n }\n\n menuItems.push(...customItems);\n }\n }\n\n return menuItems.map((item, key) => React.cloneElement(item, { key }));\n }, [\n canFilter,\n canGoto,\n canHide,\n canPin,\n canSort,\n customMenu,\n handleGoto,\n handleSortToggle,\n index,\n isFiltered,\n sortDirection,\n ]);\n\n // can't use display: none because the button needs to be focusable\n const className = cn(\n // positioning\n 'justify-end overflow-hidden',\n // sizing\n '!h-6 !w-0 !min-h-[theme(spacing.6)] !min-w-0',\n // visible - hover\n 'group-hover/header:!w-6 group-hover/header:!min-w-[theme(spacing.6)] group-hover/header:-mr-1',\n // visible - expanded\n 'aria-expanded:!w-6 aria-expanded:!min-w-[theme(spacing.6)]',\n // visible - focus\n 'focus:!w-6 focus:!min-w-[theme(spacing.6)]',\n {\n '!w-6 !min-w-[theme(spacing.6)]': !!popoverElement,\n },\n props.className\n );\n\n return (\n <IconButton\n className={className}\n icon=\"more\"\n menu={\n popoverElement\n ? undefined\n : menuProps => (\n <MenuPrimitive {...menuProps}>\n <MenuPrimitive.Content>{memoedMenuItems}</MenuPrimitive.Content>\n </MenuPrimitive>\n )\n }\n popover={popoverElement}\n onClickCapture={event => event.preventDefault()}\n onKeyDown={event => {\n // Removes focus from the column header menu button so that active row shortcuts execute when Tab,\n // Shift+Tab, or any other keydown event occurs.\n if (event.key === 'ArrowUp' || event.key === 'ArrowDown') {\n event.currentTarget?.blur();\n }\n }}\n />\n );\n}\n"],"names":["HeaderMenu","props","canFilter","canGoto","canHide","canPin","canSort","customMenu","index","isFiltered","onFilter","handleFilter","onGoto","handleGoto","onHide","handleHide","onPin","handlePin","onSortToggle","handleSortToggle","scrollToIndex","setRowActiveIndex","sortDirection","texts","useLocalization","popover","setPopover","React","useState","undefined","popoverElement","handleClosePopover","goto","query","Promise","resolve","then","e","console","error","_wasThrown","_result","_temp","reject","GotoPopover","open","onChange","memoedMenuItems","useMemo","menuItems","handleClick","event","setTimeout","push","MenuPrimitive","Item","icon","onClick","table","columns","menu","hideColumn","subMenu","SubMenu","RadioGroup","value","sortingOrder","ascending","descending","unsorted","sorting","shortcut","gotoRow","freezeFirstColumn","freezeUptoColumn","replace","String","unfreezeColumns","editFilter","filter","trigger","customItems","Children","toArray","children","length","Separator","map","item","key","cloneElement","className","cn","IconButton","menuProps","Content","onClickCapture","preventDefault","onKeyDown","_event$currentTarget","currentTarget","blur"],"mappings":"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"}
|
@@ -107,8 +107,6 @@ function useTableDataLoader(fetchPage, fetchAll, options = {
|
|
107
107
|
// if a search is currently "active", we need to re load all because
|
108
108
|
const handleSort = function (sorting) {
|
109
109
|
try {
|
110
|
-
// set the sorting so we can track if it changed between loads
|
111
|
-
_lastUsedSorting.current = sorting;
|
112
110
|
if (_lastUsedSearch.current) {
|
113
111
|
// we're searching, which means we need to refetch all with the correct sorting applied
|
114
112
|
loadAll(sorting, _lastUsedFilters.current);
|
@@ -123,8 +121,6 @@ function useTableDataLoader(fetchPage, fetchAll, options = {
|
|
123
121
|
};
|
124
122
|
const handleFilter = function (filters) {
|
125
123
|
try {
|
126
|
-
// set the filters so we can track if it changed between loads
|
127
|
-
_lastUsedFilters.current = filters;
|
128
124
|
if (_lastUsedSearch.current) {
|
129
125
|
// we're searching, which means we need to refetch all with the correct sorting applied
|
130
126
|
loadAll(_lastUsedSorting.current, filters);
|
@@ -1 +1 @@
|
|
1
|
-
{"version":3,"file":"useTableDataLoader.js","sources":["../../../../../../../src/primitives/Table/useTableDataLoader.ts"],"sourcesContent":["import React from 'react';\nimport {\n TableColumnFilter,\n TableColumnSort,\n TableFilterHandler,\n TableServerLoadPageHandler,\n TableServerLoadAllHandler,\n TableSortHandler,\n TableSearchHandler,\n} from './types';\n\nexport const DEFAULT_PAGE_SIZE = 100;\n\nexport type useTableDataPageFetcher<TType = unknown> = (\n pageIndex: number,\n pageSize: number,\n sorting: TableColumnSort[],\n filters: TableColumnFilter[]\n) => Promise<{ data: TType[]; length: number }>;\n\nexport type useTableDataAllFetcher<TType = unknown> = (\n sorting: TableColumnSort[],\n filters: TableColumnFilter[]\n) => Promise<{ data: TType[]; length: number }>;\n\nexport type useTableDataLoaderOptions = { pageSize: number };\n\nexport type useTableDataLoaderValues<TType = unknown> = {\n data: TType[];\n length: number | undefined;\n loadAll: TableServerLoadAllHandler;\n loadPage: TableServerLoadPageHandler;\n onChangeFilter: TableFilterHandler;\n onChangeSearch: TableSearchHandler;\n onChangeSort: TableSortHandler;\n pageSize: number;\n};\n\nexport function useTableDataLoader<TType = unknown>(\n fetchPage: useTableDataPageFetcher<TType>,\n fetchAll: useTableDataAllFetcher<TType>,\n options: useTableDataLoaderOptions = { pageSize: DEFAULT_PAGE_SIZE }\n): [useTableDataLoaderValues<TType>, () => void] {\n const { pageSize } = options;\n\n // track the data length, we don't know it until the first request\n const length = React.useRef<number | undefined>(undefined);\n // data will be filled after the first request, then we'll update values in place\n const [data, setData] = React.useState<any[]>([]);\n // track which pages have been loaded to dedupe requests\n const _pendingPageRequests = React.useRef({});\n const _lastUsedSorting = React.useRef<TableColumnSort[]>([]);\n const _lastUsedFilters = React.useRef<TableColumnFilter[]>([]);\n const _lastUsedSearch = React.useRef<string>();\n const _forceReset = React.useRef(false);\n\n const loadPage = async (pageIndex: number, sorting: TableColumnSort[], filters: TableColumnFilter[]) => {\n let reset = false;\n\n // sorting or filters changed, reset everything\n if (\n _forceReset.current ||\n JSON.stringify(sorting) !== JSON.stringify(_lastUsedSorting.current) ||\n JSON.stringify(filters) !== JSON.stringify(_lastUsedFilters.current)\n ) {\n _pendingPageRequests.current = {};\n // nuke the dataset so that we \"start again\" after sorting\n reset = true;\n }\n\n if (_pendingPageRequests.current[pageIndex]) {\n // if page is already loaded/loading, abort, otherwise mark it as loading\n return;\n } else {\n _pendingPageRequests.current[pageIndex] = true;\n }\n\n _forceReset.current = false;\n // set the sorting so we can track if it changed between loads\n _lastUsedSorting.current = sorting;\n // set the filters so we can track if it changed between loads\n _lastUsedFilters.current = filters;\n\n try {\n const response = await fetchPage(pageIndex, pageSize, sorting, filters);\n\n // update state, here we do some \"magic\" to support \"load in place\"\n setData(currentData => {\n let nextData;\n\n // reset table state if:\n // - the length isn't set at all (first load)\n // - the client length and server length are different (the data changed)\n if (reset || length.current !== response.length) {\n length.current = response.length;\n nextData = Array(length.current).fill(undefined);\n } else {\n nextData = [...currentData];\n }\n\n const startIndex = pageIndex * pageSize;\n nextData.splice(startIndex, pageSize, ...response.data);\n return nextData;\n });\n } catch {\n //\n } finally {\n _pendingPageRequests.current[pageIndex] = false;\n }\n };\n\n const loadAll = async (sorting: TableColumnSort[], filters: TableColumnFilter[]) => {\n // set the sorting so we can track if it changed between loads\n _lastUsedSorting.current = sorting;\n // set the filters so we can track if it changed between loads\n _lastUsedFilters.current = filters;\n\n try {\n const response = await fetchAll(sorting, filters);\n length.current = response.length;\n\n setData(() => {\n let nextData;\n\n if (response.data.length !== response.length) {\n nextData = Array(response.length).fill(undefined);\n nextData.splice(0, response.data.length, ...response.data);\n } else {\n nextData = [...response.data];\n }\n\n return nextData;\n });\n } catch {\n //\n }\n };\n\n const invalidate = async () => {\n _forceReset.current = true;\n return loadPage(0, _lastUsedSorting.current, _lastUsedFilters.current);\n };\n\n // search works client side - it fetches all then works client side - so these handlers are a little \"weird\"\n // if a search is currently \"active\", we need to re load all because\n const handleSort = async (sorting: TableColumnSort[]) => {\n // set the sorting so we can track if it changed between loads\n _lastUsedSorting.current = sorting;\n\n if (_lastUsedSearch.current) {\n // we're searching, which means we need to refetch all with the correct sorting applied\n loadAll(sorting, _lastUsedFilters.current);\n } else {\n // reset the page to 0 whenever sorting\n loadPage(0, sorting, _lastUsedFilters.current);\n }\n };\n const handleFilter = async (filters: TableColumnFilter[]) => {\n // set the filters so we can track if it changed between loads\n _lastUsedFilters.current = filters;\n\n if (_lastUsedSearch.current) {\n // we're searching, which means we need to refetch all with the correct sorting applied\n loadAll(_lastUsedSorting.current, filters);\n } else {\n // reset the page to 0 whenever sorting\n loadPage(0, _lastUsedSorting.current, filters);\n }\n };\n const handleSearch = async (search: string | undefined) => {\n // set the search so we can track if it changed between loads\n _lastUsedSearch.current = search || undefined;\n // search works client side, and focusing the search field triggers a load of all so we don't actually\n // want to load anything when search gets changed, we just store the value for other handlers\n };\n\n return [\n {\n data,\n length: length.current,\n loadAll,\n loadPage,\n onChangeFilter: handleFilter,\n onChangeSearch: handleSearch,\n onChangeSort: handleSort,\n pageSize,\n },\n invalidate,\n ];\n}\n"],"names":["DEFAULT_PAGE_SIZE","useTableDataLoader","fetchPage","fetchAll","options","pageSize","length","React","useRef","undefined","data","setData","useState","_pendingPageRequests","_lastUsedSorting","_lastUsedFilters","_lastUsedSearch","_forceReset","loadPage","pageIndex","sorting","filters","reset","current","JSON","stringify","Promise","resolve","_temp","_finallyRethrows","_catch","then","response","currentData","nextData","Array","fill","startIndex","splice","_wasThrown","_result","e","reject","loadAll","_temp2","invalidate","handleSort","handleFilter","handleSearch","search","onChangeFilter","onChangeSearch","onChangeSort"],"mappings":"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"}
|
1
|
+
{"version":3,"file":"useTableDataLoader.js","sources":["../../../../../../../src/primitives/Table/useTableDataLoader.ts"],"sourcesContent":["import React from 'react';\nimport {\n TableColumnFilter,\n TableColumnSort,\n TableFilterHandler,\n TableServerLoadPageHandler,\n TableServerLoadAllHandler,\n TableSortHandler,\n TableSearchHandler,\n} from './types';\n\nexport const DEFAULT_PAGE_SIZE = 100;\n\nexport type useTableDataPageFetcher<TType = unknown> = (\n pageIndex: number,\n pageSize: number,\n sorting: TableColumnSort[],\n filters: TableColumnFilter[]\n) => Promise<{ data: TType[]; length: number }>;\n\nexport type useTableDataAllFetcher<TType = unknown> = (\n sorting: TableColumnSort[],\n filters: TableColumnFilter[]\n) => Promise<{ data: TType[]; length: number }>;\n\nexport type useTableDataLoaderOptions = { pageSize: number };\n\nexport type useTableDataLoaderValues<TType = unknown> = {\n data: TType[];\n length: number | undefined;\n loadAll: TableServerLoadAllHandler;\n loadPage: TableServerLoadPageHandler;\n onChangeFilter: TableFilterHandler;\n onChangeSearch: TableSearchHandler;\n onChangeSort: TableSortHandler;\n pageSize: number;\n};\n\nexport function useTableDataLoader<TType = unknown>(\n fetchPage: useTableDataPageFetcher<TType>,\n fetchAll: useTableDataAllFetcher<TType>,\n options: useTableDataLoaderOptions = { pageSize: DEFAULT_PAGE_SIZE }\n): [useTableDataLoaderValues<TType>, () => void] {\n const { pageSize } = options;\n\n // track the data length, we don't know it until the first request\n const length = React.useRef<number | undefined>(undefined);\n // data will be filled after the first request, then we'll update values in place\n const [data, setData] = React.useState<any[]>([]);\n // track which pages have been loaded to dedupe requests\n const _pendingPageRequests = React.useRef({});\n const _lastUsedSorting = React.useRef<TableColumnSort[]>([]);\n const _lastUsedFilters = React.useRef<TableColumnFilter[]>([]);\n const _lastUsedSearch = React.useRef<string>();\n const _forceReset = React.useRef(false);\n\n const loadPage = async (pageIndex: number, sorting: TableColumnSort[], filters: TableColumnFilter[]) => {\n let reset = false;\n\n // sorting or filters changed, reset everything\n if (\n _forceReset.current ||\n JSON.stringify(sorting) !== JSON.stringify(_lastUsedSorting.current) ||\n JSON.stringify(filters) !== JSON.stringify(_lastUsedFilters.current)\n ) {\n _pendingPageRequests.current = {};\n // nuke the dataset so that we \"start again\" after sorting\n reset = true;\n }\n\n if (_pendingPageRequests.current[pageIndex]) {\n // if page is already loaded/loading, abort, otherwise mark it as loading\n return;\n } else {\n _pendingPageRequests.current[pageIndex] = true;\n }\n\n _forceReset.current = false;\n // set the sorting so we can track if it changed between loads\n _lastUsedSorting.current = sorting;\n // set the filters so we can track if it changed between loads\n _lastUsedFilters.current = filters;\n\n try {\n const response = await fetchPage(pageIndex, pageSize, sorting, filters);\n\n // update state, here we do some \"magic\" to support \"load in place\"\n setData(currentData => {\n let nextData;\n\n // reset table state if:\n // - the length isn't set at all (first load)\n // - the client length and server length are different (the data changed)\n if (reset || length.current !== response.length) {\n length.current = response.length;\n nextData = Array(length.current).fill(undefined);\n } else {\n nextData = [...currentData];\n }\n\n const startIndex = pageIndex * pageSize;\n nextData.splice(startIndex, pageSize, ...response.data);\n return nextData;\n });\n } catch {\n //\n } finally {\n _pendingPageRequests.current[pageIndex] = false;\n }\n };\n\n const loadAll = async (sorting: TableColumnSort[], filters: TableColumnFilter[]) => {\n // set the sorting so we can track if it changed between loads\n _lastUsedSorting.current = sorting;\n // set the filters so we can track if it changed between loads\n _lastUsedFilters.current = filters;\n\n try {\n const response = await fetchAll(sorting, filters);\n length.current = response.length;\n\n setData(() => {\n let nextData;\n\n if (response.data.length !== response.length) {\n nextData = Array(response.length).fill(undefined);\n nextData.splice(0, response.data.length, ...response.data);\n } else {\n nextData = [...response.data];\n }\n\n return nextData;\n });\n } catch {\n //\n }\n };\n\n const invalidate = async () => {\n _forceReset.current = true;\n return loadPage(0, _lastUsedSorting.current, _lastUsedFilters.current);\n };\n\n // search works client side - it fetches all then works client side - so these handlers are a little \"weird\"\n // if a search is currently \"active\", we need to re load all because\n const handleSort = async (sorting: TableColumnSort[]) => {\n if (_lastUsedSearch.current) {\n // we're searching, which means we need to refetch all with the correct sorting applied\n loadAll(sorting, _lastUsedFilters.current);\n } else {\n // reset the page to 0 whenever sorting\n loadPage(0, sorting, _lastUsedFilters.current);\n }\n };\n const handleFilter = async (filters: TableColumnFilter[]) => {\n if (_lastUsedSearch.current) {\n // we're searching, which means we need to refetch all with the correct sorting applied\n loadAll(_lastUsedSorting.current, filters);\n } else {\n // reset the page to 0 whenever sorting\n loadPage(0, _lastUsedSorting.current, filters);\n }\n };\n const handleSearch = async (search: string | undefined) => {\n // set the search so we can track if it changed between loads\n _lastUsedSearch.current = search || undefined;\n // search works client side, and focusing the search field triggers a load of all so we don't actually\n // want to load anything when search gets changed, we just store the value for other handlers\n };\n\n return [\n {\n data,\n length: length.current,\n loadAll,\n loadPage,\n onChangeFilter: handleFilter,\n onChangeSearch: handleSearch,\n onChangeSort: handleSort,\n pageSize,\n },\n invalidate,\n ];\n}\n"],"names":["DEFAULT_PAGE_SIZE","useTableDataLoader","fetchPage","fetchAll","options","pageSize","length","React","useRef","undefined","data","setData","useState","_pendingPageRequests","_lastUsedSorting","_lastUsedFilters","_lastUsedSearch","_forceReset","loadPage","pageIndex","sorting","filters","reset","current","JSON","stringify","Promise","resolve","_temp","_finallyRethrows","_catch","then","response","currentData","nextData","Array","fill","startIndex","splice","_wasThrown","_result","e","reject","loadAll","_temp2","invalidate","handleSort","handleFilter","handleSearch","search","onChangeFilter","onChangeSearch","onChangeSort"],"mappings":"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"}
|
@@ -1,3 +1,4 @@
|
|
1
|
+
import get from 'lodash-es/get';
|
1
2
|
import { getCellValueAsString } from './columns.js';
|
2
3
|
import { isWeakContains } from './filtering.js';
|
3
4
|
|
@@ -23,8 +24,8 @@ function resetHighlightedColumnIndexes(value, table) {
|
|
23
24
|
}
|
24
25
|
}
|
25
26
|
if (column.getIsVisible() && column.columnDef.enableGlobalFilter && allowSearch) {
|
26
|
-
var
|
27
|
-
const cellValue = getCellValueAsString((
|
27
|
+
var _column$columnDef$met;
|
28
|
+
const cellValue = getCellValueAsString(get(row.original, column.id), (_column$columnDef$met = column.columnDef.meta) === null || _column$columnDef$met === void 0 ? void 0 : _column$columnDef$met.dataType);
|
28
29
|
// indexes don't map to sorted data
|
29
30
|
if (cellValue !== undefined && isWeakContains(cellValue, value)) {
|
30
31
|
indexes.push([rowIndex, columnIndex]);
|
@@ -1 +1 @@
|
|
1
|
-
{"version":3,"file":"search.js","sources":["../../../../../../../../../src/primitives/Table/useTableManager/util/search.ts"],"sourcesContent":["import { Table as ReactTable, TableMeta as ReactTableMeta } from '@tanstack/react-table';\nimport { getCellValueAsString } from './columns';\nimport { isWeakContains } from './filtering';\n\nexport function resetHighlightedColumnIndexes<TType = unknown>(value: string | undefined, table: ReactTable<TType>) {\n const tableMeta = table.options.meta as ReactTableMeta<TType>;\n let firstRowIndex: undefined | number;\n\n if (value) {\n const indexes: number[][] = [];\n const columns = table.getVisibleLeafColumns();\n const rowGrouping = table.getState().grouping;\n\n table.getRowModel().rows.forEach((row, rowIndex) => {\n columns.forEach((column, columnIndex) => {\n try {\n let allowSearch = true;\n\n if (rowGrouping?.length) {\n // if it's the grouped row, only allow search of the grouped column - because that's all that's visible\n if (row.getIsGrouped()) {\n allowSearch = column.getIsGrouped();\n }\n // otherwise for other rows, don't search the grouped column - because it isn't visible\n else if (rowGrouping.includes(column.id)) {\n allowSearch = false;\n }\n }\n\n if (column.getIsVisible() && column.columnDef.enableGlobalFilter && allowSearch) {\n const cellValue = getCellValueAsString(row.original
|
1
|
+
{"version":3,"file":"search.js","sources":["../../../../../../../../../src/primitives/Table/useTableManager/util/search.ts"],"sourcesContent":["import { Table as ReactTable, TableMeta as ReactTableMeta } from '@tanstack/react-table';\nimport get from 'lodash/get';\nimport { getCellValueAsString } from './columns';\nimport { isWeakContains } from './filtering';\n\nexport function resetHighlightedColumnIndexes<TType = unknown>(value: string | undefined, table: ReactTable<TType>) {\n const tableMeta = table.options.meta as ReactTableMeta<TType>;\n let firstRowIndex: undefined | number;\n\n if (value) {\n const indexes: number[][] = [];\n const columns = table.getVisibleLeafColumns();\n const rowGrouping = table.getState().grouping;\n\n table.getRowModel().rows.forEach((row, rowIndex) => {\n columns.forEach((column, columnIndex) => {\n try {\n let allowSearch = true;\n\n if (rowGrouping?.length) {\n // if it's the grouped row, only allow search of the grouped column - because that's all that's visible\n if (row.getIsGrouped()) {\n allowSearch = column.getIsGrouped();\n }\n // otherwise for other rows, don't search the grouped column - because it isn't visible\n else if (rowGrouping.includes(column.id)) {\n allowSearch = false;\n }\n }\n\n if (column.getIsVisible() && column.columnDef.enableGlobalFilter && allowSearch) {\n const cellValue = getCellValueAsString(get(row.original, column.id), column.columnDef.meta?.dataType);\n\n // indexes don't map to sorted data\n if (cellValue !== undefined && isWeakContains(cellValue, value)) {\n indexes.push([rowIndex, columnIndex]);\n }\n }\n } catch (e) {\n //\n }\n });\n });\n\n tableMeta.search.setHighlightedColumnIndexes(indexes);\n\n if (indexes.length) {\n firstRowIndex = indexes[0][0];\n tableMeta.search.setCurrentHighlightColumnIndex(0);\n } else {\n tableMeta.search.setCurrentHighlightColumnIndex(undefined);\n }\n } else {\n tableMeta.search.setHighlightedColumnIndexes([]);\n tableMeta.search.setCurrentHighlightColumnIndex(undefined);\n }\n\n if (firstRowIndex !== undefined) {\n tableMeta.rowActive.setRowActiveIndex(firstRowIndex);\n }\n\n return firstRowIndex;\n}\n"],"names":["resetHighlightedColumnIndexes","value","table","tableMeta","options","meta","firstRowIndex","indexes","columns","getVisibleLeafColumns","rowGrouping","getState","grouping","getRowModel","rows","forEach","row","rowIndex","column","columnIndex","allowSearch","length","getIsGrouped","includes","id","getIsVisible","columnDef","enableGlobalFilter","_column$columnDef$met","cellValue","getCellValueAsString","get","original","dataType","undefined","isWeakContains","push","e","search","setHighlightedColumnIndexes","setCurrentHighlightColumnIndex","rowActive","setRowActiveIndex"],"mappings":";;;;SAKgBA,6BAA6BA,CAAkBC,KAAyB,EAAEC,KAAwB;EAC9G,MAAMC,SAAS,GAAGD,KAAK,CAACE,OAAO,CAACC,IAA6B;EAC7D,IAAIC,aAAiC;EAErC,IAAIL,KAAK,EAAE;IACP,MAAMM,OAAO,GAAe,EAAE;IAC9B,MAAMC,OAAO,GAAGN,KAAK,CAACO,qBAAqB,EAAE;IAC7C,MAAMC,WAAW,GAAGR,KAAK,CAACS,QAAQ,EAAE,CAACC,QAAQ;IAE7CV,KAAK,CAACW,WAAW,EAAE,CAACC,IAAI,CAACC,OAAO,CAAC,CAACC,GAAG,EAAEC,QAAQ;MAC3CT,OAAO,CAACO,OAAO,CAAC,CAACG,MAAM,EAAEC,WAAW;QAChC,IAAI;UACA,IAAIC,WAAW,GAAG,IAAI;UAEtB,IAAIV,WAAW,aAAXA,WAAW,eAAXA,WAAW,CAAEW,MAAM,EAAE;;YAErB,IAAIL,GAAG,CAACM,YAAY,EAAE,EAAE;cACpBF,WAAW,GAAGF,MAAM,CAACI,YAAY,EAAE;;;iBAGlC,IAAIZ,WAAW,CAACa,QAAQ,CAACL,MAAM,CAACM,EAAE,CAAC,EAAE;cACtCJ,WAAW,GAAG,KAAK;;;UAI3B,IAAIF,MAAM,CAACO,YAAY,EAAE,IAAIP,MAAM,CAACQ,SAAS,CAACC,kBAAkB,IAAIP,WAAW,EAAE;YAAA,IAAAQ,qBAAA;YAC7E,MAAMC,SAAS,GAAGC,oBAAoB,CAACC,GAAG,CAACf,GAAG,CAACgB,QAAQ,EAAEd,MAAM,CAACM,EAAE,CAAC,GAAAI,qBAAA,GAAEV,MAAM,CAACQ,SAAS,CAACrB,IAAI,cAAAuB,qBAAA,uBAArBA,qBAAA,CAAuBK,QAAQ,CAAC;;YAGrG,IAAIJ,SAAS,KAAKK,SAAS,IAAIC,cAAc,CAACN,SAAS,EAAE5B,KAAK,CAAC,EAAE;cAC7DM,OAAO,CAAC6B,IAAI,CAAC,CAACnB,QAAQ,EAAEE,WAAW,CAAC,CAAC;;;SAGhD,CAAC,OAAOkB,CAAC,EAAE;;;OAGf,CAAC;KACL,CAAC;IAEFlC,SAAS,CAACmC,MAAM,CAACC,2BAA2B,CAAChC,OAAO,CAAC;IAErD,IAAIA,OAAO,CAACc,MAAM,EAAE;MAChBf,aAAa,GAAGC,OAAO,CAAC,CAAC,CAAC,CAAC,CAAC,CAAC;MAC7BJ,SAAS,CAACmC,MAAM,CAACE,8BAA8B,CAAC,CAAC,CAAC;KACrD,MAAM;MACHrC,SAAS,CAACmC,MAAM,CAACE,8BAA8B,CAACN,SAAS,CAAC;;GAEjE,MAAM;IACH/B,SAAS,CAACmC,MAAM,CAACC,2BAA2B,CAAC,EAAE,CAAC;IAChDpC,SAAS,CAACmC,MAAM,CAACE,8BAA8B,CAACN,SAAS,CAAC;;EAG9D,IAAI5B,aAAa,KAAK4B,SAAS,EAAE;IAC7B/B,SAAS,CAACsC,SAAS,CAACC,iBAAiB,CAACpC,aAAa,CAAC;;EAGxD,OAAOA,aAAa;AACxB;;;;"}
|
package/dist/index.css
CHANGED
@@ -1216,6 +1216,10 @@ table[data-taco='table3'][data-table-editing-mode='detailed'] td [data-taco='tex
|
|
1216
1216
|
@apply yt-focus-dark;
|
1217
1217
|
}
|
1218
1218
|
|
1219
|
+
table[data-taco='table3'] td:focus {
|
1220
|
+
@apply rounded-sm ring-2 ring-inset ring-[#4573D2];
|
1221
|
+
}
|
1222
|
+
|
1219
1223
|
table[data-taco='table3'][data-table-editing-mode] tbody tr:not([data-row-active='true']):hover td [data-taco='input'],
|
1220
1224
|
table[data-taco='table3'][data-table-editing-mode] tbody tr:not([data-row-active='true']):hover td [data-taco='textarea'],
|
1221
1225
|
table[data-taco='table3'][data-table-editing-mode] tbody tr:not([data-row-active='true']):hover td [data-taco='Select2'] {
|
@@ -1,6 +1,6 @@
|
|
1
1
|
export declare function useAugmentedFocusManager(): {
|
2
|
-
focusPrevious: () => import("@react-types/shared").FocusableElement;
|
3
|
-
focusNext: () => import("@react-types/shared").FocusableElement;
|
2
|
+
focusPrevious: (arrowNavigation?: boolean) => import("@react-types/shared").FocusableElement;
|
3
|
+
focusNext: (arrowNavigation?: boolean) => import("@react-types/shared").FocusableElement;
|
4
4
|
focusFirst: () => import("@react-types/shared").FocusableElement;
|
5
5
|
focusLast: () => import("@react-types/shared").FocusableElement;
|
6
6
|
};
|