Auto Resize

Animate container size changes based on dynamic content.

Overview

AutoResize animates its height whenever the content inside changes. Use axis="width" or axis="both" when dynamic inline content also needs smooth width transitions without fixed dimensions.

Usage

import { AutoResize } from "@tilt-legal/cubitt-components/auto-resize";

<AutoResize>
  <div>Dynamic content</div>
</AutoResize>

<AutoResize axis="width" render={<span className="inline-block whitespace-nowrap" />}>
  Dynamic label
</AutoResize>

On this page