@element-plus/nightly 0.0.20251107 → 0.0.20251108

package/es/components/image-viewer/src/image-viewer2.mjs.map

@@ -1 +1 @@
-{"version":3,"file":"image-viewer2.mjs","sources":["../../../../../../packages/components/image-viewer/src/image-viewer.vue"],"sourcesContent":["<template>\n  <el-teleport to=\"body\" :disabled=\"!teleported\">\n    <transition name=\"viewer-fade\" appear>\n      <div\n        ref=\"wrapper\"\n        :tabindex=\"-1\"\n        :class=\"ns.e('wrapper')\"\n        :style=\"{ zIndex }\"\n      >\n        <el-focus-trap\n          loop\n          trapped\n          :focus-trap-el=\"wrapper\"\n          focus-start-el=\"container\"\n          @focusout-prevented=\"onFocusoutPrevented\"\n          @release-requested=\"onCloseRequested\"\n        >\n          <div :class=\"ns.e('mask')\" @click.self=\"hideOnClickModal && hide()\" />\n\n          <!-- CLOSE -->\n          <span :class=\"[ns.e('btn'), ns.e('close')]\" @click=\"hide\">\n            <el-icon>\n              <Close />\n            </el-icon>\n          </span>\n\n          <!-- ARROW -->\n          <template v-if=\"!isSingle\">\n            <span :class=\"arrowPrevKls\" @click=\"prev\">\n              <el-icon>\n                <ArrowLeft />\n              </el-icon>\n            </span>\n            <span :class=\"arrowNextKls\" @click=\"next\">\n              <el-icon>\n                <ArrowRight />\n              </el-icon>\n            </span>\n          </template>\n          <div\n            v-if=\"$slots.progress || showProgress\"\n            :class=\"[ns.e('btn'), ns.e('progress')]\"\n          >\n            <slot\n              name=\"progress\"\n              :active-index=\"activeIndex\"\n              :total=\"urlList.length\"\n            >\n              {{ progress }}\n            </slot>\n          </div>\n          <!-- ACTIONS -->\n          <div :class=\"[ns.e('btn'), ns.e('actions')]\">\n            <div :class=\"ns.e('actions__inner')\">\n              <slot\n                name=\"toolbar\"\n                :actions=\"handleActions\"\n                :prev=\"prev\"\n                :next=\"next\"\n                :reset=\"toggleMode\"\n                :active-index=\"activeIndex\"\n                :set-active-item=\"setActiveItem\"\n              >\n                <el-icon @click=\"handleActions('zoomOut')\">\n                  <ZoomOut />\n                </el-icon>\n                <el-icon @click=\"handleActions('zoomIn')\">\n                  <ZoomIn />\n                </el-icon>\n                <i :class=\"ns.e('actions__divider')\" />\n                <el-icon @click=\"toggleMode\">\n                  <component :is=\"mode.icon\" />\n                </el-icon>\n                <i :class=\"ns.e('actions__divider')\" />\n                <el-icon @click=\"handleActions('anticlockwise')\">\n                  <RefreshLeft />\n                </el-icon>\n                <el-icon @click=\"handleActions('clockwise')\">\n                  <RefreshRight />\n                </el-icon>\n              </slot>\n            </div>\n          </div>\n          <!-- CANVAS -->\n          <div :class=\"ns.e('canvas')\">\n            <slot\n              v-if=\"loadError && $slots['viewer-error']\"\n              name=\"viewer-error\"\n              :active-index=\"activeIndex\"\n              :src=\"currentImg\"\n            />\n            <img\n              v-else\n              ref=\"imgRef\"\n              :key=\"currentImg\"\n              :src=\"currentImg\"\n              :style=\"imgStyle\"\n              :class=\"ns.e('img')\"\n              :crossorigin=\"crossorigin\"\n              @load=\"handleImgLoad\"\n              @error=\"handleImgError\"\n              @mousedown=\"handleMouseDown\"\n            />\n          </div>\n          <slot />\n        </el-focus-trap>\n      </div>\n    </transition>\n  </el-teleport>\n</template>\n\n<script lang=\"ts\" setup>\nimport {\n  computed,\n  effectScope,\n  markRaw,\n  nextTick,\n  onMounted,\n  ref,\n  shallowRef,\n  watch,\n} from 'vue'\nimport { clamp, useEventListener } from '@vueuse/core'\nimport { throttle } from 'lodash-unified'\nimport { useLocale, useNamespace, useZIndex } from '@element-plus/hooks'\nimport { EVENT_CODE } from '@element-plus/constants'\nimport { getEventCode, keysOf } from '@element-plus/utils'\nimport ElFocusTrap from '@element-plus/components/focus-trap'\nimport ElTeleport from '@element-plus/components/teleport'\nimport ElIcon from '@element-plus/components/icon'\nimport {\n  ArrowLeft,\n  ArrowRight,\n  Close,\n  FullScreen,\n  RefreshLeft,\n  RefreshRight,\n  ScaleToOriginal,\n  ZoomIn,\n  ZoomOut,\n} from '@element-plus/icons-vue'\nimport { imageViewerEmits, imageViewerProps } from './image-viewer'\n\nimport type { CSSProperties } from 'vue'\nimport type { ImageViewerAction, ImageViewerMode } from './image-viewer'\n\nconst modes: Record<'CONTAIN' | 'ORIGINAL', ImageViewerMode> = {\n  CONTAIN: {\n    name: 'contain',\n    icon: markRaw(FullScreen),\n  },\n  ORIGINAL: {\n    name: 'original',\n    icon: markRaw(ScaleToOriginal),\n  },\n}\n\ndefineOptions({\n  name: 'ElImageViewer',\n})\n\nconst props = defineProps(imageViewerProps)\nconst emit = defineEmits(imageViewerEmits)\n\nlet stopWheelListener: (() => void) | undefined\nlet prevOverflow = ''\n\nconst { t } = useLocale()\nconst ns = useNamespace('image-viewer')\nconst { nextZIndex } = useZIndex()\nconst wrapper = ref<HTMLDivElement>()\nconst imgRef = ref<HTMLImageElement>()\n\nconst scopeEventListener = effectScope()\n\nconst scaleClamped = computed(() => {\n  const { scale, minScale, maxScale } = props\n  return clamp(scale, minScale, maxScale)\n})\n\nconst loading = ref(true)\nconst loadError = ref(false)\nconst activeIndex = ref(props.initialIndex)\nconst mode = shallowRef<ImageViewerMode>(modes.CONTAIN)\nconst transform = ref({\n  scale: scaleClamped.value,\n  deg: 0,\n  offsetX: 0,\n  offsetY: 0,\n  enableTransition: false,\n})\nconst zIndex = ref(props.zIndex ?? nextZIndex())\n\nconst isSingle = computed(() => {\n  const { urlList } = props\n  return urlList.length <= 1\n})\n\nconst isFirst = computed(() => activeIndex.value === 0)\n\nconst isLast = computed(() => activeIndex.value === props.urlList.length - 1)\n\nconst currentImg = computed(() => props.urlList[activeIndex.value])\n\nconst arrowPrevKls = computed(() => [\n  ns.e('btn'),\n  ns.e('prev'),\n  ns.is('disabled', !props.infinite && isFirst.value),\n])\n\nconst arrowNextKls = computed(() => [\n  ns.e('btn'),\n  ns.e('next'),\n  ns.is('disabled', !props.infinite && isLast.value),\n])\n\nconst imgStyle = computed(() => {\n  const { scale, deg, offsetX, offsetY, enableTransition } = transform.value\n  let translateX = offsetX / scale\n  let translateY = offsetY / scale\n\n  const radian = (deg * Math.PI) / 180\n  const cosRadian = Math.cos(radian)\n  const sinRadian = Math.sin(radian)\n  translateX = translateX * cosRadian + translateY * sinRadian\n  translateY = translateY * cosRadian - (offsetX / scale) * sinRadian\n\n  const style: CSSProperties = {\n    transform: `scale(${scale}) rotate(${deg}deg) translate(${translateX}px, ${translateY}px)`,\n    transition: enableTransition ? 'transform .3s' : '',\n  }\n  if (mode.value.name === modes.CONTAIN.name) {\n    style.maxWidth = style.maxHeight = '100%'\n  }\n  return style\n})\n\nconst progress = computed(\n  () => `${activeIndex.value + 1} / ${props.urlList.length}`\n)\n\nfunction hide() {\n  unregisterEventListener()\n  stopWheelListener?.()\n  document.body.style.overflow = prevOverflow\n  emit('close')\n}\n\nfunction registerEventListener() {\n  const keydownHandler = throttle((e: KeyboardEvent) => {\n    const code = getEventCode(e)\n\n    switch (code) {\n      // ESC\n      case EVENT_CODE.esc:\n        props.closeOnPressEscape && hide()\n        break\n      // SPACE\n      case EVENT_CODE.space:\n        toggleMode()\n        break\n      // LEFT_ARROW\n      case EVENT_CODE.left:\n        prev()\n        break\n      // UP_ARROW\n      case EVENT_CODE.up:\n        handleActions('zoomIn')\n        break\n      // RIGHT_ARROW\n      case EVENT_CODE.right:\n        next()\n        break\n      // DOWN_ARROW\n      case EVENT_CODE.down:\n        handleActions('zoomOut')\n        break\n    }\n  })\n  const mousewheelHandler = throttle((e: WheelEvent) => {\n    const delta = e.deltaY || e.deltaX\n    handleActions(delta < 0 ? 'zoomIn' : 'zoomOut', {\n      zoomRate: props.zoomRate,\n      enableTransition: false,\n    })\n  })\n\n  scopeEventListener.run(() => {\n    useEventListener(document, 'keydown', keydownHandler)\n    useEventListener(document, 'wheel', mousewheelHandler)\n  })\n}\n\nfunction unregisterEventListener() {\n  scopeEventListener.stop()\n}\n\nfunction handleImgLoad() {\n  loading.value = false\n}\n\nfunction handleImgError(e: Event) {\n  loadError.value = true\n  loading.value = false\n  emit('error', e)\n  ;(e.target as HTMLImageElement).alt = t('el.image.error')\n}\n\nfunction handleMouseDown(e: MouseEvent) {\n  if (loading.value || e.button !== 0 || !wrapper.value) return\n  transform.value.enableTransition = false\n\n  const { offsetX, offsetY } = transform.value\n  const startX = e.pageX\n  const startY = e.pageY\n\n  const dragHandler = throttle((ev: MouseEvent) => {\n    transform.value = {\n      ...transform.value,\n      offsetX: offsetX + ev.pageX - startX,\n      offsetY: offsetY + ev.pageY - startY,\n    }\n  })\n  const removeMousemove = useEventListener(document, 'mousemove', dragHandler)\n  useEventListener(document, 'mouseup', () => {\n    removeMousemove()\n  })\n\n  e.preventDefault()\n}\n\nfunction reset() {\n  transform.value = {\n    scale: scaleClamped.value,\n    deg: 0,\n    offsetX: 0,\n    offsetY: 0,\n    enableTransition: false,\n  }\n}\n\nfunction toggleMode() {\n  if (loading.value || loadError.value) return\n\n  const modeNames = keysOf(modes)\n  const modeValues = Object.values(modes)\n  const currentMode = mode.value.name\n  const index = modeValues.findIndex((i) => i.name === currentMode)\n  const nextIndex = (index + 1) % modeNames.length\n  mode.value = modes[modeNames[nextIndex]]\n  reset()\n}\n\nfunction setActiveItem(index: number) {\n  loadError.value = false\n  const len = props.urlList.length\n  activeIndex.value = (index + len) % len\n}\n\nfunction prev() {\n  if (isFirst.value && !props.infinite) return\n  setActiveItem(activeIndex.value - 1)\n}\n\nfunction next() {\n  if (isLast.value && !props.infinite) return\n  setActiveItem(activeIndex.value + 1)\n}\n\nfunction handleActions(action: ImageViewerAction, options = {}) {\n  if (loading.value || loadError.value) return\n  const { minScale, maxScale } = props\n  const { zoomRate, rotateDeg, enableTransition } = {\n    zoomRate: props.zoomRate,\n    rotateDeg: 90,\n    enableTransition: true,\n    ...options,\n  }\n  switch (action) {\n    case 'zoomOut':\n      if (transform.value.scale > minScale) {\n        transform.value.scale = Number.parseFloat(\n          (transform.value.scale / zoomRate).toFixed(3)\n        )\n      }\n      break\n    case 'zoomIn':\n      if (transform.value.scale < maxScale) {\n        transform.value.scale = Number.parseFloat(\n          (transform.value.scale * zoomRate).toFixed(3)\n        )\n      }\n      break\n    case 'clockwise':\n      transform.value.deg += rotateDeg\n      emit('rotate', transform.value.deg)\n      break\n    case 'anticlockwise':\n      transform.value.deg -= rotateDeg\n      emit('rotate', transform.value.deg)\n      break\n  }\n  transform.value.enableTransition = enableTransition\n}\n\nfunction onFocusoutPrevented(event: CustomEvent) {\n  if (event.detail?.focusReason === 'pointer') {\n    event.preventDefault()\n  }\n}\n\nfunction onCloseRequested() {\n  if (props.closeOnPressEscape) {\n    hide()\n  }\n}\n\nfunction wheelHandler(e: WheelEvent) {\n  if (!e.ctrlKey) return\n\n  if (e.deltaY < 0) {\n    e.preventDefault()\n    return false\n  } else if (e.deltaY > 0) {\n    e.preventDefault()\n    return false\n  }\n}\n\nwatch(\n  () => scaleClamped.value,\n  (val) => {\n    transform.value.scale = val\n  }\n)\n\nwatch(currentImg, () => {\n  nextTick(() => {\n    const $img = imgRef.value\n    if (!$img?.complete) {\n      loading.value = true\n    }\n  })\n})\n\nwatch(activeIndex, (val) => {\n  reset()\n  emit('switch', val)\n})\n\nonMounted(() => {\n  registerEventListener()\n\n  stopWheelListener = useEventListener('wheel', wheelHandler, {\n    passive: false,\n  })\n\n  // prevent body scroll\n  prevOverflow = document.body.style.overflow\n  document.body.style.overflow = 'hidden'\n})\n\ndefineExpose({\n  /**\n   * @description manually switch image\n   */\n  setActiveItem,\n})\n</script>\n"],"names":["_openBlock","_createBlock","_unref"],"mappings":"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"}
+{"version":3,"file":"image-viewer2.mjs","sources":["../../../../../../packages/components/image-viewer/src/image-viewer.vue"],"sourcesContent":["<template>\n  <el-teleport to=\"body\" :disabled=\"!teleported\">\n    <transition name=\"viewer-fade\" appear>\n      <div\n        ref=\"wrapper\"\n        :tabindex=\"-1\"\n        :class=\"ns.e('wrapper')\"\n        :style=\"{ zIndex }\"\n      >\n        <el-focus-trap\n          loop\n          trapped\n          :focus-trap-el=\"wrapper\"\n          focus-start-el=\"container\"\n          @focusout-prevented=\"onFocusoutPrevented\"\n          @release-requested=\"onCloseRequested\"\n        >\n          <div :class=\"ns.e('mask')\" @click.self=\"hideOnClickModal && hide()\" />\n\n          <!-- CLOSE -->\n          <span :class=\"[ns.e('btn'), ns.e('close')]\" @click=\"hide\">\n            <el-icon>\n              <Close />\n            </el-icon>\n          </span>\n\n          <!-- ARROW -->\n          <template v-if=\"!isSingle\">\n            <span :class=\"arrowPrevKls\" @click=\"prev\">\n              <el-icon>\n                <ArrowLeft />\n              </el-icon>\n            </span>\n            <span :class=\"arrowNextKls\" @click=\"next\">\n              <el-icon>\n                <ArrowRight />\n              </el-icon>\n            </span>\n          </template>\n          <div\n            v-if=\"$slots.progress || showProgress\"\n            :class=\"[ns.e('btn'), ns.e('progress')]\"\n          >\n            <slot\n              name=\"progress\"\n              :active-index=\"activeIndex\"\n              :total=\"urlList.length\"\n            >\n              {{ progress }}\n            </slot>\n          </div>\n          <!-- ACTIONS -->\n          <div :class=\"[ns.e('btn'), ns.e('actions')]\">\n            <div :class=\"ns.e('actions__inner')\">\n              <slot\n                name=\"toolbar\"\n                :actions=\"handleActions\"\n                :prev=\"prev\"\n                :next=\"next\"\n                :reset=\"toggleMode\"\n                :active-index=\"activeIndex\"\n                :set-active-item=\"setActiveItem\"\n              >\n                <el-icon @click=\"handleActions('zoomOut')\">\n                  <ZoomOut />\n                </el-icon>\n                <el-icon @click=\"handleActions('zoomIn')\">\n                  <ZoomIn />\n                </el-icon>\n                <i :class=\"ns.e('actions__divider')\" />\n                <el-icon @click=\"toggleMode\">\n                  <component :is=\"mode.icon\" />\n                </el-icon>\n                <i :class=\"ns.e('actions__divider')\" />\n                <el-icon @click=\"handleActions('anticlockwise')\">\n                  <RefreshLeft />\n                </el-icon>\n                <el-icon @click=\"handleActions('clockwise')\">\n                  <RefreshRight />\n                </el-icon>\n              </slot>\n            </div>\n          </div>\n          <!-- CANVAS -->\n          <div :class=\"ns.e('canvas')\">\n            <slot\n              v-if=\"loadError && $slots['viewer-error']\"\n              name=\"viewer-error\"\n              :active-index=\"activeIndex\"\n              :src=\"currentImg\"\n            />\n            <img\n              v-else\n              ref=\"imgRef\"\n              :key=\"currentImg\"\n              :src=\"currentImg\"\n              :style=\"imgStyle\"\n              :class=\"ns.e('img')\"\n              :crossorigin=\"crossorigin\"\n              @load=\"handleImgLoad\"\n              @error=\"handleImgError\"\n              @mousedown=\"handleMouseDown\"\n            />\n          </div>\n          <slot />\n        </el-focus-trap>\n      </div>\n    </transition>\n  </el-teleport>\n</template>\n\n<script lang=\"ts\" setup>\nimport {\n  computed,\n  effectScope,\n  markRaw,\n  nextTick,\n  onMounted,\n  ref,\n  shallowRef,\n  watch,\n} from 'vue'\nimport { clamp, useEventListener } from '@vueuse/core'\nimport { throttle } from 'lodash-unified'\nimport { useLocale, useNamespace, useZIndex } from '@element-plus/hooks'\nimport { EVENT_CODE } from '@element-plus/constants'\nimport { getEventCode, keysOf } from '@element-plus/utils'\nimport ElFocusTrap from '@element-plus/components/focus-trap'\nimport ElTeleport from '@element-plus/components/teleport'\nimport ElIcon from '@element-plus/components/icon'\nimport {\n  ArrowLeft,\n  ArrowRight,\n  Close,\n  FullScreen,\n  RefreshLeft,\n  RefreshRight,\n  ScaleToOriginal,\n  ZoomIn,\n  ZoomOut,\n} from '@element-plus/icons-vue'\nimport { imageViewerEmits, imageViewerProps } from './image-viewer'\n\nimport type { CSSProperties } from 'vue'\nimport type { ImageViewerAction, ImageViewerMode } from './image-viewer'\n\nconst modes: Record<'CONTAIN' | 'ORIGINAL', ImageViewerMode> = {\n  CONTAIN: {\n    name: 'contain',\n    icon: markRaw(FullScreen),\n  },\n  ORIGINAL: {\n    name: 'original',\n    icon: markRaw(ScaleToOriginal),\n  },\n}\n\ndefineOptions({\n  name: 'ElImageViewer',\n})\n\nconst props = defineProps(imageViewerProps)\nconst emit = defineEmits(imageViewerEmits)\n\nlet stopWheelListener: (() => void) | undefined\nlet prevOverflow = ''\n\nconst { t } = useLocale()\nconst ns = useNamespace('image-viewer')\nconst { nextZIndex } = useZIndex()\nconst wrapper = ref<HTMLDivElement>()\nconst imgRef = ref<HTMLImageElement>()\n\nconst scopeEventListener = effectScope()\n\nconst scaleClamped = computed(() => {\n  const { scale, minScale, maxScale } = props\n  return clamp(scale, minScale, maxScale)\n})\n\nconst loading = ref(true)\nconst loadError = ref(false)\nconst activeIndex = ref(props.initialIndex)\nconst mode = shallowRef<ImageViewerMode>(modes.CONTAIN)\nconst transform = ref({\n  scale: scaleClamped.value,\n  deg: 0,\n  offsetX: 0,\n  offsetY: 0,\n  enableTransition: false,\n})\nconst zIndex = ref(props.zIndex ?? nextZIndex())\n\nconst isSingle = computed(() => {\n  const { urlList } = props\n  return urlList.length <= 1\n})\n\nconst isFirst = computed(() => activeIndex.value === 0)\n\nconst isLast = computed(() => activeIndex.value === props.urlList.length - 1)\n\nconst currentImg = computed(() => props.urlList[activeIndex.value])\n\nconst arrowPrevKls = computed(() => [\n  ns.e('btn'),\n  ns.e('prev'),\n  ns.is('disabled', !props.infinite && isFirst.value),\n])\n\nconst arrowNextKls = computed(() => [\n  ns.e('btn'),\n  ns.e('next'),\n  ns.is('disabled', !props.infinite && isLast.value),\n])\n\nconst imgStyle = computed(() => {\n  const { scale, deg, offsetX, offsetY, enableTransition } = transform.value\n  let translateX = offsetX / scale\n  let translateY = offsetY / scale\n\n  const radian = (deg * Math.PI) / 180\n  const cosRadian = Math.cos(radian)\n  const sinRadian = Math.sin(radian)\n  translateX = translateX * cosRadian + translateY * sinRadian\n  translateY = translateY * cosRadian - (offsetX / scale) * sinRadian\n\n  const style: CSSProperties = {\n    transform: `scale(${scale}) rotate(${deg}deg) translate(${translateX}px, ${translateY}px)`,\n    transition: enableTransition ? 'transform .3s' : '',\n  }\n  if (mode.value.name === modes.CONTAIN.name) {\n    style.maxWidth = style.maxHeight = '100%'\n  }\n  return style\n})\n\nconst progress = computed(\n  () => `${activeIndex.value + 1} / ${props.urlList.length}`\n)\n\nfunction hide() {\n  unregisterEventListener()\n  stopWheelListener?.()\n  document.body.style.overflow = prevOverflow\n  emit('close')\n}\n\nfunction registerEventListener() {\n  const keydownHandler = throttle((e: KeyboardEvent) => {\n    const code = getEventCode(e)\n\n    switch (code) {\n      // ESC\n      case EVENT_CODE.esc:\n        props.closeOnPressEscape && hide()\n        break\n      // SPACE\n      case EVENT_CODE.space:\n        toggleMode()\n        break\n      // LEFT_ARROW\n      case EVENT_CODE.left:\n        prev()\n        break\n      // UP_ARROW\n      case EVENT_CODE.up:\n        handleActions('zoomIn')\n        break\n      // RIGHT_ARROW\n      case EVENT_CODE.right:\n        next()\n        break\n      // DOWN_ARROW\n      case EVENT_CODE.down:\n        handleActions('zoomOut')\n        break\n    }\n  })\n  const mousewheelHandler = throttle((e: WheelEvent) => {\n    const delta = e.deltaY || e.deltaX\n    handleActions(delta < 0 ? 'zoomIn' : 'zoomOut', {\n      zoomRate: props.zoomRate,\n      enableTransition: false,\n    })\n  })\n\n  scopeEventListener.run(() => {\n    useEventListener(document, 'keydown', keydownHandler)\n    useEventListener(wrapper, 'wheel', mousewheelHandler)\n  })\n}\n\nfunction unregisterEventListener() {\n  scopeEventListener.stop()\n}\n\nfunction handleImgLoad() {\n  loading.value = false\n}\n\nfunction handleImgError(e: Event) {\n  loadError.value = true\n  loading.value = false\n  emit('error', e)\n  ;(e.target as HTMLImageElement).alt = t('el.image.error')\n}\n\nfunction handleMouseDown(e: MouseEvent) {\n  if (loading.value || e.button !== 0 || !wrapper.value) return\n  transform.value.enableTransition = false\n\n  const { offsetX, offsetY } = transform.value\n  const startX = e.pageX\n  const startY = e.pageY\n\n  const dragHandler = throttle((ev: MouseEvent) => {\n    transform.value = {\n      ...transform.value,\n      offsetX: offsetX + ev.pageX - startX,\n      offsetY: offsetY + ev.pageY - startY,\n    }\n  })\n  const removeMousemove = useEventListener(document, 'mousemove', dragHandler)\n  useEventListener(document, 'mouseup', () => {\n    removeMousemove()\n  })\n\n  e.preventDefault()\n}\n\nfunction reset() {\n  transform.value = {\n    scale: scaleClamped.value,\n    deg: 0,\n    offsetX: 0,\n    offsetY: 0,\n    enableTransition: false,\n  }\n}\n\nfunction toggleMode() {\n  if (loading.value || loadError.value) return\n\n  const modeNames = keysOf(modes)\n  const modeValues = Object.values(modes)\n  const currentMode = mode.value.name\n  const index = modeValues.findIndex((i) => i.name === currentMode)\n  const nextIndex = (index + 1) % modeNames.length\n  mode.value = modes[modeNames[nextIndex]]\n  reset()\n}\n\nfunction setActiveItem(index: number) {\n  loadError.value = false\n  const len = props.urlList.length\n  activeIndex.value = (index + len) % len\n}\n\nfunction prev() {\n  if (isFirst.value && !props.infinite) return\n  setActiveItem(activeIndex.value - 1)\n}\n\nfunction next() {\n  if (isLast.value && !props.infinite) return\n  setActiveItem(activeIndex.value + 1)\n}\n\nfunction handleActions(action: ImageViewerAction, options = {}) {\n  if (loading.value || loadError.value) return\n  const { minScale, maxScale } = props\n  const { zoomRate, rotateDeg, enableTransition } = {\n    zoomRate: props.zoomRate,\n    rotateDeg: 90,\n    enableTransition: true,\n    ...options,\n  }\n  switch (action) {\n    case 'zoomOut':\n      if (transform.value.scale > minScale) {\n        transform.value.scale = Number.parseFloat(\n          (transform.value.scale / zoomRate).toFixed(3)\n        )\n      }\n      break\n    case 'zoomIn':\n      if (transform.value.scale < maxScale) {\n        transform.value.scale = Number.parseFloat(\n          (transform.value.scale * zoomRate).toFixed(3)\n        )\n      }\n      break\n    case 'clockwise':\n      transform.value.deg += rotateDeg\n      emit('rotate', transform.value.deg)\n      break\n    case 'anticlockwise':\n      transform.value.deg -= rotateDeg\n      emit('rotate', transform.value.deg)\n      break\n  }\n  transform.value.enableTransition = enableTransition\n}\n\nfunction onFocusoutPrevented(event: CustomEvent) {\n  if (event.detail?.focusReason === 'pointer') {\n    event.preventDefault()\n  }\n}\n\nfunction onCloseRequested() {\n  if (props.closeOnPressEscape) {\n    hide()\n  }\n}\n\nfunction wheelHandler(e: WheelEvent) {\n  if (!e.ctrlKey) return\n\n  if (e.deltaY < 0) {\n    e.preventDefault()\n    return false\n  } else if (e.deltaY > 0) {\n    e.preventDefault()\n    return false\n  }\n}\n\nwatch(\n  () => scaleClamped.value,\n  (val) => {\n    transform.value.scale = val\n  }\n)\n\nwatch(currentImg, () => {\n  nextTick(() => {\n    const $img = imgRef.value\n    if (!$img?.complete) {\n      loading.value = true\n    }\n  })\n})\n\nwatch(activeIndex, (val) => {\n  reset()\n  emit('switch', val)\n})\n\nonMounted(() => {\n  registerEventListener()\n\n  stopWheelListener = useEventListener('wheel', wheelHandler, {\n    passive: false,\n  })\n\n  // prevent body scroll\n  prevOverflow = document.body.style.overflow\n  document.body.style.overflow = 'hidden'\n})\n\ndefineExpose({\n  /**\n   * @description manually switch image\n   */\n  setActiveItem,\n})\n</script>\n"],"names":["_openBlock","_createBlock","_unref"],"mappings":"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"}

