@pisell/materials 6.11.42 → 6.11.44

package/lib/components/pisellFloorMapLayout/hooks/floorMapViewportPersistence.d.ts

@@ -0,0 +1,25 @@
+/**
+ * 平面图视口缓存：localStorage 读写、锁定态；供 useFloorMapTransformMetrics 使用。
+ */
+/** 平面图包围盒单侧默认外扩（像素）；过大会导致首屏大量空白 */
+export declare const DEFAULT_BOUNDING_PADDING = 56;
+/** 视口内与首屏对齐时，图元束左上与容器边缘的留白 */
+export declare const VIEWPORT_TOP_LEFT_MARGIN = 16;
+/** 平面图视口（缩放 + 平移）持久化到 localStorage 的 key 前缀 */
+export declare const VIEWPORT_STORAGE_PREFIX = "pisell-floor-map-layout.viewport:";
+/** 视口锁定态持久化前缀（与视口位置分开存储） */
+export declare const VIEWPORT_LOCK_STORAGE_PREFIX = "pisell-floor-map-layout.viewport-lock:";
+/** 视口持久化写入节流（避免拖动 / 缩放过程中高频写 localStorage） */
+export declare const VIEWPORT_PERSIST_DEBOUNCE_MS = 300;
+/** 判定当前 transform 是否处于「适配视口」结果时的容差 */
+export declare const FIT_BOUNDS_MATCH_POS_EPSILON = 0.5;
+export declare const FIT_BOUNDS_MATCH_SCALE_EPSILON = 0.005;
+export interface ViewportSnapshot {
+    x: number;
+    y: number;
+    scale: number;
+}
+export declare function readPersistedViewport(key: string): ViewportSnapshot | null;
+export declare function writePersistedViewport(key: string, snapshot: ViewportSnapshot): void;
+export declare function readPersistedViewportLock(key: string): boolean;
+export declare function writePersistedViewportLock(key: string, locked: boolean): void;

package/lib/components/pisellFloorMapLayout/hooks/floorMapViewportPersistence.js

