@nylas/web-elements 2.4.1 → 2.5.0-canary-20260306042320

package/dist/esm/google-logo-icon_6.entry.js

@@ -1,7 +1,7 @@
 import { r as registerInstance, h, F as Fragment, c as createEvent, H as Host, a as getElement } from './index-0EQQA0nE.js';
 import { R as RegisterComponent } from './register-component-BhgAknhp.js';
 import { a as debug, i as instance, m as mergeDeep, p as parsePreviewLink, g as getCalendarRange } from './utils-Dgw5dv37.js';
-import { u, v as version } from './version-BCn0rl0y.js';
+import { u, v as version } from './version-ClDvNLDf.js';
 import { D as DEFAULT_OPEN_HOURS, e as editorTabComponentNames, C as CONFIGURATION_EVENT_TYPE, b as editorGroupTabComponentNames } from './constants-COJy29df.js';
 import { E as ErrorCategory, i as isInitialized, a as init, c as captureMessage, b as captureFeedback, f as feedbackSyncIntegration } from './feedbackSync-CquJ7U5v.js';
 
@@ -14,7 +14,7 @@ const GoogleLogoIcon = class {
         this.height = '24';
     }
     render() {
-        return (h("svg", { key: '321e06fd36a2878ba18eb0a1fe686bb4d1b077c4', width: this.width, height: this.height, viewBox: "0 0 24 24", fill: "none", xmlns: "http://www.w3.org/2000/svg" }, h("g", { key: 'd0417c40f2ea77f1bc6a6cb47520cf5f2cfd144b', "clip-path": "url(#clip0_959_12452)" }, h("path", { key: 'f13d5c6d7706f8d5c0495d0d66f6d6b7f3045f26', d: "M23.745 12.27C23.745 11.48 23.675 10.73 23.555 10H12.255V14.51H18.725C18.435 15.99 17.585 17.24 16.325 18.09V21.09H20.185C22.445 19 23.745 15.92 23.745 12.27Z", fill: "#4285F4" }), h("path", { key: '81631d66e784df5013d110fb5253832e6d5fcaf4', d: "M12.255 24C15.495 24 18.205 22.92 20.185 21.09L16.325 18.09C15.245 18.81 13.875 19.25 12.255 19.25C9.12504 19.25 6.47505 17.14 5.52505 14.29H1.54504V17.38C3.51504 21.3 7.56504 24 12.255 24Z", fill: "#34A853" }), h("path", { key: '963322982a906f86a738b4c1d2a32599bb4cb2ce', d: "M5.52501 14.2901C5.27501 13.5701 5.145 12.8001 5.145 12.0001C5.145 11.2001 5.28501 10.4301 5.52501 9.71012V6.62012H1.545C0.725004 8.24012 0.255005 10.0601 0.255005 12.0001C0.255005 13.9401 0.725004 15.7601 1.545 17.3801L5.52501 14.2901Z", fill: "#FBBC05" }), h("path", { key: '4d50017f75f4299e5707d24d2114ba4ade15b589', d: "M12.255 4.75C14.025 4.75 15.605 5.36 16.855 6.55L20.275 3.13C18.205 1.19 15.495 0 12.255 0C7.56504 0 3.51504 2.7 1.54504 6.62L5.52505 9.71C6.47505 6.86 9.12504 4.75 12.255 4.75Z", fill: "#EA4335" })), h("defs", { key: '1fbbe716dc4ddbec33a34da06ce9508ad0d44d50' }, h("clipPath", { key: 'c26e1c0f93fdc6f972250126f44ac655facfb1c8', id: "clip0_959_12452" }, h("rect", { key: 'ef7c3507888b8b65b069c5440323625f252b54ec', width: 24, height: 24, fill: "white" })))));
+        return (h("svg", { key: '33a9865778f760760ebf770633523215edf516c3', width: this.width, height: this.height, viewBox: "0 0 24 24", fill: "none", xmlns: "http://www.w3.org/2000/svg" }, h("g", { key: '7f9bd4b06f1b97de60c01c37c5c509e776b8d6e1', "clip-path": "url(#clip0_959_12452)" }, h("path", { key: 'dbc7d5ff82edffd7b35da27fefe16ae304f42130', d: "M23.745 12.27C23.745 11.48 23.675 10.73 23.555 10H12.255V14.51H18.725C18.435 15.99 17.585 17.24 16.325 18.09V21.09H20.185C22.445 19 23.745 15.92 23.745 12.27Z", fill: "#4285F4" }), h("path", { key: 'd1bf2e40b91f0fb9e0f3deb52fe0d33bc595ccd1', d: "M12.255 24C15.495 24 18.205 22.92 20.185 21.09L16.325 18.09C15.245 18.81 13.875 19.25 12.255 19.25C9.12504 19.25 6.47505 17.14 5.52505 14.29H1.54504V17.38C3.51504 21.3 7.56504 24 12.255 24Z", fill: "#34A853" }), h("path", { key: 'd87d93140cf0e41444fb1a7d84b6e47fc861765e', d: "M5.52501 14.2901C5.27501 13.5701 5.145 12.8001 5.145 12.0001C5.145 11.2001 5.28501 10.4301 5.52501 9.71012V6.62012H1.545C0.725004 8.24012 0.255005 10.0601 0.255005 12.0001C0.255005 13.9401 0.725004 15.7601 1.545 17.3801L5.52501 14.2901Z", fill: "#FBBC05" }), h("path", { key: '6eb01c2c48e94e3c817afc121931de67bde47f90', d: "M12.255 4.75C14.025 4.75 15.605 5.36 16.855 6.55L20.275 3.13C18.205 1.19 15.495 0 12.255 0C7.56504 0 3.51504 2.7 1.54504 6.62L5.52505 9.71C6.47505 6.86 9.12504 4.75 12.255 4.75Z", fill: "#EA4335" })), h("defs", { key: 'd8e80696c6090b414e6a5c42c31f3ec620bd65e0' }, h("clipPath", { key: 'deb809cb1b5ceda12780385926828c0c60cbe4db', id: "clip0_959_12452" }, h("rect", { key: 'ad65b33032861fcadb6ae9bd90938647cbc0e3b7', width: 24, height: 24, fill: "white" })))));
     }
 };
 GoogleLogoIcon.style = iconCss$1;
