vuestic-ui
Version:
Vue 3 UI Framework
48 lines (47 loc) • 1.39 kB
JavaScript
import { ref, watch } from "vue";
import { u as useResizeObserver } from "../../../composables/useResizeObserver.mjs";
const makeTextElement = (textarea) => {
const div = document.createElement("div");
div.style.position = "absolute";
div.style.top = "0";
div.style.left = "0";
div.style.width = "auto";
const { font } = window.getComputedStyle(textarea);
div.style.font = font;
div.textContent = "Vuestic";
div.style.zIndex = "-1";
div.style.pointerEvents = "none";
div.style.opacity = "0";
div.ariaHidden = "true";
div.innerText = textarea.value;
return div;
};
const useTextHeight = (textarea, text) => {
const textElement = ref();
const textHeight = ref();
watch(textarea, (el) => {
var _a, _b;
if (el) {
textElement.value = makeTextElement(el);
(_b = (_a = textarea.value) == null ? void 0 : _a.parentElement) == null ? void 0 : _b.appendChild(textElement.value);
}
});
useResizeObserver(textElement, (newElement) => {
if (!newElement || !textarea.value) {
return;
}
textHeight.value = newElement[0].contentRect.height;
});
watch(text, (newText) => {
if (!textElement.value) {
return;
}
textElement.value.innerText = String(newText);
textElement.value.innerHTML += " ;";
});
return textHeight;
};
export {
useTextHeight as u
};
//# sourceMappingURL=useLineHeight.mjs.map