Main content area.
```
### Dialog
```tsx
import { useState } from 'react';
import { Button, Dialog } from '@velocityuikit/velocityui';
function ConfirmDialog() {
const [open, setOpen] = useState(false);
return (
<>
);
}
```
Alternatively, use the shorthand `title` + `description` props on `Dialog` to auto-render the header without `Dialog.Header`:
```tsx
```
---
## 5. Controlled vs. Uncontrolled Props
Several components support both modes. Prefer **uncontrolled** when you only need a default starting value; prefer **controlled** when the parent needs to drive or read state.
| Component | Controlled props | Uncontrolled props |
|---|---|---|
| `Checkbox` | `checked`, `onChange` | `defaultChecked` |
| `Switch` | `checked`, `onChange` | `defaultChecked` |
| `RadioGroup` | `value`, `onChange` | `defaultValue` |
| `Tabs` | `value`, `onChange` | `defaultValue` |
| `Accordion` | `value`, `onChange` | `defaultValue` |
| `Slider` | `value`, `onChange` | — (always controlled) |
| `NumberInput` | `value`, `onChange` | — (always controlled) |
| `Pagination` | `page`, `onChange` | — (always controlled) |
**Rule:** Never mix controlled and uncontrolled for the same instance. Pick one pattern per component mount.
---
## 6. Accessibility — What to Preserve
VelocityUI ships components with accessibility built in. When modifying or composing them, preserve the following:
- **Do not remove `label` props** from `Input`, `Textarea`, `Select`, `Checkbox`, `Switch`, `RadioGroup`, `Slider`, `NumberInput`, or `FileUpload`. These wire `htmlFor`/`aria-labelledby` automatically.
- **Do not suppress `role` attributes** (e.g. `role="alert"` on `Alert`, `role="status"` on `Spinner`, `role="progressbar"` on `Progress`).
- **Tooltip** requires its `children` to be a single focusable React element so focus-based reveal works. Do not wrap children in an extra non-focusable `
`.
- **Dialog** manages focus trapping and Escape-key close internally. Do not add a second `onKeyDown` that calls `e.stopPropagation()` on Escape.
- **RadioGroup** renders a `