

<Preview name="BasicAutoResizeExample" />

<Preview name="WidthAutoResizeExample" />

## Overview [#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 [#usage]

```tsx
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>
```
