const require_runtime = require("../../../../_virtual/_rolldown/runtime.js");
const require_objectSpread2 = require("../../../../_virtual/_@oxc-project_runtime@0.122.0/helpers/objectSpread2.js");
const require_index = require("../../../iconfont/index.js");
let react = require("react");
react = require_runtime.__toESM(react);
let antd = require("antd");
let classnames = require("classnames");
classnames = require_runtime.__toESM(classnames);
require("./index.less");
//#region src/components/PisellScrollView/components/Actions/index.tsx
/**
* 生成 indicator action 的 CSS 变量，允许通过 config 调整柔光尺寸与颜色。
*
* @example
* const style = getIndicatorStyle({ size: 24, color: 'rgba(255,255,255,.35)' });
*/
const getIndicatorStyle = (config) => ({
	"--pisell-scroll-view-actions-indicator-size": typeof (config === null || config === void 0 ? void 0 : config.size) === "number" ? `${config.size}px` : config === null || config === void 0 ? void 0 : config.size,
	"--pisell-scroll-view-actions-indicator-color": config === null || config === void 0 ? void 0 : config.color
});
/**
* ActionsContainer 根据 scrollActionsConfig 渲染滚动辅助操作。
*
* @example
* <ActionsContainer scrollActionsConfig={{ show: true, type: 'indicator' }} />
*/
const ActionsContainer = ({ containerRef, scrollState, overflow, scrollActionsConfig = { type: "backTop" }, onClick }) => {
	if (overflow !== "x" && overflow !== "y") return null;
	if (!scrollState.isOverflows) return null;
	if (!(scrollActionsConfig === null || scrollActionsConfig === void 0 ? void 0 : scrollActionsConfig.show) || !scrollActionsConfig) return null;
	if (scrollActionsConfig.type === "indicator") {
		var _scrollActionsConfig$, _scrollActionsConfig$2, _scrollActionsConfig$3, _scrollActionsConfig$4, _scrollActionsConfig$5, _scrollActionsConfig$6;
		const indicatorStyle = getIndicatorStyle(scrollActionsConfig.config);
		const verticalProgress = Math.max(0, Math.min(1, scrollState.percentY / 100));
		const horizontalProgress = Math.max(0, Math.min(1, scrollState.percentX / 100));
		return /* @__PURE__ */ react.default.createElement("div", {
			"aria-hidden": "true",
			className: (0, classnames.default)("pisell-scroll-view-actions-indicator", (_scrollActionsConfig$ = scrollActionsConfig.config) === null || _scrollActionsConfig$ === void 0 ? void 0 : _scrollActionsConfig$.className),
			style: require_objectSpread2._objectSpread2(require_objectSpread2._objectSpread2(require_objectSpread2._objectSpread2({}, indicatorStyle), scrollActionsConfig.style), (_scrollActionsConfig$2 = scrollActionsConfig.config) === null || _scrollActionsConfig$2 === void 0 ? void 0 : _scrollActionsConfig$2.style)
		}, overflow === "y" && !scrollState.isScrollToTop && /* @__PURE__ */ react.default.createElement("div", {
			className: "pisell-scroll-view-actions-indicator-item pisell-scroll-view-actions-indicator-item-top",
			style: require_objectSpread2._objectSpread2({ opacity: Math.max(.6, verticalProgress) }, (_scrollActionsConfig$3 = scrollActionsConfig.config) === null || _scrollActionsConfig$3 === void 0 ? void 0 : _scrollActionsConfig$3.topStyle),
			onClick: () => onClick("top")
		}, /* @__PURE__ */ react.default.createElement(require_index.default, {
			type: "pisell2-chevron-up",
			className: "pisell-scroll-view-actions-indicator-icon"
		})), overflow === "y" && !scrollState.isScrollToBottom && /* @__PURE__ */ react.default.createElement("div", {
			className: "pisell-scroll-view-actions-indicator-item pisell-scroll-view-actions-indicator-item-bottom",
			style: require_objectSpread2._objectSpread2({ opacity: Math.max(.6, 1 - verticalProgress * .4) }, (_scrollActionsConfig$4 = scrollActionsConfig.config) === null || _scrollActionsConfig$4 === void 0 ? void 0 : _scrollActionsConfig$4.bottomStyle),
			onClick: () => onClick("bottom")
		}, /* @__PURE__ */ react.default.createElement(require_index.default, {
			type: "pisell2-chevron-down",
			className: "pisell-scroll-view-actions-indicator-icon"
		})), overflow === "x" && !scrollState.isScrollToLeft && /* @__PURE__ */ react.default.createElement("div", {
			className: "pisell-scroll-view-actions-indicator-item pisell-scroll-view-actions-indicator-item-left",
			style: require_objectSpread2._objectSpread2({ opacity: Math.max(.6, horizontalProgress) }, (_scrollActionsConfig$5 = scrollActionsConfig.config) === null || _scrollActionsConfig$5 === void 0 ? void 0 : _scrollActionsConfig$5.leftStyle),
			onClick: () => onClick("left")
		}, /* @__PURE__ */ react.default.createElement(require_index.default, {
			type: "pisell2-chevron-left",
			className: "pisell-scroll-view-actions-indicator-icon"
		})), overflow === "x" && !scrollState.isScrollToRight && /* @__PURE__ */ react.default.createElement("div", {
			className: "pisell-scroll-view-actions-indicator-item pisell-scroll-view-actions-indicator-item-right",
			style: require_objectSpread2._objectSpread2({ opacity: Math.max(.6, 1 - horizontalProgress * .4) }, (_scrollActionsConfig$6 = scrollActionsConfig.config) === null || _scrollActionsConfig$6 === void 0 ? void 0 : _scrollActionsConfig$6.rightStyle),
			onClick: () => onClick("right")
		}, /* @__PURE__ */ react.default.createElement(require_index.default, {
			type: "pisell2-chevron-right",
			className: "pisell-scroll-view-actions-indicator-icon"
		})));
	}
	if (overflow === "y" && scrollActionsConfig.type === "backTop") return /* @__PURE__ */ react.default.createElement(antd.FloatButton.BackTop, require_objectSpread2._objectSpread2(require_objectSpread2._objectSpread2({
		target: () => containerRef.current || window,
		visibilityHeight: 300,
		icon: /* @__PURE__ */ react.default.createElement(require_index.default, { type: "pisell2-chevron-up" })
	}, scrollActionsConfig.config), {}, { style: require_objectSpread2._objectSpread2({ position: "absolute" }, scrollActionsConfig.style) }));
	if (overflow === "x" && scrollActionsConfig.type === "rArrows") return /* @__PURE__ */ react.default.createElement("div", {
		className: "pisell-scroll-view-actions-rArrows-container",
		style: scrollActionsConfig.style
	}, /* @__PURE__ */ react.default.createElement("div", require_objectSpread2._objectSpread2({
		className: (0, classnames.default)("pisell-scroll-view-actions-rArrows", "pisell-scroll-view-actions-rArrows-left", {
			"pisell-scroll-view-actions-rArrows-hidden": scrollState.isScrollToLeft,
			"pisell-scroll-view-actions-rArrows-show": !scrollState.isScrollToLeft
		}),
		onClick: () => onClick("left")
	}, scrollActionsConfig.config), /* @__PURE__ */ react.default.createElement(require_index.default, {
		type: "pisell2-chevron-left",
		className: (0, classnames.default)("pisell-scroll-view-actions-rArrows-icon", { "pisell-scroll-view-actions-rArrows-icon-hidden": scrollState.isScrollToLeft })
	})), /* @__PURE__ */ react.default.createElement("div", require_objectSpread2._objectSpread2({
		className: (0, classnames.default)("pisell-scroll-view-actions-rArrows", "pisell-scroll-view-actions-rArrows-right", {
			"pisell-scroll-view-actions-rArrows-hidden": scrollState.isScrollToRight,
			"pisell-scroll-view-actions-rArrows-show": !scrollState.isScrollToRight
		}),
		onClick: () => onClick("right")
	}, scrollActionsConfig.config), /* @__PURE__ */ react.default.createElement(require_index.default, {
		type: "pisell2-chevron-right",
		className: (0, classnames.default)("pisell-scroll-view-actions-rArrows-icon", { "pisell-scroll-view-actions-rArrows-icon-hidden": scrollState.isScrollToRight })
	})));
	if (overflow === "x" && scrollActionsConfig.type === "lrArrows") return /* @__PURE__ */ react.default.createElement(react.default.Fragment, null, /* @__PURE__ */ react.default.createElement("div", require_objectSpread2._objectSpread2({
		className: (0, classnames.default)("pisell-scroll-view-actions-lrArrows", "pisell-scroll-view-actions-lrArrows-left", {
			"pisell-scroll-view-actions-lrArrows-hidden": scrollState.isScrollToLeft,
			"pisell-scroll-view-actions-lrArrows-show": !scrollState.isScrollToLeft
		}),
		onClick: () => onClick("left")
	}, scrollActionsConfig.config), /* @__PURE__ */ react.default.createElement(require_index.default, {
		type: "pisell2-chevron-left",
		className: "pisell-scroll-view-actions-lrArrows-icon"
	})), /* @__PURE__ */ react.default.createElement("div", require_objectSpread2._objectSpread2({
		className: (0, classnames.default)("pisell-scroll-view-actions-lrArrows", "pisell-scroll-view-actions-lrArrows-right", {
			"pisell-scroll-view-actions-lrArrows-hidden": scrollState.isScrollToRight,
			"pisell-scroll-view-actions-lrArrows-show": !scrollState.isScrollToRight
		}),
		onClick: () => onClick("right")
	}, scrollActionsConfig.config), /* @__PURE__ */ react.default.createElement(require_index.default, {
		type: "pisell2-chevron-right",
		className: "pisell-scroll-view-actions-lrArrows-icon"
	})));
	if (overflow === "y" && scrollActionsConfig.type === "tbArrows") return /* @__PURE__ */ react.default.createElement(react.default.Fragment, null, /* @__PURE__ */ react.default.createElement("div", require_objectSpread2._objectSpread2({
		className: (0, classnames.default)("pisell-scroll-view-actions-tbArrows", "pisell-scroll-view-actions-tbArrows-top", {
			"pisell-scroll-view-actions-tbArrows-hidden": scrollState.isScrollToTop,
			"pisell-scroll-view-actions-tbArrows-show": !scrollState.isScrollToTop
		}),
		onClick: () => onClick("top")
	}, scrollActionsConfig.config), /* @__PURE__ */ react.default.createElement(require_index.default, {
		type: "pisell2-chevron-up",
		className: "pisell-scroll-view-actions-tbArrows-icon"
	})), /* @__PURE__ */ react.default.createElement("div", require_objectSpread2._objectSpread2({
		className: (0, classnames.default)("pisell-scroll-view-actions-tbArrows", "pisell-scroll-view-actions-tbArrows-bottom", {
			"pisell-scroll-view-actions-tbArrows-hidden": scrollState.isScrollToBottom,
			"pisell-scroll-view-actions-tbArrows-show": !scrollState.isScrollToBottom
		}),
		onClick: () => onClick("bottom")
	}, scrollActionsConfig.config), /* @__PURE__ */ react.default.createElement(require_index.default, {
		type: "pisell2-chevron-down",
		className: "pisell-scroll-view-actions-tbArrows-icon"
	})));
	return null;
};
//#endregion
exports.default = ActionsContainer;