package/es/components/index.mjs

@@ -87,8 +87,8 @@ export { default as FixedSizeGrid } from './virtual-list/src/components/fixed-si
 export { default as DynamicSizeGrid } from './virtual-list/src/components/dynamic-size-grid.mjs';
 export { default as ElLoadingDirective, default as vLoading } from './loading/src/directive.mjs';
 export { default as ElLoadingService } from './loading/src/service.mjs';
-export { affixEmits, affixProps } from './affix/src/affix2.mjs';
-export { alertEffects, alertEmits, alertProps } from './alert/src/alert2.mjs';
+export { affixEmits, affixProps } from './affix/src/affix.mjs';
+export { alertEffects, alertEmits, alertProps } from './alert/src/alert.mjs';
 export { autocompleteEmits, autocompleteProps } from './autocomplete/src/autocomplete.mjs';
 export { avatarEmits, avatarProps } from './avatar/src/avatar.mjs';
 export { backtopEmits, backtopProps } from './backtop/src/backtop.mjs';
@@ -100,19 +100,19 @@ export { buttonEmits, buttonNativeTypes, buttonProps, buttonTypes } from './butt
 export { buttonGroupContextKey } from './button/src/constants.mjs';
 export { calendarEmits, calendarProps } from './calendar/src/calendar.mjs';
 export { cardContextKey, cardProps } from './card/src/card.mjs';
