code-monkey-ui 1.1.11-alpha.3 → 1.1.12

package/es/components/menu/src/menu-item2.mjs

@@ -1,20 +1,103 @@
+import { defineComponent, getCurrentInstance, inject, toRef, computed, reactive, onMounted, onBeforeUnmount, resolveComponent, openBlock, createElementBlock, normalizeClass, createBlock, withCtx, renderSlot, createElementVNode, Fragment } from 'vue';
+import { ElTooltip } from '../../tooltip/index.mjs';
 import '../../../utils/index.mjs';
-import { buildProps, definePropType } from '../../../utils/vue/props/runtime.mjs';
-import { isString } from '@vue/shared';
+import '../../../hooks/index.mjs';
+import useMenu from './use-menu.mjs';
+import { menuItemProps, menuItemEmits } from './menu-item.mjs';
+import _export_sfc from '../../../_virtual/plugin-vue_export-helper.mjs';
+import { useNamespace } from '../../../hooks/use-namespace/index.mjs';
+import { throwError } from '../../../utils/error.mjs';
 
-const menuItemProps = buildProps({
-  index: {
-    type: definePropType([String, null]),
-    default: null
+const COMPONENT_NAME = "ElMenuItem";
+const _sfc_main = defineComponent({
+  name: COMPONENT_NAME,
+  components: {
+    ElTooltip
   },
-  route: {
-    type: definePropType([String, Object])
-  },
-  disabled: Boolean
+  props: menuItemProps,
+  emits: menuItemEmits,
+  setup(props, { emit }) {
+    const instance = getCurrentInstance();
+    const rootMenu = inject("rootMenu");
+    const nsMenu = useNamespace("menu");
+    const nsMenuItem = useNamespace("menu-item");
+    if (!rootMenu)
+      throwError(COMPONENT_NAME, "can not inject root menu");
+    const { parentMenu, indexPath } = useMenu(instance, toRef(props, "index"));
+    const subMenu = inject(`subMenu:${parentMenu.value.uid}`);
+    if (!subMenu)
+      throwError(COMPONENT_NAME, "can not inject sub menu");
+    const active = computed(() => props.index === rootMenu.activeIndex);
+    const item = reactive({
+      index: props.index,
+      indexPath,
+      active
+    });
+    const handleClick = () => {
+      if (!props.disabled) {
+        rootMenu.handleMenuItemClick({
+          index: props.index,
+          indexPath: indexPath.value,
+          route: props.route
+        });
+        emit("click", item);
+      }
+    };
+    onMounted(() => {
+      subMenu.addSubMenu(item);
+      rootMenu.addMenuItem(item);
+    });
+    onBeforeUnmount(() => {
+      subMenu.removeSubMenu(item);
+      rootMenu.removeMenuItem(item);
+    });
+    return {
+      parentMenu,
+      rootMenu,
+      active,
+      nsMenu,
+      nsMenuItem,
+      handleClick
+    };
+  }
 });
-const menuItemEmits = {
-  click: (item) => isString(item.index) && Array.isArray(item.indexPath)
-};
+function _sfc_render(_ctx, _cache, $props, $setup, $data, $options) {
+  const _component_el_tooltip = resolveComponent("el-tooltip");
+  return openBlock(), createElementBlock("li", {
+    class: normalizeClass([
+      _ctx.nsMenuItem.b(),
+      _ctx.nsMenuItem.is("active", _ctx.active),
+      _ctx.nsMenuItem.is("disabled", _ctx.disabled)
+    ]),
+    role: "menuitem",
+    tabindex: "-1",
+    onClick: _cache[0] || (_cache[0] = (...args) => _ctx.handleClick && _ctx.handleClick(...args))
+  }, [
+    _ctx.parentMenu.type.name === "ElMenu" && _ctx.rootMenu.props.collapse && _ctx.$slots.title ? (openBlock(), createBlock(_component_el_tooltip, {
+      key: 0,
+      effect: _ctx.rootMenu.props.popperEffect,
+      placement: "right",
+      "fallback-placements": ["left"],
+      persistent: ""
+    }, {
+      content: withCtx(() => [
+        renderSlot(_ctx.$slots, "title")
+      ]),
+      default: withCtx(() => [
+        createElementVNode("div", {
+          class: normalizeClass(_ctx.nsMenu.be("tooltip", "trigger"))
+        }, [
+          renderSlot(_ctx.$slots, "default")
+        ], 2)
+      ]),
+      _: 3
+    }, 8, ["effect"])) : (openBlock(), createElementBlock(Fragment, { key: 1 }, [
+      renderSlot(_ctx.$slots, "default"),
+      renderSlot(_ctx.$slots, "title")
+    ], 64))
+  ], 2);
+}
+var MenuItem = /* @__PURE__ */ _export_sfc(_sfc_main, [["render", _sfc_render], ["__file", "D:\\project\\work\\code-monkey-ui\\packages\\components\\menu\\src\\menu-item.vue"]]);
 
-export { menuItemEmits, menuItemProps };
+export { MenuItem as default };
 //# sourceMappingURL=menu-item2.mjs.map

package/es/components/menu/src/menu-item2.mjs.map

@@ -1 +1 @@
-{"version":3,"file":"menu-item2.mjs","sources":["../../../../../../packages/components/menu/src/menu-item.ts"],"sourcesContent":["import { buildProps, definePropType, isString } from '@code-monkey-ui/utils'\n\nimport type { ExtractPropTypes } from 'vue'\nimport type { RouteLocationRaw } from 'vue-router'\nimport type { MenuItemRegistered } from './types'\n\nexport const menuItemProps = buildProps({\n  index: {\n    type: definePropType<string | null>([String, null]),\n    default: null,\n  },\n  route: {\n    type: definePropType<RouteLocationRaw>([String, Object]),\n  },\n  disabled: Boolean,\n} as const)\nexport type MenuItemProps = ExtractPropTypes<typeof menuItemProps>\n\nexport const menuItemEmits = {\n  click: (item: MenuItemRegistered) =>\n    isString(item.index) && Array.isArray(item.indexPath),\n}\nexport type MenuItemEmits = typeof menuItemEmits\n"],"names":[],"mappings":";;;;AACY,MAAC,aAAa,GAAG,UAAU,CAAC;AACxC,EAAE,KAAK,EAAE;AACT,IAAI,IAAI,EAAE,cAAc,CAAC,CAAC,MAAM,EAAE,IAAI,CAAC,CAAC;AACxC,IAAI,OAAO,EAAE,IAAI;AACjB,GAAG;AACH,EAAE,KAAK,EAAE;AACT,IAAI,IAAI,EAAE,cAAc,CAAC,CAAC,MAAM,EAAE,MAAM,CAAC,CAAC;AAC1C,GAAG;AACH,EAAE,QAAQ,EAAE,OAAO;AACnB,CAAC,EAAE;AACS,MAAC,aAAa,GAAG;AAC7B,EAAE,KAAK,EAAE,CAAC,IAAI,KAAK,QAAQ,CAAC,IAAI,CAAC,KAAK,CAAC,IAAI,KAAK,CAAC,OAAO,CAAC,IAAI,CAAC,SAAS,CAAC;AACxE;;;;"}
+{"version":3,"file":"menu-item2.mjs","sources":["../../../../../../packages/components/menu/src/menu-item.vue"],"sourcesContent":["<template>\n  <li\n    :class=\"[\n      nsMenuItem.b(),\n      nsMenuItem.is('active', active),\n      nsMenuItem.is('disabled', disabled),\n    ]\"\n    role=\"menuitem\"\n    tabindex=\"-1\"\n    @click=\"handleClick\"\n  >\n    <el-tooltip\n      v-if=\"\n        parentMenu.type.name === 'ElMenu' &&\n        rootMenu.props.collapse &&\n        $slots.title\n      \"\n      :effect=\"rootMenu.props.popperEffect\"\n      placement=\"right\"\n      :fallback-placements=\"['left']\"\n      persistent\n    >\n      <template #content>\n        <slot name=\"title\" />\n      </template>\n      <div :class=\"nsMenu.be('tooltip', 'trigger')\">\n        <slot />\n      </div>\n    </el-tooltip>\n    <template v-else>\n      <slot />\n      <slot name=\"title\" />\n    </template>\n  </li>\n</template>\n\n<script lang=\"ts\">\n// @ts-nocheck\nimport {\n  computed,\n  defineComponent,\n  getCurrentInstance,\n  inject,\n  onBeforeUnmount,\n  onMounted,\n  reactive,\n  toRef,\n} from 'vue'\nimport ElTooltip from '@code-monkey-ui/components/tooltip'\nimport { throwError } from '@code-monkey-ui/utils'\nimport { useNamespace } from '@code-monkey-ui/hooks'\nimport useMenu from './use-menu'\nimport { menuItemEmits, menuItemProps } from './menu-item'\n\nimport type { MenuItemRegistered, MenuProvider, SubMenuProvider } from './types'\n\nconst COMPONENT_NAME = 'ElMenuItem'\nexport default defineComponent({\n  name: COMPONENT_NAME,\n  components: {\n    ElTooltip,\n  },\n\n  props: menuItemProps,\n  emits: menuItemEmits,\n\n  setup(props, { emit }) {\n    const instance = getCurrentInstance()!\n    const rootMenu = inject<MenuProvider>('rootMenu')\n    const nsMenu = useNamespace('menu')\n    const nsMenuItem = useNamespace('menu-item')\n    if (!rootMenu) throwError(COMPONENT_NAME, 'can not inject root menu')\n\n    const { parentMenu, indexPath } = useMenu(instance, toRef(props, 'index'))\n\n    const subMenu = inject<SubMenuProvider>(`subMenu:${parentMenu.value.uid}`)\n    if (!subMenu) throwError(COMPONENT_NAME, 'can not inject sub menu')\n\n    const active = computed(() => props.index === rootMenu.activeIndex)\n    const item: MenuItemRegistered = reactive({\n      index: props.index,\n      indexPath,\n      active,\n    })\n\n    const handleClick = () => {\n      if (!props.disabled) {\n        rootMenu.handleMenuItemClick({\n          index: props.index,\n          indexPath: indexPath.value,\n          route: props.route,\n        })\n        emit('click', item)\n      }\n    }\n\n    onMounted(() => {\n      subMenu.addSubMenu(item)\n      rootMenu.addMenuItem(item)\n    })\n\n    onBeforeUnmount(() => {\n      subMenu.removeSubMenu(item)\n      rootMenu.removeMenuItem(item)\n    })\n\n    return {\n      parentMenu,\n      rootMenu,\n      active,\n      nsMenu,\n      nsMenuItem,\n      handleClick,\n    }\n  },\n})\n</script>\n"],"names":["_createElementBlock","_normalizeClass","_createBlock","_withCtx","_renderSlot","_createElementVNode","_Fragment"],"mappings":"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"}

package/es/components/message/index.mjs

@@ -1,6 +1,6 @@
 import '../../utils/index.mjs';
 import message from './src/method.mjs';
-export { messageDefaults, messageEmits, messageProps, messageTypes } from './src/message.mjs';
+export { messageDefaults, messageEmits, messageProps, messageTypes } from './src/message2.mjs';
 import { withInstallFunction } from '../../utils/vue/install.mjs';
 
 const ElMessage = withInstallFunction(message, "$message");

package/es/components/message/src/message.mjs

@@ -1,93 +1,155 @@
+import { defineComponent, ref, computed, onMounted, watch, openBlock, createBlock, Transition, unref, withCtx, withDirectives, createElementVNode, normalizeClass, normalizeStyle, createCommentVNode, resolveDynamicComponent, renderSlot, createElementBlock, toDisplayString, Fragment, withModifiers, createVNode, vShow } from 'vue';
+import { useTimeoutFn, useEventListener, useResizeObserver } from '@vueuse/core';
 import '../../../utils/index.mjs';
-import { mutable } from '../../../utils/typescript.mjs';
-import { isClient } from '@vueuse/core';
-import { buildProps, definePropType } from '../../../utils/vue/props/runtime.mjs';
-import { iconPropType } from '../../../utils/vue/icon.mjs';
+import '../../../constants/index.mjs';
+import { ElBadge } from '../../badge/index.mjs';
+import '../../config-provider/index.mjs';
+import { ElIcon } from '../../icon/index.mjs';
+import { messageProps, messageEmits } from './message2.mjs';
+import { getLastOffset, getOffsetOrSpace } from './instance.mjs';
+import _export_sfc from '../../../_virtual/plugin-vue_export-helper.mjs';
+import { TypeComponents, TypeComponentsMap } from '../../../utils/vue/icon.mjs';
+import { useGlobalComponentSettings } from '../../config-provider/src/hooks/use-global-config.mjs';
+import { EVENT_CODE } from '../../../constants/aria.mjs';
 
-const messageTypes = ["success", "info", "warning", "error"];
-const messageDefaults = mutable({
-  customClass: "",
-  center: false,
-  dangerouslyUseHTMLString: false,
-  duration: 3e3,
-  icon: void 0,
-  id: "",
-  message: "",
-  onClose: void 0,
-  showClose: false,
-  type: "info",
-  offset: 16,
-  zIndex: 0,
-  grouping: false,
-  repeatNum: 1,
-  appendTo: isClient ? document.body : void 0
+const _hoisted_1 = ["id"];
+const _hoisted_2 = ["innerHTML"];
+const __default__ = defineComponent({
+  name: "ElMessage"
 });
-const messageProps = buildProps({
-  customClass: {
-    type: String,
-    default: messageDefaults.customClass
-  },
-  center: {
-    type: Boolean,
-    default: messageDefaults.center
-  },
-  dangerouslyUseHTMLString: {
-    type: Boolean,
-    default: messageDefaults.dangerouslyUseHTMLString
-  },
-  duration: {
-    type: Number,
-    default: messageDefaults.duration
-  },
-  icon: {
-    type: iconPropType,
-    default: messageDefaults.icon
-  },
-  id: {
-    type: String,
-    default: messageDefaults.id
-  },
-  message: {
-    type: definePropType([
-      String,
-      Object,
-      Function
-    ]),
-    default: messageDefaults.message
-  },
-  onClose: {
-    type: definePropType(Function),
-    required: false
-  },
-  showClose: {
-    type: Boolean,
-    default: messageDefaults.showClose
-  },
-  type: {
-    type: String,
-    values: messageTypes,
-    default: messageDefaults.type
-  },
-  offset: {
-    type: Number,
-    default: messageDefaults.offset
-  },
-  zIndex: {
-    type: Number,
-    default: messageDefaults.zIndex
-  },
-  grouping: {
-    type: Boolean,
-    default: messageDefaults.grouping
-  },
-  repeatNum: {
-    type: Number,
-    default: messageDefaults.repeatNum
+const _sfc_main = /* @__PURE__ */ defineComponent({
+  ...__default__,
+  props: messageProps,
+  emits: messageEmits,
+  setup(__props, { expose }) {
+    const props = __props;
+    const { Close } = TypeComponents;
+    const { ns, zIndex } = useGlobalComponentSettings("message");
+    const { currentZIndex, nextZIndex } = zIndex;
+    const messageRef = ref();
+    const visible = ref(false);
+    const height = ref(0);
+    let stopTimer = void 0;
+    const badgeType = computed(() => props.type ? props.type === "error" ? "danger" : props.type : "info");
+    const typeClass = computed(() => {
+      const type = props.type;
+      return { [ns.bm("icon", type)]: type && TypeComponentsMap[type] };
+    });
+    const iconComponent = computed(() => props.icon || TypeComponentsMap[props.type] || "");
+    const lastOffset = computed(() => getLastOffset(props.id));
+    const offset = computed(() => getOffsetOrSpace(props.id, props.offset) + lastOffset.value);
+    const bottom = computed(() => height.value + offset.value);
+    const customStyle = computed(() => ({
+      top: `${offset.value}px`,
+      zIndex: currentZIndex.value
+    }));
+    function startTimer() {
+      if (props.duration === 0)
+        return;
+      ({ stop: stopTimer } = useTimeoutFn(() => {
+        close();
+      }, props.duration));
+    }
+    function clearTimer() {
+      stopTimer == null ? void 0 : stopTimer();
+    }
+    function close() {
+      visible.value = false;
+    }
+    function keydown({ code }) {
+      if (code === EVENT_CODE.esc) {
+        close();
+      }
+    }
+    onMounted(() => {
+      startTimer();
+      nextZIndex();
+      visible.value = true;
+    });
+    watch(() => props.repeatNum, () => {
+      clearTimer();
+      startTimer();
+    });
+    useEventListener(document, "keydown", keydown);
+    useResizeObserver(messageRef, () => {
+      height.value = messageRef.value.getBoundingClientRect().height;
+    });
+    expose({
+      visible,
+      bottom,
+      close
+    });
+    return (_ctx, _cache) => {
+      return openBlock(), createBlock(Transition, {
+        name: unref(ns).b("fade"),
+        onBeforeLeave: _ctx.onClose,
+        onAfterLeave: _cache[0] || (_cache[0] = ($event) => _ctx.$emit("destroy")),
+        persisted: ""
+      }, {
+        default: withCtx(() => [
+          withDirectives(createElementVNode("div", {
+            id: _ctx.id,
+            ref_key: "messageRef",
+            ref: messageRef,
+            class: normalizeClass([
+              unref(ns).b(),
+              { [unref(ns).m(_ctx.type)]: _ctx.type && !_ctx.icon },
+              unref(ns).is("center", _ctx.center),
+              unref(ns).is("closable", _ctx.showClose),
+              _ctx.customClass
+            ]),
+            style: normalizeStyle(unref(customStyle)),
+            role: "alert",
+            onMouseenter: clearTimer,
+            onMouseleave: startTimer
+          }, [
+            _ctx.repeatNum > 1 ? (openBlock(), createBlock(unref(ElBadge), {
+              key: 0,
+              value: _ctx.repeatNum,
+              type: unref(badgeType),
+              class: normalizeClass(unref(ns).e("badge"))
+            }, null, 8, ["value", "type", "class"])) : createCommentVNode("v-if", true),
+            unref(iconComponent) ? (openBlock(), createBlock(unref(ElIcon), {
+              key: 1,
+              class: normalizeClass([unref(ns).e("icon"), unref(typeClass)])
+            }, {
+              default: withCtx(() => [
+                (openBlock(), createBlock(resolveDynamicComponent(unref(iconComponent))))
+              ]),
+              _: 1
+            }, 8, ["class"])) : createCommentVNode("v-if", true),
+            renderSlot(_ctx.$slots, "default", {}, () => [
+              !_ctx.dangerouslyUseHTMLString ? (openBlock(), createElementBlock("p", {
+                key: 0,
+                class: normalizeClass(unref(ns).e("content"))
+              }, toDisplayString(_ctx.message), 3)) : (openBlock(), createElementBlock(Fragment, { key: 1 }, [
+                createCommentVNode(" Caution here, message could've been compromised, never use user's input as message "),
+                createElementVNode("p", {
+                  class: normalizeClass(unref(ns).e("content")),
+                  innerHTML: _ctx.message
+                }, null, 10, _hoisted_2)
+              ], 2112))
+            ]),
+            _ctx.showClose ? (openBlock(), createBlock(unref(ElIcon), {
+              key: 2,
+              class: normalizeClass(unref(ns).e("closeBtn")),
+              onClick: withModifiers(close, ["stop"])
+            }, {
+              default: withCtx(() => [
+                createVNode(unref(Close))
+              ]),
+              _: 1
+            }, 8, ["class", "onClick"])) : createCommentVNode("v-if", true)
+          ], 46, _hoisted_1), [
+            [vShow, visible.value]
+          ])
+        ]),
+        _: 3
+      }, 8, ["name", "onBeforeLeave"]);
+    };
   }
 });
-const messageEmits = {
-  destroy: () => true
-};
+var MessageConstructor = /* @__PURE__ */ _export_sfc(_sfc_main, [["__file", "D:\\project\\work\\code-monkey-ui\\packages\\components\\message\\src\\message.vue"]]);
 
-export { messageDefaults, messageEmits, messageProps, messageTypes };
+export { MessageConstructor as default };
 //# sourceMappingURL=message.mjs.map

package/es/components/message/src/message.mjs.map

@@ -1 +1 @@
-{"version":3,"file":"message.mjs","sources":["../../../../../../packages/components/message/src/message.ts"],"sourcesContent":["import {\n  buildProps,\n  definePropType,\n  iconPropType,\n  isClient,\n  mutable,\n} from '@code-monkey-ui/utils'\nimport type { AppContext, ExtractPropTypes, VNode } from 'vue'\nimport type { Mutable } from '@code-monkey-ui/utils'\nimport type MessageConstructor from './message.vue'\n\nexport const messageTypes = ['success', 'info', 'warning', 'error'] as const\n\nexport type messageType = typeof messageTypes[number]\n\nexport interface MessageConfigContext {\n  max?: number\n}\n\nexport const messageDefaults = mutable({\n  customClass: '',\n  center: false,\n  dangerouslyUseHTMLString: false,\n  duration: 3000,\n  icon: undefined,\n  id: '',\n  message: '',\n  onClose: undefined,\n  showClose: false,\n  type: 'info',\n  offset: 16,\n  zIndex: 0,\n  grouping: false,\n  repeatNum: 1,\n  appendTo: isClient ? document.body : (undefined as never),\n} as const)\n\nexport const messageProps = buildProps({\n  /**\n   * @description custom class name for Message\n   */\n  customClass: {\n    type: String,\n    default: messageDefaults.customClass,\n  },\n  /**\n   * @description whether to center the text\n   */\n  center: {\n    type: Boolean,\n    default: messageDefaults.center,\n  },\n  /**\n   * @description whether `message` is treated as HTML string\n   */\n  dangerouslyUseHTMLString: {\n    type: Boolean,\n    default: messageDefaults.dangerouslyUseHTMLString,\n  },\n  /**\n   * @description display duration, millisecond. If set to 0, it will not turn off automatically\n   */\n  duration: {\n    type: Number,\n    default: messageDefaults.duration,\n  },\n  /**\n   * @description custom icon component, overrides `type`\n   */\n  icon: {\n    type: iconPropType,\n    default: messageDefaults.icon,\n  },\n  /**\n   * @description message dom id\n   */\n  id: {\n    type: String,\n    default: messageDefaults.id,\n  },\n  /**\n   * @description message text\n   */\n  message: {\n    type: definePropType<string | VNode | (() => VNode)>([\n      String,\n      Object,\n      Function,\n    ]),\n    default: messageDefaults.message,\n  },\n  /**\n   * @description callback function when closed with the message instance as the parameter\n   */\n  onClose: {\n    type: definePropType<() => void>(Function),\n    required: false,\n  },\n  /**\n   * @description whether to show a close button\n   */\n  showClose: {\n    type: Boolean,\n    default: messageDefaults.showClose,\n  },\n  /**\n   * @description message type\n   */\n  type: {\n    type: String,\n    values: messageTypes,\n    default: messageDefaults.type,\n  },\n  /**\n   * @description set the distance to the top of viewport\n   */\n  offset: {\n    type: Number,\n    default: messageDefaults.offset,\n  },\n  /**\n   * @description input box size\n   */\n  zIndex: {\n    type: Number,\n    default: messageDefaults.zIndex,\n  },\n  /**\n   * @description merge messages with the same content, type of VNode message is not supported\n   */\n  grouping: {\n    type: Boolean,\n    default: messageDefaults.grouping,\n  },\n  /**\n   * @description The number of repetitions, similar to badge, is used as the initial number when used with `grouping`\n   */\n  repeatNum: {\n    type: Number,\n    default: messageDefaults.repeatNum,\n  },\n} as const)\nexport type MessageProps = ExtractPropTypes<typeof messageProps>\n\nexport const messageEmits = {\n  destroy: () => true,\n}\nexport type MessageEmits = typeof messageEmits\n\nexport type MessageInstance = InstanceType<typeof MessageConstructor>\n\nexport type MessageOptions = Partial<\n  Mutable<\n    Omit<MessageProps, 'id'> & {\n      appendTo?: HTMLElement | string\n    }\n  >\n>\nexport type MessageParams = MessageOptions | MessageOptions['message']\nexport type MessageParamsNormalized = Omit<MessageProps, 'id'> & {\n  /**\n   * @description set the root element for the message, default to `document.body`\n   */\n  appendTo: HTMLElement\n}\nexport type MessageOptionsWithType = Omit<MessageOptions, 'type'>\nexport type MessageParamsWithType =\n  | MessageOptionsWithType\n  | MessageOptions['message']\n\nexport interface MessageHandler {\n  /**\n   * @description close the Message\n   */\n  close: () => void\n}\n\nexport type MessageFn = {\n  (options?: MessageParams, appContext?: null | AppContext): MessageHandler\n  closeAll(type?: messageType): void\n}\nexport type MessageTypedFn = (\n  options?: MessageParamsWithType,\n  appContext?: null | AppContext\n) => MessageHandler\n\nexport interface Message extends MessageFn {\n  success: MessageTypedFn\n  warning: MessageTypedFn\n  info: MessageTypedFn\n  error: MessageTypedFn\n}\n"],"names":[],"mappings":";;;;;;AAOY,MAAC,YAAY,GAAG,CAAC,SAAS,EAAE,MAAM,EAAE,SAAS,EAAE,OAAO,EAAE;AACxD,MAAC,eAAe,GAAG,OAAO,CAAC;AACvC,EAAE,WAAW,EAAE,EAAE;AACjB,EAAE,MAAM,EAAE,KAAK;AACf,EAAE,wBAAwB,EAAE,KAAK;AACjC,EAAE,QAAQ,EAAE,GAAG;AACf,EAAE,IAAI,EAAE,KAAK,CAAC;AACd,EAAE,EAAE,EAAE,EAAE;AACR,EAAE,OAAO,EAAE,EAAE;AACb,EAAE,OAAO,EAAE,KAAK,CAAC;AACjB,EAAE,SAAS,EAAE,KAAK;AAClB,EAAE,IAAI,EAAE,MAAM;AACd,EAAE,MAAM,EAAE,EAAE;AACZ,EAAE,MAAM,EAAE,CAAC;AACX,EAAE,QAAQ,EAAE,KAAK;AACjB,EAAE,SAAS,EAAE,CAAC;AACd,EAAE,QAAQ,EAAE,QAAQ,GAAG,QAAQ,CAAC,IAAI,GAAG,KAAK,CAAC;AAC7C,CAAC,EAAE;AACS,MAAC,YAAY,GAAG,UAAU,CAAC;AACvC,EAAE,WAAW,EAAE;AACf,IAAI,IAAI,EAAE,MAAM;AAChB,IAAI,OAAO,EAAE,eAAe,CAAC,WAAW;AACxC,GAAG;AACH,EAAE,MAAM,EAAE;AACV,IAAI,IAAI,EAAE,OAAO;AACjB,IAAI,OAAO,EAAE,eAAe,CAAC,MAAM;AACnC,GAAG;AACH,EAAE,wBAAwB,EAAE;AAC5B,IAAI,IAAI,EAAE,OAAO;AACjB,IAAI,OAAO,EAAE,eAAe,CAAC,wBAAwB;AACrD,GAAG;AACH,EAAE,QAAQ,EAAE;AACZ,IAAI,IAAI,EAAE,MAAM;AAChB,IAAI,OAAO,EAAE,eAAe,CAAC,QAAQ;AACrC,GAAG;AACH,EAAE,IAAI,EAAE;AACR,IAAI,IAAI,EAAE,YAAY;AACtB,IAAI,OAAO,EAAE,eAAe,CAAC,IAAI;AACjC,GAAG;AACH,EAAE,EAAE,EAAE;AACN,IAAI,IAAI,EAAE,MAAM;AAChB,IAAI,OAAO,EAAE,eAAe,CAAC,EAAE;AAC/B,GAAG;AACH,EAAE,OAAO,EAAE;AACX,IAAI,IAAI,EAAE,cAAc,CAAC;AACzB,MAAM,MAAM;AACZ,MAAM,MAAM;AACZ,MAAM,QAAQ;AACd,KAAK,CAAC;AACN,IAAI,OAAO,EAAE,eAAe,CAAC,OAAO;AACpC,GAAG;AACH,EAAE,OAAO,EAAE;AACX,IAAI,IAAI,EAAE,cAAc,CAAC,QAAQ,CAAC;AAClC,IAAI,QAAQ,EAAE,KAAK;AACnB,GAAG;AACH,EAAE,SAAS,EAAE;AACb,IAAI,IAAI,EAAE,OAAO;AACjB,IAAI,OAAO,EAAE,eAAe,CAAC,SAAS;AACtC,GAAG;AACH,EAAE,IAAI,EAAE;AACR,IAAI,IAAI,EAAE,MAAM;AAChB,IAAI,MAAM,EAAE,YAAY;AACxB,IAAI,OAAO,EAAE,eAAe,CAAC,IAAI;AACjC,GAAG;AACH,EAAE,MAAM,EAAE;AACV,IAAI,IAAI,EAAE,MAAM;AAChB,IAAI,OAAO,EAAE,eAAe,CAAC,MAAM;AACnC,GAAG;AACH,EAAE,MAAM,EAAE;AACV,IAAI,IAAI,EAAE,MAAM;AAChB,IAAI,OAAO,EAAE,eAAe,CAAC,MAAM;AACnC,GAAG;AACH,EAAE,QAAQ,EAAE;AACZ,IAAI,IAAI,EAAE,OAAO;AACjB,IAAI,OAAO,EAAE,eAAe,CAAC,QAAQ;AACrC,GAAG;AACH,EAAE,SAAS,EAAE;AACb,IAAI,IAAI,EAAE,MAAM;AAChB,IAAI,OAAO,EAAE,eAAe,CAAC,SAAS;AACtC,GAAG;AACH,CAAC,EAAE;AACS,MAAC,YAAY,GAAG;AAC5B,EAAE,OAAO,EAAE,MAAM,IAAI;AACrB;;;;"}
+{"version":3,"file":"message.mjs","sources":["../../../../../../packages/components/message/src/message.vue"],"sourcesContent":["<template>\n  <transition\n    :name=\"ns.b('fade')\"\n    @before-leave=\"onClose\"\n    @after-leave=\"$emit('destroy')\"\n  >\n    <div\n      v-show=\"visible\"\n      :id=\"id\"\n      ref=\"messageRef\"\n      :class=\"[\n        ns.b(),\n        { [ns.m(type)]: type && !icon },\n        ns.is('center', center),\n        ns.is('closable', showClose),\n        customClass,\n      ]\"\n      :style=\"customStyle\"\n      role=\"alert\"\n      @mouseenter=\"clearTimer\"\n      @mouseleave=\"startTimer\"\n    >\n      <el-badge\n        v-if=\"repeatNum > 1\"\n        :value=\"repeatNum\"\n        :type=\"badgeType\"\n        :class=\"ns.e('badge')\"\n      />\n      <el-icon v-if=\"iconComponent\" :class=\"[ns.e('icon'), typeClass]\">\n        <component :is=\"iconComponent\" />\n      </el-icon>\n      <slot>\n        <p v-if=\"!dangerouslyUseHTMLString\" :class=\"ns.e('content')\">\n          {{ message }}\n        </p>\n        <!-- Caution here, message could've been compromised, never use user's input as message -->\n        <p v-else :class=\"ns.e('content')\" v-html=\"message\" />\n      </slot>\n      <el-icon v-if=\"showClose\" :class=\"ns.e('closeBtn')\" @click.stop=\"close\">\n        <Close />\n      </el-icon>\n    </div>\n  </transition>\n</template>\n\n<script lang=\"ts\" setup>\nimport { computed, onMounted, ref, watch } from 'vue'\nimport { useEventListener, useResizeObserver, useTimeoutFn } from '@vueuse/core'\nimport { TypeComponents, TypeComponentsMap } from '@code-monkey-ui/utils'\nimport { EVENT_CODE } from '@code-monkey-ui/constants'\nimport ElBadge from '@code-monkey-ui/components/badge'\nimport { useGlobalComponentSettings } from '@code-monkey-ui/components/config-provider'\nimport { ElIcon } from '@code-monkey-ui/components/icon'\nimport { messageEmits, messageProps } from './message'\nimport { getLastOffset, getOffsetOrSpace } from './instance'\nimport type { BadgeProps } from '@code-monkey-ui/components/badge'\nimport type { CSSProperties } from 'vue'\n\nconst { Close } = TypeComponents\n\ndefineOptions({\n  name: 'ElMessage',\n})\n\nconst props = defineProps(messageProps)\ndefineEmits(messageEmits)\n\nconst { ns, zIndex } = useGlobalComponentSettings('message')\nconst { currentZIndex, nextZIndex } = zIndex\n\nconst messageRef = ref<HTMLDivElement>()\nconst visible = ref(false)\nconst height = ref(0)\n\nlet stopTimer: (() => void) | undefined = undefined\n\nconst badgeType = computed<BadgeProps['type']>(() =>\n  props.type ? (props.type === 'error' ? 'danger' : props.type) : 'info'\n)\nconst typeClass = computed(() => {\n  const type = props.type\n  return { [ns.bm('icon', type)]: type && TypeComponentsMap[type] }\n})\nconst iconComponent = computed(\n  () => props.icon || TypeComponentsMap[props.type] || ''\n)\n\nconst lastOffset = computed(() => getLastOffset(props.id))\nconst offset = computed(\n  () => getOffsetOrSpace(props.id, props.offset) + lastOffset.value\n)\nconst bottom = computed((): number => height.value + offset.value)\nconst customStyle = computed<CSSProperties>(() => ({\n  top: `${offset.value}px`,\n  zIndex: currentZIndex.value,\n}))\n\nfunction startTimer() {\n  if (props.duration === 0) return\n  ;({ stop: stopTimer } = useTimeoutFn(() => {\n    close()\n  }, props.duration))\n}\n\nfunction clearTimer() {\n  stopTimer?.()\n}\n\nfunction close() {\n  visible.value = false\n}\n\nfunction keydown({ code }: KeyboardEvent) {\n  if (code === EVENT_CODE.esc) {\n    // press esc to close the message\n    close()\n  }\n}\n\nonMounted(() => {\n  startTimer()\n  nextZIndex()\n  visible.value = true\n})\n\nwatch(\n  () => props.repeatNum,\n  () => {\n    clearTimer()\n    startTimer()\n  }\n)\n\nuseEventListener(document, 'keydown', keydown)\n\nuseResizeObserver(messageRef, () => {\n  height.value = messageRef.value!.getBoundingClientRect().height\n})\n\ndefineExpose({\n  visible,\n  bottom,\n  close,\n})\n</script>\n"],"names":[],"mappings":"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"}