@pisell/materials 1.8.24 → 1.8.26

package/lib/components/pisellFloorMapLayout/components/EditableItemLayer.js

@@ -36,6 +36,7 @@ module.exports = __toCommonJS(EditableItemLayer_exports);
 var import_react = __toESM(require("react"));
 var import_classnames = __toESM(require("classnames"));
 var import_snap = require("../utils/snap");
+var import_FloorMapEditQuickActions = require("./FloorMapEditQuickActions");
 var import_EditableItemLayer = require("./EditableItemLayer.less");
 function isSceneLayoutTransformLocked(item) {
   var _a;
@@ -43,6 +44,7 @@ function isSceneLayoutTransformLocked(item) {
 }
 var PREFIX = "pisell-floor-map-layout";
 var DRAG_THRESHOLD = 4;
+var SELECTED_ITEM_STACK_Z = 1e6;
 function getItemKey(item, index, rowKey) {
   if (!rowKey) return item.id;
   if (typeof rowKey === "string")
@@ -78,7 +80,8 @@ function EditableItemLayer(props) {
     scale = 1,
     onInteractionChange,
     getMergedItemWrapperStyle,
-    className
+    className,
+    editQuickBar
   } = props;
   const contentRef = (0, import_react.useRef)(null);
   const liveRectRef = (0, import_react.useRef)(null);
@@ -169,9 +172,10 @@ function EditableItemLayer(props) {
     },
     [items, getItemStyle, onInteractionChange]
   );
-  const handleCanvasClick = (0, import_react.useCallback)(
+  const handleCanvasHitClick = (0, import_react.useCallback)(
     (e) => {
-      if (e.target === e.currentTarget) onSelect(null);
+      if (e.target !== e.currentTarget) return;
+      onSelect(null);
     },
     [onSelect]
   );
@@ -271,12 +275,15 @@ function EditableItemLayer(props) {
       const style = getItemStyle(item, index);
       const shapeStyle = getShapeStyle(item.shape);
       const isSelected = selectedId === item.id;
+      const wrapperStyle = getMergedItemWrapperStyle == null ? void 0 : getMergedItemWrapperStyle(item, index);
+      const baseZ = (wrapperStyle == null ? void 0 : wrapperStyle.zIndex) !== void 0 ? wrapperStyle.zIndex : item.zIndex ?? 0;
       return /* @__PURE__ */ import_react.default.createElement(
         "div",
         {
           key,
           className: (0, import_classnames.default)(`${PREFIX}-editable-item`, {
-            [`${PREFIX}-editable-item-selected`]: isSelected
+            [`${PREFIX}-editable-item-selected`]: isSelected,
+            [`${PREFIX}-editable-item-selected-lock`]: isSelected && isSceneLayoutTransformLocked(merged)
           }),
           style: {
             position: "absolute",
@@ -285,9 +292,9 @@ function EditableItemLayer(props) {
             width: style.width,
             height: style.height,
             boxSizing: "border-box",
-            zIndex: item.zIndex ?? 0,
             ...shapeStyle,
-            ...getMergedItemWrapperStyle == null ? void 0 : getMergedItemWrapperStyle(item, index)
+            ...wrapperStyle,
+            zIndex: isSelected ? SELECTED_ITEM_STACK_Z + (item.zIndex ?? 0) : baseZ
           },
           onPointerDown: (e) => handlePointerDown(e, item, index),
           onClick: (e) => handleItemClick(e, item)
@@ -304,7 +311,17 @@ function EditableItemLayer(props) {
             onPointerDown: (e) => handleResizePointerDown(e, item.id, h),
             style: { position: "absolute" }
           }
-        )))
+        ))),
+        isSelected && editQuickBar ? /* @__PURE__ */ import_react.default.createElement(
+          import_FloorMapEditQuickActions.FloorMapEditQuickActions,
+          {
+            labels: editQuickBar.labels,
+            isLocked: editQuickBar.isLocked,
+            onToggleLock: editQuickBar.onToggleLock,
+            onDuplicate: editQuickBar.onDuplicate,
+            onDelete: editQuickBar.onDelete
+          }
+        ) : null
       );
     });
   }, [
@@ -316,8 +333,17 @@ function EditableItemLayer(props) {
     handlePointerDown,
     handleItemClick,
     handleResizePointerDown,
-    getMergedItemWrapperStyle
+    getMergedItemWrapperStyle,
+    editQuickBar
   ]);
