Components Local time
Petal Framework

Local time

Display the user's local time in the format of your choice.
UTC:
Fri, 01 Dec 2023 02:50:57 +0000
Local:
your_live_view.html.heex

How to access

Membership
$299
-> 
See plans

This comes with the Petal Framework private hex package. Purchase a membership to get access to this package. It can be used with any Phoenix project. Post-expiration, you'll retain access but won't be eligible for updates from newer versions.

Here’s a list of the presets:

DATE_SHORT => 10/14/1983
DATE_MED => Oct 14, 1983
DATE_MED_WITH_WEEKDAY => Fri, Oct 14, 1983
DATE_FULL => October 14, 1983
DATE_HUGE => Friday, October 14, 1983
TIME_SIMPLE => 1:30 PM
TIME_WITH_SECONDS => 1:30:23 PM
TIME_WITH_SHORT_OFFSET => 1:30:23 PM EDT
TIME_WITH_LONG_OFFSET => 1:30:23 PM Eastern Daylight Time
TIME_24_SIMPLE => 13:30
TIME_24_WITH_SECONDS => 13:30:23
TIME_24_WITH_SHORT_OFFSET => 13:30:23 EDT
TIME_24_WITH_LONG_OFFSET => 13:30:23 Eastern Daylight Time
DATETIME_SHORT => 10/14/1983, 1:30 PM
DATETIME_MED => Oct 14, 1983, 1:30 PM
DATETIME_FULL => October 14, 1983 at 1:30 PM EDT
DATETIME_HUGE => Friday, October 14, 1983 at 1:30 PM Eastern Daylight Time
DATETIME_SHORT_WITH_SECONDS => 10/14/1983, 1:30:23 PM
DATETIME_MED_WITH_SECONDS => Oct 14, 1983, 1:30:23 PM
DATETIME_FULL_WITH_SECONDS => October 14, 1983 at 1:30:23 PM EDT
DATETIME_HUGE_WITH_SECONDS => Friday, October 14, 1983 at 1:30:23 PM Eastern Daylight Time

If you want precise formatting, you can use the format attribute. See the Luxon docs for more information.

Properties 

            # <.local_time>
  attr(:for, :string, default: nil, doc: "A DateTime or Timex struct.")
  attr(:preset, :string, default: "DATE_MED", values: ["DATE_SHORT", "DATE_MED", "DATE_MED_WITH_WEEKDAY", "DATE_FULL", "DATE_HUGE", "TIME_SIMPLE", "TIME_WITH_SECONDS", "TIME_WITH_SHORT_OFFSET", "TIME_WITH_LONG_OFFSET", "TIME_24_SIMPLE", "TIME_24_WITH_SECONDS", "TIME_24_WITH_SHORT_OFFSET", "TIME_24_WITH_LONG_OFFSET", "DATETIME_SHORT", "DATETIME_MED", "DATETIME_FULL", "DATETIME_HUGE", "DATETIME_SHORT_WITH_SECONDS", "DATETIME_MED_WITH_SECONDS", "DATETIME_FULL_WITH_SECONDS", "DATETIME_HUGE_WITH_SECONDS"] doc: "A preset format.")
  attr(:format, :string)
  attr(:class, :string)
  attr(:locale, :string, doc: "The locale to use. Eg. 'en', 'fr', 'es', etc.")
  attr(:rest, :global, doc: "Forwarded to the time element.")