# `PhoenixLiveCalendar.Views.Timeline`
[🔗](https://github.com/mdon/phoenix_live_calendar/blob/v0.5.0/lib/phoenix_live_calendar/views/timeline.ex#L1)

Timeline view — horizontal time axis with resources as rows.

Used for resource scheduling (rooms, people, equipment),
Gantt-style project views, and multi-resource booking.

Events are filtered to the rendered `date` and midnight-crossing events are
clamped to it (a 23:50 → 00:20 session renders as 23:50 → 24:00 on day one
and 00:00 → 00:20 on day two); both behaviors have opt-out attrs.

# `timeline`

Renders a horizontal timeline with resource rows.

## Attributes

- `date` — The date to display
- `id` — optional per-instance prefix for event DOM ids
- `resources` — List of `PhoenixLiveCalendar.Resource` structs
- `events` — List of `PhoenixLiveCalendar.Event` structs (matched to a row
  via `resource_id` or the plural `resource_ids`)
- `show_time_axis` — render the sticky time header (default `true`;
  widgets turn it off)
- `min_time` — Earliest visible time (default: `~T[00:00:00]`)
- `max_time` — Latest visible time (default: `~T[23:59:59]`)
- `slot_duration` — Slot duration in minutes (default: 60)
- `slot_width` — CSS width per time slot (default: "5rem")
- `resource_width` — CSS width for the resource label column (default: "12rem")
- `filter_to_date` — Only render events that occupy `date` (default: `true`).
  Off = the caller pre-filters; every event in `events` renders. Note that
  `clamp_to_date` also implies this filter — an event that never touches
  the date has an empty intersection with it, so there is nothing to draw
- `clamp_to_date` — Clamp each event's bar to the intersection of its span
  with `date`, so midnight-crossing events position correctly on both days
  (default: `true`). Off = bars position by raw time-of-day (an event
  crossing midnight renders wrong — pre-0.2.0 behavior)
- `sticky_resource_column` — Keep the resource label column pinned during
  horizontal scroll (default: `true`)
- `show_now_indicator` — Vertical current-time line when `date` is today
  and the current time falls inside the visible window (default: `true`,
  matching the day/week grids)
- `today` — Today's date, for the now indicator (default: `Date.utc_today()`)
- `now` — Current wall-clock time for the now indicator (default:
  `Time.utc_now()`). Pass the viewer's local time when your events/`today`
  are in the viewer's frame
- `fit_to_events` — Compute the visible window from the rendered events
  instead of `min_time`/`max_time`: earliest start floored to the hour,
  latest end ceiled to the hour (default: `false`). Falls back to
  `min_time`/`max_time` when no timed events render or when the computed
  window would be empty/inverted
- `label_position` — where bar labels go: `:fit` (default) renders the
  label inside the bar when the server-side estimate says it fits, else
  falls back per `label_fit_fallback`; `:inside` always in-bar (truncated);
  `:outside` always beside the bar; `:none` no labels (tooltip + aria
  still identify every bar)
- `label_fit_ratio` — how much of the estimated label must fit for
  `:fit` to choose inside (default `0.75`)
- `label_fit_fallback` — `:outside` (default) or `:none`; outside labels
  place after the bar, flip before it at the track edge, and suppress
  themselves rather than overprint a neighbouring bar or label
- `on_event_click` — Handler for event clicks
- `on_slot_click` — Handler for time slot clicks
- `translations` — Translation overrides
- `time_format` — `:h24` or `:h12` (default: `:h24`)
- `class` — Additional CSS classes
- `dir` — Text direction (default: `:ltr`)

## Slots

- `event` — Custom event rendering
- `resource_label` — Custom resource label. Receives the resource.

All-day events covering `date` render as full-width bars.

## Attributes

* `date` (`Date`) (required)
* `id` (`:string`) - Optional prefix for generated event DOM ids. Set it when two views on one page can render the SAME events — without it their per-event ids collide. Defaults to `nil`.
* `resources` (`:list`) (required)
* `events` (`:list`) - Defaults to `[]`.
* `min_time` (`Time`) - Defaults to `~T[00:00:00]`.
* `max_time` (`Time`) - Defaults to `~T[23:59:59]`.
* `slot_duration` (`:integer`) - Defaults to `60`.
* `slot_width` (`:string`) - Defaults to `"5rem"`.
* `resource_width` (`:string`) - Defaults to `"12rem"`.
* `filter_to_date` (`:boolean`) - Defaults to `true`.
* `clamp_to_date` (`:boolean`) - Defaults to `true`.
* `sticky_resource_column` (`:boolean`) - Defaults to `true`.
* `show_time_axis` (`:boolean`) - Defaults to `true`.
* `show_now_indicator` (`:boolean`) - Defaults to `true`.
* `today` (`:any`) - Date | nil (server today) | :none (no today highlight). Defaults to `nil`.
* `now` (`Time`) - Defaults to `nil`.
* `fit_to_events` (`:boolean`) - Defaults to `false`.
* `label_position` (`:atom`) - Defaults to `:fit`. Must be one of `:none`, `:inside`, `:outside`, or `:fit`.
* `label_fit_ratio` (`:float`) - Defaults to `0.75`.
* `label_fit_fallback` (`:atom`) - Defaults to `:outside`. Must be one of `:outside`, or `:none`.
* `on_event_click` (`:any`) - Defaults to `nil`.
* `on_slot_click` (`:any`) - Defaults to `nil`.
* `translations` (`:map`) - Defaults to `%{}`.
* `time_format` (`:atom`) - Defaults to `:h24`.
* `class` (`:string`) - Defaults to `""`.
* `dir` (`:atom`) - Defaults to `:ltr`.
## Slots

* `event`
* `resource_label`

---

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