import { getText } from "../../locales/index.js";
import { isMobile } from "../../utils/platform.js";
import InlineMenu from "./components/InlineMenu/index.js";
import React, { useCallback, useMemo, useState } from "react";
import { Button, Dropdown, Popover } from "antd";
import { CheckOutlined } from "@ant-design/icons";
import classNames from "classnames";
import { flushSync } from "react-dom";
import SwitchVertical01 from "@pisell/icon/es/SwitchVertical01";
import "./index.less";
//#region src/components/sort/index.tsx
const prefix = "pisell-lowcode-";
/** 二级项 key 必含 `:asc` / `:desc`；点一级仅展开子菜单时不应触发排序回调，否则会写入半套 sort 并触发重绘，下拉子菜单会闪一下 */
function isSortLeafMenuKey(key) {
	const s = key == null ? "" : String(key);
	return /:(asc|desc)(:|$)/.test(s);
}
const Label = ({ content }) => {
	return /* @__PURE__ */ React.createElement("div", { className: `${prefix}sort-menu-item-label` }, /* @__PURE__ */ React.createElement("span", null, content), /* @__PURE__ */ React.createElement(CheckOutlined, null));
};
const sortChildrenMap = {
	date: (key, isLocal) => [{
		key: `${key}:asc${isLocal ? ":date" : ""}`,
		label: /* @__PURE__ */ React.createElement(Label, { content: getText("sort-oldest-to-newest") })
	}, {
		key: `${key}:desc${isLocal ? ":date" : ""}`,
		label: /* @__PURE__ */ React.createElement(Label, { content: getText("sort-newest-to-oldest") })
	}],
	time: (key, isLocal) => [{
		key: `${key}:desc${isLocal ? ":time" : ""}`,
		label: /* @__PURE__ */ React.createElement(Label, { content: getText("sort-from-morning-to-night") })
	}, {
		key: `${key}:asc${isLocal ? ":time" : ""}`,
		label: /* @__PURE__ */ React.createElement(Label, { content: getText("sort-from-evening-to-morning") })
	}],
	string: (key, isLocal) => [{
		key: `${key}:asc${isLocal ? ":string" : ""}`,
		label: /* @__PURE__ */ React.createElement(Label, { content: getText("sort-a-z") })
	}, {
		key: `${key}:desc${isLocal ? ":string" : ""}`,
		label: /* @__PURE__ */ React.createElement(Label, { content: getText("sort-z-a") })
	}],
	number: (key, isLocal) => [{
		key: `${key}:asc${isLocal ? ":number" : ""}`,
		label: /* @__PURE__ */ React.createElement(Label, { content: getText("sort-0-9") })
	}, {
		key: `${key}:desc${isLocal ? ":number" : ""}`,
		label: /* @__PURE__ */ React.createElement(Label, { content: getText("sort-9-0") })
	}],
	option: (key, isLocal) => [{
		key: `${key}:asc${isLocal ? ":option" : ""}`,
		label: /* @__PURE__ */ React.createElement(Label, { content: getText("sort-first-last") })
	}, {
		key: `${key}:desc${isLocal ? ":option" : ""}`,
		label: /* @__PURE__ */ React.createElement(Label, { content: getText("sort-last-first") })
	}]
};
const Sort = ({ list = [], onChange, button, style, value, placement, localPagination }) => {
	const [dropdownOpen, setDropdownOpen] = useState(false);
	const sortItems = useMemo(() => {
		return list.map((d) => {
			const children = d.getSortItems ? d.getSortItems(d.name).map(({ key, label }) => ({
				key,
				label: /* @__PURE__ */ React.createElement(Label, { content: label })
			})) : sortChildrenMap[d.type](d.name, !!(d === null || d === void 0 ? void 0 : d.localFilter));
			return {
				key: d.name,
				label: d.label,
				children,
				popupClassName: `${prefix}sort-sub-menu-popup-wrap ${prefix}dropdown-css-var`,
				className: `${d.isHidden ? `${prefix}sort-menu-wrap-hide` : ""}`
			};
		});
	}, [list, localPagination]);
	const onMenuClick = useCallback((detail) => {
		var _detail$keyPath;
		const leaf = (_detail$keyPath = detail.keyPath) === null || _detail$keyPath === void 0 ? void 0 : _detail$keyPath[0];
		if (!isSortLeafMenuKey(leaf)) return;
		const leafStr = String(leaf);
		/** 先同步收起浮层再通知上层，避免 sort 更新导致 Menu 重绘与关窗动画叠在一起出现「闪两下」 */
		flushSync(() => {
			setDropdownOpen(false);
		});
		if (leafStr === value) {
			onChange === null || onChange === void 0 || onChange("", detail);
			return;
		}
		onChange === null || onChange === void 0 || onChange(leafStr, detail);
	}, [value, onChange]);
	const dropdownMenu = useMemo(() => ({
		items: sortItems,
		onClick: onMenuClick,
		selectable: true,
		selectedKeys: value != null && value !== "" ? [value] : []
	}), [
		sortItems,
		onMenuClick,
		value
	]);
	const isMobileBool = isMobile();
	const btnContent = useMemo(() => {
		return button || /* @__PURE__ */ React.createElement(Button, {
			icon: /* @__PURE__ */ React.createElement(SwitchVertical01, null),
			style,
			className: classNames({ [`${prefix}sort-button-active`]: !!value }),
			size: "large"
		}, isMobileBool ? null : getText("sort-button-text"));
	}, [
		button,
		style,
		value,
		isMobileBool
	]);
	const content = useMemo(() => {
		return /* @__PURE__ */ React.createElement(InlineMenu, {
			items: sortItems,
			value: value || "",
			onChange
		});
	}, [
		value,
		sortItems,
		onChange
	]);
	if (isMobile()) return /* @__PURE__ */ React.createElement(Popover, {
		placement,
		content,
		arrow: false,
		overlayClassName: `${prefix}mobile-sort-overlay`,
		trigger: ["click"]
	}, btnContent);
	return /* @__PURE__ */ React.createElement(Dropdown, {
		trigger: ["click"],
		placement,
		menu: dropdownMenu,
		open: dropdownOpen,
		onOpenChange: setDropdownOpen
	}, btnContent);
};
//#endregion
export { Sort as default };
