import useXComponentConfig from "../_utils/hooks/use-x-component-config.js";
import useShortcutKeys from "../_utils/hooks/use-shortcut-keys.js";
import useCollapsible from "../_utils/hooks/useCollapsible.js";
import Creation from "./Creation.js";
import GroupTitle from "./GroupTitle.js";
import ConversationsItem from "./Item.js";
import useGroupable from "./hooks/useGroupable.js";
import style_default from "./style/index.js";
import { computed, createVNode, defineComponent, mergeProps, ref, useAttrs } from "vue";
import { useConfig } from "antdv-next/config-provider/context";
import { Divider } from "antdv-next";
//#region components/conversations/index.tsx
function isTypingTarget(target) {
	if (!(target instanceof HTMLElement)) return false;
	if (target.isContentEditable) return true;
	const tagName = target.tagName.toLowerCase();
	return tagName === "input" || tagName === "textarea" || tagName === "select";
}
var ConversationsWithSub = /* @__PURE__ */ defineComponent({
	name: "AxConversations",
	inheritAttrs: false,
	props: {
		items: {
			type: Array,
			default: () => []
		},
		activeKey: {
			type: [String, Number],
			default: void 0
		},
		defaultActiveKey: {
			type: [String, Number],
			default: void 0
		},
		onActiveChange: {
			type: Function,
			default: void 0
		},
		labelRender: {
			type: [
				String,
				Number,
				Object,
				Array,
				Function
			],
			default: void 0
		},
		iconRender: {
			type: [
				String,
				Number,
				Object,
				Array,
				Function
			],
			default: void 0
		},
		groupLabelRender: {
			type: [
				String,
				Number,
				Object,
				Array,
				Function
			],
			default: void 0
		},
		menu: {
			type: [Object, Function],
			default: void 0
		},
		groupable: {
			type: [Boolean, Object],
			default: void 0
		},
		styles: {
			type: Object,
			default: () => ({})
		},
		classes: {
			type: Object,
			default: () => ({})
		},
		prefixCls: {
			type: String,
			default: "antd-conversations"
		},
		rootClass: {
			type: String,
			default: ""
		},
		class: {
			type: [
				String,
				Array,
				Object
			],
			default: void 0
		},
		style: {
			type: [
				String,
				Object,
				Array
			],
			default: void 0
		},
		shortcutKeys: {
			type: Object,
			default: void 0
		},
		creation: {
			type: Object,
			default: void 0
		}
	},
	emits: ["update:activeKey", "expand"],
	setup(props, { expose, emit, slots }) {
		const configCtx = useConfig();
		const attrs = useAttrs();
		const contextConfig = useXComponentConfig("conversations");
		const rootRef = ref();
		const [hashId, cssVarCls] = style_default(computed(() => props.prefixCls));
		const mergedItems = computed(() => props.items ?? []);
		const { groupList, collapsibleOptions, keyList } = useGroupable(computed(() => props.groupable), mergedItems);
		const innerActiveKey = ref(props.defaultActiveKey);
		const mergedActiveKey = computed(() => {
			if (props.activeKey !== void 0) return props.activeKey;
			return innerActiveKey.value;
		});
		const domAttrs = computed(() => {
			const { class: _class, style: _style, ...rest } = attrs;
			return rest;
		});
		const { enableCollapse, expandedKeys: mergedExpandedKeys, onItemExpand, collapseTransition } = useCollapsible(computed(() => collapsibleOptions.value), computed(() => configCtx.value.getPrefixCls()));
		const setActiveKey = (key) => {
			if (props.activeKey === void 0) innerActiveKey.value = key;
			emit("update:activeKey", key);
		};
		const onConversationItemClick = (key, item) => {
			setActiveKey(key);
			props.onActiveChange?.(key, item ?? props.items?.find((itemData) => itemData.type !== "divider" && itemData.key === key));
		};
		const onExpand = (curKey) => {
			const targetKeys = onItemExpand.value?.(curKey);
			if (targetKeys) emit("expand", targetKeys);
		};
		const [, shortcutKeysInfo, subscribeShortcutAction] = useShortcutKeys("conversations", computed(() => props.shortcutKeys), { shouldIgnore: (event) => isTypingTarget(event.target) });
		const creationShortcutInfo = computed(() => {
			return shortcutKeysInfo.value.creation;
		});
		subscribeShortcutAction((shortcutInfo) => {
			if (!shortcutInfo) return;
			if (shortcutInfo.name === "creation") {
				if (typeof props.creation?.onClick === "function" && !props.creation.disabled) props.creation.onClick();
				return;
			}
			if (shortcutInfo.name !== "items") return;
			const index = typeof shortcutInfo.actionKeyCodeNumber === "number" ? shortcutInfo.actionKeyCodeNumber : shortcutInfo.index;
			if (typeof index !== "number") return;
			const keyInfo = keyList.value[index];
			if (keyInfo && !keyInfo.disabled) onConversationItemClick?.(keyInfo.key);
		});
		expose({ get nativeElement() {
			return rootRef.value;
		} });
		const getItemNode = (itemData, indexRef) => {
			return itemData.map((conversationInfo, conversationIndex) => {
				if (conversationInfo.type === "divider") return createVNode(Divider, {
					"key": conversationInfo.key ?? `key-divider-${conversationIndex}`,
					"class": `${props.prefixCls}-divider`,
					"dashed": conversationInfo.dashed
				}, null);
				const baseConversationInfo = conversationInfo;
				const { label: _label, disabled: _disabled, icon: _icon, ...restInfo } = baseConversationInfo;
				const currentIndex = indexRef.value++;
				const isActive = mergedActiveKey.value === baseConversationInfo.key;
				return createVNode(ConversationsItem, mergeProps(restInfo, {
					"key": baseConversationInfo.key ?? `key-${conversationIndex}`,
					"info": baseConversationInfo,
					"index": currentIndex,
					"prefixCls": props.prefixCls,
					"direction": configCtx.value.direction,
					"labelRender": props.labelRender,
					"iconRender": props.iconRender,
					"labelRenderSlot": slots.labelRender,
					"iconRenderSlot": slots.iconRender,
					"classes": [
						contextConfig.value.classes?.item,
						props.classes?.item,
						baseConversationInfo.class
					],
					"style": [
						contextConfig.value.styles?.item,
						props.styles?.item,
						baseConversationInfo.style
					],
					"menu": typeof props.menu === "function" ? props.menu(baseConversationInfo) : props.menu,
					"active": isActive,
					"onClick": onConversationItemClick
				}), null);
			});
		};
		return () => {
			const itemIndexRef = { value: 0 };
			return createVNode("ul", mergeProps({ "ref": rootRef }, domAttrs.value, {
				"class": [
					props.prefixCls,
					props.rootClass,
					contextConfig.value.classes?.root,
					props.classes?.root,
					hashId.value,
					cssVarCls.value,
					attrs.class,
					props.class,
					{ [`${props.prefixCls}-rtl`]: configCtx.value.direction === "rtl" }
				],
				"style": [
					contextConfig.value.style,
					contextConfig.value.styles?.root,
					props.styles?.root,
					attrs.style,
					props.style
				]
			}), [!!props.creation && createVNode(Creation, mergeProps({
				"classes": [contextConfig.value.classes?.creation, props.classes?.creation],
				"style": {
					...contextConfig.value.styles?.creation,
					...props.styles?.creation
				},
				"shortcutKeyInfo": creationShortcutInfo.value,
				"prefixCls": `${props.prefixCls}-creation`
			}, props.creation), null), groupList.value.map((groupInfo, groupIndex) => {
				const itemNode = getItemNode(groupInfo.data, itemIndexRef);
				return groupInfo.enableGroup ? createVNode(GroupTitle, {
					"key": groupInfo.name || `key-${groupIndex}`,
					"prefixCls": props.prefixCls,
					"groupInfo": groupInfo,
					"groupLabelRender": props.groupLabelRender,
					"groupLabelRenderSlot": slots.groupLabelRender,
					"classes": [contextConfig.value.classes?.group, props.classes?.group],
					"enableCollapse": enableCollapse.value,
					"expandedKeys": mergedExpandedKeys.value,
					"onItemExpand": onExpand,
					"collapseTransition": collapseTransition.value
				}, { default: () => [createVNode("ul", {
					"class": [`${props.prefixCls}-list`, { [`${props.prefixCls}-group-collapsible-list`]: groupInfo.collapsible }],
					"style": [contextConfig.value.styles?.group, props.styles?.group]
				}, [itemNode])] }) : itemNode;
			})]);
		};
	}
});
ConversationsWithSub.Creation = Creation;
//#endregion
export { Creation as ConversationsCreation, ConversationsWithSub as default };
