@pisell/materials 6.11.42 → 6.11.44

package/lib/components/pisellFloorMapLayout/components/FloorMapEditTopBar.js

@@ -35,6 +35,8 @@ __export(FloorMapEditTopBar_exports, {
 module.exports = __toCommonJS(FloorMapEditTopBar_exports);
 var import_react = __toESM(require("react"));
 var import_classnames = __toESM(require("classnames"));
+var import_antd = require("antd");
+var import_HistoryIcons = require("./HistoryIcons");
 var import_utils = require("@pisell/utils");
 var import_useEngineContext = __toESM(require("../../../hooks/useEngineContext"));
 var import_floorMapCanvasDisplay = require("../utils/floorMapCanvasDisplay");
@@ -42,6 +44,12 @@ var import_CanvasTabs = require("./CanvasTabs");
 var import_FloorMapEditTopBar = require("./FloorMapEditTopBar.less");
 var PREFIX = "pisell-floor-map-layout";
 var I18N_TB = "pisell-floor-map-layout.edit-top-bar";
+function detectIsMacLike() {
+  if (typeof navigator === "undefined") return false;
+  const p = navigator.platform || "";
+  const ua = navigator.userAgent || "";
+  return /Mac|iPhone|iPad|iPod/i.test(p) || /Macintosh/i.test(ua);
+}
 function FloorMapEditTopBar(props) {
   var _a, _b;
   const {
@@ -62,6 +70,12 @@ function FloorMapEditTopBar(props) {
     extraActions,
     canvasTabsBarTrailing,
     hideCanvasTabs = false,
+    onUndo,
+    onRedo,
+    canUndo = false,
+    canRedo = false,
+    onExitEdit,
+    onCancelEdit,
     className
   } = props;
   const engineCtx = (0, import_useEngineContext.default)();
@@ -72,15 +86,102 @@ function FloorMapEditTopBar(props) {
       aria: import_utils.locales.getText(`${I18N_TB}.aria`),
       unsaved: import_utils.locales.getText(`${I18N_TB}.unsaved`),
       save: import_utils.locales.getText(`${I18N_TB}.save`),
-      saving: import_utils.locales.getText(`${I18N_TB}.saving`)
+      saving: import_utils.locales.getText(`${I18N_TB}.saving`),
+      undo: import_utils.locales.getText(`${I18N_TB}.undo`),
+      redo: import_utils.locales.getText(`${I18N_TB}.redo`),
+      cancelEdit: import_utils.locales.getText(`${I18N_TB}.cancel-edit`),
+      finishEdit: import_utils.locales.getText(`${I18N_TB}.finish-edit`),
+      cancelConfirmTitle: import_utils.locales.getText(`${I18N_TB}.cancel-confirm-title`),
+      cancelConfirmContent: import_utils.locales.getText(
+        `${I18N_TB}.cancel-confirm-content`
+      ),
+      cancelConfirmOk: import_utils.locales.getText(`${I18N_TB}.cancel-confirm-ok`),
+      cancelConfirmCancel: import_utils.locales.getText(`${I18N_TB}.cancel-confirm-cancel`)
     };
   }, [engineLocale]);
+  const showHistory = Boolean(onUndo || onRedo);
+  const historyGroup = (0, import_react.useMemo)(() => {
+    if (!showHistory) return null;
+    const isMac = detectIsMacLike();
+    const cmd = isMac ? "⌘" : "Ctrl";
+    const undoTitle = `${topBarLabels.undo} (${cmd}+Z)`;
+    const redoTitle = `${topBarLabels.redo} (${cmd}+Shift+Z)`;
+    return /* @__PURE__ */ import_react.default.createElement(
+      "div",
+      {
+        className: `${PREFIX}-edit-top-bar-history`,
+        role: "group",
+        "aria-label": `${topBarLabels.undo} / ${topBarLabels.redo}`
+      },
+      /* @__PURE__ */ import_react.default.createElement(
+        import_antd.Button,
+        {
+          type: "text",
+          size: "small",
+          icon: /* @__PURE__ */ import_react.default.createElement(import_HistoryIcons.UndoHistoryIcon, null),
+          disabled: !canUndo,
+          onClick: onUndo,
+          "aria-label": undoTitle
+        },
+        topBarLabels.undo
+      ),
+      /* @__PURE__ */ import_react.default.createElement(
+        import_antd.Button,
+        {
+          type: "text",
+          size: "small",
+          icon: /* @__PURE__ */ import_react.default.createElement(import_HistoryIcons.RedoHistoryIcon, null),
+          disabled: !canRedo,
+          onClick: onRedo,
+          "aria-label": redoTitle
+        },
+        topBarLabels.redo
+      )
+    );
+  }, [showHistory, topBarLabels.undo, topBarLabels.redo, canUndo, canRedo, onUndo, onRedo]);
   const showSave = Boolean(onSave && config.canvasUi.canEdit) && !isFullscreen;
+  const showExitGroup = Boolean(onExitEdit && config.canvasUi.canEdit);
+  const dirtyBadge = layoutDirty && (showExitGroup || showSave) ? /* @__PURE__ */ import_react.default.createElement(
+    "span",
+    {
+      className: `${PREFIX}-edit-top-bar-dirty-badge`,
+      role: "status",
+      "aria-live": "polite"
+    },
+    topBarLabels.unsaved
+  ) : null;
+  const [modalApi, modalContextHolder] = import_antd.Modal.useModal();
+  const performCancel = (0, import_react.useCallback)(() => {
+    if (onCancelEdit) onCancelEdit();
+    else onExitEdit == null ? void 0 : onExitEdit();
+  }, [onCancelEdit, onExitEdit]);
+  const handleCancelClick = (0, import_react.useCallback)(() => {
+    if (!layoutDirty) {
+      performCancel();
+      return;
+    }
+    modalApi.confirm({
+      title: topBarLabels.cancelConfirmTitle,
+      content: topBarLabels.cancelConfirmContent,
+      okText: topBarLabels.cancelConfirmOk,
+      cancelText: topBarLabels.cancelConfirmCancel,
+      onOk: () => performCancel(),
+      autoFocusButton: "cancel"
+    });
+  }, [
+    layoutDirty,
+    performCancel,
+    modalApi,
+    topBarLabels.cancelConfirmTitle,
+    topBarLabels.cancelConfirmContent,
+    topBarLabels.cancelConfirmOk,
+    topBarLabels.cancelConfirmCancel
+  ]);
   const hasTrailing = canvasTabsBarTrailing != null && canvasTabsBarTrailing !== false;
-  const hasFullActions = showSave || Boolean(saveError) || extraActions != null && extraActions !== false || hasTrailing;
+  const hasFullActions = showSave || showExitGroup || Boolean(saveError) || extraActions != null && extraActions !== false || hasTrailing || showHistory;
   const tabsHiddenClass = hideCanvasTabs ? `${PREFIX}-edit-top-bar--tabs-hidden` : void 0;
   if (mode === "compact") {
-    const showCompactActions = hasTrailing;
+    const showCompactActions = hasTrailing || showHistory;
     return /* @__PURE__ */ import_react.default.createElement(
       "div",
       {
@@ -106,7 +207,8 @@ function FloorMapEditTopBar(props) {
           className: `${PREFIX}-edit-top-bar-canvas-tabs`
         }
       )) : null,
-      showCompactActions ? /* @__PURE__ */ import_react.default.createElement("div", { className: `${PREFIX}-edit-top-bar-actions` }, canvasTabsBarTrailing) : null
+      showCompactActions ? /* @__PURE__ */ import_react.default.createElement("div", { className: `${PREFIX}-edit-top-bar-actions` }, historyGroup, canvasTabsBarTrailing) : null,
+      modalContextHolder
     );
   }
   if (hideCanvasTabs && !hasFullActions) {
@@ -144,15 +246,28 @@ function FloorMapEditTopBar(props) {
         title: typeof saveError === "string" ? saveError : saveError == null ? void 0 : saveError.message
       },
       typeof saveError === "string" ? saveError : saveError == null ? void 0 : saveError.message
-    ) : null, canvasTabsBarTrailing, extraActions, showSave ? /* @__PURE__ */ import_react.default.createElement("div", { className: `${PREFIX}-edit-top-bar-save-group` }, layoutDirty ? /* @__PURE__ */ import_react.default.createElement(
-      "span",
+    ) : null, dirtyBadge, historyGroup, canvasTabsBarTrailing, extraActions, showExitGroup ? /* @__PURE__ */ import_react.default.createElement("div", { className: `${PREFIX}-edit-top-bar-save-group` }, /* @__PURE__ */ import_react.default.createElement(
+      "button",
+      {
+        type: "button",
+        className: `${PREFIX}-edit-top-bar-btn`,
+        disabled: saving,
+        onClick: handleCancelClick
+      },
+      topBarLabels.cancelEdit
+    ), /* @__PURE__ */ import_react.default.createElement(
+      "button",
       {
-        className: `${PREFIX}-edit-top-bar-dirty-badge`,
-        role: "status",
-        "aria-live": "polite"
+        type: "button",
+        className: (0, import_classnames.default)(`${PREFIX}-edit-top-bar-btn`, "primary"),
+        disabled: saving,
+        onClick: () => {
+          onSave == null ? void 0 : onSave();
+          onExitEdit == null ? void 0 : onExitEdit();
+        }
       },
-      topBarLabels.unsaved
-    ) : null, /* @__PURE__ */ import_react.default.createElement(
+      saving ? topBarLabels.saving : topBarLabels.finishEdit
+    )) : showSave ? /* @__PURE__ */ import_react.default.createElement("div", { className: `${PREFIX}-edit-top-bar-save-group` }, /* @__PURE__ */ import_react.default.createElement(
       "button",
       {
         type: "button",
@@ -161,7 +276,8 @@ function FloorMapEditTopBar(props) {
         onClick: onSave
       },
       saving ? topBarLabels.saving : topBarLabels.save
-    )) : null) : null
+    )) : null) : null,
+    modalContextHolder
   );
 }
 var FloorMapEditTopBar_default = FloorMapEditTopBar;

