Scheduler Editor Components
nylas-scheduler-editor
Overview
The nylas-scheduler-editor
component is a form that allows users to configure the settings for the Nylas Scheduler.
Version | 1.3.6 |
Install (React) | npm install @nylas/react |
Import (React) | import { NylasSchedulerEditor } from '@nylas/react'; |
Import (CDN) | <script type="module">
import { defineCustomElement } from "https://cdn.jsdelivr.net/npm/@nylas/web-elements@latest/dist/cdn/nylas-scheduler-editor/nylas-scheduler-editor.es.js";
defineCustomElement();
</script> |
Example
Properties
Property | Attribute | Description | Type | Default |
---|---|---|---|---|
additionalParticipants | This prop is used to populate the additional participants and their availability in the scheduler editor. | AdditionalParticipant[] | undefined | |
conferenceProviders | This prop will be used to populate the conference provider options in the editor. | Record<string, string> | undefined | |
configurationId | The configuration id to use for the scheduler editor. | string | undefined | |
defaultAuthArgs | The default authentication arguments to use when authenticating a user. | AuthArgs[] | undefined | |
defaultLanguage | This prop will allow to set a default language for the Nylas scheduling page. | LANGUAGE_CODE | undefined | |
defaultSchedulerConfigState | The default scheduler config store state. | SchedulerConfigState | undefined | |
enableUserFeedback | Indicates if the user feedback feature is enabled. | boolean | true | |
eventOverrides | This provides a way to override the default event handlers. | EventOverrides | {} | |
experimentalFeatures | This prop is to opt in to experimental features. | Record<string, boolean> | undefined | |
hideEditorTabs | This optional prop is used to hide tabs in the editor. | Tab[] | [] | |
localization | This prop will allow to override the default localization strings for each language. | Locale | undefined | |
mode | This is used to set the mode for the scheduler config. | "app" | "composable" | 'app' | |
nylasApiRequest | The Nylas Api Request instance. | NylasApiRequest | undefined | |
nylasBranding | This prop will allow to show/hide the option to manage nylas branding in the email template. | boolean | true | |
nylasSessionsConfig | The Nylas Sessions configuration. | Config | undefined | |
requiresSlug | Indicates if a slug is required for the configuration. | boolean | false | |
schedulerPreviewLink | The scheduler preview link used when the user clicks the preview button. | string | '' |
Events
Event | Description | Type |
---|---|---|
init | This event is fired when the provider is initialized. | CustomEvent<HTMLNylasSchedulerEditorElement> |
loggedIn | This event is fired when the NylasAuth isAuthenticated state changes to true. | CustomEvent<HTMLNylasSchedulerEditorElement> |
loggedOut | This event is fired when the NylasAuth isAuthenticated state changes to false. | CustomEvent<HTMLNylasSchedulerEditorElement> |
schedulerConfigCloseClicked | This event is fired when the close button on scheduler config is clicked. | CustomEvent<HTMLNylasSchedulerEditorElement> |
Methods
schedulerConnector() => Promise<NylasSchedulerConfigConnector | undefined>
This method is used to get the NylasSchedulerConfigConnector instance.
store() => Promise<NylasSchedulerConfigStoreType | undefined>
This method is used to get the NylasSchedulerConfigStore instance.
Slots
Slot | Description |
---|---|
"custom-page-style-inputs" | This slot is used in “app” mode to pass a custom page style form. |
"login-required" | This slot is used to display a message when the user is not logged in. |
Shadow Parts
Part | Description |
---|---|
"nse__close-button" | The close button of the scheduler editor. |
"nse__content" | The content of the scheduler editor. |
"nse__header" | The header of the scheduler editor. |
"nse__language" | |
"nse__list-configurations" | The list of configurations. |
"nse__login-required" | The login required component. |
"nse__login-required-card" | The card of the login required component. |
"nse__login-required-disclaimer-text" | The icon of the login required component. |
"nse__login-required-google-button" | The Google button of the login required component. |
"nse__login-required-microsoft-button" | The Microsoft button of the login required component. |
"nse__login-required-other-provider-button" | The other provider button of the login required component. |
"nse__login-required-text" | The text of the login required component. |
"nse__title" | The title of the scheduler editor. |
Built with StencilJS