@@ -0,0 +1,98 @@
+var __defProp = Object.defineProperty;
+var __getOwnPropDesc = Object.getOwnPropertyDescriptor;
+var __getOwnPropNames = Object.getOwnPropertyNames;
+var __hasOwnProp = Object.prototype.hasOwnProperty;
+var __export = (target, all) => {
+  for (var name in all)
+    __defProp(target, name, { get: all[name], enumerable: true });
+};
+var __copyProps = (to, from, except, desc) => {
+  if (from && typeof from === "object" || typeof from === "function") {
+    for (let key of __getOwnPropNames(from))
+      if (!__hasOwnProp.call(to, key) && key !== except)
+        __defProp(to, key, { get: () => from[key], enumerable: !(desc = __getOwnPropDesc(from, key)) || desc.enumerable });
+  }
+  return to;
+};
+var __toCommonJS = (mod) => __copyProps(__defProp({}, "__esModule", { value: true }), mod);
+
+// src/components/pisellFloorMapLayout/hooks/floorMapViewportPersistence.ts
+var floorMapViewportPersistence_exports = {};
+__export(floorMapViewportPersistence_exports, {
+  DEFAULT_BOUNDING_PADDING: () => DEFAULT_BOUNDING_PADDING,
+  FIT_BOUNDS_MATCH_POS_EPSILON: () => FIT_BOUNDS_MATCH_POS_EPSILON,
+  FIT_BOUNDS_MATCH_SCALE_EPSILON: () => FIT_BOUNDS_MATCH_SCALE_EPSILON,
+  VIEWPORT_LOCK_STORAGE_PREFIX: () => VIEWPORT_LOCK_STORAGE_PREFIX,
+  VIEWPORT_PERSIST_DEBOUNCE_MS: () => VIEWPORT_PERSIST_DEBOUNCE_MS,
+  VIEWPORT_STORAGE_PREFIX: () => VIEWPORT_STORAGE_PREFIX,
+  VIEWPORT_TOP_LEFT_MARGIN: () => VIEWPORT_TOP_LEFT_MARGIN,
+  readPersistedViewport: () => readPersistedViewport,
+  readPersistedViewportLock: () => readPersistedViewportLock,
+  writePersistedViewport: () => writePersistedViewport,
+  writePersistedViewportLock: () => writePersistedViewportLock
+});
+module.exports = __toCommonJS(floorMapViewportPersistence_exports);
+var DEFAULT_BOUNDING_PADDING = 56;
+var VIEWPORT_TOP_LEFT_MARGIN = 16;
+var VIEWPORT_STORAGE_PREFIX = "pisell-floor-map-layout.viewport:";
+var VIEWPORT_LOCK_STORAGE_PREFIX = "pisell-floor-map-layout.viewport-lock:";
+var VIEWPORT_PERSIST_DEBOUNCE_MS = 300;
+var FIT_BOUNDS_MATCH_POS_EPSILON = 0.5;
+var FIT_BOUNDS_MATCH_SCALE_EPSILON = 5e-3;
+function readPersistedViewport(key) {
+  if (typeof window === "undefined") return null;
+  try {
+    const raw = window.localStorage.getItem(VIEWPORT_STORAGE_PREFIX + key);
+    if (!raw) return null;
+    const parsed = JSON.parse(raw);
+    if (!parsed || typeof parsed.x !== "number" || typeof parsed.y !== "number" || typeof parsed.scale !== "number" || !Number.isFinite(parsed.x) || !Number.isFinite(parsed.y) || !Number.isFinite(parsed.scale) || parsed.scale <= 0) {
+      return null;
+    }
+    return { x: parsed.x, y: parsed.y, scale: parsed.scale };
+  } catch {
+    return null;
+  }
+}
+function writePersistedViewport(key, snapshot) {
+  if (typeof window === "undefined") return;
+  try {
+    window.localStorage.setItem(
+      VIEWPORT_STORAGE_PREFIX + key,
+      JSON.stringify(snapshot)
+    );
+  } catch {
+  }
+}
+function readPersistedViewportLock(key) {
+  if (typeof window === "undefined") return false;
+  try {
+    return window.localStorage.getItem(VIEWPORT_LOCK_STORAGE_PREFIX + key) === "1";
+  } catch {
+    return false;
+  }
+}
+function writePersistedViewportLock(key, locked) {
+  if (typeof window === "undefined") return;
+  try {
+    if (locked) {
+      window.localStorage.setItem(VIEWPORT_LOCK_STORAGE_PREFIX + key, "1");
+    } else {
+      window.localStorage.removeItem(VIEWPORT_LOCK_STORAGE_PREFIX + key);
+    }
+  } catch {
+  }
+}
+// Annotate the CommonJS export names for ESM import in node:
+0 && (module.exports = {
+  DEFAULT_BOUNDING_PADDING,
+  FIT_BOUNDS_MATCH_POS_EPSILON,
+  FIT_BOUNDS_MATCH_SCALE_EPSILON,
+  VIEWPORT_LOCK_STORAGE_PREFIX,
+  VIEWPORT_PERSIST_DEBOUNCE_MS,
+  VIEWPORT_STORAGE_PREFIX,
+  VIEWPORT_TOP_LEFT_MARGIN,
+  readPersistedViewport,
+  readPersistedViewportLock,
+  writePersistedViewport,
+  writePersistedViewportLock
+});

package/lib/components/pisellFloorMapLayout/hooks/useDraftConfigHistory.d.ts

@@ -0,0 +1,18 @@
+export interface DraftHistoryCommitOptions {
+    /** 同一 groupId 在合并窗口内连续提交将合并为一条历史 */
+    groupId?: string;
+    /** 合并窗口（毫秒），默认 600 */
+    mergeWindowMs?: number;
+}
+export interface DraftHistory<T> {
+    present: T | null;
+    /** 写入并入栈（按 group/time 自动合并） */
+    commit: (next: T | null | ((prev: T | null) => T | null), options?: DraftHistoryCommitOptions) => void;
+    /** 重置（不入栈），清空历史；用于上游 props 同步 */
+    replace: (next: T | null) => void;
+    undo: () => void;
+    redo: () => void;
+    canUndo: boolean;
+    canRedo: boolean;
+}
+export declare function useDraftConfigHistory<T>(): DraftHistory<T>;

package/lib/components/pisellFloorMapLayout/hooks/useDraftConfigHistory.js

