const require_runtime = require("../../../../../_virtual/_rolldown/runtime.js");
const require_bookingCalendarConstants = require("../const/bookingCalendarConstants.js");
const require_calendarI18n = require("../calendarI18n.js");
const require_bookingCalendarDateUtils = require("../utils/bookingCalendarDateUtils.js");
const require_BookingCalendarStyle = require("../utils/BookingCalendarStyle.js");
const require_bookingCalendarViewShared = require("../bookingCalendarViewShared.js");
const require_BookingCalendarGroupRowHeader = require("./BookingCalendarGroupRowHeader.js");
let react = require("react");
react = require_runtime.__toESM(react);
//#region src/components/pisellRecordBoard/shellFrame/Calendar/view/BookingCalendarResourceView.tsx
/**
* 资源视图（按月）：与日视图同款骨架——冻结左列 + 横向滚动 + sticky 顶部表头。
*
* 与日视图的唯一差异：
*   - 日视图：横轴 = 营业小时槽，cell = 一个小时；booking 通过 overlay 跨 cell 横铺。
*   - 资源视图：横轴 = 当月每一天，cell = 一个 (court, date)；booking 通过 overlay 在 cell 内
*     垂直 stack 渲染（最多 3 条 + `+N` 溢出 tile）。
*
* 性能策略（与日视图对齐）：
*   - cell 是「轻 placeholder」：只渲染背景色 + selected ring + 空 dashed slot/Selected 文本。
*   - 所有 booking 卡片 / `+N` tile 由 `BookingOverlay` 单独 absolute 渲染，独立于 grid。
*   - 这样 grid 内 DOM 极轻，浏览器每帧 paint/layout 与日视图同档（cell 内含复杂 booking
*     卡片时实测每列 ~7ms paint 成本，整月 30 列 → ~150ms；overlay 化后接近零）。
*
* 选中：与日视图 `toggleSlot(courtId, hour)` 等价的「`toggleResourceCell(courtId, dateKey)`」。
* 选中态合并到 cell 自身 className（与日视图一致），不插入额外 grid item，避免 CSS Grid 整表 reflow。
*/
const PREVIEW_CAP = 3;
const BookingCalendarResourceView = react.default.memo(BookingCalendarResourceViewInner);
function BookingCalendarResourceViewInner({ calendarProps, isLight, anchorDate, monthDays, slotColWidth, bookings, visibleCourts, visibleCourtRows, hourSlots, slotStepHours, handleGridDropMove, openBookingDetail, setDraggingItem, setCollapsedGroups, overflowPopover, setOverflowPopover, setOverflowListModal, overflowPanelRef, resourceMonthScrollToTodayToken, resourceDayHeaderRemaining, toggleResourceCell, selectedResourceCells }) {
	const props = calendarProps;
	const todayKey = require_bookingCalendarDateUtils.fmtDate(/* @__PURE__ */ new Date());
	const monthKeyPrefix = `${anchorDate.getFullYear()}-${anchorDate.getMonth()}`;
	const bookingsStable = (0, react.useMemo)(() => bookings, [(0, react.useMemo)(() => {
		if (!Array.isArray(bookings) || bookings.length === 0) return "[]";
		return bookings.map((b) => {
			var _b$id, _b$courtId, _b$date, _b$kind, _b$startHour, _b$endHour;
			return `${(_b$id = b === null || b === void 0 ? void 0 : b.id) !== null && _b$id !== void 0 ? _b$id : ""}|${(_b$courtId = b === null || b === void 0 ? void 0 : b.courtId) !== null && _b$courtId !== void 0 ? _b$courtId : ""}|${(_b$date = b === null || b === void 0 ? void 0 : b.date) !== null && _b$date !== void 0 ? _b$date : ""}|${(_b$kind = b === null || b === void 0 ? void 0 : b.kind) !== null && _b$kind !== void 0 ? _b$kind : ""}|${(_b$startHour = b === null || b === void 0 ? void 0 : b.startHour) !== null && _b$startHour !== void 0 ? _b$startHour : ""}|${(_b$endHour = b === null || b === void 0 ? void 0 : b.endHour) !== null && _b$endHour !== void 0 ? _b$endHour : ""}`;
		}).join(";");
	}, [bookings])]);
	const scrollRef = (0, react.useRef)(null);
	const dragRef = (0, react.useRef)({
		dragging: false,
		startX: 0,
		startY: 0,
		startLeft: 0,
		startTop: 0,
		moved: false
	});
	const [dragging, setDragging] = (0, react.useState)(false);
	const [virt, setVirt] = (0, react.useState)({
		i0: 0,
		i1: 0,
		r0: 0,
		r1: 0,
		ready: false
	});
	const rafRef = (0, react.useRef)(null);
	/** 行前缀和 ref（updateVirt 内通过 ref 读取最新值，避免每次行高变化都重建 callback） */
	const rowPrefixRef = (0, react.useRef)([0]);
	const nCols = monthDays.length;
	const updateVirt = (0, react.useCallback)(() => {
		const root = scrollRef.current;
		if (!root || nCols <= 0) return;
		const sl = root.scrollLeft;
		const st = root.scrollTop;
		const vw = root.clientWidth;
		const vh = root.clientHeight;
		let i0 = Math.floor((sl - 132) / slotColWidth) - 5;
		let i1 = Math.ceil((sl + vw - 132) / slotColWidth) - 1 + 5;
		i0 = Math.max(0, i0);
		i1 = Math.min(nCols - 1, i1);
		if (i0 > i1) {
			i0 = 0;
			i1 = nCols - 1;
		}
		const pfx = rowPrefixRef.current;
		const nr = Math.max(0, pfx.length - 1);
		let r0 = 0;
		let r1 = nr > 0 ? nr - 1 : 0;
		if (nr > 0) {
			const bodyTop = 56;
			const vTop = st;
			const vBot = st + vh;
			const buf = 240;
			for (let r = 0; r < nr; r += 1) {
				var _pfx;
				if (bodyTop + ((_pfx = pfx[r + 1]) !== null && _pfx !== void 0 ? _pfx : 0) > vTop - buf) {
					r0 = r;
					break;
				}
			}
			for (let r = nr - 1; r >= 0; r -= 1) {
				var _pfx$r;
				if (bodyTop + ((_pfx$r = pfx[r]) !== null && _pfx$r !== void 0 ? _pfx$r : 0) < vBot + buf) {
					r1 = r;
					break;
				}
			}
			if (r0 > r1) {
				r0 = 0;
				r1 = nr - 1;
			}
		}
		setVirt((prev) => prev.ready && prev.i0 === i0 && prev.i1 === i1 && prev.r0 === r0 && prev.r1 === r1 ? prev : {
			i0,
			i1,
			r0,
			r1,
			ready: true
		});
	}, [nCols, slotColWidth]);
	const scheduleVirt = (0, react.useCallback)(() => {
		if (rafRef.current != null) return;
		rafRef.current = requestAnimationFrame(() => {
			rafRef.current = null;
			updateVirt();
		});
	}, [updateVirt]);
	(0, react.useLayoutEffect)(() => {
		const root = scrollRef.current;
		if (!root) return void 0;
		scheduleVirt();
		const onScroll = () => scheduleVirt();
		root.addEventListener("scroll", onScroll, { passive: true });
		let ro = null;
		if (typeof ResizeObserver !== "undefined") {
			ro = new ResizeObserver(() => scheduleVirt());
			try {
				ro.observe(root);
			} catch (_unused) {}
		}
		return () => {
			root.removeEventListener("scroll", onScroll);
			ro === null || ro === void 0 || ro.disconnect();
			if (rafRef.current != null) cancelAnimationFrame(rafRef.current);
			rafRef.current = null;
		};
	}, [
		monthKeyPrefix,
		scheduleVirt,
		nCols
	]);
	/** 切入资源视图时把今天列居中（仅当月含今天） */
	(0, react.useLayoutEffect)(() => {
		if (!resourceMonthScrollToTodayToken) return;
		const root = scrollRef.current;
		if (!root || monthDays.length === 0) return;
		const idx = monthDays.findIndex((d) => require_bookingCalendarDateUtils.fmtDate(d) === require_bookingCalendarDateUtils.getViewNowReference().dateKey);
		if (idx < 0) return;
		const targetLeft = 132 + idx * slotColWidth - root.clientWidth / 2 + slotColWidth / 2;
		root.scrollLeft = Math.max(0, Math.min(targetLeft, root.scrollWidth - root.clientWidth));
	}, [
		resourceMonthScrollToTodayToken,
		monthKeyPrefix,
		monthDays,
		slotColWidth
	]);
	const onMouseDown = (0, react.useCallback)((e) => {
		if (e.button !== 0 || !scrollRef.current) return;
		dragRef.current = {
			dragging: true,
			startX: e.clientX,
			startY: e.clientY,
			startLeft: scrollRef.current.scrollLeft,
			startTop: scrollRef.current.scrollTop,
			moved: false
		};
		setDragging(true);
	}, []);
	const onMouseMove = (0, react.useCallback)((e) => {
		if (!dragRef.current.dragging || !scrollRef.current) return;
		const dx = e.clientX - dragRef.current.startX;
		const dy = e.clientY - dragRef.current.startY;
		if (Math.abs(dx) > 3 || Math.abs(dy) > 3) dragRef.current.moved = true;
		scrollRef.current.scrollLeft = dragRef.current.startLeft - dx;
		scrollRef.current.scrollTop = dragRef.current.startTop - dy;
	}, []);
	const onMouseUp = (0, react.useCallback)(() => {
		dragRef.current.dragging = false;
		setDragging(false);
	}, []);
	const visibleColIndices = (0, react.useMemo)(() => {
		if (!virt.ready) {
			const out = [];
			for (let i = 0; i < nCols; i += 1) out.push(i);
			return out;
		}
		const out = [];
		for (let i = virt.i0; i <= virt.i1; i += 1) out.push(i);
		return out;
	}, [virt, nCols]);
	const summaryCache = (0, react.useMemo)(() => {
		const m = /* @__PURE__ */ new Map();
		const visibleCourtIds = [];
		for (const r of visibleCourtRows) if ((r === null || r === void 0 ? void 0 : r.kind) === "court" && r.id) visibleCourtIds.push(String(r.id));
		const visibleDateKeys = visibleColIndices.map((ci) => monthDays[ci]).filter(Boolean).map((d) => require_bookingCalendarDateUtils.fmtDate(d));
		for (const cid of visibleCourtIds) for (const dk of visibleDateKeys) m.set(`${cid}\t${dk}`, require_bookingCalendarDateUtils.courtDaySummary(cid, dk, bookingsStable, hourSlots, slotStepHours));
		return m;
	}, [
		visibleCourtRows,
		visibleColIndices,
		monthDays,
		bookingsStable,
		hourSlots,
		slotStepHours
	]);
	const getSummary = (0, react.useCallback)((courtId, dateKey) => {
		var _summaryCache$get;
		return (_summaryCache$get = summaryCache.get(`${courtId}\t${dateKey}`)) !== null && _summaryCache$get !== void 0 ? _summaryCache$get : require_bookingCalendarDateUtils.courtDaySummary(courtId, dateKey, bookingsStable, hourSlots, slotStepHours);
	}, [
		summaryCache,
		bookingsStable,
		hourSlots,
		slotStepHours
	]);
	const rowHeights = (0, react.useMemo)(() => {
		return visibleCourtRows.map((row) => {
			if (row.kind === "group") return 38;
			let maxH = 44;
			for (let di = 0; di < monthDays.length; di += 1) {
				const day = monthDays[di];
				if (!day) continue;
				const summary = getSummary(row.id, require_bookingCalendarDateUtils.fmtDate(day));
				maxH = Math.max(maxH, require_bookingCalendarConstants.estimateResourceViewCourtCellHeightPx(summary));
			}
			return maxH;
		});
	}, [
		visibleCourtRows,
		monthDays,
		getSummary
	]);
	const gridTemplateRows = (0, react.useMemo)(() => visibleCourtRows.map((row, i) => row.kind === "group" ? `38px` : `${rowHeights[i]}px`).join(" "), [visibleCourtRows, rowHeights]);
	/** 行前缀和：rowPrefixTop[i] = 前 i 行总高度（i 从 0 到 N） */
	const rowPrefixTop = (0, react.useMemo)(() => {
		const arr = new Array(rowHeights.length + 1);
		arr[0] = 0;
		for (let i = 0; i < rowHeights.length; i += 1) {
			var _rowHeights$i;
			arr[i + 1] = arr[i] + ((_rowHeights$i = rowHeights[i]) !== null && _rowHeights$i !== void 0 ? _rowHeights$i : 0);
		}
		return arr;
	}, [rowHeights]);
	/** 同步到 ref，让 updateVirt 拿到最新前缀和；行高变化后立刻触发一次行窗口重算 */
	(0, react.useLayoutEffect)(() => {
		rowPrefixRef.current = rowPrefixTop;
		scheduleVirt();
	}, [rowPrefixTop, scheduleVirt]);
	const contentHeight = 56 + rowPrefixTop[rowPrefixTop.length - 1];
	/**
	* 按 court 切分的「选中日期签名」：传给 ResourceCourtRow 触发 React.memo 浅比较。
	* - 同一 court 的选中集没变 → sig 字符串相等 → memo 命中 → 整行跳过 reconcile。
	* - 这样点击 / 取消 cell 时，只有「新选中 / 旧选中」对应的 1~2 行真正重渲染，其他全部 N 行被 memo 跳过。
	*/
	const selectionSigByCourtId = (0, react.useMemo)(() => {
		const grp = /* @__PURE__ */ new Map();
		for (const s of selectedResourceCells) {
			const cid = String(s.courtId);
			let arr = grp.get(cid);
			if (!arr) {
				arr = [];
				grp.set(cid, arr);
			}
			arr.push(s.dateKey);
		}
		const m = /* @__PURE__ */ new Map();
		grp.forEach((arr, cid) => {
			arr.sort();
			m.set(cid, arr.join("|"));
		});
		return m;
	}, [selectedResourceCells]);
	const monthLabel = `${anchorDate.getFullYear()} / ${anchorDate.getMonth() + 1}`;
	return /* @__PURE__ */ react.default.createElement("div", {
		key: `resource-${monthKeyPrefix}`,
		className: "flex min-h-0 flex-1 flex-col"
	}, /* @__PURE__ */ react.default.createElement("div", { className: "relative flex min-h-0 flex-1 flex-col" }, /* @__PURE__ */ react.default.createElement("div", {
		ref: scrollRef,
		onMouseDown,
		onMouseMove,
		onMouseUp,
		onMouseLeave: onMouseUp,
		style: { overscrollBehavior: "none" },
		className: `pisell-scroll-hidden relative border min-h-0 max-h-none flex-1 overflow-auto touch-pan-x touch-pan-y select-none ${isLight ? "theme-panel theme-border" : "border-zinc-800 bg-[#121217]"} ${dragging ? "cursor-grabbing" : "cursor-grab"}`
	}, /* @__PURE__ */ react.default.createElement("div", {
		className: "relative",
		style: {
			minWidth: `${132 + nCols * slotColWidth}px`,
			minHeight: `${contentHeight}px`
		}
	}, /* @__PURE__ */ react.default.createElement("div", {
		className: "grid sticky top-0 z-50",
		style: { gridTemplateColumns: `132px repeat(${nCols}, ${slotColWidth}px)` }
	}, /* @__PURE__ */ react.default.createElement("div", { className: `sticky left-0 top-0 z-[60] flex h-full min-h-0 w-[132px] min-w-[132px] max-w-[132px] flex-col justify-center px-2.5 font-semibold border-b shadow-[8px_0_16px_rgba(0,0,0,0.08)] ${isLight ? "surface-brand-side text-slate-900" : "bg-[#241d40] border-zinc-800 text-zinc-100"}` }, /* @__PURE__ */ react.default.createElement("span", { className: "text-lg font-bold leading-tight" }, monthLabel)), visibleColIndices.map((ci) => {
		const day = monthDays[ci];
		if (!day) return null;
		const key = require_bookingCalendarDateUtils.fmtDate(day);
		const isToday = key === todayKey;
		const remaining = resourceDayHeaderRemaining[key];
		return /* @__PURE__ */ react.default.createElement("div", {
			key: `rh-${key}`,
			className: `relative z-20 border-b border-l px-1 py-2 text-center shadow-[0_8px_16px_rgba(0,0,0,0.06)] ${isLight ? "theme-border theme-text" : "border-zinc-800"} ${isToday ? isLight ? "bg-gradient-to-b from-violet-50 to-white" : "bg-gradient-to-b from-violet-950 to-[#1a1a22]" : isLight ? "theme-panel-soft" : "bg-[#1a1a22]"}`,
			style: { gridColumn: ci + 2 }
		}, /* @__PURE__ */ react.default.createElement("div", { className: "flex justify-center" }, /* @__PURE__ */ react.default.createElement("span", {
			className: "grid h-10 w-10 place-items-center text-3xl font-semibold leading-none",
			"aria-label": isToday ? "Today" : void 0
		}, day.getDate())), remaining && remaining.total > 0 && /* @__PURE__ */ react.default.createElement("div", { className: `mt-1 text-[11px] font-semibold leading-tight ${require_bookingCalendarViewShared.getRemainingToneClass(remaining.ratio, isLight)}` }, require_calendarI18n.tCal("pisell2.recordBoard.calendar.day.freeRatio", {
			remaining: remaining.remaining,
			total: remaining.total
		})));
	})), /* @__PURE__ */ react.default.createElement("div", {
		className: "grid relative",
		style: {
			gridTemplateColumns: `132px repeat(${nCols}, ${slotColWidth}px)`,
			gridTemplateRows
		}
	}, visibleCourtRows.map((row, rowIndex) => {
		var _selectionSigByCourtI;
		if (virt.ready && (rowIndex < virt.r0 || rowIndex > virt.r1)) return /* @__PURE__ */ react.default.createElement("div", {
			key: `${row.id}-skip`,
			className: `pointer-events-none border-b ${isLight ? "theme-border" : "border-zinc-800"}`,
			style: {
				gridColumn: "1 / -1",
				gridRow: rowIndex + 1
			},
			"aria-hidden": true
		});
		return row.kind === "group" ? /* @__PURE__ */ react.default.createElement(react.default.Fragment, { key: row.id }, /* @__PURE__ */ react.default.createElement(require_BookingCalendarGroupRowHeader.BookingCalendarGroupRowHeader, {
			isLight,
			view: "resource",
			row: {
				id: row.id,
				label: row.label,
				count: row.count,
				collapsed: row.collapsed
			},
			renderResourceCell: props.renderResourceCell,
			setCollapsedGroups,
			style: {
				gridRow: rowIndex + 1,
				gridColumn: 1
			}
		}), visibleColIndices.map((ci) => {
			const day = monthDays[ci];
			if (!day) return null;
			const key = require_bookingCalendarDateUtils.fmtDate(day);
			const groupCourts = visibleCourts.filter((c) => c.type === row.label);
			const total = groupCourts.length;
			const noRatioCell = total === 0;
			let remaining = 0;
			let ratio = 0;
			if (!noRatioCell) {
				remaining = total - groupCourts.filter((c) => getSummary(c.id, key).items.length > 0).length;
				ratio = remaining / total;
			}
			return /* @__PURE__ */ react.default.createElement("div", {
				key: `${row.id}-${key}`,
				style: {
					gridRow: rowIndex + 1,
					gridColumn: ci + 2
				},
				className: `flex h-full items-center justify-center border-b border-l px-1.5 py-1 text-center text-sm font-medium ${isLight ? "theme-border" : "border-zinc-800"} ${noRatioCell ? isLight ? "bg-slate-100 theme-text-faint" : "bg-zinc-800/80 text-zinc-500" : isLight ? "theme-panel-soft" : "bg-[#151a2f] text-zinc-300"}`
			}, noRatioCell ? /* @__PURE__ */ react.default.createElement("div", { className: "text-xs opacity-60" }, "—") : /* @__PURE__ */ react.default.createElement("div", { className: `text-xs font-semibold leading-none ${require_bookingCalendarViewShared.getRemainingToneClass(ratio, isLight)}` }, require_calendarI18n.tCal("pisell2.recordBoard.calendar.day.freeRatio", {
				remaining,
				total
			})));
		})) : /* @__PURE__ */ react.default.createElement(ResourceCourtRow, {
			key: row.id,
			courtId: String(row.id),
			courtName: row.name,
			courtType: row.type,
			rowIndex,
			visibleColIndices,
			monthDays,
			getSummary,
			toggleResourceCell,
			isLight,
			renderResourceCell: props.renderResourceCell,
			handleGridDropMove,
			selectedSig: (_selectionSigByCourtI = selectionSigByCourtId.get(String(row.id))) !== null && _selectionSigByCourtI !== void 0 ? _selectionSigByCourtI : ""
		});
	}), /* @__PURE__ */ react.default.createElement(BookingOverlay, {
		visibleCourtRows,
		visibleColIndices,
		monthDays,
		rowPrefixTop,
		rowHeights,
		slotColWidth,
		virt,
		getSummary,
		isLight,
		renderMonthWeekBooking: props.renderMonthWeekBooking,
		openBookingDetail,
		setDraggingItem,
		handleGridDropMove,
		overflowPopover,
		setOverflowPopover,
		setOverflowListModal,
		overflowPanelRef
	}))))));
}
const ResourceCourtRow = react.default.memo(function ResourceCourtRow({ courtId, courtName, courtType, rowIndex, visibleColIndices, monthDays, getSummary, toggleResourceCell, isLight, renderResourceCell, handleGridDropMove, selectedSig }) {
	/** 由签名字符串还原 Set，仅 selectedSig 变化时才重建 */
	const selectedDateKeys = (0, react.useMemo)(() => selectedSig ? new Set(selectedSig.split("|")) : null, [selectedSig]);
	return /* @__PURE__ */ react.default.createElement(react.default.Fragment, null, /* @__PURE__ */ react.default.createElement("div", {
		className: `sticky left-0 z-30 flex h-full min-h-0 w-[132px] min-w-[132px] max-w-[132px] flex-col justify-center border-b px-2.5 py-1.5 shadow-[8px_0_16px_rgba(0,0,0,0.06)] ${isLight ? "surface-brand-side-muted" : "border-zinc-800 bg-[#1a1a22]"}`,
		style: {
			gridRow: rowIndex + 1,
			gridColumn: 1
		}
	}, renderResourceCell ? renderResourceCell({
		view: "resource",
		row: {
			kind: "court",
			id: courtId,
			name: courtName,
			type: courtType
		},
		isLight
	}) : /* @__PURE__ */ react.default.createElement("div", { className: "pisell-rb-cal-week-resource-name min-w-0 w-full font-semibold text-[16px] leading-tight" }, courtName)), visibleColIndices.map((ci) => {
		var _selectedDateKeys$has;
		const day = monthDays[ci];
		if (!day) return null;
		const key = require_bookingCalendarDateUtils.fmtDate(day);
		const summary = getSummary(courtId, key);
		return /* @__PURE__ */ react.default.createElement(ResourceCourtCell, {
			key: `${courtId}-${key}`,
			courtId,
			dateKey: key,
			rowIndex,
			colIndex: ci,
			summary,
			selected: (_selectedDateKeys$has = selectedDateKeys === null || selectedDateKeys === void 0 ? void 0 : selectedDateKeys.has(key)) !== null && _selectedDateKeys$has !== void 0 ? _selectedDateKeys$has : false,
			isLight,
			toggleResourceCell,
			handleGridDropMove
		});
	}));
});
const ResourceCourtCell = react.default.memo(function ResourceCourtCell({ courtId, dateKey, rowIndex, colIndex, summary, selected, isLight, toggleResourceCell, handleGridDropMove }) {
	return /* @__PURE__ */ react.default.createElement("button", {
		type: "button",
		onClick: () => toggleResourceCell(courtId, dateKey),
		onDragOver: (e) => e.preventDefault(),
		onDrop: (e) => {
			e.preventDefault();
			handleGridDropMove(dateKey, courtId);
		},
		style: {
			gridRow: rowIndex + 1,
			gridColumn: colIndex + 2,
			contain: "layout paint style"
		},
		className: `relative flex w-full min-h-0 flex-col justify-start border-b border-l p-1 text-left align-top outline-none ${isLight ? "theme-border" : "border-zinc-700"} ${summary.fullyBooked ? isLight ? "bg-slate-100 theme-text-faint" : "bg-zinc-800 text-zinc-500" : summary.hasBlock ? isLight ? "bg-red-50 border-red-200" : "bg-red-950/30 border-red-800/40" : summary.occupiedHours.length > 0 ? isLight ? "bg-violet-50" : "bg-[#1c1630]" : isLight ? "theme-grid-cell" : "bg-zinc-900"} ${selected ? isLight ? "ring-1 ring-inset ring-violet-400/75 bg-violet-400/10" : "ring-1 ring-inset ring-violet-400/70 bg-white/10" : ""}`
	}, summary.items.length === 0 ? /* @__PURE__ */ react.default.createElement("div", { className: `${require_bookingCalendarConstants.CALENDAR_EMPTY_DASHED_SLOT_CLASSNAME} text-center ${isLight ? "border-[#d8d0eb] text-[#8f86a9]" : "border-zinc-700 text-zinc-500"}` }, selected ? require_calendarI18n.tCal("pisell2.recordBoard.calendar.day.selected") : null) : null);
});
const OVERLAY_CELL_PAD = 4;
const OVERLAY_ITEM_GAP = 4;
const BookingOverlay = react.default.memo(function BookingOverlay({ visibleCourtRows, visibleColIndices, monthDays, rowPrefixTop, rowHeights, slotColWidth, virt, getSummary, isLight, renderMonthWeekBooking, openBookingDetail, setDraggingItem, handleGridDropMove, overflowPopover, setOverflowPopover, setOverflowListModal, overflowPanelRef }) {
	var _rowPrefixTop;
	/** 一次遍历可见区域，计算出所有 overlay item 的 px 位置 */
	const items = (0, react.useMemo)(() => {
		const out = [];
		for (let rowIdx = 0; rowIdx < visibleCourtRows.length; rowIdx += 1) {
			var _rowPrefixTop$rowIdx;
			if (virt.ready && (rowIdx < virt.r0 || rowIdx > virt.r1)) continue;
			const row = visibleCourtRows[rowIdx];
			if ((row === null || row === void 0 ? void 0 : row.kind) !== "court" || !row.id) continue;
			const courtId = String(row.id);
			const cellTop = (_rowPrefixTop$rowIdx = rowPrefixTop[rowIdx]) !== null && _rowPrefixTop$rowIdx !== void 0 ? _rowPrefixTop$rowIdx : 0;
			for (const colIdx of visibleColIndices) {
				const day = monthDays[colIdx];
				if (!day) continue;
				const dateKey = require_bookingCalendarDateUtils.fmtDate(day);
				const summary = getSummary(courtId, dateKey);
				if (summary.items.length === 0) continue;
				const cellLeft = colIdx * slotColWidth + 132;
				const previewItems = summary.items.slice(0, PREVIEW_CAP);
				const moreItems = summary.items.slice(PREVIEW_CAP);
				const moreCount = moreItems.length;
				const showMore = moreCount > 0 && previewItems.length > 0;
				const itemLeft = cellLeft + OVERLAY_CELL_PAD;
				const itemWidth = slotColWidth - OVERLAY_CELL_PAD * 2;
				for (let i = 0; i < previewItems.length; i += 1) {
					var _previewItems$i$id;
					const top = cellTop + OVERLAY_CELL_PAD + i * (48 + OVERLAY_ITEM_GAP);
					out.push({
						kind: "booking",
						key: `${courtId}\t${dateKey}\t${(_previewItems$i$id = previewItems[i].id) !== null && _previewItems$i$id !== void 0 ? _previewItems$i$id : i}`,
						item: previewItems[i],
						courtId,
						dateKey,
						top,
						left: itemLeft,
						width: itemWidth,
						height: 48
					});
				}
				if (showMore) {
					const top = cellTop + OVERLAY_CELL_PAD + previewItems.length * (48 + OVERLAY_ITEM_GAP);
					out.push({
						kind: "more",
						key: `${courtId}\t${dateKey}\tmore`,
						courtId,
						dateKey,
						top,
						left: itemLeft,
						width: itemWidth,
						moreItems,
						moreCount,
						allItems: summary.items
					});
				}
			}
		}
		return out;
	}, [
		visibleCourtRows,
		visibleColIndices,
		monthDays,
		rowPrefixTop,
		slotColWidth,
		virt,
		getSummary
	]);
	const overlayHeight = (_rowPrefixTop = rowPrefixTop[rowPrefixTop.length - 1]) !== null && _rowPrefixTop !== void 0 ? _rowPrefixTop : rowHeights.reduce((a, b) => a + b, 0);
	return /* @__PURE__ */ react.default.createElement("div", {
		"aria-hidden": true,
		style: {
			position: "absolute",
			top: 0,
			left: 0,
			width: "100%",
			height: overlayHeight,
			pointerEvents: "none",
			zIndex: 5
		}
	}, items.map((it) => {
		if (it.kind === "booking") {
			const layoutClassName = `flex flex-col justify-center rounded-lg px-2.5 py-1.5 text-xs text-left w-full h-full ${require_BookingCalendarStyle.getGridBookingRowStateClasses(it.item)}`;
			return /* @__PURE__ */ react.default.createElement("div", {
				key: it.key,
				style: {
					position: "absolute",
					top: it.top,
					left: it.left,
					width: it.width,
					height: it.height,
					pointerEvents: "auto"
				},
				onDragOver: (e) => e.preventDefault(),
				onDrop: (e) => {
					e.preventDefault();
					handleGridDropMove(it.dateKey, it.courtId);
				}
			}, renderMonthWeekBooking ? renderMonthWeekBooking({
				item: it.item,
				dateKey: it.dateKey,
				view: "resource",
				isLight,
				layoutClassName,
				onOpenDetail: openBookingDetail,
				onDragStart: (i) => setDraggingItem(i),
				draggable: false
			}) : /* @__PURE__ */ react.default.createElement("button", {
				type: "button",
				onClick: (e) => {
					e.stopPropagation();
					openBookingDetail(it.item);
				},
				className: layoutClassName
			}, /* @__PURE__ */ react.default.createElement("div", { className: "truncate" }, it.item.name), /* @__PURE__ */ react.default.createElement("div", { className: "mt-1 opacity-80 truncate" }, require_bookingCalendarDateUtils.formatHourLabel(it.item.startHour), " -", " ", require_bookingCalendarDateUtils.formatHourLabel(it.item.endHour))));
		}
		const isThisPopover = (overflowPopover === null || overflowPopover === void 0 ? void 0 : overflowPopover.courtId) === it.courtId && (overflowPopover === null || overflowPopover === void 0 ? void 0 : overflowPopover.date) === it.dateKey;
		return /* @__PURE__ */ react.default.createElement("div", {
			key: it.key,
			ref: isThisPopover ? overflowPanelRef : null,
			style: {
				position: "absolute",
				top: it.top,
				left: it.left,
				width: it.width,
				minHeight: 48,
				pointerEvents: "auto"
			}
		}, /* @__PURE__ */ react.default.createElement("button", {
			type: "button",
			onMouseEnter: (e) => {
				e.stopPropagation();
				setOverflowPopover({
					courtId: it.courtId,
					date: it.dateKey,
					items: it.moreItems,
					pinned: false
				});
			},
			onClick: (e) => {
				e.stopPropagation();
				setOverflowPopover(null);
				setOverflowListModal((prev) => prev && prev.scope === it.courtId && prev.date === it.dateKey ? null : {
					scope: it.courtId,
					date: it.dateKey,
					title: require_calendarI18n.tCal("pisell2.recordBoard.calendar.overflow.listTitleAllBookings", { date: it.dateKey }),
					items: it.allItems.filter((x) => x.kind === "booking")
				});
			},
			style: { minHeight: 48 },
			className: "flex w-full items-center justify-center rounded-xl bg-violet-700/90 px-2.5 py-1 text-xs font-semibold text-white"
		}, "+", it.moreCount));
	}));
});
//#endregion
exports.BookingCalendarResourceView = BookingCalendarResourceView;
