@nylas/web-elements 1.4.2 → 1.4.4

package/dist/esm/nylas-event-calendar_3.entry.js

@@ -1,6 +1,6 @@
 import { r as registerInstance, c as createEvent, h as h$1, H as Host, a as getElement } from './index-091600eb.js';
-import { R as RegisterComponent } from './register-component-238f28de.js';
-import { t as timezone, a as debug, i as instance, H as generateRRule, z as getTimezoneOffset } from './utils-7d962146.js';
+import { R as RegisterComponent } from './register-component-02a05665.js';
+import { t as timezone, a as debug, i as instance, H as generateRRule, y as getTimezoneOffset } from './utils-e27d0e4b.js';
 import { a as dayjs, u as utc } from './utc-484aac6d.js';
 import { T as TIMEZONE_MAP } from './constants-3d8016e3.js';
 import { c as customParseFormat } from './customParseFormat-a4d9ea69.js';
@@ -13733,6 +13733,17 @@ const NylasEventCalendar = class {
                 this.selectedEvent.group_event_info.rrule = recurrence;
             }
         }
+        if (name === 'event-capacity') {
+            const parsedValue = parseInt(value);
+            if (parsedValue < 1 || parsedValue > 500 || isNaN(parsedValue)) {
+                this.formError = instance.t('fixFormErrors');
+                this.internals.setValidity({ customError: true }, this.formError);
+            }
+            else {
+                this.formError = '';
+                this.internals.setValidity({ customError: false }, '');
+            }
+        }
     }
     timeWindowFormErrorHandler(event) {
         if (event.detail.key === 'event-timeslot') {
@@ -13766,21 +13777,7 @@ const NylasEventCalendar = class {
                 e.preventDefault();
                 e.stopImmediatePropagation();
                 this.showEditOptions = false;
-            } }, h$1("close-icon", null))), h$1("div", { class: "edit-options__content action-options__content" }, h$1("ul", { tabindex: "-1", role: "listbox", "aria-label": this.name }, this.editOptions.map(option => option.value.toString() ? (h$1("li", { class: { disabled: !!this.isLoading }, tabindex: "0", key: option.value, id: option.value, onClick: e => this.handleEditOptionSelected(e, option), role: "option" }, this.isLoading && this.loadingOptions.delete === option.value ? `Deleting...` : option.label)) : null)))))), this.showConfirmDiscardUnsavedChangesModal && (h$1("div", { class: "discard-changes action-options", onClick: () => (this.showUpdateOptions = false) }, h$1("div", { class: "discard-changes__card action-options__card" }, h$1("button-component", { tooltip: "Close", id: "close-discard-changes", variant: 'invisible', disabled: this.isLoading, onClick: e => {
-                e.preventDefault();
-                e.stopImmediatePropagation();
-                this.showConfirmDiscardUnsavedChangesModal = false;
-            } }, h$1("close-icon", null)), h$1("div", { class: "discard-changes__content action-options__content" }, h$1("h3", { slot: "card-title", part: "nfbf__title" }, "Discard unsaved changes?")), h$1("div", { class: "discard-changes__footer action-options__footer" }, h$1("button-component", { variant: 'basic', onClick: _e => (this.showConfirmDiscardUnsavedChangesModal = false), part: "nfbf__button-outline nfbf__cancel-cta" }, `${instance.t('deleteSchedulingPageCancelButton')}`), h$1("button-component", { variant: 'destructive', onClick: e => {
-                e.preventDefault();
-                e.stopImmediatePropagation();
-                this.showConfirmDiscardUnsavedChangesModal = false;
-                this.unsavedChanges = false;
-                this.showEditEventDetails = false;
-                this.showCreateEventDetails = false;
-                this.selectedEvent = null;
-                this.createNewGroupEventTimeslot = null;
-                this.formError = '';
-            }, part: "nfbf__button-outline nfbf__reschedule-cta" }, "Discard"))))), this.showUpdateOptions && (h$1("div", { class: "update-options action-options", onClick: () => (this.showUpdateOptions = false) }, h$1("div", { class: "update-options__card action-options__card" }, h$1("button-component", { tooltip: "Close", id: "close-update-options", variant: 'invisible', disabled: this.isLoading, onClick: e => {
+            } }, h$1("close-icon", null))), h$1("div", { class: "edit-options__content action-options__content" }, h$1("ul", { tabindex: "-1", role: "listbox", "aria-label": this.name }, this.editOptions.map(option => option.value.toString() ? (h$1("li", { class: { disabled: !!this.isLoading }, tabindex: "0", key: option.value, id: option.value, onClick: e => this.handleEditOptionSelected(e, option), role: "option" }, this.isLoading && this.loadingOptions.delete === option.value ? `Deleting...` : option.label)) : null)))))), this.showUpdateOptions && (h$1("div", { class: "update-options action-options", onClick: () => (this.showUpdateOptions = false) }, h$1("div", { class: "update-options__card action-options__card" }, h$1("button-component", { tooltip: "Close", id: "close-update-options", variant: 'invisible', disabled: this.isLoading, onClick: e => {
                 e.preventDefault();
                 e.stopImmediatePropagation();
                 this.showUpdateOptions = false;
@@ -13856,9 +13853,23 @@ const NylasEventCalendar = class {
                     this.selectedEvent = null;
                     this.unsavedChanges = false;
                 }
-            } }, "Cancel"), h$1("button-component", { variant: 'primary', disabled: this.isLoading, isLoading: this.isLoading, onClick: e => {
+            } }, "Cancel"), h$1("button-component", { variant: 'primary', disabled: this.isLoading || this.formError !== '', isLoading: this.isLoading, onClick: e => {
                 this.handleCreateGroupEvent(e);
-            } }, "Create")))))))));
+            } }, "Create")))))), this.showConfirmDiscardUnsavedChangesModal && (h$1("div", { class: "discard-changes action-options", onClick: () => (this.showUpdateOptions = false) }, h$1("div", { class: "discard-changes__card action-options__card" }, h$1("button-component", { tooltip: "Close", id: "close-discard-changes", variant: 'invisible', disabled: this.isLoading, onClick: e => {
+                e.preventDefault();
+                e.stopImmediatePropagation();
+                this.showConfirmDiscardUnsavedChangesModal = false;
+            } }, h$1("close-icon", null)), h$1("div", { class: "discard-changes__content action-options__content" }, h$1("h3", { slot: "card-title", part: "nfbf__title" }, "Discard unsaved changes?")), h$1("div", { class: "discard-changes__footer action-options__footer" }, h$1("button-component", { variant: 'basic', onClick: _e => (this.showConfirmDiscardUnsavedChangesModal = false), part: "nfbf__button-outline nfbf__cancel-cta" }, `${instance.t('deleteSchedulingPageCancelButton')}`), h$1("button-component", { variant: 'destructive', onClick: e => {
+                e.preventDefault();
+                e.stopImmediatePropagation();
+                this.showConfirmDiscardUnsavedChangesModal = false;
+                this.unsavedChanges = false;
+                this.showEditEventDetails = false;
+                this.showCreateEventDetails = false;
+                this.selectedEvent = null;
+                this.createNewGroupEventTimeslot = null;
+                this.formError = '';
+            }, part: "nfbf__button-outline nfbf__reschedule-cta" }, "Discard"))))))));
     }
     static get formAssociated() { return true; }
     get host() { return getElement(this); }
