PhoenixLiveCalendar.CalendarComponent (PhoenixLiveCalendar v0.1.0)

Copy Markdown View Source

The main calendar LiveComponent.

Manages internal state (current date, view mode, navigation) and renders the appropriate view. Communicates with the parent via callback functions.

Usage

<.live_component
  module={PhoenixLiveCalendar.CalendarComponent}
  id="my-calendar"
  events={@events}
  on_date_select={fn date -> send(self(), {:date_selected, date}) end}
  on_event_click={fn event_id -> send(self(), {:event_clicked, event_id}) end}
/>

Full example with all options

<.live_component
  module={PhoenixLiveCalendar.CalendarComponent}
  id="booking-calendar"
  events={@events}
  resources={@resources}
  view={:week}
  views={[:day, :week, :month]}
  date={@current_date}
  selected_date={@selected_date}
  week_start={1}
  min_time={~T[08:00:00]}
  max_time={~T[20:00:00]}
  slot_duration={15}
  time_format={:h12}
  business_hours={@business_hours}
  translations={%{labels: %{today: "Aujourd'hui"}}}
  dir={:ltr}
  on_date_select={fn date -> send(self(), {:date_selected, date}) end}
  on_range_select={fn range -> send(self(), {:range_selected, range}) end}
  on_event_click={fn event_id -> send(self(), {:event_clicked, event_id}) end}
  on_event_drop={fn data -> send(self(), {:event_dropped, data}) end}
  on_view_change={fn data -> send(self(), {:view_changed, data}) end}
/>