@@ -0,0 +1,95 @@
+var __defProp = Object.defineProperty;
+var __getOwnPropDesc = Object.getOwnPropertyDescriptor;
+var __getOwnPropNames = Object.getOwnPropertyNames;
+var __hasOwnProp = Object.prototype.hasOwnProperty;
+var __export = (target, all) => {
+  for (var name in all)
+    __defProp(target, name, { get: all[name], enumerable: true });
+};
+var __copyProps = (to, from, except, desc) => {
+  if (from && typeof from === "object" || typeof from === "function") {
+    for (let key of __getOwnPropNames(from))
+      if (!__hasOwnProp.call(to, key) && key !== except)
+        __defProp(to, key, { get: () => from[key], enumerable: !(desc = __getOwnPropDesc(from, key)) || desc.enumerable });
+  }
+  return to;
+};
+var __toCommonJS = (mod) => __copyProps(__defProp({}, "__esModule", { value: true }), mod);
+
+// src/components/pisellFloorMapLayout/hooks/useDraftConfigHistory.ts
+var useDraftConfigHistory_exports = {};
+__export(useDraftConfigHistory_exports, {
+  useDraftConfigHistory: () => useDraftConfigHistory
+});
+module.exports = __toCommonJS(useDraftConfigHistory_exports);
+var import_react = require("react");
+var HISTORY_LIMIT = 100;
+function useDraftConfigHistory() {
+  const [state, setState] = (0, import_react.useState)({
+    past: [],
+    present: null,
+    future: []
+  });
+  const lastGroupRef = (0, import_react.useRef)(null);
+  const commit = (0, import_react.useCallback)((next, options) => {
+    const now = Date.now();
+    const last = lastGroupRef.current;
+    const inGroup = !!((options == null ? void 0 : options.groupId) && last && last.id === options.groupId && now - last.at <= (options.mergeWindowMs ?? 600));
+    lastGroupRef.current = { id: options == null ? void 0 : options.groupId, at: now };
+    setState((cur) => {
+      const value = typeof next === "function" ? next(cur.present) : next;
+      if (Object.is(value, cur.present)) return cur;
+      let nextPast = cur.past;
+      if (cur.present != null && !inGroup) {
+        nextPast = nextPast.length >= HISTORY_LIMIT ? [...nextPast.slice(1), cur.present] : [...nextPast, cur.present];
+      }
+      return { past: nextPast, present: value, future: [] };
+    });
+  }, []);
+  const replace = (0, import_react.useCallback)((next) => {
+    lastGroupRef.current = null;
+    setState({ past: [], present: next, future: [] });
+  }, []);
+  const undo = (0, import_react.useCallback)(() => {
+    lastGroupRef.current = null;
+    setState((cur) => {
+      if (cur.past.length === 0) return cur;
+      const prev = cur.past[cur.past.length - 1];
+      const nextFuture = cur.present != null ? [cur.present, ...cur.future] : cur.future;
+      return {
+        past: cur.past.slice(0, -1),
+        present: prev,
+        future: nextFuture
+      };
+    });
+  }, []);
+  const redo = (0, import_react.useCallback)(() => {
+    lastGroupRef.current = null;
+    setState((cur) => {
+      if (cur.future.length === 0) return cur;
+      const next = cur.future[0];
+      const nextPast = cur.present != null ? [...cur.past, cur.present] : cur.past;
+      return {
+        past: nextPast,
+        present: next,
+        future: cur.future.slice(1)
+      };
+    });
+  }, []);
+  return (0, import_react.useMemo)(
+    () => ({
+      present: state.present,
+      commit,
+      replace,
+      undo,
+      redo,
+      canUndo: state.past.length > 0,
+      canRedo: state.future.length > 0
+    }),
+    [state, commit, replace, undo, redo]
+  );
+}
+// Annotate the CommonJS export names for ESM import in node:
+0 && (module.exports = {
+  useDraftConfigHistory
+});

package/lib/components/pisellFloorMapLayout/hooks/useFloorMapEditState.d.ts

@@ -41,6 +41,7 @@ export declare function useFloorMapEditState<T extends FloorMapItemBase>(params:
     }>) => void;
     handleCanvasPlaceClick: (e: MouseEvent<HTMLDivElement>) => void;
     handleSave: () => void;