-export { carouselEmits, carouselProps } from './carousel/src/carousel2.mjs';
+export { carouselEmits, carouselProps } from './carousel/src/carousel.mjs';
 export { carouselItemProps } from './carousel/src/carousel-item.mjs';
 export { CAROUSEL_ITEM_NAME, carouselContextKey } from './carousel/src/constants.mjs';
 export { cascaderEmits, cascaderProps } from './cascader/src/cascader.mjs';
 export { CASCADER_PANEL_INJECTION_KEY } from './cascader-panel/src/types.mjs';
 export { CommonProps, DefaultProps, cascaderPanelEmits, cascaderPanelProps, useCascaderConfig } from './cascader-panel/src/config.mjs';
 export { checkTagEmits, checkTagProps } from './check-tag/src/check-tag.mjs';
-export { checkboxDefaultProps, checkboxGroupEmits, checkboxGroupProps } from './checkbox/src/checkbox-group.mjs';
-export { checkboxEmits, checkboxProps } from './checkbox/src/checkbox2.mjs';
+export { checkboxDefaultProps, checkboxGroupEmits, checkboxGroupProps } from './checkbox/src/checkbox-group2.mjs';
+export { checkboxEmits, checkboxProps } from './checkbox/src/checkbox.mjs';
 export { checkboxGroupContextKey } from './checkbox/src/constants.mjs';
 export { colProps } from './col/src/col.mjs';
 export { collapseEmits, collapseProps, emitChangeFn } from './collapse/src/collapse.mjs';
