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/FloorMapToolbar.tsx
var FloorMapToolbar_exports = {};
__export(FloorMapToolbar_exports, {
  FloorMapToolbar: () => FloorMapToolbar,
  default: () => FloorMapToolbar_default
});
module.exports = __toCommonJS(FloorMapToolbar_exports);
var import_react = __toESM(require("react"));
var import_classnames = __toESM(require("classnames"));
var import_antd = require("antd");
var import_icons = require("@ant-design/icons");
var import_types = require("../types");
var import_floorMapElementKindUtils = require("../utils/floorMapElementKindUtils");
var import_floorMapBuiltinShapes = require("../utils/floorMapBuiltinShapes");
var import_floorMapDropUtils = require("../utils/floorMapDropUtils");
var import_floorMapDataRecordLabel = require("../utils/floorMapDataRecordLabel");
var import_utils = require("@pisell/utils");
var import_floorMapLayoutConstants = require("../floorMapLayoutConstants");
var import_FloorMapToolbar = require("./FloorMapToolbar.less");
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) {
  const used = new Set(
    elements.filter((e) => {
      var _a;
      return ((_a = e.dataBinding) == null ? void 0 : _a.dataSourceKey) === dataSourceKey;
    }).map((e) => e.dataBinding.recordId)
  );
  const list = dataSources[dataSourceKey] ?? [];
  return list.filter(
    (r) => r && typeof r.id === "string" && !used.has(r.id)
  );
}
function buildScenePreviewMergedItem(kind, dataSourceKey, size, builtinShapeKey) {
  var _a;
  const el = {
    instanceId: `preview_${kind.value}`,
    canvasId: "",
    x: 0,
    y: 0,
    width: size.width,
    height: size.height,
    elementKind: kind.value,
    shape: kind.defaultShape,
    dataBinding: dataSourceKey && (0, import_floorMapElementKindUtils.resolveDataBindingPolicy)(kind) !== "none" ? { dataSourceKey, recordId: "" } : void 0,
    ...kind.value === import_types.FLOOR_MAP_IMAGE_ELEMENT_KIND ? { imageUrl: "" } : {},
    /**
     * 内置图形 palette 预览：优先用侧栏 Select 预选的 key，未选 / 非内置图形 kind 时
     * 退化为枚举首项，避免侧栏出现「未选择」占位卡。
     */
    ...kind.value === import_types.FLOOR_MAP_BUILTIN_SHAPE_ELEMENT_KIND ? {
      builtinShapeKey: builtinShapeKey ?? ((_a = import_floorMapBuiltinShapes.FLOOR_MAP_BUILTIN_SHAPES[0]) == null ? void 0 : _a.key)
    } : {}
  };
  return {
    id: el.instanceId,
    instanceId: el.instanceId,
    x: 0,
    y: 0,
    width: size.width,
    height: size.height,
    shape: kind.defaultShape,
    elementKind: kind.value,
    _sceneElement: el
  };
}
var STAGE_PREVIEW_SIZE = { width: 160, height: 64 };
var IMAGE_PREVIEW_SIZE = { width: 140, height: 80 };
var BUILTIN_SHAPE_PREVIEW_SIZE = { width: 96, height: 96 };
function FloorMapToolbar(props) {
  const {
    config,
    dataSources,
    dataSourceLabels = {},
    canCreate,
    placeMode,
    onPlaceModeChange,
    renderPreviewItem,
    placementPreviewSize = DEFAULT_PLACEMENT_SIZE,
    decorationPreviewSize = DEFAULT_DECORATION_SIZE,
    sceneElements = [],
    onSave,
    saving,
    saveError,
    layoutDirty,
    className,
    onPaletteCardPointerDown,
    consumeToolbarClickIfTouchDrag,
    phoneLayout = false,
    defaultCollapsed = false,
    onRequestPlaceAtCanvasCenter
  } = props;
  const [collapsed, setCollapsed] = (0, import_react.useState)(() => defaultCollapsed === true);
  const handleToggleCollapsed = (0, import_react.useCallback)(() => {
    setCollapsed((prev) => !prev);
  }, []);
  const paletteKinds = (0, import_react.useMemo)(
    () => (config.elementKinds ?? []).filter((k) => k.showInPalette !== false),
    [config.elementKinds]
  );
  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: import_utils.locales.getText(`${I18N_TB}.category-fallback`),
        order: 0
      }
    ];
  }, [config.elementKindCategories]);
  const kindsByCategory = (0, import_react.useMemo)(() => {
    var _a;
    const map = /* @__PURE__ */ new Map();
    for (const c of categories) {
      map.set(c.id, []);
    }
    const fallbackId = ((_a = categories[0]) == null ? void 0 : _a.id) ?? "_uncat";
    for (const k of paletteKinds) {
      const cid = k.categoryId ?? fallbackId;
      if (!map.has(cid)) map.set(cid, []);
      map.get(cid).push(k);
    }
    return map;
  }, [categories, paletteKinds]);
  const handleSelectKind = (kind) => {
    const next = {
      type: "scene",
      elementKind: kind.value,
      /** 不预锁单一数据源，由用户在工具栏「数据源」中选择；落点时用 allowedKeys[0] 作兜底 */
      dataSourceKey: void 0,
      recordId: void 0
    };
    const isSame = (placeMode == null ? void 0 : placeMode.type) === "scene" && placeMode.elementKind === kind.value;
    onPlaceModeChange(isSame ? null : next);
  };
  const handleDsChange = (mode, key) => {
    onPlaceModeChange({
      ...mode,
      dataSourceKey: key,
      recordId: void 0,
      recordIds: void 0
    });
  };
  const handleRecordsChange = (mode, ids) => {
    const list = (ids == null ? void 0 : ids.filter(Boolean)) ?? [];
    onPlaceModeChange({
      ...mode,
      recordIds: list.length > 0 ? list : void 0,
      recordId: void 0
    });
  };
  const handleBuiltinShapeKeyChange = (mode, key) => {
    onPlaceModeChange({
      ...mode,
      builtinShapeKey: key
    });
  };
  const cancelPlaceMode = () => onPlaceModeChange(null);
  const renderKindCard = (k) => {
    var _a, _b, _c, _d, _e;
    const policy = (0, import_floorMapElementKindUtils.resolveDataBindingPolicy)(k);
    const isStage = k.value === import_types.FLOOR_MAP_STAGE_ELEMENT_KIND;
    const isImageKind = k.value === import_types.FLOOR_MAP_IMAGE_ELEMENT_KIND;
    const isBuiltinShapeKind = k.value === import_types.FLOOR_MAP_BUILTIN_SHAPE_ELEMENT_KIND;
    const placementLike = policy !== "none" && !isStage || isImageKind || isBuiltinShapeKind;
    const size = isStage ? STAGE_PREVIEW_SIZE : placementLike ? isImageKind ? IMAGE_PREVIEW_SIZE : isBuiltinShapeKind ? BUILTIN_SHAPE_PREVIEW_SIZE : placementPreviewSize : {
      width: decorationPreviewSize,
      height: decorationPreviewSize
    };
    const activeDs = (placeMode == null ? void 0 : placeMode.type) === "scene" && placeMode.elementKind === k.value ? placeMode.dataSourceKey : void 0;
    const activeBuiltinShapeKey = isBuiltinShapeKind ? (placeMode == null ? void 0 : placeMode.type) === "scene" && placeMode.elementKind === k.value ? placeMode.builtinShapeKey ?? ((_a = import_floorMapBuiltinShapes.FLOOR_MAP_BUILTIN_SHAPES[0]) == null ? void 0 : _a.key) : (_b = import_floorMapBuiltinShapes.FLOOR_MAP_BUILTIN_SHAPES[0]) == null ? void 0 : _b.key : void 0;
    const item = buildScenePreviewMergedItem(
      k,
      activeDs,
      size,
      activeBuiltinShapeKey
    );
    const isActive = (placeMode == null ? void 0 : placeMode.type) === "scene" && placeMode.elementKind === k.value;
    const cellW = isStage ? 92 : placementLike ? 80 : decorationPreviewSize;
    const cellH = isStage ? 40 : placementLike ? 54 : decorationPreviewSize;
    const previewW = isImageKind ? IMAGE_PREVIEW_SIZE.width : isBuiltinShapeKind ? BUILTIN_SHAPE_PREVIEW_SIZE.width : placementPreviewSize.width;
    const previewH = isImageKind ? IMAGE_PREVIEW_SIZE.height : isBuiltinShapeKind ? BUILTIN_SHAPE_PREVIEW_SIZE.height : placementPreviewSize.height;
    const placeScale = placementLike ? Math.min(cellW / previewW, cellH / previewH) : 1;
    const stageScale = isStage ? Math.min(cellW / item.width, cellH / item.height, 1) : 1;
    const allKeys = Object.keys(dataSources);
    const allowedKeys = ((_c = k.allowedDataSourceKeys) == null ? void 0 : _c.length) ? k.allowedDataSourceKeys.filter((x) => allKeys.includes(x)) : allKeys;
    const paletteDragPayload = {
      elementKind: k.value,
      ...(placeMode == null ? void 0 : placeMode.type) === "scene" && placeMode.elementKind === k.value ? {
        dataSourceKey: placeMode.dataSourceKey,
        ...placeMode.recordIds && placeMode.recordIds.length > 0 ? { recordIds: placeMode.recordIds } : placeMode.recordId ? { recordId: placeMode.recordId } : {}
      } : {},
      /**
       * 内置图形 kind：把侧栏 Select 选定的 `builtinShapeKey` 写入拖拽 payload，
       * 让 drop / 触摸落点能感知用户预选的图形（与资源 kind 透传 recordIds 同款）。
       * 即使未激活该 kind，也回退枚举首项，避免拖到画布时落出空白占位。
       */
      ...isBuiltinShapeKind ? {
        builtinShapeKey: activeBuiltinShapeKey ?? ((_d = import_floorMapBuiltinShapes.FLOOR_MAP_BUILTIN_SHAPES[0]) == null ? void 0 : _d.key)
      } : {}
    };
    return /* @__PURE__ */ import_react.default.createElement("div", { key: k.value, className: `${import_floorMapLayoutConstants.FLOOR_MAP_LAYOUT_CLASS_PREFIX}-toolbar-preview-card-wrap` }, /* @__PURE__ */ import_react.default.createElement(
      "button",
      {
        type: "button",
        draggable: true,
        className: (0, import_classnames.default)(
          `${import_floorMapLayoutConstants.FLOOR_MAP_LAYOUT_CLASS_PREFIX}-toolbar-preview-card`,
          !placementLike ? `${import_floorMapLayoutConstants.FLOOR_MAP_LAYOUT_CLASS_PREFIX}-toolbar-preview-card-deco` : void 0,
          { [`${import_floorMapLayoutConstants.FLOOR_MAP_LAYOUT_CLASS_PREFIX}-toolbar-preview-card-active`]: isActive }
        ),
        onClick: () => {
          if (consumeToolbarClickIfTouchDrag == null ? void 0 : consumeToolbarClickIfTouchDrag()) return;
          handleSelectKind(k);
        },
        onPointerDown: (e) => onPaletteCardPointerDown == null ? void 0 : onPaletteCardPointerDown(paletteDragPayload, e),
        onDragStart: (e) => {
          e.dataTransfer.setData(
            import_floorMapDropUtils.FLOOR_MAP_PALETTE_DRAG_MIME,
            JSON.stringify(paletteDragPayload)
          );
          e.dataTransfer.effectAllowed = "copy";
        },
        title: import_utils.locales.getText(`${I18N_TB}.palette-card-title`).replace(/\{name\}/g, k.label)
      },
      /* @__PURE__ */ import_react.default.createElement(
        "div",
        {
          className: `${import_floorMapLayoutConstants.FLOOR_MAP_LAYOUT_CLASS_PREFIX}-toolbar-preview-cell`,
          style: { width: cellW, height: cellH }
        },
        renderPreviewItem ? /* @__PURE__ */ import_react.default.createElement(
          "div",
          {
            className: `${import_floorMapLayoutConstants.FLOOR_MAP_LAYOUT_CLASS_PREFIX}-toolbar-preview-content`,
            style: placementLike ? {
              width: previewW,
              height: previewH,
              transform: `scale(${placeScale})`,
              transformOrigin: "top left"
            } : isStage ? {
              width: item.width,
              height: item.height,
              transform: `scale(${stageScale})`,
              transformOrigin: "top left"
            } : void 0
          },
          renderPreviewItem(item)
        ) : /* @__PURE__ */ import_react.default.createElement("span", { className: `${import_floorMapLayoutConstants.FLOOR_MAP_LAYOUT_CLASS_PREFIX}-toolbar-preview-fallback` }, k.label)
      ),
      /* @__PURE__ */ import_react.default.createElement("span", { className: `${import_floorMapLayoutConstants.FLOOR_MAP_LAYOUT_CLASS_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: `${import_floorMapLayoutConstants.FLOOR_MAP_LAYOUT_CLASS_PREFIX}-toolbar-record-pick` }, /* @__PURE__ */ import_react.default.createElement("div", { className: `${import_floorMapLayoutConstants.FLOOR_MAP_LAYOUT_CLASS_PREFIX}-toolbar-record-pick-label` }, import_utils.locales.getText(`${I18N_TB}.data-binding-optional`)), /* @__PURE__ */ import_react.default.createElement(
      import_antd.Select,
      {
        placeholder: import_utils.locales.getText(I18N_EP_DS),
        allowClear: true,
        value: placeMode.type === "scene" ? placeMode.dataSourceKey : void 0,
        options: allowedKeys.map((key) => ({
          value: key,
          label: dataSourceLabels[key] ?? key
        })),
        onChange: (v) => {
          if ((placeMode == null ? void 0 : placeMode.type) === "scene")
            handleDsChange(placeMode, v);
        },
        size: "large",
        style: { width: "100%" },
        popupMatchSelectWidth: false
      }
    ), (() => {
      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: `${import_floorMapLayoutConstants.FLOOR_MAP_LAYOUT_CLASS_PREFIX}-toolbar-record-pick-hint` }, import_utils.locales.getText(`${I18N_TB}.hint-after-select-ds`));
      }
      const unplaced = getUnplacedRecordsForKey(
        key,
        dataSources,
        sceneElements
      );
      if (unplaced.length === 0) {
        return /* @__PURE__ */ import_react.default.createElement("div", { className: `${import_floorMapLayoutConstants.FLOOR_MAP_LAYOUT_CLASS_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: import_utils.locales.getText(
            `${I18N_TB}.ph-select-records`
          ),
          allowClear: true,
          maxTagCount: "responsive",
          value: recordValue,
          options: unplaced.map((r) => ({
            value: r.id,
            label: (0, import_floorMapDataRecordLabel.formatDataRecordOptionLabel)(r)
          })),
          onChange: (v) => {
            if (mode) handleRecordsChange(mode, v);
          },
          size: "large",
          style: { width: "100%", marginTop: 4 },
          popupMatchSelectWidth: false
        }
      ), /* @__PURE__ */ import_react.default.createElement("div", { className: `${import_floorMapLayoutConstants.FLOOR_MAP_LAYOUT_CLASS_PREFIX}-toolbar-record-pick-hint` }, import_utils.locales.getText(`${I18N_TB}.hint-multi-drop`)));
    })()), allowedKeys.length === 0 && /* @__PURE__ */ import_react.default.createElement("div", { className: `${import_floorMapLayoutConstants.FLOOR_MAP_LAYOUT_CLASS_PREFIX}-toolbar-record-hint` }, import_utils.locales.getText(`${I18N_TB}.no-data-sources`)), phoneLayout && onRequestPlaceAtCanvasCenter ? /* @__PURE__ */ import_react.default.createElement(
      "button",
      {
        type: "button",
        className: (0, import_classnames.default)(`${import_floorMapLayoutConstants.FLOOR_MAP_LAYOUT_CLASS_PREFIX}-toolbar-btn`, "primary"),
        onClick: onRequestPlaceAtCanvasCenter
      },
      import_utils.locales.getText(`${I18N_TB}.add-to-canvas`)
    ) : null, /* @__PURE__ */ import_react.default.createElement(
      "button",
      {
        type: "button",
        className: `${import_floorMapLayoutConstants.FLOOR_MAP_LAYOUT_CLASS_PREFIX}-toolbar-btn cancel-inline`,
        onClick: cancelPlaceMode
      },
      import_utils.locales.getText(`${I18N_TB}.cancel-place`)
    )), isActive && policy === "none" && /* @__PURE__ */ import_react.default.createElement(import_react.default.Fragment, null, isBuiltinShapeKind && /**
     * 内置图形 kind：在「点击 / 拖拽落点」之前，先在这里选好要落的图形
     * （厕所 / 分隔 / 柱子 / 沙发 / 大门 等）。落点的初始 builtinShapeKey
     * 即取自当前 Select 值；落点后仍可在右侧编辑面板再切换。
     *
     * 与资源类 kind 的「dataSource + records」预选 UX 同款，避免必须先落
     * 一个默认图形再到编辑面板里改。
     */
    /* @__PURE__ */ import_react.default.createElement("div", { className: `${import_floorMapLayoutConstants.FLOOR_MAP_LAYOUT_CLASS_PREFIX}-toolbar-record-pick` }, /* @__PURE__ */ import_react.default.createElement("div", { className: `${import_floorMapLayoutConstants.FLOOR_MAP_LAYOUT_CLASS_PREFIX}-toolbar-record-pick-label` }, import_utils.locales.getText(
      "pisell-floor-map-layout.builtin-shape.palette-pick-label"
    )), /* @__PURE__ */ import_react.default.createElement(
      import_antd.Select,
      {
        placeholder: import_utils.locales.getText(
          "pisell-floor-map-layout.edit-panel.ph-builtin-shape"
        ),
        value: (placeMode == null ? void 0 : placeMode.type) === "scene" ? placeMode.builtinShapeKey ?? ((_e = import_floorMapBuiltinShapes.FLOOR_MAP_BUILTIN_SHAPES[0]) == null ? void 0 : _e.key) : void 0,
        options: import_floorMapBuiltinShapes.FLOOR_MAP_BUILTIN_SHAPES.map((s) => ({
          value: s.key,
          label: import_utils.locales.getText(s.labelKey)
        })),
        onChange: (v) => {
          if ((placeMode == null ? void 0 : placeMode.type) === "scene")
            handleBuiltinShapeKeyChange(placeMode, v);
        },
        size: "large",
        style: { width: "100%" },
        popupMatchSelectWidth: false
      }
    )), phoneLayout && onRequestPlaceAtCanvasCenter ? /* @__PURE__ */ import_react.default.createElement(
      "button",
      {
        type: "button",
        className: (0, import_classnames.default)(`${import_floorMapLayoutConstants.FLOOR_MAP_LAYOUT_CLASS_PREFIX}-toolbar-btn`, "primary"),
        onClick: onRequestPlaceAtCanvasCenter
      },
      import_utils.locales.getText(`${I18N_TB}.add-to-canvas`)
    ) : null, /* @__PURE__ */ import_react.default.createElement(
      "button",
      {
        type: "button",
        className: `${import_floorMapLayoutConstants.FLOOR_MAP_LAYOUT_CLASS_PREFIX}-toolbar-btn cancel-inline`,
        onClick: cancelPlaceMode
      },
      import_utils.locales.getText(`${I18N_TB}.cancel-place`)
    )));
  };
  const collapseBtn = /* @__PURE__ */ import_react.default.createElement(
    "button",
    {
      type: "button",
      className: (0, import_classnames.default)(
        `${import_floorMapLayoutConstants.FLOOR_MAP_LAYOUT_CLASS_PREFIX}-toolbar-collapse-handle`,
        phoneLayout && `${import_floorMapLayoutConstants.FLOOR_MAP_LAYOUT_CLASS_PREFIX}-toolbar-collapse-handle--in-drawer`
      ),
      onClick: handleToggleCollapsed,
      "aria-label": collapsed ? import_utils.locales.getText(`${I18N_TB}.expand`) : import_utils.locales.getText(`${I18N_TB}.collapse`),
      title: collapsed ? import_utils.locales.getText(`${I18N_TB}.expand`) : import_utils.locales.getText(`${I18N_TB}.collapse`)
    },
    collapsed ? /* @__PURE__ */ import_react.default.createElement(import_icons.RightOutlined, null) : /* @__PURE__ */ import_react.default.createElement(import_icons.LeftOutlined, null)
  );
  const toolbarInner = /* @__PURE__ */ import_react.default.createElement("div", { className: `${import_floorMapLayoutConstants.FLOOR_MAP_LAYOUT_CLASS_PREFIX}-toolbar-inner` }, /* @__PURE__ */ import_react.default.createElement("div", { className: `${import_floorMapLayoutConstants.FLOOR_MAP_LAYOUT_CLASS_PREFIX}-toolbar-body` }, canCreate && /* @__PURE__ */ import_react.default.createElement(import_react.default.Fragment, null, categories.map((cat) => {
    const kinds = kindsByCategory.get(cat.id) ?? [];
    if (!kinds.length) return null;
    return /* @__PURE__ */ import_react.default.createElement(
      "section",
      {
        key: cat.id,
        className: `${import_floorMapLayoutConstants.FLOOR_MAP_LAYOUT_CLASS_PREFIX}-toolbar-section`
      },
      /* @__PURE__ */ import_react.default.createElement("h3", { className: `${import_floorMapLayoutConstants.FLOOR_MAP_LAYOUT_CLASS_PREFIX}-toolbar-section-title` }, cat.label),
      /* @__PURE__ */ import_react.default.createElement("div", { className: `${import_floorMapLayoutConstants.FLOOR_MAP_LAYOUT_CLASS_PREFIX}-toolbar-preview-list` }, /* @__PURE__ */ import_react.default.createElement("div", { className: `${import_floorMapLayoutConstants.FLOOR_MAP_LAYOUT_CLASS_PREFIX}-toolbar-preview-group` }, kinds.map((k) => renderKindCard(k))))
    );
  }))), onSave && config.canvasUi.canEdit && /* @__PURE__ */ import_react.default.createElement("div", { className: `${import_floorMapLayoutConstants.FLOOR_MAP_LAYOUT_CLASS_PREFIX}-toolbar-footer` }, layoutDirty ? /* @__PURE__ */ import_react.default.createElement("span", { className: `${import_floorMapLayoutConstants.FLOOR_MAP_LAYOUT_CLASS_PREFIX}-toolbar-dirty-hint`, role: "status" }, import_utils.locales.getText(`${I18N_TB}.layout-dirty-hint`)) : null, saveError && /* @__PURE__ */ import_react.default.createElement("span", { className: `${import_floorMapLayoutConstants.FLOOR_MAP_LAYOUT_CLASS_PREFIX}-toolbar-error` }, typeof saveError === "string" ? saveError : saveError == null ? void 0 : saveError.message), /* @__PURE__ */ import_react.default.createElement(
    "button",
    {
      type: "button",
      className: (0, import_classnames.default)(`${import_floorMapLayoutConstants.FLOOR_MAP_LAYOUT_CLASS_PREFIX}-toolbar-btn`, "primary", {
        [`${import_floorMapLayoutConstants.FLOOR_MAP_LAYOUT_CLASS_PREFIX}-toolbar-save-dirty`]: layoutDirty
      }),
      disabled: saving,
      onClick: onSave
    },
    saving ? import_utils.locales.getText(`${I18N_TB}.saving`) : import_utils.locales.getText(`${I18N_TB}.save`)
  )));
  if (phoneLayout) {
    return /* @__PURE__ */ import_react.default.createElement("div", { className: (0, import_classnames.default)(`${import_floorMapLayoutConstants.FLOOR_MAP_LAYOUT_CLASS_PREFIX}-toolbar`, className) }, /* @__PURE__ */ import_react.default.createElement(
      import_antd.Drawer,
      {
        placement: "left",
        open: !collapsed,
        onClose: () => setCollapsed(true),
        width: "min(320px, 88vw)",
        zIndex: import_floorMapLayoutConstants.FLOOR_MAP_PHONE_TOOLBAR_DRAWER_Z_INDEX,
        maskClosable: true,
        destroyOnClose: false,
        closable: false,
        forceRender: false,
        rootClassName: `${import_floorMapLayoutConstants.FLOOR_MAP_LAYOUT_CLASS_PREFIX}-toolbar-phone-drawer-root`,
        classNames: {
          body: `${import_floorMapLayoutConstants.FLOOR_MAP_LAYOUT_CLASS_PREFIX}-toolbar-phone-drawer-body`
        },
        styles: {
          body: {
            padding: 0,
            /** 由 Less 设为 visible，便于折叠柄伸出面板；列表滚动在 toolbar-inner / body */
            overflow: "visible",
            display: "flex",
            flexDirection: "column",
            height: "100%"
          }
        },
        getContainer: typeof document !== "undefined" ? () => document.body : void 0
      },
      /* @__PURE__ */ import_react.default.createElement("div", { className: `${import_floorMapLayoutConstants.FLOOR_MAP_LAYOUT_CLASS_PREFIX}-toolbar-phone-drawer-inner` }, toolbarInner, collapseBtn)
    ), collapsed ? /* @__PURE__ */ import_react.default.createElement(
      "button",
      {
        type: "button",
        className: `${import_floorMapLayoutConstants.FLOOR_MAP_LAYOUT_CLASS_PREFIX}-toolbar-phone-peek-trigger`,
        onClick: () => setCollapsed(false),
        "aria-label": import_utils.locales.getText(`${I18N_TB}.expand`),
        title: import_utils.locales.getText(`${I18N_TB}.expand`)
      },
      /* @__PURE__ */ import_react.default.createElement(import_icons.RightOutlined, null)
    ) : null);
  }
  return /* @__PURE__ */ import_react.default.createElement(
    "div",
    {
      className: (0, import_classnames.default)(
        `${import_floorMapLayoutConstants.FLOOR_MAP_LAYOUT_CLASS_PREFIX}-toolbar`,
        `${import_floorMapLayoutConstants.FLOOR_MAP_LAYOUT_CLASS_PREFIX}-toolbar-sidebar`,
        collapsed && `${import_floorMapLayoutConstants.FLOOR_MAP_LAYOUT_CLASS_PREFIX}-toolbar-sidebar--collapsed`,
        className
      )
    },
    collapseBtn,
    toolbarInner
  );
}
var FloorMapToolbar_default = FloorMapToolbar;
// Annotate the CommonJS export names for ESM import in node:
0 && (module.exports = {
  FloorMapToolbar
});
