UNPKG

@opensig/opendesign

Version:

<p align="center"><img src="../docs/public/opendesign-logo-light.png"/></p> <h1 align="center">opendesign</h1> <p align="center">一个 Vue 3 组件库</p> <p align="center"><b>皮肤可定制,使用 TypeScript</b></p>

126 lines (125 loc) 4.15 kB
import { defineComponent, computed, ref, watch, onMounted, onUnmounted, createElementBlock, createCommentVNode, openBlock, normalizeClass, createElementVNode, renderSlot, createBlock, resolveDynamicComponent, createTextVNode, toDisplayString, createVNode, unref } from "vue"; import { messageProps } from "./types.mjs"; import { IconLoading, IconDanger, IconWarning, IconSuccess, IconInfo, IconClose } from "../_utils/icons.mjs"; import { isUndefined, isFunction } from "../_utils/is.mjs"; const _hoisted_1 = { class: "o-message-icon" }; const _hoisted_2 = { class: "o-message-main" }; const _hoisted_3 = { key: 0, class: "o-message-title" }; const _hoisted_4 = { class: "o-message-content" }; const _sfc_main = /* @__PURE__ */ defineComponent({ __name: "OMessage", props: messageProps, emits: ["duration-end", "close", "update:visible"], setup(__props, { expose: __expose, emit: __emit }) { const props = __props; const iconMap = { info: IconInfo.value, success: IconSuccess.value, warning: IconWarning.value, danger: IconDanger.value, loading: IconLoading.value }; const icon = computed(() => iconMap[props.status]); const isVisible = ref(props.visible ?? props.defaultVisible); watch( () => props.visible, (val) => { if (!isUndefined(val)) { isVisible.value = val; } } ); const emits = __emit; let timer = 0; const clearTimer = () => { if (timer) { window.clearTimeout(timer); timer = 0; } }; const startTimer = () => { if (isUndefined(props.duration) || props.duration <= 0) { return; } timer = window.setTimeout(() => { emits("duration-end"); isVisible.value = false; emits("update:visible", isVisible.value); clearTimer(); }, props.duration); }; const onClose = async (ev) => { ev == null ? void 0 : ev.stopPropagation(); if (isFunction(props.beforeClose)) { const rlt = await props.beforeClose(); if (rlt) { isVisible.value = false; emits("update:visible", isVisible.value); emits("close", ev); return; } } isVisible.value = false; emits("update:visible", isVisible.value); emits("close", ev); }; onMounted(() => { startTimer(); }); onUnmounted(() => { clearTimer(); }); __expose({ close: onClose }); return (_ctx, _cache) => { return isVisible.value ? (openBlock(), createElementBlock( "div", { key: 0, class: normalizeClass(["o-message", [`o-message-${props.status}`, { "o-message-colorful": props.colorful }]]), onMouseenter: clearTimer, onMouseleave: startTimer }, [ createElementVNode("span", _hoisted_1, [ renderSlot(_ctx.$slots, "icon", {}, () => [ (openBlock(), createBlock(resolveDynamicComponent(icon.value), { class: normalizeClass({ "o-rotating": props.status === "loading" }) }, null, 8, ["class"])) ]) ]), createElementVNode("div", _hoisted_2, [ _ctx.$slots.title || props.title ? (openBlock(), createElementBlock("span", _hoisted_3, [ renderSlot(_ctx.$slots, "title", {}, () => [ createTextVNode( toDisplayString(props.title), 1 /* TEXT */ ) ]) ])) : createCommentVNode("v-if", true), createElementVNode("span", _hoisted_4, [ renderSlot(_ctx.$slots, "default") ]) ]), props.closable ? (openBlock(), createElementBlock("span", { key: 0, class: "o-message-close", onClick: onClose }, [ createVNode(unref(IconClose)) ])) : createCommentVNode("v-if", true) ], 34 /* CLASS, NEED_HYDRATION */ )) : createCommentVNode("v-if", true); }; } }); export { _sfc_main as default };