-export { collapseItemProps } from './collapse/src/collapse-item2.mjs';
+export { collapseItemProps } from './collapse/src/collapse-item.mjs';
 export { collapseContextKey } from './collapse/src/constants.mjs';
 export { ROOT_COMMON_COLOR_INJECTION_KEY, colorPickerPanelContextKey, colorPickerPanelEmits, colorPickerPanelProps } from './color-picker-panel/src/color-picker-panel.mjs';
 export { colorPickerEmits, colorPickerProps } from './color-picker/src/color-picker.mjs';
@@ -120,7 +120,7 @@ export { messageConfig } from './config-provider/src/config-provider.mjs';
 export { configProviderProps } from './config-provider/src/config-provider-props.mjs';
 export { configProviderContextKey } from './config-provider/src/constants.mjs';
 export { provideGlobalConfig, useGlobalComponentSettings, useGlobalConfig } from './config-provider/src/hooks/use-global-config.mjs';
-export { countdownEmits, countdownProps } from './countdown/src/countdown2.mjs';
+export { countdownEmits, countdownProps } from './countdown/src/countdown.mjs';
 export { datePickerProps } from './date-picker/src/props.mjs';
 export { ROOT_PICKER_INJECTION_KEY, ROOT_PICKER_IS_DEFAULT_FORMAT_INJECTION_KEY } from './date-picker-panel/src/constants.mjs';
 export { datePickerPanelProps } from './date-picker-panel/src/props/date-picker-panel.mjs';
