element-plus
Version:
A Component Library for Vue 3
1 lines • 4.01 kB
Source Map (JSON)
{"version":3,"file":"dropdown-item.mjs","sources":["../../../../../../packages/components/dropdown/src/dropdown-item.vue"],"sourcesContent":["<template>\n <el-dropdown-collection-item\n :disabled=\"disabled\"\n :text-value=\"textValue ?? textContent\"\n >\n <el-roving-focus-item :focusable=\"!disabled\">\n <el-dropdown-item-impl\n v-bind=\"propsAndAttrs\"\n @pointerleave=\"handlePointerLeave\"\n @pointermove=\"handlePointerMove\"\n @click=\"handleClick\"\n >\n <slot />\n </el-dropdown-item-impl>\n </el-roving-focus-item>\n </el-dropdown-collection-item>\n</template>\n<script lang=\"ts\">\nimport {\n computed,\n defineComponent,\n getCurrentInstance,\n inject,\n ref,\n unref,\n} from 'vue'\nimport { ElRovingFocusItem } from '@element-plus/components/roving-focus-group'\nimport { composeEventHandlers, whenMouse } from '@element-plus/utils'\nimport ElDropdownItemImpl from './dropdown-item-impl.vue'\nimport { useDropdown } from './useDropdown'\nimport {\n ElCollectionItem as ElDropdownCollectionItem,\n dropdownItemProps,\n} from './dropdown'\nimport { DROPDOWN_INJECTION_KEY } from './tokens'\n\nexport default defineComponent({\n name: 'ElDropdownItem',\n components: {\n ElDropdownCollectionItem,\n ElRovingFocusItem,\n ElDropdownItemImpl,\n },\n inheritAttrs: false,\n props: dropdownItemProps,\n emits: ['pointermove', 'pointerleave', 'click'],\n setup(props, { emit, attrs }) {\n const { elDropdown } = useDropdown()\n const _instance = getCurrentInstance()\n const itemRef = ref<HTMLElement | null>(null)\n const textContent = computed(() => unref(itemRef)?.textContent ?? '')\n const { onItemEnter, onItemLeave } = inject(\n DROPDOWN_INJECTION_KEY,\n undefined\n )!\n\n const handlePointerMove = composeEventHandlers(\n (e: PointerEvent) => {\n emit('pointermove', e)\n return e.defaultPrevented\n },\n whenMouse((e) => {\n if (props.disabled) {\n onItemLeave(e)\n } else {\n onItemEnter(e)\n if (!e.defaultPrevented) {\n ;(e.currentTarget as HTMLElement)?.focus()\n }\n }\n })\n )\n\n const handlePointerLeave = composeEventHandlers(\n (e: PointerEvent) => {\n emit('pointerleave', e)\n return e.defaultPrevented\n },\n whenMouse((e) => {\n onItemLeave(e)\n })\n )\n\n const handleClick = composeEventHandlers(\n (e: PointerEvent) => {\n emit('click', e)\n return e.defaultPrevented\n },\n (e) => {\n if (props.disabled) {\n e.stopImmediatePropagation()\n return\n }\n if (elDropdown?.hideOnClick?.value) {\n elDropdown.handleClick?.()\n }\n elDropdown.commandHandler?.(props.command, _instance, e)\n }\n )\n\n // direct usage of v-bind={ ...$props, ...$attrs } causes type errors\n const propsAndAttrs = computed(() => {\n return { ...props, ...attrs }\n })\n\n return {\n handleClick,\n handlePointerMove,\n handlePointerLeave,\n textContent,\n propsAndAttrs,\n }\n },\n})\n</script>\n"],"names":["ElDropdownCollectionItem"],"mappings":";;;;;;;;;;;AAoCA,MAAK,YAAa,gBAAa;AAAA,EAC7B,MAAM;AAAA,EACN,YAAY;AAAA,8BACVA;AAAA,IACA;AAAA,IACA;AAAA;AAAA,EAEF,cAAc;AAAA,EACd,OAAO;AAAA,EACP,OAAO,CAAC,eAAe,gBAAgB;AAAA,EACvC,MAAM,OAAO,EAAE,MAAM,SAAS;AAC5B,UAAM,EAAE,eAAe;AACvB,UAAM,YAAY;AAClB,UAAM,UAAU,IAAwB;AACxC,UAAM,cAAc,SAAS,MAAM;AACnC,UAAM,EAAE;AAKR,8BAA0B,qBACxB;AACE;AACA;AAAS;AAGT,UAAI,gBAAgB;AAClB;AAAY;AAEZ;AACA,eAAO;AACL;AAAC;AAAkC;AAAA;AAAA;AAM3C,UAAM,qBAAqB,qBACzB;AACE;AACA;AAAS,OAEX;AACE;AAAY;AAIhB;AAEI;AACA;AAAS,OAEX,CAAC;AACC,UAAI;AACF,UAAE;AACF;AAAA;AAEF,UAAI;AACF;AAAW;AAEb;AAAsD;AAK1D,UAAM,gBAAgB;AACpB;AAAsB;AAGxB;AAAO,MACL;AAAA;AACA,MACA;AAAA,MACA;AAAA;AACA;AAAA;AAAA;;;;;;AA5GiB;AACN;;;AAWU;AAToB;;;AAQjB;AALW,2BACnB;AAAA;AACN;;;AAEA;;;;;;;;;;;;;;;;;;;;;"}