PhiaUi.Components.StreakCalendar (phia_ui v0.1.17)

Copy Markdown View Source

Duolingo/Fitbit-style habit streak calendar.

Shows daily completion states (:completed, :missed, :rest) for a given month. Displays streak count in header. Unlike HeatmapCalendar (GitHub intensity 0-4), StreakCalendar focuses on binary habit completion with emotional/motivational UX.

Example

<.streak_calendar
  year={2026}
  month={3}
  entries={%{~D[2026-03-01] => :completed, ~D[2026-03-02] => :missed}}
  streak_count={5}
  on_select="pick_day"
  on_prev="prev_month"
  on_next="next_month"
/>

Summary

Functions

streak_calendar(assigns)

Functions

streak_calendar(assigns)

Attributes

  • year (:integer) (required)
  • month (:integer) (required)
  • entries (:map) - Defaults to %{}.
  • streak_count (:integer) - Defaults to 0.
  • on_select (:string) - Defaults to nil.
  • on_prev (:string) - Defaults to nil.
  • on_next (:string) - Defaults to nil.
  • class (:string) - Defaults to nil.
  • Global attributes are accepted.