@economic/taco 2.0.4 → 2.0.5

package/dist/components/Table3/hooks/useTableDataLoader.d.ts

@@ -20,4 +20,4 @@ export declare type useTable3DataFetcherValues<TType = unknown> = {
     onSort: Table3SortHandler;
     pageSize: number;
 };
-export declare function useTable3DataLoader<TType = unknown>(fetch: useTable3DataFetcher<TType>, fetchAll: useTable3AllDataFetcher<TType>, options?: useTable3DataOptions): useTable3DataFetcherValues<TType>;
+export declare function useTable3DataLoader<TType = unknown>(fetch: useTable3DataFetcher<TType>, fetchAll: useTable3AllDataFetcher<TType>, options?: useTable3DataOptions): [useTable3DataFetcherValues<TType>, () => void];

package/dist/esm/index.css

@@ -669,27 +669,27 @@
 }
 
 /* hovered row */
-[data-pause-hover='false'] [role='row']:hover [role='cell'] {
+[data-pause-hover='false'] [data-taco='table2-body'] [role='row']:hover [role='cell'] {
     @apply bg-grey-100;
 }
 
 /* current row */
-[role='row'][data-current='true'] [role='cell'] {
+[data-taco='table2-body'] [role='row'][data-current='true'] [role='cell'] {
     @apply bg-grey-200;
 }
 
 /* selected row */
-[role='row'][data-selected='true']:not([aria-grabbed='true']) [role='cell'] {
+[data-taco='table2-body'] [role='row'][data-selected='true']:not([aria-grabbed='true']) [role='cell'] {
     @apply !bg-blue-100;
 }
 
 /* dragging row */
-[role='row'][aria-grabbed='true'] [role='cell'] {
+[data-taco='table2-body'] [role='row'][aria-grabbed='true'] [role='cell'] {
     @apply !wcag-blue-500;
 }
 
 /* error row */
-[role='row'][data-error='true'] [role='cell'] {
+[data-taco='table2-body'] [role='row'][data-error='true'] [role='cell'] {
     @apply !bg-red-100/30;
 }
 

package/dist/esm/packages/taco/src/components/Table3/hooks/useTableDataLoader.js

@@ -13,14 +13,14 @@ function useTable3DataLoader(fetch, fetchAll, options = {
   const [data, setData] = React__default.useState([]);
   // track which pages have been loaded to dedupe requests
   const _pendingPageRequests = React__default.useRef({});
-  const lastUsedSorting = React__default.useRef([]);
-  const lastUsedFilters = React__default.useRef([]);
-  const lastUsedSearch = React__default.useRef();
+  const _lastUsedSorting = React__default.useRef([]);
+  const _lastUsedFilters = React__default.useRef([]);
+  const _lastUsedSearch = React__default.useRef();
   const loadPage = function (pageIndex, sorting, filters, search) {
     try {
       let reset = false;
       // sorting or filters changed, reset everything
-      if (JSON.stringify(sorting) !== JSON.stringify(lastUsedSorting.current) || JSON.stringify(filters) !== JSON.stringify(lastUsedFilters.current) || search !== lastUsedSearch.current) {
+      if (search !== _lastUsedSearch.current || JSON.stringify(sorting) !== JSON.stringify(_lastUsedSorting.current) || JSON.stringify(filters) !== JSON.stringify(_lastUsedFilters.current)) {
         _pendingPageRequests.current = {};
         // nuke the dataset so that we "start again" after sorting
         reset = true;
@@ -32,11 +32,11 @@ function useTable3DataLoader(fetch, fetchAll, options = {
         _pendingPageRequests.current[pageIndex] = true;
       }
       // set the sorting so we can track if it changed between loads
-      lastUsedSorting.current = sorting;
+      _lastUsedSorting.current = sorting;
       // set the filters so we can track if it changed between loads
-      lastUsedFilters.current = filters;
+      _lastUsedFilters.current = filters;
       // set the search so we can track if it changed between loads
-      lastUsedSearch.current = search;
+      _lastUsedSearch.current = search;
       const _temp = _finallyRethrows(function () {
         return _catch(function () {
           return Promise.resolve(fetch(pageIndex, pageSize, sorting, filters, search)).then(function (response) {
@@ -90,29 +90,30 @@ function useTable3DataLoader(fetch, fetchAll, options = {
       return Promise.reject(e);
     }
   };
+  const invalidate = () => setData(Array(length.current).fill(undefined));
   // we reset the page to 0 whenever sorting, filtering or search changes
   const handleSort = function (sorting) {
     try {
-      return loadPage(0, sorting, lastUsedFilters.current, lastUsedSearch.current);
+      return loadPage(0, sorting, _lastUsedFilters.current, _lastUsedSearch.current);
     } catch (e) {
       return Promise.reject(e);
     }
   };
   const handleFilter = function (filters) {
     try {
-      return loadPage(0, lastUsedSorting.current, filters, lastUsedSearch.current);
+      return loadPage(0, _lastUsedSorting.current, filters, _lastUsedSearch.current);
     } catch (e) {
       return Promise.reject(e);
     }
   };
   const handleSearch = function (query) {
     try {
-      return loadAll(lastUsedSorting.current, lastUsedFilters.current, query);
+      return loadAll(_lastUsedSorting.current, _lastUsedFilters.current, query);
     } catch (e) {
       return Promise.reject(e);
     }
   };
-  return {
+  return [{
     data,
     length: length.current,
     loadAll,
@@ -121,7 +122,7 @@ function useTable3DataLoader(fetch, fetchAll, options = {
     onSearch: handleSearch,
     onSort: handleSort,
     pageSize
-  };
+  }, invalidate];
 }
 
 export { useTable3DataLoader };

package/dist/esm/packages/taco/src/components/Table3/hooks/useTableDataLoader.js.map

@@ -1 +1 @@
-{"version":3,"file":"useTableDataLoader.js","sources":["../../../../../../../../src/components/Table3/hooks/useTableDataLoader.ts"],"sourcesContent":["import React from 'react';\nimport {\n    ColumnFilter,\n    Table3ColumnSort,\n    Table3FilterHandler,\n    Table3LoadAllHandler,\n    Table3LoadPageHandler,\n    Table3SearchHandler,\n    Table3SortHandler,\n} from '../types';\n\nexport type useTable3DataFetcher<TType = unknown> = (\n    pageIndex: number,\n    pageSize: number,\n    sorting: Table3ColumnSort[],\n    filters: ColumnFilter[],\n    search: string | undefined\n) => Promise<{ data: TType[]; length: number }>;\n\nexport type useTable3AllDataFetcher<TType = unknown> = (\n    sorting: Table3ColumnSort[],\n    filters: ColumnFilter[],\n    search: string | undefined\n) => Promise<{ data: TType[]; length: number }>;\n\nexport type useTable3DataOptions = { pageSize: number };\n\nexport type useTable3DataFetcherValues<TType = unknown> = {\n    data: TType[];\n    length: number | undefined;\n    loadAll: Table3LoadAllHandler;\n    loadPage: Table3LoadPageHandler;\n    onFilter: Table3FilterHandler;\n    onSearch: Table3SearchHandler;\n    onSort: Table3SortHandler;\n    pageSize: number;\n};\n\nexport function useTable3DataLoader<TType = unknown>(\n    fetch: useTable3DataFetcher<TType>,\n    fetchAll: useTable3AllDataFetcher<TType>,\n    options: useTable3DataOptions = { pageSize: 100 }\n): useTable3DataFetcherValues<TType> {\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<Table3ColumnSort[]>([]);\n    const lastUsedFilters = React.useRef<ColumnFilter[]>([]);\n    const lastUsedSearch = React.useRef<string>();\n\n    const loadPage = async (\n        pageIndex: number,\n        sorting: Table3ColumnSort[],\n        filters: ColumnFilter[],\n        search: string | undefined\n    ) => {\n        let reset = false;\n\n        // sorting or filters changed, reset everything\n        if (\n            JSON.stringify(sorting) !== JSON.stringify(lastUsedSorting.current) ||\n            JSON.stringify(filters) !== JSON.stringify(lastUsedFilters.current) ||\n            search !== lastUsedSearch.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        // 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: Table3ColumnSort[], filters: ColumnFilter[], 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    // we reset the page to 0 whenever sorting, filtering or search changes\n    const handleSort = async (sorting: Table3ColumnSort[]) =>\n        loadPage(0, sorting, lastUsedFilters.current, lastUsedSearch.current);\n    const handleFilter = async (filters: ColumnFilter[]) => loadPage(0, lastUsedSorting.current, filters, lastUsedSearch.current);\n    const handleSearch = async (query: string) => loadAll(lastUsedSorting.current, lastUsedFilters.current, query);\n\n    return {\n        data,\n        length: length.current,\n        loadAll,\n        loadPage,\n        onFilter: handleFilter,\n        onSearch: handleSearch as any,\n        onSort: handleSort,\n        pageSize,\n    };\n}\n"],"names":["useTable3DataLoader","fetch","fetchAll","options","pageSize","length","React","useRef","undefined","data","setData","useState","_pendingPageRequests","lastUsedSorting","lastUsedFilters","lastUsedSearch","loadPage","pageIndex","sorting","filters","search","reset","JSON","stringify","current","response","currentData","nextData","Array","fill","startIndex","splice","loadAll","handleSort","handleFilter","handleSearch","query","onFilter","onSearch","onSort"],"mappings":"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"}
+{"version":3,"file":"useTableDataLoader.js","sources":["../../../../../../../../src/components/Table3/hooks/useTableDataLoader.ts"],"sourcesContent":["import React from 'react';\nimport {\n    ColumnFilter,\n    Table3ColumnSort,\n    Table3FilterHandler,\n    Table3LoadAllHandler,\n    Table3LoadPageHandler,\n    Table3SearchHandler,\n    Table3SortHandler,\n} from '../types';\n\nexport type useTable3DataFetcher<TType = unknown> = (\n    pageIndex: number,\n    pageSize: number,\n    sorting: Table3ColumnSort[],\n    filters: ColumnFilter[],\n    search: string | undefined\n) => Promise<{ data: TType[]; length: number }>;\n\nexport type useTable3AllDataFetcher<TType = unknown> = (\n    sorting: Table3ColumnSort[],\n    filters: ColumnFilter[],\n    search: string | undefined\n) => Promise<{ data: TType[]; length: number }>;\n\nexport type useTable3DataOptions = { pageSize: number };\n\nexport type useTable3DataFetcherValues<TType = unknown> = {\n    data: TType[];\n    length: number | undefined;\n    loadAll: Table3LoadAllHandler;\n    loadPage: Table3LoadPageHandler;\n    onFilter: Table3FilterHandler;\n    onSearch: Table3SearchHandler;\n    onSort: Table3SortHandler;\n    pageSize: number;\n};\n\nexport function useTable3DataLoader<TType = unknown>(\n    fetch: useTable3DataFetcher<TType>,\n    fetchAll: useTable3AllDataFetcher<TType>,\n    options: useTable3DataOptions = { pageSize: 100 }\n): [useTable3DataFetcherValues<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<Table3ColumnSort[]>([]);\n    const _lastUsedFilters = React.useRef<ColumnFilter[]>([]);\n    const _lastUsedSearch = React.useRef<string>();\n\n    const loadPage = async (\n        pageIndex: number,\n        sorting: Table3ColumnSort[],\n        filters: ColumnFilter[],\n        search: string | undefined\n    ) => {\n        let reset = false;\n\n        // sorting or filters changed, reset everything\n        if (\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        // 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: Table3ColumnSort[], filters: ColumnFilter[], 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 = () => setData(Array(length.current).fill(undefined));\n\n    // we reset the page to 0 whenever sorting, filtering or search changes\n    const handleSort = async (sorting: Table3ColumnSort[]) =>\n        loadPage(0, sorting, _lastUsedFilters.current, _lastUsedSearch.current);\n    const handleFilter = async (filters: ColumnFilter[]) =>\n        loadPage(0, _lastUsedSorting.current, filters, _lastUsedSearch.current);\n    const handleSearch = async (query: string) => loadAll(_lastUsedSorting.current, _lastUsedFilters.current, query);\n\n    return [\n        {\n            data,\n            length: length.current,\n            loadAll,\n            loadPage,\n            onFilter: handleFilter,\n            onSearch: handleSearch as any,\n            onSort: handleSort,\n            pageSize,\n        },\n        invalidate,\n    ];\n}\n"],"names":["useTable3DataLoader","fetch","fetchAll","options","pageSize","length","React","useRef","undefined","data","setData","useState","_pendingPageRequests","_lastUsedSorting","_lastUsedFilters","_lastUsedSearch","loadPage","pageIndex","sorting","filters","search","reset","current","JSON","stringify","response","currentData","nextData","Array","fill","startIndex","splice","loadAll","invalidate","handleSort","handleFilter","handleSearch","query","onFilter","onSearch","onSort"],"mappings":"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"}

package/dist/index.css

@@ -669,27 +669,27 @@
 }
 
 /* hovered row */
-[data-pause-hover='false'] [role='row']:hover [role='cell'] {
+[data-pause-hover='false'] [data-taco='table2-body'] [role='row']:hover [role='cell'] {
     @apply bg-grey-100;
 }
 
 /* current row */
-[role='row'][data-current='true'] [role='cell'] {
+[data-taco='table2-body'] [role='row'][data-current='true'] [role='cell'] {
     @apply bg-grey-200;
 }
 
 /* selected row */
-[role='row'][data-selected='true']:not([aria-grabbed='true']) [role='cell'] {
+[data-taco='table2-body'] [role='row'][data-selected='true']:not([aria-grabbed='true']) [role='cell'] {
     @apply !bg-blue-100;
 }
 
 /* dragging row */
-[role='row'][aria-grabbed='true'] [role='cell'] {
+[data-taco='table2-body'] [role='row'][aria-grabbed='true'] [role='cell'] {
     @apply !wcag-blue-500;
 }
 
 /* error row */
-[role='row'][data-error='true'] [role='cell'] {
+[data-taco='table2-body'] [role='row'][data-error='true'] [role='cell'] {
     @apply !bg-red-100/30;
 }
 

package/dist/taco.cjs.development.js

@@ -19874,14 +19874,14 @@ function useTable3DataLoader(fetch, fetchAll, options = {
   const [data, setData] = React__default.useState([]);
   // track which pages have been loaded to dedupe requests
   const _pendingPageRequests = React__default.useRef({});
-  const lastUsedSorting = React__default.useRef([]);
-  const lastUsedFilters = React__default.useRef([]);
-  const lastUsedSearch = React__default.useRef();
+  const _lastUsedSorting = React__default.useRef([]);
+  const _lastUsedFilters = React__default.useRef([]);
+  const _lastUsedSearch = React__default.useRef();
   const loadPage = function (pageIndex, sorting, filters, search) {
     try {
       let reset = false;
       // sorting or filters changed, reset everything
-      if (JSON.stringify(sorting) !== JSON.stringify(lastUsedSorting.current) || JSON.stringify(filters) !== JSON.stringify(lastUsedFilters.current) || search !== lastUsedSearch.current) {
+      if (search !== _lastUsedSearch.current || JSON.stringify(sorting) !== JSON.stringify(_lastUsedSorting.current) || JSON.stringify(filters) !== JSON.stringify(_lastUsedFilters.current)) {
         _pendingPageRequests.current = {};
         // nuke the dataset so that we "start again" after sorting
         reset = true;
@@ -19893,11 +19893,11 @@ function useTable3DataLoader(fetch, fetchAll, options = {
         _pendingPageRequests.current[pageIndex] = true;
       }
       // set the sorting so we can track if it changed between loads
-      lastUsedSorting.current = sorting;
+      _lastUsedSorting.current = sorting;
       // set the filters so we can track if it changed between loads
-      lastUsedFilters.current = filters;
+      _lastUsedFilters.current = filters;
       // set the search so we can track if it changed between loads
-      lastUsedSearch.current = search;
+      _lastUsedSearch.current = search;
       const _temp = _finallyRethrows(function () {
         return _catch(function () {
           return Promise.resolve(fetch(pageIndex, pageSize, sorting, filters, search)).then(function (response) {
@@ -19951,29 +19951,30 @@ function useTable3DataLoader(fetch, fetchAll, options = {
       return Promise.reject(e);
     }
   };
+  const invalidate = () => setData(Array(length.current).fill(undefined));
   // we reset the page to 0 whenever sorting, filtering or search changes
   const handleSort = function (sorting) {
     try {
-      return loadPage(0, sorting, lastUsedFilters.current, lastUsedSearch.current);
+      return loadPage(0, sorting, _lastUsedFilters.current, _lastUsedSearch.current);
     } catch (e) {
       return Promise.reject(e);
     }
   };
   const handleFilter = function (filters) {
     try {
-      return loadPage(0, lastUsedSorting.current, filters, lastUsedSearch.current);
+      return loadPage(0, _lastUsedSorting.current, filters, _lastUsedSearch.current);
     } catch (e) {
       return Promise.reject(e);
     }
   };
   const handleSearch = function (query) {
     try {
-      return loadAll(lastUsedSorting.current, lastUsedFilters.current, query);
+      return loadAll(_lastUsedSorting.current, _lastUsedFilters.current, query);
     } catch (e) {
       return Promise.reject(e);
     }
   };
-  return {
+  return [{
     data,
     length: length.current,
     loadAll,
@@ -19982,7 +19983,7 @@ function useTable3DataLoader(fetch, fetchAll, options = {
     onSearch: handleSearch,
     onSort: handleSort,
     pageSize
-  };
+  }, invalidate];
 }
 
 function Column$5(_) {