@@ -28,7 +28,7 @@ const MicrosoftLogoIcon = class {
         this.height = '22';
     }
     render() {
-        return (h("svg", { key: 'b4194177cd085931dc3be3b3cd66e19f2587b128', width: this.width, height: this.height, viewBox: "0 0 22 22", fill: "none", xmlns: "http://www.w3.org/2000/svg" }, h("path", { key: 'fa3e196bca9c1913133bf93e401cc3d3414efa49', d: "M0.043457 0.043457H10.4782V10.4782H0.043457V0.043457Z", fill: "#F35325" }), h("path", { key: 'a2c7303fdbc61a7a3612a19b9c57dcfb25f7d6a8', d: "M11.5217 0.043457H21.9565V10.4782H11.5217V0.043457Z", fill: "#81BC06" }), h("path", { key: 'd8c463d7c7d73e8e3ff3a6e16228ef14bf53c02e', d: "M0.043457 11.5217H10.4782V21.9565H0.043457V11.5217Z", fill: "#05A6F0" }), h("path", { key: '1218434597852bbe589d4fdb97d935463ef454ba', d: "M11.5217 11.5217H21.9565V21.9565H11.5217V11.5217Z", fill: "#FFBA08" })));
+        return (h("svg", { key: '0452012e39d88b7e92b3607ea38d303844addb7b', width: this.width, height: this.height, viewBox: "0 0 22 22", fill: "none", xmlns: "http://www.w3.org/2000/svg" }, h("path", { key: '2de410b921afe31ade8481f5b9c0379b3d7192e2', d: "M0.043457 0.043457H10.4782V10.4782H0.043457V0.043457Z", fill: "#F35325" }), h("path", { key: '9075a7a167fc9ab45e8430ccf7abcc90ea4f5130', d: "M11.5217 0.043457H21.9565V10.4782H11.5217V0.043457Z", fill: "#81BC06" }), h("path", { key: '20a99dda14586e9dccf6992c67ed5f6dd467099b', d: "M0.043457 11.5217H10.4782V21.9565H0.043457V11.5217Z", fill: "#05A6F0" }), h("path", { key: '0a9b9823f799591953e2cd972341b6bfe0a88eea', d: "M11.5217 11.5217H21.9565V21.9565H11.5217V11.5217Z", fill: "#FFBA08" })));
     }
 };
 MicrosoftLogoIcon.style = iconCss;
