npm - @nylas/web-elements - Versions diffs - 1.1.0-canary.19.c → 1.1.0-canary.19.e - Mend

@nylas/web-elements 1.1.0-canary.19.c → 1.1.0-canary.19.e

This diff represents the content of publicly available package versions that have been released to one of the supported registries. The information contained in this diff is provided for informational purposes only and reflects changes between package versions as they appear in their respective public registries.

Files changed (876) hide show

package/dist/components/nylas-cancel-booking-form2.js CHANGED Viewed

@@ -39,6 +39,20 @@ const NylasCancelBookingForm = proxyCustomElement(class NylasCancelBookingForm e
                 this.cancelBookingFormError.emit({ title: 'Cancel booking form error', description: 'Please provide a reason for cancellation.' });
                 return;
             }
+            const minCancellationNotice = this.configSettings?.scheduler?.min_cancellation_notice;
+            if (this.selectedTimeslot && minCancellationNotice) {
+                const startTime = new Date(this.selectedTimeslot?.start_time);
+                const dateTillCancellation = startTime.getTime() - minCancellationNotice * 60 * 1000;
+                if (dateTillCancellation < new Date().getTime()) {
+                    this.cancelBookedEventError.emit({
+                        error: {
+                            title: 'Cancellation Error',
+                            message: `You cannot cancel the booking within ${minCancellationNotice} minutes of the event.`,
+                        },
+                    });
+                    return;
+                }
+            }
             debug(`[nylas-cancel-booking-form] Cancel booking form submitted with reason: ${this.cancellationReason}`);
             const errorHandler = (error) => {
                 this.cancelBookedEventError.emit(error);
@@ -51,6 +65,7 @@ const NylasCancelBookingForm = proxyCustomElement(class NylasCancelBookingForm e
         };
         this.cancelBookingId = undefined;
         this.configSettings = undefined;
+        this.selectedTimeslot = undefined;
         this.cancellationReason = '';
         this.cancellationError = '';
         this.cancellationPolicy = this.configSettings?.scheduler?.cancellation_policy || 'Your current timeslot will become available to others.';
@@ -74,7 +89,7 @@ const NylasCancelBookingForm = proxyCustomElement(class NylasCancelBookingForm e
         debug(`[nylas-cancel-booking-form] Component disconnected`);
     }
     render() {
-        return (h(Host, { key: '83015809da357a47d70c5bae845c8608924b6a31', part: "ncec" }, h("sp-theme", { key: '11d3b28a88081d5ecccfbb78ee6347a7856899e3', theme: "spectrum", scale: "medium" }, h("div", { key: '5d2750f253c1aff61c1d973529ce2f7fa65c4206', class: "nylas-cancel-booking-form", part: "ncec__card" }, h("div", { key: '36a8dd00a5eda62f2f8f9740bf447f0b50e81b9e', class: "nylas-cancel-booking-form__calendar-icon", part: "ncec__icon" }, h("calendar-cancel-icon", { key: '7bfaf1ffaa9a3bb288bc0e3f11c8c9ed7a4d2c9a' })), h("h3", { key: '74fff12d4aa0311d817348a4694042d2242f30cd', class: "nylas-cancel-booking-form__title", part: "ncec__title" }, "Cancel booking?"), h("div", { key: '647a02657fe9570c87b14ef7de0cc0fc713efb21', class: "nylas-cancel-booking-form__description", part: "ncec__description" }, this.cancellationPolicy), h("form", { key: 'bb680b4a5a7203d44d08529b0d8b3224b51c2986', onSubmit: this.handleSubmitCancelBooking }, h("sp-field-label", { key: '401994e31c7f7bf65b8403a42b14a56e928d92f3', for: "cancel-reason", class: this.cancellationError ? 'error' : '' }, "Reason for cancellation ", h("span", { key: '361907af2362f4fd09af7638c82de7320efe0072', class: "required" }, "*")), h("sp-textfield", { key: 'd7e672672f0a7250104080f69f4e96de9321c537', id: "cancel-reason", class: this.cancellationError ? 'error' : '', part: "ncec__reason-textarea", multiline: true, value: this.cancellationReason, onInput: this.handleOnChangeCancellationReason, onFocus: this.handleOnChangeCancellationReason, invalid: !!this.cancellationError }, h("sp-help-text", { key: 'd3bcfae8ae55ec910005c128f24d74ed34f1bf48', slot: "negative-help-text" }, this.cancellationError)), h("sp-button", { key: '23efceafbfcb073b0808f65ae110f31bcbfb7722', variant: "primary", class: "cancel", type: "submit", part: "ncec__button-cta" }, "Cancel booking"), h("sp-button", { key: '7030276dae50deab5549a64a3def7b4cb783e8d5', variant: "secondary", class: "back", treatment: "outline", part: "ncec__button-outline", onClick: this.handleGoBackClicked }, "Go back"))))));
+        return (h(Host, { key: 'b9d70a4033b9e329c30791e348d05aafb22bc5a7', part: "ncec" }, h("sp-theme", { key: '218750e38e273ae65c7b5d9b954abcd087413af3', theme: "spectrum", scale: "medium" }, h("div", { key: '6a7b6cd1d9679c1f4ff9fc2c2968767a17523a47', class: "nylas-cancel-booking-form", part: "ncec__card" }, h("div", { key: 'cc9838dea289f92caa24071e719c624047d33b8a', class: "nylas-cancel-booking-form__calendar-icon", part: "ncec__icon" }, h("calendar-cancel-icon", { key: '5d16b7a0a1b8e4e47398fe3b1854bac1364b12dd' })), h("h3", { key: 'ab167468e9c518099ff332a57056753a88e88a20', class: "nylas-cancel-booking-form__title", part: "ncec__title" }, "Cancel booking?"), h("div", { key: '76f7aed68228904e5186b43b00ffe07e4f82a704', class: "nylas-cancel-booking-form__description", part: "ncec__description" }, this.cancellationPolicy), h("form", { key: 'f544db26c2fd84db363fd7f80615c1c3c22e757e', onSubmit: this.handleSubmitCancelBooking }, h("sp-field-label", { key: '951a80c9f5aa350a093f8934332545a7e21d3949', for: "cancel-reason", class: this.cancellationError ? 'error' : '' }, "Reason for cancellation ", h("span", { key: '2bd92cdf3882c1a6a3852f66a8627653f12662d1', class: "required" }, "*")), h("sp-textfield", { key: '223e1c8d2746acc3056c39670a67fe771822aea2', id: "cancel-reason", class: this.cancellationError ? 'error' : '', part: "ncec__reason-textarea", multiline: true, value: this.cancellationReason, onInput: this.handleOnChangeCancellationReason, onFocus: this.handleOnChangeCancellationReason, invalid: !!this.cancellationError }, h("sp-help-text", { key: '4340993d5147663ecaa19a1e7c5bc6c286882760', slot: "negative-help-text" }, this.cancellationError)), h("sp-button", { key: '1dbc5beae35e581d640045458bd305d7ac07968c', variant: "primary", class: "cancel", type: "submit", part: "ncec__button-cta" }, "Cancel booking"), h("sp-button", { key: '2ce80727166893cd38d33975d34fe5809f1d074d', variant: "secondary", class: "back", treatment: "outline", part: "ncec__button-outline", onClick: this.handleGoBackClicked }, "Go back"))))));
     }
     static get watchers() { return {
         "configSettings": ["configSettingsChangedHandler"]
@@ -83,6 +98,7 @@ const NylasCancelBookingForm = proxyCustomElement(class NylasCancelBookingForm e
 }, [1, "nylas-cancel-booking-form", {
         "cancelBookingId": [1, "cancel-booking-id"],
         "configSettings": [16],
+        "selectedTimeslot": [16],
         "cancellationReason": [32],
         "cancellationError": [32],
         "cancellationPolicy": [32]
@@ -92,7 +108,10 @@ const NylasCancelBookingForm = proxyCustomElement(class NylasCancelBookingForm e
 __decorate([
     RegisterComponent({
         name: 'nylas-cancel-booking-form',
-        stateToProps: new Map([['scheduler.configSettings', 'configSettings']]),
+        stateToProps: new Map([
+            ['scheduler.configSettings', 'configSettings'],
+            ['scheduler.selectedTimeslot', 'selectedTimeslot'],
+        ]),
         eventToProps: {
             cancelBookingFormSubmitted: async (event, nylasSchedulerConnector) => {
                 const result = await nylasSchedulerConnector.scheduler.cancelBooking(event.detail.bookingId, event.detail.reason);

package/dist/components/nylas-cancel-booking-form2.js.map CHANGED Viewed

	@@ -1 +1 @@
1	- {"file":"nylas-cancel-booking-form2.js","mappings":"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","names":[],"sources":["src/components/scheduler/nylas-cancel-booking-form/nylas-cancel-booking-form.scss?tag=nylas-cancel-booking-form&encapsulation=shadow","src/components/scheduler/nylas-cancel-booking-form/nylas-cancel-booking-form.tsx"],"sourcesContent":["@import '../../../common/styles/variables.scss';\n\n:host {\n display: block;\n width: 400px;\n @include default-css-variables;\n}\n\nsp-theme {\n height: inherit;\n display: flex;\n flex-direction: column;\n justify-content: space-between;\n align-items: center;\n font-family: var(--nylas-font-family);\n}\n\n.nylas-cancel-booking-form {\n display: flex;\n align-items: center;\n flex-direction: column;\n background-color: var(--nylas-base-0);\n color: var(--nylas-base-800);\n border-radius: var(--nylas-border-radius-2x);\n padding: 1.5rem;\n position: relative;\n box-shadow:\n 0px 1px 4px rgba(0, 0, 0, 0.1),\n 0px 3px 6px rgba(0, 0, 0, 0.06);\n}\n\n.nylas-cancel-booking-form__title {\n font-size: 18px;\n font-weight: 600;\n margin-bottom: 0;\n color: var(--nylas-base-900);\n}\n\n.nylas-cancel-booking-form__description {\n font-size: 1rem;\n font-style: normal;\n font-weight: 400;\n line-height: 140%;\n color: var(--nylas-base-600);\n}\n\n.nylas-cancel-booking-form__calendar-icon {\n width: 3rem;\n height: 3rem;\n border-radius: 50%;\n position: absolute;\n top: -1.25rem;\n left: 50%;\n transform: translateX(-50%);\n background-color: var(--nylas-base-0);\n border: 1px solid var(--nylas-base-200);\n}\n\ncalendar-cancel-icon {\n display: flex;\n align-items: center;\n justify-content: center;\n height: 100%;\n}\n\nsp-button {\n background-color: var(--nylas-base-0);\n color: var(--nylas-base-700);\n border: 1px solid var(--nylas-base-200);\n border-radius: var(--nylas-border-radius-2x);\n font-size: 16px;\n font-weight: 600;\n width: 100%;\n height: 48px;\n padding: 8px;\n line-height: 24px;\n font-family: var(--nylas-font-family);\n &.cancel {\n margin-top: 1.25rem;\n background-color: var(--nylas-primary);\n color: var(--nylas-base-0);\n &:hover,\n &:focus {\n background-color: var(--nylas-base-600);\n }\n &:active {\n background-color: var(--nylas-base-800);\n }\n }\n &.back {\n margin-top: 0.5rem;\n &:hover,\n &:focus {\n border-color: var(--nylas-primary);\n }\n &:active {\n border-color: var(--nylas-base-600);\n }\n }\n}\n\nsp-field-label {\n margin-top: 1rem;\n display: flex;\n color: var(--nylas-base-800);\n font-size: 14px;\n &.error {\n color: var(--nylas-error);\n }\n span.required {\n color: var(--nylas-error);\n }\n}\nsp-textfield {\n --spectrum-textfield-border-color: var(--nylas-base-300);\n --spectrum-textfield-icon-color-invalid: var(--nylas-error);\n position: relative;\n width: 100%;\n height: 48px;\n margin-bottom: 16px;\n background-color: var(--nylas-base-0);\n color: var(--nylas-base-500);\n &.error {\n --spectrum-textfield-border-color: var(--nylas-error);\n }\n}\n\nsp-help-text {\n margin: 0.25rem 0 1rem 0;\n color: var(--nylas-error);\n}\n","import { RegisterComponent } from '@/common/register-component';\nimport { Component, Event, EventEmitter, h, Host, Prop, State, Watch } from '@stencil/core';\nimport { NylasSchedulerConnector } from '../../..';\nimport { NylasScheduling } from '../nylas-scheduling/nylas-scheduling';\nimport { debug } from '@/utils/utils';\nimport { Notification, NylasSchedulerErrorResponse } from '@nylas/core';\nimport { ConfigSettings } from '@/stores/scheduler-store';\n\n/*\n The `nylas-cancel-booking-form` component is a UI component that allows users to cancel a booking.\n /\n@Component({\n tag: 'nylas-cancel-booking-form',\n styleUrl: 'nylas-cancel-booking-form.scss',\n shadow: true,\n})\nexport class NylasCancelBookingForm {\n /\n The booking ID to cancel.\n /\n @Prop() readonly cancelBookingId!: string;\n\n /\n The config settings.\n /\n @Prop() configSettings?: ConfigSettings;\n\n /\n This event is fired when the Go back button is clicked on the cancel booking form.\n /\n @Event() readonly goBackButtonClicked!: EventEmitter<void>;\n\n /\n This event is fired when the cancel booking form is submitted.\n /\n @Event() readonly cancelBookingFormSubmitted!: EventEmitter<{ bookingId: string; reason: string; errorHandler?: (error: NylasSchedulerErrorResponse) => void }>;\n\n /\n This event is fired when an error occurs while cancelling the booking.\n /\n @Event() readonly cancelBookedEventError!: EventEmitter<NylasSchedulerErrorResponse>;\n\n /\n This event is fired when an error occurs in the booking form.\n /\n @Event() cancelBookingFormError!: EventEmitter<Partial<Notification>>;\n\n /\n The reason for cancellation.\n /\n @State() cancellationReason: string = '';\n\n @State() cancellationError: string = '';\n\n @State() cancellationPolicy: string = this.configSettings?.scheduler?.cancellation_policy \|\| 'Your current timeslot will become available to others.';\n\n @Watch('configSettings')\n configSettingsChangedHandler(newValue: ConfigSettings) {\n this.cancellationPolicy = newValue?.scheduler?.cancellation_policy \|\| 'Your current timeslot will become available to others.';\n }\n\n connectedCallback() {\n debug(`[nylas-cancel-booking-form] Component connected`);\n }\n\n async componentWillLoad() {\n debug(`[nylas-cancel-booking-form] Component will load`);\n }\n\n async componentDidLoad() {\n debug(`[nylas-cancel-booking-form] Component did load`);\n if (!this.cancelBookingId) {\n console.warn(`[nylas-cancel-booking-form] No booking ID provided, \"cancelBookingId\" prop is required.`);\n }\n }\n\n disconnectedCallback() {\n debug(`[nylas-cancel-booking-form] Component disconnected`);\n }\n\n private handleGoBackClicked = () => {\n this.goBackButtonClicked.emit();\n };\n\n private handleSubmitCancelBooking = (event: Event) => {\n event.preventDefault();\n if (!this.cancellationReason) {\n this.cancellationError = 'Please provide a reason for cancellation.';\n this.cancelBookingFormError.emit({ title: 'Cancel booking form error', description: 'Please provide a reason for cancellation.' });\n return;\n }\n\n debug(`[nylas-cancel-booking-form] Cancel booking form submitted with reason: ${this.cancellationReason}`);\n const errorHandler = (error: NylasSchedulerErrorResponse) => {\n this.cancelBookedEventError.emit(error);\n };\n this.cancelBookingFormSubmitted.emit({ bookingId: this.cancelBookingId, reason: this.cancellationReason, errorHandler });\n };\n\n private handleOnChangeCancellationReason = (event: Event) => {\n this.cancellationError = '';\n this.cancellationReason = (event.target as HTMLInputElement).value;\n };\n\n @RegisterComponent<NylasCancelBookingForm, NylasSchedulerConnector, Exclude<NylasScheduling['stores'], undefined>>({\n name: 'nylas-cancel-booking-form',\n stateToProps: new Map([['scheduler.configSettings', 'configSettings']]),\n eventToProps: {\n cancelBookingFormSubmitted: async (\n event: CustomEvent<{ bookingId: string; reason: string; errorHandler?: (error: NylasSchedulerErrorResponse) => void }>,\n nylasSchedulerConnector: NylasSchedulerConnector,\n ) => {\n const result = await nylasSchedulerConnector.scheduler.cancelBooking(event.detail.bookingId, event.detail.reason);\n const { errorHandler } = event.detail;\n if (errorHandler && (!result \|\| 'error' in result)) {\n errorHandler(result);\n }\n },\n },\n fireRegisterEvent: true,\n })\n render() {\n return (\n <Host part=\"ncec\">\n <sp-theme theme=\"spectrum\" scale=\"medium\">\n <div class=\"nylas-cancel-booking-form\" part=\"ncec__card\">\n <div class=\"nylas-cancel-booking-form__calendar-icon\" part=\"ncec__icon\">\n <calendar-cancel-icon />\n </div>\n <h3 class=\"nylas-cancel-booking-form__title\" part=\"ncec__title\">\n Cancel booking?\n </h3>\n <div class=\"nylas-cancel-booking-form__description\" part=\"ncec__description\">\n {this.cancellationPolicy}\n </div>\n <form onSubmit={this.handleSubmitCancelBooking}>\n <sp-field-label for=\"cancel-reason\" class={this.cancellationError ? 'error' : ''}>\n Reason for cancellation <span class=\"required\"></span>\n </sp-field-label>\n <sp-textfield\n id=\"cancel-reason\"\n class={this.cancellationError ? 'error' : ''}\n part=\"ncec__reason-textarea\"\n multiline\n value={this.cancellationReason}\n onInput={this.handleOnChangeCancellationReason}\n onFocus={this.handleOnChangeCancellationReason}\n invalid={!!this.cancellationError}\n >\n <sp-help-text slot=\"negative-help-text\">{this.cancellationError}</sp-help-text>\n </sp-textfield>\n <sp-button variant=\"primary\" class=\"cancel\" type=\"submit\" part=\"ncec__button-cta\">\n Cancel booking\n </sp-button>\n <sp-button variant=\"secondary\" class=\"back\" treatment=\"outline\" part=\"ncec__button-outline\" onClick={this.handleGoBackClicked}>\n Go back\n </sp-button>\n </form>\n </div>\n </sp-theme>\n </Host>\n );\n }\n}\n"],"version":3}
1	+ {"file":"nylas-cancel-booking-form2.js","mappings":"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","names":[],"sources":["src/components/scheduler/nylas-cancel-booking-form/nylas-cancel-booking-form.scss?tag=nylas-cancel-booking-form&encapsulation=shadow","src/components/scheduler/nylas-cancel-booking-form/nylas-cancel-booking-form.tsx"],"sourcesContent":["@import '../../../common/styles/variables.scss';\n\n:host {\n display: block;\n width: 400px;\n @include default-css-variables;\n}\n\nsp-theme {\n height: inherit;\n display: flex;\n flex-direction: column;\n justify-content: space-between;\n align-items: center;\n font-family: var(--nylas-font-family);\n}\n\n.nylas-cancel-booking-form {\n display: flex;\n align-items: center;\n flex-direction: column;\n background-color: var(--nylas-base-0);\n color: var(--nylas-base-800);\n border-radius: var(--nylas-border-radius-2x);\n padding: 1.5rem;\n position: relative;\n box-shadow:\n 0px 1px 4px rgba(0, 0, 0, 0.1),\n 0px 3px 6px rgba(0, 0, 0, 0.06);\n}\n\n.nylas-cancel-booking-form__title {\n font-size: 18px;\n font-weight: 600;\n margin-bottom: 0;\n color: var(--nylas-base-900);\n}\n\n.nylas-cancel-booking-form__description {\n font-size: 1rem;\n font-style: normal;\n font-weight: 400;\n line-height: 140%;\n color: var(--nylas-base-600);\n}\n\n.nylas-cancel-booking-form__calendar-icon {\n width: 3rem;\n height: 3rem;\n border-radius: 50%;\n position: absolute;\n top: -1.25rem;\n left: 50%;\n transform: translateX(-50%);\n background-color: var(--nylas-base-0);\n border: 1px solid var(--nylas-base-200);\n}\n\ncalendar-cancel-icon {\n display: flex;\n align-items: center;\n justify-content: center;\n height: 100%;\n}\n\nsp-button {\n background-color: var(--nylas-base-0);\n color: var(--nylas-base-700);\n border: 1px solid var(--nylas-base-200);\n border-radius: var(--nylas-border-radius-2x);\n font-size: 16px;\n font-weight: 600;\n width: 100%;\n height: 48px;\n padding: 8px;\n line-height: 24px;\n font-family: var(--nylas-font-family);\n &.cancel {\n margin-top: 1.25rem;\n background-color: var(--nylas-primary);\n color: var(--nylas-base-0);\n &:hover,\n &:focus {\n background-color: var(--nylas-base-600);\n }\n &:active {\n background-color: var(--nylas-base-800);\n }\n }\n &.back {\n margin-top: 0.5rem;\n &:hover,\n &:focus {\n border-color: var(--nylas-primary);\n }\n &:active {\n border-color: var(--nylas-base-600);\n }\n }\n}\n\nsp-field-label {\n margin-top: 1rem;\n display: flex;\n color: var(--nylas-base-800);\n font-size: 14px;\n &.error {\n color: var(--nylas-error);\n }\n span.required {\n color: var(--nylas-error);\n }\n}\nsp-textfield {\n --spectrum-textfield-border-color: var(--nylas-base-300);\n --spectrum-textfield-icon-color-invalid: var(--nylas-error);\n position: relative;\n width: 100%;\n height: 48px;\n margin-bottom: 16px;\n background-color: var(--nylas-base-0);\n color: var(--nylas-base-500);\n &.error {\n --spectrum-textfield-border-color: var(--nylas-error);\n }\n}\n\nsp-help-text {\n margin: 0.25rem 0 1rem 0;\n color: var(--nylas-error);\n}\n","import { RegisterComponent } from '@/common/register-component';\nimport { Component, Event, EventEmitter, h, Host, Prop, State, Watch } from '@stencil/core';\nimport { NylasSchedulerConnector } from '../../..';\nimport { NylasScheduling } from '../nylas-scheduling/nylas-scheduling';\nimport { debug } from '@/utils/utils';\nimport { Notification, NylasSchedulerErrorResponse, Timeslot } from '@nylas/core';\nimport { ConfigSettings } from '@/stores/scheduler-store';\n\n/*\n The `nylas-cancel-booking-form` component is a UI component that allows users to cancel a booking.\n /\n@Component({\n tag: 'nylas-cancel-booking-form',\n styleUrl: 'nylas-cancel-booking-form.scss',\n shadow: true,\n})\nexport class NylasCancelBookingForm {\n /\n The booking ID to cancel.\n /\n @Prop() readonly cancelBookingId!: string;\n\n /\n The config settings.\n /\n @Prop() readonly configSettings?: ConfigSettings;\n\n /\n The selected timeslot.\n /\n @Prop() readonly selectedTimeslot!: Timeslot;\n\n /\n This event is fired when the Go back button is clicked on the cancel booking form.\n /\n @Event() readonly goBackButtonClicked!: EventEmitter<void>;\n\n /\n This event is fired when the cancel booking form is submitted.\n /\n @Event() readonly cancelBookingFormSubmitted!: EventEmitter<{ bookingId: string; reason: string; errorHandler?: (error: NylasSchedulerErrorResponse) => void }>;\n\n /\n This event is fired when an error occurs while cancelling the booking.\n /\n @Event() readonly cancelBookedEventError!: EventEmitter<NylasSchedulerErrorResponse>;\n\n /\n This event is fired when an error occurs in the booking form.\n /\n @Event() cancelBookingFormError!: EventEmitter<Partial<Notification>>;\n\n /\n The reason for cancellation.\n /\n @State() cancellationReason: string = '';\n\n @State() cancellationError: string = '';\n\n @State() cancellationPolicy: string = this.configSettings?.scheduler?.cancellation_policy \|\| 'Your current timeslot will become available to others.';\n\n @Watch('configSettings')\n configSettingsChangedHandler(newValue: ConfigSettings) {\n this.cancellationPolicy = newValue?.scheduler?.cancellation_policy \|\| 'Your current timeslot will become available to others.';\n }\n\n connectedCallback() {\n debug(`[nylas-cancel-booking-form] Component connected`);\n }\n\n async componentWillLoad() {\n debug(`[nylas-cancel-booking-form] Component will load`);\n }\n\n async componentDidLoad() {\n debug(`[nylas-cancel-booking-form] Component did load`);\n if (!this.cancelBookingId) {\n console.warn(`[nylas-cancel-booking-form] No booking ID provided, \"cancelBookingId\" prop is required.`);\n }\n }\n\n disconnectedCallback() {\n debug(`[nylas-cancel-booking-form] Component disconnected`);\n }\n\n private handleGoBackClicked = () => {\n this.goBackButtonClicked.emit();\n };\n\n private handleSubmitCancelBooking = (event: Event) => {\n event.preventDefault();\n if (!this.cancellationReason) {\n this.cancellationError = 'Please provide a reason for cancellation.';\n this.cancelBookingFormError.emit({ title: 'Cancel booking form error', description: 'Please provide a reason for cancellation.' });\n return;\n }\n\n const minCancellationNotice = this.configSettings?.scheduler?.min_cancellation_notice;\n\n if (this.selectedTimeslot && minCancellationNotice) {\n const startTime = new Date(this.selectedTimeslot?.start_time);\n const dateTillCancellation = startTime.getTime() - minCancellationNotice 60 * 1000;\n\n if (dateTillCancellation < new Date().getTime()) {\n this.cancelBookedEventError.emit({\n error: {\n title: 'Cancellation Error',\n message: `You cannot cancel the booking within ${minCancellationNotice} minutes of the event.`,\n },\n });\n return;\n }\n }\n\n debug(`[nylas-cancel-booking-form] Cancel booking form submitted with reason: ${this.cancellationReason}`);\n const errorHandler = (error: NylasSchedulerErrorResponse) => {\n this.cancelBookedEventError.emit(error);\n };\n this.cancelBookingFormSubmitted.emit({ bookingId: this.cancelBookingId, reason: this.cancellationReason, errorHandler });\n };\n\n private handleOnChangeCancellationReason = (event: Event) => {\n this.cancellationError = '';\n this.cancellationReason = (event.target as HTMLInputElement).value;\n };\n\n @RegisterComponent<NylasCancelBookingForm, NylasSchedulerConnector, Exclude<NylasScheduling['stores'], undefined>>({\n name: 'nylas-cancel-booking-form',\n stateToProps: new Map([\n ['scheduler.configSettings', 'configSettings'],\n ['scheduler.selectedTimeslot', 'selectedTimeslot'],\n ]),\n eventToProps: {\n cancelBookingFormSubmitted: async (\n event: CustomEvent<{ bookingId: string; reason: string; errorHandler?: (error: NylasSchedulerErrorResponse) => void }>,\n nylasSchedulerConnector: NylasSchedulerConnector,\n ) => {\n const result = await nylasSchedulerConnector.scheduler.cancelBooking(event.detail.bookingId, event.detail.reason);\n const { errorHandler } = event.detail;\n if (errorHandler && (!result \|\| 'error' in result)) {\n errorHandler(result);\n }\n },\n },\n fireRegisterEvent: true,\n })\n render() {\n return (\n <Host part=\"ncec\">\n <sp-theme theme=\"spectrum\" scale=\"medium\">\n <div class=\"nylas-cancel-booking-form\" part=\"ncec__card\">\n <div class=\"nylas-cancel-booking-form__calendar-icon\" part=\"ncec__icon\">\n <calendar-cancel-icon />\n </div>\n <h3 class=\"nylas-cancel-booking-form__title\" part=\"ncec__title\">\n Cancel booking?\n </h3>\n <div class=\"nylas-cancel-booking-form__description\" part=\"ncec__description\">\n {this.cancellationPolicy}\n </div>\n <form onSubmit={this.handleSubmitCancelBooking}>\n <sp-field-label for=\"cancel-reason\" class={this.cancellationError ? 'error' : ''}>\n Reason for cancellation <span class=\"required\">*</span>\n </sp-field-label>\n <sp-textfield\n id=\"cancel-reason\"\n class={this.cancellationError ? 'error' : ''}\n part=\"ncec__reason-textarea\"\n multiline\n value={this.cancellationReason}\n onInput={this.handleOnChangeCancellationReason}\n onFocus={this.handleOnChangeCancellationReason}\n invalid={!!this.cancellationError}\n >\n <sp-help-text slot=\"negative-help-text\">{this.cancellationError}</sp-help-text>\n </sp-textfield>\n <sp-button variant=\"primary\" class=\"cancel\" type=\"submit\" part=\"ncec__button-cta\">\n Cancel booking\n </sp-button>\n <sp-button variant=\"secondary\" class=\"back\" treatment=\"outline\" part=\"ncec__button-outline\" onClick={this.handleGoBackClicked}>\n Go back\n </sp-button>\n </form>\n </div>\n </sp-theme>\n </Host>\n );\n }\n}\n"],"version":3}

package/dist/components/nylas-cancellation-policy2.js CHANGED Viewed

@@ -64,7 +64,7 @@ const NylasCancellationPolicy = proxyCustomElement(class NylasCancellationPolicy
         this.valueChanged.emit({ value: value, name: this.name });
     }
     render() {
-        return (h(Host, { key: '7a57476ea21860b39103ab43f8b86a5804ddc055' }, h("div", { key: '67d7d2c00b2b658778dabe316a4512472bddf435', class: "nylas-cancellation-policy", part: "ncpolicy" }, h("label", { key: '2f0abff08c2485c93efaf6202a5c9720107f11d1', htmlFor: this.name }, "Cancellation policy message", h("span", { key: '2c16d52ce3b6fea15f23e57d50afe55872f920d6', class: "label-icon" }, h("tooltip-component", { key: '8bde2b6a884e8d180ef7296bbf29322df14128ef' }, h("info-icon", { key: 'cffadcf00bc6c3b07dffeb633bf87b423d6f4c59', slot: "tooltip-icon" }), h("span", { key: '5c37fbce026bb6f5a37f7867236fc27284323c42', slot: "tooltip-content" }, "Attendees receive this message if trying to cancel the event. Attendees are asked to provide a reason for cancellation.")))), h("textarea", { key: '0f492885372a90650104bbb4679cde1374296504', id: this.name, part: "ncpolicy__textarea", name: this.name, value: this.message, maxlength: "250", onInput: e => this.handleChange(e) }))));
+        return (h(Host, { key: 'a33c5325297071f02e6f888ed0a1666490c8f928' }, h("div", { key: 'caec2d57a85988092730802db6aa9ce5af040304', class: "nylas-cancellation-policy", part: "ncpolicy" }, h("label", { key: '14e290e8424ee3aa362bd58b6036fe5228a511ec', htmlFor: this.name }, "Cancellation policy message", h("span", { key: 'f8a8798ad54d7d846e1d162456ee61b24c1c38d5', class: "label-icon" }, h("tooltip-component", { key: 'c817408f2bf3086038135dadbd6d1c2b112e2625' }, h("info-icon", { key: '2d08893d22943fac3544fef663707bb19dac04f3', slot: "tooltip-icon" }), h("span", { key: '112be966a2253f3e83b72d05454e83cb386c6ebb', slot: "tooltip-content" }, "Attendees receive this message if trying to cancel the event. Attendees are asked to provide a reason for cancellation.")))), h("textarea", { key: 'e772bf8f32106aeccf31053724f0524c356d0603', id: this.name, part: "ncpolicy__textarea", name: this.name, value: this.message, maxlength: "250", onInput: e => this.handleChange(e) }))));
     }
     static get formAssociated() { return true; }
     get host() { return this; }

package/dist/components/nylas-cancelled-event-card2.js CHANGED Viewed

@@ -55,7 +55,7 @@ const NylasCancelledEventCard = proxyCustomElement(class NylasCancelledEventCard
         debug(`[nylas-cancelled-event-card] Component disconnected`);
     }
     render() {
-        return (h(Host, { key: '89bfb6419aea7fffc32726e4db26642ca810b3a4', part: "ncec" }, h("sp-theme", { key: '265e08ab9c6d4c7c7071353a35e2a8e69bd3875e', theme: "spectrum", color: "dark", scale: "medium" }, h("div", { key: 'bd23802e8cd5bf923ed43f223eac30041ead9a2e', class: "nylas-cancelled-event-card", part: "ncec__card" }, h("div", { key: '270d9e2a65ee1a3a7d34aaa99bf1059b891929ae', class: "nylas-cancelled-event-card__calendar-icon", part: "ncec__icon" }, h("calendar-cancel-icon", { key: 'e04e9bf8f7278265160c3a58c0a37c880faed0cc' })), h("h3", { key: '046647bd93284e280d5fb62f9488b6ed5ed9dea2', class: "nylas-cancelled-event-card__title", part: "ncec__title" }, "Your booking has been cancelled successfully!"), h("div", { key: 'f85c31f7718fe5266b2d175afff46c7b63495c11', class: "nylas-cancelled-event-card__description", part: "ncec__description" }, "A cancellation email has been sent to ", this.configSettings?.organizer?.name || 'the participants', "."), h("div", { key: 'aa36cf4bbcb432334903a0b9ba2782ecf6abbe4c', class: "nylas-cancelled-event-card__cta" }, h("sp-button", { key: '65009ac918324e109b0b5a52331bea5a9b8c1a14', variant: "secondary", treatment: "outline", disabled: this.isClosing, part: "ncec__button-outline", onClick: this.handleCloseClicked }, this.isClosing ? 'Closing...' : 'Close'))))));
+        return (h(Host, { key: 'fe2ed7ce54027987ff6eacc29e4af427d1db3812', part: "ncec" }, h("sp-theme", { key: '9132889a3541fad4294b058769ed891bbc64b3fc', theme: "spectrum", color: "dark", scale: "medium" }, h("div", { key: '2a55f78a1f03dc101b16fd70d235ae507bbf3076', class: "nylas-cancelled-event-card", part: "ncec__card" }, h("div", { key: '6083acf124f5423e3c6f65f07bf6c980244672a6', class: "nylas-cancelled-event-card__calendar-icon", part: "ncec__icon" }, h("calendar-cancel-icon", { key: '0132808a907473f233a58d79ba184997e5ffaf52' })), h("h3", { key: 'ba6fcbb8579d5f7fe74910c7252ff555363f3b8e', class: "nylas-cancelled-event-card__title", part: "ncec__title" }, "Your booking has been cancelled successfully!"), h("div", { key: '63863dfcb4f73f5cbcc3b40036bd046dc7bb262a', class: "nylas-cancelled-event-card__description", part: "ncec__description" }, "A cancellation email has been sent to ", this.configSettings?.organizer?.name || 'the participants', "."), h("div", { key: 'd77cc91721cb5b86da50bd31decf015a0d6995a1', class: "nylas-cancelled-event-card__cta" }, h("sp-button", { key: '20685777e9c2674a8b92e7f47581bc6e9812f79d', variant: "secondary", treatment: "outline", disabled: this.isClosing, part: "ncec__button-outline", onClick: this.handleCloseClicked }, this.isClosing ? 'Closing...' : 'Close'))))));
     }
     static get style() { return NylasCancelledEventCardStyle0; }
 }, [1, "nylas-cancelled-event-card", {

package/dist/components/nylas-composer2.js CHANGED Viewed

@@ -139,7 +139,7 @@ const NylasComposer = proxyCustomElement(class NylasComposer extends HTMLElement
         this.editorEl.focus();
     }
     render() {
-        return (h(Host, { key: '7537b7c56a1e609f88189c2c4deed986827eb193' }, h("sp-theme", { key: 'efa28f8ed5585ec21b44ae5ec174aa10a9c92aba', scale: "medium", color: "dark" }, h("div", { key: 'c7932bcedcb2b3cfa4e0900578cf2b749000125d', class: "editor", contentEditable: true, ref: r => (this.editorEl = r) }, h("div", { key: '89c06c0e76d29ea6713dd44b2452e261d0d7d43b', class: "toolbar", ref: r => (this.toolbarEl = r), contentEditable: false }, h("sp-button", { key: 'beeb60448f03c8818925aeb13ab5231aa72f7526', quiet: true, onClick: () => document.execCommand('bold') }, h("div", { key: '4e37be81a28ac4355f9d0d6d6c71b7b78cf41456', slot: "icon" }, h("bold-icon", { key: '56cf047799a6a5713310d5b095ca91e6004d6107' })), h("div", { key: '2fe47f8f364f7fb1016990f2aecec655e2e6eb30', slot: "label" }, "Bold")), h("sp-button", { key: '0416d13b88ccefd5005f4b97f7dded2118d37f43', quiet: true, onClick: () => document.execCommand('underline') }, h("div", { key: '6d20e215eafbb91a17ce452a6b64295ab4ef2bb9', slot: "icon" }, h("underline-icon", { key: 'b8d988fa168047ed213fbcceb53b24bf3f766d7a' })), h("div", { key: 'bd05639007b3ea849501b995137ceda70aed20da', slot: "label" }, "Underline")), h("sp-button", { key: '9775c4787363cd4d21778f4c848c7f5a7564b507', quiet: true, onClick: () => document.execCommand('italic') }, h("div", { key: 'ca9d557028981c0fe209045e5d1748b19bbb5069', slot: "icon" }, h("italic-icon", { key: '1be5debba3572e83ab132a3e44d8fc1e799f6619' })), h("div", { key: 'cccb70309840e20f558158e6ef9edf8fe0e52eed', slot: "label" }, "Italic")))), h("div", { key: '502854e008886de49ec435c1ebd73b48f2cc4c70', class: 'buttons' }, h("sp-button", { key: '9663a709ca8794dc76dec379a39c52a6a754cb6e', onClick: this.sendComposer, class: "send" }, "Send"), h("sp-button", { key: 'b0c7637932f2659c9115e74f1244db04992a69aa', onClick: this.closeComposer, class: "close" }, "Close")))));
+        return (h(Host, { key: 'a8cae87973663ced987b12f8a41385f3311910e5' }, h("sp-theme", { key: '9b732690d1f0c529704c614955c603af602f1805', scale: "medium", color: "dark" }, h("div", { key: '6f9da518afc2027bb938b50dced65383c83281f5', class: "editor", contentEditable: true, ref: r => (this.editorEl = r) }, h("div", { key: 'd665e4adebc7352b5c07137ead22793da96b1a6a', class: "toolbar", ref: r => (this.toolbarEl = r), contentEditable: false }, h("sp-button", { key: 'cf4c80151daac614613530c7f3973fa44285b943', quiet: true, onClick: () => document.execCommand('bold') }, h("div", { key: '406b64ee65391632212f69aab967cce595ef3145', slot: "icon" }, h("bold-icon", { key: '38a82fba1133e28052ae18f59148056213c76e63' })), h("div", { key: '8ab054e1caa8da4d5745a991e0a2ad197124466b', slot: "label" }, "Bold")), h("sp-button", { key: '52d7e1302c0624d4e1e5c337a412a5e0e3752914', quiet: true, onClick: () => document.execCommand('underline') }, h("div", { key: 'c64009e9818a9ccf0385f7cd2c8e3c9df2e08d0d', slot: "icon" }, h("underline-icon", { key: '75de67cc0add37d483d564c1cae6486147ad6669' })), h("div", { key: 'd46d90b0959349c237720890afd7b700a6f3cd71', slot: "label" }, "Underline")), h("sp-button", { key: 'af87cc784ed3c77e471ba54abbf7e18c3c391e1c', quiet: true, onClick: () => document.execCommand('italic') }, h("div", { key: '0e1d03379b6f212fe9b0d080577f0633c2ce5c4a', slot: "icon" }, h("italic-icon", { key: '6e127d2755fccaf634d6a261d95dc191bda77bd2' })), h("div", { key: 'f2e251b97838ed752af350ed0dae3213a3a14e68', slot: "label" }, "Italic")))), h("div", { key: '70399bf4636e5c061562c478504799b6fdf6e15c', class: 'buttons' }, h("sp-button", { key: '90d7d39c6dd284ea399425ea07e205f0562d1423', onClick: this.sendComposer, class: "send" }, "Send"), h("sp-button", { key: '7a1cd27929d585a43b076b8e8131b01f6835aba7', onClick: this.closeComposer, class: "close" }, "Close")))));
     }
     get host() { return this; }
     static get watchers() { return {

package/dist/components/nylas-connected-calendars.d.ts ADDED Viewed

@@ -0,0 +1,11 @@
+import type { Components, JSX } from "../types/components";
+interface NylasConnectedCalendars extends Components.NylasConnectedCalendars, HTMLElement {}
+export const NylasConnectedCalendars: {
+    prototype: NylasConnectedCalendars;
+    new (): NylasConnectedCalendars;
+};
+/**
+ * Used to define this component and all nested components recursively.
+ */
+export const defineCustomElement: () => void;

package/dist/components/nylas-connected-calendars.js ADDED Viewed

@@ -0,0 +1,8 @@
+import { N as NylasConnectedCalendars$1, d as defineCustomElement$1 } from './nylas-connected-calendars2.js';
+const NylasConnectedCalendars = NylasConnectedCalendars$1;
+const defineCustomElement = defineCustomElement$1;
+export { NylasConnectedCalendars, defineCustomElement };
+//# sourceMappingURL=nylas-connected-calendars.js.map

package/dist/components/nylas-connected-calendars.js.map ADDED Viewed

	@@ -0,0 +1 @@
1	+ {"file":"nylas-connected-calendars.js","mappings":";;;;;;;","names":[],"sources":[],"sourcesContent":[],"version":3}

package/dist/components/nylas-connected-calendars2.js ADDED Viewed

@@ -0,0 +1,232 @@
+import { proxyCustomElement, HTMLElement, createEvent, h, Host } from '@stencil/core/internal/client';
+import { R as RegisterComponent } from './register-component.js';
+import { a as debug } from './utils.js';
+import { d as defineCustomElement$6 } from './chevron.js';
+import { d as defineCustomElement$5 } from './close.js';
+import { d as defineCustomElement$4 } from './info.js';
+import { d as defineCustomElement$3 } from './multi-select-dropdown2.js';
+import { d as defineCustomElement$2 } from './nylas-calendar-picker2.js';
+import { d as defineCustomElement$1 } from './toolitp-component.js';
+const nylasConnectedCalendarsCss = ":host{display:block;--nylas-primary:#2563eb;--nylas-error:#cc4841;--nylas-error-pressed:#992222;--nylas-wraning:#f06c00;--nylas-success:#16a392;--nylas-info:#2b8fc2;--nylas-base-0:#ffffff;--nylas-base-25:#fcfcfd;--nylas-base-50:#f8f9fc;--nylas-base-100:#eaecf5;--nylas-base-200:#d5d9eb;--nylas-base-300:#b3b8d8;--nylas-base-400:#717bbc;--nylas-base-500:#4e5ba6;--nylas-base-600:#3e4784;--nylas-base-700:#263f72;--nylas-base-800:#293056;--nylas-base-900:#101323;--nylas-base-950:#0e101b;--nylas-border-radius:0.25rem;--nylas-border-radius-2x:0.5rem;--nylas-border-radius-3x:0.75rem;--nylas-font-family:\"Inter\", sans-serif;width:inherit}.nylas-connected-calendars{width:inherit;display:flex;flex-direction:column;margin:1rem;border-radius:var(--nylas-border-radius-2x);border:1px solid var(--nylas-base-200)}.nylas-connected-calendars .header{padding:1rem}.nylas-connected-calendars .header h3{margin:0;font-size:16px;font-weight:600;line-height:20px;color:var(--nylas-base-900);text-align:left}.nylas-connected-calendars .header p{margin:0.25rem 0 0 0;font-size:0.875rem;font-weight:400;line-height:20px;color:var(--nylas-base-600);text-align:left;display:flex;align-items:center;gap:4px}.nylas-connected-calendars .content .participant-container{padding-top:12px;border-top:1px solid var(--nylas-base-200)}.nylas-connected-calendars .content .participant-container .participant-title{display:flex;justify-content:space-between;align-items:center;padding:4px 16px 16px}.nylas-connected-calendars .content .participant-container .participant-title p{margin:0}.nylas-connected-calendars .content .participant-container .participant-title .participant-toggle{display:flex;gap:24px;align-items:center}.nylas-connected-calendars .content .participant-container .participant-title .participant-toggle .chevron{display:flex;align-self:center;cursor:pointer}.nylas-connected-calendars .content .participant-container .participant-title .participant-toggle .chevron:hover,.nylas-connected-calendars .content .participant-container .participant-title .participant-toggle .chevron:active{color:var(--nylas-primary)}.nylas-connected-calendars .content .participant-container .participant-title .participant-toggle .chevron.open{transform:rotate(90deg)}.nylas-connected-calendars .content .participant-container .participant-title .participant-toggle .chevron.closed{transform:rotate(270deg)}.nylas-connected-calendars .content .participant-container .participant-title .participant-toggle .chevron.disabled{cursor:not-allowed;color:var(--nylas-base-300)}.nylas-connected-calendars .content .participant-container .participant-title .participant-toggle .chevron.disabled:hover{color:var(--nylas-base-300)}nylas-calendar-picker::part(ncp){margin:0;border:none;border-top:1px solid var(--nylas-base-200);border-top-right-radius:0;border-top-left-radius:0}";
+const NylasConnectedCalendarsStyle0 = nylasConnectedCalendarsCss;
+var __decorate = (undefined && undefined.__decorate) || function (decorators, target, key, desc) {
+    var c = arguments.length, r = c < 3 ? target : desc === null ? desc = Object.getOwnPropertyDescriptor(target, key) : desc, d;
+    if (typeof Reflect === "object" && typeof Reflect.decorate === "function")
+        r = Reflect.decorate(decorators, target, key, desc);
+    else
+        for (var i = decorators.length - 1; i >= 0; i--)
+            if (d = decorators[i])
+                r = (c < 3 ? d(r) : c > 3 ? d(target, key, r) : d(target, key)) || r;
+    return c > 3 && r && Object.defineProperty(target, key, r), r;
+};
+var __metadata = (undefined && undefined.__metadata) || function (k, v) {
+    if (typeof Reflect === "object" && typeof Reflect.metadata === "function")
+        return Reflect.metadata(k, v);
+};
+const NylasConnectedCalendars = proxyCustomElement(class NylasConnectedCalendars extends HTMLElement {
+    constructor() {
+        super();
+        this.__registerHost();
+        this.__attachShadow();
+        this.valueChanged = createEvent(this, "valueChanged", 7);
+        this.internals = this.attachInternals();
+        this.name = 'connected-calendars';
+        this.participants = undefined;
+        this.calendars = undefined;
+        this.participantOptions = undefined;
+        this.selectedCalendars = this.setParticipants(this.participants);
+        this.participantCalendars = {};
+        this.participantDefaultSelectedCalendars = {};
+    }
+    elementNameChangedHandler(newValue) {
+        debug('nylas-connected-calendars', 'elementNameChangedHandler', newValue);
+        this.host.setAttribute('name', newValue);
+    }
+    calendarsChangedHandler(newValue) {
+        debug('nylas-connected-calendars', 'calendarsChangedHandler', newValue);
+        this.participantCalendars = this.getParticipantCalendarOptions(this.participants, this.participantOptions);
+    }
+    participantsChangedHandler(newValue) {
+        debug('nylas-connected-calendars', 'participantsChangedHandler', newValue);
+        this.selectedCalendars = this.setParticipants(newValue);
+        this.participantCalendars = this.getParticipantCalendarOptions(newValue, this.participantOptions);
+    }
+    participantOptionsChangedHandler(newValue) {
+        debug('nylas-calendar-picker', 'participantOptionsChangedHandler', newValue);
+        this.participantCalendars = this.getParticipantCalendarOptions(this.participants, newValue);
+    }
+    getParticipantCalendarOptions(addedParticipants, availableParticipantOptions) {
+        const organizer = this.participants.find(participant => participant.is_organizer);
+        const participantCalendars = {};
+        if (availableParticipantOptions) {
+            const participants = addedParticipants.filter(participant => availableParticipantOptions.some(availableParticipant => availableParticipant.email === participant.email));
+            participants.forEach(participant => {
+                const participantOption = availableParticipantOptions.find(participantOption => participantOption.email === participant.email);
+                if (!participantOption)
+                    return;
+                this.participantDefaultSelectedCalendars[participant.email] = participant.availability?.calendar_ids || [];
+                const calendars = participantOption.calendars ?? [];
+                participant.availability?.calendar_ids?.forEach(calendarId => {
+                    if (!calendars.some(calendar => calendar.id === calendarId) && calendarId !== 'primary') {
+                        calendars.push({ id: calendarId, name: calendarId });
+                    }
+                });
+                participantCalendars[participant.email] = calendars;
+            });
+        }
+        if (organizer) {
+            participantCalendars[organizer.email] = this.calendars ?? [{ id: 'primary', name: organizer.email }];
+            this.participantDefaultSelectedCalendars[organizer.email] = organizer.availability?.calendar_ids || [];
+        }
+        return participantCalendars;
+    }
+    getUniqueCalendars(calendars) {
+        return calendars.filter((calendar, index, self) => self.findIndex(c => c.id === calendar.id) === index);
+    }
+    connectedCallback() {
+        debug('nylas-connected-calendars', 'connectedCallback');
+    }
+    disconnectedCallback() {
+        debug('nylas-connected-calendars', 'disconnectedCallback');
+    }
+    componentWillLoad() {
+        debug('nylas-connected-calendars', 'componentWillLoad');
+    }
+    componentDidLoad() {
+        debug('nylas-connected-calendars', 'componentDidLoad');
+    }
+    handleValueChanged(event) {
+        debug('[nylas-editor-tabs]', 'handleValueChanged', event);
+        const { name, value } = event.detail;
+        if (!name.startsWith('participant-')) {
+            return;
+        }
+        if (!this.connectedCalendarsFormRef.checkValidity()) {
+            this.internals.setValidity({ customError: true }, 'Please select at least one calendar for each participant.');
+            return;
+        }
+        else {
+            this.internals.setValidity({});
+        }
+        const key = name.split('participant-')[1];
+        if (!this.selectedCalendars[key])
+            return;
+        this.selectedCalendars[key]['calendars'] = value;
+        this.selectedCalendars = { ...this.selectedCalendars };
+        const participantsCalendars = {};
+        this.participants.forEach(participant => {
+            participantsCalendars[participant.email] = this.selectedCalendars[participant.email].calendars;
+        });
+        this.internals.setFormValue(JSON.stringify(participantsCalendars), this.name);
+        this.valueChanged.emit({ value: JSON.stringify(participantsCalendars), name: this.name });
+    }
+    setParticipants(participants) {
+        const selectedParticipants = {};
+        participants.forEach(participant => {
+            const isOpen = participant.is_organizer ? true : false;
+            selectedParticipants[participant.email] = {
+                isOpen: isOpen,
+                name: participant.name || participant.email,
+                availability: participant.availability,
+            };
+        });
+        return selectedParticipants;
+    }
+    render() {
+        return (h(Host, { key: 'bc04f273cf87427c70f2ce0d296eac3d6ac7b6de' }, h("div", { key: '995bb5a0b4be6ab0ea856394bb81d3b5fa487915', class: "nylas-connected-calendars", part: "npca" }, h("div", { key: 'd973e7b5e6c03b87835102a3409061cfb175fbbd', class: "header", part: "npca__header" }, h("h3", { key: 'e7fdc1c368e38857578b48a87b244b000901dd0b' }, "Connected Calendars"), h("p", { key: 'e2cb0d727e9d9dc11e58fb4299da5e335e020474' }, "Select the calendars to use for checking your availability.", h("tooltip-component", { key: 'e93f320b8075f979509fe8f2b81024a939333a00' }, h("info-icon", { key: '1d7c7a2fca87460e84d855b334af8b78ca0cc6e1', slot: "tooltip-icon" }), h("span", { key: 'f4246e370c18c35bcf20ef838ae6da4102234daa', slot: "tooltip-content" }, "Check availability across one or multiple calendars. If multiple calendars are selected, you must be available across all of them to be considered available. The default is your primary calendar if none are selected.")))), h("div", { key: 'cf514c92149d927d7cf5d8f535826987d0d63fce', class: "content", part: "npca__content" }, h("form", { key: 'cbe2ffb59e474169079d2e3896dd1b12391d7487', ref: el => (this.connectedCalendarsFormRef = el) }, Object.keys(this.participantCalendars).map((key, index) => {
+            const participant = this.selectedCalendars[key];
+            const participantCalendars = this.participantCalendars[key];
+            if (!participant || !participant.name)
+                return;
+            return (h("div", { class: "participant-container", part: "npca__participant-container", key: `participant-conatiner-${index}` }, h("div", { class: "participant-title", part: "npca__participant-title" }, h("p", null, "Set ", participant.name, "'s connected calendars"), h("div", { class: "participant-toggle", part: "npca__participant-toggle--container" }, h("span", { class: `chevron ${participant.isOpen ? 'open' : 'closed'}`, onClick: () => {
+                    this.selectedCalendars[key].isOpen = !participant.isOpen;
+                    this.selectedCalendars = { ...this.selectedCalendars };
+                } }, h("chevron-icon", { width: "24", height: "24" })))), participant.isOpen && (h("nylas-calendar-picker", { key: key, name: `participant-${key}`, calendars: participantCalendars, defaultSelectedCalendars: this.participantDefaultSelectedCalendars[key] }))));
+        }))))));
+    }
+    static get formAssociated() { return true; }
+    get host() { return this; }
+    static get watchers() { return {
+        "name": ["elementNameChangedHandler"],
+        "calendars": ["calendarsChangedHandler"],
+        "participants": ["participantsChangedHandler"],
+        "participantOptions": ["participantOptionsChangedHandler"]
+    }; }
+    static get style() { return NylasConnectedCalendarsStyle0; }
+}, [65, "nylas-connected-calendars", {
+        "name": [1],
+        "participants": [16],
+        "calendars": [16],
+        "participantOptions": [16],
+        "selectedCalendars": [32],
+        "participantCalendars": [32],
+        "participantDefaultSelectedCalendars": [32]
+    }, [[0, "valueChanged", "handleValueChanged"]], {
+        "name": ["elementNameChangedHandler"],
+        "calendars": ["calendarsChangedHandler"],
+        "participants": ["participantsChangedHandler"],
+        "participantOptions": ["participantOptionsChangedHandler"]
+    }]);
+__decorate([
+    RegisterComponent({
+        name: 'nylas-connected-calendars',
+        stateToProps: new Map([
+            ['schedulerConfig.additionalParticipants', 'participantOptions'],
+            ['schedulerConfig.calendars', 'calendars'],
+        ]),
+        eventToProps: {},
+        fireRegisterEvent: true,
+    }),
+    __metadata("design:type", Function),
+    __metadata("design:paramtypes", []),
+    __metadata("design:returntype", void 0)
+], NylasConnectedCalendars.prototype, "render", null);
+function defineCustomElement() {
+    if (typeof customElements === "undefined") {
+        return;
+    }
+    const components = ["nylas-connected-calendars", "chevron-icon", "close-icon", "info-icon", "multi-select-dropdown", "nylas-calendar-picker", "tooltip-component"];
+    components.forEach(tagName => { switch (tagName) {
+        case "nylas-connected-calendars":
+            if (!customElements.get(tagName)) {
+                customElements.define(tagName, NylasConnectedCalendars);
+            }
+            break;
+        case "chevron-icon":
+            if (!customElements.get(tagName)) {
+                defineCustomElement$6();
+            }
+            break;
+        case "close-icon":
+            if (!customElements.get(tagName)) {
+                defineCustomElement$5();
+            }
+            break;
+        case "info-icon":
+            if (!customElements.get(tagName)) {
+                defineCustomElement$4();
+            }
+            break;
+        case "multi-select-dropdown":
+            if (!customElements.get(tagName)) {
+                defineCustomElement$3();
+            }
+            break;
+        case "nylas-calendar-picker":
+            if (!customElements.get(tagName)) {
+                defineCustomElement$2();
+            }
+            break;
+        case "tooltip-component":
+            if (!customElements.get(tagName)) {
+                defineCustomElement$1();
+            }
+            break;
+    } });
+}
+export { NylasConnectedCalendars as N, defineCustomElement as d };
+//# sourceMappingURL=nylas-connected-calendars2.js.map

package/dist/components/nylas-connected-calendars2.js.map ADDED Viewed

@@ -0,0 +1 @@

+ {"file":"nylas-connected-calendars2.js","mappings":"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","names":[],"sources":["src/components/scheduler-editor/nylas-connected-calendars/nylas-connected-calendars.scss?tag=nylas-connected-calendars&encapsulation=shadow","src/components/scheduler-editor/nylas-connected-calendars/nylas-connected-calendars.tsx"],"sourcesContent":["@import '../../../common/styles/variables.scss';\n\n:host {\n display: block;\n @include default-css-variables;\n width: inherit;\n}\n\n.nylas-connected-calendars {\n width: inherit;\n display: flex;\n flex-direction: column;\n margin: 1rem;\n border-radius: var(--nylas-border-radius-2x);\n border: 1px solid var(--nylas-base-200);\n\n .header {\n padding: 1rem;\n\n h3 {\n margin: 0;\n font-size: 16px;\n font-weight: 600;\n line-height: 20px;\n color: var(--nylas-base-900);\n text-align: left;\n }\n\n p {\n margin: 0.25rem 0 0 0;\n font-size: 0.875rem;\n font-weight: 400;\n line-height: 20px;\n color: var(--nylas-base-600);\n text-align: left;\n display: flex;\n align-items: center;\n gap: 4px;\n }\n }\n\n .content {\n .participant-container {\n padding-top: 12px;\n border-top: 1px solid var(--nylas-base-200);\n\n .participant-title {\n display: flex;\n justify-content: space-between;\n align-items: center;\n padding: 4px 16px 16px;\n\n p {\n margin: 0;\n }\n\n .participant-toggle {\n display: flex;\n gap: 24px;\n align-items: center;\n\n .chevron {\n display: flex;\n align-self: center;\n cursor: pointer;\n\n &:hover,\n &:active {\n color: var(--nylas-primary);\n }\n\n &.open {\n transform: rotate(90deg);\n }\n\n &.closed {\n transform: rotate(270deg);\n }\n\n &.disabled {\n cursor: not-allowed;\n color: var(--nylas-base-300);\n\n &:hover {\n color: var(--nylas-base-300);\n }\n }\n }\n }\n }\n }\n }\n}\n\nnylas-calendar-picker::part(ncp) {\n margin: 0;\n border: none;\n border-top: 1px solid var(--nylas-base-200);\n border-top-right-radius: 0;\n border-top-left-radius: 0;\n}\n","import { RegisterComponent } from '@/common/register-component';\nimport { NylasSchedulerConfigConnector } from '@/connector/nylas-scheduler-config-connector';\nimport { debug } from '@/utils/utils';\nimport { AttachInternals, Component, Element, Event, EventEmitter, Host, Listen, Prop, State, Watch, h } from '@stencil/core';\nimport { NylasSchedulerEditor } from '../nylas-scheduler-editor/nylas-scheduler-editor';\nimport { AdditionalParticipant, Calendar, Participant } from '@nylas/core';\n\n/**\n * The `nylas-connected-calendars` component is a form input for selecting calendars to check availability for participants.\n */\n@Component({\n tag: 'nylas-connected-calendars',\n styleUrl: 'nylas-connected-calendars.scss',\n shadow: true,\n formAssociated: true,\n})\nexport class NylasConnectedCalendars {\n @Element() host!: HTMLNylasConnectedCalendarsElement;\n private connectedCalendarsFormRef!: HTMLFormElement;\n\n /**\n * The name of the participants custom availability.\n */\n @Prop() name: string = 'connected-calendars';\n\n /**\n * The participants selected in the add participants section.\n */\n @Prop() participants!: Participant[];\n\n /**\n * The calendars to choose from for the organizer / logged in user.\n */\n @Prop() calendars?: Calendar[];\n\n /**\n * The participant options passed in the additionalParticipants prop\n * from the nylas-scheduler-editor component.\n */\n @Prop() participantOptions?: AdditionalParticipant[];\n\n /**\n * This event is fired when the participants custom availability changes.\n */\n @Event() valueChanged!: EventEmitter<{\n value: string;\n name: string;\n }>;\n\n /**\n * The element internals.\n */\n @AttachInternals() internals!: ElementInternals;\n\n /**\n * The state to store the custom availability setting for participants.\n */\n @State() selectedCalendars: {\n [key: string]: {\n isOpen: boolean;\n name: string;\n calendars?: Calendar[];\n };\n } = this.setParticipants(this.participants);\n\n /**\n * Participants calendar options.\n */\n @State() participantCalendars: {\n [key: string]: Calendar[];\n } = {};\n\n /**\n * The state to store the default selected calendars for each participant\n */\n @State() participantDefaultSelectedCalendars: {\n [key: string]: string[];\n } = {};\n\n // Watchers\n @Watch('name')\n elementNameChangedHandler(newValue: string) {\n debug('nylas-connected-calendars', 'elementNameChangedHandler', newValue);\n this.host.setAttribute('name', newValue);\n }\n\n @Watch('calendars')\n calendarsChangedHandler(newValue: Calendar[]) {\n debug('nylas-connected-calendars', 'calendarsChangedHandler', newValue);\n this.participantCalendars = this.getParticipantCalendarOptions(this.participants, this.participantOptions);\n }\n\n @Watch('participants')\n participantsChangedHandler(newValue: Participant[]) {\n debug('nylas-connected-calendars', 'participantsChangedHandler', newValue);\n this.selectedCalendars = this.setParticipants(newValue);\n this.participantCalendars = this.getParticipantCalendarOptions(newValue, this.participantOptions);\n }\n\n @Watch('participantOptions')\n participantOptionsChangedHandler(newValue: AdditionalParticipant[]) {\n debug('nylas-calendar-picker', 'participantOptionsChangedHandler', newValue);\n this.participantCalendars = this.getParticipantCalendarOptions(this.participants, newValue);\n }\n\n getParticipantCalendarOptions(addedParticipants: Participant[], availableParticipantOptions: AdditionalParticipant[] | undefined) {\n // Get the participants from the availableParticipantOptions prop that are in the addedParticipants prop\n const organizer = this.participants.find(participant => participant.is_organizer);\n const participantCalendars = {};\n\n if (availableParticipantOptions) {\n const participants = addedParticipants.filter(participant => availableParticipantOptions.some(availableParticipant => availableParticipant.email === participant.email));\n\n // Get the calendar options for each participant with email as the key\n participants.forEach(participant => {\n const participantOption = availableParticipantOptions.find(participantOption => participantOption.email === participant.email);\n if (!participantOption) return;\n this.participantDefaultSelectedCalendars[participant.email] = participant.availability?.calendar_ids || [];\n const calendars = participantOption.calendars ?? [];\n participant.availability?.calendar_ids?.forEach(calendarId => {\n if (!calendars.some(calendar => calendar.id === calendarId) && calendarId !== 'primary') {\n calendars.push({ id: calendarId, name: calendarId });\n }\n });\n participantCalendars[participant.email] = calendars;\n });\n }\n\n // Add the organizer's calendars to the participantCalendars\n if (organizer) {\n participantCalendars[organizer.email] = this.calendars ?? [{ id: 'primary', name: organizer.email }];\n this.participantDefaultSelectedCalendars[organizer.email] = organizer.availability?.calendar_ids || [];\n }\n return participantCalendars;\n }\n\n getUniqueCalendars(calendars: Calendar[]) {\n return calendars.filter((calendar, index, self) => self.findIndex(c => c.id === calendar.id) === index);\n }\n\n // Lifecycle Methods\n connectedCallback() {\n debug('nylas-connected-calendars', 'connectedCallback');\n }\n\n disconnectedCallback() {\n debug('nylas-connected-calendars', 'disconnectedCallback');\n }\n\n componentWillLoad() {\n debug('nylas-connected-calendars', 'componentWillLoad');\n }\n\n componentDidLoad() {\n debug('nylas-connected-calendars', 'componentDidLoad');\n }\n\n @Listen('valueChanged')\n handleValueChanged(event: CustomEvent) {\n debug('[nylas-editor-tabs]', 'handleValueChanged', event);\n const { name, value } = event.detail;\n if (!name.startsWith('participant-')) {\n return;\n }\n // Validate the form\n if (!this.connectedCalendarsFormRef.checkValidity()) {\n this.internals.setValidity({ customError: true }, 'Please select at least one calendar for each participant.');\n return;\n } else {\n this.internals.setValidity({});\n }\n\n const key = name.split('participant-')[1];\n if (!this.selectedCalendars[key]) return;\n this.selectedCalendars[key]['calendars'] = value;\n this.selectedCalendars = { ...this.selectedCalendars };\n\n const participantsCalendars = {};\n this.participants.forEach(participant => {\n participantsCalendars[participant.email] = this.selectedCalendars[participant.email].calendars;\n });\n this.internals.setFormValue(JSON.stringify(participantsCalendars), this.name);\n this.valueChanged.emit({ value: JSON.stringify(participantsCalendars), name: this.name });\n }\n\n setParticipants(participants: Participant[]) {\n const selectedParticipants = {};\n participants.forEach(participant => {\n const isOpen = participant.is_organizer ? true : false;\n selectedParticipants[participant.email] = {\n isOpen: isOpen,\n name: participant.name || participant.email,\n availability: participant.availability,\n };\n });\n return selectedParticipants;\n }\n @RegisterComponent<NylasConnectedCalendars, NylasSchedulerConfigConnector, Exclude<NylasSchedulerEditor['stores'], undefined>>({\n name: 'nylas-connected-calendars',\n stateToProps: new Map([\n ['schedulerConfig.additionalParticipants', 'participantOptions'],\n ['schedulerConfig.calendars', 'calendars'],\n ]),\n eventToProps: {},\n fireRegisterEvent: true,\n })\n render() {\n return (\n <Host>\n <div class=\"nylas-connected-calendars\" part=\"npca\">\n <div class=\"header\" part=\"npca__header\">\n <h3>Connected Calendars</h3>\n <p>\n Select the calendars to use for checking your availability.\n <tooltip-component>\n <info-icon slot=\"tooltip-icon\" />\n <span slot=\"tooltip-content\">\n Check availability across one or multiple calendars. If multiple calendars are selected, you must be available across all of them to be considered available. The\n default is your primary calendar if none are selected.\n </span>\n </tooltip-component>\n </p>\n </div>\n <div class=\"content\" part=\"npca__content\">\n <form ref={el => (this.connectedCalendarsFormRef = el as HTMLFormElement)}>\n {Object.keys(this.participantCalendars).map((key, index) => {\n const participant = this.selectedCalendars[key];\n const participantCalendars = this.participantCalendars[key];\n if (!participant || !participant.name) return;\n return (\n <div class=\"participant-container\" part=\"npca__participant-container\" key={`participant-conatiner-${index}`}>\n <div class=\"participant-title\" part=\"npca__participant-title\">\n <p>Set {participant.name}'s connected calendars</p>\n <div class=\"participant-toggle\" part=\"npca__participant-toggle--container\">\n <span\n class={`chevron ${participant.isOpen ? 'open' : 'closed'}`}\n onClick={() => {\n this.selectedCalendars[key].isOpen = !participant.isOpen;\n this.selectedCalendars = { ...this.selectedCalendars };\n }}\n >\n <chevron-icon width=\"24\" height=\"24\" />\n </span>\n </div>\n </div>\n {participant.isOpen && (\n <nylas-calendar-picker\n key={key}\n name={`participant-${key}`}\n calendars={participantCalendars}\n defaultSelectedCalendars={this.participantDefaultSelectedCalendars[key]}\n />\n )}\n </div>\n );\n })}\n </form>\n </div>\n </div>\n </Host>\n );\n }\n}\n"],"version":3}

package/dist/components/nylas-custom-booking-flow.js CHANGED Viewed

@@ -95,7 +95,7 @@ const NylasCustomBookingFlow$1 = proxyCustomElement(class NylasCustomBookingFlow
                 value: 'pre-booking',
             },
         ];
-        return (h(Host, { key: '2e2a26ab26a63e7855a8d3280be056ee0d9f58bf' }, h("div", { key: 'ae1a111bf526645d268e7fb5a01d755140b99e70', class: "nylas-custom-booking-flow", part: "ncbf" }, h("div", { key: '1b8de2d86c1e6df2ac34b6cb27e01692829dca5e', class: "header", part: "ncbf__header" }, h("h3", { key: '166f032b49b2f6bc2f05271633ac9a64d246146f' }, "Customize booking flow"), h("p", { key: '23011ab13b85225b9042f8f84672cd688c93f16f' }, "Customize how new bookings are handled when a booking is completed.")), bookingOptions.length > 0 ? (h("div", { class: "nylas-custom-booking-flow__dropdown" }, h("span", { class: "label" }, "After a booking is confirmed", h("tooltip-component", null, h("info-icon", { slot: "tooltip-icon" }), h("span", { slot: "tooltip-content" }, "Choose how you\u2019d like to handle new bookings. If you choose to manually confirm/decline bookings, you will be able to review and accept or decline each booking request."))), h("select-dropdown", { name: "booking-type", options: bookingOptions, withSearch: false, exportparts: "sd_dropdown: ncbf__dropdown, sd_dropdown-button: ncbf__dropdown-button, sd_dropdown-content: ncbf__dropdown-content", defaultSelectedOption: bookingOptions.find(cal => cal.value == this.bookingType) ?? bookingOptions[0] }))) : (h("div", { class: "nylas-custom-booking-flow__loading" }, h("span", { class: "label" }, "Select a calendar to book meetings on ", h("info-icon", null)), h("div", { class: "loading-button" }, h("span", null, "Loading...")))))));
+        return (h(Host, { key: '886c0c6645e43c346db07c0d105be004697448e0' }, h("div", { key: 'f6c020725b462db9571606141538bcd92fa84f13', class: "nylas-custom-booking-flow", part: "ncbf" }, h("div", { key: 'bf73937190883fa2781c7ede636926f559339a92', class: "header", part: "ncbf__header" }, h("h3", { key: 'b3e037e637c6976174f1eb054ea9257618687b9d' }, "Customize booking flow"), h("p", { key: '302d2c9bc6dbcb572031148500b0a80223cdfbb4' }, "Customize how new bookings are handled when a booking is completed.")), bookingOptions.length > 0 ? (h("div", { class: "nylas-custom-booking-flow__dropdown" }, h("span", { class: "label" }, "After a booking is confirmed", h("tooltip-component", null, h("info-icon", { slot: "tooltip-icon" }), h("span", { slot: "tooltip-content" }, "Choose how you\u2019d like to handle new bookings. If you choose to manually confirm/decline bookings, you will be able to review and accept or decline each booking request."))), h("select-dropdown", { name: "booking-type", options: bookingOptions, withSearch: false, exportparts: "sd_dropdown: ncbf__dropdown, sd_dropdown-button: ncbf__dropdown-button, sd_dropdown-content: ncbf__dropdown-content", defaultSelectedOption: bookingOptions.find(cal => cal.value == this.bookingType) ?? bookingOptions[0] }))) : (h("div", { class: "nylas-custom-booking-flow__loading" }, h("span", { class: "label" }, "Select a calendar to book meetings on ", h("info-icon", null)), h("div", { class: "loading-button" }, h("span", null, "Loading...")))))));
     }
     static get formAssociated() { return true; }
     get host() { return this; }

package/dist/components/nylas-customize-booking-settings2.js CHANGED Viewed

@@ -30,11 +30,11 @@ const NylasCustomizeBookingSettings = proxyCustomElement(class NylasCustomizeBoo
         this.valueChanged = createEvent(this, "valueChanged", 7);
         this.internals = this.attachInternals();
         this.selectedConfiguration = undefined;
-        this.defaultAdditionalGuestsHidden = this.selectedConfiguration?.scheduler?.hide_additional_guests ?? false;
+        this.defaultHideAdditionalGuests = this.selectedConfiguration?.scheduler?.hide_additional_guests ?? false;
         this.defaultHideCancellationOptions = this.selectedConfiguration?.scheduler?.hide_cancellation_options ?? false;
         this.defaultHideReschedulingOptions = this.selectedConfiguration?.scheduler?.hide_rescheduling_options ?? false;
         this.name = 'customize-booking-settings';
-        this.allowGuestsToInvite = this.defaultAdditionalGuestsHidden;
+        this.allowGuestsToInvite = this.defaultHideAdditionalGuests;
         this.hideCancellationOptions = this.defaultHideCancellationOptions;
         this.hideReschedulingOptions = this.defaultHideReschedulingOptions;
     }
@@ -101,7 +101,7 @@ const NylasCustomizeBookingSettings = proxyCustomElement(class NylasCustomizeBoo
         }), this.name);
     }
     render() {
-        return (h(Host, { key: '543f4fc64d9dab03c528c5738cd4c1b1bb9cfd2a' }, h("div", { key: 'e3f153847ad5256327952d4be0aace03543b1d40', class: "nylas-customize-booking-settings", part: "ncbs" }, h("div", { key: '5b35f27785f6f6bc8e8848d94857869b73108df0', class: "header", part: "ncbs__header" }, h("h3", { key: 'd50a9614e3b0b5227a196356a43f12aab4acb158' }, "Additional settings"), h("p", { key: 'f29bbb165479e276cf87087582e9c60eb21c37d1' }, "Booking settings for the event.")), h("div", { key: 'd091485f983d0cc3ff86e7ca89df8d75526d3cef', class: "nylas-customize-booking-settings__settings", part: "ncbs__settings" }, h("div", { key: '7f7888a718a70a681795e599075c92cfbc16853a', class: "nylas-customize-booking-settings__settings-div", part: "ncbs__settings-div , ncbs__additional_guests" }, h("checkbox-component", { key: 'e37474d77812d96fe264d26c329078502c074dbe', name: "hide_additional_guests", label: "Allow guests to invite additional guests.", checked: this.allowGuestsToInvite }, h("span", { key: '00b45833c0223e373edf0b42669e4a154938b1eb', slot: "label", class: "label" }, h("p", { key: 'e66de8b9f53230347417a8ec0a7ae7a19af9db31', class: "label-contents" }, "Allow guests to invite additional guests to the booking."), h("tooltip-component", { key: '1ba5558e1991235c21f57ca1968220ea7bf43fcb', id: "guests" }, h("info-icon", { key: '3e62cc64cc55eb3dd4d0a73cef80a64c8dc9c38f', slot: "tooltip-icon" }), h("span", { key: '3853d0d575be29420ea012c90b0a2c07913a86a7', slot: "tooltip-content" }, "Allow guests to invite additional guests to the event. If enabled, the guest will be able to add additional guests' email addresses."))))), h("div", { key: '92e209a924673d8b1dee03475ffabfea5d9bf09b', class: "nylas-customize-booking-settings__settings-div", part: "ncbs__settings-div , ncbs__rescheduling_options" }, h("checkbox-component", { key: 'f7b522c07700938d25b17e14d236edb2aae12b21', name: "hide_rescheduling_options", label: "Hide 'Reschedule' option on booking page and emails.", checked: this.hideReschedulingOptions }, h("span", { key: '590cb5d983ff6eef95ebb370b845e1cc8e3080e4', slot: "label", class: "label" }, h("p", { key: '8f2d2742976e21a81268c793ae1c6c9dafdcecc3', class: "label-contents" }, "Hide the\u00A0", h("strong", { key: '4b01f75e4067d7c8d26ca785d5c6ad841633130c' }, "Reschedule"), "\u00A0button on the Scheduling Page and in the email notifications."), h("tooltip-component", { key: '8a157115569a4413143779c9e09c8389394973f9', id: "reschedule" }, h("info-icon", { key: 'b3a2c734d2d7a303d1d4d2622b51113aa7d3dfaf', slot: "tooltip-icon" }), h("span", { key: '2d08ceb49e744787da6863d72cf2c6df50f1a7cc', slot: "tooltip-content" }, "Hide the 'Reschedule' button on the Scheduling page and in the email notifications. If enabled, the guest will not be able to reschedule the booking."))))), h("div", { key: '6bc7f1a30a750ba85453d852f6f7e05c0513673d', class: "nylas-customize-booking-settings__settings-div", part: "ncbs__settings-div , ncbs__cancellation_options" }, h("checkbox-component", { key: '089ca174d8aabb26d87f5bb8cb871b9e82b7c04f', name: "hide_cancellation_options", label: "Hide 'Cancel' option on booking page and emails.", checked: this.hideCancellationOptions }, h("span", { key: '9ec50185d728baddbe0805eaeff057686b153bea', slot: "label", class: "label" }, h("p", { key: '118c1c3cc06dba90f451711aba0dde3efeeec9f0', class: "label-contents" }, "Hide the\u00A0", h("strong", { key: 'c1a26aa5c832fba488d60fc3af5a3c000ada144d' }, "Cancel"), "\u00A0button on the Scheduling Page and in the email notifications."), h("tooltip-component", { key: 'b70473d1e93c11d9b05a9dcec67d77795638bbeb', id: "cancel" }, h("info-icon", { key: '2f0d812ac9fb7a52260b601c590b7a629036ea7c', slot: "tooltip-icon" }), h("span", { key: '4c5b3b51b57761a377ccfa7f66d6d69486d8cb11', slot: "tooltip-content" }, "Hide the 'Cancel' button on the Scheduling page and in the email notifications. If enabled, the guest will not be able to cancel the booking.")))))))));
+        return (h(Host, { key: 'e4b8a58d1b11c5a48d09bcf65fc1424c1bc8daf6' }, h("div", { key: '5e7b2a4cf3dbf3a3aefce2023ee884a491aeb1a1', class: "nylas-customize-booking-settings", part: "ncbs" }, h("div", { key: 'b00c2654d1e76cfd8bfd41970c233df638fbde58', class: "header", part: "ncbs__header" }, h("h3", { key: '73b3a57ed1156a07a9e50b7362116ae455bd0bde' }, "Additional settings"), h("p", { key: '1e3b02068249923ab49bbc9cb0dc0551e35cba41' }, "Booking settings for the event.")), h("div", { key: 'db140f831c461db9aa1127bc2cbead906928ca40', class: "nylas-customize-booking-settings__settings", part: "ncbs__settings" }, h("div", { key: '0d467d726d9799a912ba48c010905830e87d250b', class: "nylas-customize-booking-settings__settings-div", part: "ncbs__settings-div , ncbs__additional_guests" }, h("checkbox-component", { key: '658c73f67a1edb4d2e2e5110fe8e1b8b9054c686', name: "hide_additional_guests", label: "Allow guests to invite additional guests.", checked: this.allowGuestsToInvite }, h("span", { key: '12924a967738ab95afa28d81a2ba69496a20c8fd', slot: "label", class: "label" }, h("p", { key: '700b4f9ffef5a1e9b138a394023379c8d8a59962', class: "label-contents" }, "Allow guests to invite additional guests to the booking."), h("tooltip-component", { key: '85459fa4975ffc814967a4b4ae568b8cf0563dca', id: "guests" }, h("info-icon", { key: '21a724b0a34d252350f2b4e76aa1785cf95fa022', slot: "tooltip-icon" }), h("span", { key: 'c3233a8ef448e68a5e36e682c48b0fbf527c226c', slot: "tooltip-content" }, "Allow guests to invite additional guests to the event. If enabled, the guest will be able to add additional guests' email addresses."))))), h("div", { key: '2ee5df5d0b689b832b9387d102a4b9cb44d020c1', class: "nylas-customize-booking-settings__settings-div", part: "ncbs__settings-div , ncbs__rescheduling_options" }, h("checkbox-component", { key: 'ca74819cc2c08f3da7b80841169258f8786b8dc5', name: "hide_rescheduling_options", label: "Hide 'Reschedule' option on booking page and emails.", checked: this.hideReschedulingOptions }, h("span", { key: 'f0de48b03ff4873ac342dd4f4c1de38ce6053c8a', slot: "label", class: "label" }, h("p", { key: '4b950091bf6dad75f8501d2c2b31bc40e02c6dd2', class: "label-contents" }, "Hide the\u00A0", h("strong", { key: '1eea34c7676eff933a15d946cd38df9659497ad6' }, "Reschedule"), "\u00A0button on the Scheduling Page and in the email notifications."), h("tooltip-component", { key: '61335a5bc86df23bdad167f7fec9839047590491', id: "reschedule" }, h("info-icon", { key: '6885ed94a12a3ecde75e9c701d8fda056d187a52', slot: "tooltip-icon" }), h("span", { key: '49eae7dadcb8fffff94d319dbf39b11096a7b8cc', slot: "tooltip-content" }, "If enabled, the guest will not be able to reschedule the booking."))))), h("div", { key: '0bcbfbfc90e03d20a6021603eebe825433dca793', class: "nylas-customize-booking-settings__settings-div", part: "ncbs__settings-div , ncbs__cancellation_options" }, h("checkbox-component", { key: '73cea5cfd2643d930fc45dbcecc7bf72b35d53bf', name: "hide_cancellation_options", label: "Hide 'Cancel' option on booking page and emails.", checked: this.hideCancellationOptions }, h("span", { key: '61224ee172a9a1a9e176e612ec549a69863c5cc6', slot: "label", class: "label" }, h("p", { key: 'd2e344036e3a51e434d83650d55030aec3590c72', class: "label-contents" }, "Hide the\u00A0", h("strong", { key: 'b3778bae9c6b4d7d3ebb9ba8af97099bc5d1e79d' }, "Cancel"), "\u00A0button on the Scheduling Page and in the email notifications."), h("tooltip-component", { key: '0f17015840a4037e078b5d3df6fd1283de9a210c', id: "cancel" }, h("info-icon", { key: 'aae84e684fedb05e632787f94b2b69fe0a18d989', slot: "tooltip-icon" }), h("span", { key: 'c0d38e54cc25a2a141f53d19f2ca40824995c068', slot: "tooltip-content" }, "If enabled, the guest will not be able to cancel the booking.")))))))));
     }
     static get formAssociated() { return true; }
     get host() { return this; }
@@ -112,7 +112,7 @@ const NylasCustomizeBookingSettings = proxyCustomElement(class NylasCustomizeBoo
     static get style() { return NylasCustomizeBookingSettingsStyle0; }
 }, [65, "nylas-customize-booking-settings", {
         "selectedConfiguration": [16],
-        "defaultAdditionalGuestsHidden": [4, "default-additional-guests-hidden"],
+        "defaultHideAdditionalGuests": [4, "default-hide-additional-guests"],
         "defaultHideCancellationOptions": [4, "default-hide-cancellation-options"],
         "defaultHideReschedulingOptions": [4, "default-hide-rescheduling-options"],
         "name": [1],