+  const canvasHitLayer = /* @__PURE__ */ import_react.default.createElement(
+    "div",
+    {
+      className: `${PREFIX}-editable-canvas-hit`,
+      onClick: handleCanvasHitClick,
+      "aria-hidden": true
+    }
+  );
   return /* @__PURE__ */ import_react.default.createElement(
     "div",
     {
@@ -331,8 +357,7 @@ function EditableItemLayer(props) {
         height: contentHeight,
         minWidth: contentWidth,
         minHeight: contentHeight
-      },
-      onClick: handleCanvasClick
+      }
     },
     contentOffsetX !== 0 || contentOffsetY !== 0 ? /* @__PURE__ */ import_react.default.createElement(
       "div",
@@ -344,11 +369,11 @@ function EditableItemLayer(props) {
           width: contentWidth,
           height: contentHeight,
           transform: `translate(${contentOffsetX}px, ${contentOffsetY}px)`
-        },
-        onClick: handleCanvasClick
+        }
       },
+      canvasHitLayer,
       itemNodes
-    ) : itemNodes
+    ) : /* @__PURE__ */ import_react.default.createElement(import_react.default.Fragment, null, canvasHitLayer, itemNodes)
   );
 }
 var EditableItemLayer_default = EditableItemLayer;

package/lib/components/pisellFloorMapLayout/components/EditableItemLayer.less

@@ -1,9 +1,21 @@
-/* 根节点不拦截事件，空白区域 mousedown 可透传到下层，让 react-zoom-pan-pinch 正常平移画布 */
+/* 根节点不拦截事件；空白处点击由 .editable-canvas-hit 承接（显式 pointer-events: auto），以免继承 none */
 .pisell-floor-map-layout-editable-item-layer {
   cursor: default;
   pointer-events: none;
 }
 
