import { Meta, ArgTypes } from '@storybook/blocks';
import { Collapse } from './Collapse';

# Collapse

A content area, which can be horizontally collapsed and expanded. Can be used to hide extra information on the page.

## Usage

```jsx
const [isOpen, setIsOpen] = useState(false);

<Collapse label="Collapse panel" isOpen={isOpen} onToggle={() => setIsOpen(!isOpen)}>
  <p>Panel data</p>
</Collapse>;
```

<ArgTypes of={Collapse} />
