Skua.Components.Date (Skua v0.1.0)

Copy Markdown View Source

A date input — a hidden ISO <input> that carries the value plus a trigger that opens a keyboard-navigable calendar (W3C APG date-grid pattern).

<.date_input field={@form[:due_on]} label="Due date" />
<.date_input field={@form[:start]} min="2026-01-01" max="2026-12-31" />

The hidden input holds yyyy-mm-dd, so phx-change/phx-submit and Ecto :date casting work unchanged. The calendar grid supports arrow keys (±1 day / ±1 week), Home/End (week), PageUp/PageDown (month), and Enter/Space to pick.

Summary

Functions

date_input(assigns)
datetime_input(assigns)

A date and time picker — a time bar (hour / minute / AM·PM, or 24h military) sits above the calendar. The hidden value is an ISO datetime (yyyy-mm-ddThh:mm).

Functions

date_input(assigns)

Attributes

  • field (Phoenix.HTML.FormField) - Defaults to nil.
  • id (:string) - Defaults to nil.
  • name (:string) - Defaults to nil.
  • value (:any) - ISO yyyy-mm-dd. Defaults to nil.
  • min (:string) - Defaults to nil.
  • max (:string) - Defaults to nil.
  • today (:string) - Defaults to nil.
  • label (:string) - Defaults to nil.
  • hint (:string) - Defaults to nil.
  • errors (:list) - Defaults to nil.
  • required (:boolean) - Defaults to false.
  • placeholder (:string) - Defaults to "Pick a date…".
  • time (:boolean) - also pick a time (datetime value). Defaults to false.
  • time_format (:string) - 12h AM/PM or 24h military. Defaults to "12". Must be one of "12", or "24".

datetime_input(assigns)

A date and time picker — a time bar (hour / minute / AM·PM, or 24h military) sits above the calendar. The hidden value is an ISO datetime (yyyy-mm-ddThh:mm).

<.datetime_input field={@form[:starts_at]} label="Starts" />
<.datetime_input field={@form[:starts_at]} time_format="24" />

Attributes

  • field (Phoenix.HTML.FormField) - Defaults to nil.
  • id (:string) - Defaults to nil.
  • name (:string) - Defaults to nil.
  • value (:any) - ISO yyyy-mm-ddThh:mm. Defaults to nil.
  • min (:string) - Defaults to nil.
  • max (:string) - Defaults to nil.
  • today (:string) - Defaults to nil.
  • label (:string) - Defaults to nil.
  • hint (:string) - Defaults to nil.
  • errors (:list) - Defaults to nil.
  • required (:boolean) - Defaults to false.
  • placeholder (:string) - Defaults to "Pick a date & time…".
  • time_format (:string) - Defaults to "12". Must be one of "12", or "24".