Renders a compact week navigator component.

The header displays a centred title (formatted via :title_format) flanked by optional prev/next navigation buttons. Below the header, 7 day columns each show the abbreviated weekday name and the calendar day number. The :selected_date column is rendered with bg-primary text-primary-foreground and a rounded pill style.

Examples

<%!-- Read-only week view --%>
<.week_calendar week_start={~D[2025-07-14]} selected_date={~D[2025-07-17]} />

<%!-- Full navigation and selection --%>
<.week_calendar
  week_start={@week_start}
  selected_date={@selected}
  on_prev="prev_week"
  on_next="next_week"
  on_select="select_date"
/>

Attributes

• week_start (:any) (required) - Date.t() — first day of the visible 7-day strip.
• selected_date (:any) - Date.t() or nil — the currently highlighted day. Defaults to nil.
• on_select (:string) - phx-click event name for day selection; receives phx-value-date (ISO 8601). Defaults to nil.
• on_prev (:string) - phx-click event name for the previous-week arrow button. Defaults to nil.
• on_next (:string) - phx-click event name for the next-week arrow button. Defaults to nil.
• title_format (:string) - strftime format string for the header title (default: "July '25"). Defaults to "%B '%y".
• class (:string) - Additional CSS classes merged onto the wrapper element. Defaults to nil.
• Global attributes are accepted. HTML attributes forwarded to the wrapper div.