@economic/taco 2.22.2 → 2.24.0

package/dist/esm/packages/taco/src/primitives/Table/useTableDataLoader.js.map

@@ -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} 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    search: string | undefined\n) => Promise<{ data: TType[]; length: number }>;\n\nexport type useTableDataAllFetcher<TType = unknown> = (\n    sorting: TableColumnSort[],\n    filters: TableColumnFilter[],\n    search: string | undefined\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    onChangeSort: TableSortHandler;\n    pageSize: number;\n};\n\nexport function useTableDataLoader<TType = unknown>(\n    fetch: 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 (\n        pageIndex: number,\n        sorting: TableColumnSort[],\n        filters: TableColumnFilter[],\n        search: string | undefined\n    ) => {\n        let reset = false;\n\n        // sorting or filters changed, reset everything\n        if (\n            _forceReset.current ||\n            search !== _lastUsedSearch.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        // set the search so we can track if it changed between loads\n        _lastUsedSearch.current = search;\n\n        try {\n            const response = await fetch(pageIndex, pageSize, sorting, filters, search);\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[], search: string | undefined) => {\n        try {\n            const response = await fetchAll(sorting, filters, search);\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, _lastUsedSearch.current);\n    };\n\n    // we reset the page to 0 whenever sorting, filtering or search changes\n    const handleSort = async (sorting: TableColumnSort[]) =>\n        loadPage(0, sorting, _lastUsedFilters.current, _lastUsedSearch.current);\n    const handleFilter = async (filters: TableColumnFilter[]) =>\n        loadPage(0, _lastUsedSorting.current, filters, _lastUsedSearch.current);\n\n    return [\n        {\n            data,\n            length: length.current,\n            loadAll,\n            loadPage,\n            onChangeFilter: handleFilter,\n            onChangeSort: handleSort,\n            pageSize,\n        },\n        invalidate,\n    ];\n}\n"],"names":["DEFAULT_PAGE_SIZE"],"mappings":";;;MAUaA,iBAAiB,GAAG;;;;"}
+{"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} 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    search: string | undefined\n) => Promise<{ data: TType[]; length: number }>;\n\nexport type useTableDataAllFetcher<TType = unknown> = (\n    sorting: TableColumnSort[],\n    filters: TableColumnFilter[],\n    search: string | undefined\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    onChangeSort: TableSortHandler;\n    pageSize: number;\n};\n\nexport function useTableDataLoader<TType = unknown>(\n    fetch: 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 (\n        pageIndex: number,\n        sorting: TableColumnSort[],\n        filters: TableColumnFilter[],\n        search: string | undefined\n    ) => {\n        let reset = false;\n\n        // sorting or filters changed, reset everything\n        if (\n            _forceReset.current ||\n            search !== _lastUsedSearch.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        // set the search so we can track if it changed between loads\n        _lastUsedSearch.current = search;\n\n        try {\n            const response = await fetch(pageIndex, pageSize, sorting, filters, search);\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[], search: string | undefined) => {\n        try {\n            const response = await fetchAll(sorting, filters, search);\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, _lastUsedSearch.current);\n    };\n\n    // we reset the page to 0 whenever sorting, filtering or search changes\n    const handleSort = async (sorting: TableColumnSort[]) =>\n        loadPage(0, sorting, _lastUsedFilters.current, _lastUsedSearch.current);\n    const handleFilter = async (filters: TableColumnFilter[]) =>\n        loadPage(0, _lastUsedSorting.current, filters, _lastUsedSearch.current);\n\n    return [\n        {\n            data,\n            length: length.current,\n            loadAll,\n            loadPage,\n            onChangeFilter: handleFilter,\n            onChangeSort: handleSort,\n            pageSize,\n        },\n        invalidate,\n    ];\n}\n"],"names":["DEFAULT_PAGE_SIZE","useTableDataLoader","fetch","fetchAll","options","pageSize","length","React","useRef","undefined","data","setData","useState","_pendingPageRequests","_lastUsedSorting","_lastUsedFilters","_lastUsedSearch","_forceReset","loadPage","pageIndex","sorting","filters","search","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","onChangeFilter","onChangeSort"],"mappings":"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"}

package/dist/esm/packages/taco/src/utils/dom.js

@@ -43,10 +43,19 @@ function isElementInsideOrTriggeredFromContainer(element, container) {
   }
   return !!(container !== null && container !== void 0 && container.contains(element));
 }
