@pisell/materials 1.8.22 → 1.8.24

package/lib/components/pisellDraggable/components/TreeItem/SortableTreeItem.d.ts

@@ -5,5 +5,5 @@ interface Props extends TreeItemProps {
     id: UniqueIdentifier;
     __designMode?: string;
 }
-declare const _default: React.MemoExoticComponent<({ id, depth, ...props }: Props) => React.JSX.Element>;
+declare const _default: React.MemoExoticComponent<({ id, depth, ...props }: Props) => JSX.Element>;
 export default _default;

package/lib/components/pisellDraggable/index.d.ts

@@ -30,6 +30,6 @@ interface Props {
     /** 自定义拖拽判断函数，返回false时阻止拖拽 */
     canDrop?: (dragItem: FlattenedItem, dropTarget: FlattenedItem, parentId: UniqueIdentifier | null, parentNode: any) => boolean;
 }
-export declare function SortableTree({ collapsible, value, indicator, indentationWidth, removable, renderItem, onChange, onRemoveBefore, __designMode, maxLevel, canDrop, }: Props): React.JSX.Element;
-declare const Demo: (props: Props) => React.JSX.Element;
+export declare function SortableTree({ collapsible, value, indicator, indentationWidth, removable, renderItem, onChange, onRemoveBefore, __designMode, maxLevel, canDrop, }: Props): JSX.Element;
+declare const Demo: (props: Props) => JSX.Element;
 export default Demo;

package/lib/components/pisellDropSort/components/SortableItem/index.d.ts

@@ -22,5 +22,5 @@ interface SortableItemProps {
     /** 获取item样式 */
     getItemStyle?: (itemProps: TreeItem) => React.CSSProperties;
 }
-declare const SortableItem: (props: SortableItemProps) => React.JSX.Element;
+declare const SortableItem: (props: SortableItemProps) => JSX.Element;
 export default SortableItem;

package/lib/components/pisellFilter/index.d.ts

@@ -1,4 +1,3 @@
-import React from 'react';
 import { PisellFilterProps } from './type';
-declare const PisellFilter: (props: PisellFilterProps) => React.JSX.Element;
+declare const PisellFilter: (props: PisellFilterProps) => JSX.Element;
 export default PisellFilter;

package/lib/components/pisellFloatingPanel/index.d.ts

@@ -13,5 +13,5 @@ export interface PisellFloatingPanelProps {
     style?: React.CSSProperties;
     retractIconStyle?: React.CSSProperties;
 }
-declare const PisellFloatingPanel: (props: PisellFloatingPanelProps) => React.JSX.Element;
+declare const PisellFloatingPanel: (props: PisellFloatingPanelProps) => JSX.Element;
 export default PisellFloatingPanel;

package/lib/components/pisellFloorMapLayout/PisellFloorMapLayout.js

