@pisell/materials 1.8.23 → 1.8.24

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

@@ -0,0 +1,48 @@
+/**
+ * ItemLayer - 楼层图展示层
+ * 按 items 的 (x, y) 与 cellSize 定位，用 renderItem 渲染每项内容
+ */
+import React from 'react';
+import type { FloorMapItemBase, FloorMapItemUnit } from '../types';
+import type { CSSProperties } from 'react';
+import './ItemLayer.less';
+export interface ItemLayerProps<T extends FloorMapItemBase> {
+    /** 资源列表 */
+    items: T[];
+    /** 每项渲染函数 */
+    renderItem: (item: T, index: number) => React.ReactNode;
+    /** 每项 key */
+    rowKey?: string | ((item: T, index: number) => string);
+    /** 每格像素尺寸（cell 单位时用；pixel 单位时作为缺省宽高） */
+    cellSize: number;
+    /** item 坐标与尺寸单位：cell 格子数，pixel 像素 */
+    itemUnit?: FloorMapItemUnit;
+    /** item 之间的间距（像素），仅 cell 单位时生效 */
+    itemGap?: number;
+    /** 内容区总宽度（像素），由 items 推导或外部传入 */
+    contentWidth: number;
+    /** 内容区总高度（像素） */
+    contentHeight: number;
+    /** 内容区 X 偏移（画布包围盒向左/上扩展时，图元层整体平移） */
+    contentOffsetX?: number;
+    /** 内容区 Y 偏移 */
+    contentOffsetY?: number;
+    /** 是否启用 hover 事件 */
+    enableHover?: boolean;
+    /** 点击回调 */
+    onItemClick?: (item: T, index: number, e: React.MouseEvent<HTMLElement>) => void;
+    /** hover 进入 */
+    onItemHover?: (item: T, index: number, e: React.MouseEvent<HTMLElement>) => void;
+    /** hover 离开 */
+    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>): 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

@@ -0,0 +1,30 @@
+/// <reference types="react" />
+import type { FloorMapControlsConfig } from '../types';
+import './ViewControls.less';
+/** 从 react-zoom-pan-pinch 拿到的控制 API（由主组件传入） */
+export interface ViewControlsApi {
+    zoomIn: () => void;
+    zoomOut: () => void;
+    resetTransform: () => void;
+    /** 区域定位，可能由主组件基于 items 计算后封装 */
+    fitBounds?: () => void;
+    /** 切换全屏（requestFullscreen / exitFullscreen） */
+    toggleFullscreen?: () => void;
+}
+export interface ViewControlsProps {
+    /** 控制 API */
+    api: ViewControlsApi;
+    /** 显隐配置 */
+    config?: FloorMapControlsConfig;
+    /** 当前缩放比例（1 = 100%），用于 Stepper 展示 */
+    scale?: number;
+    /** 当前是否处于全屏 */
+    isFullscreen?: boolean;
+    className?: string;
+    /** 与 config.showGridToggle 联用：当前画布是否显示网格 */
+    mapGridVisible?: boolean;
+    /** 切换当前画布 draft 的 mapLayer.showGrid */
+    onToggleMapGrid?: () => void;
+}
+export declare function ViewControls(props: ViewControlsProps): JSX.Element;
+export default ViewControls;

package/lib/components/pisellFloorMapLayout/components/ViewControls.js

