ElementSize

Track element dimensions reactively

ElementSize provides reactive access to an element's width and height, automatically updating when the element's dimensions change. Similar to ElementRect but focused only on size measurements.

Demo

Width: 0
Height: 0

Usage

		<script lang="ts">
	import { ElementSize } from "runed";
 
	let el = $state() as HTMLElement;
	const size = new ElementSize(() => el);
</script>
 
<textarea bind:this={el}></textarea>
 
<p>Width: {size.width} Height: {size.height}</p>

Type Definition

		interface ElementSize {
	readonly width: number;
	readonly height: number;
}