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/FloorMapEdgeEditPanel.tsx
var FloorMapEdgeEditPanel_exports = {};
__export(FloorMapEdgeEditPanel_exports, {
  FloorMapEdgeEditPanel: () => FloorMapEdgeEditPanel
});
module.exports = __toCommonJS(FloorMapEdgeEditPanel_exports);
var import_react = __toESM(require("react"));
var import_utils = require("@pisell/utils");
var import_classnames = __toESM(require("classnames"));
var import_icons = require("@ant-design/icons");
var import_antd = require("antd");
var import_edgeRouting = require("../utils/edgeRouting");
var import_FloorMapEdgeEditPanel = require("./FloorMapEdgeEditPanel.less");
var PREFIX = "pisell-floor-map-layout";
var I18N = "pisell-floor-map-layout.edge-panel";
var STATUS_OPTIONS = [
  { value: "online", labelKey: `${I18N}.status-online` },
  { value: "offline", labelKey: `${I18N}.status-offline` },
  { value: "warning", labelKey: `${I18N}.status-warning` },
  { value: "unknown", labelKey: `${I18N}.status-unknown` }
];
var ANCHOR_OPTIONS = import_edgeRouting.FLOOR_MAP_EDGE_ANCHORS.map((a) => ({
  value: a,
  label: a
}));
function nodeLabel(config, instanceId) {
  var _a;
  const el = (config.sceneElements ?? []).find(
    (e) => e.instanceId === instanceId
  );
  return ((_a = el == null ? void 0 : el.name) == null ? void 0 : _a.trim()) || instanceId;
}
function FloorMapEdgeEditPanel(props) {
  const {
    edge,
    config,
    onUpdate,
    onClose,
    onDelete,
    layoutDraftDirty,
    className
  } = props;
  const t = (0, import_react.useCallback)((key) => import_utils.locales.getText(key), []);
  const panelScrollRef = (0, import_react.useRef)(null);
  const getSelectPopupContainer = (0, import_react.useCallback)((node) => {
    return node.parentElement ?? panelScrollRef.current ?? document.body;
  }, []);
  return /* @__PURE__ */ import_react.default.createElement(
    "div",
    {
      ref: panelScrollRef,
      className: (0, import_classnames.default)(`${PREFIX}-edge-edit-panel`, className)
    },
    /* @__PURE__ */ import_react.default.createElement("div", { className: `${PREFIX}-edge-edit-panel-header` }, /* @__PURE__ */ import_react.default.createElement("span", { className: `${PREFIX}-edge-edit-panel-title` }, t(`${I18N}.title`)), /* @__PURE__ */ import_react.default.createElement(
      import_antd.Button,
      {
        type: "text",
        size: "large",
        className: `${PREFIX}-edge-edit-panel-close`,
        icon: /* @__PURE__ */ import_react.default.createElement(import_icons.CloseOutlined, null),
        onClick: onClose,
        "aria-label": "close"
      }
    )),
    layoutDraftDirty ? /* @__PURE__ */ import_react.default.createElement("div", { className: `${PREFIX}-edge-edit-panel-dirty-hint` }, t(`${I18N}.dirty-hint`)) : null,
    /* @__PURE__ */ import_react.default.createElement(import_antd.Form, { layout: "vertical", size: "large", className: `${PREFIX}-edge-edit-form` }, /* @__PURE__ */ import_react.default.createElement(import_antd.Form.Item, { label: t(`${I18N}.source-node`) }, /* @__PURE__ */ import_react.default.createElement(import_antd.Input, { value: nodeLabel(config, edge.sourceId), disabled: true })), /* @__PURE__ */ import_react.default.createElement(import_antd.Form.Item, { label: t(`${I18N}.target-node`) }, /* @__PURE__ */ import_react.default.createElement(import_antd.Input, { value: nodeLabel(config, edge.targetId), disabled: true })), /* @__PURE__ */ import_react.default.createElement(import_antd.Form.Item, { label: t(`${I18N}.source-anchor`) }, /* @__PURE__ */ import_react.default.createElement(
      import_antd.Select,
      {
        value: edge.sourceAnchor ?? "right",
        options: ANCHOR_OPTIONS,
        getPopupContainer: getSelectPopupContainer,
        onChange: (v) => onUpdate({ sourceAnchor: v })
      }
    )), /* @__PURE__ */ import_react.default.createElement(import_antd.Form.Item, { label: t(`${I18N}.target-anchor`) }, /* @__PURE__ */ import_react.default.createElement(
      import_antd.Select,
      {
        value: edge.targetAnchor ?? "left",
        options: ANCHOR_OPTIONS,
        getPopupContainer: getSelectPopupContainer,
        onChange: (v) => onUpdate({ targetAnchor: v })
      }
    )), /* @__PURE__ */ import_react.default.createElement(import_antd.Form.Item, { label: t(`${I18N}.source-label`) }, /* @__PURE__ */ import_react.default.createElement(
      import_antd.Input,
      {
        value: edge.sourceLabel ?? "",
        onChange: (e) => onUpdate({ sourceLabel: e.target.value }),
        placeholder: "G3/WAN"
      }
    )), /* @__PURE__ */ import_react.default.createElement(import_antd.Form.Item, { label: t(`${I18N}.target-label`) }, /* @__PURE__ */ import_react.default.createElement(
      import_antd.Input,
      {
        value: edge.targetLabel ?? "",
        onChange: (e) => onUpdate({ targetLabel: e.target.value })
      }
    )), /* @__PURE__ */ import_react.default.createElement(import_antd.Form.Item, { label: t(`${I18N}.center-label`) }, /* @__PURE__ */ import_react.default.createElement(
      import_antd.Input,
      {
        value: edge.label ?? "",
        onChange: (e) => onUpdate({ label: e.target.value })
      }
    )), /* @__PURE__ */ import_react.default.createElement(import_antd.Form.Item, { label: t(`${I18N}.status`) }, /* @__PURE__ */ import_react.default.createElement(
      import_antd.Select,
      {
        value: edge.status ?? "unknown",
        options: STATUS_OPTIONS.map((o) => ({
          value: o.value,
          label: t(o.labelKey)
        })),
        getPopupContainer: getSelectPopupContainer,
        onChange: (v) => onUpdate({ status: v })
      }
    )), /* @__PURE__ */ import_react.default.createElement(import_antd.Form.Item, { label: t(`${I18N}.color`) }, /* @__PURE__ */ import_react.default.createElement(
      import_antd.Input,
      {
        value: edge.color ?? "",
        onChange: (e) => onUpdate({ color: e.target.value || void 0 }),
        placeholder: "#12B76A"
      }
    )), /* @__PURE__ */ import_react.default.createElement(import_antd.Form.Item, { label: t(`${I18N}.stroke-width`) }, /* @__PURE__ */ import_react.default.createElement(
      import_antd.InputNumber,
      {
        min: 0.5,
        max: 8,
        step: 0.5,
        value: edge.strokeWidth ?? 1.5,
        onChange: (v) => onUpdate({ strokeWidth: v ?? void 0 }),
        style: { width: "100%" }
      }
    )), /* @__PURE__ */ import_react.default.createElement(import_antd.Form.Item, { label: t(`${I18N}.dashed`) }, /* @__PURE__ */ import_react.default.createElement(
      import_antd.Select,
      {
        value: edge.dashed ? "yes" : "no",
        options: [
          { value: "no", label: t(`${I18N}.dashed-no`) },
          { value: "yes", label: t(`${I18N}.dashed-yes`) }
        ],
        getPopupContainer: getSelectPopupContainer,
        onChange: (v) => onUpdate({ dashed: v === "yes" })
      }
    )), onDelete ? /* @__PURE__ */ import_react.default.createElement(
      import_antd.Popconfirm,
      {
        title: t(`${I18N}.delete-confirm`),
        onConfirm: onDelete
      },
      /* @__PURE__ */ import_react.default.createElement(import_antd.Button, { danger: true, block: true, size: "large" }, t(`${I18N}.delete`))
    ) : null)
  );
}
// Annotate the CommonJS export names for ESM import in node:
0 && (module.exports = {
  FloorMapEdgeEditPanel
});
