@gridsheet/preact-core 2.0.4 → 2.0.5

package/README.md

@@ -8,7 +8,7 @@ Spreadsheet component for Preact
 npm install @gridsheet/preact-core
 ```
 
-## Peer Dependencies
+### Peer Dependencies
 
 This package requires the following peer dependencies:
 
@@ -67,6 +67,11 @@ This package exports all the core GridSheet functionality along with Preact comp
 - Core GridSheet components and utilities
 - Preact-specific exports (`h`, `render`)
 
+## Docs
+
+- [GridSheet document](https://gridsheet.walkframe.com/)
+- [Examples](https://gridsheet.walkframe.com/examples/case1)
+
 ## Development
 
 ```bash

package/dist/index.js

@@ -3193,7 +3193,6 @@ class InsertRowsAboveAction extends CoreAction {
     });
     return {
       ...store,
-      ...table.getTotalSize(),
       tableReactive: { current: table }
     };
   }
@@ -3231,7 +3230,6 @@ class InsertRowsBelowAction extends CoreAction {
     });
     return {
       ...store,
-      ...table.getTotalSize(),
       selectingZone: nextSelectingZone,
       choosing: nextChoosing,
       tableReactive: { current: table }
@@ -3265,7 +3263,6 @@ class InsertColsLeftAction extends CoreAction {
     });
     return {
       ...store,
-      ...table.getTotalSize(),
       tableReactive: { current: table }
     };
   }
@@ -3305,7 +3302,6 @@ class InsertColsRightAction extends CoreAction {
     });
     return {
       ...store,
-      ...table.getTotalSize(),
       selectingZone: nextSelectingZone,
       choosing: nextChoosing,
       tableReactive: { current: table }
@@ -3339,7 +3335,6 @@ class RemoveRowsAction extends CoreAction {
     });
     return {
       ...store,
-      ...table.getTotalSize(),
       tableReactive: { current: table }
     };
   }
@@ -3371,7 +3366,6 @@ class RemoveColsAction extends CoreAction {
     });
     return {
       ...store,
-      ...table.getTotalSize(),
       tableReactive: { current: table }
     };
   }
@@ -4653,8 +4647,7 @@ const Resizer = () => {
     });
     dispatch(
       setStore({
-        tableReactive: { current: table },
-        ...table.getTotalSize()
+        tableReactive: { current: table }
       })
     );
     dispatch(setResizingPositionY([-1, -1, -1]));
@@ -7718,6 +7711,8 @@ class Table {
     this.prevSheetName = "";
     this.status = 0;
     this.idsToBeIdentified = [];
+    this.totalWidth = 0;
+    this.totalHeight = 0;
     this.version = 0;
     this.area = { top: 0, left: 0, bottom: 0, right: 0 };
     this.addressCaches = /* @__PURE__ */ new Map();
@@ -7904,7 +7899,7 @@ class Table {
     }
     return { width, height };
   }
