@etsoo/materialui 1.1.10 → 1.1.11

package/lib/DnDList.d.ts

@@ -17,7 +17,7 @@ export declare const DnDItemStyle: (index: number, isDragging: boolean, theme: T
 /**
  * DnD list forward ref
  */
-export interface DnDListRef<D extends object> {
+export interface DnDListRef<D extends object, K extends DataTypes.Keys<D>> {
     /**
      * Add item
      * @param item New item
@@ -39,6 +39,10 @@ export interface DnDListRef<D extends object> {
      * @param index Index
      */
     editItem(newItem: D, index: number): boolean;
+    /**
+     * Get deleted ids
+     */
+    getDeletedIds(): D[K][];
     /**
      * Get all items
      */
@@ -71,7 +75,7 @@ export interface DnDListPros<D extends object, K extends DataTypes.Keys<D>> {
     /**
      * Methods ref
      */
-    mRef?: React.Ref<DnDListRef<D>>;
+    mRef?: React.Ref<DnDListRef<D, K>>;
     /**
      * Data change handler
      */

package/lib/DnDList.js

@@ -57,6 +57,7 @@ export function DnDList(props) {
     // States
     const [items, setItems] = React.useState([]);
     const [activeId, setActiveId] = React.useState();
+    const deletedIds = React.useRef([]);
     const doFormChange = (newItems) => {
         if (onFormChange)
             onFormChange(newItems !== null && newItems !== void 0 ? newItems : items);
@@ -141,10 +142,18 @@ export function DnDList(props) {
                 // Clone
                 const newItems = [...items];
                 // Remove the item
-                newItems.splice(index, 1);
+                const deleted = newItems.splice(index, 1);
+                deleted.forEach((d) => {
+                    const id = d[keyField];
+                    if (!deletedIds.current.includes(id))
+                        deletedIds.current.push(id);
+                });
                 // Update the state
                 changeItems(newItems);
             },
+            getDeletedIds() {
+                return deletedIds.current;
+            },
             getItems() {
                 return items;
             }
@@ -166,6 +175,7 @@ export function DnDList(props) {
     };
     React.useEffect(() => {
         setItems(props.items);
+        deletedIds.current = [];
     }, [props.items]);
     const children = (React.createElement(DndContext, { onDragStart: handleDragStart, onDragEnd: handleDragEnd },
         React.createElement(SortableContext, { items: items, strategy: verticalListSortingStrategy }, items.map((item, index) => {

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "@etsoo/materialui",
-  "version": "1.1.10",
+  "version": "1.1.11",
   "description": "TypeScript Material-UI Implementation",
   "main": "lib/index.js",
   "types": "lib/index.d.ts",

package/src/DnDList.tsx

@@ -79,7 +79,7 @@ export const DnDItemStyle = (
 /**
  * DnD list forward ref
  */
-export interface DnDListRef<D extends object> {
+export interface DnDListRef<D extends object, K extends DataTypes.Keys<D>> {
   /**
    * Add item
    * @param item New item
@@ -105,6 +105,11 @@ export interface DnDListRef<D extends object> {
    */
   editItem(newItem: D, index: number): boolean;
 
+  /**
+   * Get deleted ids
+   */
+  getDeletedIds(): D[K][];
+
   /**
    * Get all items
    */
@@ -148,7 +153,7 @@ export interface DnDListPros<D extends object, K extends DataTypes.Keys<D>> {
   /**
    * Methods ref
    */
-  mRef?: React.Ref<DnDListRef<D>>;
+  mRef?: React.Ref<DnDListRef<D, K>>;
 
   /**
    * Data change handler
@@ -200,6 +205,7 @@ export function DnDList<
   // States
   const [items, setItems] = React.useState<D[]>([]);
   const [activeId, setActiveId] = React.useState<UniqueIdentifier>();
+  const deletedIds = React.useRef<D[K][]>([]);
 
   const doFormChange = (newItems?: D[]) => {
     if (onFormChange) onFormChange(newItems ?? items);
@@ -316,12 +322,20 @@ export function DnDList<
           const newItems = [...items];
 
           // Remove the item
-          newItems.splice(index, 1);
+          const deleted = newItems.splice(index, 1);
+          deleted.forEach((d) => {
+            const id = d[keyField];
+            if (!deletedIds.current.includes(id)) deletedIds.current.push(id);
+          });
 
           // Update the state
           changeItems(newItems);
         },
 
+        getDeletedIds() {
+          return deletedIds.current;
+        },
+
         getItems() {
           return items;
         }
@@ -355,6 +369,7 @@ export function DnDList<
 
   React.useEffect(() => {
     setItems(props.items);
+    deletedIds.current = [];
   }, [props.items]);
 
   const children = (