@nylas/web-elements 0.0.0-test-20250319204140 → 0.0.0-test-20250320184617

package/dist/cdn/nylas-scheduler-editor/nylas-scheduler-editor.es.js

@@ -20620,7 +20620,7 @@ const buttonComponentCss = "button.sc-button-component{display:flex;align-items:
   }
   render() {
     const ue = `button-${this.variant}` + (this.disabled ? " disabled" : "");
-    return h$3("button", { key: "f7ab1093a487b82272e55f430f12827ecefe6f79", class: ue, disabled: this.disabled, type: "type", title: this.tooltip, onClick: this.clickHandler, onMouseOver: this.mouseOverHandler, onMouseOut: this.mouseOutHandler, onFocus: this.focusHandler, onBlur: this.blurHandler }, !!this.isLoading && h$3("loading-icon", { slot: "icon" }), h$3("slot", { key: "54acbf084444ac5c115b3dab60acb43a8a391ebd" }));
+    return h$3("button", { key: "0d4e2bd6da64d91dc45672f11baf5ab9e2952788", class: ue, disabled: this.disabled, type: "type", title: this.tooltip, onClick: this.clickHandler, onMouseOver: this.mouseOverHandler, onMouseOut: this.mouseOutHandler, onFocus: this.focusHandler, onBlur: this.blurHandler }, !!this.isLoading && h$3("loading-icon", { slot: "icon" }), h$3("slot", { key: "f92c1e76e0bd689686f269411bae2762c57028ac" }));
   }
   static get style() {
     return ButtonComponentStyle0;
@@ -21542,7 +21542,7 @@ const inputDropdownCss = ':host{display:block;position:relative;--nylas-primary:
     !ue.composedPath().includes(this.el) && this.isOpen && (this.isOpen = !1);
   }
   render() {
-    return h$3("div", { key: "806fa6a509d7a7c78bf6ee1de1dd4cd7a755bab4", class: "dropdown", part: "id_dropdown" }, h$3("input", { key: "b594d3517fba52cb85e95220c6d415d672c26a71", type: "text", name: this.name, id: this.name, part: "id_dropdown-input", class: { dropbtn: !0, open: this.isOpen }, value: this.inputValue, onClick: (ue) => {
+    return h$3("div", { key: "b5f8adbd8c32d84c7036ee60e8ccebbb4e93cd95", class: "dropdown", part: "id_dropdown" }, h$3("input", { key: "648b04531c8d403b972b439943482758ca961a83", type: "text", name: this.name, id: this.name, part: "id_dropdown-input", class: { dropbtn: !0, open: this.isOpen }, value: this.inputValue, onClick: (ue) => {
       this.toggleDropdown(), this.shouldAutoScroll = !0, this.handleClick(ue);
     }, "aria-haspopup": "listbox", "aria-label": this.name, "aria-expanded": this.isOpen ? "true" : "false", onKeyDown: (ue) => this.handleComboboxKeyDown(ue), onInput: (ue) => this.handleOnInput(ue) }), this.isOpen ? h$3("div", { class: "dropdown-content", part: "id_dropdown-content", ref: (ue) => this.optionsRef = ue }, h$3("ul", { tabindex: "-1", role: "listbox", "aria-label": this.name, "aria-activedescendant": this.ariaActivedescendant, onKeyDown: (ue) => this.handleListboxKeydown(ue) }, this.filteredOptions.map((ue) => h$3("li", { tabindex: "0", key: ue.value, id: ue.value, onClick: () => this.selectOption(ue), role: "option", class: {
       focused: this.ariaActivedescendant === ue.value.toString()
@@ -22015,7 +22015,7 @@ const multiSelectDropdownCss = ':host{display:block;width:inherit;--nylas-primar
   }
   render() {
     var ue, ge;
-    return h$3(Host, { key: "a87b9ea6f73e4c749c08c63c805575334076f0b1" }, h$3("div", { key: "cdbd180c5e25b70fbd9195fc8dd7dde69b8b5278", class: "dropdown", part: "msd_dropdown" }, h$3("label", { key: "009b68e781e50e69a0d4fab76c89df4b6488d688", class: "dropdown-label", part: "msd_dropdown-label" }, h$3("p", { key: "f37fb71176dd94a7612cba5b2daf72cdd5234b71" }, h$3("span", { key: "1d6e74a1d118b042d9c1f0d64684f18a4e9379bf", class: "label" }, this.label), this.required && h$3("span", { class: "required" }, "*")), h$3("slot", { key: "95bf34bb09e55dda7b5b403ffc77397613b27cad", name: "label-icon", "aria-hidden": "true" })), h$3("button", { key: "018c052fdea1f8126a97d4b4e021a50880fb6c0e", name: this.name, part: `msd_dropdown-button ${this.error ? "msd_dropdown-button--error" : ""}`, class: { dropbtn: !0, open: this.isOpen, error: !!this.error }, onClick: () => this.toggleDropdown(), disabled: this.readOnly, title: this.readOnly ? "read-only field" : void 0, "aria-haspopup": "listbox", "aria-expanded": this.isOpen ? "true" : "false", "aria-label": this.name, onKeyDown: (Oe) => this.handleSelectButtonKeyDown(Oe) }, h$3("slot", { key: "83b3c59f3433d127ed8f1c33903391767bef7323", name: "select-icon", "aria-hidden": "true" }), h$3("span", { key: "6cc8c8dbccdfd90af145ba6e89107d300965cb55", class: "selected-option", part: "msd_dropdown-button-selected-label" }, this.getSelectedOptions().length > 1 ? this.multipleOptionsSelectedLabel : ((ue = this.availableOptions.filter((Oe) => Oe.selected)[0]) == null ? void 0 : ue.label) ?? ((ge = this.availableOptions[0]) == null ? void 0 : ge.label)), h$3("span", { key: "0f373eee7859cac4f775d7749979cea148b0b143", class: this.isOpen ? "open" : "closed", "aria-hidden": "true" }, h$3("chevron-icon", { key: "308db18fdce3250ce1759e51f7ab2ead14f7b9ce", width: "16", height: "16" }))), this.error ? h$3("span", { class: "error", part: "msd_dropdown_error" }, this.error) : null, h$3("div", { key: "de81fb73c318cd9cb98e9b8f219e1240139b0708", class: "selected-options" }, this.getSelectedOptions().map((Oe) => h$3("span", { class: "selected-option" }, Oe.label, h$3("button", { disabled: this.readOnly || !!(Oe != null && Oe.disabled), key: Oe.label, onClick: () => this.selectOption(Oe) }, h$3("close-icon", null))))), this.isOpen ? h$3("div", { class: "dropdown-content", part: "msd_dropdown-content" }, h$3("ul", { tabindex: "-1", role: "listbox", "aria-label": this.name, "aria-multiselectable": !0, "aria-activedescendant": this.ariaActivedescendant, onKeyDown: (Oe) => this.handleListboxKeydown(Oe) }, this.availableOptions.map((Oe) => this.renderOption(Oe)))) : null));
+    return h$3(Host, { key: "2211f90c0f5bdcf0d27448fd9ec5568f9aec0234" }, h$3("div", { key: "9e84a7ed003e9b541a56ab1c0a7cb6d670cbfdd3", class: "dropdown", part: "msd_dropdown" }, h$3("label", { key: "fe7b821b156c9fae46422ff67b9900155a545b27", class: "dropdown-label", part: "msd_dropdown-label" }, h$3("p", { key: "266f5afa814c2da4099fff2592ee079baf8d8094" }, h$3("span", { key: "e89025d7da4c7f7368048f9729ca10064ca32e22", class: "label" }, this.label), this.required && h$3("span", { class: "required" }, "*")), h$3("slot", { key: "15916ee66e8c341e162b65cdbb53df9693371c8a", name: "label-icon", "aria-hidden": "true" })), h$3("button", { key: "7c17a76d93efa1e3a82d75722cd0a1c5758b9c32", name: this.name, part: `msd_dropdown-button ${this.error ? "msd_dropdown-button--error" : ""}`, class: { dropbtn: !0, open: this.isOpen, error: !!this.error }, onClick: () => this.toggleDropdown(), disabled: this.readOnly, title: this.readOnly ? "read-only field" : void 0, "aria-haspopup": "listbox", "aria-expanded": this.isOpen ? "true" : "false", "aria-label": this.name, onKeyDown: (Oe) => this.handleSelectButtonKeyDown(Oe) }, h$3("slot", { key: "3196cb36a75d471989f18d5de3cc689eaa7fe295", name: "select-icon", "aria-hidden": "true" }), h$3("span", { key: "c4e1531026c20573bb642f6f494b92c0545957ec", class: "selected-option", part: "msd_dropdown-button-selected-label" }, this.getSelectedOptions().length > 1 ? this.multipleOptionsSelectedLabel : ((ue = this.availableOptions.filter((Oe) => Oe.selected)[0]) == null ? void 0 : ue.label) ?? ((ge = this.availableOptions[0]) == null ? void 0 : ge.label)), h$3("span", { key: "66eaadd178beac3fefa4e261b14a71ee5ab71a95", class: this.isOpen ? "open" : "closed", "aria-hidden": "true" }, h$3("chevron-icon", { key: "ed945f49a0f99abdaf3ac5e1a4707b0a1e450c48", width: "16", height: "16" }))), this.error ? h$3("span", { class: "error", part: "msd_dropdown_error" }, this.error) : null, h$3("div", { key: "317b5f2a563b70dfc8fc3a75176f95742826236d", class: "selected-options" }, this.getSelectedOptions().map((Oe) => h$3("span", { class: "selected-option" }, Oe.label, h$3("button", { disabled: this.readOnly || !!(Oe != null && Oe.disabled), key: Oe.label, onClick: () => this.selectOption(Oe) }, h$3("close-icon", null))))), this.isOpen ? h$3("div", { class: "dropdown-content", part: "msd_dropdown-content" }, h$3("ul", { tabindex: "-1", role: "listbox", "aria-label": this.name, "aria-multiselectable": !0, "aria-activedescendant": this.ariaActivedescendant, onKeyDown: (Oe) => this.handleListboxKeydown(Oe) }, this.availableOptions.map((Oe) => this.renderOption(Oe)))) : null));
   }
   get el() {
     return this;
@@ -22804,7 +22804,7 @@ const selectDropdownCss = ':host{display:block;position:relative;--nylas-primary
   }
   render() {
     const ue = this.generateButtonText(this.selectedOption, this.dropdownButtonText);
-    return h$3("div", { key: "32b6414957374ddbd1c84c971844761accc75a20", class: "dropdown", part: "sd_dropdown" }, h$3("label", { key: "3739bab113e147e72bb8c75da3dcc4deba01c27e", part: "sd_dropdown_label", class: { error: !!this.error } }, this.label && h$3("p", null, h$3("span", { class: "label" }, this.label), this.required && h$3("span", { class: "required" }, "*")), h$3("button", { key: "2d09705cf6272559ebca0d34b7495854aeb47fb2", part: "sd_dropdown-button", class: { dropbtn: !0, open: this.isOpen, error: !!this.error }, onClick: () => this.toggleDropdown(), disabled: this.readOnly, "aria-haspopup": "listbox", title: this.readOnly ? "read-only field" : ue, "aria-expanded": this.isOpen ? "true" : "false", "aria-label": this.name, onKeyDown: (ge) => this.handleSelectButtonKeyDown(ge) }, h$3("slot", { key: "54be38a1f79be53ed5570a2d04c8c649c94b1f13", name: "select-icon", "aria-hidden": "true" }), h$3("span", { key: "4d4f57847d16b53baffdaebfa50be2072e7eb0b7", class: "selected-option", part: "sd_dropdown-button-selected-label" }, ue), this.withChevron && h$3("span", { class: {
+    return h$3("div", { key: "76f953d52f4899ece2ef69efcc79aba9b7989918", class: "dropdown", part: "sd_dropdown" }, h$3("label", { key: "5d5080ede5628e09dca5823243a20e74399ec460", part: "sd_dropdown_label", class: { error: !!this.error } }, this.label && h$3("p", null, h$3("span", { class: "label" }, this.label), this.required && h$3("span", { class: "required" }, "*")), h$3("button", { key: "0bf99a9fb258e7f2497a0b154b57f9822e202fb8", part: "sd_dropdown-button", class: { dropbtn: !0, open: this.isOpen, error: !!this.error }, onClick: () => this.toggleDropdown(), disabled: this.readOnly, "aria-haspopup": "listbox", title: this.readOnly ? "read-only field" : ue, "aria-expanded": this.isOpen ? "true" : "false", "aria-label": this.name, onKeyDown: (ge) => this.handleSelectButtonKeyDown(ge) }, h$3("slot", { key: "60a6936c37966ef724eea0382b0bef577f5a807b", name: "select-icon", "aria-hidden": "true" }), h$3("span", { key: "9917029151048ecb413cb2448fb2405d9228b1c7", class: "selected-option", part: "sd_dropdown-button-selected-label" }, ue), this.withChevron && h$3("span", { class: {
       open: this.isOpen,
       closed: !this.isOpen,
       chevron: !0
@@ -25411,10 +25411,10 @@ const NylasBufferTime = proxyCustomElement(class extends H$4 {
       const Ke = Oe * 5;
       return {
         label: Ke.toString(),
-        value: Ke
+        value: Ke.toString()
       };
     });
-    return h$3(Host, null, h$3("div", { class: "nylas-buffer-time", part: "nbt" }, h$3("div", { class: "header", part: "nbt__header" }, h$3("h3", null, instance.t("nylasBufferTime.headerTitle")), h$3("p", null, instance.t("nylasBufferTime.headerSubTitle"), h$3("tooltip-component", null, h$3("info-icon", { slot: "tooltip-icon" }), h$3("span", { slot: "tooltip-content" }, instance.t("nylasBufferTime.tooltip.desc"))))), h$3("div", { class: "nylas-buffer-time__body", part: "nbt__body" }, h$3("div", { class: "nylas-buffer-time__dropdown" }, h$3("div", { class: "nylas-buffer-time__row" }, h$3("label", null, instance.t("nylasBufferTime.beforeBufferLabel")), h$3("div", { class: "dropdown-container" }, this.componentLoaded && h$3("select-dropdown", { id: "before-buffer-time", withSearch: !1, name: "before-buffer-time", exportparts: "sd_dropdown: nbt__dropdown-before, sd_dropdown-button: nbt__dropdown-button-before, sd_dropdown-content: nbt__dropdown-content-before", options: ue, defaultSelectedOption: ue.find((ge) => ge.value == this.selectedBeforeBufferTime) }), h$3("span", null, instance.t("nylasBufferTime.minutesShort")))), h$3("div", { class: "nylas-buffer-time__row" }, h$3("label", null, instance.t("nylasBufferTime.afterBufferLabel")), h$3("div", { class: "dropdown-container" }, this.componentLoaded && h$3("select-dropdown", { id: "after-buffer-time", withSearch: !1, name: "after-buffer-time", exportparts: "sd_dropdown: nbt__dropdown-after, sd_dropdown-button: nbt__dropdown-button-after, sd_dropdown-content: nbt__dropdown-content-after", options: ue, defaultSelectedOption: ue.find((ge) => ge.value == this.selectedAfterBufferTime) }), h$3("span", null, instance.t("nylasBufferTime.minutesShort"))))), h$3("div", { class: "nylas-buffer-time__preview", part: "nbt__preview" }, h$3("h4", null, instance.t("nylasBufferTime.previewHeader")), this.renderPreview()))));
+    return h$3(Host, null, h$3("div", { class: "nylas-buffer-time", part: "nbt" }, h$3("div", { class: "header", part: "nbt__header" }, h$3("h3", null, instance.t("nylasBufferTime.headerTitle")), h$3("p", null, instance.t("nylasBufferTime.headerSubTitle"), h$3("tooltip-component", null, h$3("info-icon", { slot: "tooltip-icon" }), h$3("span", { slot: "tooltip-content" }, instance.t("nylasBufferTime.tooltip.desc"))))), h$3("div", { class: "nylas-buffer-time__body", part: "nbt__body" }, h$3("div", { class: "nylas-buffer-time__dropdown" }, h$3("div", { class: "nylas-buffer-time__row" }, h$3("label", null, instance.t("nylasBufferTime.beforeBufferLabel")), h$3("div", { class: "dropdown-container" }, this.componentLoaded && h$3("select-dropdown", { id: "before-buffer-time", withSearch: !1, name: "before-buffer-time", exportparts: "sd_dropdown: nbt__dropdown-before, sd_dropdown-button: nbt__dropdown-button-before, sd_dropdown-content: nbt__dropdown-content-before", options: ue, defaultSelectedOption: ue.find((ge) => ge.value === this.selectedBeforeBufferTime.toString()) }), h$3("span", null, instance.t("nylasBufferTime.minutesShort")))), h$3("div", { class: "nylas-buffer-time__row" }, h$3("label", null, instance.t("nylasBufferTime.afterBufferLabel")), h$3("div", { class: "dropdown-container" }, this.componentLoaded && h$3("select-dropdown", { id: "after-buffer-time", withSearch: !1, name: "after-buffer-time", exportparts: "sd_dropdown: nbt__dropdown-after, sd_dropdown-button: nbt__dropdown-button-after, sd_dropdown-content: nbt__dropdown-content-after", options: ue, defaultSelectedOption: ue.find((ge) => ge.value === this.selectedAfterBufferTime.toString()) }), h$3("span", null, instance.t("nylasBufferTime.minutesShort"))))), h$3("div", { class: "nylas-buffer-time__preview", part: "nbt__preview" }, h$3("h4", null, instance.t("nylasBufferTime.previewHeader")), this.renderPreview()))));
   }
   static get formAssociated() {
     return !0;
@@ -27097,10 +27097,10 @@ var __decorate$n = function(ve, ue, ge, Oe) {
 const NylasEventDuration = proxyCustomElement(class extends H$4 {
   constructor() {
     super(), this.__registerHost(), this.__attachShadow(), this.valueChanged = createEvent(this, "valueChanged", 7), this.internals = this.attachInternals(), this.selectedConfiguration = void 0, this.name = "duration", this.eventDurationMinutes = void 0, this.selectedLanguage = void 0, this.duration = this.eventDurationMinutes ? this.eventDurationMinutes >= 60 ? this.eventDurationMinutes / 60 : this.eventDurationMinutes : 30, this.durationMinutes = void 0, this.durationIncrement = void 0, this.error = "", this.durationMinutesOptions = [
-      { value: 15, label: "15" },
-      { value: 30, label: "30" },
-      { value: 45, label: "45" },
-      { value: 60, label: "60" }
+      { value: "15", label: "15" },
+      { value: "30", label: "30" },
+      { value: "45", label: "45" },
+      { value: "60", label: "60" }
     ];
   }
   elementNameChangedHandler(ue) {
@@ -27131,11 +27131,11 @@ const NylasEventDuration = proxyCustomElement(class extends H$4 {
   }
   setDurationMintueOptions() {
     return this.durationIncrement === 1 ? this.durationMinutesOptions = [
-      { value: 15, label: "15" },
-      { value: 30, label: "30" },
-      { value: 45, label: "45" },
-      { value: 60, label: "60" }
-    ] : this.durationMinutesOptions = Array.from({ length: 23 }, (ue, ge) => ({ value: ge + 1, label: (ge + 1).toString() })), this.durationMinutesOptions;
+      { value: "15", label: "15" },
+      { value: "30", label: "30" },
+      { value: "45", label: "45" },
+      { value: "60", label: "60" }
+    ] : this.durationMinutesOptions = Array.from({ length: 23 }, (ue, ge) => ({ value: (ge + 1).toString(), label: (ge + 1).toString() })), this.durationMinutesOptions;
   }
   validateDuration() {
     return this.durationMinutes % 5 !== 0 ? (this.error = instance.t("nylasEventDuration.error.durationMustBeMultipleOf5"), this.isInternalsAvailable && this.internals.setValidity({ customError: !0 }, this.error)) : this.durationMinutes <= 0 ? (this.error = instance.t("nylasEventDuration.error.durationMustBeGreaterThan0"), this.isInternalsAvailable && this.internals.setValidity({ customError: !0 }, this.error)) : (this.error = "", this.isInternalsAvailable && this.internals.setValidity({})), this.error;
@@ -27143,19 +27143,19 @@ const NylasEventDuration = proxyCustomElement(class extends H$4 {
   nylasFormDropdownChangedHandler(ue) {
     debug("nylas-calendar-picker", "nylasFormDropdownChangedHandler", ue.detail);
     const { value: ge } = ue.detail;
-    this.durationIncrement = parseInt(ge), this.durationIncrement === 1 ? this.duration = 60 : this.duration = 1, this.setDurationMintueOptions(), this.durationMinutes = this.duration * this.durationIncrement, this.validateDuration() === "" && (this.isInternalsAvailable && this.internals.setFormValue(this.durationMinutes.toString(), this.name), this.valueChanged.emit({ value: this.durationMinutes.toString(), name: this.name }));
+    this.durationIncrement = parseInt(ge.toString()), this.durationIncrement === 1 ? this.duration = 60 : this.duration = 1, this.setDurationMintueOptions(), this.durationMinutes = this.duration * this.durationIncrement, this.validateDuration() === "" && (this.isInternalsAvailable && this.internals.setFormValue(this.durationMinutes.toString(), this.name), this.valueChanged.emit({ value: this.durationMinutes.toString(), name: this.name }));
   }
   inputOptionChangedHandler(ue) {
     debug("nylas-calendar-picker", "inputOptionChangedHandler", ue.detail);
     const { value: ge } = ue.detail;
-    this.duration = ge, this.durationMinutes = this.duration * this.durationIncrement, console.log("###errror:", this.validateDuration(), this.durationMinutes, this.durationIncrement), this.validateDuration() === "" && (this.isInternalsAvailable && this.internals.setFormValue(this.durationMinutes.toString(), this.name), this.valueChanged.emit({ value: this.durationMinutes.toString(), name: this.name }));
+    this.duration = parseFloat(ge.toString()), this.durationMinutes = this.duration * this.durationIncrement, this.validateDuration() === "" && (this.isInternalsAvailable && this.internals.setFormValue(this.durationMinutes.toString(), this.name), this.valueChanged.emit({ value: this.durationMinutes.toString(), name: this.name }));
   }
   render() {
     const ue = [
-      { value: 1, label: instance.t("timeDuration", { context: "minute" }) },
-      { value: 60, label: instance.t("timeDuration", { context: "hour" }) }
+      { value: "1", label: instance.t("timeDuration", { context: "minute" }) },
+      { value: "60", label: instance.t("timeDuration", { context: "hour" }) }
     ];
-    return h$3(Host, { key: "c0525f28dbeb2398489d58d64d7b8e400ca13424" }, h$3("div", { key: "5ae98592a0364146987a3d2e4eee5e5f80a80097", class: "nylas-event-duration", part: "ned" }, h$3("label", { key: "dc4ebcc5dbf749afbdbe27373a8d9904c2343433", htmlFor: "duration" }, instance.t("nylasEventDuration.headerTitle"), h$3("span", { key: "449d71a0f7479fad65ab3c00481cdf3f2cb6ed55", class: "required" }, "*")), h$3("div", { key: "807948b6f03032d24d5d93013f64f279bc92682b", class: "nylas-event-duration__wrapper" }, h$3("input-dropdown", { key: "2e47a704274e2cb19a7045ddd31e8c10e0a668b8", class: this.error ? "error" : "", name: "event-duration", options: this.durationMinutesOptions, inputValue: this.duration.toString(), exportparts: "id_dropdown: ned__input_dropdown, id_dropdown-input: ned__input_dropdown-input, id_dropdown-content: ned__input_dropdown-content", defaultInputOption: this.durationMinutesOptions.find((ge) => ge.value == this.duration) }), this.durationIncrement && h$3("select-dropdown", { name: "event-duration", options: ue, pluralizedLabel: this.duration > 1 ? instance.t(`time.${this.durationIncrement === 60 ? "hours" : "minutes"}`) : instance.t(`time.${this.durationIncrement === 60 ? "hour" : "minute"}`), exportparts: "sd_dropdown: ned__dropdown, sd_dropdown-button: ned__dropdown-button, sd_dropdown-content: ned__dropdown-content", defaultSelectedOption: ue.find((ge) => ge.value == this.durationIncrement), withSearch: !1 })), h$3("div", { key: "1b7710bb059db3bde722f17ed7660698e3f6988a", class: `nylas-event-duration__error-container ${this.error ? "visible" : ""}`, part: "ned__error-container" }, h$3("div", { key: "7e90795969a0fb22703217671cca38ffbb23d2a8", class: "nylas-event-duration__error", part: "ned__error" }, this.error))));
+    return h$3(Host, { key: "291d5aada4656f1e7a3ad639459090a164c667cd" }, h$3("div", { key: "389ed738c72f9af0b2413360ca30048a903fe834", class: "nylas-event-duration", part: "ned" }, h$3("label", { key: "3ab5ae91a80a98386cd77ffc2ed9bee1773e2cce", htmlFor: "duration" }, instance.t("nylasEventDuration.headerTitle"), h$3("span", { key: "a3eb28826f0237e227c6b9c4fbbbbb96544df143", class: "required" }, "*")), h$3("div", { key: "48e6f8aebb8f14fbe0ff74a600c1d06f0b65d2b4", class: "nylas-event-duration__wrapper" }, h$3("input-dropdown", { key: "4502e6a0eea47789edb136886dc0de048893b639", class: this.error ? "error" : "", name: "event-duration", options: this.durationMinutesOptions, inputValue: this.duration.toString(), exportparts: "id_dropdown: ned__input_dropdown, id_dropdown-input: ned__input_dropdown-input, id_dropdown-content: ned__input_dropdown-content", defaultInputOption: this.durationMinutesOptions.find((ge) => ge.value === this.duration.toString()) }), this.durationIncrement && h$3("select-dropdown", { name: "event-duration", options: ue, pluralizedLabel: this.duration > 1 ? instance.t(`time.${this.durationIncrement === 60 ? "hours" : "minutes"}`) : instance.t(`time.${this.durationIncrement === 60 ? "hour" : "minute"}`), exportparts: "sd_dropdown: ned__dropdown, sd_dropdown-button: ned__dropdown-button, sd_dropdown-content: ned__dropdown-content", defaultSelectedOption: ue.find((ge) => ge.value === this.durationIncrement.toString()), withSearch: !1 })), h$3("div", { key: "f847e873066be7c174f7c5eea94e4cdc473d1ecd", class: `nylas-event-duration__error-container ${this.error ? "visible" : ""}`, part: "ned__error-container" }, h$3("div", { key: "7cac0c1055ce71dd4de9cf08558d74c051527eb5", class: "nylas-event-duration__error", part: "ned__error" }, this.error))));
   }
   static get formAssociated() {
     return !0;
@@ -28169,7 +28169,7 @@ const timePeriodSelectorCss = ".time-period-selector.sc-time-period-selector{dis
   }
   render() {
     var ue;
-    return h$3("div", { key: "e482a321073bccd2cef6b05f4e6ad95cd3386b3a", class: "time-period-selector" }, typeof this.selectedNumber == "number" && h$3("input-dropdown", { id: "time-number", name: "time-number", class: { error: this.hasError }, inputValue: this.selectedNumber.toString(), exportparts: "id_dropdown: tps__number-dropdown, id_dropdown-input: tps__number-dropdown-button, id_dropdown-content: tps__number-dropdown-content", options: this.numberOptions, defaultInputOption: this.numberOptions.find((ge) => ge.value == this.selectedNumber.toString()) }), typeof this.selectedPeriod == "string" && h$3("select-dropdown", { id: "time-period", name: "time-period", options: this.timePeriodOptions, exportparts: "sd_dropdown: tps__period-dropdown, sd_dropdown-button: tps__period-dropdown-button, sd_dropdown-content: tps__period-dropdown-content", pluralizedLabel: this.selectedNumber > 1 ? instance.t(`time.${this.selectedPeriod}s`) : instance.t(`time.${this.selectedPeriod}`), defaultSelectedOption: (ue = this.timePeriodOptions) == null ? void 0 : ue.find((ge) => ge.value == this.selectedPeriod), withSearch: !1 }));
+    return h$3("div", { key: "9e0fdc7e29a1f2736f392fa3ce86add3290d8361", class: "time-period-selector" }, typeof this.selectedNumber == "number" && h$3("input-dropdown", { id: "time-number", name: "time-number", class: { error: this.hasError }, inputValue: this.selectedNumber.toString(), exportparts: "id_dropdown: tps__number-dropdown, id_dropdown-input: tps__number-dropdown-button, id_dropdown-content: tps__number-dropdown-content", options: this.numberOptions, defaultInputOption: this.numberOptions.find((ge) => ge.value == this.selectedNumber.toString()) }), typeof this.selectedPeriod == "string" && h$3("select-dropdown", { id: "time-period", name: "time-period", options: this.timePeriodOptions, exportparts: "sd_dropdown: tps__period-dropdown, sd_dropdown-button: tps__period-dropdown-button, sd_dropdown-content: tps__period-dropdown-content", pluralizedLabel: this.selectedNumber > 1 ? instance.t(`time.${this.selectedPeriod}s`) : instance.t(`time.${this.selectedPeriod}`), defaultSelectedOption: (ue = this.timePeriodOptions) == null ? void 0 : ue.find((ge) => ge.value == this.selectedPeriod), withSearch: !1 }));
   }
   get host() {
     return this;
@@ -47325,18 +47325,18 @@ const NylasEditorTabsGroup = proxyCustomElement(class extends H$4 {
   }
   render() {
     var ue, ge;
-    return debug("[nylas-editor-tabs-group]", "render", this.formState), h$3(Host, { key: "afdf097ad3a673c5290d560773673f555319dcfb" }, h$3("form", { key: "7f7e51ad07c4b8f2c95a546fa847f4b14f002b15", onSubmit: this.formSubmissionHandler, class: "scheduler-editor", ref: (Oe) => this.formRef = Oe, noValidate: !0 }, this.mode === "app" ? h$3("div", { class: "return-to-calendar-view", part: "editor__return-to-calendar-view net__return-to-calendar-view" }, h$3("button-component", { id: "return-to-calendar-view-button", variant: "invisible", part: "nset__header__back-button", type: "button", onClick: (Oe) => {
+    return debug("[nylas-editor-tabs-group]", "render", this.formState), h$3(Host, { key: "3876ed63289b6d9f50ada8cf0f45e6bf89ce5144" }, h$3("form", { key: "0811e2531ad2a510fa0d3d0361c6013f24debd15", onSubmit: this.formSubmissionHandler, class: "scheduler-editor", ref: (Oe) => this.formRef = Oe, noValidate: !0 }, this.mode === "app" ? h$3("div", { class: "return-to-calendar-view", part: "editor__return-to-calendar-view net__return-to-calendar-view" }, h$3("button-component", { id: "return-to-calendar-view-button", variant: "invisible", part: "nset__header__back-button", type: "button", onClick: (Oe) => {
       this.setActiveTab(Oe, TabGroup.CalendarView);
-    } }, h$3("chevron-icon", { width: "16", height: "16" }), h$3("span", null, "Return to Calendar view"))) : null, this.mode === "app" ? h$3("div", { class: "form-contents", part: "editor__form-contents net__form-contents" }, h$3("div", { class: "tabs", part: "editor__tabs net__tabs" }, h$3("button", { name: TabGroup.BookingOptions, class: { tab: !0, active: this.activeTab == TabGroup.BookingOptions, hide: this.hideTab(TabGroup.BookingOptions) }, part: "editortab__booking-options net__tab-booking-options", onClick: (Oe) => this.setActiveTab(Oe, TabGroup.BookingOptions) }, h$3("flow-icon", { width: "16", height: "16" }), instance.t("bookingOptionsTab")), h$3("button", { name: TabGroup.BookingForm, class: { tab: !0, active: this.activeTab == "bookingForm", hide: this.hideTab(TabGroup.BookingForm) }, part: "editortab__booking-form net__tab-booking-form", onClick: (Oe) => this.setActiveTab(Oe, TabGroup.BookingForm) }, this.activeTab == TabGroup.BookingForm ? h$3("calendar-agenda-fill-icon", { width: "16", height: "16" }) : h$3("calendar-agenda-icon", { width: "16", height: "16" }), instance.t("bookingFormTab")), h$3("button", { name: TabGroup.Communications, class: { tab: !0, active: this.activeTab == "communications", hide: this.hideTab(TabGroup.Communications) }, onClick: (Oe) => this.setActiveTab(Oe, TabGroup.Communications), part: "editortab__communications net__tab-communications" }, this.activeTab == TabGroup.Communications ? h$3("envelope-fill-icon", { width: "16", height: "16" }) : h$3("envelope-icon", { width: "16", height: "16" }), instance.t("communicationsTab")), h$3("button", { name: TabGroup.PageStyles, class: { tab: !0, active: this.activeTab == "pageStyles", hide: this.hideTab(TabGroup.PageStyles) }, onClick: (Oe) => this.setActiveTab(Oe, TabGroup.PageStyles), part: "editortab__page-styles net__tab-page-styles" }, this.activeTab == TabGroup.PageStyles ? h$3("paintbrush-fill-icon", { width: "16", height: "16" }) : h$3("paintbrush-icon", { width: "16", height: "16" }), instance.t("pageStylesTab"))), h$3("div", { class: "tab-content", part: "editor__tab-content net__tab-content" }, h$3(TabContentsGroup, { formState: this.formState, activeTab: this.activeTab, currentUser: this.currentUser, calendars: this.calendars, id: ((ue = this.selectedConfiguration) == null ? void 0 : ue.id) ?? "new", i18next: instance }))) : h$3("div", { class: "composable", key: (ge = this.selectedConfiguration) == null ? void 0 : ge.id }, h$3("slot", null)), h$3("div", { key: "922210f9a184ff3ddb83630db4ae6ee1d9dd2944", class: "footer", part: "editor__footer net__footer" }, h$3("div", { key: "5d8a938c31b831833ebe3030fee8da39acb12edb", class: "preview", part: "editor__footer-preview net__footer-preview" }, this.enableUserFeedback && h$3("button-component", { title: "Share your feedback", id: "report-issue", variant: "basic", onClick: (Oe) => this.onFeedbackClick(Oe) }, h$3("feedback-icon", null)), this.activeTab === TabGroup.CalendarView && h$3("button-component", { title: "Go to page settings", id: "page-settings", variant: "basic", onClick: (Oe) => this.setActiveTab(Oe, TabGroup.BookingOptions) }, "Page settings")), h$3("div", { key: "07889582bf417de6ccc1ce5a74f2a1c39559f9c0", class: "buttons", part: "editor__footer-buttons net__footer-buttons" }, h$3("p", { key: "ad80bbca9db6703743093ca6fee0bb3a949e66c6", class: {
+    } }, h$3("chevron-icon", { width: "16", height: "16" }), h$3("span", null, "Return to Calendar view"))) : null, this.mode === "app" ? h$3("div", { class: "form-contents", part: "editor__form-contents net__form-contents" }, h$3("div", { class: "tabs", part: "editor__tabs net__tabs" }, h$3("button", { name: TabGroup.BookingOptions, class: { tab: !0, active: this.activeTab == TabGroup.BookingOptions, hide: this.hideTab(TabGroup.BookingOptions) }, part: "editortab__booking-options net__tab-booking-options", onClick: (Oe) => this.setActiveTab(Oe, TabGroup.BookingOptions) }, h$3("flow-icon", { width: "16", height: "16" }), instance.t("bookingOptionsTab")), h$3("button", { name: TabGroup.BookingForm, class: { tab: !0, active: this.activeTab == TabGroup.BookingForm, hide: this.hideTab(TabGroup.BookingForm) }, part: "editortab__booking-form net__tab-booking-form", onClick: (Oe) => this.setActiveTab(Oe, TabGroup.BookingForm) }, this.activeTab == TabGroup.BookingForm ? h$3("calendar-agenda-fill-icon", { width: "16", height: "16" }) : h$3("calendar-agenda-icon", { width: "16", height: "16" }), instance.t("bookingFormTab")), h$3("button", { name: TabGroup.Communications, class: { tab: !0, active: this.activeTab == TabGroup.Communications, hide: this.hideTab(TabGroup.Communications) }, onClick: (Oe) => this.setActiveTab(Oe, TabGroup.Communications), part: "editortab__communications net__tab-communications" }, this.activeTab == TabGroup.Communications ? h$3("envelope-fill-icon", { width: "16", height: "16" }) : h$3("envelope-icon", { width: "16", height: "16" }), instance.t("communicationsTab")), h$3("button", { name: TabGroup.PageStyles, class: { tab: !0, active: this.activeTab == TabGroup.PageStyles, hide: this.hideTab(TabGroup.PageStyles) }, onClick: (Oe) => this.setActiveTab(Oe, TabGroup.PageStyles), part: "editortab__page-styles net__tab-page-styles" }, this.activeTab == TabGroup.PageStyles ? h$3("paintbrush-fill-icon", { width: "16", height: "16" }) : h$3("paintbrush-icon", { width: "16", height: "16" }), instance.t("pageStylesTab"))), h$3("div", { class: "tab-content", part: "editor__tab-content net__tab-content" }, h$3(TabContentsGroup, { formState: this.formState, activeTab: this.activeTab, currentUser: this.currentUser, calendars: this.calendars, id: ((ue = this.selectedConfiguration) == null ? void 0 : ue.id) ?? "new", i18next: instance }))) : h$3("div", { class: "composable", key: (ge = this.selectedConfiguration) == null ? void 0 : ge.id }, h$3("slot", null)), h$3("div", { key: "aeac48a6fb617c41599578ea1daaa077d8460eb7", class: "footer", part: "editor__footer net__footer" }, h$3("div", { key: "c6ae59dfb5a785a61005aded9cccef25b5bc988d", class: "preview", part: "editor__footer-preview net__footer-preview" }, this.enableUserFeedback && h$3("button-component", { title: "Share your feedback", id: "report-issue", variant: "basic", onClick: (Oe) => this.onFeedbackClick(Oe) }, h$3("feedback-icon", null)), this.activeTab === TabGroup.CalendarView && h$3("button-component", { title: "Go to page settings", id: "page-settings", variant: "basic", onClick: (Oe) => this.setActiveTab(Oe, TabGroup.BookingOptions) }, "Page settings")), h$3("div", { key: "c8173bb6d4c0f7c3c032e69ba90a168690213d61", class: "buttons", part: "editor__footer-buttons net__footer-buttons" }, h$3("p", { key: "647a5d28a97e96da3cd1244eedb9ad7a9a5b659e", class: {
       "unsaved-changes": this.hasUnsavedChanges && !this.changesSaved,
       "saved-changes": this.changesSaved,
       error: this.error !== "",
       "error-full-width": this.error !== "" && this.action === "create"
-    } }, this.error !== "" ? this.error : "", this.error == "" && this.hasUnsavedChanges && !this.changesSaved && this.activeTab !== TabGroup.CalendarView ? instance.t("unsavedChangesLabel") : this.error == "" && this.changesSaved ? `${instance.t("changesSavedLabel")}!` : ""), h$3("div", { key: "a53e7d929f8e0cdaf36d2e43e98b8703cd6f2379", class: "footer-buttons__row" }, this.schedulerPreviewLink !== "" && this.action === "edit" && h$3("button-component", { title: "Preview", type: "button", disabled: this.isLoading, clickHandler: (Oe) => {
+    } }, this.error !== "" ? this.error : "", this.error == "" && this.hasUnsavedChanges && !this.changesSaved && this.activeTab !== TabGroup.CalendarView ? instance.t("unsavedChangesLabel") : this.error == "" && this.changesSaved ? `${instance.t("changesSavedLabel")}!` : ""), h$3("div", { key: "13f02e12c253380c196501d819e26dbef36f5532", class: "footer-buttons__row" }, this.schedulerPreviewLink !== "" && this.action === "edit" && h$3("button-component", { title: "Preview", type: "button", disabled: this.isLoading, clickHandler: (Oe) => {
       Oe.preventDefault(), this.previewButtonClicked.emit(this.host).defaultPrevented || window.open(parsePreviewLink(this.schedulerPreviewLink, this.selectedConfiguration), "_blank");
-    }, variant: "basic" }, h$3("eye-icon", null)), h$3("button-component", { key: "9c048ca1576e4bd508461a172f3ffdfafcf39698", type: "button", disabled: this.isLoading, clickHandler: (Oe) => {
+    }, variant: "basic" }, h$3("eye-icon", null)), h$3("button-component", { key: "945a4b3405ff6e8a90d87dfea5928c86939d1666", type: "button", disabled: this.isLoading, clickHandler: (Oe) => {
       Oe.preventDefault(), this.cancelButtonClick.emit(), this.error = "";
-    }, variant: "basic", part: "editor__footer-cancel net__footer-cancel" }, instance.t("backButton")), h$3("button-component", { key: "778f71bc70660a4e279db51a56fda244966a5694", type: "submit", disabled: this.isLoading, part: "editor__footer-cta, net__footer-cta" }, this.isLoading ? h$3("span", null, instance.t("savingButtonText"), h$3("loading-icon", null), " ") : this.action === "create" ? `${instance.t("createButtonText")}` : `${instance.t("saveChangesButtonText")}`))))), this.showFeedbackModal && h$3("nylas-feedback-form", null));
+    }, variant: "basic", part: "editor__footer-cancel net__footer-cancel" }, instance.t("backButton")), h$3("button-component", { key: "d412db23e9fff9450174caa83d39a5dae05b5022", type: "submit", disabled: this.isLoading, part: "editor__footer-cta, net__footer-cta" }, this.isLoading ? h$3("span", null, instance.t("savingButtonText"), h$3("loading-icon", null), " ") : this.action === "create" ? `${instance.t("createButtonText")}` : `${instance.t("saveChangesButtonText")}`))))), this.showFeedbackModal && h$3("nylas-feedback-form", null));
   }
   get host() {
     return this;