@element-plus/nightly 0.0.20250723 → 0.0.20250725

package/lib/components/dialog/src/use-dialog.js

@@ -4,14 +4,18 @@ Object.defineProperty(exports, '__esModule', { value: true });
 
 var vue = require('vue');
 var core = require('@vueuse/core');
+var constants = require('./constants.js');
 var index$3 = require('../../../hooks/use-lockscreen/index.js');
 var index = require('../../../hooks/use-z-index/index.js');
 var index$1 = require('../../../hooks/use-id/index.js');
 var useGlobalConfig = require('../../config-provider/src/hooks/use-global-config.js');
 var index$2 = require('../../../hooks/use-namespace/index.js');
 var style = require('../../../utils/dom/style.js');
+var shared = require('@vue/shared');
+var error = require('../../../utils/error.js');
 var event = require('../../../constants/event.js');
 
+const COMPONENT_NAME = "ElDialog";
 const useDialog = (props, targetRef) => {
   var _a;
   const instance = vue.getCurrentInstance();
@@ -46,6 +50,39 @@ const useDialog = (props, targetRef) => {
     }
     return {};
   });
+  const transitionConfig = vue.computed(() => {
+    const baseConfig = {
+      name: props.transition,
+      onAfterEnter: afterEnter,
+      onBeforeLeave: beforeLeave,
+      onAfterLeave: afterLeave
+    };
+    if (shared.isObject(props.transition)) {
+      const config = { ...props.transition };
+      const _mergeHook = (userHook, defaultHook) => {
+        return (el) => {
+          if (shared.isArray(userHook)) {
+            userHook.forEach((fn) => {
+              if (shared.isFunction(fn))
+                fn(el);
+            });
+          } else if (shared.isFunction(userHook)) {
+            userHook(el);
+          }
+          defaultHook();
+        };
+      };
+      config.onAfterEnter = _mergeHook(config.onAfterEnter, afterEnter);
+      config.onBeforeLeave = _mergeHook(config.onBeforeLeave, beforeLeave);
+      config.onAfterLeave = _mergeHook(config.onAfterLeave, afterLeave);
+      if (!config.name) {
+        config.name = constants.DEFAULT_DIALOG_TRANSITION;
+        error.debugWarn(COMPONENT_NAME, `transition.name is missing when using object syntax, fallback to '${constants.DEFAULT_DIALOG_TRANSITION}'`);
+      }
+      return config;
+    }
+    return baseConfig;
+  });
   function afterEnter() {
     emit("opened");
   }
@@ -184,7 +221,8 @@ const useDialog = (props, targetRef) => {
     overlayDialogStyle,
     rendered,
     visible,
-    zIndex
+    zIndex,
+    transitionConfig
   };
 };
 

package/lib/components/dialog/src/use-dialog.js.map

