@etsoo/react 1.7.20 → 1.7.22

package/lib/components/GridMethodRef.d.ts

@@ -1,11 +1,31 @@
+import { Align } from 'react-window';
 import { GridLoaderStates } from './GridLoader';
 /**
  * Grid method ref
  */
 export interface GridMethodRef<T> {
+    /**
+     * Delete item at the index
+     * @param index Index
+     */
+    delete(index: number): T | undefined;
+    /**
+     * Insert the item at start
+     * @param item Item
+     * @param start Start position
+     */
+    insert(item: T, start: number): void;
     /**
      * Reset
      * @param add Additional data
      */
     reset(add?: Partial<GridLoaderStates<T>>): void;
+    /**
+     * Scroll to the specified offset (scrollTop or scrollLeft, depending on the direction prop).
+     */
+    scrollToRef(scrollOffset: number): void;
+    /**
+     * Scroll to the specified item.
+     */
+    scrollToItemRef(index: number, align?: Align): void;
 }

package/lib/components/ScrollerGrid.js

@@ -134,6 +134,20 @@ export const ScrollerGrid = (props) => {
             setRows(items, true);
     };
     const instance = {
+        delete(index) {
+            const item = rows.at(index);
+            if (item) {
+                const newRows = [...rows];
+                newRows.splice(index, 1);
+                setRows(newRows);
+            }
+            return item;
+        },
+        insert(item, start) {
+            const newRows = [...rows];
+            newRows.splice(start, 0, item);
+            setRows(newRows);
+        },
         scrollTo(params) {
             var _a;
             (_a = ref.current) === null || _a === void 0 ? void 0 : _a.scrollTo(params);
@@ -142,6 +156,14 @@ export const ScrollerGrid = (props) => {
             var _a;
             (_a = ref.current) === null || _a === void 0 ? void 0 : _a.scrollToItem(params);
         },
+        scrollToRef(scrollOffset) {
+            var _a;
+            (_a = ref.current) === null || _a === void 0 ? void 0 : _a.scrollTo({ scrollLeft: 0, scrollTop: scrollOffset });
+        },
+        scrollToItemRef(index, align) {
+            var _a;
+            (_a = ref.current) === null || _a === void 0 ? void 0 : _a.scrollToItem({ rowIndex: index, align });
+        },
         select(rowIndex) {
             // Select only one item
             const selectedItems = state.selectedItems;

package/lib/components/ScrollerList.d.ts

@@ -56,7 +56,7 @@ export interface ScrollerListRef {
 /**
  * Scroller list forward ref
  */
-export interface ScrollerListForwardRef<T> extends GridMethodRef<T>, ScrollerListRef {
+export interface ScrollerListForwardRef<T> extends GridMethodRef<T> {
     /**
      * Refresh latest page data
      */

package/lib/components/ScrollerList.js

@@ -129,14 +129,28 @@ export const ScrollerList = (props) => {
     React.useImperativeHandle(mRef, () => {
         const refMethods = listRef.current;
         return {
+            delete(index) {
+                const item = rows.at(index);
+                if (item) {
+                    const newRows = [...rows];
+                    newRows.splice(index, 1);
+                    setRows(newRows);
+                }
+                return item;
+            },
+            insert(item, start) {
+                const newRows = [...rows];
+                newRows.splice(start, 0, item);
+                setRows(newRows);
+            },
             refresh() {
                 loadDataLocal(0);
             },
             reset,
-            scrollTo(scrollOffset) {
+            scrollToRef(scrollOffset) {
                 refMethods.scrollTo(scrollOffset);
             },
-            scrollToItem(index, align) {
+            scrollToItemRef(index, align) {
                 refMethods.scrollToItem(index, align);
             }
         };

package/package.json

@@ -1,6 +1,6 @@
 {
     "name": "@etsoo/react",
-    "version": "1.7.20",
+    "version": "1.7.22",
     "description": "TypeScript ReactJs UI Independent Framework",
     "main": "lib/index.js",
     "types": "lib/index.d.ts",
@@ -50,15 +50,15 @@
         "@emotion/css": "^11.11.2",
         "@emotion/react": "^11.11.1",
         "@emotion/styled": "^11.11.0",
-        "@etsoo/appscript": "^1.4.62",
+        "@etsoo/appscript": "^1.4.66",
         "@etsoo/notificationbase": "^1.1.30",
         "@etsoo/shared": "^1.2.18",
-        "@types/react": "^18.2.33",
+        "@types/react": "^18.2.34",
         "@types/react-dom": "^18.2.14",
         "@types/react-window": "^1.8.7",
         "react": "^18.2.0",
         "react-dom": "^18.2.0",
-        "react-router-dom": "^6.17.0",
+        "react-router-dom": "^6.18.0",
         "react-window": "^1.8.9"
     },
     "devDependencies": {

package/src/components/GridMethodRef.ts

@@ -1,12 +1,36 @@
+import { Align } from 'react-window';
 import { GridLoaderStates } from './GridLoader';
 
 /**
  * Grid method ref
  */
 export interface GridMethodRef<T> {
+    /**
+     * Delete item at the index
+     * @param index Index
+     */
+    delete(index: number): T | undefined;
+
+    /**
+     * Insert the item at start
+     * @param item Item
+     * @param start Start position
+     */
+    insert(item: T, start: number): void;
+
     /**
      * Reset
      * @param add Additional data
      */
     reset(add?: Partial<GridLoaderStates<T>>): void;
+
+    /**
+     * Scroll to the specified offset (scrollTop or scrollLeft, depending on the direction prop).
+     */
+    scrollToRef(scrollOffset: number): void;
+
+    /**
+     * Scroll to the specified item.
+     */
+    scrollToItemRef(index: number, align?: Align): void;
 }

package/src/components/ScrollerGrid.tsx

@@ -341,6 +341,20 @@ export const ScrollerGrid = <
     };
 
     const instance: ScrollerGridForwardRef<T> = {
+        delete(index) {
+            const item = rows.at(index);
+            if (item) {
+                const newRows = [...rows];
+                newRows.splice(index, 1);
+                setRows(newRows);
+            }
+            return item;
+        },
+        insert(item, start) {
+            const newRows = [...rows];
+            newRows.splice(start, 0, item);
+            setRows(newRows);
+        },
         scrollTo(params: { scrollLeft: number; scrollTop: number }) {
             ref.current?.scrollTo(params);
         },
@@ -351,6 +365,13 @@ export const ScrollerGrid = <
         }) {
             ref.current?.scrollToItem(params);
         },
+        scrollToRef(scrollOffset: number): void {
+            ref.current?.scrollTo({ scrollLeft: 0, scrollTop: scrollOffset });
+        },
+
+        scrollToItemRef(index: number, align?: Align): void {
+            ref.current?.scrollToItem({ rowIndex: index, align });
+        },
         select(rowIndex: number) {
             // Select only one item
             const selectedItems = state.selectedItems;

package/src/components/ScrollerList.tsx

@@ -87,9 +87,7 @@ export interface ScrollerListRef {
 /**
  * Scroller list forward ref
  */
-export interface ScrollerListForwardRef<T>
-    extends GridMethodRef<T>,
-        ScrollerListRef {
+export interface ScrollerListForwardRef<T> extends GridMethodRef<T> {
     /**
      * Refresh latest page data
      */
@@ -274,17 +272,31 @@ export const ScrollerList = <
             const refMethods = listRef.current as ScrollerListRef;
 
             return {
+                delete(index) {
+                    const item = rows.at(index);
+                    if (item) {
+                        const newRows = [...rows];
+                        newRows.splice(index, 1);
+                        setRows(newRows);
+                    }
+                    return item;
+                },
+                insert(item, start) {
+                    const newRows = [...rows];
+                    newRows.splice(start, 0, item);
+                    setRows(newRows);
+                },
                 refresh(): void {
                     loadDataLocal(0);
                 },
 
                 reset,
 
-                scrollTo(scrollOffset: number): void {
+                scrollToRef(scrollOffset: number): void {
                     refMethods.scrollTo(scrollOffset);
                 },
 
-                scrollToItem(index: number, align?: Align): void {
+                scrollToItemRef(index: number, align?: Align): void {
                     refMethods.scrollToItem(index, align);
                 }
             };