const require_runtime = require("../../../../_virtual/_rolldown/runtime.js");
const require_objectSpread2 = require("../../../../_virtual/_@oxc-project_runtime@0.122.0/helpers/objectSpread2.js");
const require_CardWrapper = require("./components/CardWrapper.js");
const require_PanelWrapper = require("./components/PanelWrapper.js");
const require_useMultilevelCardExpand = require("./hooks/useMultilevelCardExpand.js");
const require_useMultilevelCardHover = require("./hooks/useMultilevelCardHover.js");
let react = require("react");
react = require_runtime.__toESM(react);
let classnames = require("classnames");
classnames = require_runtime.__toESM(classnames);
let react_dom = require("react-dom");
react_dom = require_runtime.__toESM(react_dom);
require("./MultilevelCard.less");
//#region src/components/PisellCards/components/MultilevelCard/MultilevelCard.tsx
/**
* MultilevelCard 组件
* 多层级卡片组件，支持点击或 hover 展开次级面板
*
* @example
* ```tsx
* <MultilevelCard
*   card={<TextCard text="分类1" />}
*   panel={<div>次级内容</div>}
*   trigger="click"
* />
* ```
*/
const MultilevelCard = (props) => {
	const { card, panel, dataSource, active, disabled, loading, children, onClick, trigger = "click", hoverDelay, panelWidthMode = "full", panelWidth, panelStyle, panelClassName, panelContainer, animation = true, animationDuration = 300, onExpandChange, onPanelMount, onPanelUnmount, className, style, __designMode } = props;
	const { expanded, setExpanded } = require_useMultilevelCardExpand.useMultilevelCardExpand({
		active,
		trigger,
		onExpandChange
	});
	const { onMouseEnter, onMouseLeave } = require_useMultilevelCardHover.useMultilevelCardHover({
		enabled: trigger === "hover",
		delay: hoverDelay,
		onExpandChange: setExpanded
	});
	(0, react.useEffect)(() => {
		document.body.id = "body";
	}, []);
	const renderPanel = () => {
		if (!panel || !expanded) return null;
		const panelElement = /* @__PURE__ */ react.default.createElement(require_PanelWrapper.PanelWrapper, {
			visible: expanded,
			widthMode: panelWidthMode,
			width: panelWidth,
			style: panelStyle,
			className: panelClassName,
			animation,
			animationDuration,
			onMount: onPanelMount,
			onUnmount: onPanelUnmount,
			onMouseEnter: trigger === "hover" ? onMouseEnter : void 0,
			onMouseLeave: trigger === "hover" ? onMouseLeave : void 0,
			props
		}, panel === null || panel === void 0 ? void 0 : panel(props));
		if ((panelContainer === null || panelContainer === void 0 ? void 0 : panelContainer(props)) && typeof document !== "undefined") return react_dom.default.createPortal(panelElement, panelContainer(props));
		return panelElement;
	};
	const multilevelCardClassName = (0, classnames.default)("multilevel-card", {
		"multilevel-card--expanded": expanded,
		"multilevel-card--click": trigger === "click",
		"multilevel-card--hover": trigger === "hover"
	}, className);
	return /* @__PURE__ */ react.default.createElement("div", {
		className: multilevelCardClassName,
		style
	}, /* @__PURE__ */ react.default.createElement(require_CardWrapper.CardWrapper, {
		trigger,
		onMouseEnter,
		onMouseLeave,
		className: "multilevel-card__card"
	}, card === null || card === void 0 ? void 0 : card(props)), renderPanel());
};
MultilevelCard.displayName = "MultilevelCard";
const Provider = (props) => /* @__PURE__ */ react.default.createElement(MultilevelCard, require_objectSpread2._objectSpread2(require_objectSpread2._objectSpread2({}, props === null || props === void 0 ? void 0 : props.props), props));
//#endregion
exports.default = Provider;