@@ -1 +1 @@
-{"version":3,"file":"use-dialog.js","sources":["../../../../../../packages/components/dialog/src/use-dialog.ts"],"sourcesContent":["import {\n  computed,\n  getCurrentInstance,\n  nextTick,\n  onMounted,\n  ref,\n  watch,\n} from 'vue'\nimport { useTimeoutFn } from '@vueuse/core'\nimport {\n  defaultNamespace,\n  useId,\n  useLockscreen,\n  useZIndex,\n} from '@element-plus/hooks'\nimport { UPDATE_MODEL_EVENT } from '@element-plus/constants'\nimport { addUnit, isClient } from '@element-plus/utils'\nimport { useGlobalConfig } from '@element-plus/components/config-provider'\n\nimport type { CSSProperties, Ref, SetupContext } from 'vue'\nimport type { DialogEmits, DialogProps } from './dialog'\n\nexport const useDialog = (\n  props: DialogProps,\n  targetRef: Ref<HTMLElement | undefined>\n) => {\n  const instance = getCurrentInstance()!\n  const emit = instance.emit as SetupContext<DialogEmits>['emit']\n  const { nextZIndex } = useZIndex()\n\n  let lastPosition = ''\n  const titleId = useId()\n  const bodyId = useId()\n  const visible = ref(false)\n  const closed = ref(false)\n  const rendered = ref(false) // when destroyOnClose is true, we initialize it as false vise versa\n  const zIndex = ref(props.zIndex ?? nextZIndex())\n\n  let openTimer: (() => void) | undefined = undefined\n  let closeTimer: (() => void) | undefined = undefined\n\n  const namespace = useGlobalConfig('namespace', defaultNamespace)\n\n  const style = computed<CSSProperties>(() => {\n    const style: CSSProperties = {}\n    const varPrefix = `--${namespace.value}-dialog` as const\n    if (!props.fullscreen) {\n      if (props.top) {\n        style[`${varPrefix}-margin-top`] = props.top\n      }\n      if (props.width) {\n        style[`${varPrefix}-width`] = addUnit(props.width)\n      }\n    }\n    return style\n  })\n\n  const overlayDialogStyle = computed<CSSProperties>(() => {\n    if (props.alignCenter) {\n      return { display: 'flex' }\n    }\n    return {}\n  })\n\n  function afterEnter() {\n    emit('opened')\n  }\n\n  function afterLeave() {\n    emit('closed')\n    emit(UPDATE_MODEL_EVENT, false)\n    if (props.destroyOnClose) {\n      rendered.value = false\n    }\n  }\n\n  function beforeLeave() {\n    emit('close')\n  }\n\n  function open() {\n    closeTimer?.()\n    openTimer?.()\n\n    if (props.openDelay && props.openDelay > 0) {\n      ;({ stop: openTimer } = useTimeoutFn(() => doOpen(), props.openDelay))\n    } else {\n      doOpen()\n    }\n  }\n\n  function close() {\n    openTimer?.()\n    closeTimer?.()\n\n    if (props.closeDelay && props.closeDelay > 0) {\n      ;({ stop: closeTimer } = useTimeoutFn(() => doClose(), props.closeDelay))\n    } else {\n      doClose()\n    }\n  }\n\n  function handleClose() {\n    function hide(shouldCancel?: boolean) {\n      if (shouldCancel) return\n      closed.value = true\n      visible.value = false\n    }\n\n    if (props.beforeClose) {\n      props.beforeClose(hide)\n    } else {\n      close()\n    }\n  }\n\n  function onModalClick() {\n    if (props.closeOnClickModal) {\n      handleClose()\n    }\n  }\n\n  function doOpen() {\n    if (!isClient) return\n    visible.value = true\n  }\n\n  function doClose() {\n    visible.value = false\n  }\n\n  function onOpenAutoFocus() {\n    emit('openAutoFocus')\n  }\n\n  function onCloseAutoFocus() {\n    emit('closeAutoFocus')\n  }\n\n  function onFocusoutPrevented(event: CustomEvent) {\n    if (event.detail?.focusReason === 'pointer') {\n      event.preventDefault()\n    }\n  }\n\n  if (props.lockScroll) {\n    useLockscreen(visible)\n  }\n\n  function onCloseRequested() {\n    if (props.closeOnPressEscape) {\n      handleClose()\n    }\n  }\n\n  watch(\n    () => props.zIndex,\n    () => {\n      zIndex.value = props.zIndex ?? nextZIndex()\n    }\n  )\n\n  watch(\n    () => props.modelValue,\n    (val) => {\n      if (val) {\n        closed.value = false\n        open()\n        rendered.value = true // enables lazy rendering\n        zIndex.value = props.zIndex ?? nextZIndex()\n        // this.$el.addEventListener('scroll', this.updatePopper)\n        nextTick(() => {\n          emit('open')\n          if (targetRef.value) {\n            targetRef.value.parentElement!.scrollTop = 0\n            targetRef.value.parentElement!.scrollLeft = 0\n            targetRef.value.scrollTop = 0\n          }\n        })\n      } else {\n        // this.$el.removeEventListener('scroll', this.updatePopper\n        if (visible.value) {\n          close()\n        }\n      }\n    }\n  )\n\n  watch(\n    () => props.fullscreen,\n    (val) => {\n      if (!targetRef.value) return\n      if (val) {\n        lastPosition = targetRef.value.style.transform\n        targetRef.value.style.transform = ''\n      } else {\n        targetRef.value.style.transform = lastPosition\n      }\n    }\n  )\n\n  onMounted(() => {\n    if (props.modelValue) {\n      visible.value = true\n      rendered.value = true // enables lazy rendering\n      open()\n    }\n  })\n\n  return {\n    afterEnter,\n    afterLeave,\n    beforeLeave,\n    handleClose,\n    onModalClick,\n    close,\n    doClose,\n    onOpenAutoFocus,\n    onCloseAutoFocus,\n    onCloseRequested,\n    onFocusoutPrevented,\n    titleId,\n    bodyId,\n    closed,\n    style,\n    overlayDialogStyle,\n    rendered,\n    visible,\n    zIndex,\n  }\n}\n"],"names":["getCurrentInstance","useZIndex","useId","ref","useGlobalConfig","defaultNamespace","style","computed","addUnit","UPDATE_MODEL_EVENT","useTimeoutFn","isClient","useLockscreen","watch","nextTick","onMounted"],"mappings":"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"}
+{"version":3,"file":"use-dialog.js","sources":["../../../../../../packages/components/dialog/src/use-dialog.ts"],"sourcesContent":["import {\n  computed,\n  getCurrentInstance,\n  nextTick,\n  onMounted,\n  ref,\n  watch,\n} from 'vue'\nimport { useTimeoutFn } from '@vueuse/core'\nimport {\n  defaultNamespace,\n  useId,\n  useLockscreen,\n  useZIndex,\n} from '@element-plus/hooks'\nimport { UPDATE_MODEL_EVENT } from '@element-plus/constants'\nimport {\n  addUnit,\n  debugWarn,\n  isArray,\n  isClient,\n  isFunction,\n  isObject,\n} from '@element-plus/utils'\nimport { useGlobalConfig } from '@element-plus/components/config-provider'\nimport { DEFAULT_DIALOG_TRANSITION } from './constants'\n\nimport type { CSSProperties, Ref, SetupContext, TransitionProps } from 'vue'\nimport type { Arrayable } from '@element-plus/utils'\nimport type { DialogEmits, DialogProps } from './dialog'\n\nconst COMPONENT_NAME = 'ElDialog'\n\nexport const useDialog = (\n  props: DialogProps,\n  targetRef: Ref<HTMLElement | undefined>\n) => {\n  const instance = getCurrentInstance()!\n  const emit = instance.emit as SetupContext<DialogEmits>['emit']\n  const { nextZIndex } = useZIndex()\n\n  let lastPosition = ''\n  const titleId = useId()\n  const bodyId = useId()\n  const visible = ref(false)\n  const closed = ref(false)\n  const rendered = ref(false) // when destroyOnClose is true, we initialize it as false vise versa\n  const zIndex = ref(props.zIndex ?? nextZIndex())\n\n  let openTimer: (() => void) | undefined = undefined\n  let closeTimer: (() => void) | undefined = undefined\n\n  const namespace = useGlobalConfig('namespace', defaultNamespace)\n\n  const style = computed<CSSProperties>(() => {\n    const style: CSSProperties = {}\n    const varPrefix = `--${namespace.value}-dialog` as const\n    if (!props.fullscreen) {\n      if (props.top) {\n        style[`${varPrefix}-margin-top`] = props.top\n      }\n      if (props.width) {\n        style[`${varPrefix}-width`] = addUnit(props.width)\n      }\n    }\n    return style\n  })\n\n  const overlayDialogStyle = computed<CSSProperties>(() => {\n    if (props.alignCenter) {\n      return { display: 'flex' }\n    }\n    return {}\n  })\n\n  const transitionConfig = computed(() => {\n    const baseConfig = {\n      name: props.transition,\n      onAfterEnter: afterEnter,\n      onBeforeLeave: beforeLeave,\n      onAfterLeave: afterLeave,\n    }\n    if (isObject(props.transition)) {\n      const config = { ...props.transition } as TransitionProps\n      const _mergeHook = (\n        userHook: Arrayable<(el: Element) => void> | undefined,\n        defaultHook: () => void\n      ) => {\n        return (el: Element) => {\n          if (isArray(userHook)) {\n            userHook.forEach((fn) => {\n              if (isFunction(fn)) fn(el)\n            })\n          } else if (isFunction(userHook)) {\n            userHook(el)\n          }\n          defaultHook()\n        }\n      }\n      config.onAfterEnter = _mergeHook(config.onAfterEnter, afterEnter)\n      config.onBeforeLeave = _mergeHook(config.onBeforeLeave, beforeLeave)\n      config.onAfterLeave = _mergeHook(config.onAfterLeave, afterLeave)\n      if (!config.name) {\n        config.name = DEFAULT_DIALOG_TRANSITION\n        debugWarn(\n          COMPONENT_NAME,\n          `transition.name is missing when using object syntax, fallback to '${DEFAULT_DIALOG_TRANSITION}'`\n        )\n      }\n      return config\n    }\n\n    return baseConfig\n  })\n\n  function afterEnter() {\n    emit('opened')\n  }\n\n  function afterLeave() {\n    emit('closed')\n    emit(UPDATE_MODEL_EVENT, false)\n    if (props.destroyOnClose) {\n      rendered.value = false\n    }\n  }\n\n  function beforeLeave() {\n    emit('close')\n  }\n\n  function open() {\n    closeTimer?.()\n    openTimer?.()\n\n    if (props.openDelay && props.openDelay > 0) {\n      ;({ stop: openTimer } = useTimeoutFn(() => doOpen(), props.openDelay))\n    } else {\n      doOpen()\n    }\n  }\n\n  function close() {\n    openTimer?.()\n    closeTimer?.()\n\n    if (props.closeDelay && props.closeDelay > 0) {\n      ;({ stop: closeTimer } = useTimeoutFn(() => doClose(), props.closeDelay))\n    } else {\n      doClose()\n    }\n  }\n\n  function handleClose() {\n    function hide(shouldCancel?: boolean) {\n      if (shouldCancel) return\n      closed.value = true\n      visible.value = false\n    }\n\n    if (props.beforeClose) {\n      props.beforeClose(hide)\n    } else {\n      close()\n    }\n  }\n\n  function onModalClick() {\n    if (props.closeOnClickModal) {\n      handleClose()\n    }\n  }\n\n  function doOpen() {\n    if (!isClient) return\n    visible.value = true\n  }\n\n  function doClose() {\n    visible.value = false\n  }\n\n  function onOpenAutoFocus() {\n    emit('openAutoFocus')\n  }\n\n  function onCloseAutoFocus() {\n    emit('closeAutoFocus')\n  }\n\n  function onFocusoutPrevented(event: CustomEvent) {\n    if (event.detail?.focusReason === 'pointer') {\n      event.preventDefault()\n    }\n  }\n\n  if (props.lockScroll) {\n    useLockscreen(visible)\n  }\n\n  function onCloseRequested() {\n    if (props.closeOnPressEscape) {\n      handleClose()\n    }\n  }\n\n  watch(\n    () => props.zIndex,\n    () => {\n      zIndex.value = props.zIndex ?? nextZIndex()\n    }\n  )\n\n  watch(\n    () => props.modelValue,\n    (val) => {\n      if (val) {\n        closed.value = false\n        open()\n        rendered.value = true // enables lazy rendering\n        zIndex.value = props.zIndex ?? nextZIndex()\n        // this.$el.addEventListener('scroll', this.updatePopper)\n        nextTick(() => {\n          emit('open')\n          if (targetRef.value) {\n            targetRef.value.parentElement!.scrollTop = 0\n            targetRef.value.parentElement!.scrollLeft = 0\n            targetRef.value.scrollTop = 0\n          }\n        })\n      } else {\n        // this.$el.removeEventListener('scroll', this.updatePopper\n        if (visible.value) {\n          close()\n        }\n      }\n    }\n  )\n\n  watch(\n    () => props.fullscreen,\n    (val) => {\n      if (!targetRef.value) return\n      if (val) {\n        lastPosition = targetRef.value.style.transform\n        targetRef.value.style.transform = ''\n      } else {\n        targetRef.value.style.transform = lastPosition\n      }\n    }\n  )\n\n  onMounted(() => {\n    if (props.modelValue) {\n      visible.value = true\n      rendered.value = true // enables lazy rendering\n      open()\n    }\n  })\n\n  return {\n    afterEnter,\n    afterLeave,\n    beforeLeave,\n    handleClose,\n    onModalClick,\n    close,\n    doClose,\n    onOpenAutoFocus,\n    onCloseAutoFocus,\n    onCloseRequested,\n    onFocusoutPrevented,\n    titleId,\n    bodyId,\n    closed,\n    style,\n    overlayDialogStyle,\n    rendered,\n    visible,\n    zIndex,\n    transitionConfig,\n  }\n}\n"],"names":["getCurrentInstance","useZIndex","useId","ref","useGlobalConfig","defaultNamespace","style","computed","addUnit","isObject","isArray","isFunction","DEFAULT_DIALOG_TRANSITION","debugWarn","UPDATE_MODEL_EVENT","useTimeoutFn","isClient","useLockscreen","watch","nextTick","onMounted"],"mappings":"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"}

