# `PhiaUi.Components.ScheduleEventCard`
[🔗](https://github.com/charlenopires/PhiaUI/blob/v0.1.17/lib/phia_ui/components/calendar/schedule_event_card.ex#L1)

ScheduleEventCard component — an event card with a colored left border, title,
date/time range, optional avatar group, and a category badge.

Designed for scheduling/calendar sidebar lists.

## Categories

| Category    | Border colour    | Badge colours               |
|-------------|------------------|-----------------------------|
| `:meeting`  | blue-500         | bg-blue-100 / text-blue-700 |
| `:event`    | teal-500         | bg-teal-100 / text-teal-700 |
| `:leave`    | red-400          | bg-red-100  / text-red-600  |
| `:default`  | primary          | bg-primary/10 / text-primary|

## Examples

    <.schedule_event_card
      title="Team Standup"
      category={:meeting}
      date="2026 / JAN / 15"
      time_range="09:00 AM - 10:00 AM"
      avatars={[%{src: "/avatars/alice.png", name: "Alice"}, "Bob"]}
      max_avatars={3}
    />

    <.schedule_event_card title="Annual Leave" category={:leave} />

# `schedule_event_card`

Renders a schedule event card with a coloured left border, title, optional date/time
rows, stacked avatars and a category badge.

## Attributes

* `title` (`:string`) (required) - Event title displayed in bold.
* `date` (`:string`) - Date string, e.g. "2022 / JUL / 30". Omit to hide the date row. Defaults to `nil`.
* `time_range` (`:string`) - Time range string, e.g. "09:00 AM - 11:00 AM". Omit to hide the time row. Defaults to `nil`.
* `category` (`:atom`) - Category determines the left-border and badge colour. Defaults to `:default`. Must be one of `:meeting`, `:event`, `:leave`, or `:default`.
* `category_label` (`:string`) - Override the badge text. Falls back to the category name. Defaults to `nil`.
* `avatars` (`:list`) - List of avatar descriptors — strings or %{src: url, name: name} maps. Defaults to `[]`.
* `max_avatars` (`:integer`) - Maximum number of avatar circles to display before showing an overflow count. Defaults to `3`.
* `class` (`:string`) - Additional CSS classes merged via cn/1. Defaults to `nil`.
* Global attributes are accepted. HTML attributes forwarded to the root element.

---

*Consult [api-reference.md](api-reference.md) for complete listing*