xdesign-vue-next/es/input/useInput.mjs.map

XDesign Component for vue-next

{"version":3,"file":"useInput.mjs","sources":["../../src/input/useInput.ts"],"sourcesContent":["import { ref, computed, watch, nextTick, toRefs, inject } from 'vue';\nimport { InputValue, TdInputProps } from './type';\nimport { FormItemInjectionKey } from '../form/const';\nimport useVModel from '../hooks/useVModel';\nimport { useFormDisabled } from '../form/hooks';\nimport useLengthLimit from './useLengthLimit';\n\nexport interface ExtendsTdInputProps extends TdInputProps {\n  showInput: boolean;\n  keepWrapperWidth: boolean;\n  allowTriggerBlur: boolean;\n}\n\nexport default function useInput(props: ExtendsTdInputProps, expose: (exposed: Record<string, any>) => void) {\n  const { value, modelValue } = toRefs(props);\n  const inputValue = ref<InputValue>();\n  const isComposition = ref(false);\n  const compositionValue = ref<InputValue>();\n  const clearIconRef = ref(null);\n  const innerClickElement = ref();\n  const disabled = useFormDisabled();\n  const [innerValue, setInnerValue] = useVModel(value, modelValue, props.defaultValue, props.onChange);\n\n  const isHover = ref(false);\n  const focused = ref(false);\n  const renderType = ref(props.type);\n  const inputRef = ref<HTMLInputElement>(null);\n\n  const limitParams = computed(() => ({\n    value: [undefined, null].includes(innerValue.value) ? undefined : String(innerValue.value),\n    status: props.status,\n    maxlength: props.maxlength,\n    maxcharacter: props.maxcharacter,\n    allowInputOverMax: props.allowInputOverMax,\n    onValidate: props.onValidate,\n  }));\n  const { limitNumber, getValueByLimitNumber, tStatus } = useLengthLimit(limitParams);\n\n  const showClear = computed(() => {\n    return (\n      ((innerValue.value && !disabled.value && props.clearable && !props.readonly) || props.showClearIconOnEmpty) &&\n      isHover.value\n    );\n  });\n\n  const focus = () => inputRef.value?.focus();\n  const blur = () => inputRef.value?.blur();\n\n  const emitFocus = (e: FocusEvent) => {\n    inputValue.value = innerValue.value;\n    if (props.disabled) return;\n    focused.value = true;\n    props.onFocus?.(innerValue.value, { e });\n  };\n\n  const emitClear = ({ e }: { e: MouseEvent }) => {\n    setInnerValue('', { e, trigger: 'clear' });\n    props.onClear?.({ e });\n  };\n\n  const onClearIconMousedown = (e: MouseEvent) => {\n    innerClickElement.value = e.target;\n  };\n\n  const emitPassword = () => {\n    const toggleType = renderType.value === 'password' ? 'text' : 'password';\n    renderType.value = toggleType;\n  };\n\n  const setInputElValue = (v: InputValue = '') => {\n    const inputEl = inputRef.value as HTMLInputElement;\n    if (!inputEl) return;\n    const sV = String(v);\n    if (!inputEl.value) {\n      return;\n    }\n    if (inputEl.value !== sV) {\n      inputEl.value = sV;\n    }\n  };\n  const inputValueChangeHandle = (e: InputEvent | CompositionEvent) => {\n    const { target } = e;\n    let val = (target as HTMLInputElement).value;\n    // over length: allow delete; not add\n    if (props.type !== 'number' && val.length > innerValue.value?.length) {\n      val = getValueByLimitNumber(val);\n    }\n    setInnerValue(val, { e } as { e: InputEvent; trigger: 'input' });\n    // 受控\n    nextTick(() => {\n      setInputElValue(innerValue.value);\n    });\n  };\n\n  const handleInput = (e: InputEvent) => {\n    const checkInputType = e.inputType && e.inputType === 'insertCompositionText';\n    const {\n      currentTarget: { value: val },\n    }: any = e;\n    if (checkInputType || isComposition.value) {\n      compositionValue.value = val;\n      return;\n    }\n    inputValueChangeHandle(e);\n  };\n\n  const isClearIcon = () => {\n    let tmp = innerClickElement.value;\n    if (!tmp || !tmp.tagName || !clearIconRef.value?.$el || !['path', 'svg'].includes(tmp.tagName)) return false;\n    while (tmp) {\n      if (clearIconRef.value?.$el === tmp) {\n        return true;\n      }\n      tmp = tmp.parentNode;\n    }\n    return false;\n  };\n\n  const formItem = inject(FormItemInjectionKey, undefined);\n  const formatAndEmitBlur = (e: FocusEvent) => {\n    if (props.format) {\n      inputValue.value = props.format(innerValue.value);\n    }\n    focused.value = false;\n    // 点击清空按钮的时候，不应该触发 onBlur 事件。这个规则在表格单元格编辑中有很重要的应用\n    if (!isClearIcon() && props.allowTriggerBlur) {\n      props.onBlur?.(innerValue.value, { e });\n      formItem?.handleBlur();\n    }\n  };\n\n  const onHandleCompositionend = (e: CompositionEvent) => {\n    isComposition.value = false;\n    compositionValue.value = '';\n    inputValueChangeHandle(e);\n    props.onCompositionend?.(innerValue.value, { e });\n  };\n  const onHandleCompositionstart = (e: CompositionEvent) => {\n    isComposition.value = true;\n    const {\n      currentTarget: { value },\n    }: any = e;\n    compositionValue.value = value;\n    props.onCompositionstart?.(innerValue.value, { e });\n  };\n\n  const onRootClick = (e: MouseEvent) => {\n    inputRef.value?.focus();\n    props.onClick?.({ e });\n  };\n\n  watch(\n    () => props.autofocus,\n    (value) => {\n      if (value === true) {\n        nextTick(() => {\n          inputRef.value?.focus();\n        });\n      }\n    },\n    { immediate: true },\n  );\n\n  watch(\n    innerValue,\n    (val, oldVal) => {\n      // 初始化时，如果有 format 函数，需要对 value 进行格式化\n      if (oldVal === undefined && props.format) {\n        inputValue.value = props.format(val);\n      } else {\n        inputValue.value = val;\n      }\n      // limit props value\n      const newVal = getValueByLimitNumber(val);\n      if (newVal !== val && props.type !== 'number') {\n        setInnerValue(newVal, { trigger: 'initial' });\n      }\n    },\n    { immediate: true },\n  );\n\n  watch(\n    () => props.type,\n    (v) => {\n      renderType.value = v;\n    },\n    { immediate: true },\n  );\n\n  expose({\n    inputRef,\n    focus,\n    blur,\n  });\n\n  return {\n    isHover,\n    focused,\n    renderType,\n    showClear,\n    inputRef,\n    clearIconRef,\n    inputValue,\n    isComposition,\n    compositionValue,\n    limitNumber,\n    tStatus,\n    emitFocus,\n    formatAndEmitBlur,\n    onHandleCompositionend,\n    onHandleCompositionstart,\n    onRootClick,\n    emitPassword,\n    handleInput,\n    emitClear,\n    onClearIconMousedown,\n    innerValue,\n  };\n}\n"],"names":["innerValue","setInnerValue","inputValue","e","trigger","innerClickElement","val","nextTick","setInputElValue","formItem","watch","immediate","expose","inputRef","focus","blur","isHover","focused","renderType","showClear","clearIconRef","isComposition","compositionValue","limitNumber","tStatus","emitFocus","formatAndEmitBlur","onHandleCompositionend","onHandleCompositionstart","onRootClick","emitPassword","handleInput","emitClear","onClearIconMousedown"],"mappings":"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"}