A custom element that offers a declarative interface to the ResizeObserver API.
<resize-observer>
<p>Lorem ipsum dolor sit amet consectetur adipisicing elit. Voluptas magni assumenda facilis praesentium?</p>
<p>Distinctio ad laboriosam, maxime, asperiores odio doloribus nisi numquam quibusdam molestias repellendus, earum ipsam pariatur ipsum natus?</p>
<p>Ut nemo molestiae aspernatur consectetur impedit, culpa cumque qui numquam itaque recusandae sunt aut repellat dolore autem libero vel praesentium consequatur?</p>
</resize-observer>
<script>
const el = document.querySelector('resize-observer');
el.addEventListener('resize-observer:resize', evt => {
console.log('resize-observer:resize ->', evt.detail);
});
</script>