-function isEventTriggeredOnInteractiveElement(eventTarget) {
-  const element = eventTarget;
+function isElementInsideOverlay(element) {
+  return !!(element !== null && element !== void 0 && element.closest('[role=dialog],[role=menu]'));
+}
+function isSiblingElementInsideSameParentOverlay(element, sibling) {
+  var _element$closest2;
+  return !!(element !== null && element !== void 0 && (_element$closest2 = element.closest('[role=dialog],[role=menu]')) !== null && _element$closest2 !== void 0 && _element$closest2.contains(sibling));
+}
+function isElementInteractive(element) {
+  if (!element) {
+    return false;
+  }
   return ['A', 'BUTTON', 'INPUT', 'TEXTAREA', 'SELECT', 'LABEL', 'OPTION'].includes(element.tagName) && !element.hidden && !element.disabled && !element.readOnly;
 }
 
-export { getIndexOfFirstChildOverflowingParent, getNextFocussableElement, isElementInsideOrTriggeredFromContainer, isEventTriggeredOnInteractiveElement };
+export { getIndexOfFirstChildOverflowingParent, getNextFocussableElement, isElementInsideOrTriggeredFromContainer, isElementInsideOverlay, isElementInteractive, isSiblingElementInsideSameParentOverlay };
 //# sourceMappingURL=dom.js.map

package/dist/esm/packages/taco/src/utils/dom.js.map

@@ -1 +1 @@
-{"version":3,"file":"dom.js","sources":["../../../../../../src/utils/dom.ts"],"sourcesContent":["export const isOverflowing = (element: HTMLElement | null) =>\n    element !== null ? element.scrollWidth > element.offsetWidth : false;\n\nexport const getIndexOfFirstChildOverflowingParent = (element: HTMLElement, overscan = 0) => {\n    let index = 0;\n    let boundaryChildIndex: number | null = null;\n    const clientRect = element.getBoundingClientRect();\n\n    for (const child of Array.from(element.children)) {\n        const right = child.getBoundingClientRect().right - clientRect.left;\n        const width = clientRect.width - overscan;\n\n        if (right > width) {\n            boundaryChildIndex = index;\n            break;\n        }\n        index++;\n    }\n\n    return boundaryChildIndex;\n};\n\nexport const getNextFocussableElement = (currentElement: HTMLElement | null) => {\n    if (!currentElement) {\n        return null;\n    }\n\n    const focussableElements = [\n        ...document.querySelectorAll<HTMLElement>(\n            'button:not([disabled]), [href]:not(link):not(script), input:not([disabled]), select:not([disabled]), textarea:not([disabled]), [tabindex]:not([tabindex=\"-1\"]):not([disabled]), details:not([disabled]), summary:not(:disabled)'\n        ),\n    ];\n    const currentElementIndex = focussableElements.indexOf(currentElement);\n\n    // If the currentElement is not in the focussable elements list or it is the last element\n    if (currentElementIndex !== -1 && currentElementIndex === focussableElements.length - 1) {\n        return null;\n    }\n\n    return focussableElements[currentElementIndex + 1];\n};\n\nconst getOverlaySelector = (element: Element | null) => {\n    switch (element?.getAttribute('role')) {\n        case 'dialog':\n            return `[aria-controls='${element.id}']`;\n\n        case 'menu':\n            return `#${element.getAttribute('aria-labelledby')}`;\n\n        default:\n            return undefined;\n    }\n};\n\nexport function isElementInsideOrTriggeredFromContainer(element: Element | null, container: Element | null) {\n    const selector = getOverlaySelector(element) ?? getOverlaySelector(element?.closest('[role=dialog],[role=menu]') ?? null);\n\n    if (selector) {\n        return !!container?.querySelector(selector);\n    }\n\n    return !!container?.contains(element);\n}\n\nexport function isEventTriggeredOnInteractiveElement(eventTarget: EventTarget | null) {\n    const element = eventTarget as HTMLElement;\n\n    return (\n        ['A', 'BUTTON', 'INPUT', 'TEXTAREA', 'SELECT', 'LABEL', 'OPTION'].includes(element.tagName) &&\n        !element.hidden &&\n        !(element as HTMLInputElement | HTMLTextAreaElement | HTMLSelectElement | HTMLButtonElement).disabled &&\n        !(element as HTMLInputElement | HTMLTextAreaElement).readOnly\n    );\n}\n"],"names":["getIndexOfFirstChildOverflowingParent","element","overscan","index","boundaryChildIndex","clientRect","getBoundingClientRect","child","Array","from","children","right","left","width","getNextFocussableElement","currentElement","focussableElements","document","querySelectorAll","currentElementIndex","indexOf","length","getOverlaySelector","getAttribute","id","undefined","isElementInsideOrTriggeredFromContainer","container","selector","_getOverlaySelector","_element$closest","closest","querySelector","contains","isEventTriggeredOnInteractiveElement","eventTarget","includes","tagName","hidden","disabled","readOnly"],"mappings":"MAGaA,qCAAqC,GAAGA,CAACC,OAAoB,EAAEC,QAAQ,GAAG,CAAC;EACpF,IAAIC,KAAK,GAAG,CAAC;EACb,IAAIC,kBAAkB,GAAkB,IAAI;EAC5C,MAAMC,UAAU,GAAGJ,OAAO,CAACK,qBAAqB,EAAE;EAElD,KAAK,MAAMC,KAAK,IAAIC,KAAK,CAACC,IAAI,CAACR,OAAO,CAACS,QAAQ,CAAC,EAAE;IAC9C,MAAMC,KAAK,GAAGJ,KAAK,CAACD,qBAAqB,EAAE,CAACK,KAAK,GAAGN,UAAU,CAACO,IAAI;IACnE,MAAMC,KAAK,GAAGR,UAAU,CAACQ,KAAK,GAAGX,QAAQ;IAEzC,IAAIS,KAAK,GAAGE,KAAK,EAAE;MACfT,kBAAkB,GAAGD,KAAK;MAC1B;;IAEJA,KAAK,EAAE;;EAGX,OAAOC,kBAAkB;AAC7B;MAEaU,wBAAwB,GAAIC,cAAkC;EACvE,IAAI,CAACA,cAAc,EAAE;IACjB,OAAO,IAAI;;EAGf,MAAMC,kBAAkB,GAAG,CACvB,GAAGC,QAAQ,CAACC,gBAAgB,CACxB,iOAAiO,CACpO,CACJ;EACD,MAAMC,mBAAmB,GAAGH,kBAAkB,CAACI,OAAO,CAACL,cAAc,CAAC;;EAGtE,IAAII,mBAAmB,KAAK,CAAC,CAAC,IAAIA,mBAAmB,KAAKH,kBAAkB,CAACK,MAAM,GAAG,CAAC,EAAE;IACrF,OAAO,IAAI;;EAGf,OAAOL,kBAAkB,CAACG,mBAAmB,GAAG,CAAC,CAAC;AACtD;AAEA,MAAMG,kBAAkB,GAAIrB,OAAuB;EAC/C,QAAQA,OAAO,aAAPA,OAAO,uBAAPA,OAAO,CAAEsB,YAAY,CAAC,MAAM,CAAC;IACjC,KAAK,QAAQ;MACT,0BAA0BtB,OAAO,CAACuB,MAAM;IAE5C,KAAK,MAAM;MACP,WAAWvB,OAAO,CAACsB,YAAY,CAAC,iBAAiB,GAAG;IAExD;MACI,OAAOE,SAAS;;AAE5B,CAAC;SAEeC,uCAAuCA,CAACzB,OAAuB,EAAE0B,SAAyB;;EACtG,MAAMC,QAAQ,IAAAC,mBAAA,GAAGP,kBAAkB,CAACrB,OAAO,CAAC,cAAA4B,mBAAA,cAAAA,mBAAA,GAAIP,kBAAkB,EAAAQ,gBAAA,GAAC7B,OAAO,aAAPA,OAAO,uBAAPA,OAAO,CAAE8B,OAAO,CAAC,2BAA2B,CAAC,cAAAD,gBAAA,cAAAA,gBAAA,GAAI,IAAI,CAAC;EAEzH,IAAIF,QAAQ,EAAE;IACV,OAAO,CAAC,EAACD,SAAS,aAATA,SAAS,eAATA,SAAS,CAAEK,aAAa,CAACJ,QAAQ,CAAC;;EAG/C,OAAO,CAAC,EAACD,SAAS,aAATA,SAAS,eAATA,SAAS,CAAEM,QAAQ,CAAChC,OAAO,CAAC;AACzC;SAEgBiC,oCAAoCA,CAACC,WAA+B;EAChF,MAAMlC,OAAO,GAAGkC,WAA0B;EAE1C,OACI,CAAC,GAAG,EAAE,QAAQ,EAAE,OAAO,EAAE,UAAU,EAAE,QAAQ,EAAE,OAAO,EAAE,QAAQ,CAAC,CAACC,QAAQ,CAACnC,OAAO,CAACoC,OAAO,CAAC,IAC3F,CAACpC,OAAO,CAACqC,MAAM,IACf,CAAErC,OAA0F,CAACsC,QAAQ,IACrG,CAAEtC,OAAkD,CAACuC,QAAQ;AAErE;;;;"}
+{"version":3,"file":"dom.js","sources":["../../../../../../src/utils/dom.ts"],"sourcesContent":["export const isOverflowing = (element: HTMLElement | null) =>\n    element !== null ? element.scrollWidth > element.offsetWidth : false;\n\nexport const getIndexOfFirstChildOverflowingParent = (element: HTMLElement, overscan = 0) => {\n    let index = 0;\n    let boundaryChildIndex: number | null = null;\n    const clientRect = element.getBoundingClientRect();\n\n    for (const child of Array.from(element.children)) {\n        const right = child.getBoundingClientRect().right - clientRect.left;\n        const width = clientRect.width - overscan;\n\n        if (right > width) {\n            boundaryChildIndex = index;\n            break;\n        }\n        index++;\n    }\n\n    return boundaryChildIndex;\n};\n\nexport const getNextFocussableElement = (currentElement: HTMLElement | null) => {\n    if (!currentElement) {\n        return null;\n    }\n\n    const focussableElements = [\n        ...document.querySelectorAll<HTMLElement>(\n            'button:not([disabled]), [href]:not(link):not(script), input:not([disabled]), select:not([disabled]), textarea:not([disabled]), [tabindex]:not([tabindex=\"-1\"]):not([disabled]), details:not([disabled]), summary:not(:disabled)'\n        ),\n    ];\n    const currentElementIndex = focussableElements.indexOf(currentElement);\n\n    // If the currentElement is not in the focussable elements list or it is the last element\n    if (currentElementIndex !== -1 && currentElementIndex === focussableElements.length - 1) {\n        return null;\n    }\n\n    return focussableElements[currentElementIndex + 1];\n};\n\nconst getOverlaySelector = (element: Element | null) => {\n    switch (element?.getAttribute('role')) {\n        case 'dialog':\n            return `[aria-controls='${element.id}']`;\n\n        case 'menu':\n            return `#${element.getAttribute('aria-labelledby')}`;\n\n        default:\n            return undefined;\n    }\n};\n\nexport function isElementInsideOrTriggeredFromContainer(element: Element | null, container: Element | null) {\n    const selector = getOverlaySelector(element) ?? getOverlaySelector(element?.closest('[role=dialog],[role=menu]') ?? null);\n\n    if (selector) {\n        return !!container?.querySelector(selector);\n    }\n\n    return !!container?.contains(element);\n}\n\nexport function isElementInsideOverlay(element: Element | null) {\n    return !!element?.closest('[role=dialog],[role=menu]');\n}\n\nexport function isSiblingElementInsideSameParentOverlay(element: Element | null, sibling: Element | null) {\n    return !!element?.closest('[role=dialog],[role=menu]')?.contains(sibling);\n}\n\nexport function isElementInteractive(element: Element | null) {\n    if (!element) {\n        return false;\n    }\n\n    return (\n        ['A', 'BUTTON', 'INPUT', 'TEXTAREA', 'SELECT', 'LABEL', 'OPTION'].includes(element.tagName) &&\n        !(element as HTMLElement).hidden &&\n        !(element as HTMLInputElement | HTMLTextAreaElement | HTMLSelectElement | HTMLButtonElement).disabled &&\n        !(element as HTMLInputElement | HTMLTextAreaElement).readOnly\n    );\n}\n"],"names":["getIndexOfFirstChildOverflowingParent","element","overscan","index","boundaryChildIndex","clientRect","getBoundingClientRect","child","Array","from","children","right","left","width","getNextFocussableElement","currentElement","focussableElements","document","querySelectorAll","currentElementIndex","indexOf","length","getOverlaySelector","getAttribute","id","undefined","isElementInsideOrTriggeredFromContainer","container","selector","_getOverlaySelector","_element$closest","closest","querySelector","contains","isElementInsideOverlay","isSiblingElementInsideSameParentOverlay","sibling","_element$closest2","isElementInteractive","includes","tagName","hidden","disabled","readOnly"],"mappings":"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"}

package/dist/esm/packages/taco/src/utils/hooks/useTruncated.js

@@ -1,18 +1,18 @@
 import React__default from 'react';
 
-const isTruncated = targetElement => {
+const isElementTruncated = targetElement => {
   if (targetElement !== null) {
     return targetElement.offsetWidth < targetElement.scrollWidth;
   }
   return false;
 };
 const useTruncated = (element, deps = []) => {
-  const [truncated, setTruncated] = React__default.useState(isTruncated(element));
+  const [isTruncated, setIsTruncated] = React__default.useState(isElementTruncated(element));
   React__default.useEffect(() => {
-    setTruncated(isTruncated(element));
+    setIsTruncated(isElementTruncated(element));
   }, [element, ...deps]);
   return {
-    truncated
+    isTruncated
   };
 };
 

package/dist/esm/packages/taco/src/utils/hooks/useTruncated.js.map

@@ -1 +1 @@
-{"version":3,"file":"useTruncated.js","sources":["../../../../../../../src/utils/hooks/useTruncated.tsx"],"sourcesContent":["import React from 'react';\n\nconst isTruncated = (targetElement: HTMLElement | null) => {\n    if (targetElement !== null) {\n        return targetElement.offsetWidth < targetElement.scrollWidth;\n    }\n\n    return false;\n};\n\nexport const useTruncated = (element: HTMLElement | null, deps: any[] = []) => {\n    const [truncated, setTruncated] = React.useState<boolean>(isTruncated(element));\n\n    React.useEffect(() => {\n        setTruncated(isTruncated(element));\n    }, [element, ...deps]);\n\n    return { truncated };\n};\n"],"names":["isTruncated","targetElement","offsetWidth","scrollWidth","useTruncated","element","deps","truncated","setTruncated","React","useState","useEffect"],"mappings":";;AAEA,MAAMA,WAAW,GAAIC,aAAiC;EAClD,IAAIA,aAAa,KAAK,IAAI,EAAE;IACxB,OAAOA,aAAa,CAACC,WAAW,GAAGD,aAAa,CAACE,WAAW;;EAGhE,OAAO,KAAK;AAChB,CAAC;MAEYC,YAAY,GAAGA,CAACC,OAA2B,EAAEC,OAAc,EAAE;EACtE,MAAM,CAACC,SAAS,EAAEC,YAAY,CAAC,GAAGC,cAAK,CAACC,QAAQ,CAAUV,WAAW,CAACK,OAAO,CAAC,CAAC;EAE/EI,cAAK,CAACE,SAAS,CAAC;IACZH,YAAY,CAACR,WAAW,CAACK,OAAO,CAAC,CAAC;GACrC,EAAE,CAACA,OAAO,EAAE,GAAGC,IAAI,CAAC,CAAC;EAEtB,OAAO;IAAEC;GAAW;AACxB;;;;"}
+{"version":3,"file":"useTruncated.js","sources":["../../../../../../../src/utils/hooks/useTruncated.tsx"],"sourcesContent":["import React from 'react';\n\nconst isElementTruncated = (targetElement: HTMLElement | null) => {\n    if (targetElement !== null) {\n        return targetElement.offsetWidth < targetElement.scrollWidth;\n    }\n\n    return false;\n};\n\nexport const useTruncated = (element: HTMLElement | null, deps: any[] = []) => {\n    const [isTruncated, setIsTruncated] = React.useState<boolean>(isElementTruncated(element));\n\n    React.useEffect(() => {\n        setIsTruncated(isElementTruncated(element));\n    }, [element, ...deps]);\n\n    return { isTruncated };\n};\n"],"names":["isElementTruncated","targetElement","offsetWidth","scrollWidth","useTruncated","element","deps","isTruncated","setIsTruncated","React","useState","useEffect"],"mappings":";;AAEA,MAAMA,kBAAkB,GAAIC,aAAiC;EACzD,IAAIA,aAAa,KAAK,IAAI,EAAE;IACxB,OAAOA,aAAa,CAACC,WAAW,GAAGD,aAAa,CAACE,WAAW;;EAGhE,OAAO,KAAK;AAChB,CAAC;MAEYC,YAAY,GAAGA,CAACC,OAA2B,EAAEC,OAAc,EAAE;EACtE,MAAM,CAACC,WAAW,EAAEC,cAAc,CAAC,GAAGC,cAAK,CAACC,QAAQ,CAAUV,kBAAkB,CAACK,OAAO,CAAC,CAAC;EAE1FI,cAAK,CAACE,SAAS,CAAC;IACZH,cAAc,CAACR,kBAAkB,CAACK,OAAO,CAAC,CAAC;GAC9C,EAAE,CAACA,OAAO,EAAE,GAAGC,IAAI,CAAC,CAAC;EAEtB,OAAO;IAAEC;GAAa;AAC1B;;;;"}

package/dist/esm/packages/taco/src/utils/keyboard.js

@@ -1,4 +1,4 @@
-import { isEventTriggeredOnInteractiveElement } from './dom.js';
+import { isElementInteractive } from './dom.js';
 
 function isPressingMetaKey(event) {
   return isMacOs() ? event.metaKey : event.ctrlKey;
@@ -19,7 +19,7 @@ function shouldTriggerShortcut(event, key) {
 }
 function createShortcutKeyDownHandler(key, handler, stopPropagation = true) {
   return function (event) {
-    if (event.target !== event.currentTarget && isEventTriggeredOnInteractiveElement(event.target) && !isPressingMetaKey(event)) {
+    if (event.target !== event.currentTarget && isElementInteractive(event.target) && !isPressingMetaKey(event)) {
       return;
     }
     const condition = shouldTriggerShortcut(event, key);

package/dist/esm/packages/taco/src/utils/keyboard.js.map

@@ -1 +1 @@
-{"version":3,"file":"keyboard.js","sources":["../../../../../../src/utils/keyboard.ts"],"sourcesContent":["import React from 'react';\nimport { isEventTriggeredOnInteractiveElement } from './dom';\n\nexport type KeyDownHandlerOptions = { key: string; meta?: boolean; shift?: boolean };\n\nexport function isPressingMetaKey<T = Element>(event: KeyboardEvent | React.KeyboardEvent<T>) {\n    return isMacOs() ? event.metaKey : event.ctrlKey;\n}\n\nexport function shouldTriggerShortcut<T = Element>(\n    event: KeyboardEvent | React.KeyboardEvent<T>,\n    key: string | KeyDownHandlerOptions\n) {\n    const keyOptions: KeyDownHandlerOptions = typeof key === 'string' ? { key, meta: false, shift: false } : key;\n\n    if (\n        (keyOptions.meta && (isMacOs() ? !event.metaKey : !event.ctrlKey)) ||\n        (!keyOptions.meta && (isMacOs() ? event.metaKey : event.ctrlKey))\n    ) {\n        return false;\n    }\n\n    if ((keyOptions.shift && !event.shiftKey) || (keyOptions.shift === false && event.shiftKey)) {\n        return false;\n    }\n\n    return event.key.toLowerCase() === keyOptions.key.toLowerCase();\n}\n\nexport function createShortcutKeyDownHandler<T = Element>(\n    key: string | KeyDownHandlerOptions,\n    handler: (event: KeyboardEvent | React.KeyboardEvent<T>) => void,\n    stopPropagation = true\n) {\n    return function (event: KeyboardEvent | React.KeyboardEvent<T>) {\n        if (\n            event.target !== event.currentTarget &&\n            isEventTriggeredOnInteractiveElement(event.target as HTMLElement) &&\n            !isPressingMetaKey(event)\n        ) {\n            return;\n        }\n\n        const condition = shouldTriggerShortcut(event, key);\n\n        if (condition) {\n            if (stopPropagation) {\n                // stops react handlers bubbling up to global\n                event.stopPropagation();\n                // stops global handlers bubbling up to other global\n                (event as KeyboardEvent).stopImmediatePropagation?.();\n            }\n\n            handler(event);\n        }\n    };\n}\n\nexport const isMacOs = () => window?.navigator.userAgent.includes('Mac');\n"],"names":["isPressingMetaKey","event","isMacOs","metaKey","ctrlKey","shouldTriggerShortcut","key","keyOptions","meta","shift","shiftKey","toLowerCase","createShortcutKeyDownHandler","handler","stopPropagation","target","currentTarget","isEventTriggeredOnInteractiveElement","condition","_event$stopImmediateP","stopImmediatePropagation","call","_window","window","navigator","userAgent","includes"],"mappings":";;SAKgBA,iBAAiBA,CAAcC,KAA6C;EACxF,OAAOC,OAAO,EAAE,GAAGD,KAAK,CAACE,OAAO,GAAGF,KAAK,CAACG,OAAO;AACpD;SAEgBC,qBAAqBA,CACjCJ,KAA6C,EAC7CK,GAAmC;EAEnC,MAAMC,UAAU,GAA0B,OAAOD,GAAG,KAAK,QAAQ,GAAG;IAAEA,GAAG;IAAEE,IAAI,EAAE,KAAK;IAAEC,KAAK,EAAE;GAAO,GAAGH,GAAG;EAE5G,IACKC,UAAU,CAACC,IAAI,KAAKN,OAAO,EAAE,GAAG,CAACD,KAAK,CAACE,OAAO,GAAG,CAACF,KAAK,CAACG,OAAO,CAAC,IAChE,CAACG,UAAU,CAACC,IAAI,KAAKN,OAAO,EAAE,GAAGD,KAAK,CAACE,OAAO,GAAGF,KAAK,CAACG,OAAO,CAAE,EACnE;IACE,OAAO,KAAK;;EAGhB,IAAKG,UAAU,CAACE,KAAK,IAAI,CAACR,KAAK,CAACS,QAAQ,IAAMH,UAAU,CAACE,KAAK,KAAK,KAAK,IAAIR,KAAK,CAACS,QAAS,EAAE;IACzF,OAAO,KAAK;;EAGhB,OAAOT,KAAK,CAACK,GAAG,CAACK,WAAW,EAAE,KAAKJ,UAAU,CAACD,GAAG,CAACK,WAAW,EAAE;AACnE;SAEgBC,4BAA4BA,CACxCN,GAAmC,EACnCO,OAAgE,EAChEC,eAAe,GAAG,IAAI;EAEtB,OAAO,UAAUb,KAA6C;IAC1D,IACIA,KAAK,CAACc,MAAM,KAAKd,KAAK,CAACe,aAAa,IACpCC,oCAAoC,CAAChB,KAAK,CAACc,MAAqB,CAAC,IACjE,CAACf,iBAAiB,CAACC,KAAK,CAAC,EAC3B;MACE;;IAGJ,MAAMiB,SAAS,GAAGb,qBAAqB,CAACJ,KAAK,EAAEK,GAAG,CAAC;IAEnD,IAAIY,SAAS,EAAE;MACX,IAAIJ,eAAe,EAAE;QAAA,IAAAK,qBAAA;;QAEjBlB,KAAK,CAACa,eAAe,EAAE;;QAEtB,CAAAK,qBAAA,GAAAlB,KAAuB,CAACmB,wBAAwB,cAAAD,qBAAA,uBAAhDA,qBAAA,CAAAE,IAAA,CAAApB,MAAoD;;MAGzDY,OAAO,CAACZ,KAAK,CAAC;;GAErB;AACL;MAEaC,OAAO,GAAGA;EAAA,IAAAoB,OAAA;EAAA,QAAAA,OAAA,GAAMC,MAAM,cAAAD,OAAA,uBAANA,OAAA,CAAQE,SAAS,CAACC,SAAS,CAACC,QAAQ,CAAC,KAAK,CAAC;AAAA;;;;"}
+{"version":3,"file":"keyboard.js","sources":["../../../../../../src/utils/keyboard.ts"],"sourcesContent":["import React from 'react';\nimport { isElementInteractive } from './dom';\n\nexport type KeyDownHandlerOptions = { key: string; meta?: boolean; shift?: boolean };\n\nexport function isPressingMetaKey<T = Element>(event: KeyboardEvent | React.KeyboardEvent<T>) {\n    return isMacOs() ? event.metaKey : event.ctrlKey;\n}\n\nexport function shouldTriggerShortcut<T = Element>(\n    event: KeyboardEvent | React.KeyboardEvent<T>,\n    key: string | KeyDownHandlerOptions\n) {\n    const keyOptions: KeyDownHandlerOptions = typeof key === 'string' ? { key, meta: false, shift: false } : key;\n\n    if (\n        (keyOptions.meta && (isMacOs() ? !event.metaKey : !event.ctrlKey)) ||\n        (!keyOptions.meta && (isMacOs() ? event.metaKey : event.ctrlKey))\n    ) {\n        return false;\n    }\n\n    if ((keyOptions.shift && !event.shiftKey) || (keyOptions.shift === false && event.shiftKey)) {\n        return false;\n    }\n\n    return event.key.toLowerCase() === keyOptions.key.toLowerCase();\n}\n\nexport function createShortcutKeyDownHandler<T = Element>(\n    key: string | KeyDownHandlerOptions,\n    handler: (event: KeyboardEvent | React.KeyboardEvent<T>) => void,\n    stopPropagation = true\n) {\n    return function (event: KeyboardEvent | React.KeyboardEvent<T>) {\n        if (\n            event.target !== event.currentTarget &&\n            isElementInteractive(event.target as HTMLElement) &&\n            !isPressingMetaKey(event)\n        ) {\n            return;\n        }\n\n        const condition = shouldTriggerShortcut(event, key);\n\n        if (condition) {\n            if (stopPropagation) {\n                // stops react handlers bubbling up to global\n                event.stopPropagation();\n                // stops global handlers bubbling up to other global\n                (event as KeyboardEvent).stopImmediatePropagation?.();\n            }\n\n            handler(event);\n        }\n    };\n}\n\nexport const isMacOs = () => window?.navigator.userAgent.includes('Mac');\n"],"names":["isPressingMetaKey","event","isMacOs","metaKey","ctrlKey","shouldTriggerShortcut","key","keyOptions","meta","shift","shiftKey","toLowerCase","createShortcutKeyDownHandler","handler","stopPropagation","target","currentTarget","isElementInteractive","condition","_event$stopImmediateP","stopImmediatePropagation","call","_window","window","navigator","userAgent","includes"],"mappings":";;SAKgBA,iBAAiBA,CAAcC,KAA6C;EACxF,OAAOC,OAAO,EAAE,GAAGD,KAAK,CAACE,OAAO,GAAGF,KAAK,CAACG,OAAO;AACpD;SAEgBC,qBAAqBA,CACjCJ,KAA6C,EAC7CK,GAAmC;EAEnC,MAAMC,UAAU,GAA0B,OAAOD,GAAG,KAAK,QAAQ,GAAG;IAAEA,GAAG;IAAEE,IAAI,EAAE,KAAK;IAAEC,KAAK,EAAE;GAAO,GAAGH,GAAG;EAE5G,IACKC,UAAU,CAACC,IAAI,KAAKN,OAAO,EAAE,GAAG,CAACD,KAAK,CAACE,OAAO,GAAG,CAACF,KAAK,CAACG,OAAO,CAAC,IAChE,CAACG,UAAU,CAACC,IAAI,KAAKN,OAAO,EAAE,GAAGD,KAAK,CAACE,OAAO,GAAGF,KAAK,CAACG,OAAO,CAAE,EACnE;IACE,OAAO,KAAK;;EAGhB,IAAKG,UAAU,CAACE,KAAK,IAAI,CAACR,KAAK,CAACS,QAAQ,IAAMH,UAAU,CAACE,KAAK,KAAK,KAAK,IAAIR,KAAK,CAACS,QAAS,EAAE;IACzF,OAAO,KAAK;;EAGhB,OAAOT,KAAK,CAACK,GAAG,CAACK,WAAW,EAAE,KAAKJ,UAAU,CAACD,GAAG,CAACK,WAAW,EAAE;AACnE;SAEgBC,4BAA4BA,CACxCN,GAAmC,EACnCO,OAAgE,EAChEC,eAAe,GAAG,IAAI;EAEtB,OAAO,UAAUb,KAA6C;IAC1D,IACIA,KAAK,CAACc,MAAM,KAAKd,KAAK,CAACe,aAAa,IACpCC,oBAAoB,CAAChB,KAAK,CAACc,MAAqB,CAAC,IACjD,CAACf,iBAAiB,CAACC,KAAK,CAAC,EAC3B;MACE;;IAGJ,MAAMiB,SAAS,GAAGb,qBAAqB,CAACJ,KAAK,EAAEK,GAAG,CAAC;IAEnD,IAAIY,SAAS,EAAE;MACX,IAAIJ,eAAe,EAAE;QAAA,IAAAK,qBAAA;;QAEjBlB,KAAK,CAACa,eAAe,EAAE;;QAEtB,CAAAK,qBAAA,GAAAlB,KAAuB,CAACmB,wBAAwB,cAAAD,qBAAA,uBAAhDA,qBAAA,CAAAE,IAAA,CAAApB,MAAoD;;MAGzDY,OAAO,CAACZ,KAAK,CAAC;;GAErB;AACL;MAEaC,OAAO,GAAGA;EAAA,IAAAoB,OAAA;EAAA,QAAAA,OAAA,GAAMC,MAAM,cAAAD,OAAA,uBAANA,OAAA,CAAQE,SAAS,CAACC,SAAS,CAACC,QAAQ,CAAC,KAAK,CAAC;AAAA;;;;"}

package/dist/hooks/useLocalStorage.d.ts

@@ -1 +1,2 @@
-export declare const useLocalStorage: <TType>(key?: string | undefined, initialValue?: TType | undefined) => [TType, (value: TType) => void, () => void];
+import React from 'react';
+export declare const useLocalStorage: <TType>(key?: string | undefined, initialValue?: TType | undefined) => [TType, React.Dispatch<React.SetStateAction<TType>>, () => void];

package/dist/index.css

@@ -282,51 +282,9 @@
     @apply font-semibold;
 }
 
-[data-taco='scrollable-list'].yt-list--multiselect li:first-child {
-    @apply border-grey-100 border-b-2 pl-4; /* Listbox max-height is dependant on this border-bottom-width value! */
-}
-
-[data-taco='scrollable-list'] li > [data-taco='icon'] {
-    @apply mr-2;
-}
-
-[data-taco='scrollable-list']:not([readonly]) li:not([disabled]):hover {
-    @apply wcag-grey-200;
-}
-
-[data-taco='scrollable-list']:not([readonly]) li:not([disabled]):hover [data-taco='icon'] {
-    @apply wcag-grey-200;
-}
-
-[data-taco='scrollable-list'] li:focus,
-[data-taco='scrollable-list']:not(.yt-list--multiselect) li[aria-selected='true'],
-[data-taco='scrollable-list'] li[data-focused='true'] {
-    @apply wcag-blue-500;
-}
-
-[data-taco='scrollable-list'] li:focus [data-taco='icon'],
-[data-taco='scrollable-list']:not(.yt-list--multiselect) li[aria-selected='true'] [data-taco='icon'],
-[data-taco='scrollable-list'] li[data-focused='true'] [data-taco='icon'] {
-    @apply wcag-blue-500;
-}
-
-[data-taco='scrollable-list'][readonly] li {
-    @apply cursor-not-allowed;
-}
-
-[data-taco='scrollable-list'] li[disabled],
-[data-taco='scrollable-list'][disabled] li[aria-selected='true'] {
-    @apply cursor-not-allowed text-black text-opacity-25;
-}
-
-[data-taco='scrollable-list'] li.yt-list__empty,
-[data-taco='scrollable-list'] li.yt-list__empty:hover,
-[data-taco='scrollable-list'] li.yt-list__empty:focus {
-    @apply text-grey-700 flex w-full items-center overflow-hidden bg-white px-3 italic;
-}
-
-[data-taco='scrollable-list'] li.yt-list__empty [data-taco='spinner'] {
-    @apply mr-2 mt-2 h-5 w-5 opacity-75;
+[data-taco='card'] [data-taco='report'],
+[data-taco='card'] [data-taco='table2'] {
+    @apply !border-0;
 }
 
 [data-taco='spinner'] svg circle {
@@ -404,6 +362,53 @@
     stroke: currentColor;
 }
 
+[data-taco='scrollable-list'].yt-list--multiselect li:first-child {
+    @apply border-grey-100 border-b-2 pl-4; /* Listbox max-height is dependant on this border-bottom-width value! */
+}
+
+[data-taco='scrollable-list'] li > [data-taco='icon'] {
+    @apply mr-2;
+}
+
+[data-taco='scrollable-list']:not([readonly]) li:not([disabled]):hover {
+    @apply wcag-grey-200;
+}
+
+[data-taco='scrollable-list']:not([readonly]) li:not([disabled]):hover [data-taco='icon'] {
+    @apply wcag-grey-200;
+}
+
+[data-taco='scrollable-list'] li:focus,
+[data-taco='scrollable-list']:not(.yt-list--multiselect) li[aria-selected='true'],
+[data-taco='scrollable-list'] li[data-focused='true'] {
+    @apply wcag-blue-500;
+}
+
+[data-taco='scrollable-list'] li:focus [data-taco='icon'],
+[data-taco='scrollable-list']:not(.yt-list--multiselect) li[aria-selected='true'] [data-taco='icon'],
+[data-taco='scrollable-list'] li[data-focused='true'] [data-taco='icon'] {
+    @apply wcag-blue-500;
+}
+
+[data-taco='scrollable-list'][readonly] li {
+    @apply cursor-not-allowed;
+}
+
+[data-taco='scrollable-list'] li[disabled],
+[data-taco='scrollable-list'][disabled] li[aria-selected='true'] {
+    @apply cursor-not-allowed text-black text-opacity-25;
+}
+
+[data-taco='scrollable-list'] li.yt-list__empty,
+[data-taco='scrollable-list'] li.yt-list__empty:hover,
+[data-taco='scrollable-list'] li.yt-list__empty:focus {
+    @apply text-grey-700 flex w-full items-center overflow-hidden bg-white px-3 italic;
+}
+
+[data-taco='scrollable-list'] li.yt-list__empty [data-taco='spinner'] {
+    @apply mr-2 mt-2 h-5 w-5 opacity-75;
+}
+
 [data-taco='combobox'] > [aria-expanded='true'] + [role='dialog'] > ul,
 [data-taco='combobox'] > [aria-expanded='true'] + [role='dialog'] > ul:hover {
     @apply border-blue-500;
@@ -574,9 +579,13 @@ table[data-taco='report'] tfoot {
     /* z-indexes & layout */
     @apply sticky bottom-0 isolate z-20;
     /* grid */
-    @apply col-span-full grid auto-rows-min grid-cols-[subgrid];
+    @apply col-span-full grid grid-cols-[subgrid] grid-rows-[calc(theme(spacing.10)_+_2px)];
 }
 
+table[data-taco='report'] tfoot > tr {
+        @apply grid-rows-[calc(theme(spacing.10)_+_2px)];
+    }
+
 table[data-taco='report'] tbody {
     /* z-indexes & layout */
     @apply isolate z-10;
@@ -903,88 +912,80 @@ table[data-taco='report'][data-table-font-size='large']
 }
 
 /* row/cell backgrounds -- we have to be specific so that nested tables don't inherit */
-
 /* normal rows */
-table[data-taco='report'] > tbody > tr:not([data-row-selected='true']) > td {
-        @apply bg-white;
-    }
+table[data-taco='report'] > tbody > tr:not([data-row-selected]) > td {
+            @apply bg-white;
+        }
+table[data-taco='report'] > tbody > tr:not([data-row-selected]):hover > td,
+        table[data-taco='report'] > tbody > tr:not([data-row-selected])[data-row-active] > td,
+        table[data-taco='report'] > tbody > tr:not([data-row-selected])[data-row-group] > td {
+            --table-row-actions-shadow: theme(colors.grey.100);
+            @apply bg-grey-100;
+        }
 /* search highlighting */
-table[data-taco='report'] > tbody > tr:not([data-row-selected='true']) > td[data-cell-highlighted='true'] {
-            @apply bg-[#e9f2ff];
+table[data-taco='report'] > tbody > tr:not([data-row-selected]) > td[data-cell-highlighted='true'] {
+            --table-row-actions-shadow: #e9f2ff;
+            @apply !bg-[#e9f2ff];
         }
-table[data-taco='report'] > tbody > tr:not([data-row-selected='true']) > td[data-cell-highlighted='current'] {
-            @apply !bg-[#bfd9ff];
+table[data-taco='report'] > tbody > tr:not([data-row-selected]) > td[data-cell-highlighted='current'] {
+            --table-row-actions-shadow: #bdd7fc;
+            @apply !bg-[#bdd7fc];
+        }
+/* selected rows */
+table[data-taco='report'] > tbody > tr[data-row-selected] > td {
+            @apply bg-blue-100;
+        }
+table[data-taco='report'] > tbody > tr[data-row-selected]:hover > td,
+        table[data-taco='report'] > tbody > tr[data-row-selected][data-row-active] > td,
+        table[data-taco='report'] > tbody > tr[data-row-selected][data-row-group] > td {
+            --table-row-actions-shadow: #d6e3f6;
+            @apply bg-[#d6e3f6];
         }
-table[data-taco='report'] > tbody > tr:not([data-row-selected='true'])[data-row-group] > td {
-        @apply bg-grey-100;
-    }
-table[data-taco='report'] > tbody > tr:not([data-row-selected='true']):hover > td,
-    table[data-taco='report'] > tbody > tr:not([data-row-selected='true'])[data-row-active='true'] > td,
-    table[data-taco='report'] > tbody > tr:not([data-row-selected='true'])[data-row-active='true']:hover > td {
-        --table-row-actions-shadow: theme(colors.grey.100);
-        @apply bg-grey-100;
-    }
 /* search highlighting */
-table[data-taco='report'] > tbody > tr:not([data-row-selected='true']):hover > td[data-cell-highlighted='true'], table[data-taco='report'] > tbody > tr:not([data-row-selected='true'])[data-row-active='true'] > td[data-cell-highlighted='true'], table[data-taco='report'] > tbody > tr:not([data-row-selected='true'])[data-row-active='true']:hover > td[data-cell-highlighted='true'] {
-            @apply bg-[#e2ebf8];
+table[data-taco='report'] > tbody > tr[data-row-selected] > td[data-cell-highlighted] {
+            --table-row-actions-shadow: #b4d2fd;
+            @apply !bg-[#b4d2fd];
         }
-/* normal rows when focus is inside the table */
-table[data-taco='report']:focus-within > tbody > tr[data-row-active='true']:not([data-row-selected='true']) > td {
-    --table-row-actions-shadow: theme(colors.grey.200);
-    @apply !bg-grey-200;
-}
 
-/* normal rows when hover is paused */
-table[data-taco='report'][data-table-pause-hover='true'] > tbody > tr:not([data-row-selected='true']):hover:not([data-row-active='true']) > td {
-        --table-row-actions-shadow: theme(colors.white);
-        @apply !bg-white;
-    }
-table[data-taco='report'][data-table-pause-hover='true'] > tbody > tr:not([data-row-selected='true']):hover[data-row-active='true'] > td {
-        --table-row-actions-shadow: theme(colors.grey.200);
-        @apply !bg-grey-200;
-    }
+/* normal rows */
+
+table[data-taco='report']:focus-within > tbody > tr:not([data-row-selected])[data-row-active] > td {
+            --table-row-actions-shadow: theme(colors.grey.200);
+            @apply bg-grey-200;
+        }
 
 /* selected rows */
-table[data-taco='report'] > tbody > tr[data-row-selected='true'] > td {
-        @apply bg-blue-100;
-    }
-/* search highlighting */
-table[data-taco='report'] > tbody > tr[data-row-selected='true'] > td[data-cell-highlighted='true'] {
-            @apply bg-[#d0e4ff];
+
+table[data-taco='report']:focus-within > tbody > tr[data-row-selected][data-row-active] > td {
+            --table-row-actions-shadow: #ccd8eb;
+            @apply bg-[#ccd8eb];
         }
-table[data-taco='report'] > tbody > tr[data-row-selected='true'] > td[data-cell-highlighted='current'] {
-            @apply !bg-[#b6d4ff];
+
+/* normal rows */
+
+table[data-taco='report'][data-table-pause-hover='true'] > tbody > tr:hover:not([data-row-selected]):not([data-row-active]) > td {
+            --table-row-actions-shadow: theme(colors.white);
+            @apply bg-white;
         }
-table[data-taco='report'] > tbody > tr[data-row-selected='true']:hover > td,
-    table[data-taco='report'] > tbody > tr[data-row-selected='true'][data-row-active='true'] > td,
-    table[data-taco='report'] > tbody > tr[data-row-selected='true'][data-row-active='true']:hover > td {
-        --table-row-actions-shadow: #d6e3f6;
-        @apply bg-[#D6E3F6];
-    }
-/* search highlighting */
-table[data-taco='report'] > tbody > tr[data-row-selected='true']:hover > td[data-cell-highlighted='true'], table[data-taco='report'] > tbody > tr[data-row-selected='true'][data-row-active='true'] > td[data-cell-highlighted='true'], table[data-taco='report'] > tbody > tr[data-row-selected='true'][data-row-active='true']:hover > td[data-cell-highlighted='true'] {
-            @apply bg-[#cadef9];
+
+table[data-taco='report'][data-table-pause-hover='true'] > tbody > tr:hover:not([data-row-selected])[data-row-active] > td {
+            --table-row-actions-shadow: theme(colors.grey.200);
+            @apply bg-grey-200;
         }
-table[data-taco='report'] > tbody > tr[data-row-selected='true']:hover > td[data-cell-highlighted='current'], table[data-taco='report'] > tbody > tr[data-row-selected='true'][data-row-active='true'] > td[data-cell-highlighted='current'], table[data-taco='report'] > tbody > tr[data-row-selected='true'][data-row-active='true']:hover > td[data-cell-highlighted='current'] {
-            @apply !bg-[#b4d2fd];
+
+/* selected rows */
+
+table[data-taco='report'][data-table-pause-hover='true'] > tbody > tr:hover[data-row-selected]:not([data-row-active]) > td {
+            --table-row-actions-shadow: theme(colors.blue.100);
+            @apply bg-blue-100;
         }
-/* selected rows when focus is inside the table */
-table[data-taco='report']:focus-within > tbody > tr[data-row-active='true'][data-row-selected='true'] > td {
-    --table-row-actions-shadow: #ccd8eb;
-    @apply bg-[#CCD8EB];
-}
-/* selected rows when hover is paused */
-table[data-taco='report'][data-table-pause-hover='true'] > tbody > tr[data-row-selected='true']:hover:not([data-row-active='true']) > td {
-        --table-row-actions-shadow: theme(colors.blue.100);
-        @apply !bg-blue-100;
-    }
-table[data-taco='report'][data-table-pause-hover='true'] > tbody > tr[data-row-selected='true']:hover[data-row-active='true'] > td {
-        --table-row-actions-shadow: #ccd8eb;
-        @apply !bg-[#CCD8EB];
-    }
 
-/* row metadata */
+table[data-taco='report'][data-table-pause-hover='true'] > tbody > tr:hover[data-row-selected][data-row-active] > td {
+            --table-row-actions-shadow: #ccd8eb;
+            @apply bg-[#CCD8EB];
+        }
 
+/* row metadata */
 table[data-taco='report'] tbody tr[data-row-meta-layout='heading']:not([data-row-group='true']) td {
     @apply !border-b-0 border-t font-bold;
 }
@@ -1335,7 +1336,7 @@ table[data-taco='report'] [data-cell-id^='__'] {
 }
 
 [data-font-size='small'] [role='cell'] [data-taco='tag'] {
-    @apply !-my-1;
+    @apply h-4 min-h-[theme(spacing.4)];
 }
 
 [data-font-size='small'] [role='cell'] [data-taco='Select2'],
@@ -1391,7 +1392,7 @@ table[data-taco='report'] [data-cell-id^='__'] {
     }
 
 /* When cell is editable and highlighted, the padding should apply to highlight wrapper and remove 1px border-width,
-       because it should take all the available space in the cell */
+   because it should take all the available space in the cell */
 
 [data-font-size='small'] [role='cell'][data-editable][data-highlighted='true'] [data-taco='highlight'] {
         @apply px-[calc(var(--table3-cell-padding-x)_-_6px_-_1px)];
@@ -1414,8 +1415,8 @@ table[data-taco='report'] [data-cell-id^='__'] {
     @apply !-my-0.5;
 }
 
-[data-font-size='medium'] [role='cell'] [data-taco='tag'] {
-    @apply !-my-0.5;
+[data-font-size='medium'] [role='cell'] [data-taco='Select2'] {
+    @apply !px-2;
 }
 
 [data-font-size='medium'] [role='cell'] [data-taco='Select2'],
@@ -1430,7 +1431,7 @@ table[data-taco='report'] [data-cell-id^='__'] {
     }
 
 /* When cell is editable and highlighted, the padding should apply to highlight wrapper and remove 1px border-width,
-       because it should take all the available space in the cell */
+   because it should take all the available space in the cell */
 
 [data-font-size='medium'] [role='cell'][data-editable][data-highlighted='true'] [data-taco='highlight'] {
         @apply px-[calc(var(--table3-cell-padding-x)_-_8px_-_1px)];
@@ -1460,8 +1461,8 @@ table[data-taco='report'] [data-cell-id^='__'] {
     @apply !-my-0.5;
 }
 
-[data-font-size='large'] [role='cell'] [data-taco='tag'] {
-    @apply !-my-0.5;
+[data-font-size='large'] [role='cell'] [data-taco='Select2'] {
+    @apply !px-2.5;
 }
 
 [data-font-size='large'] [role='cell'] [data-taco='Select2'],
@@ -1502,7 +1503,7 @@ table[data-taco='report'] [data-cell-id^='__'] {
     }
 
 /* When cell is editable and highlighted, the padding should apply to highlight wrapper and remove 1px border-width,
-       because it should take all the available space in the cell */
+   because it should take all the available space in the cell */
 
 [data-font-size='large'] [role='cell'][data-editable][data-highlighted='true'] [data-taco='highlight'] {
         @apply px-[calc(var(--table3-cell-padding-x)_-_10px_-_1px)];
@@ -1520,3 +1521,9 @@ table[data-taco='report'] [data-cell-id^='__'] {
 [data-font-size='large'] [role='columnheader'] button {
     @apply !text-sm;
 }
+
+/* When spinner is rendered in the last cell of the table, it slightly pushes the edge of the table(while rotating),
+   and making horisontal scroll bar jump */
+[data-editing='true'] [role='cell']:last-child [data-taco='spinner'] {
+    overflow: hidden;
+}

package/dist/index.d.ts

@@ -55,6 +55,7 @@ export * from './components/Header/Header';
 export * from './components/Layout/Layout';
 export * from './components/Navigation2/Navigation2';
 export * as CollectionPrimitive from './primitives/Collection/Collection';
+export * from './primitives/Table/useTableDataLoader';
 export * from './utils/date';
 export * from './utils/keyboard';
 export * from './utils/mergeRefs';

package/dist/primitives/Table/types.d.ts

@@ -100,10 +100,20 @@ export declare type TableSettings = {
     fontSize?: TableFontSize;
     grouping?: ReactTableGroupingState;
     rowHeight?: TableRowHeight;
-    showWarningWhenPrintingLargeDataset?: boolean;
     searchQuery?: string;
     sorting?: ReactTableSortingState;
 };
+export declare type EnableSettingsOptions = {
+    columnOrder: boolean;
+    columnPinning: boolean;
+    columnSizing: boolean;
+    columnVisibility: boolean;
+    excludeUnmatchedRecordsInSearch: boolean;
+    fontSize: boolean;
+    grouping: boolean;
+    rowHeight: boolean;
+    sorting: boolean;
+};
 export declare type TableFeatureProps = {
     enableFiltering?: boolean;
     enableSearch?: boolean;
@@ -123,7 +133,7 @@ export declare type TableFeatureProps = {
     enableRowClick?: boolean;
     enableRowGoto?: boolean;
     enableRowHeight?: boolean;
-    enableSettings?: boolean;
+    enableSaveSettings?: boolean | Partial<EnableSettingsOptions>;
 };
 export declare type useTableInternalColumn<TType = unknown> = {
     header?: (info: ReactTableHeaderContext<TType, unknown>) => JSX.Element | string | null;

package/dist/primitives/Table/useTable/features/useTablePrinting.d.ts

@@ -1,8 +1,15 @@
 import React from 'react';
-export declare function useTablePrinting(isEnabled?: boolean, defaultIsWarningVisible?: boolean): {
+declare type TablePrintSettings = {
+    allRows: boolean;
+    orientation: 'portrait' | 'landscape';
+    size: 'A3' | 'A4' | 'A5' | 'letter' | 'legal';
+    splitGroups: boolean;
+};
+export declare function useTablePrinting(isEnabled: boolean | undefined, tableId: string): {
     isEnabled: boolean;
     isPrinting: boolean;
     setIsPrinting: React.Dispatch<React.SetStateAction<boolean>>;
-    isWarningVisibleForLargeDatasets: boolean;
-    setIsWarningVisibleForLargeDatasets: React.Dispatch<React.SetStateAction<boolean>>;
+    settings: TablePrintSettings;
+    setSetting: (key: "allRows" | "orientation" | "size" | "splitGroups", value: any) => void;
 };
+export {};

package/dist/primitives/Table/useTable/features/useTableSettings.d.ts

@@ -1,3 +1,3 @@
-import { TableSettings, TableSettingsHandler } from '../../types';
+import { EnableSettingsOptions, TableSettings, TableSettingsHandler } from '../../types';
 export declare function useUniqueTableId(tableId: string): string;
-export declare function useTableSettings(isEnabled: boolean | undefined, id: string, defaultSettings: TableSettings | undefined, onChangeSettings: TableSettingsHandler | undefined): [TableSettings, TableSettingsHandler];
+export declare function useTableSettings(isEnabled: boolean | Partial<EnableSettingsOptions> | undefined, id: string, defaultSettings: TableSettings | undefined, onChangeSettings: TableSettingsHandler | undefined): [TableSettings, TableSettingsHandler];

package/dist/primitives/Table/useTable/useTable.d.ts

@@ -22,6 +22,7 @@ declare module '@tanstack/table-core' {
         columnOrdering: ReturnType<typeof useTableColumnOrdering>;
         fontSize: ReturnType<typeof useTableFontSize>;
         footer: ReturnType<typeof useTableFooter>;
+        length: number;
         printing: ReturnType<typeof useTablePrinting>;
         rowActions: ReturnType<typeof useTableRowActions>;
         rowActive: ReturnType<typeof useTableRowActive>;
@@ -50,8 +51,8 @@ declare module '@tanstack/table-core' {
     }
 }
 export declare function useTable<TType = unknown, TMeta = {}>(props: useTableProps<TType>, ref: React.RefObject<TableRef>, meta?: Partial<ReactTableMeta<TType>> & TMeta, internalColumns?: useTableInternalColumns<TType>): {
+    id: string;
     instance: import("@tanstack/react-table").Table<TType>;
-    length: number;
     meta: ReactTableMeta<TType> & TMeta;
     state: import("@tanstack/react-table").TableState;
 };

package/dist/primitives/Table/useTable/util/settings.d.ts

@@ -8,6 +8,5 @@ export declare function getSettings<TType = unknown>(table: ReactTable<TType>):
     fontSize: "small" | "medium" | "large" | undefined;
     grouping: import("@tanstack/react-table").GroupingState | undefined;
     rowHeight: "medium" | "short" | "tall" | "extra-tall" | undefined;
-    showWarningWhenPrintingLargeDataset: boolean;
     sorting: import("@tanstack/react-table").SortingState;
 };