@extclp/vexip-ui/es/components/dropdown/dropdown.vue2.mjs.map

A Vue 3 UI library, Highly customizability, full TypeScript, performance pretty good

{"version":3,"file":"dropdown.vue2.mjs","sources":["../../../components/dropdown/dropdown.vue"],"sourcesContent":["<script setup lang=\"ts\">\nimport { Popper } from '@/components/popper'\n\nimport { computed, inject, nextTick, onMounted, provide, reactive, ref, toRef, watch } from 'vue'\n\nimport {\n  placementWhileList,\n  useClickOutside,\n  usePopper,\n  useRtl,\n  useSetTimeout\n} from '@vexip-ui/hooks'\nimport { emitEvent, useHoverDelay, useNameHelper, useProps } from '@vexip-ui/config'\nimport DropdownDrop from './dropdown-drop'\nimport { dropdownProps } from './props'\nimport { useLabel } from './hooks'\nimport { DROPDOWN_STATE, SELECT_HANDLER } from './symbol'\n\nimport type { PopperExposed } from '@/components/popper'\nimport type { Placement } from '@vexip-ui/hooks'\n\ndefineOptions({ name: 'Dropdown' })\n\nconst nh = useNameHelper('dropdown')\n\nconst _props = defineProps(dropdownProps)\nconst props = useProps('dropdown', _props, {\n  visible: {\n    default: false,\n    static: true\n  },\n  placement: {\n    default: 'bottom',\n    validator: value => placementWhileList.includes(value)\n  },\n  outsideClose: true,\n  trigger: {\n    default: 'hover',\n    validator: value => ['hover', 'click', 'custom'].includes(value)\n  },\n  label: {\n    default: null,\n    static: true\n  },\n  transitionName: () => nh.ns('drop'),\n  transfer: false,\n  dropClass: null,\n  appear: false,\n  meta: null,\n  alive: false,\n  custom: false\n})\n\nconst emit = defineEmits(['update:visible'])\n\nconst parentState = inject(DROPDOWN_STATE, null)\nconst { isRtl } = useRtl()\nconst hoverDelay = useHoverDelay()\n\nconst isNested = !!parentState\nconst label = toRef(props, 'label')\nconst placement = ref(props.placement)\nconst currentVisible = ref(props.visible)\nconst popperAlive = ref(false)\n\nconst transfer = isNested ? ref(false) : toRef(props, 'transfer')\n\nconst wrapper = useClickOutside(handleClickOutside)\nconst popper = ref<PopperExposed>()\nconst { reference, transferTo, updatePopper } = usePopper({\n  placement,\n  transfer,\n  wrapper,\n  popper: computed(() => popper.value?.wrapper),\n  isDrop: true,\n  offset: isNested ? [-5, 0] : undefined\n})\nconst currentLabel = useLabel(label, reference)\n\nconst className = computed(() => {\n  return {\n    [nh.b()]: true,\n    [nh.bs('vars')]: true,\n    [nh.bm('inherit')]: props.inherit,\n    [nh.bm('visible')]: currentVisible.value\n  }\n})\nconst isAlive = computed(() => parentState?.alive || props.alive)\n\nprovide(SELECT_HANDLER, null!)\n!props.custom &&\n  provide(\n    DROPDOWN_STATE,\n    reactive({\n      alive: isAlive,\n      handleSelect,\n      handleTriggerEnter,\n      handleTriggerLeave\n    })\n  )\n\nwatch(\n  () => props.visible,\n  value => {\n    currentVisible.value = value\n  }\n)\n\nwatch(\n  () => props.placement,\n  value => {\n    setPlacement(value)\n  }\n)\n\nwatch(currentVisible, value => {\n  if (value) {\n    updatePopper()\n  }\n})\n\nonMounted(() => {\n  nextTick(() => {\n    setPlacement(props.placement)\n  })\n})\n\ndefineExpose({\n  isNested,\n  currentVisible,\n  isAlive,\n  wrapper,\n  reference,\n  popper,\n  handleTriggerEnter,\n  handleTriggerLeave,\n  handleTriggerClick\n})\n\nfunction setVisible(visible: boolean) {\n  if (currentVisible.value === visible) return\n\n  currentVisible.value = visible\n\n  emit('update:visible', visible)\n  emitEvent(props.onToggle, visible)\n}\n\nfunction handleClickOutside() {\n  emitEvent(props.onClickOutside)\n\n  if (props.outsideClose && props.trigger !== 'custom' && currentVisible.value) {\n    setVisible(false)\n    emitEvent(props.onOutsideClose)\n  }\n}\n\nfunction handleSelect(labels: (string | number)[], metaList: Array<Record<string, any>>) {\n  if (props.trigger !== 'custom') {\n    setVisible(false)\n    emitEvent(props.onSelect, labels, metaList)\n  }\n\n  if (typeof parentState?.handleSelect === 'function') {\n    parentState.handleSelect([currentLabel.value!, ...labels], [props.meta || {}, ...metaList])\n  }\n}\n\nfunction setPlacement(value: Placement) {\n  const [xPlacement] = value.split('-')\n\n  if (isNested && xPlacement !== 'right' && xPlacement !== 'left') {\n    placement.value = isRtl.value ? 'left-start' : 'right-start'\n  } else {\n    placement.value = value\n  }\n}\n\nconst { timer } = useSetTimeout()\n\nfunction handleTriggerEnter() {\n  if (props.trigger === 'hover') {\n    clearTimeout(timer.hover)\n\n    if (typeof parentState?.handleTriggerEnter === 'function') {\n      parentState.handleTriggerEnter()\n    }\n\n    timer.hover = setTimeout(() => {\n      setVisible(true)\n    }, hoverDelay.value)\n  }\n}\n\nfunction handleTriggerLeave() {\n  if (props.trigger === 'hover') {\n    clearTimeout(timer.hover)\n\n    if (typeof parentState?.handleTriggerLeave === 'function') {\n      parentState.handleTriggerLeave()\n    }\n\n    timer.hover = setTimeout(() => {\n      setVisible(false)\n    }, hoverDelay.value)\n  }\n}\n\nfunction handleTriggerClick() {\n  if (props.trigger === 'click') {\n    setVisible(!currentVisible.value)\n  }\n}\n</script>\n\n<template>\n  <div\n    ref=\"wrapper\"\n    :class=\"className\"\n    @mouseenter=\"handleTriggerEnter\"\n    @mouseleave=\"handleTriggerLeave\"\n  >\n    <div\n      ref=\"reference\"\n      :class=\"[nh.be('trigger'), currentVisible ? nh.bem('trigger', 'active') : '']\"\n      @click=\"handleTriggerClick\"\n      @keydown.enter.prevent=\"handleTriggerClick\"\n      @keydown.space.prevent=\"handleTriggerClick\"\n    >\n      <slot></slot>\n    </div>\n    <DropdownDrop>\n      <Popper\n        ref=\"popper\"\n        :class=\"[\n          nh.be('popper'),\n          nh.bs('vars'),\n          isNested ? nh.bem('popper', 'nested') : null,\n          props.dropClass\n        ]\"\n        :visible=\"currentVisible\"\n        :alive=\"isAlive || popperAlive\"\n        :to=\"transferTo\"\n        :transition=\"props.transitionName\"\n        :appear=\"props.appear\"\n        @mouseenter=\"handleTriggerEnter\"\n        @mouseleave=\"handleTriggerLeave\"\n        @after-enter=\"popperAlive = true\"\n        @after-leave=\"popperAlive = false\"\n      >\n        <slot name=\"drop\"></slot>\n      </Popper>\n    </DropdownDrop>\n  </div>\n</template>\n"],"names":["nh","useNameHelper","props","useProps","__props","value","placementWhileList","emit","__emit","parentState","inject","DROPDOWN_STATE","isRtl","useRtl","hoverDelay","useHoverDelay","isNested","label","toRef","placement","ref","currentVisible","popperAlive","transfer","wrapper","useClickOutside","handleClickOutside","popper","reference","transferTo","updatePopper","usePopper","computed","_a","currentLabel","useLabel","className","isAlive","provide","SELECT_HANDLER","reactive","handleSelect","handleTriggerEnter","handleTriggerLeave","watch","setPlacement","onMounted","nextTick","__expose","handleTriggerClick","setVisible","visible","emitEvent","labels","metaList","xPlacement","timer","useSetTimeout"],"mappings":"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"}