@@ -627,7 +627,8 @@ function PisellFloorMapLayoutInner(props, ref) {
                   onItemClick: handleItemClick,
                   onItemHover,
                   onItemLeave,
-                  getMergedItemWrapperStyle
+                  getMergedItemWrapperStyle,
+                  onInteractionChange: setIsInteractingWithElement
                 }
               ),
               isFloorMapView && mode === "edit" && (placeMode == null ? void 0 : placeMode.type) === "scene" && /* @__PURE__ */ import_react.default.createElement(

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

@@ -1,9 +1,4 @@
-/**
- * CanvasTabs - 多画布 Tab，支持切换、动态添加、删除与重命名（编辑态）
- * - 展示名：可选 `nameKey` + `locales.getText`，否则用 `name`（字符串或多语言对象）
- * - 角标：可选 `tabBadge` 或由布局层注入合并后的数量
- */
-import React from 'react';
+/// <reference types="react" />
 import type { FloorMapCanvas, FloorMapCanvasNameI18n } from '../types';
 import './CanvasTabs.less';
 export interface CanvasTabsProps {
@@ -23,5 +18,5 @@ export interface CanvasTabsProps {
     onRenameCanvas?: (canvasId: string, name: string | FloorMapCanvasNameI18n) => void;
     className?: string;
 }
-export declare function CanvasTabs(props: CanvasTabsProps): React.JSX.Element;
+export declare function CanvasTabs(props: CanvasTabsProps): JSX.Element;
 export default CanvasTabs;

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

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

package/lib/components/pisellFloorMapLayout/components/FigmaTableCard.js

@@ -39,6 +39,9 @@ module.exports = __toCommonJS(FigmaTableCard_exports);
 var import_react = __toESM(require("react"));
 var import_antd = require("antd");
 var import_icons = require("@ant-design/icons");
+var import_utils = require("@pisell/utils");
+var I18N_CARD = "pisell-floor-map-layout.card-placeholder";
+var I18N_FIGMA = "pisell-floor-map-layout.figma-card";
 var FIGMA = {
   white: "#FFFFFF",
   gray200: "#EAECF0",
@@ -80,7 +83,9 @@ function getFigmaTableCardFromMerged(item, dataSources) {
   const el = item._sceneElement;
   const binding = el == null ? void 0 : el.dataBinding;
   const titleFromElement = (el == null ? void 0 : el.name) != null && String(el.name).trim() ? String(el.name).trim() : "";
-  const kindLabel = item.elementKind === "roundTable" ? "圆桌" : "餐桌";
+  const kindLabel = import_utils.locales.getText(
+    item.elementKind === "roundTable" ? `${I18N_FIGMA}.kind-round-table` : `${I18N_FIGMA}.kind-square-table`
+  );
   const hasDataSource = Boolean(
     (binding == null ? void 0 : binding.dataSourceKey) && String(binding.dataSourceKey).trim() !== ""
   );
@@ -91,7 +96,7 @@ function getFigmaTableCardFromMerged(item, dataSources) {
   const hasLiveRow = Boolean(record);
   if (!hasLiveRow) {
     const borderColor = "#bfbfbf";
-    const hint = !hasDataSource || !rid ? hasDataSource ? "已选择数据源，请在侧栏选择数据行" : "未绑定数据行：请在侧栏选择数据源与记录" : rid.startsWith("new_") ? `新${kindLabel}占位，可在侧栏绑定具体记录` : "未找到对应记录：请检查绑定或数据列表";
+    const hint = !hasDataSource || !rid ? hasDataSource ? import_utils.locales.getText(`${I18N_CARD}.hint-select-row`) : import_utils.locales.getText(`${I18N_CARD}.hint-bind-datasource`) : rid.startsWith("new_") ? import_utils.locales.getText(`${I18N_CARD}.hint-new-slot`).replace(/\{kind\}/g, kindLabel) : import_utils.locales.getText(`${I18N_CARD}.hint-row-not-found`);
     return {
       id: item.id,
       isNoDataPlaceholder: true,
@@ -185,7 +190,7 @@ function TableCardInfoRows({ cardItem }) {
   const hasCapacity = cardItem.capacity != null;
   const hasArea = cardItem.area != null && cardItem.area !== "";
   if (!hasCapacity && !hasArea) return null;
-  return /* @__PURE__ */ import_react.default.createElement(import_react.default.Fragment, null, hasCapacity && /* @__PURE__ */ import_react.default.createElement(FigmaCardRow, { icon: /* @__PURE__ */ import_react.default.createElement(import_icons.TeamOutlined, null) }, /* @__PURE__ */ import_react.default.createElement("span", null, "可坐 ", cardItem.capacity, " 人")), hasArea && /* @__PURE__ */ import_react.default.createElement(FigmaCardRow, { icon: /* @__PURE__ */ import_react.default.createElement(import_icons.EnvironmentOutlined, null) }, /* @__PURE__ */ import_react.default.createElement("span", null, cardItem.area)));
+  return /* @__PURE__ */ import_react.default.createElement(import_react.default.Fragment, null, hasCapacity && /* @__PURE__ */ import_react.default.createElement(FigmaCardRow, { icon: /* @__PURE__ */ import_react.default.createElement(import_icons.TeamOutlined, null) }, /* @__PURE__ */ import_react.default.createElement("span", null, import_utils.locales.getText(`${I18N_FIGMA}.capacity-seats`).replace(/\{n\}/g, String(cardItem.capacity)))), hasArea && /* @__PURE__ */ import_react.default.createElement(FigmaCardRow, { icon: /* @__PURE__ */ import_react.default.createElement(import_icons.EnvironmentOutlined, null) }, /* @__PURE__ */ import_react.default.createElement("span", null, cardItem.area)));
 }
 function TableCardContent({ cardItem }) {
   const status = cardItem.status ?? "available";
@@ -263,12 +268,12 @@ function TableCardContent({ cardItem }) {
         )
       },
       /* @__PURE__ */ import_react.default.createElement("span", null, cardItem.customerName)
-    ), cardItem.reserveTime != null && cardItem.reserveTime !== "" && /* @__PURE__ */ import_react.default.createElement(FigmaCardRow, { icon: /* @__PURE__ */ import_react.default.createElement(import_icons.ClockCircleOutlined, null) }, /* @__PURE__ */ import_react.default.createElement("span", null, cardItem.reserveTime))), (status === "dining" || status === "waiting" || status === "billed" || status === "availableSoon") && cardItem.guests != null && /* @__PURE__ */ import_react.default.createElement(import_react.default.Fragment, null, /* @__PURE__ */ import_react.default.createElement(FigmaCardRow, { icon: /* @__PURE__ */ import_react.default.createElement(import_icons.TeamOutlined, null) }, /* @__PURE__ */ import_react.default.createElement("span", null, cardItem.guests, " 人")), cardItem.dishes && /* @__PURE__ */ import_react.default.createElement(FigmaCardRow, { icon: /* @__PURE__ */ import_react.default.createElement(import_icons.AuditOutlined, null) }, /* @__PURE__ */ import_react.default.createElement("span", null, cardItem.dishes)), cardItem.duration && /* @__PURE__ */ import_react.default.createElement(FigmaCardRow, { icon: /* @__PURE__ */ import_react.default.createElement(import_icons.FieldTimeOutlined, null) }, /* @__PURE__ */ import_react.default.createElement("span", null, cardItem.duration))), /* @__PURE__ */ import_react.default.createElement(TableCardInfoRows, { cardItem }))
+    ), cardItem.reserveTime != null && cardItem.reserveTime !== "" && /* @__PURE__ */ import_react.default.createElement(FigmaCardRow, { icon: /* @__PURE__ */ import_react.default.createElement(import_icons.ClockCircleOutlined, null) }, /* @__PURE__ */ import_react.default.createElement("span", null, cardItem.reserveTime))), (status === "dining" || status === "waiting" || status === "billed" || status === "availableSoon") && cardItem.guests != null && /* @__PURE__ */ import_react.default.createElement(import_react.default.Fragment, null, /* @__PURE__ */ import_react.default.createElement(FigmaCardRow, { icon: /* @__PURE__ */ import_react.default.createElement(import_icons.TeamOutlined, null) }, /* @__PURE__ */ import_react.default.createElement("span", null, import_utils.locales.getText(`${I18N_FIGMA}.guests-count`).replace(/\{n\}/g, String(cardItem.guests)))), cardItem.dishes && /* @__PURE__ */ import_react.default.createElement(FigmaCardRow, { icon: /* @__PURE__ */ import_react.default.createElement(import_icons.AuditOutlined, null) }, /* @__PURE__ */ import_react.default.createElement("span", null, cardItem.dishes)), cardItem.duration && /* @__PURE__ */ import_react.default.createElement(FigmaCardRow, { icon: /* @__PURE__ */ import_react.default.createElement(import_icons.FieldTimeOutlined, null) }, /* @__PURE__ */ import_react.default.createElement("span", null, cardItem.duration))), /* @__PURE__ */ import_react.default.createElement(TableCardInfoRows, { cardItem }))
   );
 }
 function renderTableKindNoDataPlaceholder(cardItem, shape) {
   const borderColor = cardItem.placeholderBorderColor ?? "#bfbfbf";
-  const title = cardItem.placeholderTitle ?? "餐桌";
+  const title = cardItem.placeholderTitle ?? import_utils.locales.getText(`${I18N_FIGMA}.default-table`);
   const hint = cardItem.placeholderHint ?? "";
   return /* @__PURE__ */ import_react.default.createElement(
     "div",
@@ -429,7 +434,7 @@ function renderFigmaStyleRoundTableCard(cardItem) {
             color: FIGMA.gray700
           }
         },
-        cardItem.capacity != null && /* @__PURE__ */ import_react.default.createElement("span", null, /* @__PURE__ */ import_react.default.createElement(import_icons.TeamOutlined, { style: { marginRight: 4 } }), "可坐 ", cardItem.capacity, " 人"),
+        cardItem.capacity != null && /* @__PURE__ */ import_react.default.createElement("span", null, /* @__PURE__ */ import_react.default.createElement(import_icons.TeamOutlined, { style: { marginRight: 4 } }), import_utils.locales.getText(`${I18N_FIGMA}.capacity-seats`).replace(/\{n\}/g, String(cardItem.capacity))),
         cardItem.area != null && cardItem.area !== "" && /* @__PURE__ */ import_react.default.createElement("span", null, /* @__PURE__ */ import_react.default.createElement(import_icons.EnvironmentOutlined, { style: { marginRight: 4 } }), cardItem.area)
       )) : /* @__PURE__ */ import_react.default.createElement(import_react.default.Fragment, null, /* @__PURE__ */ import_react.default.createElement(
         "div",
@@ -448,9 +453,8 @@ function renderFigmaStyleRoundTableCard(cardItem) {
         {
           style: { fontSize: 12, color: FIGMA.gray700, marginTop: 2 }
         },
-        cardItem.guests,
-        " 人"
-      ), (cardItem.capacity != null || cardItem.area != null && cardItem.area !== "") && /* @__PURE__ */ import_react.default.createElement("div", { style: { fontSize: 12, color: FIGMA.gray700, marginTop: 2 } }, cardItem.capacity != null && `可坐 ${cardItem.capacity} 人`, cardItem.capacity != null && cardItem.area && " · ", cardItem.area))
+        import_utils.locales.getText(`${I18N_FIGMA}.guests-count`).replace(/\{n\}/g, String(cardItem.guests))
+      ), (cardItem.capacity != null || cardItem.area != null && cardItem.area !== "") && /* @__PURE__ */ import_react.default.createElement("div", { style: { fontSize: 12, color: FIGMA.gray700, marginTop: 2 } }, cardItem.capacity != null && import_utils.locales.getText(`${I18N_FIGMA}.capacity-seats`).replace(/\{n\}/g, String(cardItem.capacity)), cardItem.capacity != null && cardItem.area && " · ", cardItem.area))
     )
   );
 }

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

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

