nylas-locale-switch
Overview
The nylas-locale-switch component is a UI component that allows users to select a timezone and language.
| Version | 2.2.4 |
| Install (React) | npm install @nylas/react |
| Import (React) | import { NylasLocaleSwitch } from '@nylas/react'; |
| Import (CDN) | You do not need to individually import the component, just import the parent component either nylas-scheduling or nylas-scheduler-editor. |
Example
Properties
| Property | Attribute | Description | Type | Default |
|---|---|---|---|---|
selectedLanguage | The selected language. | string | `this.bookingInfo?.language | |
selectedTimezone | The selected timezone. | string | `this.bookingInfo?.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.
| Property | Attribute | Description | Type | Default |
|---|---|---|---|---|
bookingInfo | The booking info. | undefined | { primaryParticipant: NylasSchedulerBookingParticipant; startTime?: Date | undefined; endTime?: Date | undefined; timezone?: string | undefined; language?: string | undefined; guests?: NylasSchedulerBookingParticipant[] | undefined; additionalFields?: Record<string, { value: string; type?: string | undefined; readOnly?: boolean | undefined; }> | undefined; } | undefined | |
themeConfig | The theme configuration. | any | undefined |
Events
| Event | Description | Type |
|---|---|---|
languageChanged | This event is fired when the language is changed. | CustomEvent<string> |
timezoneChanged | This event is fired when the timezone is changed. | CustomEvent<string> |
Shadow Parts
| Part | Description |
|---|---|
"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