fix(core): update

ts_web/elements/dees-table.ts

@@ -99,6 +99,11 @@ export class DeesTable<T> extends DeesElement {
   })
   public displayFunction: TDisplayFunction = (itemArg: T) => itemArg as any;
 
+  @property({
+    attribute: false,
+  })
+  public reverseDisplayFunction: (itemArg: any) => T = (itemArg: any) => itemArg as T;
+
   @property({
     type: Object,
   })
@@ -112,6 +117,8 @@ export class DeesTable<T> extends DeesElement {
   public files: File[] = [];
   public fileWeakMap = new WeakMap();
 
+  public itemChangeSubject = new domtools.plugins.smartrx.rxjs.Subject();
+
   constructor() {
     super();
   }
@@ -259,7 +266,7 @@ export class DeesTable<T> extends DeesElement {
         font-family: inherit;
         font-size: inherit;
         font-weight: inherit;
-        padding: 0px 6px
+        padding: 0px 6px;
       }
 
       .action {
@@ -535,35 +542,34 @@ export class DeesTable<T> extends DeesElement {
     // Get the table element
     const table = this.shadowRoot.querySelector('table');
     if (!table) return;
-  
+
     // Create a colgroup if it doesn't exist
     let colgroup = table.querySelector('colgroup');
     if (!colgroup) {
       colgroup = document.createElement('colgroup');
       table.insertBefore(colgroup, table.firstChild);
     }
-  
+
     // Get the first row's cells to measure the widths
     const cells = table.rows[0].cells;
-  
+
     for (let i = 0; i < cells.length; i++) {
       const cell = cells[i];
-  
+
       // Get computed width
       const width = window.getComputedStyle(cell).width;
-  
+
       // Check if there's already a <col> for this cell
       let col = colgroup.children[i] as HTMLElement;
       if (!col) {
         col = document.createElement('col');
         colgroup.appendChild(col);
       }
-  
+
       // Set the width
       col.style.width = width;
     }
   }
-  
 
   getActionsForType(typeArg: ITableAction['type'][0]) {
     const actions: ITableAction[] = [];
@@ -574,22 +580,34 @@ export class DeesTable<T> extends DeesElement {
     return actions;
   }
 
-  handleCellEditing(event: Event, item: T, key: string) {
+  handleCellEditing(event: Event, itemArg: T, key: string) {
     const target = event.target as HTMLElement;
-
+    const transformedItem = this.displayFunction(itemArg);
+    const initialValue = (transformedItem[key] as unknown as string) || '';
     // Create an input element
     const input = document.createElement('input');
     input.type = 'text';
-    input.value = (item[key] as unknown as string) || '';
+    input.value = initialValue;
+
+    const blurInput = (blurArg = true, saveArg = false) => {
+      if (blurArg) {
+        input.blur();
+      }
+      if (saveArg) {
+        itemArg[key] = input.value as any; // Convert string to T (you might need better type casting depending on your data structure)
+        target.innerHTML = input.value; // Update the cell's display
+      } else {
+        target.innerHTML = initialValue;
+      }
+    };
 
     // When the input loses focus or the Enter key is pressed, update the data
     input.addEventListener('blur', () => {
-      item[key] = input.value as any; // Convert string to T (you might need better type casting depending on your data structure)
-      target.innerHTML = input.value; // Update the cell's display
+      blurInput(false, false);
     });
     input.addEventListener('keydown', (e: KeyboardEvent) => {
       if (e.key === 'Enter') {
-        input.blur(); // This will trigger the blur event handler above
+        blurInput(true, true); // This will trigger the blur event handler above
       }
     });