react-stacked-elements

Toggle the visibility of elements without causing a layout shift

Usage no npm install needed!

<script type="module">
  import reactStackedElements from 'https://cdn.skypack.dev/react-stacked-elements';
</script>

Toggle the visibility of elements without causing a layout shift

This package uses CSS Grid to place items at the same column and row, then toggles their visibility based on the selectedIndex property.

npm install react-stacked-elements

<StackedElements selectedIndex={isChecked ? 0 : 1}>
  <span>Absolutely</span>
  <span>No</span>
</StackedElements>