package/lib/components/drawer/src/drawer.d.ts

@@ -44,6 +44,7 @@ export declare const drawerProps: {
         __epPropKey: true;
     };
     readonly trapFocus: BooleanConstructor;
+    readonly transition: import("@element-plus/nightly/es/utils").EpPropFinalized<(new (...args: any[]) => string | import("vue").TransitionProps) | (() => import("@element-plus/nightly/es/components/dialog").DialogTransition) | ((new (...args: any[]) => string | import("vue").TransitionProps) | (() => import("@element-plus/nightly/es/components/dialog").DialogTransition))[], unknown, unknown, "dialog-fade", boolean>;
     readonly center: BooleanConstructor;
     readonly alignCenter: BooleanConstructor;
     readonly closeIcon: {

package/lib/components/drawer/src/drawer.vue.d.ts

@@ -53,6 +53,7 @@ declare const __VLS_component: import("vue").DefineComponent<{
         __epPropKey: true;
     };
     readonly trapFocus: BooleanConstructor;
+    readonly transition: import("@element-plus/nightly/es/utils").EpPropFinalized<(new (...args: any[]) => string | import("vue").TransitionProps) | (() => import("@element-plus/nightly/es/components/dialog").DialogTransition) | ((new (...args: any[]) => string | import("vue").TransitionProps) | (() => import("@element-plus/nightly/es/components/dialog").DialogTransition))[], unknown, unknown, "dialog-fade", boolean>;
     readonly center: BooleanConstructor;
     readonly alignCenter: BooleanConstructor;
     readonly closeIcon: {
@@ -124,6 +125,7 @@ declare const __VLS_component: import("vue").DefineComponent<{
         __epPropKey: true;
     };
     readonly trapFocus: BooleanConstructor;
+    readonly transition: import("@element-plus/nightly/es/utils").EpPropFinalized<(new (...args: any[]) => string | import("vue").TransitionProps) | (() => import("@element-plus/nightly/es/components/dialog").DialogTransition) | ((new (...args: any[]) => string | import("vue").TransitionProps) | (() => import("@element-plus/nightly/es/components/dialog").DialogTransition))[], unknown, unknown, "dialog-fade", boolean>;
     readonly center: BooleanConstructor;
     readonly alignCenter: BooleanConstructor;
     readonly closeIcon: {
@@ -151,6 +153,7 @@ declare const __VLS_component: import("vue").DefineComponent<{
     readonly center: boolean;
     readonly direction: import("@element-plus/nightly/es/utils").EpPropMergeType<StringConstructor, "ltr" | "rtl" | "ttb" | "btt", unknown>;
     readonly overflow: boolean;
+    readonly transition: import("@element-plus/nightly/es/utils").EpPropMergeType<(new (...args: any[]) => string | import("vue").TransitionProps) | (() => import("@element-plus/nightly/es/components/dialog").DialogTransition) | ((new (...args: any[]) => string | import("vue").TransitionProps) | (() => import("@element-plus/nightly/es/components/dialog").DialogTransition))[], unknown, unknown>;
     readonly size: import("@element-plus/nightly/es/utils").EpPropMergeType<readonly [StringConstructor, NumberConstructor], unknown, unknown>;
     readonly modelValue: boolean;
     readonly ariaLevel: string;

package/lib/components/index.js

@@ -92,7 +92,7 @@ var service = require('./loading/src/service.js');
 var affix = require('./affix/src/affix.js');
 var alert = require('./alert/src/alert.js');
 var autocomplete = require('./autocomplete/src/autocomplete.js');
-var avatar = require('./avatar/src/avatar.js');
+var avatar = require('./avatar/src/avatar2.js');
 var backtop = require('./backtop/src/backtop.js');
 var badge = require('./badge/src/badge.js');
 var breadcrumb = require('./breadcrumb/src/breadcrumb.js');
@@ -100,7 +100,7 @@ var breadcrumbItem = require('./breadcrumb/src/breadcrumb-item.js');
 var constants = require('./breadcrumb/src/constants.js');
 var button = require('./button/src/button.js');
 var constants$1 = require('./button/src/constants.js');
-var calendar = require('./calendar/src/calendar2.js');
+var calendar = require('./calendar/src/calendar.js');
 var card = require('./card/src/card.js');
 var carousel = require('./carousel/src/carousel.js');
 var carouselItem = require('./carousel/src/carousel-item.js');
@@ -124,7 +124,7 @@ var useGlobalConfig = require('./config-provider/src/hooks/use-global-config.js'
 var countdown = require('./countdown/src/countdown.js');
 var constants$6 = require('./date-picker/src/constants.js');
 var datePicker = require('./date-picker/src/props/date-picker.js');
-var description = require('./descriptions/src/description.js');
+var description = require('./descriptions/src/description2.js');
 var descriptionItem = require('./descriptions/src/description-item.js');
 var useDialog = require('./dialog/src/use-dialog.js');
 var dialog = require('./dialog/src/dialog.js');
@@ -171,7 +171,7 @@ var radioButton = require('./radio/src/radio-button.js');
 var constants$b = require('./radio/src/constants.js');
 var rate = require('./rate/src/rate.js');
 var result = require('./result/src/result.js');
-var row = require('./row/src/row.js');
+var row = require('./row/src/row2.js');
 var constants$c = require('./row/src/constants.js');
 var util = require('./scrollbar/src/util.js');
 var scrollbar = require('./scrollbar/src/scrollbar.js');
@@ -189,7 +189,7 @@ var item = require('./space/src/item.js');
 var useSpace = require('./space/src/use-space.js');
 var statistic = require('./statistic/src/statistic2.js');
 var item$1 = require('./steps/src/item.js');
-var steps = require('./steps/src/steps.js');
+var steps = require('./steps/src/steps2.js');
 var tokens$2 = require('./steps/src/tokens.js');
 var _switch = require('./switch/src/switch.js');
 var constants$f = require('./table-v2/src/constants.js');
@@ -230,11 +230,11 @@ var props$1 = require('./virtual-list/src/props.js');
 var watermark = require('./watermark/src/watermark.js');
 var tour = require('./tour/src/tour.js');
 var step = require('./tour/src/step.js');
-var content$3 = require('./tour/src/content.js');
+var content$3 = require('./tour/src/content2.js');
 var anchor = require('./anchor/src/anchor.js');
 var segmented = require('./segmented/src/segmented.js');
-var mention = require('./mention/src/mention.js');
-var splitter = require('./splitter/src/splitter2.js');
+var mention = require('./mention/src/mention2.js');
+var splitter = require('./splitter/src/splitter.js');
 var splitPanel = require('./splitter/src/split-panel.js');
 var message = require('./message/src/message.js');
 var notification = require('./notification/src/notification.js');
@@ -429,6 +429,7 @@ exports.descriptionItemProps = descriptionItem.descriptionItemProps;
 exports.useDialog = useDialog.useDialog;
 exports.dialogEmits = dialog.dialogEmits;
 exports.dialogProps = dialog.dialogProps;
+exports.DEFAULT_DIALOG_TRANSITION = constants$7.DEFAULT_DIALOG_TRANSITION;
 exports.dialogInjectionKey = constants$7.dialogInjectionKey;
 exports.dividerProps = divider.dividerProps;
 exports.drawerEmits = drawer.drawerEmits;

package/lib/components/index.js.map

@@ -1 +1 @@
-{"version":3,"file":"index.js","sources":[],"sourcesContent":[],"names":[],"mappings":";;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;"}
+{"version":3,"file":"index.js","sources":[],"sourcesContent":[],"names":[],"mappings":";;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;"}

package/lib/components/mention/index.js

@@ -2,8 +2,8 @@
 
 Object.defineProperty(exports, '__esModule', { value: true });
 
-var mention$1 = require('./src/mention2.js');
-var mention = require('./src/mention.js');
+var mention$1 = require('./src/mention.js');
+var mention = require('./src/mention2.js');
 var install = require('../../utils/vue/install.js');
 
 const ElMention = install.withInstall(mention$1["default"]);

package/lib/components/mention/src/mention.js

@@ -2,75 +2,294 @@
 
 Object.defineProperty(exports, '__esModule', { value: true });
 
+var vue = require('vue');
+var lodashUnified = require('lodash-unified');
+var index$3 = require('../../input/index.js');
+var index$4 = require('../../tooltip/index.js');
+var mention = require('./mention2.js');
 var helper = require('./helper.js');
-var runtime = require('../../../utils/vue/props/runtime.js');
+var mentionDropdown = require('./mention-dropdown2.js');
+var pluginVue_exportHelper = require('../../../_virtual/plugin-vue_export-helper.js');
 var input = require('../../input/src/input.js');
-var shared = require('@vue/shared');
+var index = require('../../../hooks/use-namespace/index.js');
+var useFormCommonProps = require('../../form/src/hooks/use-form-common-props.js');
+var index$1 = require('../../../hooks/use-id/index.js');
+var index$2 = require('../../../hooks/use-focus-controller/index.js');
 var event = require('../../../constants/event.js');
+var aria = require('../../../constants/aria.js');
+var shared = require('@vue/shared');
 
-const mentionProps = runtime.buildProps({
-  ...input.inputProps,
-  options: {
-    type: runtime.definePropType(Array),
-    default: () => []
-  },
-  prefix: {
-    type: runtime.definePropType([String, Array]),
-    default: "@",
-    validator: (val) => {
-      if (shared.isString(val))
-        return val.length === 1;
-      return val.every((v) => shared.isString(v) && v.length === 1);
-    }
-  },
-  split: {
-    type: String,
-    default: " ",
-    validator: (val) => val.length === 1
-  },
-  filterOption: {
-    type: runtime.definePropType([Boolean, Function]),
-    default: () => helper.filterOption,
-    validator: (val) => {
-      if (val === false)
-        return true;
-      return shared.isFunction(val);
-    }
-  },
-  placement: {
-    type: runtime.definePropType(String),
-    default: "bottom"
-  },
-  showArrow: Boolean,
-  offset: {
-    type: Number,
-    default: 0
-  },
-  whole: Boolean,
-  checkIsWhole: {
-    type: runtime.definePropType(Function)
-  },
-  modelValue: String,
-  loading: Boolean,
-  popperClass: {
-    type: String,
-    default: ""
-  },
-  popperOptions: {
-    type: runtime.definePropType(Object),
-    default: () => ({})
+const __default__ = vue.defineComponent({
+  name: "ElMention",
+  inheritAttrs: false
+});
+const _sfc_main = /* @__PURE__ */ vue.defineComponent({
+  ...__default__,
+  props: mention.mentionProps,
+  emits: mention.mentionEmits,
+  setup(__props, { expose, emit }) {
+    const props = __props;
+    const passInputProps = vue.computed(() => lodashUnified.pick(props, Object.keys(input.inputProps)));
+    const ns = index.useNamespace("mention");
+    const disabled = useFormCommonProps.useFormDisabled();
+    const contentId = index$1.useId();
+    const elInputRef = vue.ref();
+    const tooltipRef = vue.ref();
+    const dropdownRef = vue.ref();
+    const visible = vue.ref(false);
+    const cursorStyle = vue.ref();
+    const mentionCtx = vue.ref();
+    const computedPlacement = vue.computed(() => props.showArrow ? props.placement : `${props.placement}-start`);
+    const computedFallbackPlacements = vue.computed(() => props.showArrow ? ["bottom", "top"] : ["bottom-start", "top-start"]);
+    const filteredOptions = vue.computed(() => {
+      const { filterOption, options } = props;
+      if (!mentionCtx.value || !filterOption)
+        return options;
+      return options.filter((option) => filterOption(mentionCtx.value.pattern, option));
+    });
+    const dropdownVisible = vue.computed(() => {
+      return visible.value && (!!filteredOptions.value.length || props.loading);
+    });
+    const hoveringId = vue.computed(() => {
+      var _a;
+      return `${contentId.value}-${(_a = dropdownRef.value) == null ? void 0 : _a.hoveringIndex}`;
+    });
+    const handleInputChange = (value) => {
+      emit(event.UPDATE_MODEL_EVENT, value);
+      emit(event.INPUT_EVENT, value);
+      syncAfterCursorMove();
+    };
+    const handleInputKeyDown = (event$1) => {
+      var _a, _b, _c, _d;
+      if (!("code" in event$1) || ((_a = elInputRef.value) == null ? void 0 : _a.isComposing))
+        return;
+      switch (event$1.code) {
+        case aria.EVENT_CODE.left:
+        case aria.EVENT_CODE.right:
+          syncAfterCursorMove();
+          break;
+        case aria.EVENT_CODE.up:
+        case aria.EVENT_CODE.down:
+          if (!visible.value)
+            return;
+          event$1.preventDefault();
+          (_b = dropdownRef.value) == null ? void 0 : _b.navigateOptions(event$1.code === aria.EVENT_CODE.up ? "prev" : "next");
+          break;
+        case aria.EVENT_CODE.enter:
+        case aria.EVENT_CODE.numpadEnter:
+          if (!visible.value)
+            return;
+          event$1.preventDefault();
+          if ((_c = dropdownRef.value) == null ? void 0 : _c.hoverOption) {
+            (_d = dropdownRef.value) == null ? void 0 : _d.selectHoverOption();
+          } else {
+            visible.value = false;
+          }
+          break;
+        case aria.EVENT_CODE.esc:
+          if (!visible.value)
+            return;
+          event$1.preventDefault();
+          visible.value = false;
+          break;
+        case aria.EVENT_CODE.backspace:
+          if (props.whole && mentionCtx.value) {
+            const { splitIndex, selectionEnd, pattern, prefixIndex, prefix } = mentionCtx.value;
+            const inputEl = getInputEl();
+            if (!inputEl)
+              return;
+            const inputValue = inputEl.value;
+            const matchOption = props.options.find((item) => item.value === pattern);
+            const isWhole = shared.isFunction(props.checkIsWhole) ? props.checkIsWhole(pattern, prefix) : matchOption;
+            if (isWhole && splitIndex !== -1 && splitIndex + 1 === selectionEnd) {
+              event$1.preventDefault();
+              const newValue = inputValue.slice(0, prefixIndex) + inputValue.slice(splitIndex + 1);
+              emit(event.UPDATE_MODEL_EVENT, newValue);
+              emit(event.INPUT_EVENT, newValue);
+              emit("whole-remove", pattern, prefix);
+              const newSelectionEnd = prefixIndex;
+              vue.nextTick(() => {
+                inputEl.selectionStart = newSelectionEnd;
+                inputEl.selectionEnd = newSelectionEnd;
+                syncDropdownVisible();
+              });
+            }
+          }
+      }
+    };
+    const { wrapperRef } = index$2.useFocusController(elInputRef, {
+      disabled,
+      afterFocus() {
+        syncAfterCursorMove();
+      },
+      beforeBlur(event) {
+        var _a;
+        return (_a = tooltipRef.value) == null ? void 0 : _a.isFocusInsideContent(event);
+      },
+      afterBlur() {
+        visible.value = false;
+      }
+    });
+    const handleInputMouseDown = () => {
+      syncAfterCursorMove();
+    };
+    const handleSelect = (item) => {
+      if (!mentionCtx.value)
+        return;
+      const inputEl = getInputEl();
+      if (!inputEl)
+        return;
+      const inputValue = inputEl.value;
+      const { split } = props;
+      const newEndPart = inputValue.slice(mentionCtx.value.end);
+      const alreadySeparated = newEndPart.startsWith(split);
+      const newMiddlePart = `${item.value}${alreadySeparated ? "" : split}`;
+      const newValue = inputValue.slice(0, mentionCtx.value.start) + newMiddlePart + newEndPart;
+      emit(event.UPDATE_MODEL_EVENT, newValue);
+      emit(event.INPUT_EVENT, newValue);
+      emit("select", item, mentionCtx.value.prefix);
+      const newSelectionEnd = mentionCtx.value.start + newMiddlePart.length + (alreadySeparated ? 1 : 0);
+      vue.nextTick(() => {
+        inputEl.selectionStart = newSelectionEnd;
+        inputEl.selectionEnd = newSelectionEnd;
+        inputEl.focus();
+        syncDropdownVisible();
+      });
+    };
+    const getInputEl = () => {
+      var _a, _b;
+      return props.type === "textarea" ? (_a = elInputRef.value) == null ? void 0 : _a.textarea : (_b = elInputRef.value) == null ? void 0 : _b.input;
+    };
+    const syncAfterCursorMove = () => {
+      setTimeout(() => {
+        syncCursor();
+        syncDropdownVisible();
+        vue.nextTick(() => {
+          var _a;
+          return (_a = tooltipRef.value) == null ? void 0 : _a.updatePopper();
+        });
+      }, 0);
+    };
+    const syncCursor = () => {
+      const inputEl = getInputEl();
+      if (!inputEl)
+        return;
+      const caretPosition = helper.getCursorPosition(inputEl);
+      const inputRect = inputEl.getBoundingClientRect();
+      const elInputRect = elInputRef.value.$el.getBoundingClientRect();
+      cursorStyle.value = {
+        position: "absolute",
+        width: 0,
+        height: `${caretPosition.height}px`,
+        left: `${caretPosition.left + inputRect.left - elInputRect.left}px`,
+        top: `${caretPosition.top + inputRect.top - elInputRect.top}px`
+      };
+    };
+    const syncDropdownVisible = () => {
+      const inputEl = getInputEl();
+      if (document.activeElement !== inputEl) {
+        visible.value = false;
+        return;
+      }
+      const { prefix, split } = props;
+      mentionCtx.value = helper.getMentionCtx(inputEl, prefix, split);
+      if (mentionCtx.value && mentionCtx.value.splitIndex === -1) {
+        visible.value = true;
+        emit("search", mentionCtx.value.pattern, mentionCtx.value.prefix);
+        return;
+      }
+      visible.value = false;
+    };
+    expose({
+      input: elInputRef,
+      tooltip: tooltipRef,
+      dropdownVisible
+    });
+    return (_ctx, _cache) => {
+      return vue.openBlock(), vue.createElementBlock("div", {
+        ref_key: "wrapperRef",
+        ref: wrapperRef,
+        class: vue.normalizeClass(vue.unref(ns).b())
+      }, [
+        vue.createVNode(vue.unref(index$3.ElInput), vue.mergeProps(vue.mergeProps(vue.unref(passInputProps), _ctx.$attrs), {
+          ref_key: "elInputRef",
+          ref: elInputRef,
+          "model-value": _ctx.modelValue,
+          disabled: vue.unref(disabled),
+          role: vue.unref(dropdownVisible) ? "combobox" : void 0,
+          "aria-activedescendant": vue.unref(dropdownVisible) ? vue.unref(hoveringId) || "" : void 0,
+          "aria-controls": vue.unref(dropdownVisible) ? vue.unref(contentId) : void 0,
+          "aria-expanded": vue.unref(dropdownVisible) || void 0,
+          "aria-label": _ctx.ariaLabel,
+          "aria-autocomplete": vue.unref(dropdownVisible) ? "none" : void 0,
+          "aria-haspopup": vue.unref(dropdownVisible) ? "listbox" : void 0,
+          onInput: handleInputChange,
+          onKeydown: handleInputKeyDown,
+          onMousedown: handleInputMouseDown
+        }), vue.createSlots({
+          _: 2
+        }, [
+          vue.renderList(_ctx.$slots, (_, name) => {
+            return {
+              name,
+              fn: vue.withCtx((slotProps) => [
+                vue.renderSlot(_ctx.$slots, name, vue.normalizeProps(vue.guardReactiveProps(slotProps)))
+              ])
+            };
+          })
+        ]), 1040, ["model-value", "disabled", "role", "aria-activedescendant", "aria-controls", "aria-expanded", "aria-label", "aria-autocomplete", "aria-haspopup"]),
+        vue.createVNode(vue.unref(index$4.ElTooltip), {
+          ref_key: "tooltipRef",
+          ref: tooltipRef,
+          visible: vue.unref(dropdownVisible),
+          "popper-class": [vue.unref(ns).e("popper"), _ctx.popperClass],
+          "popper-options": _ctx.popperOptions,
+          placement: vue.unref(computedPlacement),
+          "fallback-placements": vue.unref(computedFallbackPlacements),
+          effect: "light",
+          pure: "",
+          offset: _ctx.offset,
+          "show-arrow": _ctx.showArrow
+        }, {
+          default: vue.withCtx(() => [
+            vue.createElementVNode("div", {
+              style: vue.normalizeStyle(cursorStyle.value)
+            }, null, 4)
+          ]),
+          content: vue.withCtx(() => {
+            var _a;
+            return [
+              vue.createVNode(mentionDropdown["default"], {
+                ref_key: "dropdownRef",
+                ref: dropdownRef,
+                options: vue.unref(filteredOptions),
+                disabled: vue.unref(disabled),
+                loading: _ctx.loading,
+                "content-id": vue.unref(contentId),
+                "aria-label": _ctx.ariaLabel,
+                onSelect: handleSelect,
+                onClick: vue.withModifiers((_a = elInputRef.value) == null ? void 0 : _a.focus, ["stop"])
+              }, vue.createSlots({
+                _: 2
+              }, [
+                vue.renderList(_ctx.$slots, (_, name) => {
+                  return {
+                    name,
+                    fn: vue.withCtx((slotProps) => [
+                      vue.renderSlot(_ctx.$slots, name, vue.normalizeProps(vue.guardReactiveProps(slotProps)))
+                    ])
+                  };
+                })
+              ]), 1032, ["options", "disabled", "loading", "content-id", "aria-label", "onClick"])
+            ];
+          }),
+          _: 3
+        }, 8, ["visible", "popper-class", "popper-options", "placement", "fallback-placements", "offset", "show-arrow"])
+      ], 2);
+    };
   }
 });
-const mentionEmits = {
-  [event.UPDATE_MODEL_EVENT]: (value) => shared.isString(value),
-  "whole-remove": (pattern, prefix) => shared.isString(pattern) && shared.isString(prefix),
-  input: (value) => shared.isString(value),
-  search: (pattern, prefix) => shared.isString(pattern) && shared.isString(prefix),
-  select: (option, prefix) => shared.isString(option.value) && shared.isString(prefix),
-  focus: (evt) => evt instanceof FocusEvent,
-  blur: (evt) => evt instanceof FocusEvent
-};
+var Mention = /* @__PURE__ */ pluginVue_exportHelper["default"](_sfc_main, [["__file", "mention.vue"]]);
 
-exports.mentionEmits = mentionEmits;
-exports.mentionProps = mentionProps;
+exports["default"] = Mention;
 //# sourceMappingURL=mention.js.map