UNPKG

element-plus

Version:

A Component Library for Vue 3

1 lines 10.5 kB
{"version":3,"file":"mention-dropdown2.mjs","sources":["../../../../../../packages/components/mention/src/mention-dropdown.vue"],"sourcesContent":["<template>\n <div ref=\"dropdownRef\" :class=\"ns.b('dropdown')\">\n <div v-if=\"$slots.header\" :class=\"ns.be('dropdown', 'header')\">\n <slot name=\"header\" />\n </div>\n <el-scrollbar\n v-show=\"options.length > 0 && !loading\"\n :id=\"contentId\"\n ref=\"scrollbarRef\"\n tag=\"ul\"\n :wrap-class=\"ns.be('dropdown', 'wrap')\"\n :view-class=\"ns.be('dropdown', 'list')\"\n role=\"listbox\"\n :aria-label=\"ariaLabel\"\n aria-orientation=\"vertical\"\n >\n <li\n v-for=\"(item, index) in options\"\n :id=\"`${contentId}-${index}`\"\n ref=\"optionRefs\"\n :key=\"index\"\n :class=\"optionkls(item, index)\"\n role=\"option\"\n :aria-disabled=\"item.disabled || disabled || undefined\"\n :aria-selected=\"hoveringIndex === index\"\n @mousemove=\"handleMouseEnter(index)\"\n @click.stop=\"handleSelect(item)\"\n >\n <slot name=\"label\" :item=\"item\" :index=\"index\">\n <span>{{ item.label ?? item.value }}</span>\n </slot>\n </li>\n </el-scrollbar>\n <div v-if=\"loading\" :class=\"ns.be('dropdown', 'loading')\">\n <slot name=\"loading\"> {{ t('el.mention.loading') }} </slot>\n </div>\n <div v-if=\"$slots.footer\" :class=\"ns.be('dropdown', 'footer')\">\n <slot name=\"footer\" />\n </div>\n </div>\n</template>\n\n<script setup lang=\"ts\">\nimport { computed, nextTick, ref, watch } from 'vue'\nimport { useLocale, useNamespace } from '@element-plus/hooks'\nimport { scrollIntoView } from '@element-plus/utils'\nimport ElScrollbar from '@element-plus/components/scrollbar'\nimport { mentionDropdownEmits, mentionDropdownProps } from './mention-dropdown'\n\nimport type { MentionOption } from './types'\n\ndefineOptions({\n name: 'ElMentionDropdown',\n})\n\nconst props = defineProps(mentionDropdownProps)\nconst emit = defineEmits(mentionDropdownEmits)\n\nconst ns = useNamespace('mention')\nconst { t } = useLocale()\nconst hoveringIndex = ref(-1)\n\nconst scrollbarRef = ref<InstanceType<typeof ElScrollbar>>()\nconst optionRefs = ref<HTMLElement[]>()\nconst dropdownRef = ref<HTMLElement>()\n\nconst optionkls = (item: MentionOption, index: number) => [\n ns.be('dropdown', 'item'),\n ns.is('hovering', hoveringIndex.value === index),\n ns.is('disabled', item.disabled || props.disabled),\n]\n\nconst handleSelect = (item: MentionOption) => {\n if (item.disabled || props.disabled) return\n emit('select', item)\n}\n\nconst handleMouseEnter = (index: number) => {\n hoveringIndex.value = index\n}\n\nconst filteredAllDisabled = computed(\n () => props.disabled || props.options.every((item) => item.disabled)\n)\n\nconst hoverOption = computed(() => props.options[hoveringIndex.value])\n\nconst selectHoverOption = () => {\n if (!hoverOption.value) return\n emit('select', hoverOption.value)\n}\n\nconst navigateOptions = (direction: 'next' | 'prev') => {\n const { options } = props\n if (options.length === 0 || filteredAllDisabled.value) return\n\n if (direction === 'next') {\n hoveringIndex.value++\n if (hoveringIndex.value === options.length) {\n hoveringIndex.value = 0\n }\n } else if (direction === 'prev') {\n hoveringIndex.value--\n if (hoveringIndex.value < 0) {\n hoveringIndex.value = options.length - 1\n }\n }\n const option = options[hoveringIndex.value]\n if (option.disabled) {\n navigateOptions(direction)\n return\n }\n nextTick(() => scrollToOption(option))\n}\n\nconst scrollToOption = (option: MentionOption) => {\n const { options } = props\n\n const index = options.findIndex((item) => item.value === option.value)\n const target = optionRefs.value?.[index]\n\n if (target) {\n const menu = dropdownRef.value?.querySelector?.(\n `.${ns.be('dropdown', 'wrap')}`\n )\n if (menu) {\n scrollIntoView(menu as HTMLElement, target)\n }\n }\n scrollbarRef.value?.handleScroll()\n}\n\nconst resetHoveringIndex = () => {\n if (filteredAllDisabled.value || props.options.length === 0) {\n hoveringIndex.value = -1\n } else {\n hoveringIndex.value = 0\n }\n}\n\nwatch(() => props.options, resetHoveringIndex, {\n immediate: true,\n})\n\ndefineExpose({\n hoveringIndex,\n navigateOptions,\n selectHoverOption,\n hoverOption,\n})\n</script>\n"],"names":["_openBlock","_createElementBlock","_normalizeClass","_unref","$slots","_renderSlot","_createVNode","contentId","ariaLabel","_Fragment","options","disabled","_withModifiers","_createElementVNode","_toDisplayString","loading","_createTextVNode"],"mappings":"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"}