element-plus/es/components/input-tag/src/composables/use-input-tag.mjs.map

A Component Library for Vue 3

{"version":3,"file":"use-input-tag.mjs","sources":["../../../../../../../packages/components/input-tag/src/composables/use-input-tag.ts"],"sourcesContent":["import { computed, ref, shallowRef, watch } from 'vue'\nimport {\n  CHANGE_EVENT,\n  EVENT_CODE,\n  INPUT_EVENT,\n  UPDATE_MODEL_EVENT,\n} from '@element-plus/constants'\nimport {\n  debugWarn,\n  ensureArray,\n  getEventCode,\n  isAndroid,\n  isUndefined,\n} from '@element-plus/utils'\nimport { useComposition, useFocusController } from '@element-plus/hooks'\nimport { useFormDisabled, useFormSize } from '@element-plus/components/form'\n\nimport type { TooltipInstance } from '@element-plus/components/tooltip'\nimport type { EmitFn } from '@element-plus/utils'\nimport type { FormItemContext } from '@element-plus/components/form'\nimport type { InputTagEmits, InputTagProps } from '../input-tag'\n\ninterface UseInputTagOptions {\n  props: InputTagProps\n  emit: EmitFn<InputTagEmits>\n  formItem?: FormItemContext\n}\n\nexport function useInputTag({ props, emit, formItem }: UseInputTagOptions) {\n  const disabled = useFormDisabled()\n  const size = useFormSize()\n\n  const inputRef = shallowRef<HTMLInputElement>()\n  const inputValue = ref<string>()\n  const tagTooltipRef = ref<TooltipInstance>()\n\n  const tagSize = computed(() => {\n    return ['small'].includes(size.value) ? 'small' : 'default'\n  })\n  const placeholder = computed(() => {\n    return props.modelValue?.length ? undefined : props.placeholder\n  })\n  const closable = computed(() => !(props.readonly || disabled.value))\n  const inputLimit = computed(() => {\n    return isUndefined(props.max)\n      ? false\n      : (props.modelValue?.length ?? 0) >= props.max\n  })\n  const showTagList = computed(() => {\n    return props.collapseTags\n      ? props.modelValue?.slice(0, props.maxCollapseTags)\n      : props.modelValue\n  })\n  const collapseTagList = computed(() => {\n    return props.collapseTags\n      ? props.modelValue?.slice(props.maxCollapseTags)\n      : []\n  })\n\n  const addTagsEmit = (value: string | string[]) => {\n    const list = [...(props.modelValue ?? []), ...ensureArray(value)]\n\n    emit(UPDATE_MODEL_EVENT, list)\n    emit(CHANGE_EVENT, list)\n    emit('add-tag', value)\n    inputValue.value = undefined\n  }\n\n  const getDelimitedTags = (input: string) => {\n    const tags = input\n      .split(props.delimiter!)\n      .filter((val) => val && val !== input)\n    if (props.max) {\n      const maxInsert = props.max - (props.modelValue?.length ?? 0)\n      tags.splice(maxInsert)\n    }\n    return tags.length === 1 ? tags[0] : tags\n  }\n\n  const handleInput = (event: Event) => {\n    if (inputLimit.value) {\n      inputValue.value = undefined\n      return\n    }\n\n    if (isComposing.value) return\n    if (props.delimiter && inputValue.value) {\n      const tags = getDelimitedTags(inputValue.value)\n      if (tags.length) {\n        addTagsEmit(tags)\n      }\n    }\n    emit(INPUT_EVENT, (event.target as HTMLInputElement).value)\n  }\n\n  const handleKeydown = (event: KeyboardEvent) => {\n    if (isComposing.value) return\n    const code = getEventCode(event)\n\n    switch (code) {\n      case props.trigger:\n        event.preventDefault()\n        event.stopPropagation()\n        handleAddTag()\n        break\n      case EVENT_CODE.numpadEnter:\n        if (props.trigger === EVENT_CODE.enter) {\n          event.preventDefault()\n          event.stopPropagation()\n          handleAddTag()\n        }\n        break\n      case EVENT_CODE.backspace:\n        if (!inputValue.value && props.modelValue?.length) {\n          event.preventDefault()\n          event.stopPropagation()\n          handleRemoveTag(props.modelValue.length - 1)\n        }\n        break\n    }\n  }\n\n  const handleKeyup = (event: KeyboardEvent) => {\n    if (isComposing.value || !isAndroid()) return\n    const code = getEventCode(event)\n\n    switch (code) {\n      case EVENT_CODE.space:\n        if (props.trigger === EVENT_CODE.space) {\n          event.preventDefault()\n          event.stopPropagation()\n          handleAddTag()\n        }\n        break\n    }\n  }\n\n  const handleAddTag = () => {\n    const value = inputValue.value?.trim()\n    if (!value || inputLimit.value) return\n    addTagsEmit(value)\n  }\n\n  const handleRemoveTag = (index: number) => {\n    const value = (props.modelValue ?? []).slice()\n    const [item] = value.splice(index, 1)\n\n    emit(UPDATE_MODEL_EVENT, value)\n    emit(CHANGE_EVENT, value)\n    emit('remove-tag', item, index)\n  }\n\n  const handleClear = () => {\n    inputValue.value = undefined\n    emit(UPDATE_MODEL_EVENT, undefined)\n    emit(CHANGE_EVENT, undefined)\n    emit('clear')\n  }\n\n  const handleDragged = (\n    draggingIndex: number,\n    dropIndex: number,\n    type: 'before' | 'after'\n  ) => {\n    const value = (props.modelValue ?? []).slice()\n    const [draggedItem] = value.splice(draggingIndex, 1)\n    const step =\n      dropIndex > draggingIndex && type === 'before'\n        ? -1\n        : dropIndex < draggingIndex && type === 'after'\n          ? 1\n          : 0\n\n    value.splice(dropIndex + step, 0, draggedItem)\n    emit(UPDATE_MODEL_EVENT, value)\n    emit(CHANGE_EVENT, value)\n    emit('drag-tag', draggingIndex, dropIndex + step, draggedItem)\n  }\n\n  const focus = () => {\n    inputRef.value?.focus()\n  }\n\n  const blur = () => {\n    inputRef.value?.blur()\n  }\n\n  const { wrapperRef, isFocused } = useFocusController(inputRef, {\n    disabled,\n    beforeBlur(event) {\n      return tagTooltipRef.value?.isFocusInsideContent(event)\n    },\n    afterBlur() {\n      if (props.saveOnBlur) {\n        handleAddTag()\n      } else {\n        inputValue.value = undefined\n      }\n\n      if (props.validateEvent) {\n        formItem?.validate?.('blur').catch((err) => debugWarn(err))\n      }\n    },\n  })\n\n  const {\n    isComposing,\n    handleCompositionStart,\n    handleCompositionUpdate,\n    handleCompositionEnd,\n  } = useComposition({ afterComposition: handleInput })\n\n  watch(\n    () => props.modelValue,\n    () => {\n      if (props.validateEvent) {\n        formItem?.validate?.(CHANGE_EVENT).catch((err) => debugWarn(err))\n      }\n    }\n  )\n\n  return {\n    inputRef,\n    wrapperRef,\n    tagTooltipRef,\n    isFocused,\n    isComposing,\n    inputValue,\n    size,\n    tagSize,\n    placeholder,\n    closable,\n    disabled,\n    inputLimit,\n    showTagList,\n    collapseTagList,\n    handleDragged,\n    handleInput,\n    handleKeydown,\n    handleKeyup,\n    handleAddTag,\n    handleRemoveTag,\n    handleClear,\n    handleCompositionStart,\n    handleCompositionUpdate,\n    handleCompositionEnd,\n    focus,\n    blur,\n  }\n}\n"],"names":["ensureArray"],"mappings":"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"}