import PisellViewGrid from "../pisellViewGrid/index.js";
import Input from "../input/index.js";
import PisellEmpty from "../pisellEmpty/index.js";
import PisellAnchor from "../pisellAnchor/index.js";
import React, { useEffect, useMemo, useState } from "react";
import { SearchOutlined } from "@ant-design/icons";
import "./index.less";
//#region src/components/pisellList01/index.tsx
const PisellList01 = ({ showSearch, showCategory, placeholder, dataSource, renderItem, className, style, onChange, onSearch, isShowEmpty = true, description }) => {
	const [currentAnchor, setCurrentAnchor] = useState("");
	const [products, setProducts] = useState([]);
	useEffect(() => {
		if (!showCategory) return setProducts(dataSource !== null && dataSource !== void 0 ? dataSource : []);
		if (currentAnchor) {
			var _currentData$children;
			const currentData = dataSource === null || dataSource === void 0 ? void 0 : dataSource.find((item) => item.href === currentAnchor);
			setProducts((_currentData$children = currentData === null || currentData === void 0 ? void 0 : currentData.children) !== null && _currentData$children !== void 0 ? _currentData$children : []);
		}
	}, [
		currentAnchor,
		dataSource,
		showCategory
	]);
	useEffect(() => {
		var _dataSource$0$href, _dataSource$;
		setCurrentAnchor((_dataSource$0$href = dataSource === null || dataSource === void 0 || (_dataSource$ = dataSource[0]) === null || _dataSource$ === void 0 ? void 0 : _dataSource$.href) !== null && _dataSource$0$href !== void 0 ? _dataSource$0$href : "");
	}, [dataSource]);
	/**
	* @title: 分类标题
	* @description:
	* @param {*} useMemo
	* @return {*}
	* @Author: WangHan
	* @Date: 2025-01-13 16:21
	*/
	const categoryTitle = useMemo(() => {
		var _dataSource$find;
		return dataSource === null || dataSource === void 0 || (_dataSource$find = dataSource.find((item) => item.href === currentAnchor)) === null || _dataSource$find === void 0 ? void 0 : _dataSource$find.title;
	}, [currentAnchor, dataSource]);
	return /* @__PURE__ */ React.createElement("div", {
		className: `pisell-list-01 ${className}`,
		style
	}, showSearch ? /* @__PURE__ */ React.createElement("div", { className: "pisell-list-01-search" }, /* @__PURE__ */ React.createElement(Input, {
		placeholder: placeholder || "Search",
		prefix: /* @__PURE__ */ React.createElement(SearchOutlined, { style: { color: "#667085" } }),
		onChange: onSearch,
		allowClear: true,
		size: "large",
		className: "pisell-list-01-search-input"
	})) : null, showCategory ? /* @__PURE__ */ React.createElement("div", { className: "pisell-list-01-categories" }, /* @__PURE__ */ React.createElement(PisellAnchor, {
		items: dataSource,
		getCurrentAnchor: currentAnchor,
		onChange: (e) => {
			onChange === null || onChange === void 0 || onChange(e);
			setCurrentAnchor(e);
		}
	})) : null, /* @__PURE__ */ React.createElement("div", { className: `pisell-list-01-products ${!products.length && isShowEmpty ? "pisell-list-01-products-empty" : ""}` }, showCategory ? /* @__PURE__ */ React.createElement("div", { className: "pisell-list-01-products-title" }, categoryTitle) : null, products.length > 0 ? /* @__PURE__ */ React.createElement(PisellViewGrid, {
		dataSource: products,
		columns: 1,
		verticalGap: 16,
		renderItem
	}) : isShowEmpty ? /* @__PURE__ */ React.createElement(PisellEmpty, { description }) : null));
};
//#endregion
export { PisellList01 as default };
