nylas-locale-switch

Overview

The nylas-locale-switch component is a UI component that allows users to select a timezone and language.

Version1.3.3
Install (React)npm install @nylas/react
Import (React)import { NylasLocaleSwitch } from '@nylas/react';
Import (CDN)<script type="module"> import { defineCustomElement } from "https://cdn.jsdelivr.net/npm/@nylas/web-elements@latest/dist/cdn/nylas-locale-switch/nylas-locale-switch.es.js"; defineCustomElement(); </script>

Example


Properties

PropertyAttributeDescriptionTypeDefault
selectedLanguageThe selected language.stringnavigator.language
selectedTimezoneThe selected timezone.stringIntl.DateTimeFormat().resolvedOptions().timeZone

Standalone Props

ⓘ NOTE: The following props are automatically configured when used within nylas-scheduling. Set these props manually only if you’re using the component independently.
PropertyAttributeDescriptionTypeDefault
themeConfigThe theme configuration.anyundefined

Events

EventDescriptionType
languageChangedThis event is fired when the language is changed.CustomEvent<string>
timezoneChangedThis event is fired when the timezone is changed.CustomEvent<string>

Shadow Parts

PartDescription
"nls"The locale switch container
"nls__language"The language select container
"nls__language-drop-button"The language dropdown button
"nls__language-drop-content"The language dropdown content
"nls__language-drop-label"The language dropdown label
"nls__language-dropdown"The language dropdown
"nls__timezone"The timezone select container
"nls__timezone-drop-button"The timezone dropdown button
"nls__timezone-drop-button-selected-label"The timezone dropdown button selected label
"nls__timezone-drop-content"The timezone dropdown content
"nls__timezone-drop-label"The timezone dropdown label
"nls__timezone-dropdown"The timezone dropdown

Built with StencilJS