Timezone Display

Display and select timezones

SaaSCalendar

Overview

TimezoneDisplay renders timezone information as inline text. It supports three display formats: short name (e.g. "EST"), long name (e.g. "Eastern Standard Time"), and UTC offset (e.g. "UTC-05:00"). Useful alongside date/time fields and calendar components.

Usage

import { TimezoneDisplay } from "@leanicon/web-builder-library/saas";

<TimezoneDisplay timezone="America/New_York" />;
<TimezoneDisplay timezone="Europe/London" format="long" />;
<TimezoneDisplay timezone="Asia/Tokyo" format="offset" />;

Variants

Short Format (Default)

EDT

Long Format

Eastern Daylight Time

Offset Format

UTC-04:00

Different Timezones

EDTGMT+1GMT+9

Timezones (Dark)

Eastern Daylight TimeUTC+01:00GMT+9

Props

Name	Type	Default	Required	Description
`timezone`	`string`	—	Yes	Timezone identifier (e.g., 'America/New_York')
`format`	`enum`	`short`	No	Display format
`referenceTime`	`string`	—	No	Reference time for offset calculation
`className`	`string`	—	No	Custom class name