const require_runtime = require("../../../_virtual/_rolldown/runtime.js");
const require_objectSpread2 = require("../../../_virtual/_@oxc-project_runtime@0.122.0/helpers/objectSpread2.js");
const require_objectWithoutProperties = require("../../../_virtual/_@oxc-project_runtime@0.122.0/helpers/objectWithoutProperties.js");
let react = require("react");
react = require_runtime.__toESM(react);
//#region src/plus/productSelect/ProductList/gridComponents.tsx
const _excluded = ["children"], _excluded2 = [
	"children",
	"index",
	"item"
];
const parseGridConfig = (config) => {
	return config.split(":").map((num) => parseInt(num, 10)).filter((num) => !isNaN(num));
};
const calculateColumnWidth = (columns, index) => {
	const total = columns.reduce((sum, col) => sum + col, 0);
	return `${columns[index] / total * 100}%`;
};
const createGridComponents = (layout, { tabSwitchMode = "anchor", gap = 12 } = {}) => {
	if (!layout) layout = GRID_LAYOUTS.SINGLE_COLUMN;
	const columns = parseGridConfig(layout.config);
	const isGrid = layout.grid && columns.length > 1;
	const GridListComponent = (0, react.memo)((_ref) => {
		let { children } = _ref, props = require_objectWithoutProperties._objectWithoutProperties(_ref, _excluded);
		if (!isGrid) return /* @__PURE__ */ react.default.createElement("div", require_objectSpread2._objectSpread2({
			className: "product-list-wrapper",
			style: {
				display: "flex",
				flexDirection: "column",
				gap
			}
		}, props), children);
		return /* @__PURE__ */ react.default.createElement("div", require_objectSpread2._objectSpread2({
			className: "product-grid-wrapper",
			style: require_objectSpread2._objectSpread2({
				display: "flex",
				flexWrap: "wrap",
				gap
			}, props.style)
		}, props), children);
	});
	/**
	* @title: 网格项组件
	* @description:
	*   - anchor模式：分类项带有锚点id用于滚动定位
	*   - switch模式：分类项不渲染（已在上层过滤，这里做兜底处理）
	*/
	const GridItemComponent = (0, react.memo)((_ref2) => {
		let { children, index, item } = _ref2, props = require_objectWithoutProperties._objectWithoutProperties(_ref2, _excluded2);
		if (!isGrid) {
			if (item && item.__typename === "category") {
				if (tabSwitchMode === "switch") return null;
				return /* @__PURE__ */ react.default.createElement("div", require_objectSpread2._objectSpread2({ id: `ps_category_${item.id}` }, props), children);
			}
			return /* @__PURE__ */ react.default.createElement("div", props, children);
		}
		if (item && item.__typename === "category") {
			if (tabSwitchMode === "switch") return null;
			return /* @__PURE__ */ react.default.createElement("div", require_objectSpread2._objectSpread2({
				id: `ps_category_${item.id}`,
				style: require_objectSpread2._objectSpread2({
					width: "100%",
					flexShrink: 0
				}, props.style)
			}, props), children);
		}
		const width = calculateColumnWidth(columns, index % columns.length);
		return /* @__PURE__ */ react.default.createElement("div", require_objectSpread2._objectSpread2({ style: require_objectSpread2._objectSpread2({
			width: `calc(${width} - ${(columns.length - 1) * gap / columns.length}px)`,
			flexShrink: 0
		}, props.style) }, props), children);
	});
	GridListComponent.displayName = `GridListComponent_${layout.config}`;
	GridItemComponent.displayName = `GridItemComponent_${layout.config}`;
	return {
		List: GridListComponent,
		Item: GridItemComponent
	};
};
const GRID_LAYOUTS = {
	SINGLE_COLUMN: {
		grid: false,
		config: "12"
	},
	TWO_COLUMNS: {
		grid: true,
		config: "12:12"
	},
	THREE_COLUMNS: {
		grid: true,
		config: "8:8:8"
	},
	FOUR_COLUMNS: {
		grid: true,
		config: "6:6:6:6"
	},
	UNEQUAL_TWO: {
		grid: true,
		config: "8:16"
	},
	UNEQUAL_THREE: {
		grid: true,
		config: "6:12:6"
	}
};
//#endregion
exports.GRID_LAYOUTS = GRID_LAYOUTS;
exports.createGridComponents = createGridComponents;