@@ -13940,7 +13951,7 @@ __decorate$2([
 ], NylasEventCalendar.prototype, "render", null);
 NylasEventCalendar.style = NylasEventCalendarStyle0;
 
-const nylasEventCapacityCss = ":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-color-blue-100:#e0e6f9;--nylas-border-radius:0.25rem;--nylas-border-radius-2x:0.5rem;--nylas-border-radius-3x:0.75rem;--nylas-font-family:\"Inter\", sans-serif;--nylas-color-black:#000000;--nylas-color-grey-900:#2c2c2c;--nylas-color-grey-800:#4b4b4b;--nylas-color-grey-700:#6e6e6e;--nylas-color-grey-600:#8e8e8e;--nylas-color-grey-500:#b3b3b3;--nylas-color-grey-400:#cacaca;--nylas-color-grey-300:#e1e1e1;--nylas-color-grey-200:#eaeaea;--nylas-color-grey-100:#f5f5f5;--nylas-color-grey-50:#fbfcfe;--nylas-color-white:#ffffff;--nylas-color-red-900:#992222;--nylas-color-red-700:#cc4841;--nylas-color-red-500:#ff786a;--nylas-color-red-300:#ffa79e;--nylas-color-red-100:#ffc5bf;--nylas-color-red-50:#ffeae8;--nylas-color-blue-900:#213571;--nylas-color-blue-700:#314fa9;--nylas-color-blue-500:#4169e1;--nylas-color-blue-300:#bdccf9;--nylas-color-blue-100:#e0e6f9;--nylas-color-blue-50:#f6f8fd;--nylas-color-yellow-900:#7c6506;--nylas-color-yellow-700:#c29f09;--nylas-color-yellow-500:#f7c90b;--nylas-color-yellow-300:#f9de70;--nylas-color-yellow-100:#fceba9;--nylas-color-yellow-50:#fdf4ce;--nylas-color-green-900:#0e6b60;--nylas-color-green-700:#16a392;--nylas-color-green-500:#17c3b2;--nylas-color-green-300:#74dbd1;--nylas-color-green-100:#a2e7e0;--nylas-color-green-50:#d1f3f0;--nylas-color-purple-900:#643554;--nylas-color-purple-700:#954f7d;--nylas-color-purple-500:#c769a7;--nylas-color-purple-300:#dda5ca;--nylas-color-purple-100:#e0bdd6;--nylas-color-purple-50:#e9dde5;--nylas-color-sky-900:#20698f;--nylas-color-sky-700:#2b8fc2;--nylas-color-sky-500:#6dceff;--nylas-color-sky-300:#8fdaff;--nylas-color-sky-100:#b8e7ff;--nylas-color-sky-50:#d9f2ff;width:inherit}.nylas-event-capacity{display:flex;flex-direction:column;gap:4px}.nylas-event-capacity label{display:flex;align-items:center;gap:4px;color:var(--nylas-base-800);font-size:16px;font-style:normal;font-weight:400;line-height:150%;}.nylas-event-capacity label span.required{color:var(--nylas-error, #cc4841)}.nylas-event-capacity label span.label-icon{margin-left:4px}.nylas-event-capacity label span.label-icon tooltip-component{display:flex}.nylas-event-capacity label tooltip-component::part(tc__content){left:50px}.nylas-event-capacity__wrapper{display:flex;align-items:center;gap:0.5rem}.nylas-event-capacity__wrapper input-component{width:auto}.nylas-event-capacity__wrapper input-component::part(ic__input){border-width:1;border-radius:8px;border:1px solid var(--nylas-base-200);font-family:var(--nylas-font-family);font-size:16px;line-height:24px;width:80px}";
+const nylasEventCapacityCss = ":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-color-blue-100:#e0e6f9;--nylas-border-radius:0.25rem;--nylas-border-radius-2x:0.5rem;--nylas-border-radius-3x:0.75rem;--nylas-font-family:\"Inter\", sans-serif;--nylas-color-black:#000000;--nylas-color-grey-900:#2c2c2c;--nylas-color-grey-800:#4b4b4b;--nylas-color-grey-700:#6e6e6e;--nylas-color-grey-600:#8e8e8e;--nylas-color-grey-500:#b3b3b3;--nylas-color-grey-400:#cacaca;--nylas-color-grey-300:#e1e1e1;--nylas-color-grey-200:#eaeaea;--nylas-color-grey-100:#f5f5f5;--nylas-color-grey-50:#fbfcfe;--nylas-color-white:#ffffff;--nylas-color-red-900:#992222;--nylas-color-red-700:#cc4841;--nylas-color-red-500:#ff786a;--nylas-color-red-300:#ffa79e;--nylas-color-red-100:#ffc5bf;--nylas-color-red-50:#ffeae8;--nylas-color-blue-900:#213571;--nylas-color-blue-700:#314fa9;--nylas-color-blue-500:#4169e1;--nylas-color-blue-300:#bdccf9;--nylas-color-blue-100:#e0e6f9;--nylas-color-blue-50:#f6f8fd;--nylas-color-yellow-900:#7c6506;--nylas-color-yellow-700:#c29f09;--nylas-color-yellow-500:#f7c90b;--nylas-color-yellow-300:#f9de70;--nylas-color-yellow-100:#fceba9;--nylas-color-yellow-50:#fdf4ce;--nylas-color-green-900:#0e6b60;--nylas-color-green-700:#16a392;--nylas-color-green-500:#17c3b2;--nylas-color-green-300:#74dbd1;--nylas-color-green-100:#a2e7e0;--nylas-color-green-50:#d1f3f0;--nylas-color-purple-900:#643554;--nylas-color-purple-700:#954f7d;--nylas-color-purple-500:#c769a7;--nylas-color-purple-300:#dda5ca;--nylas-color-purple-100:#e0bdd6;--nylas-color-purple-50:#e9dde5;--nylas-color-sky-900:#20698f;--nylas-color-sky-700:#2b8fc2;--nylas-color-sky-500:#6dceff;--nylas-color-sky-300:#8fdaff;--nylas-color-sky-100:#b8e7ff;--nylas-color-sky-50:#d9f2ff;width:inherit}.nylas-event-capacity{display:flex;flex-direction:column;gap:4px}.nylas-event-capacity label{display:flex;align-items:center;gap:4px;color:var(--nylas-base-800);font-size:16px;font-style:normal;font-weight:400;line-height:150%;}.nylas-event-capacity label span.required{color:var(--nylas-error, #cc4841)}.nylas-event-capacity label span.label-icon{margin-left:4px}.nylas-event-capacity label span.label-icon tooltip-component{display:flex}.nylas-event-capacity label tooltip-component::part(tc__content){left:50px}.nylas-event-capacity__wrapper{display:flex;align-items:center;gap:0.5rem}.nylas-event-capacity__wrapper input-component{width:auto}.nylas-event-capacity__wrapper input-component::part(ic__input){border-width:1;border-radius:8px;border:1px solid var(--nylas-base-200);font-family:var(--nylas-font-family);font-size:16px;line-height:24px;width:80px}.nylas-event-capacity__wrapper input-component::part(ic__input--error){border:1px solid var(--nylas-error)}.nylas-event-capacity__wrapper input-component::part(ic__label--error){position:relative;margin-bottom:24px}.nylas-event-capacity__wrapper input-component::part(ic__error_message){position:absolute;top:54px;width:max-content}.nylas-event-capacity__wrapper span.attendees.error{margin-top:-24px}";
 const NylasEventCapacityStyle0 = nylasEventCapacityCss;
 
 var __decorate$1 = (undefined && undefined.__decorate) || function (decorators, target, key, desc) {
@@ -13972,6 +13983,7 @@ const NylasEventCapacity = class {
         this.capacity = undefined;
         this.selectedLanguage = undefined;
         this.selectedEventCapacity = undefined;
+        this.error = '';
     }
     connectedCallback() {
         debug('nylas-event-capacity', 'connectedCallback');
@@ -14013,6 +14025,15 @@ const NylasEventCapacity = class {
     async nylasFormInputChangeHandler(event) {
         const { name, value } = event.detail;
         if (name === 'event-capacity') {
+            const parsedValue = parseInt(value);
+            if (parsedValue < 1 || parsedValue > 500 || isNaN(parsedValue)) {
+                this.error = instance.t('fixFormErrors');
+                this.internals.setValidity({ customError: true }, this.error);
+                this.valueChanged.emit({ value: value.toString(), name: this.name });
+                return;
+            }
+            this.error = '';
+            this.internals.setValidity({ customError: false }, '');
             this.selectedEventCapacity = parseInt(value);
             this.internals.setFormValue(value.toString(), this.name);
             this.valueChanged.emit({ value: value.toString(), name: this.name });
@@ -14020,7 +14041,7 @@ const NylasEventCapacity = class {
     }
     render() {
         const isComponentReady = typeof this.selectedEventCapacity !== 'undefined';
-        return (h$1(Host, { key: 'e2debc0469569f51e10fd9c0604e7d62c4db6b39' }, h$1("div", { key: '49c4a101da37906bf5f18446190729e141c7451c', class: "nylas-event-capacity", part: "necapacity" }, h$1("label", { key: '9d6d299b6d4b6d05d08b24d1ce73f24ea056815c', htmlFor: "event-capacity" }, h$1("span", { key: '1b81652fd174559d8bcfc4a49193b233a69a967e' }, instance.t('nylasEventCapacity.headerTitle'), h$1("span", { key: '45a31e0e9e4e771bd36653e375e37acc00fd9895', class: "required" }, "*")), h$1("tooltip-component", { key: 'b83eeb0255d145363fe49b489908c6e17f091e07' }, h$1("info-icon", { key: 'd595bc37faa4830dd047d01b69e850d70532b7a0', slot: "tooltip-icon" }), h$1("span", { key: 'f7d4241b10814b1c6e7d09f54a2da1ce0b7b1d72', slot: "tooltip-content" }, instance.t('nylasEventCapacity.tooltip.desc')))), isComponentReady && (h$1("div", { class: "nylas-event-capacity__wrapper" }, h$1("input-component", { name: "event-capacity", id: "event-capacity", type: "number", minValue: 1, required: false, exportparts: "ic_input: necapacity__input-textfield", defaultValue: typeof this.selectedEventCapacity === 'number' ? this.selectedEventCapacity.toString() : '10' }), h$1("span", null, instance.t('nylasEventCapacity.attendees')))))));
+        return (h$1(Host, { key: 'b0eebdd8854645010038e0e03bfa94c851d5a859' }, h$1("div", { key: '6d7a7f053c3b7e166480eefbe5ef1df178552180', class: "nylas-event-capacity", part: "necapacity" }, h$1("label", { key: '05f77a19d88d300aafb73cf6aecf83c4c8e92679', htmlFor: "event-capacity" }, h$1("span", { key: '18fbc5bf61b42b39f9ad0bacba4fb4cb42392e43' }, instance.t('nylasEventCapacity.headerTitle'), h$1("span", { key: '1e42bd3df3cbb5f9e0b7a2fac118abed3648a2a5', class: "required" }, "*")), h$1("tooltip-component", { key: 'e0fa3f3557c575dbaf7e989e7eeeb956fd4ee55b' }, h$1("info-icon", { key: '952d5cfb9695a0005b06fb8539ae84c38bfe566e', slot: "tooltip-icon" }), h$1("span", { key: 'aacb7c0d1a2904a9675c75d51cf7d082e3bf1d3e', slot: "tooltip-content" }, instance.t('nylasEventCapacity.tooltip.desc')))), isComponentReady && (h$1("div", { class: "nylas-event-capacity__wrapper" }, h$1("input-component", { name: "event-capacity", id: "event-capacity", type: "number", pattern: /^[0-9]*$/, patternError: instance.t('invalidInputFormat', { field: 'Event capacity' }), minValue: 1, maxValue: 500, required: false, exportparts: "ic_input: necapacity__input-textfield", defaultValue: typeof this.selectedEventCapacity === 'number' ? this.selectedEventCapacity.toString() : '10' }), h$1("span", { class: this.error ? 'attendees error' : 'attendees' }, instance.t('nylasEventCapacity.attendees')))))));
     }
     static get formAssociated() { return true; }
     get host() { return getElement(this); }
@@ -14049,7 +14070,7 @@ __decorate$1([
 ], NylasEventCapacity.prototype, "render", null);
 NylasEventCapacity.style = NylasEventCapacityStyle0;
 
-const nylasEventTimeslotCss = ":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-color-blue-100:#e0e6f9;--nylas-border-radius:0.25rem;--nylas-border-radius-2x:0.5rem;--nylas-border-radius-3x:0.75rem;--nylas-font-family:\"Inter\", sans-serif;--nylas-color-black:#000000;--nylas-color-grey-900:#2c2c2c;--nylas-color-grey-800:#4b4b4b;--nylas-color-grey-700:#6e6e6e;--nylas-color-grey-600:#8e8e8e;--nylas-color-grey-500:#b3b3b3;--nylas-color-grey-400:#cacaca;--nylas-color-grey-300:#e1e1e1;--nylas-color-grey-200:#eaeaea;--nylas-color-grey-100:#f5f5f5;--nylas-color-grey-50:#fbfcfe;--nylas-color-white:#ffffff;--nylas-color-red-900:#992222;--nylas-color-red-700:#cc4841;--nylas-color-red-500:#ff786a;--nylas-color-red-300:#ffa79e;--nylas-color-red-100:#ffc5bf;--nylas-color-red-50:#ffeae8;--nylas-color-blue-900:#213571;--nylas-color-blue-700:#314fa9;--nylas-color-blue-500:#4169e1;--nylas-color-blue-300:#bdccf9;--nylas-color-blue-100:#e0e6f9;--nylas-color-blue-50:#f6f8fd;--nylas-color-yellow-900:#7c6506;--nylas-color-yellow-700:#c29f09;--nylas-color-yellow-500:#f7c90b;--nylas-color-yellow-300:#f9de70;--nylas-color-yellow-100:#fceba9;--nylas-color-yellow-50:#fdf4ce;--nylas-color-green-900:#0e6b60;--nylas-color-green-700:#16a392;--nylas-color-green-500:#17c3b2;--nylas-color-green-300:#74dbd1;--nylas-color-green-100:#a2e7e0;--nylas-color-green-50:#d1f3f0;--nylas-color-purple-900:#643554;--nylas-color-purple-700:#954f7d;--nylas-color-purple-500:#c769a7;--nylas-color-purple-300:#dda5ca;--nylas-color-purple-100:#e0bdd6;--nylas-color-purple-50:#e9dde5;--nylas-color-sky-900:#20698f;--nylas-color-sky-700:#2b8fc2;--nylas-color-sky-500:#6dceff;--nylas-color-sky-300:#8fdaff;--nylas-color-sky-100:#b8e7ff;--nylas-color-sky-50:#d9f2ff;width:inherit}div.nylas-event-timeslot label{display:flex;align-items:center;color:var(--nylas-base-800);font-size:16px;font-style:normal;font-weight:400;line-height:150%}div.nylas-event-timeslot div.date-time-input div.date-time-picker{display:flex;gap:32px}@media screen and (max-width: 768px){div.nylas-event-timeslot div.date-time-input div.date-time-picker{flex-direction:column;gap:16px}}div.nylas-event-timeslot div.date-time-input div.date-time-picker nylas-date-component{width:224px}@media screen and (max-width: 768px){div.nylas-event-timeslot div.date-time-input div.date-time-picker nylas-date-component{width:100%}}div.nylas-event-timeslot div.date-time-input div.date-time-picker nylas-date-component::part(ic__date){height:50px;border-color:var(--nylas-base-200)}div.nylas-event-timeslot div.date-time-input div.date-time-picker div.time-range{display:flex;gap:8px;align-items:flex-start}div.nylas-event-timeslot div.date-time-input div.date-time-picker div.time-range span{margin:12px 0 0 6px;display:inline-flex;align-items:flex-start}@media screen and (max-width: 768px){div.nylas-event-timeslot div.date-time-input div.date-time-picker div.time-range{display:grid;grid-template-columns:1fr 20px 1fr}div.nylas-event-timeslot div.date-time-input div.date-time-picker div.time-range nylas-time-window-picker::part(time-picker){width:-webkit-fill-available}div.nylas-event-timeslot div.date-time-input div.date-time-picker div.time-range nylas-time-window-picker::part(time-input){width:calc(100% - 8px)}}div.nylas-event-timeslot div.date-time-input div.date-time-picker select-dropdown{width:fit-content}div.nylas-event-timeslot div.date-time-input div.date-time-picker select-dropdown::part(sd_dropdown){position:relative}div.nylas-event-timeslot div.date-time-input div.date-time-picker select-dropdown::part(sd_dropdown-button){border:none;padding:14px;justify-content:flex-start}div.nylas-event-timeslot div.date-time-input div.date-time-picker select-dropdown::part(sd_dropdown-button):hover{border:none;outline:none;color:var(--nylas-primary)}@media screen and (max-width: 768px){div.nylas-event-timeslot div.date-time-input div.date-time-picker select-dropdown{width:-webkit-fill-available}div.nylas-event-timeslot div.date-time-input div.date-time-picker select-dropdown::part(sd_dropdown-button-selected-label){max-width:fit-content}div.nylas-event-timeslot div.date-time-input div.date-time-picker select-dropdown::part(sd_dropdown-content){right:unset;width:unset}}div.nylas-event-timeslot div.date-time-input div.recurrence-options{margin:8px 0}div.nylas-event-timeslot div.date-time-input div.recurrence-options select-dropdown::part(sd_dropdown){position:relative}div.nylas-event-timeslot div.date-time-input div.recurrence-options select-dropdown::part(sd_dropdown-button){width:fit-content;padding:14px;border-color:var(--nylas-base-200)}div.nylas-event-timeslot div.date-time-input div.recurrence-options select-dropdown::part(sd_dropdown-button):hover{color:var(--nylas-primary)}div.nylas-event-timeslot div.date-time-input div.recurrence-options select-dropdown::part(sd_dropdown-content){width:fit-content}div.nylas-event-timeslot div.date-time-input div.recurrence-options select-dropdown::part(sd_dropdown-button-selected-label){max-width:100%;width:fit-content;font-size:16px}@media screen and (max-width: 768px){div.nylas-event-timeslot div.date-time-input div.recurrence-options select-dropdown{width:-webkit-fill-available}div.nylas-event-timeslot div.date-time-input div.recurrence-options select-dropdown::part(sd_dropdown-button-selected-label){max-width:254px;width:fit-content}div.nylas-event-timeslot div.date-time-input div.recurrence-options select-dropdown::part(sd_dropdown-content){right:unset;width:unset}}@media screen and (max-width: 412px){div.nylas-event-timeslot div.date-time-input div.recurrence-options select-dropdown::part(sd_dropdown-button-selected-label){max-width:240px}}div.nylas-event-timeslot div.date-time-input div.recurrence-options div.custom-recurrence-time-period,div.nylas-event-timeslot div.date-time-input div.recurrence-options div.recurrence-type,div.nylas-event-timeslot div.date-time-input div.recurrence-options div.recurrence-end{display:grid;align-items:center;gap:16px;grid-template-columns:128px 1fr;margin-bottom:8px}div.nylas-event-timeslot div.date-time-input div.recurrence-options div.custom-recurrence-time-period select-dropdown::part(sd_dropdown-button),div.nylas-event-timeslot div.date-time-input div.recurrence-options div.recurrence-type select-dropdown::part(sd_dropdown-button),div.nylas-event-timeslot div.date-time-input div.recurrence-options div.recurrence-end select-dropdown::part(sd_dropdown-button){border-color:var(--nylas-base-200)}@media screen and (max-width: 768px){div.nylas-event-timeslot div.date-time-input div.recurrence-options div.custom-recurrence-time-period,div.nylas-event-timeslot div.date-time-input div.recurrence-options div.recurrence-type,div.nylas-event-timeslot div.date-time-input div.recurrence-options div.recurrence-end{grid-template-columns:1fr;gap:4px;margin:16px 0}}div.nylas-event-timeslot div.date-time-input div.recurrence-options div.custom-recurrence-time-period time-period-selector::part(id_dropdown-input),div.nylas-event-timeslot div.date-time-input div.recurrence-options div.recurrence-type time-period-selector::part(id_dropdown-input),div.nylas-event-timeslot div.date-time-input div.recurrence-options div.recurrence-end time-period-selector::part(id_dropdown-input){padding:16px}div.nylas-event-timeslot div.date-time-input div.recurrence-options div.custom-recurrence-time-period time-period-selector input-dropdown:hover,div.nylas-event-timeslot div.date-time-input div.recurrence-options div.recurrence-type time-period-selector input-dropdown:hover,div.nylas-event-timeslot div.date-time-input div.recurrence-options div.recurrence-end time-period-selector input-dropdown:hover{border:1px solid var(--nylas-primary);outline:1px solid transparent}div.nylas-event-timeslot div.date-time-input div.recurrence-options div.repeat-on div.days{margin:16px 0;display:flex;gap:16px;align-items:center}div.nylas-event-timeslot div.date-time-input div.recurrence-options div.repeat-on div.days div.buttons{display:flex;gap:8px;margin:8px 0}div.nylas-event-timeslot div.date-time-input div.recurrence-options div.repeat-on div.days div.buttons button{border-radius:50%;border:none;height:24px;width:24px;color:var(--nylas-base-800);cursor:pointer}div.nylas-event-timeslot div.date-time-input div.recurrence-options div.repeat-on div.days div.buttons button.selected{background-color:var(--nylas-primary);color:var(--nylas-base-0)}div.nylas-event-timeslot div.date-time-input div.recurrence-options div.repeat-on div.days div.buttons button:hover{background-color:var(--nylas-base-500);color:var(--nylas-base-0)}div.nylas-event-timeslot div.date-time-input div.recurrence-options div.repeat-on div.days div.buttons button:active{background-color:var(--nylas-base-600);color:var(--nylas-base-0)}div.nylas-event-timeslot div.date-time-input div.recurrence-options div.repeat-on div.days,div.nylas-event-timeslot div.date-time-input div.recurrence-options div.repeat-on div.custom-recurrence-ends,div.nylas-event-timeslot div.date-time-input div.recurrence-options div.repeat-on div.month-recurrence{display:grid;align-items:center;gap:16px;grid-template-columns:128px 1fr}@media screen and (max-width: 768px){div.nylas-event-timeslot div.date-time-input div.recurrence-options div.repeat-on div.days,div.nylas-event-timeslot div.date-time-input div.recurrence-options div.repeat-on div.custom-recurrence-ends,div.nylas-event-timeslot div.date-time-input div.recurrence-options div.repeat-on div.month-recurrence{grid-template-columns:1fr;gap:4px;margin:16px 0}}div.nylas-event-timeslot div.date-time-input div.recurrence-options div.repeat-on div.custom-recurrence{display:flex;gap:16px;align-items:center}@media screen and (max-width: 768px){div.nylas-event-timeslot div.date-time-input div.recurrence-options div.repeat-on div.custom-recurrence{flex-direction:column;align-items:flex-start;gap:0}}div.nylas-event-timeslot div.date-time-input div.recurrence-options div.repeat-on div.custom-recurrence div.custom-recurrence-end-after{display:flex;gap:8px;align-items:center}@media screen and (max-width: 768px){div.nylas-event-timeslot div.date-time-input div.recurrence-options div.repeat-on div.custom-recurrence div.custom-recurrence-end-after{flex-direction:column;align-items:flex-start}}div.nylas-event-timeslot div.date-time-input div.recurrence-options div.repeat-on div.custom-recurrence nylas-date-component::part(ic__date){padding:0 16px;height:52px;border:1px solid var(--nylas-base-200)}";
+const nylasEventTimeslotCss = ":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-color-blue-100:#e0e6f9;--nylas-border-radius:0.25rem;--nylas-border-radius-2x:0.5rem;--nylas-border-radius-3x:0.75rem;--nylas-font-family:\"Inter\", sans-serif;--nylas-color-black:#000000;--nylas-color-grey-900:#2c2c2c;--nylas-color-grey-800:#4b4b4b;--nylas-color-grey-700:#6e6e6e;--nylas-color-grey-600:#8e8e8e;--nylas-color-grey-500:#b3b3b3;--nylas-color-grey-400:#cacaca;--nylas-color-grey-300:#e1e1e1;--nylas-color-grey-200:#eaeaea;--nylas-color-grey-100:#f5f5f5;--nylas-color-grey-50:#fbfcfe;--nylas-color-white:#ffffff;--nylas-color-red-900:#992222;--nylas-color-red-700:#cc4841;--nylas-color-red-500:#ff786a;--nylas-color-red-300:#ffa79e;--nylas-color-red-100:#ffc5bf;--nylas-color-red-50:#ffeae8;--nylas-color-blue-900:#213571;--nylas-color-blue-700:#314fa9;--nylas-color-blue-500:#4169e1;--nylas-color-blue-300:#bdccf9;--nylas-color-blue-100:#e0e6f9;--nylas-color-blue-50:#f6f8fd;--nylas-color-yellow-900:#7c6506;--nylas-color-yellow-700:#c29f09;--nylas-color-yellow-500:#f7c90b;--nylas-color-yellow-300:#f9de70;--nylas-color-yellow-100:#fceba9;--nylas-color-yellow-50:#fdf4ce;--nylas-color-green-900:#0e6b60;--nylas-color-green-700:#16a392;--nylas-color-green-500:#17c3b2;--nylas-color-green-300:#74dbd1;--nylas-color-green-100:#a2e7e0;--nylas-color-green-50:#d1f3f0;--nylas-color-purple-900:#643554;--nylas-color-purple-700:#954f7d;--nylas-color-purple-500:#c769a7;--nylas-color-purple-300:#dda5ca;--nylas-color-purple-100:#e0bdd6;--nylas-color-purple-50:#e9dde5;--nylas-color-sky-900:#20698f;--nylas-color-sky-700:#2b8fc2;--nylas-color-sky-500:#6dceff;--nylas-color-sky-300:#8fdaff;--nylas-color-sky-100:#b8e7ff;--nylas-color-sky-50:#d9f2ff;width:inherit}div.nylas-event-timeslot label{display:flex;align-items:center;color:var(--nylas-base-800);font-size:16px;font-style:normal;font-weight:400;line-height:150%}div.nylas-event-timeslot div.date-time-input div.date-time-picker{display:flex;gap:32px}@media screen and (max-width: 768px){div.nylas-event-timeslot div.date-time-input div.date-time-picker{flex-direction:column;gap:16px}}div.nylas-event-timeslot div.date-time-input div.date-time-picker nylas-date-component{width:224px}@media screen and (max-width: 768px){div.nylas-event-timeslot div.date-time-input div.date-time-picker nylas-date-component{width:100%}}div.nylas-event-timeslot div.date-time-input div.date-time-picker nylas-date-component::part(ic__date){height:50px;border-color:var(--nylas-base-200)}div.nylas-event-timeslot div.date-time-input div.date-time-picker div.time-range{display:flex;gap:8px;align-items:flex-start}div.nylas-event-timeslot div.date-time-input div.date-time-picker div.time-range span{margin:12px 0 0 6px;display:inline-flex;align-items:flex-start}@media screen and (max-width: 768px){div.nylas-event-timeslot div.date-time-input div.date-time-picker div.time-range{display:grid;grid-template-columns:1fr 20px 1fr}div.nylas-event-timeslot div.date-time-input div.date-time-picker div.time-range nylas-time-window-picker::part(time-picker){width:-webkit-fill-available}div.nylas-event-timeslot div.date-time-input div.date-time-picker div.time-range nylas-time-window-picker::part(time-input){width:calc(100% - 8px)}}div.nylas-event-timeslot div.date-time-input div.date-time-picker select-dropdown{width:fit-content}div.nylas-event-timeslot div.date-time-input div.date-time-picker select-dropdown::part(sd_dropdown){position:relative}div.nylas-event-timeslot div.date-time-input div.date-time-picker select-dropdown::part(sd_dropdown-button){border:none;padding:14px;justify-content:flex-start}div.nylas-event-timeslot div.date-time-input div.date-time-picker select-dropdown::part(sd_dropdown-button):hover{border:none;outline:none;color:var(--nylas-primary)}@media screen and (max-width: 768px){div.nylas-event-timeslot div.date-time-input div.date-time-picker select-dropdown{width:-webkit-fill-available}div.nylas-event-timeslot div.date-time-input div.date-time-picker select-dropdown::part(sd_dropdown-button-selected-label){max-width:fit-content}div.nylas-event-timeslot div.date-time-input div.date-time-picker select-dropdown::part(sd_dropdown-content){right:unset;width:unset}}div.nylas-event-timeslot div.date-time-input div.recurrence-options{margin:8px 0}div.nylas-event-timeslot div.date-time-input div.recurrence-options select-dropdown::part(sd_dropdown){position:relative}div.nylas-event-timeslot div.date-time-input div.recurrence-options select-dropdown::part(sd_dropdown-button){width:fit-content;padding:14px;border-color:var(--nylas-base-200)}div.nylas-event-timeslot div.date-time-input div.recurrence-options select-dropdown::part(sd_dropdown-button):hover{color:var(--nylas-primary)}div.nylas-event-timeslot div.date-time-input div.recurrence-options select-dropdown::part(sd_dropdown-content){width:fit-content}div.nylas-event-timeslot div.date-time-input div.recurrence-options select-dropdown::part(sd_dropdown-button-selected-label){max-width:100%;width:fit-content;font-size:16px}@media screen and (max-width: 768px){div.nylas-event-timeslot div.date-time-input div.recurrence-options select-dropdown{width:-webkit-fill-available}div.nylas-event-timeslot div.date-time-input div.recurrence-options select-dropdown::part(sd_dropdown-button-selected-label){max-width:254px;width:fit-content}div.nylas-event-timeslot div.date-time-input div.recurrence-options select-dropdown::part(sd_dropdown-content){right:unset;width:unset}}@media screen and (max-width: 412px){div.nylas-event-timeslot div.date-time-input div.recurrence-options select-dropdown::part(sd_dropdown-button-selected-label){max-width:240px}}div.nylas-event-timeslot div.date-time-input div.recurrence-options div.custom-recurrence-time-period,div.nylas-event-timeslot div.date-time-input div.recurrence-options div.recurrence-type,div.nylas-event-timeslot div.date-time-input div.recurrence-options div.recurrence-end{display:grid;align-items:center;gap:16px;grid-template-columns:128px 1fr;margin-bottom:8px}div.nylas-event-timeslot div.date-time-input div.recurrence-options div.custom-recurrence-time-period select-dropdown::part(sd_dropdown-button),div.nylas-event-timeslot div.date-time-input div.recurrence-options div.recurrence-type select-dropdown::part(sd_dropdown-button),div.nylas-event-timeslot div.date-time-input div.recurrence-options div.recurrence-end select-dropdown::part(sd_dropdown-button){border-color:var(--nylas-base-200)}@media screen and (max-width: 768px){div.nylas-event-timeslot div.date-time-input div.recurrence-options div.custom-recurrence-time-period,div.nylas-event-timeslot div.date-time-input div.recurrence-options div.recurrence-type,div.nylas-event-timeslot div.date-time-input div.recurrence-options div.recurrence-end{grid-template-columns:1fr;gap:4px;margin:16px 0}}div.nylas-event-timeslot div.date-time-input div.recurrence-options div.custom-recurrence-time-period time-period-selector::part(id_dropdown-input),div.nylas-event-timeslot div.date-time-input div.recurrence-options div.recurrence-type time-period-selector::part(id_dropdown-input),div.nylas-event-timeslot div.date-time-input div.recurrence-options div.recurrence-end time-period-selector::part(id_dropdown-input){padding:16px}div.nylas-event-timeslot div.date-time-input div.recurrence-options div.custom-recurrence-time-period time-period-selector input-dropdown:hover,div.nylas-event-timeslot div.date-time-input div.recurrence-options div.recurrence-type time-period-selector input-dropdown:hover,div.nylas-event-timeslot div.date-time-input div.recurrence-options div.recurrence-end time-period-selector input-dropdown:hover{border:1px solid var(--nylas-primary);outline:1px solid transparent}div.nylas-event-timeslot div.date-time-input div.recurrence-options div.repeat-on div.days{margin:16px 0;display:flex;gap:16px;align-items:center}div.nylas-event-timeslot div.date-time-input div.recurrence-options div.repeat-on div.days div.buttons{display:flex;gap:8px;margin:8px 0}div.nylas-event-timeslot div.date-time-input div.recurrence-options div.repeat-on div.days div.buttons button{border-radius:50%;border:none;height:24px;width:24px;color:var(--nylas-base-800);cursor:pointer}div.nylas-event-timeslot div.date-time-input div.recurrence-options div.repeat-on div.days div.buttons button.selected{background-color:var(--nylas-primary);color:var(--nylas-base-0)}div.nylas-event-timeslot div.date-time-input div.recurrence-options div.repeat-on div.days div.buttons button:hover{background-color:var(--nylas-base-500);color:var(--nylas-base-0)}div.nylas-event-timeslot div.date-time-input div.recurrence-options div.repeat-on div.days div.buttons button:active{background-color:var(--nylas-base-600);color:var(--nylas-base-0)}div.nylas-event-timeslot div.date-time-input div.recurrence-options div.repeat-on div.days,div.nylas-event-timeslot div.date-time-input div.recurrence-options div.repeat-on div.custom-recurrence-ends,div.nylas-event-timeslot div.date-time-input div.recurrence-options div.repeat-on div.month-recurrence{display:grid;align-items:center;gap:16px;grid-template-columns:128px 1fr}@media screen and (max-width: 768px){div.nylas-event-timeslot div.date-time-input div.recurrence-options div.repeat-on div.days,div.nylas-event-timeslot div.date-time-input div.recurrence-options div.repeat-on div.custom-recurrence-ends,div.nylas-event-timeslot div.date-time-input div.recurrence-options div.repeat-on div.month-recurrence{grid-template-columns:1fr;gap:4px;margin:16px 0}}div.nylas-event-timeslot div.date-time-input div.recurrence-options div.repeat-on div.custom-recurrence{display:flex;gap:16px;align-items:baseline}@media screen and (max-width: 768px){div.nylas-event-timeslot div.date-time-input div.recurrence-options div.repeat-on div.custom-recurrence{flex-direction:column;align-items:flex-start;gap:0}}div.nylas-event-timeslot div.date-time-input div.recurrence-options div.repeat-on div.custom-recurrence div.custom-recurrence-end-after{display:flex;gap:8px;align-items:center}@media screen and (max-width: 768px){div.nylas-event-timeslot div.date-time-input div.recurrence-options div.repeat-on div.custom-recurrence div.custom-recurrence-end-after{flex-direction:column;align-items:flex-start}}div.nylas-event-timeslot div.date-time-input div.recurrence-options div.repeat-on div.custom-recurrence nylas-date-component::part(ic__date){padding:0 16px;height:52px;border:1px solid var(--nylas-base-200)}";
 const NylasEventTimeslotStyle0 = nylasEventTimeslotCss;
 
 var __decorate = (undefined && undefined.__decorate) || function (decorators, target, key, desc) {
@@ -14365,7 +14386,15 @@ const NylasEventTimeslot = class {
             this.repeatEndOn = value;
         }
         else if (name === 'recurrence-end-after') {
-            this.repeatEndAfter = parseInt(value);
+            const parsedValue = parseInt(value);
+            if (parsedValue < 1 || isNaN(parsedValue)) {
+                this.timeWindowFormError.emit({
+                    key: this.name,
+                    message: instance.t('fixFormErrors'),
+                });
+                return;
+            }
+            this.repeatEndAfter = parsedValue;
         }
         this.handleValueChanged();
     }
@@ -14395,12 +14424,12 @@ const NylasEventTimeslot = class {
         const defaultEndAfter = this.repeatEveryFrequency === 'week' ? 4 : this.repeatEveryFrequency === 'month' ? 12 : 5;
         this.repeatEndOn = this.repeatEndOn || defaultEndOnDate;
         this.repeatEndAfter = this.repeatEndAfter || defaultEndAfter;
-        return (h$1(Host, { key: '31732a2c9daed8e38e9481d545a43d2093ebf9ae' }, h$1("div", { key: '122e6f86aa037d3ca33333a48ee01b56a658b9be', class: "nylas-event-timeslot", part: "netimeslot" }, h$1("label", { key: '6a5e350091395c992a4412b0bbf85847cff9e2aa', htmlFor: "date-time-input" }, instance.t('nylasEventTimeslot.dateTimeLabel')), h$1("div", { key: 'fde21f23f6e3767f90ef7bfe8ef87fdc2880d53a', class: "date-time-input", part: "netimeslot__date-time-input" }, h$1("div", { key: '51ff603b675b0fca1e265ddb7cbba058e02b2412', class: "date-time-picker", part: "netimeslot__date-time-picker" }, h$1("nylas-date-component", { key: 'aaf0a665c49243dc3ea62338b83a54a1ff44922f', name: "date-time-input", defaultValue: this.selectedDate, id: 'date-time-input', required: true }), h$1("div", { key: '982c20021cf979720d71e19210b7aced7b3d8a32', class: "time-range", part: "netimeslot__time-range" }, h$1("nylas-time-window-picker", { id: 'start-time', hasError: this.timeRangeError, time: this.selectedStartTime, language: this.selectedLanguage, name: 'start-time', key: 'start-time', exportparts: "time-picker: nap__time-picker-container, time-input: nap__time-picker-input, times: nap__time-picker-times" }), h$1("span", { key: '00a6b1961ffc500814b00da0a63fe52eb4982cb1' }, "\u2013"), h$1("nylas-time-window-picker", { id: 'end-time', hasError: this.timeRangeError, time: this.selectedEndTime, language: this.selectedLanguage, name: 'end-time', key: 'end-time', minimumStartTime: this.selectedStartTime, exportparts: "time-picker: nap__time-picker-container, time-input: nap__time-picker-input, times: nap__time-picker-times" })), selectedTimezoneOption?.label && (h$1("select-dropdown", { name: "timezone", exportparts: "sd_dropdown: nap__timezone-container, sd_dropdown-button: nap__timezone-button, sd_dropdown-content: nap__timezone-dropdown-content", options: timezoneOptions, withChevron: false, defaultSelectedOption: selectedTimezoneOption }, h$1("span", { slot: "select-icon" }, h$1("globe-icon", { width: "20", height: "20" }))))), h$1("div", { key: '69ecad9a4f597e8e8be1c7467ff66f24411a6638', class: "recurrence-options", part: "netimeslot__recurrence-options" }, defaultRecurrenceOption && defaultRecurrenceOption?.label && (h$1("div", { class: "recurrence-type", part: "netimeslot__recurrence-type" }, h$1("label", { htmlFor: "recurrence-type" }, instance.t('nylasEventTimeslot.recurrenceLabel')), h$1("select-dropdown", { withSearch: false, id: "recurrence-type", name: "recurrence-type", options: this.recurrenceOptions, defaultSelectedOption: defaultRecurrenceOption, exportparts: "sd_dropdown: netimeslot__dropdown, sd_dropdown-button: netimeslot__dropdown-button, sd_dropdown-content: netimeslot__dropdown-content" }))), this.selectedRecurrenceType !== 'custom' && this.selectedRecurrenceType !== 'none' && (h$1("div", { class: "recurrence-end", part: "netimeslot__recurrence-end" }, h$1("label", null, instance.t('nylasEventTimeslot.endDate')), h$1("nylas-date-component", { name: "recurrence-end-date", defaultValue: this.repeatEndOn || defaultEndOnDate, id: 'recurrence-end-date', required: true }))), this.selectedRecurrenceType === 'custom' && (h$1("div", { class: "custom-recurrence-time-period", part: "netimeslot__custom-recurrence" }, h$1("label", { htmlFor: "" }, instance.t('nylasEventTimeslot.customRecurrence.repeatEvery')), h$1("time-period-selector", { id: "custom-recurrence-time-period", exportparts: "tps__number-dropdown: netimeslot__number-dropdown, tps__number-dropdown-button: netimeslot__number-dropdown-button, tps__number-dropdown-content: netimeslot__number-dropdown-content, tps__period-dropdown: netimeslot__period-dropdown, tps__period-dropdown-button: netimeslot__period-dropdown-button, tps__period-dropdown-content: netimeslot__period-dropdown-content", timePeriods: [
+        return (h$1(Host, { key: 'a6c2b24369ec32b3488fb597ceb07265f8025b38' }, h$1("div", { key: '5412e2af0d10c1a232fa61b9ba3d9a327a631f20', class: "nylas-event-timeslot", part: "netimeslot" }, h$1("label", { key: '5054d504ca18771fb990374ce1859573227661a9', htmlFor: "date-time-input" }, instance.t('nylasEventTimeslot.dateTimeLabel')), h$1("div", { key: '0dffbcf300744ef1c9ca74c73b3bd87bb0896711', class: "date-time-input", part: "netimeslot__date-time-input" }, h$1("div", { key: 'd2c73a9cbe77d5a4c65087f4707b0f08c1b404e9', class: "date-time-picker", part: "netimeslot__date-time-picker" }, h$1("nylas-date-component", { key: '2955d08462d7e4e81079083349b8ce8cc07b1c1a', name: "date-time-input", defaultValue: this.selectedDate, id: 'date-time-input', required: true }), h$1("div", { key: 'edaab3f01999687c94b0b8a386fe863f211a4ced', class: "time-range", part: "netimeslot__time-range" }, h$1("nylas-time-window-picker", { id: 'start-time', hasError: this.timeRangeError, time: this.selectedStartTime, language: this.selectedLanguage, name: 'start-time', key: 'start-time', exportparts: "time-picker: nap__time-picker-container, time-input: nap__time-picker-input, times: nap__time-picker-times" }), h$1("span", { key: '72f7f70ecef78afc7a5a426da2548cc4af12d139' }, "\u2013"), h$1("nylas-time-window-picker", { id: 'end-time', hasError: this.timeRangeError, time: this.selectedEndTime, language: this.selectedLanguage, name: 'end-time', key: 'end-time', minimumStartTime: this.selectedStartTime, exportparts: "time-picker: nap__time-picker-container, time-input: nap__time-picker-input, times: nap__time-picker-times" })), selectedTimezoneOption?.label && (h$1("select-dropdown", { name: "timezone", exportparts: "sd_dropdown: nap__timezone-container, sd_dropdown-button: nap__timezone-button, sd_dropdown-content: nap__timezone-dropdown-content", options: timezoneOptions, withChevron: false, defaultSelectedOption: selectedTimezoneOption }, h$1("span", { slot: "select-icon" }, h$1("globe-icon", { width: "20", height: "20" }))))), h$1("div", { key: '69743f032d1c090e65bd6b65cca97154972a7e98', class: "recurrence-options", part: "netimeslot__recurrence-options" }, defaultRecurrenceOption && defaultRecurrenceOption?.label && (h$1("div", { class: "recurrence-type", part: "netimeslot__recurrence-type" }, h$1("label", { htmlFor: "recurrence-type" }, instance.t('nylasEventTimeslot.recurrenceLabel')), h$1("select-dropdown", { withSearch: false, id: "recurrence-type", name: "recurrence-type", options: this.recurrenceOptions, defaultSelectedOption: defaultRecurrenceOption, exportparts: "sd_dropdown: netimeslot__dropdown, sd_dropdown-button: netimeslot__dropdown-button, sd_dropdown-content: netimeslot__dropdown-content" }))), this.selectedRecurrenceType !== 'custom' && this.selectedRecurrenceType !== 'none' && (h$1("div", { class: "recurrence-end", part: "netimeslot__recurrence-end" }, h$1("label", null, instance.t('nylasEventTimeslot.endDate')), h$1("nylas-date-component", { name: "recurrence-end-date", defaultValue: this.repeatEndOn || defaultEndOnDate, id: 'recurrence-end-date', required: true }))), this.selectedRecurrenceType === 'custom' && (h$1("div", { class: "custom-recurrence-time-period", part: "netimeslot__custom-recurrence" }, h$1("label", { htmlFor: "" }, instance.t('nylasEventTimeslot.customRecurrence.repeatEvery')), h$1("time-period-selector", { id: "custom-recurrence-time-period", exportparts: "tps__number-dropdown: netimeslot__number-dropdown, tps__number-dropdown-button: netimeslot__number-dropdown-button, tps__number-dropdown-content: netimeslot__number-dropdown-content, tps__period-dropdown: netimeslot__period-dropdown, tps__period-dropdown-button: netimeslot__period-dropdown-button, tps__period-dropdown-content: netimeslot__period-dropdown-content", timePeriods: [
                 { value: 'day', label: instance.t('timePeriod', { context: 'day' }) },
                 { value: 'week', label: instance.t('timePeriod', { context: 'week' }) },
                 { value: 'month', label: instance.t('timePeriod', { context: 'month' }) },
                 { value: 'year', label: instance.t('timePeriod', { context: 'year' }) },
-            ], defaultSelectedNumber: this.repeatEveryInterval, defaultSelectedPeriod: this.repeatEveryFrequency }))), h$1("div", { key: '72e9f15924d7cd50fa1e2200cd5fecf20213fe94', class: "repeat-on" }, this.selectedRecurrenceType === 'custom' && this.repeatEveryFrequency === 'week' && (h$1("div", { class: "days" }, h$1("label", null, instance.t('nylasEventTimeslot.customRecurrence.repeatOn')), h$1("div", { class: "buttons" }, [
+            ], defaultSelectedNumber: this.repeatEveryInterval, defaultSelectedPeriod: this.repeatEveryFrequency }))), h$1("div", { key: '40ea7614b0c862be4adfdf798db12b52277ff6a6', class: "repeat-on" }, this.selectedRecurrenceType === 'custom' && this.repeatEveryFrequency === 'week' && (h$1("div", { class: "days" }, h$1("label", null, instance.t('nylasEventTimeslot.customRecurrence.repeatOn')), h$1("div", { class: "buttons" }, [
             { label: 'S', value: 'SU', title: 'Sunday' },
             { label: 'M', value: 'MO', title: 'Monday' },
             { label: 'T', value: 'TU', title: 'Tuesday' },
@@ -14411,7 +14440,7 @@ const NylasEventTimeslot = class {
         ].map(day => (h$1("button", { class: { selected: this.repeatOnDays.includes(day.value) }, title: day.title, onClick: () => {
                 this.repeatOnDays = this.repeatOnDays.includes(day.value) ? this.repeatOnDays.filter(d => d !== day.value) : [...this.repeatOnDays, day.value];
                 this.handleValueChanged();
-            } }, day.label)))))), this.selectedRecurrenceType === 'custom' && this.repeatEveryFrequency === 'month' && (h$1("div", { class: "month-recurrence" }, h$1("span", null), h$1("select-dropdown", { withSearch: false, id: "month-recurrence-type", name: "month-recurrence-type", options: this.monthRecurrenceOptions, defaultSelectedOption: this.repeatMonthlySameDate ? this.monthRecurrenceOptions[0] : this.monthRecurrenceOptions[1], exportparts: "sd_dropdown: netimeslot__dropdown, sd_dropdown-button: netimeslot__dropdown-button, sd_dropdown-content: netimeslot__dropdown-content" }))), h$1("div", { key: '24efc522c8eb8ce3fafeb8964da717228602c14a', class: "custom-recurrence" }, this.selectedRecurrenceType === 'custom' && (h$1("div", { class: "custom-recurrence-ends" }, h$1("label", { htmlFor: "recurrence-type" }, instance.t('nylasEventTimeslot.customRecurrence.ends')), h$1("select-dropdown", { withSearch: false, id: "custom-recurrence-end-type", name: "custom-recurrence-end-type", options: endOptions, defaultSelectedOption: endOptions.find(option => option.value === this.repeatEndType), exportparts: "sd_dropdown: netimeslot__dropdown, sd_dropdown-button: netimeslot__dropdown-button, sd_dropdown-content: netimeslot__dropdown-content" }))), this.selectedRecurrenceType === 'custom' && this.repeatEndType === 'on' && (h$1("div", null, h$1("nylas-date-component", { name: "custom-recurrence-end-date", defaultValue: this.repeatEndOn || defaultEndOnDate, id: 'custom-recurrence-end-date', required: true }))), this.selectedRecurrenceType === 'custom' && this.repeatEndType === 'after' && (h$1("div", { class: "custom-recurrence-end-after" }, h$1("input-component", { name: "recurrence-end-after", id: "recurrence-end-after", type: "number", minValue: 1, defaultValue: defaultEndAfter.toString(), exportparts: "ic_input: netimeslot__input-textfield" }), h$1("span", null, instance.t('nylasEventTimeslot.customRecurrence.occurrences')))))))))));
+            } }, day.label)))))), this.selectedRecurrenceType === 'custom' && this.repeatEveryFrequency === 'month' && (h$1("div", { class: "month-recurrence" }, h$1("span", null), h$1("select-dropdown", { withSearch: false, id: "month-recurrence-type", name: "month-recurrence-type", options: this.monthRecurrenceOptions, defaultSelectedOption: this.repeatMonthlySameDate ? this.monthRecurrenceOptions[0] : this.monthRecurrenceOptions[1], exportparts: "sd_dropdown: netimeslot__dropdown, sd_dropdown-button: netimeslot__dropdown-button, sd_dropdown-content: netimeslot__dropdown-content" }))), h$1("div", { key: '5a873ef2a8f3c02856f18fbd99c7092a6c91bd9b', class: "custom-recurrence" }, this.selectedRecurrenceType === 'custom' && (h$1("div", { class: "custom-recurrence-ends" }, h$1("label", { htmlFor: "recurrence-type" }, instance.t('nylasEventTimeslot.customRecurrence.ends')), h$1("select-dropdown", { withSearch: false, id: "custom-recurrence-end-type", name: "custom-recurrence-end-type", options: endOptions, defaultSelectedOption: endOptions.find(option => option.value === this.repeatEndType), exportparts: "sd_dropdown: netimeslot__dropdown, sd_dropdown-button: netimeslot__dropdown-button, sd_dropdown-content: netimeslot__dropdown-content" }))), this.selectedRecurrenceType === 'custom' && this.repeatEndType === 'on' && (h$1("div", null, h$1("nylas-date-component", { name: "custom-recurrence-end-date", defaultValue: this.repeatEndOn || defaultEndOnDate, id: 'custom-recurrence-end-date', required: true }))), this.selectedRecurrenceType === 'custom' && this.repeatEndType === 'after' && (h$1("div", { class: "custom-recurrence-end-after" }, h$1("input-component", { name: "recurrence-end-after", id: "recurrence-end-after", type: "number", minValue: 1, defaultValue: defaultEndAfter.toString(), exportparts: "ic_input: netimeslot__input-textfield" }), h$1("span", null, instance.t('nylasEventTimeslot.customRecurrence.occurrences')))))))))));
     }
     static get formAssociated() { return true; }
     get host() { return getElement(this); }