const require_runtime = require("../../_virtual/_rolldown/runtime.js");
const require_objectSpread2 = require("../../_virtual/_@oxc-project_runtime@0.122.0/helpers/objectSpread2.js");
const require_useEngineContext = require("../../hooks/useEngineContext.js");
const require_locales = require("./locales.js");
const require_Pagination = require("./components/Pagination/Pagination.js");
const require_EmptyState = require("./components/EmptyState/EmptyState.js");
const require_ScrollLoader = require("./components/ScrollLoader/ScrollLoader.js");
const require_WaterfallList = require("./components/WaterfallList/WaterfallList.js");
const require_ListItemSkeleton = require("./components/ListItemSkeleton/ListItemSkeleton.js");
const require_TabSkeleton = require("./components/TabSkeleton/TabSkeleton.js");
const require_useWaterfall = require("./hooks/useWaterfall.js");
const require_useListState = require("./hooks/useListState.js");
const require_index = require("./utils/index.js");
let react = require("react");
react = require_runtime.__toESM(react);
let antd = require("antd");
let _pisell_materials = require("@pisell/materials");
let classnames = require("classnames");
classnames = require_runtime.__toESM(classnames);
require("./List.less");
//#region src/components/list/List.tsx
const MOCK_LIST_DATA = (() => {
	const mockData = [];
	for (let i = 0; i < 8; i++) mockData.push({
		id: `_mock_${i}`,
		__isSkeleton: true
	});
	return mockData;
})();
const List = (props) => {
	const context = require_useEngineContext.default();
	const getCurrentLanguage = () => {
		var _context$appHelper, _context$appHelper$ge, _context$appHelper$ge2, _context$appHelper2;
		const appLocale = (_context$appHelper = context.appHelper) === null || _context$appHelper === void 0 || (_context$appHelper = _context$appHelper.utils) === null || _context$appHelper === void 0 || (_context$appHelper$ge = _context$appHelper.getApp) === null || _context$appHelper$ge === void 0 || (_context$appHelper$ge = _context$appHelper$ge.call(_context$appHelper)) === null || _context$appHelper$ge === void 0 || (_context$appHelper$ge = _context$appHelper$ge.locales) === null || _context$appHelper$ge === void 0 || (_context$appHelper$ge2 = _context$appHelper$ge.getLocale) === null || _context$appHelper$ge2 === void 0 ? void 0 : _context$appHelper$ge2.call(_context$appHelper$ge);
		const storageLocale = (_context$appHelper2 = context.appHelper) === null || _context$appHelper2 === void 0 || (_context$appHelper2 = _context$appHelper2.utils) === null || _context$appHelper2 === void 0 || (_context$appHelper2 = _context$appHelper2.storage) === null || _context$appHelper2 === void 0 ? void 0 : _context$appHelper2.get("umi_locale");
		let finalLang = appLocale || storageLocale;
		if (!finalLang && typeof window !== "undefined") finalLang = localStorage.getItem("umi_locale");
		return finalLang || "en";
	};
	const getLocalText = (key, fallback) => {
		var _listLocales;
		const localText = (_listLocales = require_locales.default[getCurrentLanguage()]) === null || _listLocales === void 0 ? void 0 : _listLocales[key];
		if (typeof localText === "string") return localText;
		return fallback || "";
	};
	const getLocalTextFunc = (key) => {
		var _listLocales2;
		const localText = (_listLocales2 = require_locales.default[getCurrentLanguage()]) === null || _listLocales2 === void 0 ? void 0 : _listLocales2[key];
		if (typeof localText === "function" || typeof localText === "string") return localText;
		return key;
	};
	const { className = "", style = {}, tabStyle = "anchor", tabGroup = getLocalText("pisell-list-tab-group-default", "字段"), displayStyle = "grid", width = "auto", height = "auto", paginationType = "all", defaultPageSize = 6, layoutDirection = "horizontal", zoom = 1, columns = 2, rows = 2, stickyTop = true, columnGap = 12, rowGap = 12, tabData = [], data = [], children, onLoadData, renderItem, emptyConfig = {
		show: true,
		text: getLocalText("pisell-list-empty-text-default", "No data available"),
		icon: null,
		description: ""
	}, pagination, loading = false, renderSearch } = props;
	console.log("List props", props);
	const tabItems = tabStyle === "none" ? [] : tabData || [];
	const { state: listState, actualCurrentPage: currentPage, handleTabChange, handlePageChange, handleShowSizeChange, handleLoadMore, handleViewLess, handleScrollLoad, setStickyActive: setIsStickyActive, setActiveTab } = require_useListState.useListState({
		externalCurrentPage: pagination === null || pagination === void 0 ? void 0 : pagination.current,
		tabItems,
		defaultPageSize,
		tabStyle,
		onLoadData
	});
	const { activeTab, isStickyActive } = listState;
	const listRef = (0, react.useRef)(null);
	const containerRef = (0, react.useRef)(null);
	const headerRef = (0, react.useRef)(null);
	const matchesFieldValue = (fieldValue, targetValue) => {
		if (Array.isArray(fieldValue)) return fieldValue.includes(targetValue);
		return fieldValue === targetValue;
	};
	const dataIdMap = (0, react.useMemo)(() => {
		return data.reduce((pre, cur) => {
			return require_objectSpread2._objectSpread2(require_objectSpread2._objectSpread2({}, pre), {}, { [cur.id]: cur });
		}, {});
	}, [data]);
	const processedData = (0, react.useMemo)(() => {
		const sourceData = loading ? MOCK_LIST_DATA : data || [];
		if (tabStyle === "anchor" && tabItems.length > 0) {
			const groupedData = [];
			const categoryTabs = tabItems.filter((tab) => tab.key !== "all");
			console.log(`categoryTabs: ${JSON.stringify(categoryTabs.map((t) => ({
				key: t.key,
				label: t.label,
				group: t.group
			})), null, 2)}`);
			categoryTabs.forEach((tab) => {
				console.log(`Processing tab: ${tab.key}, label: ${tab.label}, group: ${tab.group}`);
				let groupItems = [];
				if (tab.group) {
					const filterField = tabGroup && tabGroup !== "字段" ? tabGroup : "category";
					console.log(`Using group filter: ${filterField} matches ${tab.group}`);
					groupItems = sourceData.filter((item) => matchesFieldValue(item[filterField], tab.group));
					console.log(`Found ${groupItems.length} items for group ${tab.group}`);
				} else {
					const possibleFields = [
						tabGroup && tabGroup !== "字段" ? tabGroup : null,
						"category",
						"status",
						"type"
					].filter(Boolean);
					console.log(`Trying fields for tab.key ${tab.key}: ${JSON.stringify(possibleFields)}`);
					for (const field of possibleFields) if (field && sourceData.some((item) => item[field] === tab.key)) {
						groupItems = sourceData.filter((item) => item[field] === tab.key);
						console.log(`Found ${groupItems.length} items using field ${field} === ${tab.key}`);
						break;
					}
				}
				console.log(`Tab ${tab.key} final groupItems count: ${groupItems.length}`);
				groupedData.push({
					tabKey: tab.key,
					tabLabel: tab.label,
					items: groupItems
				});
				if (groupItems.length > 0) console.log(`Added group ${tab.key} to groupedData with ${groupItems.length} items`);
				else console.log(`Added empty group ${tab.key} to groupedData`);
			});
			console.log(`Anchor mode grouped data: ${JSON.stringify(groupedData.map((g) => ({
				key: g.tabKey,
				label: g.tabLabel,
				itemCount: g.items.length
			})), null, 2)}`);
			return groupedData;
		} else {
			let filteredData = sourceData;
			if (!activeTab || activeTab === "all") return [{
				tabKey: "all",
				tabLabel: "",
				items: filteredData
			}];
			if (Array.isArray(activeTab)) return [{
				tabKey: activeTab,
				tabLabel: "",
				items: require_index.findProductIdsByPath(tabItems, activeTab, 0).map((id) => dataIdMap[id])
			}];
			else {
				const currentTab = tabItems.find((tab) => tab.key === activeTab);
				if (currentTab && currentTab.group) {
					const filterField = "category";
					filteredData = filteredData.filter((item) => matchesFieldValue(item[filterField], currentTab.group));
				} else if (currentTab) {
					const possibleFields = [
						"category",
						"status",
						"type",
						tabGroup
					];
					for (const field of possibleFields) if (field && field !== "字段" && filteredData.some((item) => matchesFieldValue(item[field], activeTab))) {
						filteredData = filteredData.filter((item) => matchesFieldValue(item[field], activeTab));
						break;
					}
				}
				return [{
					tabKey: activeTab,
					tabLabel: (currentTab === null || currentTab === void 0 ? void 0 : currentTab.label) || "",
					items: filteredData
				}];
			}
		}
	}, [
		data,
		activeTab,
		tabItems,
		tabGroup,
		tabStyle,
		loading
	]);
	const totalDataLength = (0, react.useMemo)(() => {
		return processedData.reduce((total, group) => total + group.items.length, 0);
	}, [processedData]);
	const { layout: waterfallLayout, registerItemRef, recalculateLayout } = require_useWaterfall.default((0, react.useMemo)(() => {
		if (displayStyle !== "waterfall") return [];
		return processedData.reduce((allItems, group) => [...allItems, ...group.items], []);
	}, [displayStyle, processedData]), (0, react.useMemo)(() => {
		if (displayStyle !== "waterfall") return {
			tracks: 1,
			trackGap: 0,
			itemGap: 0,
			direction: "vertical"
		};
		return {
			tracks: layoutDirection === "vertical" ? columns : rows,
			trackGap: layoutDirection === "vertical" ? columnGap : rowGap,
			itemGap: layoutDirection === "vertical" ? rowGap : columnGap,
			direction: layoutDirection === "vertical" ? "vertical" : "horizontal"
		};
	}, [
		displayStyle,
		layoutDirection,
		columns,
		rows,
		columnGap,
		rowGap
	]));
	const handleScrollDown = () => {
		if (!listRef.current) return;
		const element = listRef.current;
		if (layoutDirection === "vertical") {
			const { scrollHeight, clientHeight } = element;
			const maxScroll = scrollHeight - clientHeight;
			element.scrollTo({
				top: maxScroll,
				behavior: "smooth"
			});
		} else {
			const { scrollWidth, clientWidth } = element;
			const maxScroll = scrollWidth - clientWidth;
			element.scrollTo({
				left: maxScroll,
				behavior: "smooth"
			});
		}
		setTimeout(() => {
			if (!listRef.current || loading || !hasMore) return;
			const element = listRef.current;
			let isAtEnd = false;
			if (layoutDirection === "vertical") {
				const { scrollTop, scrollHeight, clientHeight } = element;
				isAtEnd = scrollTop + clientHeight >= scrollHeight - 5;
			} else {
				const { scrollLeft, scrollWidth, clientWidth } = element;
				isAtEnd = scrollLeft + clientWidth >= scrollWidth - 5;
			}
			if (isAtEnd && hasMore) {
				console.log("List: Triggering load more after scroll to bottom");
				handleScrollLoad();
			}
		}, 500);
	};
	const hasMore = (0, react.useMemo)(() => {
		if (!pagination) return false;
		return (pagination.current || currentPage) < (pagination.total || 0);
	}, [pagination, currentPage]);
	const scrollLoadState = (0, react.useMemo)(() => {
		if (paginationType !== "scroll") return null;
		return {
			canLoadMore: hasMore,
			totalLoaded: totalDataLength
		};
	}, [
		paginationType,
		totalDataLength,
		hasMore
	]);
	(0, react.useEffect)(() => {
		if (paginationType !== "scroll") return;
		let scrollTimer = null;
		let lastScrollPosition = {
			top: 0,
			left: 0
		};
		const handleScroll = () => {
			if (!listRef.current || loading) return;
			if (scrollTimer) clearTimeout(scrollTimer);
			scrollTimer = setTimeout(() => {
				if (!listRef.current || loading || !hasMore) return;
				const element = listRef.current;
				const currentScrollTop = element.scrollTop;
				const currentScrollLeft = element.scrollLeft;
				let isNearEnd = false;
				let isScrollingTowardsEnd = false;
				if (layoutDirection === "vertical") {
					const { scrollTop, scrollHeight, clientHeight } = element;
					isScrollingTowardsEnd = currentScrollTop > lastScrollPosition.top;
					isNearEnd = scrollTop + clientHeight >= scrollHeight - 50;
				} else {
					const { scrollLeft, scrollWidth, clientWidth } = element;
					isScrollingTowardsEnd = currentScrollLeft > lastScrollPosition.left;
					isNearEnd = scrollLeft + clientWidth >= scrollWidth - 50;
				}
				lastScrollPosition = {
					top: currentScrollTop,
					left: currentScrollLeft
				};
				if (isScrollingTowardsEnd && isNearEnd && hasMore) handleScrollLoad();
			}, 100);
		};
		const listElement = listRef.current;
		if (listElement) {
			lastScrollPosition = {
				top: listElement.scrollTop,
				left: listElement.scrollLeft
			};
			listElement.addEventListener("scroll", handleScroll, { passive: true });
		}
		return () => {
			if (listElement) listElement.removeEventListener("scroll", handleScroll);
			if (scrollTimer) clearTimeout(scrollTimer);
		};
	}, [
		paginationType,
		layoutDirection,
		loading,
		hasMore,
		handleScrollLoad
	]);
	(0, react.useEffect)(() => {
		if (!stickyTop || layoutDirection !== "vertical") {
			if (isStickyActive) setIsStickyActive(false);
			return;
		}
		let handleScroll = null;
		const timer = setTimeout(() => {
			if (!containerRef.current || !headerRef.current) return;
			handleScroll = () => {
				if (!listRef.current || !headerRef.current) return;
				const shouldActivate = listRef.current.scrollTop > headerRef.current.offsetHeight / 2;
				if (isStickyActive !== shouldActivate) setIsStickyActive(shouldActivate);
			};
			const listContent = listRef.current;
			if (listContent) {
				listContent.addEventListener("scroll", handleScroll, { passive: true });
				handleScroll();
			}
		}, 0);
		return () => {
			clearTimeout(timer);
			if (handleScroll && listRef.current) listRef.current.removeEventListener("scroll", handleScroll);
		};
	}, [
		stickyTop,
		layoutDirection,
		isStickyActive
	]);
	(0, react.useEffect)(() => {
		if (paginationType !== "scroll" || loading || !hasMore || data.length === 0) return;
		let autoLoadTimer = null;
		const checkAutoLoad = () => {
			if (!listRef.current || loading || !hasMore) return;
			const element = listRef.current;
			let needsMoreContent = false;
			if (layoutDirection === "vertical") needsMoreContent = element.scrollHeight <= element.clientHeight;
			else needsMoreContent = element.scrollWidth <= element.clientWidth;
			if (needsMoreContent && hasMore) {
				console.log("List: Auto-loading more data due to insufficient content");
				handleScrollLoad();
			}
		};
		autoLoadTimer = setTimeout(() => {
			checkAutoLoad();
		}, 100);
		return () => {
			if (autoLoadTimer) clearTimeout(autoLoadTimer);
		};
	}, [
		paginationType,
		layoutDirection,
		loading,
		hasMore,
		totalDataLength,
		handleScrollLoad
	]);
	const containerStyle = (0, react.useMemo)(() => {
		const processedWidth = typeof width === "number" ? `${width}px` : typeof width === "string" && /^\d+(\.\d+)?$/.test(width.trim()) ? `${width}px` : width;
		const processedHeight = typeof height === "number" ? `${height}px` : typeof height === "string" && /^\d+(\.\d+)?$/.test(height.trim()) ? `${height}px` : height;
		return require_objectSpread2._objectSpread2(require_objectSpread2._objectSpread2({}, style), {}, {
			width: processedWidth,
			height: processedHeight,
			transform: `scale(${zoom})`,
			transformOrigin: "top left"
		});
	}, [
		style,
		width,
		height,
		zoom
	]);
	const listStyle = (0, react.useMemo)(() => {
		const baseStyle = {
			columnGap: `${columnGap}px`,
			rowGap: `${rowGap}px`
		};
		if (displayStyle === "grid") return require_objectSpread2._objectSpread2(require_objectSpread2._objectSpread2({}, baseStyle), {}, {
			display: "grid",
			gridTemplateColumns: `repeat(${columns}, 1fr)`
		});
		else return require_objectSpread2._objectSpread2(require_objectSpread2._objectSpread2({}, baseStyle), {}, {
			display: "flex",
			flexDirection: layoutDirection === "vertical" ? "row" : "row",
			alignItems: "flex-start",
			gap: layoutDirection === "vertical" ? `0 ${columnGap}px` : `${rowGap}px ${columnGap}px`,
			width: "100%"
		}, layoutDirection === "horizontal" && { flexWrap: "wrap" });
	}, [
		displayStyle,
		layoutDirection,
		columns,
		rows,
		columnGap,
		rowGap
	]);
	const scrollToTitle = (tabKey) => {
		const titleElement = document.getElementById(`list-title-${tabKey}`);
		if (titleElement && listRef.current) {
			const container = listRef.current;
			const titleOffsetTop = titleElement.offsetTop;
			container.scrollTo({
				top: titleOffsetTop - 20,
				behavior: "smooth"
			});
		}
	};
	const handleTabChangeWithScroll = (key) => {
		if (tabStyle === "anchor") {
			console.log("Anchor mode tab change:", key, "- skipping data load");
			setActiveTab(key);
			if (key === "all") setTimeout(() => {
				if (listRef.current) listRef.current.scrollTo({
					top: 0,
					behavior: "smooth"
				});
			}, 100);
			else setTimeout(() => {
				scrollToTitle(key);
			}, 100);
		} else {
			console.log("Non-anchor mode tab change:", key, "- triggering data load");
			handleTabChange(key);
		}
	};
	const renderTabs = () => {
		if (tabStyle === "none" || tabItems.length === 0) return null;
		const shouldSticky = layoutDirection === "vertical" && stickyTop;
		const headerClasses = (0, classnames.default)("pisell-list-header", {
			"pisell-list-header-sticky": shouldSticky,
			"sticky-active": shouldSticky && isStickyActive
		});
		if (loading) return /* @__PURE__ */ react.default.createElement("div", {
			ref: headerRef,
			className: headerClasses,
			style: { padding: "0 12px" }
		}, /* @__PURE__ */ react.default.createElement(require_TabSkeleton.default, { tabStyle }));
		return /* @__PURE__ */ react.default.createElement(react.default.Fragment, null, /* @__PURE__ */ react.default.createElement("div", { id: "level1-wrap" }), /* @__PURE__ */ react.default.createElement("div", {
			ref: headerRef,
			className: headerClasses
		}, /* @__PURE__ */ react.default.createElement(_pisell_materials.PisellTabbar, {
			levelConfig: {
				level1: { positionId: "#level1-wrap" },
				level2: { positionId: "#level2-wrap" }
			},
			style: { height: "100%" },
			dataSource: tabItems,
			value: activeTab,
			onChange: handleTabChangeWithScroll
		})));
	};
	const renderContent = (0, react.useCallback)(() => {
		const hasChildren = children && react.default.Children.count(children) > 0;
		const getContentHeight = () => {
			if (paginationType === "scroll") {
				if (height !== "auto") return;
				return "400px";
			}
			if (height !== "auto") return;
			return "auto";
		};
		const contentHeight = getContentHeight();
		return /* @__PURE__ */ react.default.createElement("div", {
			ref: listRef,
			className: (0, classnames.default)("list-content", `list-content-${displayStyle}`, `list-content-${layoutDirection}`),
			style: require_objectSpread2._objectSpread2(require_objectSpread2._objectSpread2({ background: "transparent" }, contentHeight !== void 0 && { height: contentHeight }), paginationType === "scroll" && { overflow: layoutDirection === "horizontal" ? "auto hidden" : "hidden auto" })
		}, renderSearch === null || renderSearch === void 0 ? void 0 : renderSearch(), layoutDirection === "vertical" && renderTabs(), totalDataLength === 0 && !loading ? /* @__PURE__ */ react.default.createElement(require_EmptyState.default, {
			config: emptyConfig,
			hasData: totalDataLength > 0
		}) : /* @__PURE__ */ react.default.createElement("div", {
			className: (0, classnames.default)("list-items"),
			style: require_objectSpread2._objectSpread2({}, layoutDirection === "vertical" && { padding: void 0 })
		}, displayStyle === "waterfall" ? /* @__PURE__ */ react.default.createElement(require_WaterfallList.default, {
			layout: waterfallLayout,
			layoutDirection,
			columnGap,
			rowGap,
			columns,
			rows,
			registerItemRef,
			renderItem
		}, children) : /* @__PURE__ */ react.default.createElement(react.default.Fragment, null, processedData.map((group, groupIndex) => /* @__PURE__ */ react.default.createElement(react.default.Fragment, { key: group.tabKey }, (tabStyle === "anchor" || processedData.length > 1) && group.tabLabel && /* @__PURE__ */ react.default.createElement("div", require_objectSpread2._objectSpread2(require_objectSpread2._objectSpread2({}, { id: `list-title-${group.tabKey}` }), {}, { className: "pisell-list-group-title" }), /* @__PURE__ */ react.default.createElement("h2", { className: "pisell-list-group-title-text" }, group.tabLabel)), /* @__PURE__ */ react.default.createElement("div", {
			className: (0, classnames.default)("list-group-items"),
			style: displayStyle === "grid" ? listStyle : void 0
		}, hasChildren ? group.items.map((item, itemIndex) => /* @__PURE__ */ react.default.createElement("div", {
			key: item.id || itemIndex,
			className: (0, classnames.default)("list-item")
		}, item.__isSkeleton ? /* @__PURE__ */ react.default.createElement(require_ListItemSkeleton.default, {
			displayStyle,
			showImage: true
		}) : react.default.Children.map(children, (child, childIndex) => {
			if ((0, react.isValidElement)(child)) return (0, react.cloneElement)(child, require_objectSpread2._objectSpread2(require_objectSpread2._objectSpread2({}, child.props), {}, {
				item,
				index: itemIndex,
				key: `${group.tabKey}-${item.id || itemIndex}-${childIndex}`
			}));
			return child;
		}))) : group.items.map((item, itemIndex) => /* @__PURE__ */ react.default.createElement("div", {
			key: item.id || itemIndex,
			className: (0, classnames.default)("list-item")
		}, item.__isSkeleton ? /* @__PURE__ */ react.default.createElement(require_ListItemSkeleton.default, {
			displayStyle,
			showImage: true
		}) : renderItem ? renderItem(item, itemIndex) : /* @__PURE__ */ react.default.createElement("div", { className: (0, classnames.default)("default-item") }, typeof item === "object" ? JSON.stringify(item) : item))))))), /* @__PURE__ */ react.default.createElement(require_ScrollLoader.default, {
			loading,
			scrollLoadState,
			layoutDirection,
			paginationType
		})));
	}, [
		displayStyle,
		layoutDirection,
		paginationType,
		listStyle,
		processedData,
		renderItem,
		loading,
		children,
		height,
		scrollLoadState,
		emptyConfig,
		totalDataLength,
		tabStyle,
		renderSearch
	]);
	const renderFooter = () => {
		if (paginationType === "all" || paginationType === "scroll") return null;
		if (paginationType === "more") {
			if (hasMore) return /* @__PURE__ */ react.default.createElement("div", { className: (0, classnames.default)("list-footer") }, /* @__PURE__ */ react.default.createElement(antd.Button, {
				onClick: handleLoadMore,
				loading
			}, getLocalText("pisell-list-load-more", "查看更多")));
			else if (currentPage > 1) return /* @__PURE__ */ react.default.createElement("div", { className: (0, classnames.default)("list-footer") }, /* @__PURE__ */ react.default.createElement(antd.Button, {
				onClick: handleViewLess,
				className: (0, classnames.default)("view-less-btn")
			}, getLocalText("pisell-list-view-less", "查看更少")));
			return null;
		}
		if (paginationType === "pager") {
			var _pagination$totalCoun;
			const total = (_pagination$totalCoun = pagination === null || pagination === void 0 ? void 0 : pagination.totalCount) !== null && _pagination$totalCoun !== void 0 ? _pagination$totalCoun : totalDataLength;
			const showTotal = (total, range) => {
				const totalFunc = getLocalTextFunc("pisell-list-pagination-total");
				if (typeof totalFunc === "function") return totalFunc(range[0], range[1], total);
				const fallbackFunc = getLocalTextFunc("pisell-list-pagination-total-fallback");
				if (typeof fallbackFunc === "function") return fallbackFunc(range[0], range[1], total);
				return `显示第 ${range[0]}-${range[1]} 条，共 ${total} 条`;
			};
			return /* @__PURE__ */ react.default.createElement("div", { className: (0, classnames.default)("list-footer") }, /* @__PURE__ */ react.default.createElement(require_Pagination.default, {
				current: currentPage,
				pageSize: defaultPageSize,
				total,
				totalPages: pagination === null || pagination === void 0 ? void 0 : pagination.total,
				onChange: handlePageChange,
				onShowSizeChange: handleShowSizeChange,
				showTotal,
				showSizeChanger: true,
				pageSizeOptions: [
					"6",
					"10",
					"20",
					"50"
				]
			}));
		}
		return null;
	};
	const renderScrollButton = () => {
		if (paginationType !== "scroll" || totalDataLength === 0) return null;
		return /* @__PURE__ */ react.default.createElement("div", { className: (0, classnames.default)("list-scroll-float-button") }, /* @__PURE__ */ react.default.createElement("button", {
			className: (0, classnames.default)("scroll-down-button"),
			onClick: handleScrollDown,
			title: layoutDirection === "vertical" ? getLocalText("pisell-list-scroll-to-bottom", "滚动到底部并加载更多") : getLocalText("pisell-list-scroll-to-end", "滚动到末尾并加载更多"),
			style: require_objectSpread2._objectSpread2(require_objectSpread2._objectSpread2({
				padding: "16px",
				position: "absolute",
				background: "rgba(255, 255, 255, 0.75)",
				boxShadow: "0px 4px 6px -2px rgba(16, 24, 40, 0.03)",
				borderRadius: "100px",
				outline: "1px #D0D5DD solid",
				outlineOffset: "-1px",
				backdropFilter: "blur(6px)",
				flexDirection: "column",
				justifyContent: "flex-start",
				alignItems: "flex-start",
				gap: "16px",
				display: "inline-flex",
				cursor: "pointer"
			}, layoutDirection === "horizontal" ? {
				right: "20px",
				top: "50%",
				transform: "translateY(-50%)"
			} : {
				left: "50%",
				bottom: "20px",
				transform: "translateX(-50%)"
			}), {}, {
				zIndex: 1e3,
				border: "none"
			})
		}, /* @__PURE__ */ react.default.createElement("div", { style: {
			width: "32px",
			height: "32px",
			display: "flex",
			alignItems: "center",
			justifyContent: "center"
		} }, /* @__PURE__ */ react.default.createElement(_pisell_materials.Iconfont, {
			type: layoutDirection === "horizontal" ? "pisell2-chevron-right" : "pisell2-chevron-down",
			style: {
				fontSize: "20px",
				color: "#101828"
			}
		}))));
	};
	const containerClassName = (0, classnames.default)("pisell-list", className, `pisell-list-${layoutDirection}`, { "pisell-list-sticky-enabled": layoutDirection === "vertical" && stickyTop });
	const finalContainerStyle = require_objectSpread2._objectSpread2(require_objectSpread2._objectSpread2(require_objectSpread2._objectSpread2({}, containerStyle), {}, { position: "relative" }, layoutDirection === "vertical" && height !== "auto" && { overflowY: "hidden" }), layoutDirection === "horizontal" && {
		display: "flex",
		flexDirection: "row"
	});
	const renderMainContent = () => {
		if (layoutDirection === "vertical") return renderContent();
		else return /* @__PURE__ */ react.default.createElement(react.default.Fragment, null, renderContent(), renderTabs());
	};
	return /* @__PURE__ */ react.default.createElement("div", {
		ref: containerRef,
		className: containerClassName,
		style: finalContainerStyle
	}, renderMainContent(), renderFooter(), renderScrollButton());
};
//#endregion
exports.default = List;