+    discardDraft: () => void;
     placeSceneElementFromPaletteDrop: (contentX: number, contentY: number, scene: Extract<FloorMapPlaceMode, {
         type: 'scene';
     }>) => void;
@@ -63,4 +64,8 @@ export declare function useFloorMapEditState<T extends FloorMapItemBase>(params:
     toggleSelectedLayoutLock: () => void;
     duplicateSelectedElement: () => void;
     deleteSelectedElement: () => void;
+    undoDraft: () => void;
+    redoDraft: () => void;
+    canUndo: boolean;
+    canRedo: boolean;
 };

package/lib/components/pisellFloorMapLayout/hooks/useFloorMapEditState.js

@@ -39,6 +39,7 @@ var import_useEngineContext = __toESM(require("../../../hooks/useEngineContext")
 var import_utils2 = require("../../translation/utils");
 var import_floorMapConfigMerge = require("../utils/floorMapConfigMerge");
 var import_floorMapStageDefaults = require("../utils/floorMapStageDefaults");
+var import_useDraftConfigHistory = require("./useDraftConfigHistory");
 var import_floorMapViewConfigDiff = require("../utils/floorMapViewConfigDiff");
 var import_floorMapElementKindUtils = require("../utils/floorMapElementKindUtils");
 var import_layoutMeasurements = require("../utils/layoutMeasurements");
@@ -98,9 +99,14 @@ function useFloorMapEditState(params) {
   } = params;
   const engineCtx = (0, import_useEngineContext.default)();
   const engineLocale = ((_b = (_a = engineCtx == null ? void 0 : engineCtx.engine) == null ? void 0 : _a.props) == null ? void 0 : _b.locale) || "zh-CN";
-  const [draftConfig, setDraftConfig] = (0, import_react.useState)(
-    null
-  );
+  const draftHistory = (0, import_useDraftConfigHistory.useDraftConfigHistory)();
+  const draftConfig = draftHistory.present;
+  const commitDraft = draftHistory.commit;
+  const replaceDraft = draftHistory.replace;
+  const undoDraft = draftHistory.undo;
+  const redoDraft = draftHistory.redo;
+  const canUndo = draftHistory.canUndo;
+  const canRedo = draftHistory.canRedo;
   const [currentCanvasId, setCurrentCanvasId] = (0, import_react.useState)(null);
   const [selectedId, setSelectedId] = (0, import_react.useState)(null);
   const [placeMode, setPlaceMode] = (0, import_react.useState)(null);
@@ -124,7 +130,7 @@ function useFloorMapEditState(params) {
         };
       })
     };
-    setDraftConfig(nextConfig);
+    replaceDraft(nextConfig);
     setSavedBaselineConfig(null);
     const enabled = nextConfig.canvases.filter((c) => c.enabled).sort((a, b) => a.order - b.order);
     setCurrentCanvasId(
@@ -139,6 +145,24 @@ function useFloorMapEditState(params) {
     const baseline = savedBaselineConfig ?? (0, import_floorMapViewConfigDiff.normalizeFloorMapViewConfigFromProp)(floorMapConfigProp);
     return !(0, import_floorMapViewConfigDiff.floorMapViewConfigsEqual)(draftConfig, baseline);
   }, [isFloorMapView, draftConfig, floorMapConfigProp, savedBaselineConfig]);