package/lib/components/pisellFloorMapLayout/components/FloorMapDataForm.js

@@ -36,8 +36,10 @@ module.exports = __toCommonJS(FloorMapDataForm_exports);
 var import_react = __toESM(require("react"));
 var import_classnames = __toESM(require("classnames"));
 var import_antd = require("antd");
+var import_utils = require("@pisell/utils");
 var import_FloorMapDataForm = require("./FloorMapDataForm.less");
 var PREFIX = "pisell-floor-map-layout";
+var I18N_DF = "pisell-floor-map-layout.data-form";
 function renderFormControl(col, value) {
   var _a;
   const type = col.type ?? "string";
@@ -83,7 +85,7 @@ function FloorMapDataForm(props) {
   }, [recordId, record, form]);
   const fieldsToRender = columns ? columns.filter((col) => col.key !== "id") : Object.entries(record).filter(([k]) => k !== "id").map(([key]) => ({ key, label: key, type: "string" }));
   if (fieldsToRender.length === 0) {
-    return /* @__PURE__ */ import_react.default.createElement("div", { className: (0, import_classnames.default)(`${PREFIX}-data-form`, className) }, /* @__PURE__ */ import_react.default.createElement("p", { className: `${PREFIX}-data-form-empty` }, "无额外字段可编辑"));
+    return /* @__PURE__ */ import_react.default.createElement("div", { className: (0, import_classnames.default)(`${PREFIX}-data-form`, className) }, /* @__PURE__ */ import_react.default.createElement("p", { className: `${PREFIX}-data-form-empty` }, import_utils.locales.getText(`${I18N_DF}.empty`)));
   }
   return /* @__PURE__ */ import_react.default.createElement("div", { className: (0, import_classnames.default)(`${PREFIX}-data-form`, className) }, /* @__PURE__ */ import_react.default.createElement(
     import_antd.Form,
@@ -106,7 +108,7 @@ function FloorMapDataForm(props) {
         loading: saving,
         disabled: !changed
       },
-      "保存记录"
+      import_utils.locales.getText(`${I18N_DF}.save-record`)
     ))
   ));
 }

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

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

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

