function _slicedToArray(arr, i) { return _arrayWithHoles(arr) || _iterableToArrayLimit(arr, i) || _unsupportedIterableToArray(arr, i) || _nonIterableRest(); }
function _nonIterableRest() { throw new TypeError("Invalid attempt to destructure non-iterable instance.\nIn order to be iterable, non-array objects must have a [Symbol.iterator]() method."); }
function _unsupportedIterableToArray(o, minLen) { if (!o) return; if (typeof o === "string") return _arrayLikeToArray(o, minLen); var n = Object.prototype.toString.call(o).slice(8, -1); if (n === "Object" && o.constructor) n = o.constructor.name; if (n === "Map" || n === "Set") return Array.from(o); if (n === "Arguments" || /^(?:Ui|I)nt(?:8|16|32)(?:Clamped)?Array$/.test(n)) return _arrayLikeToArray(o, minLen); }
function _arrayLikeToArray(arr, len) { if (len == null || len > arr.length) len = arr.length; for (var i = 0, arr2 = new Array(len); i < len; i++) arr2[i] = arr[i]; return arr2; }
function _iterableToArrayLimit(r, l) { var t = null == r ? null : "undefined" != typeof Symbol && r[Symbol.iterator] || r["@@iterator"]; if (null != t) { var e, n, i, u, a = [], f = !0, o = !1; try { if (i = (t = t.call(r)).next, 0 === l) { if (Object(t) !== t) return; f = !1; } else for (; !(f = (e = i.call(t)).done) && (a.push(e.value), a.length !== l); f = !0); } catch (r) { o = !0, n = r; } finally { try { if (!f && null != t.return && (u = t.return(), Object(u) !== u)) return; } finally { if (o) throw n; } } return a; } }
function _arrayWithHoles(arr) { if (Array.isArray(arr)) return arr; }
/**
 * FloorMapEditPanel - 选中图元后的编辑面板：画布属性 + 可选数据绑定 + 数据源记录表单
 */
