/** 消息提示 */
import { h, isVNode, getCurrentInstance, onActivated, onDeactivated, onBeforeUnmount, provide, inject, mergeProps, unref } from 'vue';
import type { AppContext, InjectionKey } from 'vue';
import { ElMessage } from 'element-plus';
import type {
	MessageHandler as ElMessageHandler,
	MessageOptions as ElMessageOptions,
	MessageFn as ElMessageFn,
} from 'element-plus/es/components/message';
// import { useGlobalProps } from '../y-config-provider/receiver';
import { omit, queryChild } from './common';

/**
 * 消息提示配置
 */
export interface MessageOptions extends ElMessageOptions {
	/** 是否为原始风格 */
	original?: boolean | 'plain';
	/** 是否显示遮罩层 */
	mask?: boolean;
	/** 是否居中显示 */
	centered?: boolean;
	/** 是否限制在主体内部 */
	inner?: boolean;
	/** 限制在主体内部的分组标识 */
	groupKey?: string;
}

/**
 * 消息提示方法参数
 */
export type MessageParams = MessageOptions | ElMessageOptions['message'];

/**
 * 消息提示方法
 */
export type MessageFn = (options?: MessageParams, context?: null | AppContext) => ElMessageHandler;

/**
 * 消息提示
 */
export interface Message extends MessageFn {
	closeAll: ElMessageFn['closeAll'];
	success: MessageFn;
	warning: MessageFn;
	error: MessageFn;
	info: MessageFn;
	loading: MessageFn;
}

/**
 * 消息提示数据
 */
interface MessageState {
	wrapEl: HTMLElement | null;
	isActivated: boolean;
	id: number;
}

/**
 * 消息提示依赖注入
 */
interface MessageProvide {
	/** 限制在主体内部的分组标识 */
	groupKey: string;
	/** 获取限制在主体内部的容器 */
	getInnerWrap: () => HTMLElement;
}

/**
 * 消息提示依赖注入key
 */
type MessageKey = InjectionKey<MessageProvide>;

/**
 * 让当前焦点元素失去焦点
 */
function blurCurrentFocus() {
	if (typeof document?.body?.querySelector === 'function') {
		const el = document.body.querySelector(':focus') as HTMLElement;
		typeof el?.blur === 'function' && el.blur();
	}
}

/**
 * 获取容器
 * @param bodyEl 父容器
 * @param force 是否强制创建新容器
 * @param groupKey 限制在主体内部的分组标识
 */
function getWrapEl(bodyEl?: HTMLElement | null, force?: boolean, groupKey?: string): HTMLElement {
	const parent = bodyEl || document.body;
	const className = 'ele-message-wrapper';
	const attr = 'data-group';
	const attrSelector = groupKey == null ? void 0 : [attr, groupKey];
	const el = force ? void 0 : queryChild(parent, className, attrSelector);
	if (el != null) {
		return el as HTMLElement;
	}
	const elem = document.createElement('div');
	elem.classList.add(className);
	if (groupKey) {
		elem.setAttribute(attr, groupKey);
	}
	parent.appendChild(elem);
	return elem;
}

/**
 * 获取默认的限制在主体内部的分组标识
 */
function getDefaultGroupKey() {
	const url = location?.href;
	const pi = url.indexOf('?');
	return url.substring(0, pi < 0 ? void 0 : pi);
}

/**
 * 获取顶部偏移量样式
 * @param offset 顶部偏移量
 * @param userStyle 自定义样式
 */
function getOffsetStyle(offset: number, userStyle: any) {
	const mt = typeof offset === 'number' ? `${offset}px` : offset;
	return mergeProps({ style: { marginTop: mt } }, { style: userStyle }).style;
}

/**
 * 判断是否是对象类型参数
 * @param params 参数
 */
function isObjOpt(params?: MessageParams | null) {
	return params != null && typeof params === 'object' && !isVNode(params);
}