@@ -32,5 +32,5 @@ export interface FloorMapEditTopBarProps {
     canvasTabsBarTrailing?: React.ReactNode;
     className?: string;
 }
-export declare function FloorMapEditTopBar(props: FloorMapEditTopBarProps): React.JSX.Element;
+export declare function FloorMapEditTopBar(props: FloorMapEditTopBarProps): JSX.Element;
 export default FloorMapEditTopBar;

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

@@ -91,7 +91,11 @@ function FloorMapEditTopBar(props) {
     return /* @__PURE__ */ import_react.default.createElement(
       "div",
       {
-        className: (0, import_classnames.default)(`${PREFIX}-edit-top-bar`, className),
+        className: (0, import_classnames.default)(
+          `${PREFIX}-edit-top-bar`,
+          `${PREFIX}-edit-top-bar--compact`,
+          className
+        ),
         role: "toolbar",
         "aria-label": topBarLabels.aria
       },
@@ -127,7 +131,11 @@ function FloorMapEditTopBar(props) {
   return /* @__PURE__ */ import_react.default.createElement(
     "div",
     {
-      className: (0, import_classnames.default)(`${PREFIX}-edit-top-bar`, className),
+      className: (0, import_classnames.default)(
+        `${PREFIX}-edit-top-bar`,
+        `${PREFIX}-edit-top-bar--full-chrome`,
+        className
+      ),
       role: "toolbar",
       "aria-label": topBarLabels.aria
     },

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

@@ -128,4 +128,23 @@
     font-size: 16px;
   }
 
+  /**
+   * 只读顶栏（`edit-top-bar` + `read-canvas-tabs-bar` 并列）、编辑态 compact、
+   * 以及全屏/locked 时的 full 顶栏：与左侧 Tab 同一浅灰底，去掉右侧大块白底与竖线分割。
+   */
+
+  &.pisell-floor-map-layout-read-canvas-tabs-bar,
+  &--compact,
+  &--full-chrome {
+    background: rgba(0, 0, 0, 0.04);
+
+    .pisell-floor-map-layout-edit-top-bar-actions {
+      background: transparent;
+      border-left: none;
+    }
+
+    .pisell-floor-map-layout-edit-top-bar-canvas-tabs.pisell-floor-map-layout-canvas-tabs {
+      background: transparent;
+    }
+  }
 }

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

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

package/lib/components/pisellFloorMapLayout/components/FloorMapImageElement.js

@@ -33,7 +33,9 @@ __export(FloorMapImageElement_exports, {
 });
 module.exports = __toCommonJS(FloorMapImageElement_exports);
 var import_react = __toESM(require("react"));
+var import_utils = require("@pisell/utils");
 var PREFIX = "pisell-floor-map-layout";
+var I18N_IMG = "pisell-floor-map-layout.image-element";
 function FloorMapImageElement(props) {
   const { imageUrl, name } = props;
   const [broken, setBroken] = (0, import_react.useState)(false);
@@ -41,7 +43,7 @@ function FloorMapImageElement(props) {
   (0, import_react.useEffect)(() => {
     setBroken(false);
   }, [trimmed]);
-  const label = name != null && String(name).trim() ? String(name).trim() : "图片图元";
+  const label = name != null && String(name).trim() ? String(name).trim() : import_utils.locales.getText(`${I18N_IMG}.default-name`);
   if (!trimmed || broken) {
     return /* @__PURE__ */ import_react.default.createElement(
       "div",
@@ -67,7 +69,7 @@ function FloorMapImageElement(props) {
         }
       },
       /* @__PURE__ */ import_react.default.createElement("span", { style: { fontWeight: 600, color: "#595959", marginBottom: 4 } }, label),
-      /* @__PURE__ */ import_react.default.createElement("span", null, !trimmed ? "在侧栏填写图片地址；可调层级置于桌位下方作底图" : "图片加载失败，请检查地址")
+      /* @__PURE__ */ import_react.default.createElement("span", null, !trimmed ? import_utils.locales.getText(`${I18N_IMG}.hint-no-url`) : import_utils.locales.getText(`${I18N_IMG}.hint-load-fail`))
     );
   }
   return /* @__PURE__ */ import_react.default.createElement(

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

@@ -31,5 +31,5 @@ export interface FloorMapToolbarProps {
     /** 触摸拖放结束后吞掉按钮 click，避免误触切换落点模式 */
     consumeToolbarClickIfTouchDrag?: () => boolean;
 }
-export declare function FloorMapToolbar(props: FloorMapToolbarProps): React.JSX.Element;
+export declare function FloorMapToolbar(props: FloorMapToolbarProps): JSX.Element;
 export default FloorMapToolbar;

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

@@ -40,8 +40,11 @@ var import_types = require("../types");
 var import_floorMapElementKindUtils = require("../utils/floorMapElementKindUtils");
 var import_floorMapDropUtils = require("../utils/floorMapDropUtils");
 var import_floorMapDataRecordLabel = require("../utils/floorMapDataRecordLabel");
+var import_utils = require("@pisell/utils");
 var import_FloorMapToolbar = require("./FloorMapToolbar.less");
 var PREFIX = "pisell-floor-map-layout";
+var I18N_TB = "pisell-floor-map-layout.toolbar";
+var I18N_EP_DS = "pisell-floor-map-layout.edit-panel.ph-data-source";
 var DEFAULT_PLACEMENT_SIZE = { width: 180, height: 120 };
 var DEFAULT_DECORATION_SIZE = 48;
 function getUnplacedRecordsForKey(dataSourceKey, dataSources, elements) {
@@ -110,7 +113,13 @@ function FloorMapToolbar(props) {
   const categories = (0, import_react.useMemo)(() => {
     const raw = config.elementKindCategories ?? [];
     const sorted = [...raw].sort((a, b) => (a.order ?? 0) - (b.order ?? 0));
-    return sorted.length ? sorted : [{ id: "_uncat", label: "图元", order: 0 }];
+    return sorted.length ? sorted : [
+      {
+        id: "_uncat",
+        label: import_utils.locales.getText(`${I18N_TB}.category-fallback`),
+        order: 0
+      }
+    ];
   }, [config.elementKindCategories]);
   const kindsByCategory = (0, import_react.useMemo)(() => {
     var _a;
@@ -205,7 +214,7 @@ function FloorMapToolbar(props) {
           );
           e.dataTransfer.effectAllowed = "copy";
         },
-        title: `点击后画布落点，或拖拽到画布生成「${k.label}」`
+        title: import_utils.locales.getText(`${I18N_TB}.palette-card-title`).replace(/\{name\}/g, k.label)
       },
       /* @__PURE__ */ import_react.default.createElement(
         "div",
@@ -233,10 +242,10 @@ function FloorMapToolbar(props) {
         ) : /* @__PURE__ */ import_react.default.createElement("span", { className: `${PREFIX}-toolbar-preview-fallback` }, k.label)
       ),
       /* @__PURE__ */ import_react.default.createElement("span", { className: `${PREFIX}-toolbar-preview-card-label` }, k.label)
-    ), isActive && policy !== "none" && /* @__PURE__ */ import_react.default.createElement(import_react.default.Fragment, null, allowedKeys.length >= 1 && /* @__PURE__ */ import_react.default.createElement("div", { className: `${PREFIX}-toolbar-record-pick` }, /* @__PURE__ */ import_react.default.createElement("div", { className: `${PREFIX}-toolbar-record-pick-label` }, "数据绑定（可选）"), /* @__PURE__ */ import_react.default.createElement(
+    ), isActive && policy !== "none" && /* @__PURE__ */ import_react.default.createElement(import_react.default.Fragment, null, allowedKeys.length >= 1 && /* @__PURE__ */ import_react.default.createElement("div", { className: `${PREFIX}-toolbar-record-pick` }, /* @__PURE__ */ import_react.default.createElement("div", { className: `${PREFIX}-toolbar-record-pick-label` }, import_utils.locales.getText(`${I18N_TB}.data-binding-optional`)), /* @__PURE__ */ import_react.default.createElement(
       import_antd.Select,
       {
-        placeholder: "选择数据源",
+        placeholder: import_utils.locales.getText(I18N_EP_DS),
         allowClear: true,
         value: placeMode.type === "scene" ? placeMode.dataSourceKey : void 0,
         options: allowedKeys.map((key) => ({
@@ -254,7 +263,7 @@ function FloorMapToolbar(props) {
       const mode = (placeMode == null ? void 0 : placeMode.type) === "scene" ? placeMode : null;
       const key = mode == null ? void 0 : mode.dataSourceKey;
       if (!key) {
-        return /* @__PURE__ */ import_react.default.createElement("div", { className: `${PREFIX}-toolbar-record-pick-hint` }, "选择数据源后可选绑定数据行，或直接落点占位。");
+        return /* @__PURE__ */ import_react.default.createElement("div", { className: `${PREFIX}-toolbar-record-pick-hint` }, import_utils.locales.getText(`${I18N_TB}.hint-after-select-ds`));
       }
       const unplaced = getUnplacedRecordsForKey(
         key,
@@ -262,14 +271,16 @@ function FloorMapToolbar(props) {
         sceneElements
       );
       if (unplaced.length === 0) {
-        return /* @__PURE__ */ import_react.default.createElement("div", { className: `${PREFIX}-toolbar-record-pick-hint` }, "当前数据源无未绑定记录，或列表为空；可直接在画布落点占位。");
+        return /* @__PURE__ */ import_react.default.createElement("div", { className: `${PREFIX}-toolbar-record-pick-hint` }, import_utils.locales.getText(`${I18N_TB}.hint-no-unplaced-rows`));
       }
       const recordValue = (mode == null ? void 0 : mode.recordIds) && mode.recordIds.length > 0 ? mode.recordIds : (mode == null ? void 0 : mode.recordId) ? [mode.recordId] : void 0;
       return /* @__PURE__ */ import_react.default.createElement(import_react.default.Fragment, null, /* @__PURE__ */ import_react.default.createElement(
         import_antd.Select,
         {
           mode: "multiple",
-          placeholder: "选择要展示的记录（可选，可多选）",
+          placeholder: import_utils.locales.getText(
+            `${I18N_TB}.ph-select-records`
+          ),
           allowClear: true,
           maxTagCount: "responsive",
           value: recordValue,
@@ -283,15 +294,15 @@ function FloorMapToolbar(props) {
           size: "large",
           style: { width: "100%", marginTop: 4 }
         }
-      ), /* @__PURE__ */ import_react.default.createElement("div", { className: `${PREFIX}-toolbar-record-pick-hint` }, "可选多条，在画布点击一次将按阶梯偏移落多条；留空则先占位，稍后在侧栏绑定。"));
-    })()), allowedKeys.length === 0 && /* @__PURE__ */ import_react.default.createElement("div", { className: `${PREFIX}-toolbar-record-hint` }, "无可用数据源"), /* @__PURE__ */ import_react.default.createElement(
+      ), /* @__PURE__ */ import_react.default.createElement("div", { className: `${PREFIX}-toolbar-record-pick-hint` }, import_utils.locales.getText(`${I18N_TB}.hint-multi-drop`)));
+    })()), allowedKeys.length === 0 && /* @__PURE__ */ import_react.default.createElement("div", { className: `${PREFIX}-toolbar-record-hint` }, import_utils.locales.getText(`${I18N_TB}.no-data-sources`)), /* @__PURE__ */ import_react.default.createElement(
       "button",
       {
         type: "button",
         className: `${PREFIX}-toolbar-btn cancel-inline`,
         onClick: cancelPlaceMode
       },
-      "取消新建"
+      import_utils.locales.getText(`${I18N_TB}.cancel-place`)
     )), isActive && policy === "none" && /* @__PURE__ */ import_react.default.createElement(
       "button",
       {
@@ -299,7 +310,7 @@ function FloorMapToolbar(props) {
         className: `${PREFIX}-toolbar-btn cancel-inline`,
         onClick: cancelPlaceMode
       },
-      "取消新建"
+      import_utils.locales.getText(`${I18N_TB}.cancel-place`)
     ));
   };
   return /* @__PURE__ */ import_react.default.createElement(
@@ -316,7 +327,7 @@ function FloorMapToolbar(props) {
       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" }, "布局已修改，请点击「保存」持久化。") : 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(
+    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",
@@ -326,7 +337,7 @@ function FloorMapToolbar(props) {
         disabled: saving,
         onClick: onSave
       },
-      saving ? "保存中..." : "保存"
+      saving ? import_utils.locales.getText(`${I18N_TB}.saving`) : import_utils.locales.getText(`${I18N_TB}.save`)
     ))
   );
 }

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

@@ -37,7 +37,12 @@ export interface ItemLayerProps<T extends FloorMapItemBase> {
     onItemLeave?: (item: T, index: number, e: React.MouseEvent<HTMLElement>) => void;
     /** 每项外层容器额外样式（与定位样式合并） */
     getMergedItemWrapperStyle?: (item: T, index: number) => CSSProperties | undefined;
+    /**
+     * 与编辑态一致：在含 `data-pisell-floor-room-scroll-surface` 的区域内按下时置 true，
+     * 用于禁用 Transform 画布平移，避免图元内纵向滑动拖动画布。
+     */
+    onInteractionChange?: (active: boolean) => void;
     className?: string;
 }
-export declare function ItemLayer<T extends FloorMapItemBase>(props: ItemLayerProps<T>): React.JSX.Element;
+export declare function ItemLayer<T extends FloorMapItemBase>(props: ItemLayerProps<T>): JSX.Element;
 export default ItemLayer;

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

@@ -37,6 +37,7 @@ var import_react = __toESM(require("react"));
 var import_classnames = __toESM(require("classnames"));
 var import_ItemLayer = require("./ItemLayer.less");
 var PREFIX = "pisell-floor-map-layout";
+var ROOM_SCROLL_SURFACE_SELECTOR = "[data-pisell-floor-room-scroll-surface]";
 function getItemKey(item, index, rowKey) {
   if (!rowKey) return item.id;
   if (typeof rowKey === "string")
@@ -73,8 +74,48 @@ function ItemLayer(props) {
     onItemHover,
     onItemLeave,
     getMergedItemWrapperStyle,
+    onInteractionChange,
     className
   } = props;
+  const notifyRoomScrollSurfaceActive = (0, import_react.useCallback)(() => {
+    if (!onInteractionChange) return;
+    onInteractionChange(true);
+    const finish = () => {
+      onInteractionChange(false);
+    };
+    window.addEventListener("pointerup", finish, { once: true });
+    window.addEventListener("pointercancel", finish, { once: true });
+    window.addEventListener("touchend", finish, { once: true, passive: true });
+    window.addEventListener("touchcancel", finish, {
+      once: true,
+      passive: true
+    });
+  }, [onInteractionChange]);
+  const handleItemPointerDownCapture = (0, import_react.useCallback)(
+    (e) => {
+      var _a;
+      if (!onInteractionChange || e.button !== 0) 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();
+    },
+    [onInteractionChange, notifyRoomScrollSurfaceActive]
+  );
+  const handleItemTouchStartCapture = (0, import_react.useCallback)(
+    (e) => {
+      var _a;
+      if (!onInteractionChange) 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();
+    },
+    [onInteractionChange, notifyRoomScrollSurfaceActive]
+  );
+  (0, import_react.useEffect)(() => {
+    return () => {
+      onInteractionChange == null ? void 0 : onInteractionChange(false);
+    };
+  }, [onInteractionChange]);
   const itemNodes = (0, import_react.useMemo)(() => {
     const isPixel = itemUnit === "pixel";
     const g = itemGap;
@@ -119,7 +160,9 @@ function ItemLayer(props) {
           },
           onClick: (e) => onItemClick == null ? void 0 : onItemClick(item, index, e),
           onMouseEnter: (e) => onItemHover == null ? void 0 : onItemHover(item, index, e),
-          onMouseLeave: (e) => onItemLeave == null ? void 0 : onItemLeave(item, index, e)
+          onMouseLeave: (e) => onItemLeave == null ? void 0 : onItemLeave(item, index, e),
+          onPointerDownCapture: handleItemPointerDownCapture,
+          onTouchStartCapture: handleItemTouchStartCapture
         },
         renderItem(item, index)
       );
@@ -135,7 +178,9 @@ function ItemLayer(props) {
     onItemClick,
     onItemHover,
     onItemLeave,
-    getMergedItemWrapperStyle
+    getMergedItemWrapperStyle,
+    handleItemPointerDownCapture,
+    handleItemTouchStartCapture
   ]);
   return /* @__PURE__ */ import_react.default.createElement(
     "div",

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

@@ -1,7 +1,4 @@
-/**
- * ViewControls - 内置视图控制按钮：缩放（Stepper）、复位、区域定位
- */
-import React from 'react';
+/// <reference types="react" />
 import type { FloorMapControlsConfig } from '../types';
 import './ViewControls.less';
 /** 从 react-zoom-pan-pinch 拿到的控制 API（由主组件传入） */
@@ -29,5 +26,5 @@ export interface ViewControlsProps {
     /** 切换当前画布 draft 的 mapLayer.showGrid */
     onToggleMapGrid?: () => void;
 }
-export declare function ViewControls(props: ViewControlsProps): React.JSX.Element;
+export declare function ViewControls(props: ViewControlsProps): JSX.Element;
 export default ViewControls;