import { _objectSpread2 } from "../../../../../_virtual/_@oxc-project_runtime@0.122.0/helpers/objectSpread2.js";
import { isMobile } from "../../../../../utils/platform.js";
import useGenGridProps from "./useGenGridProps.js";
import useGapSize from "./useGapSize.js";
import React, { useMemo } from "react";
import { Empty } from "antd";
import { FixedSizeGrid } from "react-window";
import AutoSizer from "react-virtualized-auto-sizer";
import "./index.less";
//#region src/components/table/Gallery/components/VirtualGrid/index.tsx
const Cell = (props) => {
	const { columnIndex, rowIndex, style, isScrolling, data } = props;
	const { renderItem, gap, columnCount, dataSource, paddingTop } = data;
	const dataIndex = useMemo(() => {
		return columnCount * rowIndex + columnIndex;
	}, [
		columnCount,
		rowIndex,
		columnIndex
	]);
	const { horizontal, vertical } = useGapSize(gap);
	const content = useMemo(() => {
		if (dataIndex >= dataSource.length) return null;
		return renderItem(dataSource[dataIndex], dataIndex);
	}, [
		dataSource,
		dataIndex,
		renderItem
	]);
	return /* @__PURE__ */ React.createElement("div", { style: _objectSpread2(_objectSpread2({}, style), {}, {
		left: ((style === null || style === void 0 ? void 0 : style.left) || 0) + columnIndex * horizontal,
		top: ((style === null || style === void 0 ? void 0 : style.top) || 0) + paddingTop,
		paddingBottom: vertical
	}) }, content);
};
const GridComponent = (props) => {
	const { dataSource, width, height, renderItem, gap, itemMaxWidth, itemMinWidth, rowHeight, paddingTop } = props;
	const { horizontal, vertical } = useGapSize(gap);
	const { columnCount, columnWidth, rowCount } = useGenGridProps({
		itemMinWidth,
		itemMaxWidth,
		width,
		dataSource,
		horizontal,
		vertical
	});
	const itemData = useMemo(() => {
		return {
			dataSource,
			renderItem,
			columnCount,
			gap,
			paddingTop
		};
	}, [
		dataSource,
		columnCount,
		gap,
		renderItem,
		paddingTop
	]);
	return /* @__PURE__ */ React.createElement(FixedSizeGrid, {
		className: isMobile() ? "pisell-lowcode-mobile-gallery" : "",
		columnCount,
		columnWidth,
		height,
		rowCount,
		rowHeight: rowHeight + vertical,
		width,
		itemData
	}, Cell);
};
const VirtualGrid = (props) => {
	const { dataSource, renderItem, gap, itemMinWidth, itemMaxWidth, rowHeight, paddingTop = 0 } = props;
	if (dataSource.length === 0) return /* @__PURE__ */ React.createElement(Empty, {
		style: { marginTop: 32 },
		image: Empty.PRESENTED_IMAGE_SIMPLE
	});
	return /* @__PURE__ */ React.createElement(AutoSizer, null, ({ height, width }) => /* @__PURE__ */ React.createElement(GridComponent, {
		paddingTop,
		rowHeight,
		itemMinWidth,
		itemMaxWidth,
		gap,
		width,
		height,
		dataSource,
		renderItem
	}));
};
//#endregion
export { VirtualGrid as default };