import React, { useCallback, useMemo, useRef, useState } from 'react';
import { locales } from '@pisell/utils';
import classNames from 'classnames';
import { CloseOutlined, LockOutlined, UnlockOutlined } from '@ant-design/icons';
import { Input, InputNumber, Select, Button, Form, Popconfirm, message, Checkbox } from 'antd';
import { FLOOR_MAP_STAGE_ELEMENT_KIND } from "../types";
import { getElementKindConfig, resolveDataBindingPolicy, isFloorMapImageElementKind, isFloorMapBuiltinShapeElementKind, getSwappableElementKindsInSameCategory, patchSceneElementForKindSwitch } from "../utils/floorMapElementKindUtils";
import { FLOOR_MAP_BUILTIN_SHAPES, getFloorMapBuiltinShapeDef } from "../utils/floorMapBuiltinShapes";
import { isElementNameAsTitleEnabled, buildNameAsTitleExtensionsPatch } from "../utils/floorMapElementNameAsTitle";
import { FloorMapDataForm } from "./FloorMapDataForm";
import useEngineContext from "../../../hooks/useEngineContext";
import { getFloorMapCanvasDisplayName, initFloorMapLayoutLocales } from "../utils/floorMapCanvasDisplay";
import { FLOOR_MAP_CONFIRM_OVERLAY_Z_INDEX } from "../floorMapLayoutConstants";
import { formatDataRecordOptionLabel } from "../utils/floorMapDataRecordLabel";
import "./FloorMapEditPanel.less";
var PREFIX = 'pisell-floor-map-layout';
var I18N_EP = 'pisell-floor-map-layout.edit-panel';
function resolveDataSourceRecordForm(content, ctx) {
  if (typeof content === 'function') {
    return content(ctx);
  }
  return content;
}
export function FloorMapEditPanel(props) {
  var _engineCtx$engine, _kindConfig$allowedDa, _dataSources$binding$, _dataSources$binding$2, _dataSources$binding$3;
  var sceneElement = props.sceneElement,
    itemId = props.itemId,
    onUpdate = props.onUpdate,
    onSaveRecord = props.onSaveRecord,
    onClose = props.onClose,
    onDelete = props.onDelete,
    recordFormColumns = props.recordFormColumns,
    dataSourceRecordForm = props.dataSourceRecordForm,
    config = props.config,
    dataSources = props.dataSources,
    savingRecord = props.savingRecord,
    _props$dataSourceLabe = props.dataSourceLabels,
    dataSourceLabels = _props$dataSourceLabe === void 0 ? {} : _props$dataSourceLabe,
    layoutDraftDirty = props.layoutDraftDirty,
    showRecordFormProp = props.showDataSourceRecordFormBlock,
    className = props.className;
  var _Form$useForm = Form.useForm(),
    _Form$useForm2 = _slicedToArray(_Form$useForm, 1),
    form = _Form$useForm2[0];
  /** 忽略由 setFieldsValue 触发的 onValuesChange，避免误判「未应用」 */
  var skipFormValuesChangeRef = useRef(false);
  var _useState = useState(false),
    _useState2 = _slicedToArray(_useState, 2),
    formHasUnappliedChanges = _useState2[0],
    setFormHasUnappliedChanges = _useState2[1];
  var engineCtx = useEngineContext();
  var engineLocale = (engineCtx === null || engineCtx === void 0 || (_engineCtx$engine = engineCtx.engine) === null || _engineCtx$engine === void 0 || (_engineCtx$engine = _engineCtx$engine.props) === null || _engineCtx$engine === void 0 ? void 0 : _engineCtx$engine.locale) || 'zh-CN';
  initFloorMapLayoutLocales(engineLocale);
  var ep = useMemo(function () {
    return {
      elementProps: locales.getText("".concat(I18N_EP, ".element-props")),
      closeAria: locales.getText("".concat(I18N_EP, ".close-aria")),
      hintApply: locales.getText("".concat(I18N_EP, ".hint-apply")),
      hintSave: locales.getText("".concat(I18N_EP, ".hint-save")),
      sectionLayout: locales.getText("".concat(I18N_EP, ".section-layout")),
      lockOn: locales.getText("".concat(I18N_EP, ".lock-on")),
      lockOff: locales.getText("".concat(I18N_EP, ".lock-off")),
      labelX: locales.getText("".concat(I18N_EP, ".label-x")),
      labelY: locales.getText("".concat(I18N_EP, ".label-y")),
      labelZ: locales.getText("".concat(I18N_EP, ".label-z")),
      labelWidth: locales.getText("".concat(I18N_EP, ".label-width")),
      labelHeight: locales.getText("".concat(I18N_EP, ".label-height")),
      labelName: locales.getText("".concat(I18N_EP, ".label-name")),
      labelNameStage: locales.getText("".concat(I18N_EP, ".label-name-stage")),
      phNameStage: locales.getText("".concat(I18N_EP, ".ph-name-stage")),
      phName: locales.getText("".concat(I18N_EP, ".ph-name")),
      labelNameAsTitle: locales.getText("".concat(I18N_EP, ".label-name-as-title")),
      tipNameAsTitle: locales.getText("".concat(I18N_EP, ".tip-name-as-title")),
      labelImageUrl: locales.getText("".concat(I18N_EP, ".label-image-url")),
      extraImageUrl: locales.getText("".concat(I18N_EP, ".extra-image-url")),
      phHttps: locales.getText("".concat(I18N_EP, ".ph-https")),
      labelBuiltinShape: locales.getText("".concat(I18N_EP, ".label-builtin-shape")),
      extraBuiltinShape: locales.getText("".concat(I18N_EP, ".extra-builtin-shape")),
      phBuiltinShape: locales.getText("".concat(I18N_EP, ".ph-builtin-shape")),
      labelCanvas: locales.getText("".concat(I18N_EP, ".label-canvas")),
      apply: locales.getText("".concat(I18N_EP, ".apply")),
      dataBinding: locales.getText("".concat(I18N_EP, ".data-binding")),
      dataBindingNote: locales.getText("".concat(I18N_EP, ".data-binding-note")),
      labelDataSource: locales.getText("".concat(I18N_EP, ".label-data-source")),
      phDataSource: locales.getText("".concat(I18N_EP, ".ph-data-source")),
      labelPickRow: locales.getText("".concat(I18N_EP, ".label-pick-row")),
      phPickRow: locales.getText("".concat(I18N_EP, ".ph-pick-row")),
      phNoRows: locales.getText("".concat(I18N_EP, ".ph-no-rows")),
      hintUnbound: locales.getText("".concat(I18N_EP, ".hint-unbound")),
      recordTitle: locales.getText("".concat(I18N_EP, ".record-title")),
      popTitle: locales.getText("".concat(I18N_EP, ".pop-title")),
      popDesc: locales.getText("".concat(I18N_EP, ".pop-desc")),
      btnDelete: locales.getText("".concat(I18N_EP, ".btn-delete")),
      btnCancel: locales.getText("".concat(I18N_EP, ".btn-cancel")),
      btnOkDelete: locales.getText("".concat(I18N_EP, ".btn-ok-delete")),
      labelElementKind: locales.getText("".concat(I18N_EP, ".label-element-kind")),
      hintKindBindingCleared: locales.getText("".concat(I18N_EP, ".hint-kind-binding-cleared"))
    };
  }, [engineLocale]);
  var swappableKinds = useMemo(function () {
    return getSwappableElementKindsInSameCategory(config, sceneElement.elementKind);
  }, [config, sceneElement.elementKind]);
  var handleElementKindChange = useCallback(function (nextKind) {
    if (nextKind === sceneElement.elementKind) return;
    var hadBinding = Boolean(sceneElement.dataBinding);
    var patch = patchSceneElementForKindSwitch(config, sceneElement, nextKind);
    if (hadBinding && patch.dataBinding === undefined) {
      message.info(ep.hintKindBindingCleared);
    }
    onUpdate(patch);
  }, [config, sceneElement, onUpdate, ep.hintKindBindingCleared]);
  var canvasOptions = config.canvases.filter(function (c) {
    return c.enabled;
  }).sort(function (a, b) {
    return a.order - b.order;
  });
  var kindConfig = getElementKindConfig(config, sceneElement.elementKind);
  var bindingPolicy = resolveDataBindingPolicy(kindConfig);
  /**
   * 是否在编辑面板渲染「将图元名作为资源标题」勾选项，由 kindConfig 显式声明；
   * 未声明的 kind（含将来新增）保持现状不出现该项。
   */
  var kindAllowsNameAsTitle = Boolean(kindConfig === null || kindConfig === void 0 ? void 0 : kindConfig.nameAsTitleConfigurable);
  var allKeys = Object.keys(dataSources);
  var allowedKeys = kindConfig !== null && kindConfig !== void 0 && (_kindConfig$allowedDa = kindConfig.allowedDataSourceKeys) !== null && _kindConfig$allowedDa !== void 0 && _kindConfig$allowedDa.length ? kindConfig.allowedDataSourceKeys.filter(function (k) {
    return allKeys.includes(k);
  }) : allKeys;

  /** 与 RecordBoard Story 图片图元一致：`floorMapImage` */
  var isImageKind = isFloorMapImageElementKind(sceneElement.elementKind);
  /** 内置图形图元：用 builtinShapeKey 选择厕所 / 沙发 / 大门 等预设 SVG */
  var isBuiltinShapeKind = isFloorMapBuiltinShapeElementKind(sceneElement.elementKind);
  var layoutLocked = Boolean(sceneElement.layoutTransformLocked);
  var initialValues = React.useMemo(function () {
    var _builtinDef$defaultSi, _builtinDef$defaultSi2, _sceneElement$name, _sceneElement$zIndex, _sceneElement$width, _sceneElement$height, _sceneElement$imageUr, _sceneElement$builtin;
    /** 内置图形宽高优先采用当前选定预设的 defaultSize，未选则给一个保底正方形 */
    var builtinDef = isBuiltinShapeKind ? getFloorMapBuiltinShapeDef(sceneElement.builtinShapeKey) : undefined;
    var dw = isImageKind ? 400 : isBuiltinShapeKind ? (_builtinDef$defaultSi = builtinDef === null || builtinDef === void 0 ? void 0 : builtinDef.defaultSize.width) !== null && _builtinDef$defaultSi !== void 0 ? _builtinDef$defaultSi : 96 : 180;
    var dh = isImageKind ? 240 : isBuiltinShapeKind ? (_builtinDef$defaultSi2 = builtinDef === null || builtinDef === void 0 ? void 0 : builtinDef.defaultSize.height) !== null && _builtinDef$defaultSi2 !== void 0 ? _builtinDef$defaultSi2 : 96 : 120;
    return {
      x: sceneElement.x,
      y: sceneElement.y,
      name: (_sceneElement$name = sceneElement.name) !== null && _sceneElement$name !== void 0 ? _sceneElement$name : '',
      zIndex: (_sceneElement$zIndex = sceneElement.zIndex) !== null && _sceneElement$zIndex !== void 0 ? _sceneElement$zIndex : 0,
      width: (_sceneElement$width = sceneElement.width) !== null && _sceneElement$width !== void 0 ? _sceneElement$width : dw,
      height: (_sceneElement$height = sceneElement.height) !== null && _sceneElement$height !== void 0 ? _sceneElement$height : dh,
      canvasId: sceneElement.canvasId,
      imageUrl: (_sceneElement$imageUr = sceneElement.imageUrl) !== null && _sceneElement$imageUr !== void 0 ? _sceneElement$imageUr : '',
      builtinShapeKey: (_sceneElement$builtin = sceneElement.builtinShapeKey) !== null && _sceneElement$builtin !== void 0 ? _sceneElement$builtin : undefined,
      /**
       * 编辑面板「将图元名作为资源标题」勾选项；持久化在 extensions[NAME_AS_TITLE_EXT_KEY]，
       * UI 仅在 kindConfig.nameAsTitleConfigurable 时渲染。
       */
      nameAsTitle: isElementNameAsTitleEnabled(sceneElement)
    };
  }, [sceneElement, isImageKind, isBuiltinShapeKind]);
  React.useEffect(function () {
    setFormHasUnappliedChanges(false);
  }, [itemId]);
  React.useEffect(function () {
    skipFormValuesChangeRef.current = true;
    form.setFieldsValue(initialValues);
    queueMicrotask(function () {
      skipFormValuesChangeRef.current = false;
      setFormHasUnappliedChanges(false);
    });
  }, [itemId, initialValues, form]);
  var handleFinish = useCallback(function (values) {
    var name = values.name != null ? String(values.name).trim() || undefined : undefined;
    var patch = {
      name: name,
      canvasId: String(values.canvasId)
    };
    if (isImageKind) {
      var _values$imageUrl;
      var url = String((_values$imageUrl = values.imageUrl) !== null && _values$imageUrl !== void 0 ? _values$imageUrl : '').trim();
      patch.imageUrl = url || undefined;
    }
    if (isBuiltinShapeKind) {
      var raw = values.builtinShapeKey;
      var key = raw != null ? String(raw).trim() : '';
      patch.builtinShapeKey = key || undefined;
    }
    if (!layoutLocked) {
      patch.x = Number(values.x);
      patch.y = Number(values.y);
      patch.zIndex = values.zIndex != null ? Number(values.zIndex) : undefined;
      var w = Number(values.width);
      var h = Number(values.height);
      patch.width = Number.isFinite(w) ? Math.max(20, w) : undefined;
      patch.height = Number.isFinite(h) ? Math.max(20, h) : undefined;
    }
    /**
     * 「图元名作为资源标题」开关：仅在 kindConfig 允许配置时才会出现在表单里；
     * 没有 name 的场景下即便勾选也无意义，因此用 `name` 是否为空决定写入是 true 还是清掉。
     * 写入路径走 extensions，避免顶层 schema 出现仅供 UI 偏好的字段。
     */
    if (kindAllowsNameAsTitle) {
      var enabled = Boolean(values.nameAsTitle) && Boolean(name);
      patch.extensions = buildNameAsTitleExtensionsPatch(sceneElement.extensions, enabled);
    }
    onUpdate(patch);
    setFormHasUnappliedChanges(false);
  }, [onUpdate, isImageKind, isBuiltinShapeKind, layoutLocked, kindAllowsNameAsTitle, sceneElement.extensions]);
  var binding = sceneElement.dataBinding;
  var record = binding ? (_dataSources$binding$ = (_dataSources$binding$2 = dataSources[binding.dataSourceKey]) === null || _dataSources$binding$2 === void 0 ? void 0 : _dataSources$binding$2.find(function (r) {
    return r.id === binding.recordId;
  })) !== null && _dataSources$binding$ !== void 0 ? _dataSources$binding$ : {} : {};
  var dataRecordBindOptions = useMemo(function () {
    var _binding$dataSourceKe, _dataSources$key, _config$sceneElements;
    if (bindingPolicy === 'none') return [];
    var key = (_binding$dataSourceKe = binding === null || binding === void 0 ? void 0 : binding.dataSourceKey) !== null && _binding$dataSourceKe !== void 0 ? _binding$dataSourceKe : allowedKeys[0];
    if (!key) return [];
    var list = (_dataSources$key = dataSources[key]) !== null && _dataSources$key !== void 0 ? _dataSources$key : [];
    if (!list.length) return [];
    var usedByOther = new Set(((_config$sceneElements = config.sceneElements) !== null && _config$sceneElements !== void 0 ? _config$sceneElements : []).filter(function (e) {
      var _e$dataBinding;
      return e.instanceId !== sceneElement.instanceId && ((_e$dataBinding = e.dataBinding) === null || _e$dataBinding === void 0 ? void 0 : _e$dataBinding.dataSourceKey) === key;
    }).map(function (e) {
      return e.dataBinding.recordId;
    }));
    return list.filter(function (r) {
      return !usedByOther.has(r.id) || r.id === (binding === null || binding === void 0 ? void 0 : binding.recordId);
    }).map(function (r) {
      return {
        value: r.id,
        label: formatDataRecordOptionLabel(r)
      };
    });
  }, [bindingPolicy, binding, allowedKeys, dataSources, config.sceneElements, sceneElement.instanceId]);
  var hasBoundDataRecord = Boolean(binding && ((_dataSources$binding$3 = dataSources[binding.dataSourceKey]) !== null && _dataSources$binding$3 !== void 0 ? _dataSources$binding$3 : []).some(function (r) {
    return r.id === binding.recordId;
  }));
  var recordFormSlotRaw = binding ? dataSourceRecordForm === null || dataSourceRecordForm === void 0 ? void 0 : dataSourceRecordForm[binding.dataSourceKey] : undefined;
  var hasCustomRecordForm = recordFormSlotRaw !== undefined && recordFormSlotRaw !== null && recordFormSlotRaw !== false;
  var showDataBindingSection = bindingPolicy !== 'none';
  /** 仅在实际绑定到某一行时展示「数据源记录」，避免仅选数据源、recordId 为空时误展示空表单 */
  var showDataSourceRecordBlock = hasBoundDataRecord && Boolean(binding) && (onSaveRecord != null || hasCustomRecordForm);
  var showDataRecordEditorSection = showRecordFormProp !== false && showDataSourceRecordBlock && Boolean(binding);
  var recordFormContext = useMemo(function () {
    if (!binding) return null;
    return {
      dataSourceKey: binding.dataSourceKey,
      recordId: binding.recordId,
      record: record,
      dataSources: dataSources,
      sceneElement: sceneElement,
      config: config,
      savingRecord: savingRecord !== null && savingRecord !== void 0 ? savingRecord : false,
      onSaveRecord: onSaveRecord ? function (newData) {
        return onSaveRecord(binding.dataSourceKey, binding.recordId, newData);
      } : undefined
    };
  }, [binding, record, dataSources, sceneElement, config, savingRecord, onSaveRecord]);
  var isStageLike = sceneElement.elementKind === FLOOR_MAP_STAGE_ELEMENT_KIND;
  var toggleLayoutLock = function toggleLayoutLock() {
    onUpdate({
      layoutTransformLocked: !sceneElement.layoutTransformLocked
    });
  };
  var panelScrollRef = useRef(null);
  var getSelectPopupContainer = useCallback(function (node) {
    var _ref, _node$parentElement;
    return (_ref = (_node$parentElement = node.parentElement) !== null && _node$parentElement !== void 0 ? _node$parentElement : panelScrollRef.current) !== null && _ref !== void 0 ? _ref : document.body;
  }, []);
  var dragScrollRef = useRef({
    active: false,
    pointerId: -1,
    startY: 0,
    startScrollTop: 0
  });
  var isDragScrollSurface = useCallback(function (target) {
    if (!(target instanceof Element)) return false;
    /**
     * 侧栏「按住空白拖动滚动」：仅在 scrollHeight > clientHeight 时对 pointerdown 调用 setPointerCapture。
     *
     * 为何常见「桌面点不进 Select 选项、iPad/触控模拟却可以」：
     * - 无绑定的图元会多出「数据源 + 选数据行」两块，侧栏更易纵向溢出 → 桌面宽屏下右侧栏 maxHeight
     *   往往更紧，容易触发可滚动 + 捕获；平板/模拟器视口更高或布局不同，有时内容不溢出则根本不会捕获。
     * - 即便都可滚动：点在选项上时，Ant Design 的下拉层在 DOM 上多为 .ant-select-dropdown，与触发器 .ant-select
     *   兄弟挂载，closest('.ant-select') 命中不了选项节点 → 被当成「空白滚动面」误捕获，表现为下拉展开但点击无响应。
     */
    return !target.closest('input,textarea,button,select,.ant-select,.ant-select-dropdown,.pisell-lowcode-select-dropdown,.rc-select-dropdown,.ant-input,[contenteditable="true"]');
  }, []);
  var handlePanelPointerDown = useCallback(function (e) {
    if (!isDragScrollSurface(e.target)) return;
    var el = panelScrollRef.current;
    if (!el || el.scrollHeight <= el.clientHeight) return;
    el.setPointerCapture(e.pointerId);
    dragScrollRef.current = {
      active: true,
      pointerId: e.pointerId,
      startY: e.clientY,
      startScrollTop: el.scrollTop
    };
  }, [isDragScrollSurface]);
  var handlePanelPointerMove = useCallback(function (e) {
    var d = dragScrollRef.current;
    if (!d.active || e.pointerId !== d.pointerId) return;
    var el = panelScrollRef.current;
    if (!el) return;
    el.scrollTop = d.startScrollTop + (d.startY - e.clientY);
  }, []);
  var endPanelDragScroll = useCallback(function (e) {
    var d = dragScrollRef.current;
    if (!d.active || e.pointerId !== d.pointerId) return;
    dragScrollRef.current = {
      active: false,
      pointerId: -1,
      startY: 0,
      startScrollTop: 0
    };
    try {
      var _panelScrollRef$curre;
      (_panelScrollRef$curre = panelScrollRef.current) === null || _panelScrollRef$curre === void 0 || _panelScrollRef$curre.releasePointerCapture(e.pointerId);
    } catch (_unused) {
      /* ignore */
    }
  }, []);
  return /*#__PURE__*/React.createElement("div", {
    ref: panelScrollRef,
    className: classNames("".concat(PREFIX, "-edit-panel"), className),
    onPointerDown: handlePanelPointerDown,
    onPointerMove: handlePanelPointerMove,
    onPointerUp: endPanelDragScroll,
    onPointerCancel: endPanelDragScroll
  }, /*#__PURE__*/React.createElement("div", {
    className: "".concat(PREFIX, "-edit-panel-header")
  }, /*#__PURE__*/React.createElement("span", {
    className: "".concat(PREFIX, "-edit-panel-header-title")
  }, ep.elementProps), /*#__PURE__*/React.createElement(Button, {
    type: "text",
    size: "large",
    className: "".concat(PREFIX, "-edit-panel-close"),
    icon: /*#__PURE__*/React.createElement(CloseOutlined, null),
    "aria-label": ep.closeAria,
    onClick: onClose
  })), (formHasUnappliedChanges || layoutDraftDirty) && /*#__PURE__*/React.createElement("div", {
    className: "".concat(PREFIX, "-edit-panel-hints"),
    role: "status"
  }, formHasUnappliedChanges ? /*#__PURE__*/React.createElement("p", {
    className: "".concat(PREFIX, "-edit-panel-hint warn")
  }, ep.hintApply) : null, layoutDraftDirty ? /*#__PURE__*/React.createElement("p", {
    className: "".concat(PREFIX, "-edit-panel-hint muted")
  }, ep.hintSave) : null), swappableKinds.length > 1 ? /*#__PURE__*/React.createElement("div", {
    className: "".concat(PREFIX, "-edit-panel-kind-row")
  }, /*#__PURE__*/React.createElement("div", {
    className: "".concat(PREFIX, "-edit-panel-record-bind-label")
  }, ep.labelElementKind), /*#__PURE__*/React.createElement(Select, {
    size: "large",
    value: sceneElement.elementKind,
    options: swappableKinds.map(function (k) {
      return {
        value: k.value,
        label: k.label
      };
    }),
    onChange: handleElementKindChange,
    getPopupContainer: getSelectPopupContainer,
    style: {
      width: '100%',
      marginBottom: 12
    }
  })) : null, /*#__PURE__*/React.createElement(Form, {
    form: form,
    layout: "vertical",
    size: "large",
    onFinish: handleFinish,
    initialValues: initialValues,
    onValuesChange: function onValuesChange() {
      if (skipFormValuesChangeRef.current) return;
      setFormHasUnappliedChanges(true);
    }
  }, /*#__PURE__*/React.createElement("div", {
    className: "".concat(PREFIX, "-edit-panel-layout-lock-header")
  }, /*#__PURE__*/React.createElement("span", {
    className: "".concat(PREFIX, "-edit-panel-layout-lock-title")
  }, ep.sectionLayout), /*#__PURE__*/React.createElement(Button, {
    type: "text",
    size: "large",
    className: "".concat(PREFIX, "-edit-panel-layout-lock-btn"),
    icon: layoutLocked ? /*#__PURE__*/React.createElement(LockOutlined, null) : /*#__PURE__*/React.createElement(UnlockOutlined, null),
    "aria-pressed": layoutLocked,
    onClick: toggleLayoutLock,
    title: layoutLocked ? ep.lockOn : ep.lockOff
  })), /*#__PURE__*/React.createElement("div", {
    className: "".concat(PREFIX, "-edit-panel-xy-row")
  }, /*#__PURE__*/React.createElement(Form.Item, {
    name: "x",
    label: ep.labelX
  }, /*#__PURE__*/React.createElement(InputNumber, {
    style: {
      width: '100%'
    },
    disabled: layoutLocked
  })), /*#__PURE__*/React.createElement(Form.Item, {
    name: "y",
    label: ep.labelY
  }, /*#__PURE__*/React.createElement(InputNumber, {
    style: {
      width: '100%'
    },
    disabled: layoutLocked
  })), /*#__PURE__*/React.createElement(Form.Item, {
    name: "zIndex",
    label: ep.labelZ
  }, /*#__PURE__*/React.createElement(InputNumber, {
    style: {
      width: '100%'
    },
    disabled: layoutLocked
  }))), /*#__PURE__*/React.createElement("div", {
    className: "".concat(PREFIX, "-edit-panel-size-row")
  }, /*#__PURE__*/React.createElement(Form.Item, {
    name: "width",
    label: ep.labelWidth
  }, /*#__PURE__*/React.createElement(InputNumber, {
    style: {
      width: '100%'
    },
    min: 20,
    disabled: layoutLocked
  })), /*#__PURE__*/React.createElement(Form.Item, {
    name: "height",
    label: ep.labelHeight
  }, /*#__PURE__*/React.createElement(InputNumber, {
    style: {
      width: '100%'
    },
    min: 20,
    disabled: layoutLocked
  }))), /*#__PURE__*/React.createElement(Form.Item, {
    name: "name",
    label: isStageLike ? ep.labelNameStage : ep.labelName
  }, /*#__PURE__*/React.createElement(Input, {
    placeholder: isStageLike ? ep.phNameStage : ep.phName,
    allowClear: true
  })), kindAllowsNameAsTitle ?
  /*#__PURE__*/
  /**
   * 仅在 kindConfig.nameAsTitleConfigurable 时渲染。
   * 业务侧通过 {@link resolveSceneElementDisplayTitle} 读取该偏好，
   * 决定卡片标题是否覆盖业务字段（如 row.main_field / row.code）。
   */
  React.createElement(Form.Item, {
    name: "nameAsTitle",
    valuePropName: "checked",
    extra: ep.tipNameAsTitle,
    style: {
      marginTop: -4
    }
  }, /*#__PURE__*/React.createElement(Checkbox, null, ep.labelNameAsTitle)) : null, isImageKind ? /*#__PURE__*/React.createElement(Form.Item, {
    name: "imageUrl",
    label: ep.labelImageUrl,
    extra: ep.extraImageUrl
  }, /*#__PURE__*/React.createElement(Input, {
    allowClear: true,
    placeholder: ep.phHttps
  })) : null, isBuiltinShapeKind ?
  /*#__PURE__*/
  /**
   * 内置图形选择：与图片图元的 imageUrl 字段对位，但把 URL 输入换成 Select；
   * 选项由 {@link FLOOR_MAP_BUILTIN_SHAPES} 驱动（厕所 / 分隔 / 柱子 / 沙发 / 大门 等）。
   * 用 i18n key 取展示名，跟随引擎语言切换。
   */
  React.createElement(Form.Item, {
    name: "builtinShapeKey",
    label: ep.labelBuiltinShape,
    extra: ep.extraBuiltinShape
  }, /*#__PURE__*/React.createElement(Select, {
    allowClear: true,
    placeholder: ep.phBuiltinShape,
    getPopupContainer: getSelectPopupContainer,
    options: FLOOR_MAP_BUILTIN_SHAPES.map(function (s) {
      return {
        value: s.key,
        label: locales.getText(s.labelKey)
      };
    })
  })) : null, /*#__PURE__*/React.createElement(Form.Item, {
    name: "canvasId",
    label: ep.labelCanvas
  }, /*#__PURE__*/React.createElement(Select, {
    options: canvasOptions.map(function (c) {
      return {
        value: c.id,
        label: getFloorMapCanvasDisplayName(c, engineLocale)
      };
    }),
    allowClear: false,
    getPopupContainer: getSelectPopupContainer
  })), /*#__PURE__*/React.createElement(Form.Item, null, /*#__PURE__*/React.createElement(Button, {
    type: "primary",
    htmlType: "submit",
    size: "large"
  }, ep.apply))), showDataBindingSection && /*#__PURE__*/React.createElement("div", {
    className: "".concat(PREFIX, "-edit-panel-record")
  }, /*#__PURE__*/React.createElement("div", {
    className: "".concat(PREFIX, "-edit-panel-record-title")
  }, ep.dataBinding), /*#__PURE__*/React.createElement("p", {
    className: "".concat(PREFIX, "-edit-panel-record-draft-note")
  }, ep.dataBindingNote), allowedKeys.length >= 1 ? /*#__PURE__*/React.createElement("div", {
    className: "".concat(PREFIX, "-edit-panel-record-bind")
  }, /*#__PURE__*/React.createElement("div", {
    className: "".concat(PREFIX, "-edit-panel-record-bind-label")
  }, ep.labelDataSource), /*#__PURE__*/React.createElement(Select, {
    size: "large",
    style: {
      width: '100%'
    },
    placeholder: ep.phDataSource,
    value: binding === null || binding === void 0 ? void 0 : binding.dataSourceKey,
    options: allowedKeys.map(function (k) {
      var _dataSourceLabels$k;
      return {
        value: k,
        label: (_dataSourceLabels$k = dataSourceLabels[k]) !== null && _dataSourceLabels$k !== void 0 ? _dataSourceLabels$k : k
      };
    }),
    onChange: function onChange(key) {
      if (!key && bindingPolicy === 'optional') {
        onUpdate({
          dataBinding: undefined
        });
        return;
      }
      if (!key) return;
      onUpdate({
        dataBinding: {
          dataSourceKey: key,
          recordId: (binding === null || binding === void 0 ? void 0 : binding.dataSourceKey) === key ? binding.recordId : ''
        }
      });
    },
    allowClear: bindingPolicy === 'optional',
    getPopupContainer: getSelectPopupContainer
  })) : null, allowedKeys.length >= 1 && /*#__PURE__*/React.createElement("div", {
    className: "".concat(PREFIX, "-edit-panel-record-bind")
  }, /*#__PURE__*/React.createElement("div", {
    className: "".concat(PREFIX, "-edit-panel-record-bind-label")
  }, ep.labelPickRow), /*#__PURE__*/React.createElement(Select, {
    size: "large",
    placeholder: dataRecordBindOptions.length ? ep.phPickRow : ep.phNoRows,
    style: {
      width: '100%'
    },
    value: hasBoundDataRecord ? binding === null || binding === void 0 ? void 0 : binding.recordId : undefined,
    allowClear: bindingPolicy === 'optional',
    options: dataRecordBindOptions,
    getPopupContainer: getSelectPopupContainer,
    onChange: function onChange(newId) {
      var _binding$dataSourceKe2, _dataSources$key2;
      var key = (_binding$dataSourceKe2 = binding === null || binding === void 0 ? void 0 : binding.dataSourceKey) !== null && _binding$dataSourceKe2 !== void 0 ? _binding$dataSourceKe2 : allowedKeys[0];
      if (!key) return;
      if (!newId) {
        onUpdate({
          dataBinding: undefined
        });
        return;
      }
      var row = ((_dataSources$key2 = dataSources[key]) !== null && _dataSources$key2 !== void 0 ? _dataSources$key2 : []).find(function (r) {
        return r.id === newId;
      });
      onUpdate({
        dataBinding: {
          dataSourceKey: key,
          recordId: newId
        },
        name: row ? String(function (_ref2, _name) {
          var m = row.main_field;
          if (m != null && String(m).trim() !== '') {
            var _String$split$0$trim, _String$split$;
            return (_String$split$0$trim = (_String$split$ = String(m).split(' ## ')[0]) === null || _String$split$ === void 0 ? void 0 : _String$split$.trim()) !== null && _String$split$0$trim !== void 0 ? _String$split$0$trim : newId;
          }
          return (_ref2 = (_name = row.name) !== null && _name !== void 0 ? _name : row.code) !== null && _ref2 !== void 0 ? _ref2 : newId;
        }()) : undefined
      });
    }
  }), !hasBoundDataRecord && /*#__PURE__*/React.createElement("p", {
    className: "".concat(PREFIX, "-edit-panel-record-bind-hint")
  }, ep.hintUnbound))), showDataRecordEditorSection && binding && /*#__PURE__*/React.createElement("div", {
    className: "".concat(PREFIX, "-edit-panel-record")
  }, /*#__PURE__*/React.createElement("div", {
    className: "".concat(PREFIX, "-edit-panel-record-title")
  }, ep.recordTitle), hasCustomRecordForm && recordFormContext && recordFormSlotRaw != null ? /*#__PURE__*/React.createElement("div", {
    className: "".concat(PREFIX, "-edit-panel-record-custom")
  }, resolveDataSourceRecordForm(recordFormSlotRaw, recordFormContext)) : null, !hasCustomRecordForm && onSaveRecord ? /*#__PURE__*/React.createElement(FloorMapDataForm, {
    dataSourceKey: binding.dataSourceKey,
    recordId: binding.recordId,
    record: record,
    dataSources: dataSources,
    onSave: onSaveRecord,
    saving: savingRecord,
    columns: recordFormColumns === null || recordFormColumns === void 0 ? void 0 : recordFormColumns[binding.dataSourceKey]
  }) : null), config.canvasUi.canEdit && onDelete ? /*#__PURE__*/React.createElement("div", {
    className: "".concat(PREFIX, "-edit-panel-footer")
  }, /*#__PURE__*/React.createElement(Popconfirm, {
    title: ep.popTitle,
    description: ep.popDesc,
    onConfirm: onDelete,
    okText: ep.btnOkDelete,
    cancelText: ep.btnCancel,
    okButtonProps: {
      danger: true
    },
    zIndex: FLOOR_MAP_CONFIRM_OVERLAY_Z_INDEX
  }, /*#__PURE__*/React.createElement(Button, {
    type: "default",
    danger: true,
    block: true,
    size: "large"
  }, ep.btnDelete))) : null);
}
export default FloorMapEditPanel;