-  getTotalSize() {
+  setTotalSize() {
     const { bottom, right } = this.area;
     const { width, height } = this.getRectSize({
       top: 1,
@@ -7912,24 +7907,25 @@ class Table {
       bottom: bottom + 1,
       right: right + 1
     });
-    return {
-      totalWidth: width + this.headerWidth,
-      totalHeight: height + this.headerHeight
-    };
+    this.totalWidth = width + this.headerWidth;
+    this.totalHeight = height + this.headerHeight;
   }
-  refresh(keepAddressCache = true) {
+  refresh(relocate = false, resize = false) {
     this.incrementVersion();
     this.lastChangedAt = this.changedAt;
     this.changedAt = /* @__PURE__ */ new Date();
     this.clearSolvedCaches();
-    if (!keepAddressCache) {
+    if (relocate) {
       this.addressCaches.clear();
     }
+    if (resize) {
+      this.setTotalSize();
+    }
     return this;
   }
-  clone(keepAddressCache = true) {
+  clone(relocate = false) {
     const copied = Object.assign(Object.create(Object.getPrototypeOf(this)), this);
-    return copied.refresh(keepAddressCache);
+    return copied.refresh(relocate);
   }
   getPointById(id, slideY = 0, slideX = 0) {
     const absCol = id.startsWith("$");
@@ -8447,7 +8443,7 @@ class Table {
       this.wire.onEdit({ table: srcTable.__raw__.trim(src) });
       this.wire.onEdit({ table: this.__raw__.trim(dst) });
     }
-    return this.refresh(false);
+    return this.refresh(true);
   }
   copy({
     srcTable = this,
@@ -8533,15 +8529,16 @@ class Table {
     const diffBefore = {};
     const diffAfter = {};
     const changedAt = /* @__PURE__ */ new Date();
+    let resized = false;
     Object.keys(diff).forEach((address) => {
       var _a, _b, _c, _d;
       const point = a2p(address);
       const id = this.getId(point);
       const original = this.wire.data[id];
-      let patch = { ...diff[address] };
       if (operator === "USER" && hasOperation(original.prevention, Update)) {
         return;
       }
+      let patch = { ...diff[address] };
       if (formulaIdentify) {
         patch.value = identifyFormula(patch.value, {
           table: this,
@@ -8571,6 +8568,9 @@ class Table {
       if (updateChangedAt) {
         this.setChangedAt(patch, changedAt);
       }
+      if (patch.width != null || patch.height != null) {
+        resized = true;
+      }
       diffBefore[id] = { ...original };
       const policy = this.policies[original.policy] ?? defaultPolicy;
       const p = policy.restrict({
@@ -8593,7 +8593,8 @@ class Table {
     }
     return {
       diffBefore,
-      diffAfter
+      diffAfter,
+      resized
     };
   }
   update({
@@ -8606,7 +8607,7 @@ class Table {
     undoReflection,
     redoReflection
   }) {
-    const { diffBefore, diffAfter } = this._update({
+    const { diffBefore, diffAfter, resized } = this._update({
       diff,
       partial,
       operator,
@@ -8626,7 +8627,7 @@ class Table {
         partial
       });
     }
-    return this.refresh(true);
+    return this.refresh(false, resized);
   }
   writeRawCellMatrix({
     point,
@@ -8756,7 +8757,7 @@ class Table {
       cloned.addressCaches = /* @__PURE__ */ new Map();
       this.wire.onInsertRows({ table: cloned, y, numRows });
     }
-    return this.refresh(false);
+    return this.refresh(true, true);
   }
   removeRows({
     y,
@@ -8818,7 +8819,7 @@ class Table {
       cloned.addressCaches = /* @__PURE__ */ new Map();
       this.wire.onRemoveRows({ table: cloned, ys: ys.reverse() });
     }
-    return this.refresh(false);
+    return this.refresh(true, true);
   }
   insertCols({
     x,
@@ -8884,7 +8885,7 @@ class Table {
       cloned.addressCaches = /* @__PURE__ */ new Map();
       this.wire.onInsertCols({ table: cloned, x, numCols });
     }
-    return this.refresh(false);
+    return this.refresh(true, true);
   }
   removeCols({
     x,
@@ -8949,7 +8950,7 @@ class Table {
       cloned.addressCaches = /* @__PURE__ */ new Map();
       this.wire.onRemoveCols({ table: cloned, xs: xs.reverse() });
     }
-    return this.refresh(false);
+    return this.refresh(true, true);
   }
   getHistories() {
     return [...this.wire.histories];
@@ -9109,7 +9110,7 @@ class Table {
         break;
       }
     }
-    this.refresh(!shouldTracking(history.operation));
+    this.refresh(shouldTracking(history.operation), true);
     return {
       history,
       callback: ({ tableReactive: tableRef }) => {
@@ -9181,7 +9182,7 @@ class Table {
         }
       }
     }
-    this.refresh(!shouldTracking(history.operation));
+    this.refresh(shouldTracking(history.operation), true);
     return {
       history,
       callback: ({ tableReactive: tableRef }) => {
@@ -10090,9 +10091,7 @@ const Tabular = () => {
     sheetHeight,
     inputting,
     leftHeaderSelecting,
-    topHeaderSelecting,
-    totalWidth,
-    totalHeight
+    topHeaderSelecting
   } = store;
   const table = tableReactive.current;
   const [virtualized, setVirtualized] = useState(null);
@@ -10201,8 +10200,8 @@ const Tabular = () => {
         {
           className: "gs-tabular-inner",
           style: {
-            width: totalWidth + 1,
-            height: totalHeight + 1
+            width: table.totalWidth + 1,
+            height: table.totalHeight + 1
           },
           children: /* @__PURE__ */ jsxs("table", { className: `gs-table`, children: [
             /* @__PURE__ */ jsx("thead", { className: "gs-thead", style: { height: table.headerHeight }, children: /* @__PURE__ */ jsxs("tr", { className: "gs-row", children: [
@@ -10736,6 +10735,7 @@ function GridSheet({
   style,
   hub: initialHub
 }) {
+  var _a, _b;
   const { sheetResize, showFormulaBar = true, mode = "light" } = options;
   const rootRef = useRef(null);
   const mainRef = useRef(null);
@@ -10755,7 +10755,7 @@ function GridSheet({
   const sheetId = sheetIdRef.current;
   const tableReactive = useRef(null);
   const [initialState] = useState(() => {
-    var _a;
+    var _a2;
     if (!sheetName) {
       sheetName = `Sheet${sheetId}`;
       console.debug("GridSheet: sheetName is not provided, using default name:", sheetName);
@@ -10772,7 +10772,8 @@ function GridSheet({
     table.sheetId = sheetId;
     wire.sheetIdsByName[sheetName] = sheetId;
     table.initialize(initialCells);
-    (_a = wire.onInit) == null ? void 0 : _a.call(wire, { table });
+    (_a2 = wire.onInit) == null ? void 0 : _a2.call(wire, { table });
+    table.setTotalSize();
     tableReactive.current = table;
     const store2 = {
       sheetId,
@@ -10808,8 +10809,7 @@ function GridSheet({
       maxNumRows: -1,
       minNumCols: 1,
       maxNumCols: -1,
-      mode: "light",
-      ...table.getTotalSize()
+      mode: "light"
     };
     return store2;
   });
@@ -10825,9 +10825,9 @@ function GridSheet({
   const [sheetWidth, setSheetWidth] = useState((options == null ? void 0 : options.sheetWidth) || estimateSheetWidth(initialCells));
   useEffect(() => {
     const intervalId = window.setInterval(() => {
-      var _a, _b;
-      setSheetHeight(((_a = mainRef.current) == null ? void 0 : _a.clientHeight) || 0);
-      setSheetWidth(((_b = mainRef.current) == null ? void 0 : _b.clientWidth) || 0);
+      var _a2, _b2;
+      setSheetHeight(((_a2 = mainRef.current) == null ? void 0 : _a2.clientHeight) || 0);
+      setSheetWidth(((_b2 = mainRef.current) == null ? void 0 : _b2.clientWidth) || 0);
     }, 1e3);
     return () => window.clearInterval(intervalId);
   }, []);
@@ -10860,8 +10860,8 @@ function GridSheet({
             ref: mainRef,
             style: {
               //width: '100%',
-              maxWidth: (store.totalWidth || 0) + 2,
-              maxHeight: (store.totalHeight || 0) + 2,
+              maxWidth: (((_a = store.tableReactive.current) == null ? void 0 : _a.totalWidth) || 0) + 2,
+              maxHeight: (((_b = store.tableReactive.current) == null ? void 0 : _b.totalHeight) || 0) + 2,
               overflow: "auto",
               resize: sheetResize,
               ...style