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

Week-view calendar with time axis and absolute-positioned event blocks.

Renders a 7-column time grid where events are positioned by their start time
and sized by duration. No JavaScript — all positioning computed server-side.

## Layout

- Left column: timezone label + hour labels (07:00–21:00)
- 7 day columns: day number, month+weekday subtitle, time grid with events

## Event format

    events = [
      %{date: ~D[2024-04-25], time: "09:00", end_time: "12:00", label: "standup", color: "green"},
      %{date: ~D[2024-04-26], time: "13:00", duration_minutes: 90, label: "review", color: "orange"},
    ]

Supported colors: `"green"`, `"orange"`, `"blue"`, `"red"`, `"purple"`, `"gray"`.
Any other value falls back to `bg-primary`.

## Pill label format

`"{time} ({label})"` when `:label` is present, otherwise just `"{time}"`.

## Example

    <.calendar_week_view
      week_start={~D[2024-04-25]}
      events={@events}
      timezone="GMT+5"
      view="week"
      on_view_change="cal-view"
      on_event_click="cal-event"
    />

# `calendar_week_view`

## Attributes

* `week_start` (`:any`) (required) - First day of the week to display (`Date.t()`).
* `events` (`:list`) - List of event maps. Each must have `:date` and `:time`. Defaults to `[]`.
* `start_hour` (`:integer`) - First hour shown on the time axis (0–23). Defaults to `7`.
* `end_hour` (`:integer`) - Last hour (exclusive) on the time axis (1–24). Defaults to `22`.
* `timezone` (`:string`) - Timezone label shown top-left, e.g. "GMT+5". Defaults to `nil`.
* `view` (`:string`) - Currently active view — used to highlight the matching button in the switcher. Defaults to `"week"`. Must be one of `"month"`, `"week"`, `"day"`, or `"list"`.
* `on_view_change` (`:string`) - LiveView event name fired when a view switcher button is clicked. Sends `phx-value-view`. Defaults to `nil`.
* `on_event_click` (`:string`) - LiveView event name fired when an event block is clicked. Sends `phx-value-date`, `phx-value-time`, `phx-value-label`. Defaults to `nil`.
* `on_slot_click` (`:string`) - LiveView event name fired when an empty time slot is clicked. Sends `phx-value-date`. Defaults to `nil`.
* `class` (`:string`) - Defaults to `nil`.
* Global attributes are accepted.

---

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