## Bug Report (S—346)

A bug report people finish: title, severity, numbered steps, expected vs actual, and environment details attached.

- URL: https://sundaeui.dev/components/bug-report
- Category: Forms & inputs · Art direction: Refined
- Access: Free (no account needed)
- Stack: React 18+, TypeScript, plain CSS; dependencies: none
- Install: `npx shadcn@latest add https://sundaeui.dev/r/bug-report.json`
- Tags: form, bug-report, issue, support, qa, feedback

Steps are a numbered list: Enter adds the next step, Backspace on an empty step removes it. Expected and actual sit side by side as two short fields.
Browser, OS and screen size are detected and shown as chips that can be left out. Filing needs a title and one step.

### Usage

```tsx
import { BugReport } from '@/components/sundae/bug-report'

<BugReport />
```

### Props

- `env` (`{ label: string; value: string }[]`): Environment details to offer.
- `onFile` (`(report: object) => void`): Called with the report.
- `fill` (`'dark' | 'light'`, default `'dark'`): Surface: dark or light.

### When to use

- In-app feedback, beta programs, QA tools.

### When not to use

- Feature requests: ask for the problem instead of steps.

### Accessibility

- Severity is a radio group; steps are labelled inputs ("Step 2").
- Missing fields are explained next to the submit button.
- Reduced motion removes the movement and keeps every state change.