Seat Map Row

Airline seat-map row with an aisle gap, selected emerald seat, and a compact legend at the bottom.

Row 1212D · Window
A
B
C
D
E
F
OpenYoursTaken

Requires shadcn/ui initialized. Run npx shadcn@latest init if you haven't.

Import & use
import { Travel14 } from "@/components/beste/piece/travel14";

<Travel14
  row={12}
  seats={[
    {
      "label": "A",
      "state": "available"
    },
    {
      "label": "B",
      "state": "taken"
    },
    {
      "label": "C",
      "state": "available"
    },
    {
      "label": "D",
      "state": "selected"
    },
    {
      "label": "E",
      "state": "available"
    },
    {
      "label": "F",
      "state": "exit"
    }
  ]}
  selectedLabel="12D · Window"
/>