@@ -549,9 +549,9 @@ const NylasEditorTabs = class {
     getFormStateFromConfig(config) {
         let organizerParticipant = config?.participants?.find(p => p.is_organizer);
         if (!organizerParticipant && config?.availability?.availability_rules?.availability_method !== 'collective') {
-            organizerParticipant = config?.participants?.find(p => p.email === this.currentUser?.email);
-            if (organizerParticipant) {
-                organizerParticipant.is_organizer = true;
+            const matched = config?.participants?.find(p => p.email === this.currentUser?.email);
+            if (matched) {
+                organizerParticipant = { ...matched, is_organizer: true };
             }
         }
         if (config?.appearance) {
@@ -570,7 +570,9 @@ const NylasEditorTabs = class {
             additionalFields: config?.scheduler?.additional_fields ?? {},
             conferencing: config?.event_booking?.conferencing ?? {},
             calendarIds: organizerParticipant?.availability?.calendar_ids ?? [],
-            participants: config?.participants ?? [],
+            participants: organizerParticipant
+                ? (config?.participants ?? []).map(p => (p.email === organizerParticipant.email ? { ...p, is_organizer: true } : p))
+                : config?.participants ?? [],
             bookingCalendar: organizerParticipant?.booking?.calendar_id ?? organizerParticipant?.email ?? '',
             location: config?.event_booking?.location ?? '',
             bookingType: config?.event_booking?.booking_type ?? 'booking',
@@ -773,10 +775,10 @@ const NylasEditorTabs = class {
     }
     render() {
         debug('[nylas-editor-tabs]', 'render', this.formState);
-        return (h(Host, { key: 'b41d4bd9d8d60e730f7422a3df9ebdd19e4d4683' }, h("nylas-notification", { key: '6f44d05ba6a9aea88353ef54e8cb7be4aa2b332d' }), h("form", { key: 'a8f8f95e33bf47825a4b22b7bdc2b8e1f6f7c881', onSubmit: this.formSubmissionHandler, class: "scheduler-editor", ref: el => (this.formRef = el), noValidate: true }, this.mode === 'app' ? (h("div", { class: "form-contents", part: "editor__form-contents net__form-contents" }, h("div", { class: "tabs", part: "editor__tabs net__tabs" }, h("button", { name: Tab.EventInfo, class: { tab: true, active: this.activeTab == Tab.EventInfo, hide: this.hideTab(Tab.EventInfo) }, part: "editortab__event-info net__tab-event-info", onClick: e => this.setActiveTab(e, Tab.EventInfo) }, h("calendar-info-icon", { width: "16", height: "16" }), instance.t('eventInfoTab')), h("button", { name: Tab.Availability, class: { tab: true, active: this.activeTab == Tab.Availability, hide: this.hideTab(Tab.Availability) }, part: "editortab__availability net__tab-availability", onClick: e => this.setActiveTab(e, Tab.Availability) }, h("calendar-patterns-icon", { width: "16", height: "16" }), instance.t('availabilityTab')), h("button", { name: Tab.Participants, class: { tab: true, active: this.activeTab == Tab.Participants, hide: this.hideTab(Tab.Participants) }, part: "editortab__participants net__tab-participants", onClick: e => this.setActiveTab(e, Tab.Participants) }, h("people-icon", { width: "16", height: "16" }), instance.t('participantsTab')), h("button", { name: Tab.BookingOptions, class: { tab: true, active: this.activeTab == Tab.BookingOptions, hide: this.hideTab(Tab.BookingOptions) }, part: "editortab__booking-options net__tab-booking-options", onClick: e => this.setActiveTab(e, Tab.BookingOptions) }, h("flow-icon", { width: "16", height: "16" }), instance.t('bookingOptionsTab')), h("button", { name: Tab.BookingForm, class: { tab: true, active: this.activeTab == 'bookingForm', hide: this.hideTab(Tab.BookingForm) }, part: "editortab__booking-form net__tab-booking-form", onClick: e => this.setActiveTab(e, Tab.BookingForm) }, this.activeTab == Tab.BookingForm ? h("calendar-agenda-fill-icon", { width: "16", height: "16" }) : h("calendar-agenda-icon", { width: "16", height: "16" }), instance.t('bookingFormTab')), h("button", { name: Tab.Communications, class: { tab: true, active: this.activeTab == 'communications', hide: this.hideTab(Tab.Communications) }, onClick: e => this.setActiveTab(e, Tab.Communications), part: "editortab__communications net__tab-communications" }, this.activeTab == Tab.Communications ? h("envelope-fill-icon", { width: "16", height: "16" }) : h("envelope-icon", { width: "16", height: "16" }), instance.t('communicationsTab')), h("button", { name: Tab.PageStyles, class: { tab: true, active: this.activeTab == 'pageStyles', hide: this.hideTab(Tab.PageStyles) }, onClick: e => this.setActiveTab(e, Tab.PageStyles), part: "editortab__page-styles net__tab-page-styles" }, this.activeTab == Tab.PageStyles ? h("paintbrush-fill-icon", { width: "16", height: "16" }) : h("paintbrush-icon", { width: "16", height: "16" }), instance.t('pageStylesTab'))), h("div", { class: {
+        return (h(Host, { key: '3208f39a508ec43ac747af3d983b5c8a1cded53f' }, h("nylas-notification", { key: '70f0482be4f65c4c32a58c6f02fe6fa142d5d529' }), h("form", { key: '4832611c1a0cf626d85d8fcb23ceeac210bb9f1e', onSubmit: this.formSubmissionHandler, class: "scheduler-editor", ref: el => (this.formRef = el), noValidate: true }, this.mode === 'app' ? (h("div", { class: "form-contents", part: "editor__form-contents net__form-contents" }, h("div", { class: "tabs", part: "editor__tabs net__tabs" }, h("button", { name: Tab.EventInfo, class: { tab: true, active: this.activeTab == Tab.EventInfo, hide: this.hideTab(Tab.EventInfo) }, part: "editortab__event-info net__tab-event-info", onClick: e => this.setActiveTab(e, Tab.EventInfo) }, h("calendar-info-icon", { width: "16", height: "16" }), instance.t('eventInfoTab')), h("button", { name: Tab.Availability, class: { tab: true, active: this.activeTab == Tab.Availability, hide: this.hideTab(Tab.Availability) }, part: "editortab__availability net__tab-availability", onClick: e => this.setActiveTab(e, Tab.Availability) }, h("calendar-patterns-icon", { width: "16", height: "16" }), instance.t('availabilityTab')), h("button", { name: Tab.Participants, class: { tab: true, active: this.activeTab == Tab.Participants, hide: this.hideTab(Tab.Participants) }, part: "editortab__participants net__tab-participants", onClick: e => this.setActiveTab(e, Tab.Participants) }, h("people-icon", { width: "16", height: "16" }), instance.t('participantsTab')), h("button", { name: Tab.BookingOptions, class: { tab: true, active: this.activeTab == Tab.BookingOptions, hide: this.hideTab(Tab.BookingOptions) }, part: "editortab__booking-options net__tab-booking-options", onClick: e => this.setActiveTab(e, Tab.BookingOptions) }, h("flow-icon", { width: "16", height: "16" }), instance.t('bookingOptionsTab')), h("button", { name: Tab.BookingForm, class: { tab: true, active: this.activeTab == 'bookingForm', hide: this.hideTab(Tab.BookingForm) }, part: "editortab__booking-form net__tab-booking-form", onClick: e => this.setActiveTab(e, Tab.BookingForm) }, this.activeTab == Tab.BookingForm ? h("calendar-agenda-fill-icon", { width: "16", height: "16" }) : h("calendar-agenda-icon", { width: "16", height: "16" }), instance.t('bookingFormTab')), h("button", { name: Tab.Communications, class: { tab: true, active: this.activeTab == 'communications', hide: this.hideTab(Tab.Communications) }, onClick: e => this.setActiveTab(e, Tab.Communications), part: "editortab__communications net__tab-communications" }, this.activeTab == Tab.Communications ? h("envelope-fill-icon", { width: "16", height: "16" }) : h("envelope-icon", { width: "16", height: "16" }), instance.t('communicationsTab')), h("button", { name: Tab.PageStyles, class: { tab: true, active: this.activeTab == 'pageStyles', hide: this.hideTab(Tab.PageStyles) }, onClick: e => this.setActiveTab(e, Tab.PageStyles), part: "editortab__page-styles net__tab-page-styles" }, this.activeTab == Tab.PageStyles ? h("paintbrush-fill-icon", { width: "16", height: "16" }) : h("paintbrush-icon", { width: "16", height: "16" }), instance.t('pageStylesTab'))), h("div", { class: {
                 'tab-content': true,
                 'fadeIn': this.loaded,
-            }, part: "editor__tab-content net__tab-content" }, h(TabContents, { formState: this.formState, activeTab: this.activeTab, currentUser: this.currentUser, calendars: this.calendars, id: this.selectedConfiguration?.id ?? 'new', i18next: instance, enableNotetaker: this.enableNotetaker, themeConfig: this.themeConfig })))) : (h("div", { class: "composable", key: this.selectedConfiguration?.id }, h("slot", null))), h("div", { key: 'd4ac2bf13c4019e710175b5915a21d942fae8d26', class: "footer", part: "editor__footer net__footer" }, h("div", { key: '379f9fbc86952971d8642e6ece0724304ce2fec9', class: "preview", part: "editor__footer-preview net__footer-preview" }, this.enableUserFeedback && (h("button-component", { key: '750a06210d1597d173d7f8fccb58c0cefffda7c6', title: "Share your feedback", id: "report-issue", variant: 'basic', onClick: e => this.onFeedbackClick(e) }, h("feedback-icon", { key: '175b23faf28f40bfd9453563c9fb08604d417558' })))), h("div", { key: 'b41b16eac7aa69fe5777afae1b8dc9e06293e40c', class: "buttons", part: "editor__footer-buttons net__footer-buttons" }, h("p", { key: '9b6ca9646d3823d981993a423cca27802038b788', class: {
+            }, part: "editor__tab-content net__tab-content" }, h(TabContents, { formState: this.formState, activeTab: this.activeTab, currentUser: this.currentUser, calendars: this.calendars, id: this.selectedConfiguration?.id ?? 'new', i18next: instance, enableNotetaker: this.enableNotetaker, themeConfig: this.themeConfig })))) : (h("div", { class: "composable", key: this.selectedConfiguration?.id }, h("slot", null))), h("div", { key: '6395ba71baac9231cc611c3115e2b187ba1e2f5b', class: "footer", part: "editor__footer net__footer" }, h("div", { key: '158ec85efe1ff775b6ff1574169c0a44830f2d6d', class: "preview", part: "editor__footer-preview net__footer-preview" }, this.enableUserFeedback && (h("button-component", { key: '398f3f661a6f184fdb6ba96e9fb6449bddc99d15', title: "Share your feedback", id: "report-issue", variant: 'basic', onClick: e => this.onFeedbackClick(e) }, h("feedback-icon", { key: 'fad84a1e271d43f6ffc1e664c6675ab285dfe18f' })))), h("div", { key: 'cffb8a1998ac6e4f79f27dbe19257b4196617a30', class: "buttons", part: "editor__footer-buttons net__footer-buttons" }, h("p", { key: 'ee018e6bbb188351e318827fa36f59551aa65b17', class: {
                 'unsaved-changes': this.hasUnsavedChanges && !this.changesSaved,
                 'saved-changes': this.changesSaved,
                 'error': this.error?.message !== '',
@@ -785,17 +787,17 @@ const NylasEditorTabs = class {
             ? instance.t('unsavedChangesLabel')
             : this.error?.message == '' && this.changesSaved
                 ? `${instance.t('changesSavedLabel')}!`
-                : ''), this.schedulerPreviewLink !== '' && this.action === 'edit' && (h("button-component", { key: 'a2c69389ba413f9cb559c22bb07483215744ac31', title: "Preview", type: "button", disabled: this.isLoading, clickHandler: event => {
+                : ''), this.schedulerPreviewLink !== '' && this.action === 'edit' && (h("button-component", { key: '761c4ecdd4d3ac357435ddbe2d557f39f32ac350', title: "Preview", type: "button", disabled: this.isLoading, clickHandler: event => {
                 event.preventDefault();
                 const previewEvent = this.previewButtonClicked.emit(this.host);
                 if (!previewEvent.defaultPrevented) {
                     window.open(parsePreviewLink(this.schedulerPreviewLink, this.selectedConfiguration), '_blank');
                 }
-            }, variant: 'basic' }, h("eye-icon", { key: 'ae655b5e30405cdbffd0f275fc1c05f0ed3d6cd6' }))), h("button-component", { key: 'db8a87300698d9d96d92e46c6a5465e726a86cd8', type: "button", disabled: this.isLoading, clickHandler: event => {
+            }, variant: 'basic' }, h("eye-icon", { key: 'cf193804e171684c2ce74591b33020201c9de6d1' }))), h("button-component", { key: 'ac74133a700d9d8fae4a36abb1778bf05dd6cf16', type: "button", disabled: this.isLoading, clickHandler: event => {
                 event.preventDefault();
                 this.cancelButtonClick.emit();
                 this.host.resetError();
-            }, variant: 'basic', part: "editor__footer-cancel net__footer-cancel" }, instance.t('cancelButton')), h("button-component", { key: '2cff61d3eeaa9100a62f245b4431c67309765555', class: { 'save-changes': this.action === 'edit' }, type: "submit", disabled: this.isLoading, part: "editor__footer-cta, net__footer-cta" }, this.isLoading ? (h("span", null, instance.t('savingButtonText'), h("loading-icon", null), ' ')) : this.action === 'create' ? (`${instance.t('createButtonText')}`) : (`${instance.t('saveChangesButtonText')}`))))), this.showFeedbackModal && h("nylas-feedback-form", { key: 'e88630864d247e110e5e39b6e4536d16bcb48da5' })));
+            }, variant: 'basic', part: "editor__footer-cancel net__footer-cancel" }, instance.t('cancelButton')), h("button-component", { key: 'd7e08001521858b54eef4dc3eab8351b9561e7c9', class: { 'save-changes': this.action === 'edit' }, type: "submit", disabled: this.isLoading, part: "editor__footer-cta, net__footer-cta" }, this.isLoading ? (h("span", null, instance.t('savingButtonText'), h("loading-icon", null), ' ')) : this.action === 'create' ? (`${instance.t('createButtonText')}`) : (`${instance.t('saveChangesButtonText')}`))))), this.showFeedbackModal && h("nylas-feedback-form", { key: '05623c3de244b590970d3d416f24054affeef2f3' })));
     }
     get host() { return getElement(this); }
     static get watchers() { return {
@@ -1527,9 +1529,9 @@ const NylasEditorTabsGroup = class {
     }
     render() {
         debug('[nylas-editor-tabs-group]', 'render', this.formState);
-        return (h(Host, { key: '8f61e0ba84b0b86a27440220560eabcaeea4e1e5' }, h("nylas-notification", { key: '94cae29c1400ff371141100848c1037a8a7d322c' }), h("form", { key: 'a88d6973a4711a4489115b184db1b0535e123be7', onSubmit: this.formSubmissionHandler, class: "scheduler-editor", ref: el => (this.formRef = el), noValidate: true }, this.mode === 'app' ? (h("div", { class: "return-to-calendar-view", part: "editor__return-to-calendar-view net__return-to-calendar-view" }, h("button-component", { id: "return-to-calendar-view-button", variant: "invisible", part: "nset__header__back-button", type: "button", onClick: e => {
+        return (h(Host, { key: 'c9b6904c13acf2eb6cbc260a98edb524eadd1a99' }, h("nylas-notification", { key: '7d41d08cd2986ee09341cbefd54e4102a9658d5f' }), h("form", { key: '479da7a61dad3d166be884c33821cc0d5d9f404d', onSubmit: this.formSubmissionHandler, class: "scheduler-editor", ref: el => (this.formRef = el), noValidate: true }, this.mode === 'app' ? (h("div", { class: "return-to-calendar-view", part: "editor__return-to-calendar-view net__return-to-calendar-view" }, h("button-component", { id: "return-to-calendar-view-button", variant: "invisible", part: "nset__header__back-button", type: "button", onClick: e => {
                 this.setActiveTab(e, TabGroup.CalendarView);
-            } }, h("chevron-icon", { width: "16", height: "16" }), h("span", null, instance.t('returnToCalendarView'))))) : null, this.mode === 'app' ? (h("div", { class: "form-contents", part: "editor__form-contents net__form-contents" }, h("div", { class: "tabs", part: "editor__tabs net__tabs" }, h("button", { name: TabGroup.BookingOptions, class: { tab: true, active: this.activeTab == TabGroup.BookingOptions, hide: this.hideTab(TabGroup.BookingOptions) }, part: "editortab__booking-options net__tab-booking-options", onClick: e => this.setActiveTab(e, TabGroup.BookingOptions) }, h("flow-icon", { width: "16", height: "16" }), instance.t('bookingOptionsTab')), h("button", { name: TabGroup.BookingForm, class: { tab: true, active: this.activeTab == TabGroup.BookingForm, hide: this.hideTab(TabGroup.BookingForm) }, part: "editortab__booking-form net__tab-booking-form", onClick: e => this.setActiveTab(e, TabGroup.BookingForm) }, this.activeTab == TabGroup.BookingForm ? h("calendar-agenda-fill-icon", { width: "16", height: "16" }) : h("calendar-agenda-icon", { width: "16", height: "16" }), instance.t('bookingFormTab')), h("button", { name: TabGroup.Communications, class: { tab: true, active: this.activeTab == TabGroup.Communications, hide: this.hideTab(TabGroup.Communications) }, onClick: e => this.setActiveTab(e, TabGroup.Communications), part: "editortab__communications net__tab-communications" }, this.activeTab == TabGroup.Communications ? h("envelope-fill-icon", { width: "16", height: "16" }) : h("envelope-icon", { width: "16", height: "16" }), instance.t('communicationsTab')), h("button", { name: TabGroup.PageStyles, class: { tab: true, active: this.activeTab == TabGroup.PageStyles, hide: this.hideTab(TabGroup.PageStyles) }, onClick: e => this.setActiveTab(e, TabGroup.PageStyles), part: "editortab__page-styles net__tab-page-styles" }, this.activeTab == TabGroup.PageStyles ? h("paintbrush-fill-icon", { width: "16", height: "16" }) : h("paintbrush-icon", { width: "16", height: "16" }), instance.t('pageStylesTab'))), h("div", { class: "tab-content", part: "editor__tab-content net__tab-content" }, h(TabContentsGroup, { formState: this.formState, activeTab: this.activeTab, currentUser: this.currentUser, calendars: this.calendars, id: this.selectedConfiguration?.id ?? 'new', i18next: instance })))) : (h("div", { class: "composable", key: this.selectedConfiguration?.id }, h("slot", null))), h("div", { key: '3cc55875cbb83e00b3007c06b5804399ae24c164', class: "footer", part: "editor__footer net__footer" }, h("div", { key: '661552aaedc6dfde5eb0725c4b37f975e11b8f2e', class: "preview", part: "editor__footer-preview net__footer-preview" }, this.enableUserFeedback && (h("button-component", { key: 'e2daf60e19bc54d7c3e9a520e0f4ce1d5ffb66ad', title: "Share your feedback", id: "report-issue", variant: 'basic', onClick: e => this.onFeedbackClick(e) }, h("feedback-icon", { key: 'fe1744b7062f50672ff51f8d850145935c1c94fe' }))), this.activeTab === TabGroup.CalendarView && (h("button-component", { key: '0c5a82186e7ba4b919342613b55740a5c15d7ee5', class: "page-settings-button", title: "Go to page settings", id: "page-settings", variant: 'basic', onClick: e => this.setActiveTab(e, TabGroup.BookingOptions) }, instance.t('pageSettingsButton')))), h("div", { key: 'df369d271cd6fc78c9b4ad5667a88382d9f29a65', class: "buttons", part: "editor__footer-buttons net__footer-buttons" }, h("p", { key: '47b63ac1f8a5a90d4ba154acb2e6c4c5d6ef7545', class: {
+            } }, h("chevron-icon", { width: "16", height: "16" }), h("span", null, instance.t('returnToCalendarView'))))) : null, this.mode === 'app' ? (h("div", { class: "form-contents", part: "editor__form-contents net__form-contents" }, h("div", { class: "tabs", part: "editor__tabs net__tabs" }, h("button", { name: TabGroup.BookingOptions, class: { tab: true, active: this.activeTab == TabGroup.BookingOptions, hide: this.hideTab(TabGroup.BookingOptions) }, part: "editortab__booking-options net__tab-booking-options", onClick: e => this.setActiveTab(e, TabGroup.BookingOptions) }, h("flow-icon", { width: "16", height: "16" }), instance.t('bookingOptionsTab')), h("button", { name: TabGroup.BookingForm, class: { tab: true, active: this.activeTab == TabGroup.BookingForm, hide: this.hideTab(TabGroup.BookingForm) }, part: "editortab__booking-form net__tab-booking-form", onClick: e => this.setActiveTab(e, TabGroup.BookingForm) }, this.activeTab == TabGroup.BookingForm ? h("calendar-agenda-fill-icon", { width: "16", height: "16" }) : h("calendar-agenda-icon", { width: "16", height: "16" }), instance.t('bookingFormTab')), h("button", { name: TabGroup.Communications, class: { tab: true, active: this.activeTab == TabGroup.Communications, hide: this.hideTab(TabGroup.Communications) }, onClick: e => this.setActiveTab(e, TabGroup.Communications), part: "editortab__communications net__tab-communications" }, this.activeTab == TabGroup.Communications ? h("envelope-fill-icon", { width: "16", height: "16" }) : h("envelope-icon", { width: "16", height: "16" }), instance.t('communicationsTab')), h("button", { name: TabGroup.PageStyles, class: { tab: true, active: this.activeTab == TabGroup.PageStyles, hide: this.hideTab(TabGroup.PageStyles) }, onClick: e => this.setActiveTab(e, TabGroup.PageStyles), part: "editortab__page-styles net__tab-page-styles" }, this.activeTab == TabGroup.PageStyles ? h("paintbrush-fill-icon", { width: "16", height: "16" }) : h("paintbrush-icon", { width: "16", height: "16" }), instance.t('pageStylesTab'))), h("div", { class: "tab-content", part: "editor__tab-content net__tab-content" }, h(TabContentsGroup, { formState: this.formState, activeTab: this.activeTab, currentUser: this.currentUser, calendars: this.calendars, id: this.selectedConfiguration?.id ?? 'new', i18next: instance })))) : (h("div", { class: "composable", key: this.selectedConfiguration?.id }, h("slot", null))), h("div", { key: '2554173520780d66c2678317c0e7c0ce8f9b7891', class: "footer", part: "editor__footer net__footer" }, h("div", { key: '03ff0576a2eed2383781d8a1ab153001292a7dcb', class: "preview", part: "editor__footer-preview net__footer-preview" }, this.enableUserFeedback && (h("button-component", { key: '98e859aba1e56fec96d6f3cedd3663fde66e6de8', title: "Share your feedback", id: "report-issue", variant: 'basic', onClick: e => this.onFeedbackClick(e) }, h("feedback-icon", { key: '8a6b4f8b5eb9cf7f25cac24875e7824c7e861c62' }))), this.activeTab === TabGroup.CalendarView && (h("button-component", { key: 'f2382dd68caabb6786bf11ae46c438f654439866', class: "page-settings-button", title: "Go to page settings", id: "page-settings", variant: 'basic', onClick: e => this.setActiveTab(e, TabGroup.BookingOptions) }, instance.t('pageSettingsButton')))), h("div", { key: '51cbfc4a3927728693141b7ffd3c7ed497094c33', class: "buttons", part: "editor__footer-buttons net__footer-buttons" }, h("p", { key: '7970afb07a2a9630ccbb9ac31865cfb8c897674c', class: {
                 'unsaved-changes': this.hasUnsavedChanges && !this.changesSaved,
                 'saved-changes': this.changesSaved,
                 'error': this.error?.message !== '',
@@ -1538,17 +1540,17 @@ const NylasEditorTabsGroup = class {
             ? instance.t('unsavedChangesLabel')
             : this.error?.message == '' && this.changesSaved
                 ? `${instance.t('changesSavedLabel')}!`
-                : ''), h("div", { key: '1b1436cdc1da5ba05094e269cf1d4477bd8c25dd', class: "footer-buttons__row" }, this.schedulerPreviewLink !== '' && this.action === 'edit' && (h("button-component", { key: '62cf4336c52211179fb5900d756f3ed62936c498', title: "Preview", type: "button", disabled: this.isLoading, clickHandler: event => {
+                : ''), h("div", { key: 'b1fb12d75662758ea79a306b4a3df37dccb778aa', class: "footer-buttons__row" }, this.schedulerPreviewLink !== '' && this.action === 'edit' && (h("button-component", { key: 'b195e7968a5471451e5e3f64a65ce2034ad72372', title: "Preview", type: "button", disabled: this.isLoading, clickHandler: event => {
                 event.preventDefault();
                 const previewEvent = this.previewButtonClicked.emit(this.host);
                 if (!previewEvent.defaultPrevented) {
                     window.open(parsePreviewLink(this.schedulerPreviewLink, this.selectedConfiguration), '_blank');
                 }
-            }, variant: 'basic' }, h("eye-icon", { key: '9b32f09007c8eb0db6b093e5dde173790fc5537e' }))), h("button-component", { key: '692558a733120ce097966909ecdafb22de98e67e', type: "button", disabled: this.isLoading, clickHandler: event => {
+            }, variant: 'basic' }, h("eye-icon", { key: '657a3a416cedc404a3f6c22019bdb41464644dd4' }))), h("button-component", { key: 'd9ac07f6e91d29c173f50bd8b49b0e567ac49608', type: "button", disabled: this.isLoading, clickHandler: event => {
                 event.preventDefault();
                 this.cancelButtonClick.emit();
                 this.host.resetError();
-            }, variant: 'basic', part: "editor__footer-cancel net__footer-cancel" }, instance.t('cancelButton')), h("button-component", { key: '4eda146ceacc6749da0f95152060a925e6f9cf06', class: { 'save-changes': this.action === 'edit' }, type: "submit", disabled: this.isLoading, part: "editor__footer-cta, net__footer-cta" }, !this.componentLoaded ? (h("span", null, h("loading-icon", null), ' ')) : this.isLoading ? (h("span", null, instance.t('savingButtonText'), h("loading-icon", null), ' ')) : this.action === 'create' ? (`${instance.t('createButtonText')}`) : (`${instance.t('saveChangesButtonText')}`)))))), this.showFeedbackModal && h("nylas-feedback-form", { key: '62ab497f55fc337f2ac530df8def914157198e06' })));
+            }, variant: 'basic', part: "editor__footer-cancel net__footer-cancel" }, instance.t('cancelButton')), h("button-component", { key: 'c6aec0b90e344e3aa3bb32207a4abc3413576045', class: { 'save-changes': this.action === 'edit' }, type: "submit", disabled: this.isLoading, part: "editor__footer-cta, net__footer-cta" }, !this.componentLoaded ? (h("span", null, h("loading-icon", null), ' ')) : this.isLoading ? (h("span", null, instance.t('savingButtonText'), h("loading-icon", null), ' ')) : this.action === 'create' ? (`${instance.t('createButtonText')}`) : (`${instance.t('saveChangesButtonText')}`)))))), this.showFeedbackModal && h("nylas-feedback-form", { key: '2367641e0d371b8a152b457df580f4ac1c6388cb' })));
     }
     get host() { return getElement(this); }
     static get watchers() { return {