package/lib/components/pisellFloorMapLayout/components/FloorMapEditTopBar.less

@@ -58,7 +58,7 @@
     text-overflow: ellipsis;
   }
 
-  /* 全屏顶栏：未保存标签在保存按钮左侧，单行对齐 */
+  /* 全屏顶栏右侧：取消 / 完成按钮组（未保存徽章已外提到 history 左侧，不再属于本组） */
 
   &-save-group {
     display: inline-flex;
@@ -67,6 +67,14 @@
     gap: 10px;
   }
 
+  /* 撤销 / 重做按钮组：作为 actions 区第一组元素显示 */
+  &-history {
+    display: inline-flex;
+    flex-direction: row;
+    align-items: center;
+    gap: 4px;
+  }
+
   &-dirty-badge {
     display: inline-flex;
     align-items: center;

package/lib/components/pisellFloorMapLayout/components/FloorMapToolbar.js

@@ -36,6 +36,7 @@ module.exports = __toCommonJS(FloorMapToolbar_exports);
 var import_react = __toESM(require("react"));
 var import_classnames = __toESM(require("classnames"));
 var import_antd = require("antd");
+var import_icons = require("@ant-design/icons");
 var import_types = require("../types");
 var import_floorMapElementKindUtils = require("../utils/floorMapElementKindUtils");
 var import_floorMapDropUtils = require("../utils/floorMapDropUtils");
@@ -86,6 +87,25 @@ function buildScenePreviewMergedItem(kind, dataSourceKey, size) {
 }
 var STAGE_PREVIEW_SIZE = { width: 160, height: 64 };
 var IMAGE_PREVIEW_SIZE = { width: 140, height: 80 };
+var TOOLBAR_COLLAPSED_STORAGE_KEY = "pisell-floor-map-layout.toolbar.leftbar-collapsed.v1";
+function readToolbarCollapsedPreference() {
+  if (typeof window === "undefined") return false;
+  try {
+    return window.localStorage.getItem(TOOLBAR_COLLAPSED_STORAGE_KEY) === "1";
+  } catch {
+    return false;
+  }
+}
+function writeToolbarCollapsedPreference(collapsed) {
+  if (typeof window === "undefined") return;
+  try {
+    window.localStorage.setItem(
+      TOOLBAR_COLLAPSED_STORAGE_KEY,
+      collapsed ? "1" : "0"
+    );
+  } catch {
+  }
+}
 function FloorMapToolbar(props) {
   const {
     config,
@@ -106,6 +126,15 @@ function FloorMapToolbar(props) {
     onPaletteCardPointerDown,
     consumeToolbarClickIfTouchDrag
   } = props;
+  const [collapsed, setCollapsed] = (0, import_react.useState)(
+    () => readToolbarCollapsedPreference()
+  );
+  (0, import_react.useEffect)(() => {
+    writeToolbarCollapsedPreference(collapsed);
+  }, [collapsed]);
+  const handleToggleCollapsed = (0, import_react.useCallback)(() => {
+    setCollapsed((prev) => !prev);
+  }, []);
   const paletteKinds = (0, import_react.useMemo)(
     () => (config.elementKinds ?? []).filter((k) => k.showInPalette !== false),
     [config.elementKinds]
@@ -319,15 +348,34 @@ function FloorMapToolbar(props) {
       className: (0, import_classnames.default)(
         `${PREFIX}-toolbar`,
         `${PREFIX}-toolbar-sidebar`,
+        collapsed && `${PREFIX}-toolbar-sidebar--collapsed`,
         className
       )
     },
-    /* @__PURE__ */ import_react.default.createElement("div", { className: `${PREFIX}-toolbar-body` }, canCreate && /* @__PURE__ */ import_react.default.createElement(import_react.default.Fragment, null, categories.map((cat) => {
+    /* @__PURE__ */ import_react.default.createElement(
+      "button",
+      {
+        type: "button",
+        className: `${PREFIX}-toolbar-collapse-handle`,
+        onClick: handleToggleCollapsed,
+        "aria-label": collapsed ? import_utils.locales.getText(`${I18N_TB}.expand`) : import_utils.locales.getText(`${I18N_TB}.collapse`),
+        title: collapsed ? import_utils.locales.getText(`${I18N_TB}.expand`) : import_utils.locales.getText(`${I18N_TB}.collapse`)
+      },
+      collapsed ? /* @__PURE__ */ import_react.default.createElement(import_icons.RightOutlined, null) : /* @__PURE__ */ import_react.default.createElement(import_icons.LeftOutlined, null)
+    ),
+    /* @__PURE__ */ import_react.default.createElement("div", { className: `${PREFIX}-toolbar-inner` }, /* @__PURE__ */ import_react.default.createElement("div", { className: `${PREFIX}-toolbar-body` }, canCreate && /* @__PURE__ */ import_react.default.createElement(import_react.default.Fragment, null, categories.map((cat) => {
       const kinds = kindsByCategory.get(cat.id) ?? [];
       if (!kinds.length) return null;
-      return /* @__PURE__ */ import_react.default.createElement("section", { key: cat.id, className: `${PREFIX}-toolbar-section` }, /* @__PURE__ */ import_react.default.createElement("h3", { className: `${PREFIX}-toolbar-section-title` }, cat.label), /* @__PURE__ */ import_react.default.createElement("div", { className: `${PREFIX}-toolbar-preview-list` }, /* @__PURE__ */ import_react.default.createElement("div", { className: `${PREFIX}-toolbar-preview-group` }, kinds.map((k) => renderKindCard(k)))));
-    }))),
-    onSave && config.canvasUi.canEdit && /* @__PURE__ */ import_react.default.createElement("div", { className: `${PREFIX}-toolbar-footer` }, layoutDirty ? /* @__PURE__ */ import_react.default.createElement("span", { className: `${PREFIX}-toolbar-dirty-hint`, role: "status" }, import_utils.locales.getText(`${I18N_TB}.layout-dirty-hint`)) : null, saveError && /* @__PURE__ */ import_react.default.createElement("span", { className: `${PREFIX}-toolbar-error` }, typeof saveError === "string" ? saveError : saveError == null ? void 0 : saveError.message), /* @__PURE__ */ import_react.default.createElement(
+      return /* @__PURE__ */ import_react.default.createElement(
+        "section",
+        {
+          key: cat.id,
+          className: `${PREFIX}-toolbar-section`
+        },
+        /* @__PURE__ */ import_react.default.createElement("h3", { className: `${PREFIX}-toolbar-section-title` }, cat.label),
+        /* @__PURE__ */ import_react.default.createElement("div", { className: `${PREFIX}-toolbar-preview-list` }, /* @__PURE__ */ import_react.default.createElement("div", { className: `${PREFIX}-toolbar-preview-group` }, kinds.map((k) => renderKindCard(k))))
+      );
+    }))), onSave && config.canvasUi.canEdit && /* @__PURE__ */ import_react.default.createElement("div", { className: `${PREFIX}-toolbar-footer` }, layoutDirty ? /* @__PURE__ */ import_react.default.createElement("span", { className: `${PREFIX}-toolbar-dirty-hint`, role: "status" }, import_utils.locales.getText(`${I18N_TB}.layout-dirty-hint`)) : null, saveError && /* @__PURE__ */ import_react.default.createElement("span", { className: `${PREFIX}-toolbar-error` }, typeof saveError === "string" ? saveError : saveError == null ? void 0 : saveError.message), /* @__PURE__ */ import_react.default.createElement(
       "button",
       {
         type: "button",
@@ -338,7 +386,7 @@ function FloorMapToolbar(props) {
         onClick: onSave
       },
       saving ? import_utils.locales.getText(`${I18N_TB}.saving`) : import_utils.locales.getText(`${I18N_TB}.save`)
-    ))
+    )))
   );
 }
 var FloorMapToolbar_default = FloorMapToolbar;

package/lib/components/pisellFloorMapLayout/components/FloorMapToolbar.less

@@ -2,20 +2,108 @@
 .pisell-floor-map-layout-toolbar {
   &.pisell-floor-map-layout-toolbar-sidebar {
     position: relative;
-    width: 248px;
+    /**
+     * 中等宽度抽屉：248px → 124px。
+     * 配合 cellW/cellH（见 FloorMapToolbar.tsx）按 0.5 倍渲染，preview-cell（最大 92px）
+     * + 标准 padding（12 8）正好落在 124px 内，兼顾画布展示空间与图元预览可视性。
+     */
+    width: 124px;
     flex-shrink: 0;
     display: flex;
     flex-direction: column;
     background: #fff;
     border-right: 1px solid #e8e8e8;
     z-index: 10;
+    /** 收起态：只保留一条边和外突的切换按钮 */
+    transition: width 0.2s ease;
+    /**
+     * 注意：根元素必须保持 overflow: visible —— 否则下方 collapse-handle
+     * 用 right: -22px 外突的按钮会被裁掉。横向裁剪转移到 &-inner 内层做。
+     */
+
+    &.pisell-floor-map-layout-toolbar-sidebar--collapsed {
+      width: 0;
+      border-right: none;
+      /**
+       * 不再给 body/footer 设 display: none —— 让它们维持固定宽度参与动画的横向裁剪，
+       * 否则收起态切换会先 hide 后再瞬间 show，反而更容易暴露挤压的瞬间。
+       */
+    }
+  }
+
+  /**
+   * 内层容器：宽度跟随 sidebar 100% 伸缩，但用 overflow: hidden + 子元素固定宽度
+   * 把中间帧的水平挤压裁掉。这样 0→124px 展开过程中，body/footer 始终按 124px
+   * 排版，只是从右侧逐步揭开，避免文案被压成竖排。
+   */
+  &-inner {
+    flex: 1;
+    min-height: 0;
+    width: 100%;
+    display: flex;
+    flex-direction: column;
+    overflow: hidden;
+  }
+
+  /**
+   * 收起 / 展开按钮：固定挂在容器右边垂直居中，外突大半个按钮宽度。
+   * 124px 抽屉下整体视觉更宽松，handle 用 28×72 配合放大的箭头，
+   * 在窄边栏旁仍然显眼、易点（之前 16×48 几乎看不见，参考用户截图）。
+   * 收起态下容器宽度为 0，按钮仍能完整露出（z-index 高于地图区遮罩）。
+   */
+  &-collapse-handle {
+    position: absolute;
+    top: 50%;
+    right: -22px;
+    transform: translateY(-50%);
+    width: 28px;
+    height: 72px;
+    padding: 0;
+    display: inline-flex;
+    align-items: center;
+    justify-content: center;
+    background: #fff;
+    color: #595959;
+    border: 1px solid #e8e8e8;
+    border-left: none;
+    border-radius: 0 12px 12px 0;
+    box-shadow: 2px 0 8px rgba(0, 0, 0, 0.08);
+    cursor: pointer;
+    z-index: 11;
+    transition: color 0.15s, background 0.15s, border-color 0.15s,
+      box-shadow 0.15s;
+
+    &:hover {
+      color: var(--fmap-primary, #1677ff);
+      background: color-mix(in srgb, var(--fmap-primary, #1677ff) 8%, #fff);
+      border-color: var(--fmap-primary, #1677ff);
+      box-shadow: 2px 0 12px rgba(22, 119, 255, 0.16);
+    }
+
+    &:focus-visible {
+      outline: 2px solid var(--fmap-primary, #1677ff);
+      outline-offset: 2px;
+    }
+
+    .anticon {
+      font-size: 16px;
+      line-height: 1;
+    }
   }
 
   &-body {
     flex: 1;
     min-height: 0;
     overflow-y: auto;
-    padding: 12px 10px;
+    /** 124px 抽屉下，左右各留 8px 给 preview-card 的标准 padding 兜住 92px cell */
+    padding: 12px 8px;
+    /**
+     * 写死 124px 防止展开动画过程中跟随父容器 0→124px 同步缩放，避免文案被挤成竖排。
+     * 父容器 overflow: hidden 会裁掉超出的部分，视觉上就是抽屉从右侧划出。
+     */
+    width: 124px;
+    box-sizing: border-box;
+    flex-shrink: 0;
   }
 
   &-section {
@@ -64,7 +152,8 @@
   &-preview-card {
     display: block;
     width: 100%;
-    padding: 6px;
+    /** 标准 padding 适配 124px 抽屉 + 92px cell 的尺寸预算 */
+    padding: 8px;
     text-align: center;
     background: #fafafa;
     border: 1px solid #e8e8e8;
@@ -186,11 +275,15 @@
 
   &-footer {
     flex-shrink: 0;
-    padding: 12px 10px;
+    /** 与 body 同步水平 padding，124px 抽屉下按钮宽度足够呈现 */
+    padding: 12px 8px;
     border-top: 1px solid #f0f0f0;
     display: flex;
     flex-direction: column;
     gap: 8px;
+    /** 同 body：固定 124px 防止展开动画期间被父容器宽度挤压换行 */
+    width: 124px;
+    box-sizing: border-box;
   }
 
   &-dirty-hint {

package/lib/components/pisellFloorMapLayout/components/HistoryIcons.d.ts

@@ -0,0 +1,39 @@
+/**
+ * 编辑顶栏 Undo / Redo 自定义 SVG icon。
+ *
+ * 设计来源：业务方提供的「圆勾箭头」风格 —— 整圈 ~270° 回环 + 末端三角箭头。
+ * 替换 antd 的 `UndoOutlined` / `RedoOutlined`：原版箭头偏方、回勾过短，
+ * 在 24/16px 的小尺寸下与界面其它细线 icon 不齐，且 Undo/Redo 镜像不够直观。
+ *
+ * 实现要点：
+ * - `stroke="currentColor"`、无填充：颜色完全跟随父级 `color`，与 Ant Button text 模式一致；
+ * - viewBox 14×14，配合 `font-size: 14px` 自动得到 14px icon；调用方可通过 fontSize/CSS 调整；
+ * - `stroke-linecap=round` + `stroke-linejoin=round`：在 1.5px 细线下保持圆润、抗锯齿友好；
+ * - 箭头用同色 `path` 三角，避免 marker-end 在不同浏览器下的尺寸漂移；
+ * - 接受 `className` / `style` / 其它 SVG 属性透传（与 antd icon 体感一致）。
+ */
+import React from 'react';
+declare type HistoryIconProps = React.SVGProps<SVGSVGElement> & {
+    /** 与 antd icon 类似：用于覆盖默认 1em 尺寸 */
+    size?: number | string;
+};
+/**
+ * Undo 图标：「↰」L 形带小圆角 —— 箭头在左侧水平指向左，主干由箭头水平向右、
+ * 经一个 1.5 半径的圆角折下、再竖直向下。
+ *
+ * 关于"看起来偏上"：antd `.anticon { vertical-align: -0.125em }` 已经把整个 svg
+ * 相对文字基线下移 ~0.125em，但我们的形状在 viewBox 内是几何居中的（y ∈ [3,11]），
+ * 与 antd 自家 outline icon（路径几乎铺满 viewBox）在视觉密度上不同 ——
+ * 留白对称会让人眼判断"图形在 viewBox 上半"。
+ *
+ * 解决：把形状整体下移 1 单位到 y ∈ [4, 12]，上侧留 4 / 下侧留 2，
+ * 让 icon 视觉中心匹配文字 x-height 中心，与 "Undo" 文本视觉齐平。
+ * x 仍保持 [3, 11] 居中。
+ */
+export declare function UndoHistoryIcon(props: HistoryIconProps): JSX.Element;
+/**
+ * Redo 图标：与 Undo 水平镜像，箭头在右侧指向右，干线右→左→下。
+ * 几何范围与 Undo 完全对称：x ∈ [3, 11]、y ∈ [4, 12]。
+ */
+export declare function RedoHistoryIcon(props: HistoryIconProps): JSX.Element;
+export {};

package/lib/components/pisellFloorMapLayout/components/HistoryIcons.js

@@ -0,0 +1,71 @@
+var __create = Object.create;
+var __defProp = Object.defineProperty;
+var __getOwnPropDesc = Object.getOwnPropertyDescriptor;
+var __getOwnPropNames = Object.getOwnPropertyNames;
+var __getProtoOf = Object.getPrototypeOf;
+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 __toESM = (mod, isNodeMode, target) => (target = mod != null ? __create(__getProtoOf(mod)) : {}, __copyProps(
+  // If the importer is in node compatibility mode or this is not an ESM
+  // file that has been converted to a CommonJS file using a Babel-
+  // compatible transform (i.e. "__esModule" has not been set), then set
+  // "default" to the CommonJS "module.exports" for node compatibility.
+  isNodeMode || !mod || !mod.__esModule ? __defProp(target, "default", { value: mod, enumerable: true }) : target,
+  mod
+));
+var __toCommonJS = (mod) => __copyProps(__defProp({}, "__esModule", { value: true }), mod);
+
+// src/components/pisellFloorMapLayout/components/HistoryIcons.tsx
+var HistoryIcons_exports = {};
+__export(HistoryIcons_exports, {
+  RedoHistoryIcon: () => RedoHistoryIcon,
+  UndoHistoryIcon: () => UndoHistoryIcon
+});
+module.exports = __toCommonJS(HistoryIcons_exports);
+var import_react = __toESM(require("react"));
+function HistoryIconShell({
+  size = "1em",
+  children,
+  ...rest
+}) {
+  return /* @__PURE__ */ import_react.default.createElement(
+    "svg",
+    {
+      role: "img",
+      "aria-hidden": "true",
+      focusable: "false",
+      width: size,
+      height: size,
+      viewBox: "0 0 14 14",
+      fill: "none",
+      stroke: "currentColor",
+      strokeWidth: 1.5,
+      strokeLinecap: "round",
+      strokeLinejoin: "round",
+      ...rest
+    },
+    children
+  );
+}
+function UndoHistoryIcon(props) {
+  return /* @__PURE__ */ import_react.default.createElement(HistoryIconShell, { ...props }, /* @__PURE__ */ import_react.default.createElement("path", { d: "M3 6h6.5a1.5 1.5 0 0 1 1.5 1.5V12" }), /* @__PURE__ */ import_react.default.createElement("path", { d: "M5 4 3 6l2 2" }));
+}
+function RedoHistoryIcon(props) {
+  return /* @__PURE__ */ import_react.default.createElement(HistoryIconShell, { ...props }, /* @__PURE__ */ import_react.default.createElement("path", { d: "M11 6H4.5A1.5 1.5 0 0 0 3 7.5V12" }), /* @__PURE__ */ import_react.default.createElement("path", { d: "M9 4l2 2-2 2" }));
+}
+// Annotate the CommonJS export names for ESM import in node:
+0 && (module.exports = {
+  RedoHistoryIcon,
+  UndoHistoryIcon
+});

package/lib/components/pisellFloorMapLayout/components/ItemLayer.js

@@ -95,7 +95,8 @@ function ItemLayer(props) {
   const handleItemPointerDownCapture = (0, import_react.useCallback)(
     (e) => {
       var _a;
-      if (!onInteractionChange || e.button !== 0) return;
+      if (!onInteractionChange) return;
+      if (e.pointerType !== "touch") return;
       const el = e.target;
       if (!((_a = el == null ? void 0 : el.closest) == null ? void 0 : _a.call(el, ROOM_SCROLL_SURFACE_SELECTOR))) return;
       notifyRoomScrollSurfaceActive();

package/lib/components/pisellFloorMapLayout/components/ViewControls.d.ts

@@ -25,11 +25,20 @@ export interface ViewControlsProps {
     scale?: number;
     /** 当前是否处于全屏 */
     isFullscreen?: boolean;
+    /** 当前 transform 是否处于「适配视口」结果（用于按钮激活态） */
+    fitBoundsActive?: boolean;
     className?: string;
     /** 与 config.showGridToggle 联用：当前画布是否显示网格 */
     mapGridVisible?: boolean;
     /** 切换当前画布 draft 的 mapLayer.showGrid */
     onToggleMapGrid?: () => void;
+    /**
+     * 视口锁定态：true 时显示「已锁定」图标，并禁用所有改变视角的按钮
+     * （zoom +/- / reset / fitBounds）。pan / wheel / pinch 由调用方在 TransformWrapper 上同步关闭。
+     */
+    viewportLocked?: boolean;
+    /** 切换视口锁定；未传时不展示锁定按钮 */
+    onToggleViewportLock?: () => void;
     /**
      * 平面图 Dock：圆角浅底样式，默认折叠为单入口；展开后含缩放、工具、全屏与 dockExpandedTrailing
      */