element-plus
Version:
A Component Library for Vue 3
125 lines (122 loc) • 4.43 kB
JavaScript
import { defineComponent, inject, computed, onMounted, watch, onBeforeUnmount, openBlock, createBlock, unref, mergeProps, withCtx, renderSlot, createCommentVNode } from 'vue';
import { isNil } from 'lodash-unified';
import { unrefElement } from '@vueuse/core';
import '../../slot/index.mjs';
import '../../../hooks/index.mjs';
import '../../../utils/index.mjs';
import { POPPER_INJECTION_KEY } from './constants.mjs';
import { popperTriggerProps } from './trigger.mjs';
import _export_sfc from '../../../_virtual/plugin-vue_export-helper.mjs';
import { useForwardRef } from '../../../hooks/use-forward-ref/index.mjs';
import { isElement } from '../../../utils/types.mjs';
import { OnlyChild } from '../../slot/src/only-child.mjs';
const __default__ = defineComponent({
name: "ElPopperTrigger",
inheritAttrs: false
});
const _sfc_main = /* @__PURE__ */ defineComponent({
...__default__,
props: popperTriggerProps,
setup(__props, { expose }) {
const props = __props;
const { role, triggerRef } = inject(POPPER_INJECTION_KEY, void 0);
useForwardRef(triggerRef);
const ariaControls = computed(() => {
return ariaHaspopup.value ? props.id : void 0;
});
const ariaDescribedby = computed(() => {
if (role && role.value === "tooltip") {
return props.open && props.id ? props.id : void 0;
}
return void 0;
});
const ariaHaspopup = computed(() => {
if (role && role.value !== "tooltip") {
return role.value;
}
return void 0;
});
const ariaExpanded = computed(() => {
return ariaHaspopup.value ? `${props.open}` : void 0;
});
let virtualTriggerAriaStopWatch = void 0;
onMounted(() => {
watch(() => props.virtualRef, (virtualEl) => {
if (virtualEl) {
triggerRef.value = unrefElement(virtualEl);
}
}, {
immediate: true
});
watch(triggerRef, (el, prevEl) => {
virtualTriggerAriaStopWatch == null ? void 0 : virtualTriggerAriaStopWatch();
virtualTriggerAriaStopWatch = void 0;
if (isElement(el)) {
;
[
"onMouseenter",
"onMouseleave",
"onClick",
"onKeydown",
"onFocus",
"onBlur",
"onContextmenu"
].forEach((eventName) => {
var _a;
const handler = props[eventName];
if (handler) {
;
el.addEventListener(eventName.slice(2).toLowerCase(), handler);
(_a = prevEl == null ? void 0 : prevEl.removeEventListener) == null ? void 0 : _a.call(prevEl, eventName.slice(2).toLowerCase(), handler);
}
});
virtualTriggerAriaStopWatch = watch([ariaControls, ariaDescribedby, ariaHaspopup, ariaExpanded], (watches) => {
;
[
"aria-controls",
"aria-describedby",
"aria-haspopup",
"aria-expanded"
].forEach((key, idx) => {
isNil(watches[idx]) ? el.removeAttribute(key) : el.setAttribute(key, watches[idx]);
});
}, { immediate: true });
}
if (isElement(prevEl)) {
;
[
"aria-controls",
"aria-describedby",
"aria-haspopup",
"aria-expanded"
].forEach((key) => prevEl.removeAttribute(key));
}
}, {
immediate: true
});
});
onBeforeUnmount(() => {
virtualTriggerAriaStopWatch == null ? void 0 : virtualTriggerAriaStopWatch();
virtualTriggerAriaStopWatch = void 0;
});
expose({
triggerRef
});
return (_ctx, _cache) => {
return !_ctx.virtualTriggering ? (openBlock(), createBlock(unref(OnlyChild), mergeProps({ key: 0 }, _ctx.$attrs, {
"aria-controls": unref(ariaControls),
"aria-describedby": unref(ariaDescribedby),
"aria-expanded": unref(ariaExpanded),
"aria-haspopup": unref(ariaHaspopup)
}), {
default: withCtx(() => [
renderSlot(_ctx.$slots, "default")
]),
_: 3
}, 16, ["aria-controls", "aria-describedby", "aria-expanded", "aria-haspopup"])) : createCommentVNode("v-if", true);
};
}
});
var ElPopperTrigger = /* @__PURE__ */ _export_sfc(_sfc_main, [["__file", "trigger.vue"]]);
export { ElPopperTrigger as default };
//# sourceMappingURL=trigger2.mjs.map