@@ -36,8 +36,10 @@ module.exports = __toCommonJS(ViewControls_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_ViewControls = require("./ViewControls.less");
 var PREFIX = "pisell-floor-map-layout";
+var I18N_VC = "pisell-floor-map-layout.view-controls";
 function ViewControls(props) {
   const {
     api,
@@ -61,7 +63,7 @@ function ViewControls(props) {
       type: "button",
       className: `${PREFIX}-view-controls-zoom-stepper-btn`,
       onClick: () => api.zoomOut(),
-      "aria-label": "缩小"
+      "aria-label": import_utils.locales.getText(`${I18N_VC}.zoom-out-aria`)
     },
     /* @__PURE__ */ import_react.default.createElement(import_icons.MinusOutlined, null)
   ), /* @__PURE__ */ import_react.default.createElement("span", { className: `${PREFIX}-view-controls-zoom-stepper-value` }, scalePercent, "%"), /* @__PURE__ */ import_react.default.createElement(
@@ -70,7 +72,7 @@ function ViewControls(props) {
       type: "button",
       className: `${PREFIX}-view-controls-zoom-stepper-btn`,
       onClick: () => api.zoomIn(),
-      "aria-label": "放大"
+      "aria-label": import_utils.locales.getText(`${I18N_VC}.zoom-in-aria`)
     },
     /* @__PURE__ */ import_react.default.createElement(import_icons.PlusOutlined, null)
   )), showToolsCapsule && /* @__PURE__ */ import_react.default.createElement("div", { className: `${PREFIX}-view-controls-tools-capsule` }, showReset && /* @__PURE__ */ import_react.default.createElement(
@@ -79,7 +81,7 @@ function ViewControls(props) {
       type: "button",
       className: `${PREFIX}-view-controls-tool-btn`,
       onClick: () => api.resetTransform(),
-      "aria-label": "复位"
+      "aria-label": import_utils.locales.getText(`${I18N_VC}.reset-aria`)
     },
     "⟲"
   ), showFitBounds && api.fitBounds && /* @__PURE__ */ import_react.default.createElement(
@@ -88,7 +90,7 @@ function ViewControls(props) {
       type: "button",
       className: `${PREFIX}-view-controls-tool-btn`,
       onClick: () => api.fitBounds(),
-      "aria-label": "区域定位"
+      "aria-label": import_utils.locales.getText(`${I18N_VC}.fit-bounds-aria`)
     },
     "⊞"
   ), showGridToggle && /* @__PURE__ */ import_react.default.createElement(
@@ -100,7 +102,9 @@ function ViewControls(props) {
       }),
       onClick: () => onToggleMapGrid(),
       "aria-pressed": mapGridVisible,
-      "aria-label": mapGridVisible ? "隐藏网格" : "显示网格"
+      "aria-label": import_utils.locales.getText(
+        mapGridVisible ? `${I18N_VC}.grid-hide-aria` : `${I18N_VC}.grid-show-aria`
+      )
     },
     /* @__PURE__ */ import_react.default.createElement(import_icons.BorderInnerOutlined, null)
   ), showFullscreen && api.toggleFullscreen && /* @__PURE__ */ import_react.default.createElement(
@@ -109,7 +113,9 @@ function ViewControls(props) {
       type: "button",
       className: `${PREFIX}-view-controls-tool-btn`,
       onClick: () => api.toggleFullscreen(),
-      "aria-label": isFullscreen ? "退出全屏" : "全屏"
+      "aria-label": import_utils.locales.getText(
+        isFullscreen ? `${I18N_VC}.fullscreen-exit-aria` : `${I18N_VC}.fullscreen-aria`
+      )
     },
     isFullscreen ? /* @__PURE__ */ import_react.default.createElement(import_icons.FullscreenExitOutlined, null) : /* @__PURE__ */ import_react.default.createElement(import_icons.FullscreenOutlined, null)
   )));

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

@@ -0,0 +1,13 @@
+/// <reference types="react" />
+import type { FloorMapControlsConfig } from '../types';
+export interface ViewControlsWithZoomProps {
+    config?: FloorMapControlsConfig;
+    scale?: number;
+    isFullscreen?: boolean;
+    fitBounds: () => void;
+    /** 未传时不展示全屏按钮（如编辑态 floorMapFullscreenMode 为 disabled） */
+    toggleFullscreen?: () => void;
+    mapGridVisible?: boolean;
+    onToggleMapGrid?: () => void;
+}
+export declare function ViewControlsWithZoom(props: ViewControlsWithZoomProps): JSX.Element;

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