@@ -131,9 +131,9 @@ export { dialogContextKey, dialogEmits, dialogProps } from './dialog/src/dialog.
 export { DEFAULT_DIALOG_TRANSITION, dialogInjectionKey } from './dialog/src/constants.mjs';
 export { dividerProps } from './divider/src/divider.mjs';
 export { drawerEmits, drawerProps } from './drawer/src/drawer.mjs';
-export { FIRST_KEYS, FIRST_LAST_KEYS, LAST_KEYS, dropdownItemProps, dropdownMenuProps, dropdownProps } from './dropdown/src/dropdown2.mjs';
+export { FIRST_KEYS, FIRST_LAST_KEYS, LAST_KEYS, dropdownItemProps, dropdownMenuProps, dropdownProps } from './dropdown/src/dropdown.mjs';
 export { DROPDOWN_INJECTION_KEY, DROPDOWN_INSTANCE_INJECTION_KEY } from './dropdown/src/tokens.mjs';
-export { emptyProps } from './empty/src/empty.mjs';
+export { emptyProps } from './empty/src/empty2.mjs';
 export { formEmits, formMetaProps, formProps } from './form/src/form.mjs';
 export { formItemProps, formItemValidateStates } from './form/src/form-item.mjs';
 export { formContextKey, formItemContextKey } from './form/src/constants.mjs';
