const require_runtime = require("../../../_virtual/_rolldown/runtime.js");
const require_index = require("../../../locales/index.js");
const require_objectSpread2 = require("../../../_virtual/_@oxc-project_runtime@0.122.0/helpers/objectSpread2.js");
let react = require("react");
react = require_runtime.__toESM(react);
let antd = require("antd");
let _ant_design_icons = require("@ant-design/icons");
let classnames = require("classnames");
classnames = require_runtime.__toESM(classnames);
let _pisell_icon_es_DotsSix = require("@pisell/icon/es/DotsSix");
_pisell_icon_es_DotsSix = require_runtime.__toESM(_pisell_icon_es_DotsSix);
let _dnd_kit_core = require("@dnd-kit/core");
let _dnd_kit_sortable = require("@dnd-kit/sortable");
let _dnd_kit_utilities = require("@dnd-kit/utilities");
let _dnd_kit_modifiers = require("@dnd-kit/modifiers");
require("./index.less");
//#region src/components/drag-sort-tree/TreeItem/index.tsx
const prefix = "pisell-lowcode";
const TreeItem = (props) => {
	const { id, item, depth, sensors, childrenProps, lists, expandedKeys, onChange } = props;
	const { attributes, listeners, setNodeRef, transform, transition, isDragging } = (0, _dnd_kit_sortable.useSortable)({ id });
	const [isMobile, setIsMobile] = (0, react.useState)(window.innerWidth < 600);
	const style = {
		transform: _dnd_kit_utilities.CSS.Transform.toString(transform && require_objectSpread2._objectSpread2(require_objectSpread2._objectSpread2({}, transform), {}, { scaleY: 1 })),
		transition,
		display: item.domHidden ? "none" : "block"
	};
	const rowKey = (0, react.useMemo)(() => {
		return (childrenProps === null || childrenProps === void 0 ? void 0 : childrenProps.rowKey) || "id";
	}, [childrenProps === null || childrenProps === void 0 ? void 0 : childrenProps.rowKey]);
	const handleDragEnd = (event) => {
		const { active, over } = event;
		if (!over || !active || !lists.length) return;
		try {
			var _active$id, _over$id;
			let [activeParentId, activeId] = active === null || active === void 0 || (_active$id = active.id) === null || _active$id === void 0 ? void 0 : _active$id.split("-");
			let [overParentId, overId] = over === null || over === void 0 || (_over$id = over.id) === null || _over$id === void 0 ? void 0 : _over$id.split("-");
			const parentIndex = lists.findIndex((item) => item[rowKey] == activeParentId);
			if (activeId !== overId && activeParentId === overParentId && parentIndex !== -1) {
				const activeIndex = item.children.findIndex((item) => item[rowKey] == activeId);
				const overIndex = item.children.findIndex((item) => item[rowKey] == overId);
				if (activeIndex !== -1 && overIndex !== -1) {
					var _lists$parentIndex;
					const newChildren = (0, _dnd_kit_sortable.arrayMove)((_lists$parentIndex = lists[parentIndex]) === null || _lists$parentIndex === void 0 ? void 0 : _lists$parentIndex.children, activeIndex, overIndex);
					const _lists = [
						...lists.slice(0, parentIndex),
						require_objectSpread2._objectSpread2(require_objectSpread2._objectSpread2({}, lists === null || lists === void 0 ? void 0 : lists[parentIndex]), {}, { children: newChildren }),
						...lists.slice(parentIndex + 1)
					];
					onChange && onChange([..._lists]);
				}
			}
		} catch (error) {}
	};
	/**
	* @title: 点击切换眼睛
	* @description:
	* @param {any} e
	* @return {*}
	* @Author: WangHan
	* @Date: 2024-07-19 22:43
	*/
	const handleShow = (e) => {
		e.stopPropagation();
		e.preventDefault();
		const index = lists === null || lists === void 0 ? void 0 : lists.findIndex((node) => node[rowKey] === item[rowKey]);
		if (index !== -1) {
			lists[index].show = !lists[index].show;
			onChange === null || onChange === void 0 || onChange([...lists]);
		}
	};
	const onSelect = () => {
		var _item$children;
		if (depth === 0 && ((_item$children = item.children) === null || _item$children === void 0 ? void 0 : _item$children.length)) {
			const key = item[rowKey];
			!(childrenProps === null || childrenProps === void 0) && childrenProps.onHiddenChange && (childrenProps === null || childrenProps === void 0 || childrenProps.onHiddenChange(key));
		}
	};
	const renderChildren = (0, react.useMemo)(() => {
		var _item$children2;
		const showChildren = (item === null || item === void 0 || (_item$children2 = item.children) === null || _item$children2 === void 0 ? void 0 : _item$children2.length) > 0 && (expandedKeys === null || expandedKeys === void 0 ? void 0 : expandedKeys.includes(item[rowKey]));
		const _isAvailableTab = (childrenProps === null || childrenProps === void 0 ? void 0 : childrenProps.tabKey) === "available";
		return showChildren && /* @__PURE__ */ react.default.createElement(_dnd_kit_sortable.SortableContext, {
			items: item.children.map((child) => `${item[rowKey]}-${child[rowKey]}`),
			strategy: _dnd_kit_sortable.verticalListSortingStrategy
		}, item.children.map((child) => _isAvailableTab && (child === null || child === void 0 ? void 0 : child.is_available) || !_isAvailableTab ? /* @__PURE__ */ react.default.createElement(TreeItem, {
			id: `${item[rowKey]}-${child[rowKey]}`,
			key: `${item[rowKey]}-${child[rowKey]}`,
			item: child,
			lists,
			depth: depth + 1,
			childrenProps
		}) : null));
	}, [
		item.children,
		expandedKeys,
		rowKey,
		lists,
		childrenProps === null || childrenProps === void 0 ? void 0 : childrenProps.tabKey,
		isDragging
	]);
	const rightIcon = (0, react.useMemo)(() => {
		return !(childrenProps === null || childrenProps === void 0 ? void 0 : childrenProps.hiddenRightIcon) ? /* @__PURE__ */ react.default.createElement("div", {
			className: (0, classnames.default)(`${prefix}-drag-sort-tree-icon`),
			onClick: handleShow
		}, item.show ? /* @__PURE__ */ react.default.createElement(_ant_design_icons.EyeOutlined, null) : /* @__PURE__ */ react.default.createElement(_ant_design_icons.EyeInvisibleOutlined, null)) : null;
	}, [
		childrenProps === null || childrenProps === void 0 ? void 0 : childrenProps.hiddenRightIcon,
		item === null || item === void 0 ? void 0 : item.show,
		lists
	]);
	const warningIcon = (0, react.useMemo)(() => {
		return !(childrenProps === null || childrenProps === void 0 ? void 0 : childrenProps.hiddenWarningIcon) && !(item === null || item === void 0 ? void 0 : item.is_available) ? /* @__PURE__ */ react.default.createElement("div", { className: (0, classnames.default)(`${prefix}-drag-sort-tree-item-icon`) }, /* @__PURE__ */ react.default.createElement(antd.Tooltip, {
			title: require_index.getText("drag-sort-tree-unavailable-today-tip"),
			color: "#ffffff",
			overlayInnerStyle: { color: "#344054" }
		}, /* @__PURE__ */ react.default.createElement(_ant_design_icons.WarningOutlined, { style: { color: "#FF2020" } }))) : null;
	}, [childrenProps === null || childrenProps === void 0 ? void 0 : childrenProps.hiddenWarningIcon, item === null || item === void 0 ? void 0 : item.is_available]);
	const handleWindowResize = () => {
		let windowWidth = window.innerWidth;
		setIsMobile(windowWidth < 600);
	};
	(0, react.useEffect)(() => {
		window.addEventListener("resize", handleWindowResize);
		return () => {
			window.removeEventListener("resize", handleWindowResize);
		};
	}, []);
	return /* @__PURE__ */ react.default.createElement(_dnd_kit_core.DndContext, {
		sensors,
		modifiers: [_dnd_kit_modifiers.restrictToVerticalAxis, _dnd_kit_modifiers.restrictToParentElement],
		onDragEnd: handleDragEnd
	}, /* @__PURE__ */ react.default.createElement("div", require_objectSpread2._objectSpread2(require_objectSpread2._objectSpread2({
		ref: setNodeRef,
		style
	}, attributes), !isMobile ? listeners : {}), /* @__PURE__ */ react.default.createElement("div", {
		className: (0, classnames.default)(`${prefix}-drag-sort-tree`, childrenProps === null || childrenProps === void 0 ? void 0 : childrenProps.className, isMobile ? `${prefix}-drag-sort-phone-tree` : ""),
		style: {
			paddingLeft: !depth ? "10px" : `${depth * 40}px`,
			cursor: isDragging ? "grabbing" : "grab"
		},
		onClick: onSelect
	}, /* @__PURE__ */ react.default.createElement("div", { className: (0, classnames.default)(`${prefix}-drag-sort-tree-item`) }, !(childrenProps === null || childrenProps === void 0 ? void 0 : childrenProps.hiddenDraggableIcon) ? /* @__PURE__ */ react.default.createElement(_pisell_icon_es_DotsSix.default, require_objectSpread2._objectSpread2(require_objectSpread2._objectSpread2({}, isMobile ? listeners : {}), {}, {
		className: (0, classnames.default)(`${prefix}-drag-sort-tree-item-dot-icon`),
		style: { left: isMobile ? !depth ? "-14px" : "12px" : 0 }
	})) : null, /* @__PURE__ */ react.default.createElement("div", { className: `${prefix}-drag-sort-tree-title` }, (childrenProps === null || childrenProps === void 0 ? void 0 : childrenProps.titleRender) || (item === null || item === void 0 ? void 0 : item.title))), !depth ? rightIcon : warningIcon), renderChildren));
};
//#endregion
exports.default = TreeItem;
