@canvas-components/pivot-table 0.2.1 → 0.2.2

package/dist/index.cjs

@@ -330,8 +330,6 @@ function indexPivotNodes(root) {
   visit(root);
   return nodeMap;
 }
-
-// src/domain/aggregation/built-in-aggregators.ts
 function createBuiltInPivotAggregators() {
   return {
     sum: createNumericAggregator("sum"),
@@ -362,14 +360,14 @@ function createNumericAggregator(type) {
         return;
       }
       state.numericCount += 1;
-      state.sum += numericValue;
+      state.sum = utils.addPreciseNumbers(state.sum, numericValue) ?? state.sum;
       state.min = state.min == null ? numericValue : Math.min(state.min, numericValue);
       state.max = state.max == null ? numericValue : Math.max(state.max, numericValue);
     },
     merge(state, source) {
       state.count += source.count;
       state.numericCount += source.numericCount;
-      state.sum += source.sum;
+      state.sum = utils.addPreciseNumbers(state.sum, source.sum) ?? state.sum;
       state.min = mergeMinimum(state.min, source.min);
       state.max = mergeMaximum(state.max, source.max);
       source.distinctValues.forEach((value) => state.distinctValues.add(value));
@@ -377,9 +375,11 @@ function createNumericAggregator(type) {
     finalize(state) {
       if (type === "count") return state.count;
       if (type === "distinctCount") return state.distinctValues.size;
-      if (type === "sum") return state.sum;
+      if (type === "sum") return Number(state.sum);
       if (type === "avg") {
-        return state.numericCount === 0 ? null : state.sum / state.numericCount;
+        if (state.numericCount === 0) return null;
+        const average = utils.dividePreciseNumber(state.sum, state.numericCount);
+        return average == null ? null : Number(average);
       }
       if (type === "min") return state.min;
       return state.max;
@@ -390,7 +390,7 @@ function createAccumulator() {
   return {
     count: 0,
     numericCount: 0,
-    sum: 0,
+    sum: "0",
     min: null,
     max: null,
     distinctValues: /* @__PURE__ */ new Set()
@@ -2769,18 +2769,50 @@ function resolvePivotSelectionKind(selection) {
   }
   return selection?.activeNode?.axis ?? "cell";
 }
-function drawPivotSelectionBorder(context, rect, color) {
+function drawPivotSelectionBorder(context, rect, color, options) {
   context.save();
   context.strokeStyle = color;
   context.lineWidth = 1;
-  context.strokeRect(
-    rect.x + 0.5,
-    rect.y + 0.5,
-    Math.max(rect.width - 1, 0),
-    Math.max(rect.height - 1, 0)
-  );
+  const left = rect.x + 0.5;
+  const top = rect.y + 0.5;
+  const width = Math.max(rect.width - 1, 0);
+  const height = Math.max(rect.height - 1, 0);
+  const right = left + width;
+  const bottom = top + height;
+  const viewport = options?.viewportRect;
+  const radius = Math.min(options?.radius ?? 8, width / 2, height / 2);
+  const topLeft = viewport && isSameCoordinate(rect.x, viewport.x) && isSameCoordinate(rect.y, viewport.y) ? radius : 0;
+  const topRight = viewport && isSameCoordinate(rect.x + rect.width, viewport.x + viewport.width) && isSameCoordinate(rect.y, viewport.y) ? radius : 0;
+  const bottomRight = viewport && isSameCoordinate(rect.x + rect.width, viewport.x + viewport.width) && isSameCoordinate(rect.y + rect.height, viewport.y + viewport.height) ? radius : 0;
+  const bottomLeft = viewport && isSameCoordinate(rect.x, viewport.x) && isSameCoordinate(rect.y + rect.height, viewport.y + viewport.height) ? radius : 0;
+  if (!topLeft && !topRight && !bottomRight && !bottomLeft) {
+    context.strokeRect(left, top, width, height);
+    context.restore();
+    return;
+  }
+  context.beginPath();
+  context.moveTo(left + topLeft, top);
+  context.lineTo(right - topRight, top);
+  if (topRight) context.arcTo(right, top, right, top + topRight, topRight);
+  else context.lineTo(right, top);
+  context.lineTo(right, bottom - bottomRight);
+  if (bottomRight) {
+    context.arcTo(right, bottom, right - bottomRight, bottom, bottomRight);
+  } else context.lineTo(right, bottom);
+  context.lineTo(left + bottomLeft, bottom);
+  if (bottomLeft) {
+    context.arcTo(left, bottom, left, bottom - bottomLeft, bottomLeft);
+  } else context.lineTo(left, bottom);
+  context.lineTo(left, top + topLeft);
+  if (topLeft) context.arcTo(left, top, left + topLeft, top, topLeft);
+  else context.lineTo(left, top);
+  context.closePath();
+  context.stroke();
   context.restore();
 }
+function isSameCoordinate(first, second) {
+  return Math.abs(first - second) < 0.01;
+}
 function resolveSelectionIndexes(layout, selection) {
   const range = selection?.ranges[0];
   if (range) {
@@ -3077,6 +3109,17 @@ function drawPivotGridRect(context, rect, color, options) {
   context.stroke();
   context.restore();
 }
+function drawPivotViewportRightBorder(context, rect, color) {
+  const x = rect.x + rect.width - 0.5;
+  context.save();
+  context.strokeStyle = color;
+  context.lineWidth = 1;
+  context.beginPath();
+  context.moveTo(x, rect.y);
+  context.lineTo(x, rect.y + rect.height);
+  context.stroke();
+  context.restore();
+}
 function clipPivotViewport(context, rect, radius = 8) {
   appendRoundedRectPath(context, rect, radius);
   context.clip();
@@ -3162,6 +3205,12 @@ function renderPivotTable(params) {
   );
   const areaSelection = isPivotAreaSelection(layout, params.selection);
   const viewportWidth = resolvePivotViewportWidth(layout);
+  const tableViewportRect = {
+    x: 0,
+    y: 0,
+    width: layout.tableWidth,
+    height: layout.height
+  };
   context.clearRect(0, 0, layout.width, layout.height);
   context.save();
   clipPivotViewport(context, {
@@ -3202,7 +3251,7 @@ function renderPivotTable(params) {
       (cell) => drawPivotGridRect(context, cell.rect, theme.borderColor, {
         skipTop: true,
         skipLeft: cell.rect.x > 0,
-        skipRight: isSameCoordinate(
+        skipRight: isSameCoordinate2(
           cell.rect.x + cell.rect.width,
           layout.rowHeaderRect.x + layout.rowHeaderRect.width
         )
@@ -3225,11 +3274,11 @@ function renderPivotTable(params) {
       (cell) => drawPivotGridRect(context, cell.rect, theme.borderColor, {
         skipTop: cell.rect.y > 0,
         skipLeft: true,
-        skipRight: isSameCoordinate(
+        skipRight: isSameCoordinate2(
           cell.rect.x + cell.rect.width,
           layout.tableWidth
         ),
-        skipBottom: isSameCoordinate(
+        skipBottom: isSameCoordinate2(
           cell.rect.y + cell.rect.height,
           layout.columnHeaderRect.y + layout.columnHeaderRect.height
         )
@@ -3261,7 +3310,7 @@ function renderPivotTable(params) {
       (cell) => drawPivotGridRect(context, cell.rect, theme.borderColor, {
         skipTop: true,
         skipLeft: true,
-        skipRight: isSameCoordinate(
+        skipRight: isSameCoordinate2(
           cell.rect.x + cell.rect.width,
           layout.tableWidth
         )
@@ -3290,29 +3339,37 @@ function renderPivotTable(params) {
     headerBackgroundColor: theme.columnHeaderBackgroundColor,
     bodyBackgroundColor: theme.backgroundColor
   });
+  if (params.resizeGuideX != null) {
+    drawPivotResizeGuide(context, params.resizeGuideX, contentHeight);
+  }
+  context.restore();
+  context.save();
+  clipPivotViewport(context, tableViewportRect);
+  drawPivotViewportRightBorder(context, tableViewportRect, theme.borderColor);
+  context.restore();
+  drawPivotViewportBorder(
+    context,
+    { x: 0, y: 0, width: viewportWidth, height: contentHeight },
+    theme.borderColor
+  );
   const selectionRect = resolvePivotSelectionRect(layout, params.selection);
   if (selectionRect) {
     const selectionClipRect = resolvePivotSelectionClipRect(
       layout,
       params.selection
     );
+    context.save();
+    clipPivotViewport(context, tableViewportRect);
     withClip(context, selectionClipRect, () => {
       drawPivotSelectionBorder(
         context,
         selectionRect,
-        theme.selectionBorderColor
+        theme.selectionBorderColor,
+        { viewportRect: tableViewportRect }
       );
     });
+    context.restore();
   }
-  if (params.resizeGuideX != null) {
-    drawPivotResizeGuide(context, params.resizeGuideX, contentHeight);
-  }
-  context.restore();
-  drawPivotViewportBorder(
-    context,
-    { x: 0, y: 0, width: viewportWidth, height: contentHeight },
-    theme.borderColor
-  );
   return {
     headerCellCount: layout.reportFilterCells.length + layout.rowFieldHeaderCells.length + layout.rowHeaderCells.length + layout.columnHeaderCells.length,
     bodyCellCount: layout.bodyCells.length
@@ -3357,7 +3414,7 @@ function drawDebugOverlay(context, layout, theme) {
     layout.bodyRect
   ].forEach((rect) => strokeRect(context, rect, "#f04438"));
   context.setLineDash([]);
-  context.font = `12px ${theme.fontFamily}`;
+  context.font = `${theme.fontSize}px ${theme.fontFamily}`;
   context.textAlign = "left";
   context.textBaseline = "top";
   context.fillStyle = "#f04438";
@@ -3616,7 +3673,7 @@ function resolveSlotPathKey(slots, nodeId, indicatorKey) {
     (slot) => (slot.nodeId ?? "") === nodeId && (!slot.indicatorKey || slot.indicatorKey === indicatorKey)
   )?.pathKey ?? null;
 }
-function isSameCoordinate(first, second) {
+function isSameCoordinate2(first, second) {
   return Math.abs(first - second) < 0.01;
 }
 function resolveBodyDisplayText(cell, indicator) {
@@ -5223,7 +5280,7 @@ var PivotTable = class {
   measurePivotText(text) {
     const context = this.host?.canvas.getContext("2d");
     if (!context) return text.length * 8;
-    context.font = `${this.options.theme?.fontSize ?? 13}px ${this.options.theme?.fontFamily ?? "sans-serif"}`;
+    context.font = `${this.options.theme?.fontSize ?? 14}px ${this.options.theme?.fontFamily ?? "sans-serif"}`;
     return context.measureText(text).width;
   }
   updateRowHeaderSelectionDrag(event) {
@@ -5609,6 +5666,90 @@ function toArrayBuffer(value) {
   return buffer;
 }
 
+// src/adapters/storage/indexeddb-field-layout-storage.ts
+var DATABASE_NAME = "canvas_components_pivot_table_config";
+var STORE_NAME = "field_layout";
+var DB_VERSION = 1;
+var dbPromise = null;
+async function savePivotFieldLayout(key, layout) {
+  try {
+    const db = await openDatabase();
+    await requestToPromise(
+      db.transaction(STORE_NAME, "readwrite").objectStore(STORE_NAME).put(cloneLayout(layout), key)
+    );
+  } catch (error) {
+    console.error("[PivotTable] \u5B57\u6BB5\u5E03\u5C40\u4FDD\u5B58\u5931\u8D25\uFF1A", error);
+  }
+}
+async function loadPivotFieldLayout(key) {
+  try {
+    const db = await openDatabase();
+    const value = await requestToPromise(
+      db.transaction(STORE_NAME, "readonly").objectStore(STORE_NAME).get(key)
+    );
+    return isPivotFieldLayout(value) ? cloneLayout(value) : void 0;
+  } catch (error) {
+    console.error("[PivotTable] \u5B57\u6BB5\u5E03\u5C40\u8BFB\u53D6\u5931\u8D25\uFF1A", error);
+    return void 0;
+  }
+}
+async function clearPivotFieldLayout(key) {
+  try {
+    const db = await openDatabase();
+    await requestToPromise(
+      db.transaction(STORE_NAME, "readwrite").objectStore(STORE_NAME).delete(key)
+    );
+  } catch (error) {
+    console.error("[PivotTable] \u5B57\u6BB5\u5E03\u5C40\u6E05\u9664\u5931\u8D25\uFF1A", error);
+  }
+}
+function openDatabase() {
+  if (dbPromise) return dbPromise;
+  dbPromise = new Promise((resolve, reject) => {
+    if (typeof indexedDB === "undefined") {
+      reject(new Error("\u5F53\u524D\u73AF\u5883\u4E0D\u652F\u6301 IndexedDB"));
+      return;
+    }
+    const request = indexedDB.open(DATABASE_NAME, DB_VERSION);
+    request.onupgradeneeded = () => {
+      const db = request.result;
+      if (!db.objectStoreNames.contains(STORE_NAME)) {
+        db.createObjectStore(STORE_NAME);
+      }
+    };
+    request.onsuccess = () => resolve(request.result);
+    request.onerror = () => reject(request.error);
+  });
+  dbPromise.catch(() => {
+    dbPromise = null;
+  });
+  return dbPromise;
+}
+function requestToPromise(request) {
+  return new Promise((resolve, reject) => {
+    request.onsuccess = () => resolve(request.result);
+    request.onerror = () => reject(request.error);
+  });
+}
+function isPivotFieldLayout(value) {
+  if (!value || typeof value !== "object") return false;
+  const layout = value;
+  return ["filters", "columns", "rows", "values"].every(
+    (key) => isStringArray(layout[key])
+  );
+}
+function isStringArray(value) {
+  return Array.isArray(value) && value.every((item) => typeof item === "string");
+}
+function cloneLayout(layout) {
+  return {
+    filters: [...layout.filters],
+    columns: [...layout.columns],
+    rows: [...layout.rows],
+    values: [...layout.values]
+  };
+}
+
 // src/domain/field/pivot-field-layout.ts
 function createEmptyPivotFieldLayout() {
   return { filters: [], columns: [], rows: [], values: [] };
@@ -5772,6 +5913,7 @@ exports.PivotTable = PivotTable;
 exports.aggregatePivotRecords = aggregatePivotRecords;
 exports.buildPivotDimensionTree = buildPivotDimensionTree;
 exports.buildPivotLayoutSnapshot = buildPivotLayoutSnapshot;
+exports.clearPivotFieldLayout = clearPivotFieldLayout;
 exports.computePivotScrollbarLayout = computePivotScrollbarLayout;
 exports.createBuiltInPivotAggregators = createBuiltInPivotAggregators;
 exports.createEmptyPivotFieldLayout = createEmptyPivotFieldLayout;
@@ -5795,6 +5937,7 @@ exports.getPivotDimensionFilterOptions = getPivotDimensionFilterOptions;
 exports.hitTestPivotLayout = hitTestPivotLayout;
 exports.hitTestPivotResize = hitTestPivotResize;
 exports.hitTestPivotScrollbar = hitTestPivotScrollbar;
+exports.loadPivotFieldLayout = loadPivotFieldLayout;
 exports.movePivotField = movePivotField;
 exports.removePivotField = removePivotField;
 exports.renderPivotTable = renderPivotTable;
@@ -5806,5 +5949,6 @@ exports.resolvePivotDimensionWidth = resolvePivotDimensionWidth;
 exports.resolvePivotFieldLayoutOptions = resolvePivotFieldLayoutOptions;
 exports.resolvePivotIndicatorAggregator = resolvePivotIndicatorAggregator;
 exports.resolvePivotValueFieldTitle = resolvePivotValueFieldTitle;
+exports.savePivotFieldLayout = savePivotFieldLayout;
 //# sourceMappingURL=index.cjs.map
 //# sourceMappingURL=index.cjs.map