DateFormat

Interface of DateFormat
🏗 Coming Soon
Inform
Note: DateFormat must be imported from its specific location rather than the package root.

Import path: @looker/components/lib/DateFormat

As it's name implies, DateFormat is used to format a javascript Date object to human readable and localized text.

This is the sibling component of TimeFormat, which does the same thing for times. If no Date object is provided, it will default to Now.

Jul 27, 2020

Providing A Date Object

Wrap the DateFormat component around a javascript Date object to render a human-readable date.

May 13, 2020

Format

* medium is the default format

FORMATOUTPUT
Short07/27/2020
Medium *Jul 27, 2020
LongJuly 27th, 2020
FullMonday, July 27th, 2020

TimeZone

DateFormat, as well as TimeFormat assume that the provided date object is anchored in UTC time. If you need to adjust this to display correctly, you can pass the user's preferred time zone into the timeZone prop. This component will accept any string listed in the the IANA standard

May 6, 2020 GMT+12

I18n

DateFormat automatically formats the rendered date to the provided language/locale code.

  • Arabic: يولـ 27, 2020
  • Korean: 2020.07.27
  • German: 27. Jul. 2020

All supported Locales are listed below:

NameCode
Arabicar
Germande
Englishen
Spanishes
Frenchfr
Italianit
Japaneseja
Koreanko
Dutchnl
Polishpl
Portuguesept
PortugueseBrazilpt-br
Russianru
Swedishsv
Turkishtr
Chinesezh-cn
ChineseTaiwanzh-tw