## Transit Departures (S—217)

A live departure board: minutes count down, due trains blink once and leave, lines filter, and a stop can be starred.

- URL: https://sundaeui.dev/components/transit-departures
- Category: Cards & data visualization · 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/transit-departures.json`
- Tags: departures, transit, bus, live, train, countdown

Each row shows the line, destination and minutes until departure, counting down in real time. At zero the row reads “Due”, then leaves the board.
Filter by line with chips. Delays show the scheduled time struck out next to the new one.

### Usage

```tsx
import { TransitDepartures } from '@/components/sundae/transit-departures'

<TransitDepartures />
```

### Props

- `departures` (`Departure[]`, required): Line, destination, seconds until, delay.
- `stop` (`string`): Stop name.
- `fill` (`'dark' | 'light'`, default `'dark'`): Surface: dark or light.

### When to use

- Transit apps, office lobby screens, event shuttles.

### When not to use

- Static timetables: show the schedule.

### Accessibility

- The board is a list; each row reads “Line 4 to Harbour, 3 minutes”.
- Due departures are announced politely, not every tick.
- Reduced motion removes the movement and keeps every state change.