@@ -155,8 +155,8 @@ export { overlayEmits, overlayProps } from './overlay/src/overlay.mjs';
 export { pageHeaderEmits, pageHeaderProps } from './page-header/src/page-header.mjs';
 export { paginationEmits, paginationProps } from './pagination/src/pagination.mjs';
 export { elPaginationKey } from './pagination/src/constants.mjs';
-export { popconfirmEmits, popconfirmProps } from './popconfirm/src/popconfirm.mjs';
-export { Effect, popperProps, roleTypes, usePopperProps } from './popper/src/popper.mjs';
+export { popconfirmEmits, popconfirmProps } from './popconfirm/src/popconfirm2.mjs';
+export { Effect, popperProps, roleTypes, usePopperProps } from './popper/src/popper2.mjs';
 export { popperTriggerProps, usePopperTriggerProps } from './popper/src/trigger.mjs';
 export { popperContentEmits, popperContentProps, popperCoreConfigProps, usePopperContentEmits, usePopperContentProps, usePopperCoreConfigProps } from './popper/src/content.mjs';
 export { popperArrowProps, usePopperArrowProps } from './popper/src/arrow.mjs';
@@ -164,10 +164,10 @@ export { POPPER_CONTENT_INJECTION_KEY, POPPER_INJECTION_KEY } from './popper/src
 export { default as ElPopperArrow } from './popper/src/arrow2.mjs';
 export { default as ElPopperTrigger } from './popper/src/trigger2.mjs';
 export { default as ElPopperContent } from './popper/src/content2.mjs';
