Event Ticket Card

About this component

An event ticket card with punched notches, a perforated barcode stub, and detail columns for launches and conferences.

Usage

The import and the props worth knowing about, in one place.

import { Card11 } from "@/components/beste/component/card11";

<Card11
  eyebrow="Admit one"
  event="Beste Conf 2027"
  holder="Selin Aksoy"
  details={[
    { label: "Date", value: "Mar 14" },
    { label: "Seat", value: "A12" },
    { label: "Gate", value: "03" },
  ]}
  code="BST-0421"   // printed on the stub, seeds the barcode
/>

<Card11
  event="Launch party"
  details={[{ label: "When", value: "Fri 21:00" }]}
  tone="neutral"   // "dark" (default) | "primary" | "neutral"
/>

Props

Read from the component's own type, so this cannot drift from what it accepts.

Prop	Type	Default	Description
`eyebrow`	`string`	—	Monospace eyebrow (e.g. "Admit one")
`event`*	`string`	—	Event name
`holder`	`string`	—	Ticket holder name
`details`	`Card11Detail[]`	—	Detail columns (e.g. date, seat, gate)
`code`	`string`	—	Code printed on the stub, also seeds the barcode
`tone`	`"dark" \| "primary" \| "neutral"`	—	Surface tone
`className`	`string`	—	Additional classes merged onto the root