Locale API: Sample Flows

This article presents possible use cases and corresponding sample flows that you can support. It provides a useful starting point as you plan your implementation.

Show dates and times in the site time zone

To show dates and times in the site time zone, follow these steps:

1. Read the site's regional format and time zone:

   Copy

2. Create a date formatter with both. Specify locale as the locale and timeZone as the timeZone option:

   Copy

3. Format the date. For example, an event that starts at 2026-10-15T23:00:00Z shows as Oct 15, 2026, 7:00 PM for every site visitor on a site whose regional format is en-US and whose time zone is America/New_York:

   Copy

4. Render the formatted string:

   Copy

Support languages written from right to left

To support languages written from right to left, follow these steps:

1. Read the site's text direction. If the component has its own direction setting, such as a componentDirection prop of your own, use that first, and fall back to the site's:

   Copy

2. Set it as the dir attribute of the component's root element:

   Copy

3. Style the component with CSS logical properties, such as margin-inline-start instead of margin-left, so the layout mirrors when dir is rtl:

   Copy