-export { progressProps } from './progress/src/progress2.mjs';
-export { radioEmits, radioProps, radioPropsBase } from './radio/src/radio2.mjs';
-export { radioDefaultProps, radioGroupEmits, radioGroupProps } from './radio/src/radio-group.mjs';
-export { radioButtonProps } from './radio/src/radio-button2.mjs';
+export { progressProps } from './progress/src/progress.mjs';
+export { radioEmits, radioProps, radioPropsBase } from './radio/src/radio.mjs';
+export { radioDefaultProps, radioGroupEmits, radioGroupProps } from './radio/src/radio-group2.mjs';
+export { radioButtonProps } from './radio/src/radio-button.mjs';
 export { radioGroupKey } from './radio/src/constants.mjs';
 export { rateEmits, rateProps } from './rate/src/rate.mjs';
 export { IconComponentMap, IconMap, resultProps } from './result/src/result.mjs';
@@ -182,13 +182,13 @@ export { selectEmits, selectProps } from './select/src/select.mjs';
 export { selectV2InjectionKey } from './select-v2/src/token.mjs';
 export { skeletonProps } from './skeleton/src/skeleton.mjs';
 export { skeletonItemProps } from './skeleton/src/skeleton-item.mjs';
-export { sliderEmits, sliderProps } from './slider/src/slider2.mjs';
+export { sliderEmits, sliderProps } from './slider/src/slider.mjs';
 export { sliderContextKey } from './slider/src/constants.mjs';
 export { spaceProps } from './space/src/space.mjs';
 export { spaceItemProps } from './space/src/item.mjs';
 export { useSpace } from './space/src/use-space.mjs';
 export { statisticProps } from './statistic/src/statistic.mjs';