+  (0, import_react.useEffect)(() => {
+    if (!selectedId || !draftConfig) return;
+    const exists = (draftConfig.sceneElements ?? []).some(
+      (e) => e.instanceId === selectedId
+    );
+    if (!exists) setSelectedId(null);
+  }, [selectedId, draftConfig]);
+  (0, import_react.useEffect)(() => {
+    var _a2;
+    if (!draftConfig) return;
+    if (!currentCanvasId) return;
+    const stillUsable = draftConfig.canvases.some(
+      (c) => c.id === currentCanvasId && c.enabled
+    );
+    if (stillUsable) return;
+    const enabled = draftConfig.canvases.filter((c) => c.enabled).sort((a, b) => a.order - b.order);
+    setCurrentCanvasId(((_a2 = enabled[0]) == null ? void 0 : _a2.id) ?? null);
+  }, [currentCanvasId, draftConfig]);
   const handleAddCanvas = (0, import_react.useCallback)(() => {
     (0, import_floorMapCanvasDisplay.initFloorMapLayoutLocales)(engineLocale);
     const label = import_utils.locales.getText(
@@ -155,7 +179,7 @@ function useFloorMapEditState(params) {
       order: 0,
       enabled: true
     };
-    setDraftConfig((prev) => {
+    commitDraft((prev) => {
       if (!prev) return prev;
       const list = prev.canvases.filter((c) => c.enabled).sort((a, b) => a.order - b.order);
       newCanvas.order = list.length > 0 ? Math.max(...list.map((c) => c.order)) + 1 : 0;
@@ -164,7 +188,7 @@ function useFloorMapEditState(params) {
     setCurrentCanvasId(newId);
   }, [engineLocale]);
   const handleRemoveCanvas = (0, import_react.useCallback)((canvasId) => {
-    setDraftConfig((prev) => {
+    commitDraft((prev) => {
       if (!prev) return prev;
       const nextCanvases = prev.canvases.filter((c) => c.id !== canvasId);
       if (nextCanvases.length === 0) return prev;
@@ -190,7 +214,7 @@ function useFloorMapEditState(params) {
       if (typeof name === "string") {
         const trimmed = name.trim();
         if (!trimmed) return;
-        setDraftConfig((prev) => {
+        commitDraft((prev) => {
           if (!prev) return prev;
           return {
             ...prev,
@@ -205,7 +229,7 @@ function useFloorMapEditState(params) {
         (s) => typeof s === "string" && s.trim()
       );
       if (!hasAny) return;
-      setDraftConfig((prev) => {
+      commitDraft((prev) => {
         if (!prev) return prev;
         return {
           ...prev,
@@ -228,7 +252,7 @@ function useFloorMapEditState(params) {
   const items = isFloorMapView ? mergedItems : itemsProp;
   const updateDraftSceneElement = (0, import_react.useCallback)(
     (instanceId, patch) => {
-      setDraftConfig((prev) => {
+      commitDraft((prev) => {
         if (!prev) return prev;
         const current = (prev.sceneElements ?? []).find(
           (e) => e.instanceId === instanceId
@@ -371,7 +395,7 @@ function useFloorMapEditState(params) {
             import_antd.message.warning("没有可落位的记录");
             return false;
           }
-          setDraftConfig(
+          commitDraft(
             (prev) => prev ? {
               ...prev,
               sceneElements: [...prev.sceneElements ?? [], ...newEls]
@@ -400,7 +424,7 @@ function useFloorMapEditState(params) {
         contentY,
         placementName
       );
-      setDraftConfig(
+      commitDraft(
         (prev) => prev ? { ...prev, sceneElements: [...prev.sceneElements ?? [], newEl] } : prev
       );
       return true;
@@ -446,8 +470,29 @@ function useFloorMapEditState(params) {
       setSaving(false);
     }
   }, [draftConfig, onSave]);
+  const discardDraft = (0, import_react.useCallback)(() => {
+    if (!floorMapConfigProp) {
+      replaceDraft(null);
+      setSavedBaselineConfig(null);
+      return;
+    }
+    const baseConfig = (0, import_floorMapViewConfigDiff.normalizeFloorMapViewConfigFromProp)(floorMapConfigProp);
+    const nextConfig = {
+      ...baseConfig,
+      canvases: baseConfig.canvases.map((canvas) => {
+        const stored = readStoredGridVisible(canvas.id);
+        if (stored == null) return canvas;
+        return {
+          ...canvas,
+          mapLayer: { ...canvas.mapLayer ?? {}, showGrid: stored }
+        };
+      })
+    };
+    replaceDraft(nextConfig);
+    setSavedBaselineConfig(null);
+  }, [floorMapConfigProp, replaceDraft]);
   const toggleDraftCanvasShowGrid = (0, import_react.useCallback)(() => {
-    setDraftConfig((prev) => {
+    commitDraft((prev) => {
       if (!prev || !currentCanvasId) return prev;
       return {
         ...prev,
@@ -490,7 +535,7 @@ function useFloorMapEditState(params) {
   );
   const handleEditPanelDelete = (0, import_react.useCallback)(() => {
     if (!selectedId) return;
-    setDraftConfig((prev) => {
+    commitDraft((prev) => {
       if (!prev) return prev;
       return {
         ...prev,
@@ -528,7 +573,7 @@ function useFloorMapEditState(params) {
       dataBinding: void 0,
       layoutTransformLocked: false
     };
-    setDraftConfig({
+    commitDraft({
       ...prev,
       sceneElements: [...prev.sceneElements ?? [], copy]
     });
@@ -566,6 +611,7 @@ function useFloorMapEditState(params) {
     handleUpdateItem,
     handleCanvasPlaceClick,
     handleSave,
+    discardDraft,
     placeSceneElementFromPaletteDrop,
     editPanelParams,
     placeOverlayClass,
@@ -573,7 +619,11 @@ function useFloorMapEditState(params) {
     toggleDraftCanvasShowGrid,
     toggleSelectedLayoutLock,
     duplicateSelectedElement,
-    deleteSelectedElement: handleEditPanelDelete
+    deleteSelectedElement: handleEditPanelDelete,
+    undoDraft,
+    redoDraft,
+    canUndo,
+    canRedo
   };
 }
 // Annotate the CommonJS export names for ESM import in node:

package/lib/components/pisellFloorMapLayout/hooks/useFloorMapTransformMetrics.d.ts

@@ -5,7 +5,14 @@ export declare type FloorMapTransformContext = {
     zoomIn: () => void;
     zoomOut: () => void;
     resetTransform: () => void;
-    setTransform: (x: number, y: number, scale: number) => void;
+    /**
+     * react-zoom-pan-pinch v3 实际签名：(x, y, scale, animationTime?, animationType?)
+     * 默认 animationTime≈200ms；传 0 立即落点，避免被前一次动画吃掉或与之冲突
+     * （restore / 缓存恢复路径应使用 0 立即覆盖已在缓动中的 fit 动画）。
+     * 这里只暴露我们用到的前 4 参；库 animationType 是 `keyof typeof animations` 联合，
+     * 暴露过来反而限制传入对象的兼容性，我们也确实不传它。
+     */
+    setTransform: (x: number, y: number, scale: number, animationTime?: number) => void;
 } | null;
 export interface UseFloorMapTransformMetricsParams<T extends FloorMapItemBase> {
     items: T[];
@@ -28,6 +35,14 @@ export interface UseFloorMapTransformMetricsParams<T extends FloorMapItemBase> {
      * 不传则不跑「异步加载图元后的首次左上对齐」逻辑。
      */
     frameResetKey?: string;
+    /**
+     * 视口持久化标识（通常拼自 canvasId）。传入后：
+     *   - 切换 / 挂载时若 localStorage 中有缓存，自动恢复 transform 并跳过本帧 autoFit；
+     *   - 用户拖动 / 缩放时（节流 300ms）写回缓存；
+     *   - 主动 fitBounds / 进入伪全屏后由 fitBounds 触发的写入也会同步保存。
+     * 不传则完全不读不写 localStorage。
+     */
+    viewportPersistKey?: string;
 }
 export declare function useFloorMapTransformMetrics<T extends FloorMapItemBase>(params: UseFloorMapTransformMetricsParams<T>): {
     containerRef: import("react").RefObject<HTMLDivElement>;
@@ -57,6 +72,10 @@ export declare function useFloorMapTransformMetrics<T extends FloorMapItemBase>(
     isFullscreen: boolean;
     toggleFullscreen: () => void;
     fitBounds: () => boolean;
+    isAtFitBounds: boolean;
+    notifyTransformed: (x: number, y: number, nextScale: number) => void;
+    persistCurrentViewport: () => void;
+    attachTransformContext: (ctx: NonNullable<FloorMapTransformContext>) => void;
     lastTransformRef: MutableRefObject<{
         x: number;
         y: number;
@@ -64,4 +83,7 @@ export declare function useFloorMapTransformMetrics<T extends FloorMapItemBase>(
     }>;
     isInteractingWithElement: boolean;
     setIsInteractingWithElement: import("react").Dispatch<import("react").SetStateAction<boolean>>;
+    viewportLocked: boolean;
+    setViewportLocked: (next: boolean) => void;
+    toggleViewportLocked: () => void;
 };