@@ -0,0 +1,21 @@
+/**
+ * 楼层图布局子组件导出
+ */
+export { MapLayer } from './MapLayer';
+export { ItemLayer } from './ItemLayer';
+export { ViewControls } from './ViewControls';
+export { ViewControlsWithZoom } from './ViewControlsWithZoom';
+export { CanvasTabs } from './CanvasTabs';
+export { EditableItemLayer } from './EditableItemLayer';
+export { FloorMapToolbar } from './FloorMapToolbar';
+export { FloorMapEditTopBar } from './FloorMapEditTopBar';
+export { FloorMapEditPanel } from './FloorMapEditPanel';
+export { FloorMapDataForm } from './FloorMapDataForm';
+export type { ViewControlsApi } from './ViewControls';
+export type { ViewControlsWithZoomProps } from './ViewControlsWithZoom';
+export type { CanvasTabsProps } from './CanvasTabs';
+export type { EditableItemLayerProps } from './EditableItemLayer';
+export type { FloorMapToolbarProps, PlaceMode } from './FloorMapToolbar';
+export type { FloorMapEditTopBarProps, FloorMapEditTopBarMode, } from './FloorMapEditTopBar';
+export type { FloorMapEditPanelProps } from './FloorMapEditPanel';
+export type { FloorMapDataFormProps } from './FloorMapDataForm';

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

@@ -0,0 +1,63 @@
+import type { MouseEvent, MutableRefObject } from 'react';
+import type { DataSourceFormColumn, FloorMapCanvasNameI18n, FloorMapDataSourceRecordFormContent, FloorMapDataSources, FloorMapItemBase, FloorMapMergedItem, FloorMapPlaceMode, FloorMapSceneElement, FloorMapViewConfig } from '../types';
+export interface UseFloorMapEditStateParams<T extends FloorMapItemBase> {
+    floorMapConfigProp: FloorMapViewConfig | undefined;
+    isFloorMapView: boolean;
+    itemsProp: T[];
+    cellSizeProp?: number;
+    dataSources: FloorMapDataSources | undefined;
+    onSave: ((config: FloorMapViewConfig) => void) | undefined;
+    onDataSourceRecordSave: ((dataSourceKey: string, id: string, newData: Record<string, unknown>) => void) | undefined;
+    dataSourceFormColumns: Record<string, DataSourceFormColumn[]> | undefined;
+    dataSourceRecordForm: Record<string, FloorMapDataSourceRecordFormContent> | undefined;
+    dataSourceLabels?: Record<string, string>;
+    layoutPrefix: string;
+    contentOffsetRef: MutableRefObject<{
+        x: number;
+        y: number;
+    }>;
+    showDataSourceRecordFormBlock?: boolean;
+}
+export declare function useFloorMapEditState<T extends FloorMapItemBase>(params: UseFloorMapEditStateParams<T>): {
+    config: FloorMapViewConfig | null;
+    currentCanvasId: string | null;
+    setCurrentCanvasId: import("react").Dispatch<import("react").SetStateAction<string | null>>;
+    selectedId: string | null;
+    setSelectedId: import("react").Dispatch<import("react").SetStateAction<string | null>>;
+    placeMode: FloorMapPlaceMode;
+    setPlaceMode: import("react").Dispatch<import("react").SetStateAction<FloorMapPlaceMode>>;
+    mergedItems: FloorMapMergedItem[];
+    items: T[];
+    saving: boolean;
+    savingRecord: boolean;
+    handleAddCanvas: () => void;
+    handleRemoveCanvas: (canvasId: string) => void;
+    handleRenameCanvas: (canvasId: string, name: string | FloorMapCanvasNameI18n) => void;
+    handleUpdateItem: (itemId: string, patch: Partial<{
+        x: number;
+        y: number;
+        width: number;
+        height: number;
+    }>) => void;
+    handleCanvasPlaceClick: (e: MouseEvent<HTMLDivElement>) => void;
+    handleSave: () => void;
+    placeSceneElementFromPaletteDrop: (contentX: number, contentY: number, scene: Extract<FloorMapPlaceMode, {
+        type: 'scene';
+    }>) => void;
+    editPanelParams: {
+        itemId: string;
+        sceneElement: FloorMapSceneElement;
+        onUpdate: (patch: Partial<FloorMapSceneElement>) => void;
+        onSaveRecord: ((dataSourceKey: string, id: string, newData: Record<string, unknown>) => void) | undefined;
+        onClose: () => void;
+        onDelete: (() => void) | undefined;
+        recordFormColumns: Record<string, DataSourceFormColumn[]> | undefined;
+        dataSourceRecordForm: Record<string, FloorMapDataSourceRecordFormContent> | undefined;
+        dataSourceLabels: Record<string, string> | undefined;
+        layoutDraftDirty: boolean;
+        showDataSourceRecordFormBlock: boolean | undefined;
+    } | null;
+    placeOverlayClass: string;
+    isLayoutDirty: boolean;
+    toggleDraftCanvasShowGrid: () => void;
+};

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