-export { stepProps } from './steps/src/item2.mjs';
+export { stepProps } from './steps/src/item.mjs';
 export { stepsEmits, stepsProps } from './steps/src/steps.mjs';
 export { STEPS_INJECTION_KEY } from './steps/src/tokens.mjs';
 export { switchEmits, switchProps } from './switch/src/switch.mjs';
@@ -204,7 +204,7 @@ export { tabNavEmits, tabNavProps } from './tabs/src/tab-nav.mjs';
 export { tabPaneProps } from './tabs/src/tab-pane.mjs';
 export { tabsRootContextKey } from './tabs/src/constants.mjs';
 export { tagEmits, tagProps } from './tag/src/tag.mjs';
-export { textProps } from './text/src/text2.mjs';
+export { textProps } from './text/src/text.mjs';
 export { buildTimeList, dateEquals, dayOrDaysToDate, extractDateFormat, extractTimeFormat, formatter, makeList, parseDate, rangeArr, valueEquals } from './time-picker/src/utils.mjs';
 export { DEFAULT_FORMATS_DATE, DEFAULT_FORMATS_DATEPICKER, DEFAULT_FORMATS_TIME, PICKER_BASE_INJECTION_KEY, PICKER_POPPER_OPTIONS_INJECTION_KEY, ROOT_COMMON_PICKER_INJECTION_KEY, timeUnits } from './time-picker/src/constants.mjs';
 export { timePickerDefaultProps, timePickerRangeTriggerProps, timePickerRngeTriggerProps } from './time-picker/src/common/props.mjs';
@@ -234,10 +234,10 @@ export { tourStepEmits, tourStepProps } from './tour/src/step.mjs';
 export { tourContentEmits, tourContentProps, tourPlacements, tourStrategies } from './tour/src/content.mjs';
 export { anchorEmits, anchorProps } from './anchor/src/anchor.mjs';
 export { defaultProps, segmentedEmits, segmentedProps } from './segmented/src/segmented.mjs';
-export { mentionDefaultProps, mentionEmits, mentionProps } from './mention/src/mention.mjs';
+export { mentionDefaultProps, mentionEmits, mentionProps } from './mention/src/mention2.mjs';
 export { splitterProps } from './splitter/src/splitter.mjs';
 export { splitterPanelProps } from './splitter/src/split-panel.mjs';
-export { MESSAGE_DEFAULT_PLACEMENT, messageDefaults, messageEmits, messagePlacement, messageProps, messageTypes } from './message/src/message2.mjs';
+export { MESSAGE_DEFAULT_PLACEMENT, messageDefaults, messageEmits, messagePlacement, messageProps, messageTypes } from './message/src/message.mjs';
 export { notificationEmits, notificationProps, notificationTypes } from './notification/src/notification.mjs';
 export { popoverEmits, popoverProps } from './popover/src/popover.mjs';
 //# sourceMappingURL=index.mjs.map

package/es/components/mention/index.mjs

@@ -1,5 +1,5 @@
-import Mention from './src/mention2.mjs';
-export { mentionDefaultProps, mentionEmits, mentionProps } from './src/mention.mjs';
+import Mention from './src/mention.mjs';
+export { mentionDefaultProps, mentionEmits, mentionProps } from './src/mention2.mjs';
 import { withInstall } from '../../utils/vue/install.mjs';
 
 const ElMention = withInstall(Mention);

package/es/components/mention/src/mention.mjs

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