+/** 铺满内容区、叠在图元之下，用于点击空白取消选中；不参与拖拽图元 */
+.pisell-floor-map-layout-editable-canvas-hit {
+  position: absolute;
+  left: 0;
+  top: 0;
+  box-sizing: border-box;
+  width: 100%;
+  height: 100%;
+  z-index: 0;
+  pointer-events: auto;
+}
+
 .pisell-floor-map-layout-editable-item {
   cursor: move;
   outline: none;
@@ -12,14 +24,25 @@
   touch-action: none;
 
   &-selected {
-    box-shadow: 0 0 0 2px #1677ff;
-    z-index: 2;
+    /* 实际层级由 TSX 内联 zIndex（SELECTED_ITEM_STACK_Z + item.zIndex）控制 */
+    outline: 3px solid var(--fmap-primary, #1677ff);
+    outline-offset: 0;
+    box-shadow: 0 0 0 1px color-mix(in srgb, var(--fmap-primary, #1677ff) 25%, transparent);
+  }
+
+  /** 已锁定：选中描边改为警告色，与未锁定区分 */
+
+  &-selected-lock {
+    outline-color: #d48806;
+    box-shadow: 0 0 0 1px rgba(212, 136, 6, 0.28);
   }
 
   &-inner {
     width: 100%;
     height: 100%;
     pointer-events: none;
+    overflow: hidden;
+    border-radius: inherit;
   }
 }
 
@@ -27,7 +50,7 @@
   width: 10px;
   height: 10px;
   margin: -5px;
-  background: #1677ff;
+  background: var(--fmap-primary, #1677ff);
   border: 1px solid #fff;
   border-radius: 2px;
   cursor: nwse-resize;
@@ -87,3 +110,48 @@
     cursor: ew-resize;
   }
 }
+
+.pisell-floor-map-layout-edit-quick-actions {
+  position: absolute;
+  left: 50%;
+  top: 100%;
+  transform: translate(-50%, 10px);
+  display: flex;
+  align-items: center;
+  gap: 8px;
+  padding: 10px 12px;
+  background: #fff;
+  border-radius: 12px;
+  box-shadow: 0 4px 16px rgba(0, 0, 0, 0.12);
+  border: 1px solid #e8eaed;
+  /* 高于同图元内缩放点 (3)，并贴近选中项栈顶，避免被内部子 stacking 盖住 */
+  z-index: 100000;
+  pointer-events: auto;
+  touch-action: manipulation;
+
+  &--locked {
+    border-color: rgba(212, 136, 6, 0.45);
+    background: #fffbf0;
+  }
+
+  /* 无边框、更大图标按钮（antd 类名在运行环境可能为 pisell-lowcode-*） */
+
+  .pisell-lowcode-btn,
+  .ant-btn {
+    width: 44px;
+    height: 44px;
+    min-width: 44px;
+    padding: 0;
+    display: inline-flex;
+    align-items: center;
+    justify-content: center;
+    border: none !important;
+    box-shadow: none !important;
+    line-height: 1;
+
+    .pisell-lowcode-btn-icon,
+    .anticon {
+      font-size: 22px;
+    }
+  }
+}

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

@@ -1,4 +1,8 @@
-/// <reference types="react" />
+/**
+ * Figma 样式餐桌/圆桌卡片：上下小条 + 白底卡片 + 状态色边框
+ * 供 Floor Map Story 与 Sales Grid 平面图复用
+ */
+import React from 'react';
 import type { FloorMapMergedItem, FloorMapDataSources } from '../types';
 export declare type FigmaTableStatus = 'available' | 'reserved' | 'waiting' | 'dining' | 'billed' | 'availableSoon';
 /** 方桌/圆桌卡片展示用数据结构（与 Figma 设计一致，支持桌号/状态/人数/区域等） */
@@ -30,10 +34,10 @@ export interface FigmaTableCardItem {
 /** 从 merged item + dataSources 得到卡片数据 */
 export declare function getFigmaTableCardFromMerged(item: FloorMapMergedItem, dataSources: FloorMapDataSources): FigmaTableCardItem;
 /** 渲染 Figma 样式的方桌卡片（上下小条 + 白底卡片 + 状态边框） */
-export declare function renderFigmaStyleTableCard(cardItem: FigmaTableCardItem): JSX.Element;
+export declare function renderFigmaStyleTableCard(cardItem: FigmaTableCardItem): React.JSX.Element;
 /** 渲染 Figma 样式的圆桌卡片（圆形轮廓，展示桌号/状态/人数/区域） */
-export declare function renderFigmaStyleRoundTableCard(cardItem: FigmaTableCardItem): JSX.Element;
+export declare function renderFigmaStyleRoundTableCard(cardItem: FigmaTableCardItem): React.JSX.Element;
 /** 返回用于 renderItemByKind.table 的渲染函数（方桌） */
-export declare function getRenderItemByKindTable(dataSources: FloorMapDataSources): (item: unknown) => JSX.Element;
+export declare function getRenderItemByKindTable(dataSources: FloorMapDataSources): (item: unknown) => React.JSX.Element;
 /** 返回用于 renderItemByKind.roundTable 的渲染函数（圆桌） */
-export declare function getRenderItemByKindRoundTable(dataSources: FloorMapDataSources): (item: unknown) => JSX.Element;
+export declare function getRenderItemByKindRoundTable(dataSources: FloorMapDataSources): (item: unknown) => React.JSX.Element;

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

@@ -1,4 +1,8 @@
-/// <reference types="react" />
+/**
+ * FloorMapDataForm - 数据源落位的数据表单，调用 onDataSourceRecordSave
+ * 支持通过 columns 配置列标签与控件类型（string/number/select），与表格列一致
+ */
+import React from 'react';
 import type { FloorMapDataSources, DataSourceFormColumn } from '../types';
 import './FloorMapDataForm.less';
 export interface FloorMapDataFormProps {
@@ -13,5 +17,5 @@ export interface FloorMapDataFormProps {
     className?: string;
 }
 /** 简单通用表单：可编辑记录中的字段；支持 columns 配置标签与控件类型 */
-export declare function FloorMapDataForm(props: FloorMapDataFormProps): JSX.Element;
+export declare function FloorMapDataForm(props: FloorMapDataFormProps): React.JSX.Element;
 export default FloorMapDataForm;

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

@@ -1,4 +1,7 @@
-/// <reference types="react" />
+/**
+ * FloorMapEditPanel - 选中图元后的编辑面板：画布属性 + 可选数据绑定 + 数据源记录表单
+ */
+import React from 'react';
 import type { FloorMapEditPanelParams, FloorMapViewConfig, FloorMapDataSources } from '../types';
 import './FloorMapEditPanel.less';
 export interface FloorMapEditPanelProps extends FloorMapEditPanelParams {
@@ -7,5 +10,5 @@ export interface FloorMapEditPanelProps extends FloorMapEditPanelParams {
     savingRecord?: boolean;
     className?: string;
 }
-export declare function FloorMapEditPanel(props: FloorMapEditPanelProps): JSX.Element;
+export declare function FloorMapEditPanel(props: FloorMapEditPanelProps): React.JSX.Element;
 export default FloorMapEditPanel;

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

@@ -0,0 +1,24 @@
+/**
+ * 编辑态选中图元旁的快捷操作：锁定 / 复制 / 删除（与侧栏同源逻辑）
+ */
+import React from 'react';
+export interface FloorMapEditQuickActionLabels {
+    lock: string;
+    unlock: string;
+    duplicate: string;
+    delete: string;
+    popTitle: string;
+    popDesc: string;
+    cancel: string;
+    okDelete: string;
+    ariaToolbar: string;
+}
+export interface FloorMapEditQuickActionsProps {
+    className?: string;
+    labels: FloorMapEditQuickActionLabels;
+    isLocked: boolean;
+    onToggleLock: () => void;
+    onDuplicate: () => void;
+    onDelete: () => void;
+}
+export declare function FloorMapEditQuickActions(props: FloorMapEditQuickActionsProps): React.JSX.Element;

package/lib/components/pisellFloorMapLayout/components/FloorMapEditQuickActions.js

@@ -0,0 +1,108 @@
+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/FloorMapEditQuickActions.tsx
+var FloorMapEditQuickActions_exports = {};
+__export(FloorMapEditQuickActions_exports, {
+  FloorMapEditQuickActions: () => FloorMapEditQuickActions
+});
+module.exports = __toCommonJS(FloorMapEditQuickActions_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 PREFIX = "pisell-floor-map-layout";
+function FloorMapEditQuickActions(props) {
+  const { className, labels, isLocked, onToggleLock, onDuplicate, onDelete } = props;
+  const stopBubble = (0, import_react.useCallback)((e) => {
+    e.stopPropagation();
+  }, []);
+  return /* @__PURE__ */ import_react.default.createElement(
+    "div",
+    {
+      role: "toolbar",
+      "aria-label": labels.ariaToolbar,
+      className: (0, import_classnames.default)(
+        `${PREFIX}-edit-quick-actions`,
+        isLocked && `${PREFIX}-edit-quick-actions--locked`,
+        className
+      ),
+      onPointerDown: (e) => e.stopPropagation()
+    },
+    /* @__PURE__ */ import_react.default.createElement(import_antd.Tooltip, { title: isLocked ? labels.unlock : labels.lock }, /* @__PURE__ */ import_react.default.createElement(
+      import_antd.Button,
+      {
+        type: "text",
+        size: "large",
+        icon: isLocked ? /* @__PURE__ */ import_react.default.createElement(import_icons.LockOutlined, null) : /* @__PURE__ */ import_react.default.createElement(import_icons.UnlockOutlined, null),
+        onClick: (e) => {
+          stopBubble(e);
+          onToggleLock();
+        },
+        "aria-pressed": isLocked
+      }
+    )),
+    /* @__PURE__ */ import_react.default.createElement(import_antd.Tooltip, { title: labels.duplicate }, /* @__PURE__ */ import_react.default.createElement(
+      import_antd.Button,
+      {
+        type: "text",
+        size: "large",
+        icon: /* @__PURE__ */ import_react.default.createElement(import_icons.CopyOutlined, null),
+        onClick: (e) => {
+          stopBubble(e);
+          onDuplicate();
+        }
+      }
+    )),
+    /* @__PURE__ */ import_react.default.createElement(
+      import_antd.Popconfirm,
+      {
+        title: labels.popTitle,
+        description: labels.popDesc,
+        onConfirm: () => onDelete(),
+        okText: labels.okDelete,
+        cancelText: labels.cancel,
+        okButtonProps: { danger: true }
+      },
+      /* @__PURE__ */ import_react.default.createElement(import_antd.Tooltip, { title: labels.delete }, /* @__PURE__ */ import_react.default.createElement(
+        import_antd.Button,
+        {
+          type: "text",
+          danger: true,
+          size: "large",
+          icon: /* @__PURE__ */ import_react.default.createElement(import_icons.DeleteOutlined, null),
+          onClick: stopBubble
+        }
+      ))
+    )
+  );
+}
+// Annotate the CommonJS export names for ESM import in node:
+0 && (module.exports = {
+  FloorMapEditQuickActions
+});

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

@@ -1,7 +1,7 @@
 /**
  * FloorMapEditTopBar - 编辑态顶栏
- * - `mode="compact"`：画布 Tab + 可选 `canvasTabsBarTrailing` + 全屏入口（非全屏；保存多在侧栏）
- * - `mode="full"`：画布 Tab + `canvasTabsBarTrailing` + 保存（仅非浏览器全屏时）+ 全屏退出 + 扩展操作
+ * - `mode="compact"`：画布 Tab + 可选 `canvasTabsBarTrailing`（全屏入口在左下 Dock）
+ * - `mode="full"`：画布 Tab + `canvasTabsBarTrailing` + 保存（仅非浏览器全屏时）+ 扩展操作
  */
 import React from 'react';
 import type { CanvasTabsProps } from './CanvasTabs';
@@ -9,7 +9,7 @@ import type { FloorMapControlsConfig, FloorMapViewConfig } from '../types';
 import './FloorMapEditTopBar.less';
 export declare type FloorMapEditTopBarMode = 'full' | 'compact';
 export interface FloorMapEditTopBarProps {
-    /** full：全屏时的完整顶栏；compact：非全屏时 Tab + 全屏入口 */
+    /** full：全屏时的完整顶栏；compact：非全屏时 Tab + 扩展区 */
     mode?: FloorMapEditTopBarMode;
     config: FloorMapViewConfig;
     canvases: CanvasTabsProps['canvases'];
@@ -23,14 +23,16 @@ export interface FloorMapEditTopBarProps {
     saving?: boolean;
     saveError?: Error | string;
     layoutDirty?: boolean;
-    toggleFullscreen?: () => void;
+    /** full 模式：浏览器全屏时为 true，顶栏不展示保存（改由侧栏） */
     isFullscreen?: boolean;
     controls?: FloorMapControlsConfig;
     /** 顶栏右侧扩展（如「区域定位」等），仅 full 模式 */
     extraActions?: React.ReactNode;
-    /** 画布 Tab 同排最右侧业务区（在「进入全屏」/「退出全屏」与保存等之前） */
+    /** 画布 Tab 同排最右侧业务区 */
     canvasTabsBarTrailing?: React.ReactNode;
+    /** 启用画布仅 1 个时隐藏 Tab 行，仅保留右侧操作区（全屏顶栏保存等） */
+    hideCanvasTabs?: boolean;
     className?: string;
 }
-export declare function FloorMapEditTopBar(props: FloorMapEditTopBarProps): JSX.Element;
+export declare function FloorMapEditTopBar(props: FloorMapEditTopBarProps): React.JSX.Element | null;
 export default FloorMapEditTopBar;

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

@@ -35,7 +35,6 @@ __export(FloorMapEditTopBar_exports, {
 module.exports = __toCommonJS(FloorMapEditTopBar_exports);
 var import_react = __toESM(require("react"));
 var import_classnames = __toESM(require("classnames"));
-var import_icons = require("@ant-design/icons");
 var import_utils = require("@pisell/utils");
 var import_useEngineContext = __toESM(require("../../../hooks/useEngineContext"));
 var import_floorMapCanvasDisplay = require("../utils/floorMapCanvasDisplay");
@@ -59,11 +58,10 @@ function FloorMapEditTopBar(props) {
     saving,
     saveError,
     layoutDirty,
-    toggleFullscreen,
     isFullscreen = false,
-    controls = {},
     extraActions,
     canvasTabsBarTrailing,
+    hideCanvasTabs = false,
     className
   } = props;
   const engineCtx = (0, import_useEngineContext.default)();
@@ -72,34 +70,30 @@ function FloorMapEditTopBar(props) {
     (0, import_floorMapCanvasDisplay.initFloorMapLayoutLocales)(engineLocale);
     return {
       aria: import_utils.locales.getText(`${I18N_TB}.aria`),
-      fsEnterAria: import_utils.locales.getText(`${I18N_TB}.fullscreen-enter-aria`),
-      fsEnterTitle: import_utils.locales.getText(`${I18N_TB}.fullscreen-enter-title`),
-      fsExitAria: import_utils.locales.getText(`${I18N_TB}.fullscreen-exit-aria`),
-      fsExitTitle: import_utils.locales.getText(`${I18N_TB}.fullscreen-exit-title`),
       unsaved: import_utils.locales.getText(`${I18N_TB}.unsaved`),
       save: import_utils.locales.getText(`${I18N_TB}.save`),
       saving: import_utils.locales.getText(`${I18N_TB}.saving`)
     };
   }, [engineLocale]);
   const showSave = Boolean(onSave && config.canvasUi.canEdit) && !isFullscreen;
-  const showFullscreenEnter = Boolean(toggleFullscreen);
-  const showFullscreenExit = mode === "full" && isFullscreen && Boolean(toggleFullscreen);
   const hasTrailing = canvasTabsBarTrailing != null && canvasTabsBarTrailing !== false;
-  const hasFullActions = showSave || showFullscreenExit || Boolean(saveError) || extraActions != null && extraActions !== false || hasTrailing;
+  const hasFullActions = showSave || Boolean(saveError) || extraActions != null && extraActions !== false || hasTrailing;
+  const tabsHiddenClass = hideCanvasTabs ? `${PREFIX}-edit-top-bar--tabs-hidden` : void 0;
   if (mode === "compact") {
-    const showCompactActions = hasTrailing || showFullscreenEnter;
+    const showCompactActions = hasTrailing;
     return /* @__PURE__ */ import_react.default.createElement(
       "div",
       {
         className: (0, import_classnames.default)(
           `${PREFIX}-edit-top-bar`,
           `${PREFIX}-edit-top-bar--compact`,
+          tabsHiddenClass,
           className
         ),
         role: "toolbar",
         "aria-label": topBarLabels.aria
       },
-      /* @__PURE__ */ import_react.default.createElement("div", { className: `${PREFIX}-edit-top-bar-tabs` }, /* @__PURE__ */ import_react.default.createElement(
+      !hideCanvasTabs ? /* @__PURE__ */ import_react.default.createElement("div", { className: `${PREFIX}-edit-top-bar-tabs` }, /* @__PURE__ */ import_react.default.createElement(
         import_CanvasTabs.CanvasTabs,
         {
           canvases,
@@ -111,35 +105,26 @@ function FloorMapEditTopBar(props) {
           onRenameCanvas,
           className: `${PREFIX}-edit-top-bar-canvas-tabs`
         }
-      )),
-      showCompactActions ? /* @__PURE__ */ import_react.default.createElement("div", { className: `${PREFIX}-edit-top-bar-actions` }, canvasTabsBarTrailing, showFullscreenEnter ? /* @__PURE__ */ import_react.default.createElement(
-        "button",
-        {
-          type: "button",
-          className: (0, import_classnames.default)(
-            `${PREFIX}-edit-top-bar-btn`,
-            `${PREFIX}-edit-top-bar-btn-ghost`
-          ),
-          onClick: () => toggleFullscreen == null ? void 0 : toggleFullscreen(),
-          "aria-label": topBarLabels.fsEnterAria,
-          title: topBarLabels.fsEnterTitle
-        },
-        /* @__PURE__ */ import_react.default.createElement(import_icons.FullscreenOutlined, null)
-      ) : null) : null
+      )) : null,
+      showCompactActions ? /* @__PURE__ */ import_react.default.createElement("div", { className: `${PREFIX}-edit-top-bar-actions` }, canvasTabsBarTrailing) : null
     );
   }
+  if (hideCanvasTabs && !hasFullActions) {
+    return null;
+  }
   return /* @__PURE__ */ import_react.default.createElement(
     "div",
     {
       className: (0, import_classnames.default)(
         `${PREFIX}-edit-top-bar`,
         `${PREFIX}-edit-top-bar--full-chrome`,
+        tabsHiddenClass,
         className
       ),
       role: "toolbar",
       "aria-label": topBarLabels.aria
     },
-    /* @__PURE__ */ import_react.default.createElement("div", { className: `${PREFIX}-edit-top-bar-tabs` }, /* @__PURE__ */ import_react.default.createElement(
+    !hideCanvasTabs ? /* @__PURE__ */ import_react.default.createElement("div", { className: `${PREFIX}-edit-top-bar-tabs` }, /* @__PURE__ */ import_react.default.createElement(
       import_CanvasTabs.CanvasTabs,
       {
         canvases,
@@ -151,7 +136,7 @@ function FloorMapEditTopBar(props) {
         onRenameCanvas,
         className: `${PREFIX}-edit-top-bar-canvas-tabs`
       }
-    )),
+    )) : null,
     hasFullActions ? /* @__PURE__ */ import_react.default.createElement("div", { className: `${PREFIX}-edit-top-bar-actions` }, saveError ? /* @__PURE__ */ import_react.default.createElement(
       "span",
       {
@@ -159,20 +144,7 @@ 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, showFullscreenExit ? /* @__PURE__ */ import_react.default.createElement(
-      "button",
-      {
-        type: "button",
-        className: (0, import_classnames.default)(
-          `${PREFIX}-edit-top-bar-btn`,
-          `${PREFIX}-edit-top-bar-btn-ghost`
-        ),
-        onClick: () => toggleFullscreen == null ? void 0 : toggleFullscreen(),
-        "aria-label": topBarLabels.fsExitAria,
-        title: topBarLabels.fsExitTitle
-      },
-      /* @__PURE__ */ import_react.default.createElement(import_icons.FullscreenExitOutlined, null)
-    ) : null, showSave ? /* @__PURE__ */ import_react.default.createElement("div", { className: `${PREFIX}-edit-top-bar-save-group` }, layoutDirty ? /* @__PURE__ */ import_react.default.createElement(
+    ) : null, canvasTabsBarTrailing, extraActions, showSave ? /* @__PURE__ */ import_react.default.createElement("div", { className: `${PREFIX}-edit-top-bar-save-group` }, layoutDirty ? /* @__PURE__ */ import_react.default.createElement(
       "span",
       {
         className: `${PREFIX}-edit-top-bar-dirty-badge`,

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

@@ -1,4 +1,4 @@
-/* 编辑态单行顶栏：画布 Tab + 保存 / 全屏 */
+/* 编辑态单行顶栏：画布 Tab + 保存 / 扩展操作 */
 .pisell-floor-map-layout-edit-top-bar {
   display: flex;
   flex-direction: row;
@@ -9,6 +9,16 @@
   border-bottom: 1px solid #f0f0f0;
   z-index: 3;
 
+  /** 单画布：无 Tab 区时操作区靠右，去掉左侧竖线 */
+
+  &--tabs-hidden {
+    justify-content: flex-end;
+
+    .pisell-floor-map-layout-edit-top-bar-actions {
+      border-left: none;
+    }
+  }
+
   &-tabs {
     flex: 1;
     min-width: 0;
@@ -100,8 +110,8 @@
     transition: border-color 0.2s, background 0.2s;
 
     &:hover:not(:disabled) {
-      border-color: #1677ff;
-      color: #1677ff;
+      border-color: var(--fmap-primary, #1677ff);
+      color: var(--fmap-primary, #1677ff);
     }
 
     &:disabled {
@@ -111,12 +121,16 @@
 
     &.primary {
       color: #fff;
-      background: #1677ff;
-      border-color: #1677ff;
+      background: var(--fmap-primary, #1677ff);
+      border-color: var(--fmap-primary, #1677ff);
 
       &:hover:not(:disabled) {
-        background: #4096ff;
-        border-color: #4096ff;
+        background: color-mix(in srgb,
+        var(--fmap-primary, #1677ff) 88%,
+        #fff);
+        border-color: color-mix(in srgb,
+        var(--fmap-primary, #1677ff) 88%,
+        #fff);
         color: #fff;
       }
     }

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

@@ -1,6 +1,9 @@
-/// <reference types="react" />
+/**
+ * 平面图「图片图元」内层展示：支持 URL、object-fit 铺满；无地址或加载失败时占位
+ */
+import React from 'react';
 export interface FloorMapImageElementProps {
     imageUrl?: string;
     name?: string;
 }
-export declare function FloorMapImageElement(props: FloorMapImageElementProps): JSX.Element;
+export declare function FloorMapImageElement(props: FloorMapImageElementProps): React.JSX.Element;