tdesign-vue-next
Version:
TDesign Component for vue-next
72 lines (68 loc) • 2.15 kB
JavaScript
/**
* tdesign v1.20.5
* (c) 2026 tdesign
* @license MIT
*/
import { toRefs, ref, onBeforeUnmount, watch, nextTick, onMounted } from 'vue';
import { l as useResizeObserver } from '../../_chunks/dep-84e0bbb7.mjs';
import 'lodash-es';
import '../../_chunks/dep-60644c95.mjs';
import '../../_chunks/dep-f14f9069.mjs';
import '../../_chunks/dep-e66c752e.mjs';
import '../../_chunks/dep-6713c79b.mjs';
import '../../_chunks/dep-7a893b4c.mjs';
import '../../config-provider/hooks/useConfig.mjs';
import '../../config-provider/utils/context.mjs';
import '../../_chunks/dep-a9e2592c.mjs';
import '../../_chunks/dep-ffc4bb92.mjs';
import '../../_chunks/dep-9f0aa3ce.mjs';
import '../../_chunks/dep-2aa526c5.mjs';
import '../../_chunks/dep-4909e0c1.mjs';
import '../../_chunks/dep-ba782c68.mjs';
import '../../_chunks/dep-623bf97e.mjs';
import '../../_chunks/dep-f91e6e9f.mjs';
import '../../_chunks/dep-5fb4f56f.mjs';
import '../../_chunks/dep-d12cc5f8.mjs';
var ANIMATION_TIME = 100;
function useInputWidth(props, inputRef, innerValue) {
var _toRefs = toRefs(props),
autoWidth = _toRefs.autoWidth,
placeholder = _toRefs.placeholder;
var inputPreRef = ref();
var observerTimer = ref(null);
var updateInputWidth = function updateInputWidth() {
if (!inputPreRef.value || !inputRef.value) return;
inputRef.value.style.width = getComputedStyle(inputPreRef.value).width;
};
useResizeObserver(inputPreRef, function () {
if (autoWidth.value) {
observerTimer.value = setTimeout(function () {
updateInputWidth();
clearTimeout(observerTimer.value);
}, ANIMATION_TIME);
}
});
onBeforeUnmount(function () {
clearTimeout(observerTimer.value);
});
var addListeners = function addListeners() {
watch([innerValue, placeholder], function () {
if (!autoWidth.value) return;
nextTick(function () {
updateInputWidth();
});
}, {
immediate: true
});
};
onMounted(function () {
if (autoWidth.value) {
addListeners();
}
});
return {
inputPreRef: inputPreRef
};
}
export { useInputWidth };
//# sourceMappingURL=useInputWidth.mjs.map