xdesign-vue-next
Version:
XDesign Component for vue-next
1 lines • 3.67 kB
Source Map (JSON)
{"version":3,"file":"useInputWidth.mjs","sources":["../../src/input/useInputWidth.ts"],"sourcesContent":["import isUndefined from 'lodash/isUndefined';\nimport { onMounted, Ref, ref, watch, nextTick, onBeforeUnmount } from 'vue';\nimport { InputValue, TdInputProps } from './type';\n\nexport default function useInputWidth(\n props: TdInputProps,\n inputRef: Ref<HTMLInputElement>,\n innerValue: Ref<InputValue>,\n) {\n const inputPreRef = ref<HTMLSpanElement>(null);\n\n const composing = ref(false);\n const updateInputWidth = () => {\n if (!inputPreRef.value || !inputRef.value) return;\n const { width } = inputPreRef.value.getBoundingClientRect();\n inputRef.value.style.width = `${width || 0}px`;\n };\n\n const addListeners = () => {\n watch(\n () => innerValue.value + props.placeholder,\n () => {\n if (!props.autoWidth) return;\n nextTick(() => {\n updateInputWidth();\n });\n },\n { immediate: true },\n );\n };\n\n onMounted(() => {\n composing.value = false;\n if (props.autoWidth) {\n addListeners();\n }\n });\n\n const resizeObserver = ref<ResizeObserver>(null);\n // 当元素默认为 display: none 状态，无法提前准确计算宽度，因此需要监听元素宽度变化。比如：Tabs 场景切换。\n const addTableResizeObserver = (element: Element) => {\n if (typeof window === 'undefined') return;\n\n // IE 11 以下使用设置 minWidth 兼容；IE 11 以上使用 ResizeObserver\n if (isUndefined(window.ResizeObserver) || !element) return;\n resizeObserver.value = new window.ResizeObserver(() => {\n updateInputWidth();\n });\n resizeObserver.value.observe(element);\n };\n\n onMounted(() => {\n addTableResizeObserver(inputPreRef.value);\n });\n\n onBeforeUnmount(() => {\n resizeObserver.value?.unobserve(inputPreRef.value);\n resizeObserver.value?.disconnect();\n });\n\n return {\n inputPreRef,\n };\n}\n"],"names":["inputRef","watch","nextTick","updateInputWidth","immediate","onMounted","addListeners","resizeObserver","addTableResizeObserver","onBeforeUnmount","inputPreRef"],"mappings":";;;;;;;;;;AAIA,SAAA,aAAA,CAAA,KAAA,EAAA,QAAA,EAAA,UAAA,EAAA;AAKQ,EAAA,IAAA,WAAA,GAAA,GAAA,CAAA,IAAA,CAAA,CAAA;AAEA,EAAA,IAAA,SAAA,GAAA,GAAA,CAAA,KAAA,CAAA,CAAA;AACN,EAAA,IAAA,gBAAA,GAAA,SAAA,gBAAA,GAAA;;;;AAGEA,IAAAA,QAAAA,CAAAA,KAAAA,CAAAA,KAAAA,CAAAA,KAAAA,GAAAA,EAAAA,CAAAA,MAAAA,CAAAA,KAAAA,IAAAA,CAAAA,EAAAA,IAAAA,CAAAA,CAAAA;;AAGF,EAAA,IAAA,YAAA,GAAA,SAAA,YAAA,GAAA;AACEC,IAAAA,KAAAA,CAAAA,YAAAA;AACE,MAAA,OAAA,UAAA,CAAA,KAAA,GAAA,KAAA,CAAA,WAAA,CAAA;AAA+B,KAAA,EAAA,YAAA;AAE7B,MAAA,IAAA,CAAA,KAAA,CAAA,SAAA,EAAA,OAAA;AACAC,MAAAA,QAAAA,CAAAA,YAAAA;AACmBC,QAAAA,gBAAAA,EAAAA,CAAAA;AACnB,OAAA,CAAA,CAAA;AACF,KAAA,EAAA;AACEC,MAAAA,SAAAA,EAAAA,IAAAA;AAAgB,KAAA,CAAA,CAAA;;AAItBC,EAAAA,SAAAA,CAAAA,YAAAA;;;AAGiBC,MAAAA,YAAAA,EAAAA,CAAAA;AACf,KAAA;AACF,GAAA,CAAA,CAAA;AAEM,EAAA,IAAA,cAAA,GAAA,GAAA,CAAA,IAAA,CAAA,CAAA;AAEA,EAAA,IAAA,sBAAA,GAAA,SAAA,sBAAA,CAAA,OAAA,EAAA;AACJ,IAAA,IAAA,OAAA,MAAA,KAAA,WAAA,EAAA,OAAA;;;AAKmBH,MAAAA,gBAAAA,EAAAA,CAAAA;AACnB,KAAA,CAAA,CAAA;AACeI,IAAAA,cAAAA,CAAAA,KAAAA,CAAAA,OAAAA,CAAAA,OAAAA,CAAAA,CAAAA;;AAGjBF,EAAAA,SAAAA,CAAAA,YAAAA;AACEG,IAAAA,sBAAAA,CAAAA,WAAAA,CAAAA,KAAAA,CAAAA,CAAAA;AACF,GAAA,CAAA,CAAA;AAEAC,EAAAA,eAAAA,CAAAA,YAAAA;;AACiB,IAAA,CAAA,qBAAA,GAAA,cAAA,CAAA,KAAA,MAAA,IAAA,IAAA,qBAAA,KAAA,KAAA,CAAA,GAAA,KAAA,CAAA,GAAA,qBAAA,CAAA,SAAA,CAAA,WAAA,CAAA,KAAA,CAAA,CAAA;AACf,IAAA,CAAA,sBAAA,GAAA,cAAA,CAAA,KAAA,MAAA,IAAA,IAAA,sBAAA,KAAA,KAAA,CAAA,GAAA,KAAA,CAAA,GAAA,sBAAA,CAAA,UAAA,EAAA,CAAA;AACF,GAAA,CAAA,CAAA;;AAGEC,IAAAA,WAAAA,EAAAA,WAAAA;;AAEJ;;;;"}