@@ -45,6 +45,7 @@ var import_layoutMeasurements = require("../utils/layoutMeasurements");
 var import_floorMapCanvasDisplay = require("../utils/floorMapCanvasDisplay");
 var import_types = require("../types");
 var IMAGE_PLACE_DEFAULT = { width: 400, height: 240 };
+var I18N_PLACEMENT_FALLBACK_IMAGE = "pisell-floor-map-layout.placement.fallback-image-name";
 var GRID_VIS_STORAGE_PREFIX = "pisell-floor-map-layout.grid-visible";
 function getGridVisStorageKey(canvasId) {
   return `${GRID_VIS_STORAGE_PREFIX}:${canvasId}`;
@@ -382,7 +383,7 @@ function useFloorMapEditState(params) {
       const placementName = (() => {
         var _a3, _b2;
         if (isStage) return import_floorMapStageDefaults.STAGE_DECO_DEFAULT.name;
-        if (isImage) return "底图";
+        if (isImage) return import_utils.locales.getText(I18N_PLACEMENT_FALLBACK_IMAGE);
         const db = dataBinding;
         const rid = recordIdsToPlace[0];
         if (db && rid) {

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

@@ -0,0 +1,15 @@
+/**
+ * PisellFloorMapLayout 组件入口
+ * 空间布局视图：在二维平面按坐标渲染资源，支持缩放/平移/复位；支持 floorMapConfig + mode 平面图视图
+ */
+export { PisellFloorMapLayout } from './PisellFloorMapLayout';
+export type { PisellFloorMapLayoutProps, PisellFloorMapLayoutRef, FloorMapItemBase, FloorMapItemUnit, FloorMapLayerConfig, FloorMapZoomConfig, FloorMapPanConfig, FloorMapControlsConfig, FloorMapItemShape, FloorMapBackgroundType, FloorMapPanBoundary, FloorMapLayoutMode, FloorMapGridLayoutConfig, FloorMapCanvas, FloorMapCanvasNameI18n, FloorMapElement, FloorMapData, FloorMapViewConfig, FloorMapCanvasUiConfig, FloorMapSceneElement, FloorMapSceneElementDataBinding, FloorMapPlaceMode, FloorMapElementKindCategory, FloorMapElementDataBindingPolicy, FloorMapElementDefaultPresentation, FloorMapEdge, FloorMapElementKindConfig, FloorMapElementType, FloorMapTextSlot, FloorMapDataSources, FloorMapRenderOptions, FloorMapEditPanelParams, DataSourceFormColumn, FloorMapMergedItem, FloorMapRecordFormRenderContext, FloorMapDataSourceRecordFormContent, FloorMapFullscreenMode, FloorMapLayoutContextValue, FloorMapViewportOverlayRenderArgs, } from './types';
+export { FLOOR_MAP_STAGE_ELEMENT_KIND, FLOOR_MAP_IMAGE_ELEMENT_KIND, } from './types';
+export { renderFloorMapFallbackPlaceholder } from './utils/floorMapFallbackRender';
+export { isFloorMapImageElementKind } from './utils/floorMapElementKindUtils';
+export { FloorMapLayoutProvider, useFloorMapLayoutContext, EMPTY_FLOOR_MAP_LAYOUT_CONTEXT, } from './context/FloorMapLayoutContext';
+export type { FloorMapLayoutProviderProps } from './context/FloorMapLayoutContext';
+export { mergeFloorMapLayoutPropsFromContext } from './context/mergeFloorMapLayoutContext';
+export { FloorMapImageElement } from './components/FloorMapImageElement';
+export { getFigmaTableCardFromMerged, renderFigmaStyleTableCard, renderFigmaStyleRoundTableCard, getRenderItemByKindTable, getRenderItemByKindRoundTable, } from './components/FigmaTableCard';
+export type { FigmaTableCardItem, FigmaTableStatus, } from './components/FigmaTableCard';

package/lib/components/pisellFloorMapLayout/locales-ja.d.ts

@@ -0,0 +1,104 @@
+/**
+ * PisellFloorMapLayout — 日本語
+ */
+declare const _default: {
+    'pisell-floor-map-layout.loading': string;
+    'pisell-floor-map-layout.read-canvas-tabs.aria': string;
+    'pisell-floor-map-layout.edit-top-bar.aria': string;
+    'pisell-floor-map-layout.edit-top-bar.fullscreen-enter-aria': string;
+    'pisell-floor-map-layout.edit-top-bar.fullscreen-enter-title': string;
+    'pisell-floor-map-layout.edit-top-bar.fullscreen-exit-aria': string;
+    'pisell-floor-map-layout.edit-top-bar.fullscreen-exit-title': string;
+    'pisell-floor-map-layout.edit-top-bar.unsaved': string;
+    'pisell-floor-map-layout.edit-top-bar.save': string;
+    'pisell-floor-map-layout.edit-top-bar.saving': string;
+    'pisell-floor-map-layout.canvas-tabs.empty': string;
+    'pisell-floor-map-layout.canvas-tabs.add': string;
+    'pisell-floor-map-layout.canvas-tabs.add-title': string;
+    'pisell-floor-map-layout.canvas-tabs.hint': string;
+    'pisell-floor-map-layout.canvas-tabs.rename-aria': string;
+    'pisell-floor-map-layout.canvas-tabs.remove-aria': string;
+    'pisell-floor-map-layout.canvas-tabs.rename-title': string;
+    'pisell-floor-map-layout.canvas-tabs.rename-button-aria': string;
+    'pisell-floor-map-layout.canvas-tabs.rename-button-title': string;
+    'pisell-floor-map-layout.canvas-tabs.default-new-canvas-name': string;
+    'pisell-floor-map-layout.canvas-tabs.rename-modal-title': string;
+    'pisell-floor-map-layout.canvas-tabs.rename-modal-ok': string;
+    'pisell-floor-map-layout.canvas-tabs.rename-modal-cancel': string;
+    'pisell-floor-map-layout.edit-panel.element-props': string;
+    'pisell-floor-map-layout.edit-panel.close-aria': string;
+    'pisell-floor-map-layout.edit-panel.hint-apply': string;
+    'pisell-floor-map-layout.edit-panel.hint-save': string;
+    'pisell-floor-map-layout.edit-panel.section-layout': string;
+    'pisell-floor-map-layout.edit-panel.lock-on': string;
+    'pisell-floor-map-layout.edit-panel.lock-off': string;
+    'pisell-floor-map-layout.edit-panel.label-x': string;
+    'pisell-floor-map-layout.edit-panel.label-y': string;
+    'pisell-floor-map-layout.edit-panel.label-z': string;
+    'pisell-floor-map-layout.edit-panel.label-width': string;
+    'pisell-floor-map-layout.edit-panel.label-height': string;
+    'pisell-floor-map-layout.edit-panel.label-name': string;
+    'pisell-floor-map-layout.edit-panel.label-name-stage': string;
+    'pisell-floor-map-layout.edit-panel.ph-name-stage': string;
+    'pisell-floor-map-layout.edit-panel.ph-name': string;
+    'pisell-floor-map-layout.edit-panel.label-image-url': string;
+    'pisell-floor-map-layout.edit-panel.extra-image-url': string;
+    'pisell-floor-map-layout.edit-panel.ph-https': string;
+    'pisell-floor-map-layout.edit-panel.label-canvas': string;
+    'pisell-floor-map-layout.edit-panel.label-element-kind': string;
+    'pisell-floor-map-layout.edit-panel.hint-kind-binding-cleared': string;
+    'pisell-floor-map-layout.edit-panel.apply': string;
+    'pisell-floor-map-layout.edit-panel.data-binding': string;
+    'pisell-floor-map-layout.edit-panel.data-binding-note': string;
+    'pisell-floor-map-layout.edit-panel.label-data-source': string;
+    'pisell-floor-map-layout.edit-panel.ph-data-source': string;
+    'pisell-floor-map-layout.edit-panel.label-pick-row': string;
+    'pisell-floor-map-layout.edit-panel.ph-pick-row': string;
+    'pisell-floor-map-layout.edit-panel.ph-no-rows': string;
+    'pisell-floor-map-layout.edit-panel.hint-unbound': string;
+    'pisell-floor-map-layout.edit-panel.record-title': string;
+    'pisell-floor-map-layout.edit-panel.pop-title': string;
+    'pisell-floor-map-layout.edit-panel.pop-desc': string;
+    'pisell-floor-map-layout.edit-panel.btn-delete': string;
+    'pisell-floor-map-layout.edit-panel.btn-cancel': string;
+    'pisell-floor-map-layout.edit-panel.btn-ok-delete': string;
+    'pisell-floor-map-layout.toolbar.category-fallback': string;
+    'pisell-floor-map-layout.toolbar.palette-card-title': string;
+    'pisell-floor-map-layout.toolbar.data-binding-optional': string;
+    'pisell-floor-map-layout.toolbar.hint-after-select-ds': string;
+    'pisell-floor-map-layout.toolbar.hint-no-unplaced-rows': string;
+    'pisell-floor-map-layout.toolbar.ph-select-records': string;
+    'pisell-floor-map-layout.toolbar.hint-multi-drop': string;
+    'pisell-floor-map-layout.toolbar.no-data-sources': string;
+    'pisell-floor-map-layout.toolbar.cancel-place': string;
+    'pisell-floor-map-layout.toolbar.layout-dirty-hint': string;
+    'pisell-floor-map-layout.toolbar.save': string;
+    'pisell-floor-map-layout.toolbar.saving': string;
+    'pisell-floor-map-layout.view-controls.zoom-out-aria': string;
+    'pisell-floor-map-layout.view-controls.zoom-in-aria': string;
+    'pisell-floor-map-layout.view-controls.reset-aria': string;
+    'pisell-floor-map-layout.view-controls.fit-bounds-aria': string;
+    'pisell-floor-map-layout.view-controls.grid-hide-aria': string;
+    'pisell-floor-map-layout.view-controls.grid-show-aria': string;
+    'pisell-floor-map-layout.view-controls.fullscreen-aria': string;
+    'pisell-floor-map-layout.view-controls.fullscreen-exit-aria': string;
+    'pisell-floor-map-layout.image-element.default-name': string;
+    'pisell-floor-map-layout.placement.fallback-image-name': string;
+    'pisell-floor-map-layout.image-element.hint-no-url': string;
+    'pisell-floor-map-layout.image-element.hint-load-fail': string;
+    'pisell-floor-map-layout.data-form.empty': string;
+    'pisell-floor-map-layout.data-form.save-record': string;
+    'pisell-floor-map-layout.binding-error.required-row': string;
+    'pisell-floor-map-layout.binding-error.ds-not-allowed': string;
+    'pisell-floor-map-layout.binding-error.missing-field': string;
+    'pisell-floor-map-layout.card-placeholder.hint-select-row': string;
+    'pisell-floor-map-layout.card-placeholder.hint-bind-datasource': string;
+    'pisell-floor-map-layout.card-placeholder.hint-new-slot': string;
+    'pisell-floor-map-layout.card-placeholder.hint-row-not-found': string;
+    'pisell-floor-map-layout.figma-card.kind-round-table': string;
+    'pisell-floor-map-layout.figma-card.kind-square-table': string;
+    'pisell-floor-map-layout.figma-card.default-table': string;
+    'pisell-floor-map-layout.figma-card.capacity-seats': string;
+    'pisell-floor-map-layout.figma-card.guests-count': string;
+};
+export default _default;