const require_runtime = require("../../_virtual/_rolldown/runtime.js");
const require_objectSpread2 = require("../../_virtual/_@oxc-project_runtime@0.122.0/helpers/objectSpread2.js");
const require_constants = require("./constants.js");
const require_TabbarLevel = require("./components/TabbarLevel.js");
const require_useActiveKey = require("./hooks/useActiveKey.js");
const require_useExpand = require("./hooks/useExpand.js");
const require_index = require("./utils/index.js");
const require_mock = require("./mock.js");
let react = require("react");
react = require_runtime.__toESM(react);
let classnames = require("classnames");
classnames = require_runtime.__toESM(classnames);
require("./PisellTabbar.less");
//#region src/components/PisellTabbar2/PisellTabbar.tsx
/**
* PisellTabbar - 多层级 Tabbar 组件
*
* 支持最多 3 层级的 Tab 导航，每层级可独立展开/收起
*
* @component
* @example
* ```tsx
* <PisellTabbar
*   dataSource={categoryData}
*   value={[1, 10, 100]}
*   onChange={(value) => console.log('当前选中:', value)}
* />
* ```
*/
const PisellTabbar = (props) => {
	const { dataSource = (props === null || props === void 0 ? void 0 : props.__designMode) ? require_mock.default : require_mock.default, value, onChange, className, style, levelConfig: customLevelConfig, expandConfig, maxLevel = 3 } = props;
	const { setActiveKey, getActiveKey, _setActiveKey, panelVisible, activeKey } = require_useActiveKey.default({
		initialActiveKey: value || require_index.getDefaultActiveKey(dataSource, "id"),
		onChange
	});
	const { expand, toggleExpand, getExpand } = require_useExpand.default();
	console.log("panelVisiblepanelVisible", panelVisible);
	/**
	* 同步外部 value 到内部状态
	*/
	(0, react.useEffect)(() => {
		if (value) _setActiveKey(value);
	}, [JSON.stringify(value)]);
	/**
	* 获取层级配置
	*/
	const getLevelConfig = (0, react.useCallback)((level) => {
		return require_objectSpread2._objectSpread2(require_objectSpread2._objectSpread2({}, require_constants.DEFAULT_LEVEL_CONFIG[level]), customLevelConfig === null || customLevelConfig === void 0 ? void 0 : customLevelConfig[level]);
	}, [customLevelConfig]);
	/**
	* 处理一级 Tab 切换
	*/
	const handleLevel1Change = (0, react.useCallback)((key, item) => {
		if (item.childrenMaxLevel !== void 0 && item.childrenMaxLevel < 2) setActiveKey(0, key, 0);
		else {
			var _item$children, _item$children$;
			setActiveKey(0, key, (item === null || item === void 0 || (_item$children = item.children) === null || _item$children === void 0 ? void 0 : _item$children.length) ? item === null || item === void 0 || (_item$children$ = item.children[0]) === null || _item$children$ === void 0 ? void 0 : _item$children$.id : void 0);
		}
	}, [setActiveKey]);
	/**
	* 处理二级 Tab 切换
	*/
	const handleLevel2Change = (0, react.useCallback)((key, item) => {
		var _item$children2;
		setActiveKey(1, key, (item === null || item === void 0 || (_item$children2 = item.children) === null || _item$children2 === void 0 ? void 0 : _item$children2.length) ? 0 : void 0);
	}, [setActiveKey]);
	/**
	* 处理三级 Tab 切换
	*/
	const handleLevel3Change = (0, react.useCallback)((key) => {
		setActiveKey(2, key);
	}, [setActiveKey]);
	/**
	* 渲染一级 Tabbar
	*/
	const level1DataSource = (0, react.useMemo)(() => require_index.addDataSourceItemsByKey(dataSource, require_constants.LEVEL_ADD_ITEMS.level1), [dataSource]);
	/**
	* 渲染二级 Tabbar
	*/
	const renderLevel2 = (0, react.useCallback)((panelProps) => {
		if (maxLevel < 2) return null;
		if ((panelProps.dataSource.childrenMaxLevel || 2) < 2) return renderLevel3(panelProps, true);
		let _dataSource = panelProps.dataSource.children || [];
		if (_dataSource.length) _dataSource = require_index.addDataSourceItemsByKey(_dataSource, require_constants.LEVEL_ADD_ITEMS.level2);
		return /* @__PURE__ */ react.default.createElement(require_TabbarLevel.default, {
			skuId: `sku-list-tabbar-${panelProps.dataSource.id}`,
			dataSource: _dataSource,
			activePanelKey: getActiveKey(1),
			level: "level2",
			setActivePanelKey: handleLevel2Change,
			expand: getExpand("level2"),
			handleExpand: () => toggleExpand("level2"),
			renderChildren: renderLevel3,
			levelConfig: getLevelConfig("level2"),
			expandConfig,
			positionId: getLevelConfig("level2").positionId,
			superTabsProps: {
				className: "pisell-tabbar-level-2",
				style: { width: "104px" },
				gridProps: {
					direction: "vertical",
					style: { padding: "16px 4px" },
					gap: 12
				},
				startSlot: null,
				scrollViewProps: {
					overflow: "y",
					width: "100%",
					height: "100%",
					style: { padding: 0 },
					scrollActionsConfig: {
						type: "tbArrows",
						show: true
					}
				}
			}
		});
	}, [
		maxLevel,
		getActiveKey,
		handleLevel2Change,
		getExpand,
		toggleExpand,
		getLevelConfig,
		expandConfig
	]);
	/**
	* 渲染三级 Tabbar
	*/
	const renderLevel3 = (0, react.useCallback)((panelProps2, isLevel2) => {
		if (maxLevel < 3) return null;
		let _dataSource2 = panelProps2.dataSource.children || [];
		if (_dataSource2.length) _dataSource2 = require_index.addDataSourceItemsByKey(_dataSource2, require_constants.LEVEL_ADD_ITEMS.level3);
		return /* @__PURE__ */ react.default.createElement(require_TabbarLevel.default, {
			skuId: `sku-list-tabbar-${panelProps2.dataSource.id}`,
			dataSource: _dataSource2,
			activePanelKey: getActiveKey(isLevel2 ? 1 : 2),
			level: "level3",
			setActivePanelKey: isLevel2 ? handleLevel2Change : handleLevel3Change,
			expand: getExpand(isLevel2 ? "level2" : "level3"),
			handleExpand: () => toggleExpand(isLevel2 ? "level2" : "level3"),
			levelConfig: getLevelConfig("level3"),
			expandConfig,
			positionId: getLevelConfig(isLevel2 ? "level2" : "level3").positionId
		});
	}, [
		maxLevel,
		getActiveKey,
		handleLevel3Change,
		getExpand,
		toggleExpand,
		getLevelConfig,
		expandConfig
	]);
	(0, react.useEffect)(() => {
		document.body.id = "body";
	}, []);
	console.log("activeKeyactiveKey", activeKey);
	return dataSource.length ? /* @__PURE__ */ react.default.createElement("div", {
		className: (0, classnames.default)("pisell-tabbar2", className),
		style
	}, /* @__PURE__ */ react.default.createElement(require_TabbarLevel.default, {
		skuId: "sku-list-tabbar",
		dataSource: level1DataSource,
		activePanelKey: getActiveKey(0),
		level: "level1",
		setActivePanelKey: handleLevel1Change,
		expand: getExpand("level1"),
		handleExpand: () => toggleExpand("level1"),
		renderChildren: renderLevel2,
		levelConfig: getLevelConfig("level1"),
		expandConfig,
		superTabsProps: {
			gridProps: {
				direction: "vertical",
				style: { padding: "16px 4px" },
				gap: 12
			},
			panelStyle: {
				position: "absolute",
				top: 40,
				right: 0,
				height: "calc(100% - 40px)",
				transition: "0.3s ease-in-out"
			},
			startSlot: null,
			scrollViewProps: {
				overflow: "y",
				width: "100%",
				height: "100%",
				style: { padding: 0 },
				scrollActionsConfig: {
					type: "tbArrows",
					show: true
				}
			}
		},
		positionId: getLevelConfig("level1").positionId,
		level2PositionId: getLevelConfig("level2").positionId,
		panelVisible
	})) : null;
};
PisellTabbar.displayName = "PisellTabbar";
PisellTabbar.getDefaultActiveKey = require_index.getDefaultActiveKey;
//#endregion
exports.default = PisellTabbar;
