@neovici/cosmoz-queue 2.12.2 → 2.13.0

package/dist/list/more/use-more.d.ts

@@ -4,6 +4,7 @@ export interface TList$<TParams extends object, TItem extends object> {
         params: TParams;
         page: number;
         pageSize: number;
+        signal?: AbortSignal;
     }): PromiseLike<{
         items: TItem[];
         total: number;

package/dist/list/more/use-more.d.ts.map

@@ -1 +1 @@
-{"version":3,"file":"use-more.d.ts","sourceRoot":"","sources":["../../../src/list/more/use-more.ts"],"names":[],"mappings":"AAAA,OAAO,EAAE,YAAY,EAAgC,MAAM,cAAc,CAAC;AAE1E,MAAM,WAAW,MAAM,CAAC,OAAO,SAAS,MAAM,EAAE,KAAK,SAAS,MAAM;IACnE,CAAC,KAAK,EAAE;QACP,MAAM,EAAE,OAAO,CAAC;QAChB,IAAI,EAAE,MAAM,CAAC;QACb,QAAQ,EAAE,MAAM,CAAC;KACjB,GAAG,WAAW,CAAC;QAAE,KAAK,EAAE,KAAK,EAAE,CAAC;QAAC,KAAK,EAAE,MAAM,CAAA;KAAE,CAAC,CAAC;CACnD;AAED,UAAU,OAAO,CAAC,OAAO,SAAS,MAAM,EAAE,KAAK,SAAS,MAAM;IAC7D,QAAQ,CAAC,EAAE,MAAM,CAAC;IAClB,MAAM,EAAE,OAAO,CAAC;IAChB,KAAK,EAAE,MAAM,CAAC,OAAO,EAAE,KAAK,CAAC,CAAC;IAC9B,iBAAiB,EAAE,YAAY,CAAC,MAAM,GAAG,SAAS,CAAC,CAAC;CACpD;AASD,eAAO,MAAM,OAAO,GAAI,OAAO,SAAS,MAAM,EAAE,KAAK,SAAS,MAAM,EAAE,0DAKnE,OAAO,CAAC,OAAO,EAAE,KAAK,CAAC;;;CAsDzB,CAAC"}
+{"version":3,"file":"use-more.d.ts","sourceRoot":"","sources":["../../../src/list/more/use-more.ts"],"names":[],"mappings":"AAAA,OAAO,EACN,YAAY,EAKZ,MAAM,cAAc,CAAC;AAEtB,MAAM,WAAW,MAAM,CAAC,OAAO,SAAS,MAAM,EAAE,KAAK,SAAS,MAAM;IACnE,CAAC,KAAK,EAAE;QACP,MAAM,EAAE,OAAO,CAAC;QAChB,IAAI,EAAE,MAAM,CAAC;QACb,QAAQ,EAAE,MAAM,CAAC;QACjB,MAAM,CAAC,EAAE,WAAW,CAAC;KACrB,GAAG,WAAW,CAAC;QAAE,KAAK,EAAE,KAAK,EAAE,CAAC;QAAC,KAAK,EAAE,MAAM,CAAA;KAAE,CAAC,CAAC;CACnD;AAED,UAAU,OAAO,CAAC,OAAO,SAAS,MAAM,EAAE,KAAK,SAAS,MAAM;IAC7D,QAAQ,CAAC,EAAE,MAAM,CAAC;IAClB,MAAM,EAAE,OAAO,CAAC;IAChB,KAAK,EAAE,MAAM,CAAC,OAAO,EAAE,KAAK,CAAC,CAAC;IAC9B,iBAAiB,EAAE,YAAY,CAAC,MAAM,GAAG,SAAS,CAAC,CAAC;CACpD;AASD,eAAO,MAAM,OAAO,GAAI,OAAO,SAAS,MAAM,EAAE,KAAK,SAAS,MAAM,EAAE,0DAKnE,OAAO,CAAC,OAAO,EAAE,KAAK,CAAC;;;CAwEzB,CAAC"}

package/dist/list/more/use-more.js

@@ -1,4 +1,4 @@
-import { useEffect, useMemo, useState } from '@pionjs/pion';
+import { useEffect, useMemo, useRef, useState, } from '@pionjs/pion';
 export const useMore = ({ params: _params, list$, pageSize = 50, setTotalAvailable, }) => {
     const [{ page, data$, totalAvailable, params }, setData] = useState({
         page: 0,
@@ -6,6 +6,7 @@ export const useMore = ({ params: _params, list$, pageSize = 50, setTotalAvailab
         totalAvailable: Infinity,
         params: _params,
     });
+    const abortRef = useRef(null);
     const hasMore = pageSize > 0 &&
         totalAvailable < Infinity &&
         totalAvailable >= pageSize &&
@@ -17,15 +18,22 @@ export const useMore = ({ params: _params, list$, pageSize = 50, setTotalAvailab
         page: 0,
     })), [_params, list$]);
     useEffect(() => {
+        const controller = new AbortController();
+        abortRef.current = controller;
+        const { signal } = controller;
         setData(({ data$, params, page, ...thru }) => ({
             ...thru,
             params,
             page,
-            data$: Promise.resolve(data$).then((prev) => list$({
+            data$: Promise.resolve(data$).then((prev) => Promise.resolve(list$({
                 params,
                 page,
                 pageSize,
-            }).then((data) => {
+                signal,
+            }))
+                .then((data) => {
+                if (signal.aborted)
+                    return prev;
                 const totalAvailable = data.total;
                 setTotalAvailable(totalAvailable);
                 setData((s) => ({
@@ -33,8 +41,16 @@ export const useMore = ({ params: _params, list$, pageSize = 50, setTotalAvailab
                     totalAvailable,
                 }));
                 return [...prev.slice(0, page * pageSize), ...data.items];
+            })
+                .catch((error) => {
+                if (error.name === 'AbortError')
+                    return prev;
+                return Promise.reject(error);
             })),
         }));
+        return () => {
+            controller.abort();
+        };
     }, [page, params, list$, pageSize]);
     return { data$, loadMore };
 };

package/dist/queue/use-key-nav.d.ts.map

@@ -1 +1 @@
-{"version":3,"file":"use-key-nav.d.ts","sourceRoot":"","sources":["../../src/queue/use-key-nav.ts"],"names":[],"mappings":"AAKA,KAAK,GAAG,GAAG,UAAU,GAAG,OAAO,GAAG,OAAO,CAAC;yBA8B1B,4BAIb;IACF,IAAI,CAAC,EAAE,MAAM,IAAI,CAAC;IAClB,IAAI,CAAC,EAAE,MAAM,IAAI,CAAC;IAClB,SAAS,EAAE,GAAG,CAAC;CACf;AARD,wBA0CE"}
+{"version":3,"file":"use-key-nav.d.ts","sourceRoot":"","sources":["../../src/queue/use-key-nav.ts"],"names":[],"mappings":"AAKA,KAAK,GAAG,GAAG,UAAU,GAAG,OAAO,GAAG,OAAO,CAAC;yBAiC1B,4BAIb;IACF,IAAI,CAAC,EAAE,MAAM,IAAI,CAAC;IAClB,IAAI,CAAC,EAAE,MAAM,IAAI,CAAC;IAClB,SAAS,EAAE,GAAG,CAAC;CACf;AARD,wBA0CE"}

package/dist/queue/use-key-nav.js

@@ -7,7 +7,11 @@ const keys = (tab, listKeys, queueKeys) => [
     ...(['queue', 'split'].includes(tab) ? queueKeys : []),
 ];
 const overlaps = (host) => {
-    const root = host.shadowRoot, button = root.querySelector('.button-nav'), bounds = button.getBoundingClientRect();
+    const root = host.shadowRoot, button = root?.querySelector('.button-nav');
+    if (!root || !button) {
+        return false;
+    }
+    const bounds = button.getBoundingClientRect();
     return (root
         .elementFromPoint(bounds.x + bounds.width / 2, bounds.y + bounds.height / 2)
         ?.closest('.button-nav') !== button);

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "@neovici/cosmoz-queue",
-  "version": "2.12.2",
+  "version": "2.13.0",
   "description": "A reusable queue component for master-detail views with list, split, and queue modes",
   "keywords": [
     "web-components",