const require_runtime = require("../../../_virtual/_rolldown/runtime.js");
const require_ItemLayer = require("./ItemLayer.js");
const require_floorMapLayoutConstants = require("../floorMapLayoutConstants.js");
const require_useEngineContext = require("../../../hooks/useEngineContext.js");
const require_floorMapCanvasDisplay = require("../utils/floorMapCanvasDisplay.js");
const require_mergeCanvasesForTabs = require("../utils/mergeCanvasesForTabs.js");
let react = require("react");
react = require_runtime.__toESM(react);
let classnames = require("classnames");
classnames = require_runtime.__toESM(classnames);
require("./FloorMapOverview.less");
//#region src/components/pisellFloorMapLayout/components/FloorMapOverview.tsx
/**
* FloorMapOverview - 阅读态「All」全览视图（纯渲染版）
*
* 仅负责把 {@link OverviewLayout} 中各画布的图元渲染到对应的绝对定位区域里；
* 由 PisellFloorMapLayout 在主 TransformWrapper 内挂载，与单画布共享同一套
* 视口控件（缩放、平移、锁定、全屏、fitBounds、网格按钮等）。
*
* 设计要点：
* - 不再自带 TransformWrapper / ResizeObserver / fit 算法；
* - 每个画布作为独立区域，仅一条细边框作分隔，无背景色/网格；
* - 画布名显示在边框外的标题带；标题不拦截图元交互；
* - 仅渲染 ItemLayer（阅读态），与单画布的 hover/click 行为一致；编辑层不渲染。
*/
const I18N_OVERVIEW_AREA_BADGE = "pisell-floor-map-layout.overview.area-title-badge";
const I18N_EMPTY = "pisell-floor-map-layout.overview.empty";
function FloorMapOverview(props) {
	const { overviewLayout, config, itemUnit = "pixel", renderItem, viewportScale, enableHover = true, onItemClick, onItemHover, onItemLeave, getMergedItemWrapperStyle, readModeSelectedItemId, onSelectCanvas, className } = props;
	const displayLocale = require_floorMapCanvasDisplay.getFloorMapDisplayLocale(require_useEngineContext.default());
	if (overviewLayout.areas.length === 0) return /* @__PURE__ */ react.default.createElement("div", {
		className: (0, classnames.default)(`${require_floorMapLayoutConstants.FLOOR_MAP_LAYOUT_CLASS_PREFIX}-overview`, `${require_floorMapLayoutConstants.FLOOR_MAP_LAYOUT_CLASS_PREFIX}-overview--empty`, className),
		style: {
			width: "100%",
			height: "100%"
		}
	}, require_floorMapCanvasDisplay.getFloorMapLayoutText(I18N_EMPTY, displayLocale));
	/**
	* 用 mergeCanvasesForTabs 构造 canvasId → displayName 的映射；
	* 避免在循环里多次调用。
	*/
	const displayNameById = /* @__PURE__ */ new Map();
	for (const canvas of require_mergeCanvasesForTabs.mergeCanvasesForTabs(config)) displayNameById.set(canvas.id, require_floorMapCanvasDisplay.getFloorMapCanvasDisplayName(canvas, displayLocale));
	return /* @__PURE__ */ react.default.createElement("div", {
		className: (0, classnames.default)(`${require_floorMapLayoutConstants.FLOOR_MAP_LAYOUT_CLASS_PREFIX}-overview`, className),
		style: {
			position: "relative",
			width: overviewLayout.totalWidth,
			height: overviewLayout.totalHeight
		}
	}, overviewLayout.areas.map((area) => {
		var _displayNameById$get;
		const displayName = (_displayNameById$get = displayNameById.get(area.canvasId)) !== null && _displayNameById$get !== void 0 ? _displayNameById$get : area.canvasId;
		const safeScale = viewportScale != null && Number.isFinite(viewportScale) && viewportScale > 0 ? viewportScale : 1;
		const inverseScale = 1 / safeScale;
		return /* @__PURE__ */ react.default.createElement("div", {
			key: area.canvasId,
			className: `${require_floorMapLayoutConstants.FLOOR_MAP_LAYOUT_CLASS_PREFIX}-overview-area-block`,
			style: {
				position: "absolute",
				left: area.x,
				top: area.y,
				width: area.contentWidth
			}
		}, /* @__PURE__ */ react.default.createElement("div", {
			className: `${require_floorMapLayoutConstants.FLOOR_MAP_LAYOUT_CLASS_PREFIX}-overview-area-title`,
			title: displayName,
			style: {
				height: area.titleBandHeight,
				transform: `scale(${inverseScale})`,
				transformOrigin: "top left",
				width: `${100 * safeScale}%`,
				maxWidth: `${area.contentWidth * safeScale}px`
			}
		}, onSelectCanvas ? /* @__PURE__ */ react.default.createElement("button", {
			type: "button",
			className: (0, classnames.default)(`${require_floorMapLayoutConstants.FLOOR_MAP_LAYOUT_CLASS_PREFIX}-overview-area-title-inner`, `${require_floorMapLayoutConstants.FLOOR_MAP_LAYOUT_CLASS_PREFIX}-overview-area-title-inner--clickable`),
			title: displayName,
			"aria-label": displayName,
			onClick: (e) => {
				e.stopPropagation();
				onSelectCanvas(area.canvasId);
			}
		}, /* @__PURE__ */ react.default.createElement("span", { className: `${require_floorMapLayoutConstants.FLOOR_MAP_LAYOUT_CLASS_PREFIX}-overview-area-title-badge` }, require_floorMapCanvasDisplay.getFloorMapLayoutText(I18N_OVERVIEW_AREA_BADGE, displayLocale)), /* @__PURE__ */ react.default.createElement("span", { className: `${require_floorMapLayoutConstants.FLOOR_MAP_LAYOUT_CLASS_PREFIX}-overview-area-title-text` }, displayName)) : /* @__PURE__ */ react.default.createElement("span", { className: `${require_floorMapLayoutConstants.FLOOR_MAP_LAYOUT_CLASS_PREFIX}-overview-area-title-inner` }, /* @__PURE__ */ react.default.createElement("span", { className: `${require_floorMapLayoutConstants.FLOOR_MAP_LAYOUT_CLASS_PREFIX}-overview-area-title-badge` }, require_floorMapCanvasDisplay.getFloorMapLayoutText(I18N_OVERVIEW_AREA_BADGE, displayLocale)), /* @__PURE__ */ react.default.createElement("span", { className: `${require_floorMapLayoutConstants.FLOOR_MAP_LAYOUT_CLASS_PREFIX}-overview-area-title-text` }, displayName))), /* @__PURE__ */ react.default.createElement("div", {
			className: (0, classnames.default)(`${require_floorMapLayoutConstants.FLOOR_MAP_LAYOUT_CLASS_PREFIX}-overview-area`, { [`${require_floorMapLayoutConstants.FLOOR_MAP_LAYOUT_CLASS_PREFIX}-overview-area--clickable`]: Boolean(onSelectCanvas) }),
			style: {
				width: area.contentWidth,
				height: area.contentHeight
			},
			onClick: onSelectCanvas ? (e) => {
				/** 点到图元交给图元自身处理，仅空白区域才切换画布 */
				if (e.target.closest(`.pisell-floor-map-layout-item`)) return;
				onSelectCanvas(area.canvasId);
			} : void 0
		}, /* @__PURE__ */ react.default.createElement(require_ItemLayer.default, {
			items: area.items,
			renderItem,
			viewportScale,
			cellSize: area.cellSize,
			itemUnit,
			contentWidth: area.contentWidth,
			contentHeight: area.contentHeight,
			contentOffsetX: area.contentOffsetX,
			contentOffsetY: area.contentOffsetY,
			enableHover,
			itemHoverOutline: enableHover,
			onItemClick,
			onItemHover,
			onItemLeave,
			getMergedItemWrapperStyle,
			readModeSelectedItemId
		})));
	}));
}
//#endregion
exports.default = FloorMapOverview;
