@nylas/web-elements 0.0.0-canary-20250120165013 → 0.0.0-canary-20250122221254

package/dist/cdn/nylas-feedback-form/nylas-feedback-form.es.js

@@ -15402,6 +15402,7 @@ const t5 = ':host{display:block;--nylas-primary:#2563eb;--nylas-error:#cc4841;--
     this.validate(this.value), this.error && e.preventDefault();
   }
   handleInput(e) {
+    this.error = "";
     const t = e.target;
     this.value = Ba(t.value), this.nylasFormInputChanged.emit({
       value: this.value,
@@ -15415,7 +15416,7 @@ const t5 = ':host{display:block;--nylas-primary:#2563eb;--nylas-error:#cc4841;--
     this.required && !e ? this.error = `${this.label} is required.` : e.length > this.maxLength ? this.error = `${this.label} cannot exceed ${this.maxLength} characters.` : this.error = "";
   }
   render() {
-    return z("label", { key: "383001bd48b1178b4c9126f812175701f570931e", part: "tc__label", class: { error: !!this.error } }, z("p", { key: "17dad29e1c19d24bfb5e1736630c6d43651f1616" }, z("span", { key: "d1077d0eab18709b12e714650a20057b17720ebd", class: "label" }, this.label), this.required && z("span", { class: "required" }, "*"), this.tooltip && z("tooltip-component", null, z("info-icon", { slot: "tooltip-icon" }), z("span", { slot: "tooltip-content" }, this.tooltip))), z("textarea", { key: "b35934b9027ac4c7d27a1720c471d698905e5f62", name: this.name, title: this.readOnly ? "read-only field" : void 0, placeholder: this.placeholder, readOnly: this.readOnly, autoFocus: this.autoFocus, value: this.value, maxLength: this.maxLength, onInput: (e) => this.handleInput(e), class: { error: !!this.error }, part: "tc__textarea" }), this.error && z("span", { class: "error help-text" }, this.error));
+    return z("label", { key: "3b3dd5b1c594e2c3b3594826b1f0379925dd14e9", part: "tc__label", class: { error: !!this.error } }, z("p", { key: "0a544d90a3b087c3479412078b1a454261bf20db" }, z("span", { key: "c37a9e870a3ebe502b2db7fbf0968178fc7cc519", class: "label" }, this.label), this.required && z("span", { class: "required" }, "*"), this.tooltip && z("tooltip-component", null, z("info-icon", { slot: "tooltip-icon" }), z("span", { slot: "tooltip-content" }, this.tooltip))), z("textarea", { key: "1be0e90961ebd6110bffd347a930884768429037", name: this.name, title: this.readOnly ? "read-only field" : void 0, placeholder: this.placeholder, readOnly: this.readOnly, autoFocus: this.autoFocus, value: this.value, maxLength: this.maxLength, onInput: (e) => this.handleInput(e), class: { error: !!this.error }, part: "tc__textarea" }), this.error && z("span", { class: "error help-text" }, this.error));
   }
   static get style() {
     return n5;

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

@@ -19323,7 +19323,7 @@ function defineCustomElement$1h() {
     }
   });
 }
-const checkboxComponentCss = ':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:100%}.checkbox-container{display:flex;flex-direction:column;gap:0.5rem}.checkbox-container p.error{color:var(--nylas-error);font-size:14px;font-weight:400;line-height:20px;font-family:var(--nylas-font-family);margin:0}label{display:flex;align-items:center;font-family:var(--nylas-font-family);cursor:pointer;position:relative;-webkit-user-select:none;-moz-user-select:none;-ms-user-select:none;user-select:none}label.readonly{cursor:not-allowed}label input[type=checkbox]{position:absolute;opacity:0;cursor:pointer;border:1px solid var(--nylas-base-300)}label input[type=checkbox]:focus~.checkmark,label input[type=checkbox]:hover~.checkmark{border-color:var(--nylas-primary)}label input[type=checkbox]:checked~.checkmark{color:var(--nylas-base-0);background:var(--nylas-primary) url(data:image/svg+xml;base64,PD94bWwgdmVyc2lvbj0iMS4wIiBlbmNvZGluZz0iVVRGLTgiIHN0YW5kYWxvbmU9Im5vIj8+DQo8c3ZnIHdpZHRoPSIxMiIgaGVpZ2h0PSI5IiB2aWV3Qm94PSIwIDAgMTIgOSIgeG1sbnM9Imh0dHA6Ly93d3cudzMub3JnLzIwMDAvc3ZnIj4NCiAgPHBhdGggZD0iTTQuNTc1IDguOTc3cy0uNDA0LS4wMDctLjUzNi0uMTY1TC4wNTcgNS42NGwuODI5LTEuMjI3TDQuNDcgNy4yNjggMTAuOTIxLjA4NmwuOTIzIDEuMTAzLTYuODYzIDcuNjRjLS4xMzQtLjAwMy0uNDA2LjE0OC0uNDA2LjE0OHoiIGZpbGw9IiNGRkYiIGZpbGwtcnVsZT0iZXZlbm9kZCIvPg0KPC9zdmc+) 50% 40% no-repeat;border:2px solid var(--nylas-primary)}label input[type=checkbox]:disabled{cursor:not-allowed;background:var(--nylas-base-100);border:1px solid var(--nylas-base-300)}label .checkmark{border-radius:var(--nylas-border-radius);border:2px solid var(--nylas-base-800);position:absolute;left:0;top:2px;width:18px;height:18px;cursor:pointer;pointer-events:none;-webkit-user-select:none;-moz-user-select:none;-ms-user-select:none;user-select:none}label .label{margin-left:32px;font-size:16px;font-weight:400;color:var(--nylas-base-800);line-height:24px}', CheckboxComponentStyle0 = checkboxComponentCss, CheckboxComponent = proxyCustomElement(class extends H$2 {
+const checkboxComponentCss = ':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:100%}.checkbox-container{display:flex;flex-direction:column;gap:0.5rem}.checkbox-container p.error{color:var(--nylas-error);font-size:14px;font-weight:400;line-height:20px;font-family:var(--nylas-font-family);margin:0}label{display:flex;align-items:center;font-family:var(--nylas-font-family);cursor:pointer;position:relative;-webkit-user-select:none;-moz-user-select:none;-ms-user-select:none;user-select:none}label.readonly{cursor:not-allowed}label span.required{color:var(--nylas-error);padding:0 0.25rem}label input[type=checkbox]{position:absolute;opacity:0;cursor:pointer;border:1px solid var(--nylas-base-300)}label input[type=checkbox]:focus~.checkmark,label input[type=checkbox]:hover~.checkmark{border-color:var(--nylas-primary)}label input[type=checkbox]:checked~.checkmark{color:var(--nylas-base-0);background:var(--nylas-primary) url(data:image/svg+xml;base64,PD94bWwgdmVyc2lvbj0iMS4wIiBlbmNvZGluZz0iVVRGLTgiIHN0YW5kYWxvbmU9Im5vIj8+DQo8c3ZnIHdpZHRoPSIxMiIgaGVpZ2h0PSI5IiB2aWV3Qm94PSIwIDAgMTIgOSIgeG1sbnM9Imh0dHA6Ly93d3cudzMub3JnLzIwMDAvc3ZnIj4NCiAgPHBhdGggZD0iTTQuNTc1IDguOTc3cy0uNDA0LS4wMDctLjUzNi0uMTY1TC4wNTcgNS42NGwuODI5LTEuMjI3TDQuNDcgNy4yNjggMTAuOTIxLjA4NmwuOTIzIDEuMTAzLTYuODYzIDcuNjRjLS4xMzQtLjAwMy0uNDA2LjE0OC0uNDA2LjE0OHoiIGZpbGw9IiNGRkYiIGZpbGwtcnVsZT0iZXZlbm9kZCIvPg0KPC9zdmc+) 50% 40% no-repeat;border:2px solid var(--nylas-primary)}label input[type=checkbox]:disabled{cursor:not-allowed;background:var(--nylas-base-100);border:1px solid var(--nylas-base-300)}label .checkmark{border-radius:var(--nylas-border-radius);border:2px solid var(--nylas-base-800);position:absolute;left:0;top:2px;width:18px;height:18px;cursor:pointer;pointer-events:none;-webkit-user-select:none;-moz-user-select:none;-ms-user-select:none;user-select:none}label .label{margin-left:32px;font-size:16px;font-weight:400;color:var(--nylas-base-800);line-height:24px}', CheckboxComponentStyle0 = checkboxComponentCss, CheckboxComponent = proxyCustomElement(class extends H$2 {
   constructor() {
     super(), this.__registerHost(), this.__attachShadow(), this.nylasFormCheckboxToggled = createEvent(this, "nylasFormCheckboxToggled", 7), this.componentType = "checkbox", this.name = "checkbox", this.checked = void 0, this.label = "", this.readOnly = !1, this.required = !1, this.isChecked = void 0, this.error = "";
   }
@@ -19337,11 +19337,7 @@ const checkboxComponentCss = ':host{display:block;--nylas-primary:#2563eb;--nyla
     this.isChecked = this.checked || !1;
   }
   handleBookingFormSubmitted(ue) {
-    if (this.required && !this.isChecked) {
-      this.error = `${this.label} is required.`;
-      return;
-    }
-    this.error && ue.preventDefault();
+    this.required && !this.isChecked && (this.error = `${this.label} is required.`), this.error && ue.preventDefault();
   }
   toggleCheck() {
     this.error = "", this.isChecked = !this.isChecked, this.nylasFormCheckboxToggled.emit({
@@ -19351,7 +19347,7 @@ const checkboxComponentCss = ':host{display:block;--nylas-primary:#2563eb;--nyla
     });
   }
   render() {
-    return h$2("div", { key: "436d313659a2d88e1373028efa14ec4422fdeb53", class: "checkbox-container" }, h$2("label", { key: "9cf84f5a1fa7a35257681afc1bd2a215ebe36aad", title: this.readOnly ? "read-only field" : void 0, class: { readonly: this.readOnly } }, h$2("input", { key: "600422d052cd28de6f053fac93c9a753f32637c1", type: "checkbox", disabled: this.readOnly, readOnly: this.readOnly, name: this.name, title: this.readOnly ? "read-only field" : void 0, checked: this.isChecked, onChange: () => this.toggleCheck() }), h$2("span", { key: "a3130e18c64555c54cd73695d2392148ef8c49f6", class: "checkmark" }), h$2("slot", { key: "808de6e68a5c5887ba0ca3b5a997aae2aed035a2", name: "label" }, h$2("span", { key: "4cb5b6c8d3548976ba9e1e5a5269aad3773e642f", class: "label" }, this.label))), this.error && h$2("p", { class: "error" }, this.error));
+    return h$2("div", { key: "595e161a792173db6af97d3d7ef13cdca534052a", class: "checkbox-container" }, h$2("label", { key: "625bd67ceec40d979d5f4f74ec576569866ff6ec", title: this.readOnly ? "read-only field" : void 0, class: { readonly: this.readOnly } }, h$2("input", { key: "dc099ed0899a91fe30b67bb0f2981b8bd5254bbb", type: "checkbox", disabled: this.readOnly, readOnly: this.readOnly, name: this.name, title: this.readOnly ? "read-only field" : void 0, checked: this.isChecked, onChange: () => this.toggleCheck() }), h$2("span", { key: "032c931e0b256a9e948551c9d938e14339f4c45e", class: "checkmark" }), h$2("slot", { key: "d932f4a7c5aa7e680827beff46f1ff86ce50b1d9", name: "label" }, h$2("span", { key: "b5ce4490b7be93f936d3061145dcbe4489dd74c9", class: "label" }, this.label, this.required && h$2("span", { class: "required" }, "*")))), this.error && h$2("p", { class: "error" }, this.error));
   }
   get el() {
     return this;
@@ -24230,6 +24226,7 @@ const textareaComponentCss = ':host{display:block;--nylas-primary:#2563eb;--nyla
     this.validate(this.value), this.error && ue.preventDefault();
   }
   handleInput(ue) {
+    this.error = "";
     const ge = ue.target;
     this.value = sanitize(ge.value), this.nylasFormInputChanged.emit({
       value: this.value,
@@ -24243,7 +24240,7 @@ const textareaComponentCss = ':host{display:block;--nylas-primary:#2563eb;--nyla
     this.required && !ue ? this.error = `${this.label} is required.` : ue.length > this.maxLength ? this.error = `${this.label} cannot exceed ${this.maxLength} characters.` : this.error = "";
   }
   render() {
-    return h$2("label", { key: "383001bd48b1178b4c9126f812175701f570931e", part: "tc__label", class: { error: !!this.error } }, h$2("p", { key: "17dad29e1c19d24bfb5e1736630c6d43651f1616" }, h$2("span", { key: "d1077d0eab18709b12e714650a20057b17720ebd", class: "label" }, this.label), this.required && h$2("span", { class: "required" }, "*"), this.tooltip && h$2("tooltip-component", null, h$2("info-icon", { slot: "tooltip-icon" }), h$2("span", { slot: "tooltip-content" }, this.tooltip))), h$2("textarea", { key: "b35934b9027ac4c7d27a1720c471d698905e5f62", name: this.name, title: this.readOnly ? "read-only field" : void 0, placeholder: this.placeholder, readOnly: this.readOnly, autoFocus: this.autoFocus, value: this.value, maxLength: this.maxLength, onInput: (ue) => this.handleInput(ue), class: { error: !!this.error }, part: "tc__textarea" }), this.error && h$2("span", { class: "error help-text" }, this.error));
+    return h$2("label", { key: "3b3dd5b1c594e2c3b3594826b1f0379925dd14e9", part: "tc__label", class: { error: !!this.error } }, h$2("p", { key: "0a544d90a3b087c3479412078b1a454261bf20db" }, h$2("span", { key: "c37a9e870a3ebe502b2db7fbf0968178fc7cc519", class: "label" }, this.label), this.required && h$2("span", { class: "required" }, "*"), this.tooltip && h$2("tooltip-component", null, h$2("info-icon", { slot: "tooltip-icon" }), h$2("span", { slot: "tooltip-content" }, this.tooltip))), h$2("textarea", { key: "1be0e90961ebd6110bffd347a930884768429037", name: this.name, title: this.readOnly ? "read-only field" : void 0, placeholder: this.placeholder, readOnly: this.readOnly, autoFocus: this.autoFocus, value: this.value, maxLength: this.maxLength, onInput: (ue) => this.handleInput(ue), class: { error: !!this.error }, part: "tc__textarea" }), this.error && h$2("span", { class: "error help-text" }, this.error));
   }
   static get style() {
     return TextareaComponentStyle0;
@@ -30670,8 +30667,8 @@ function captureException(ve, ue) {
   return getCurrentScope().captureException(ve, void 0);
 }
 function captureMessage(ve, ue) {
-  const Oe = { captureContext: ue };
-  return getCurrentScope().captureMessage(ve, void 0, Oe);
+  const ge = typeof ue == "string" ? ue : void 0, Oe = typeof ue != "string" ? { captureContext: ue } : void 0;
+  return getCurrentScope().captureMessage(ve, ge, Oe);
 }
 function captureEvent(ve, ue) {
   return getCurrentScope().captureEvent(ve, ue);
@@ -34853,9 +34850,14 @@ const NylasEditorTabs = proxyCustomElement(class extends H$2 {
     this.showFeedbackModal = !1;
   }
   feedbackSubmittedHandler(ue) {
-    var Ke, vt;
+    var Ke, vt, ln, ei, ti, ni;
     const Oe = {
-      eventId: captureMessage("Scheduler Editor User Feedback"),
+      eventId: captureMessage("Scheduler Editor User Feedback", {
+        extra: {
+          configId: (Ke = this.selectedConfiguration) == null ? void 0 : Ke.id,
+          slug: (vt = this.selectedConfiguration) == null ? void 0 : vt.slug
+        }
+      }),
       message: ue.detail.feedback
     };
     captureFeedback(Oe, {
@@ -34863,11 +34865,14 @@ const NylasEditorTabs = proxyCustomElement(class extends H$2 {
       captureContext: {
         tags: {
           "nylas-web-element": "nylas-scheduler-editor",
-          "nylas-web-element-version": "1.3.5"
+          "nylas-web-element-version": "1.3.5",
+          "nylas-config-id": (ln = this.selectedConfiguration) == null ? void 0 : ln.id,
+          "nylas-slug": (ei = this.selectedConfiguration) == null ? void 0 : ei.slug,
+          "host-url": window.location.href
         },
         extra: {
-          configId: (Ke = this.selectedConfiguration) == null ? void 0 : Ke.id,
-          slug: (vt = this.selectedConfiguration) == null ? void 0 : vt.slug
+          configId: (ti = this.selectedConfiguration) == null ? void 0 : ti.id,
+          slug: (ni = this.selectedConfiguration) == null ? void 0 : ni.slug
         }
       }
     }), this.showFeedbackModal = !1;
@@ -35035,16 +35040,16 @@ const NylasEditorTabs = proxyCustomElement(class extends H$2 {
   }
   render() {
     var ue, ge;
-    return debug("[nylas-editor-tabs]", "render", this.formState), h$2(Host, { key: "e3a4eed49c9ee61fbbd202558839c0b9fe7bf9d0" }, h$2("form", { key: "f41fc61161a1c03c92928b0cd2415762afdaff11", onSubmit: this.formSubmissionHandler, class: "scheduler-editor", ref: (Oe) => this.formRef = Oe, noValidate: !0 }, this.mode === "app" ? h$2("div", { class: "form-contents", part: "editor__form-contents net__form-contents" }, h$2("div", { class: "tabs", part: "editor__tabs net__tabs" }, h$2("button", { name: Tab.EventInfo, class: { tab: !0, active: this.activeTab == Tab.EventInfo, hide: this.hideTab(Tab.EventInfo) }, part: "editortab__event-info net__tab-event-info", onClick: (Oe) => this.setActiveTab(Oe, Tab.EventInfo) }, h$2("calendar-info-icon", { width: "16", height: "16" }), instance.t("eventInfoTab")), h$2("button", { name: Tab.Availability, class: { tab: !0, active: this.activeTab == Tab.Availability, hide: this.hideTab(Tab.Availability) }, part: "editortab__availability net__tab-availability", onClick: (Oe) => this.setActiveTab(Oe, Tab.Availability) }, h$2("calendar-patterns-icon", { width: "16", height: "16" }), instance.t("availabilityTab")), h$2("button", { name: Tab.Participants, class: { tab: !0, active: this.activeTab == Tab.Participants, hide: this.hideTab(Tab.Participants) }, part: "editortab__participants net__tab-participants", onClick: (Oe) => this.setActiveTab(Oe, Tab.Participants) }, h$2("people-icon", { width: "16", height: "16" }), instance.t("participantsTab")), h$2("button", { name: Tab.BookingOptions, class: { tab: !0, active: this.activeTab == Tab.BookingOptions, hide: this.hideTab(Tab.BookingOptions) }, part: "editortab__booking-options net__tab-booking-options", onClick: (Oe) => this.setActiveTab(Oe, Tab.BookingOptions) }, h$2("flow-icon", { width: "16", height: "16" }), instance.t("bookingOptionsTab")), h$2("button", { name: Tab.BookingForm, class: { tab: !0, active: this.activeTab == "bookingForm", hide: this.hideTab(Tab.BookingForm) }, part: "editortab__booking-form net__tab-booking-form", onClick: (Oe) => this.setActiveTab(Oe, Tab.BookingForm) }, this.activeTab == Tab.BookingForm ? h$2("calendar-agenda-fill-icon", { width: "16", height: "16" }) : h$2("calendar-agenda-icon", { width: "16", height: "16" }), instance.t("bookingFormTab")), h$2("button", { name: Tab.Communications, class: { tab: !0, active: this.activeTab == "communications", hide: this.hideTab(Tab.Communications) }, onClick: (Oe) => this.setActiveTab(Oe, Tab.Communications), part: "editortab__communications net__tab-communications" }, this.activeTab == Tab.Communications ? h$2("envelope-fill-icon", { width: "16", height: "16" }) : h$2("envelope-icon", { width: "16", height: "16" }), instance.t("communicationsTab")), h$2("button", { name: Tab.PageStyles, class: { tab: !0, active: this.activeTab == "pageStyles", hide: this.hideTab(Tab.PageStyles) }, onClick: (Oe) => this.setActiveTab(Oe, Tab.PageStyles), part: "editortab__page-styles net__tab-page-styles" }, this.activeTab == Tab.PageStyles ? h$2("paintbrush-fill-icon", { width: "16", height: "16" }) : h$2("paintbrush-icon", { width: "16", height: "16" }), instance.t("pageStylesTab"))), h$2("div", { class: "tab-content", part: "editor__tab-content net__tab-content" }, h$2(TabContents, { 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$2("div", { class: "composable", key: (ge = this.selectedConfiguration) == null ? void 0 : ge.id }, h$2("slot", null)), h$2("div", { key: "4f5a972e86dcb6e8812498bf6ea70095442563a1", class: "footer", part: "editor__footer net__footer" }, h$2("div", { key: "12c811edba69e577deb48be0157f71032c696381", class: "preview", part: "editor__footer-preview net__footer-preview" }, this.enableUserFeedback && h$2("button-component", { title: "Share your feedback", id: "report-issue", variant: "basic", onClick: (Oe) => this.onFeedbackClick(Oe) }, h$2("feedback-icon", null))), h$2("div", { key: "d1479be094e492d2beeab860e496ca2fbaeed8f2", class: "buttons", part: "editor__footer-buttons net__footer-buttons" }, h$2("p", { key: "e1abb07c34703c11fee1f922f069cbfd1df50ad5", class: {
+    return debug("[nylas-editor-tabs]", "render", this.formState), h$2(Host, { key: "6b41766e5e726c094aca62e18595796d43b2f298" }, h$2("form", { key: "24d68e11a81f94792218353822dd77fd7683c9f4", onSubmit: this.formSubmissionHandler, class: "scheduler-editor", ref: (Oe) => this.formRef = Oe, noValidate: !0 }, this.mode === "app" ? h$2("div", { class: "form-contents", part: "editor__form-contents net__form-contents" }, h$2("div", { class: "tabs", part: "editor__tabs net__tabs" }, h$2("button", { name: Tab.EventInfo, class: { tab: !0, active: this.activeTab == Tab.EventInfo, hide: this.hideTab(Tab.EventInfo) }, part: "editortab__event-info net__tab-event-info", onClick: (Oe) => this.setActiveTab(Oe, Tab.EventInfo) }, h$2("calendar-info-icon", { width: "16", height: "16" }), instance.t("eventInfoTab")), h$2("button", { name: Tab.Availability, class: { tab: !0, active: this.activeTab == Tab.Availability, hide: this.hideTab(Tab.Availability) }, part: "editortab__availability net__tab-availability", onClick: (Oe) => this.setActiveTab(Oe, Tab.Availability) }, h$2("calendar-patterns-icon", { width: "16", height: "16" }), instance.t("availabilityTab")), h$2("button", { name: Tab.Participants, class: { tab: !0, active: this.activeTab == Tab.Participants, hide: this.hideTab(Tab.Participants) }, part: "editortab__participants net__tab-participants", onClick: (Oe) => this.setActiveTab(Oe, Tab.Participants) }, h$2("people-icon", { width: "16", height: "16" }), instance.t("participantsTab")), h$2("button", { name: Tab.BookingOptions, class: { tab: !0, active: this.activeTab == Tab.BookingOptions, hide: this.hideTab(Tab.BookingOptions) }, part: "editortab__booking-options net__tab-booking-options", onClick: (Oe) => this.setActiveTab(Oe, Tab.BookingOptions) }, h$2("flow-icon", { width: "16", height: "16" }), instance.t("bookingOptionsTab")), h$2("button", { name: Tab.BookingForm, class: { tab: !0, active: this.activeTab == "bookingForm", hide: this.hideTab(Tab.BookingForm) }, part: "editortab__booking-form net__tab-booking-form", onClick: (Oe) => this.setActiveTab(Oe, Tab.BookingForm) }, this.activeTab == Tab.BookingForm ? h$2("calendar-agenda-fill-icon", { width: "16", height: "16" }) : h$2("calendar-agenda-icon", { width: "16", height: "16" }), instance.t("bookingFormTab")), h$2("button", { name: Tab.Communications, class: { tab: !0, active: this.activeTab == "communications", hide: this.hideTab(Tab.Communications) }, onClick: (Oe) => this.setActiveTab(Oe, Tab.Communications), part: "editortab__communications net__tab-communications" }, this.activeTab == Tab.Communications ? h$2("envelope-fill-icon", { width: "16", height: "16" }) : h$2("envelope-icon", { width: "16", height: "16" }), instance.t("communicationsTab")), h$2("button", { name: Tab.PageStyles, class: { tab: !0, active: this.activeTab == "pageStyles", hide: this.hideTab(Tab.PageStyles) }, onClick: (Oe) => this.setActiveTab(Oe, Tab.PageStyles), part: "editortab__page-styles net__tab-page-styles" }, this.activeTab == Tab.PageStyles ? h$2("paintbrush-fill-icon", { width: "16", height: "16" }) : h$2("paintbrush-icon", { width: "16", height: "16" }), instance.t("pageStylesTab"))), h$2("div", { class: "tab-content", part: "editor__tab-content net__tab-content" }, h$2(TabContents, { 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$2("div", { class: "composable", key: (ge = this.selectedConfiguration) == null ? void 0 : ge.id }, h$2("slot", null)), h$2("div", { key: "ba0dd27bf4d718ad8a62df1f79774f97993a39b5", class: "footer", part: "editor__footer net__footer" }, h$2("div", { key: "0e2787186678d9fdf18654220bf9b8b2fc430b8f", class: "preview", part: "editor__footer-preview net__footer-preview" }, this.enableUserFeedback && h$2("button-component", { title: "Share your feedback", id: "report-issue", variant: "basic", onClick: (Oe) => this.onFeedbackClick(Oe) }, h$2("feedback-icon", null))), h$2("div", { key: "f731ed68b6375274254947df08eacc1c6cc4685a", class: "buttons", part: "editor__footer-buttons net__footer-buttons" }, h$2("p", { key: "9bcf711385ae6cfc4341c7169f44c7e5e484c6e3", 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 ? "Unsaved changes" : this.error == "" && this.changesSaved ? "Changes saved!" : ""), this.schedulerPreviewLink !== "" && this.action === "edit" && h$2("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$2("eye-icon", null)), h$2("button-component", { key: "3de639b520a7f81d6413b77ad500f05a84db746d", type: "button", disabled: this.isLoading, clickHandler: (Oe) => {
+    }, variant: "basic" }, h$2("eye-icon", null)), h$2("button-component", { key: "3e4bf8e88e3b7e9d0e9088520dc1c053b0599bc6", 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$2("button-component", { key: "31a193032e345491ba94e1b229971b9ec343a184", type: "submit", disabled: this.isLoading, part: "editor__footer-cta, net__footer-cta" }, this.isLoading ? h$2("span", null, instance.t("savingButtonText"), h$2("loading-icon", null), " ") : this.action === "create" ? `${instance.t("createButtonText")}` : `${instance.t("saveChangesButtonText")}`)))), this.showFeedbackModal && h$2("nylas-feedback-form", null));
+    }, variant: "basic", part: "editor__footer-cancel net__footer-cancel" }, instance.t("backButton")), h$2("button-component", { key: "052505c068878815930d6ed19dda364a609212b8", type: "submit", disabled: this.isLoading, part: "editor__footer-cta, net__footer-cta" }, this.isLoading ? h$2("span", null, instance.t("savingButtonText"), h$2("loading-icon", null), " ") : this.action === "create" ? `${instance.t("createButtonText")}` : `${instance.t("saveChangesButtonText")}`)))), this.showFeedbackModal && h$2("nylas-feedback-form", null));
   }
   get host() {
     return this;

package/dist/cdn/nylas-scheduling/nylas-scheduling.es.js

@@ -19469,7 +19469,7 @@ function l9() {
     }
   });
 }
-const wR = ':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:100%}.checkbox-container{display:flex;flex-direction:column;gap:0.5rem}.checkbox-container p.error{color:var(--nylas-error);font-size:14px;font-weight:400;line-height:20px;font-family:var(--nylas-font-family);margin:0}label{display:flex;align-items:center;font-family:var(--nylas-font-family);cursor:pointer;position:relative;-webkit-user-select:none;-moz-user-select:none;-ms-user-select:none;user-select:none}label.readonly{cursor:not-allowed}label input[type=checkbox]{position:absolute;opacity:0;cursor:pointer;border:1px solid var(--nylas-base-300)}label input[type=checkbox]:focus~.checkmark,label input[type=checkbox]:hover~.checkmark{border-color:var(--nylas-primary)}label input[type=checkbox]:checked~.checkmark{color:var(--nylas-base-0);background:var(--nylas-primary) url(data:image/svg+xml;base64,PD94bWwgdmVyc2lvbj0iMS4wIiBlbmNvZGluZz0iVVRGLTgiIHN0YW5kYWxvbmU9Im5vIj8+DQo8c3ZnIHdpZHRoPSIxMiIgaGVpZ2h0PSI5IiB2aWV3Qm94PSIwIDAgMTIgOSIgeG1sbnM9Imh0dHA6Ly93d3cudzMub3JnLzIwMDAvc3ZnIj4NCiAgPHBhdGggZD0iTTQuNTc1IDguOTc3cy0uNDA0LS4wMDctLjUzNi0uMTY1TC4wNTcgNS42NGwuODI5LTEuMjI3TDQuNDcgNy4yNjggMTAuOTIxLjA4NmwuOTIzIDEuMTAzLTYuODYzIDcuNjRjLS4xMzQtLjAwMy0uNDA2LjE0OC0uNDA2LjE0OHoiIGZpbGw9IiNGRkYiIGZpbGwtcnVsZT0iZXZlbm9kZCIvPg0KPC9zdmc+) 50% 40% no-repeat;border:2px solid var(--nylas-primary)}label input[type=checkbox]:disabled{cursor:not-allowed;background:var(--nylas-base-100);border:1px solid var(--nylas-base-300)}label .checkmark{border-radius:var(--nylas-border-radius);border:2px solid var(--nylas-base-800);position:absolute;left:0;top:2px;width:18px;height:18px;cursor:pointer;pointer-events:none;-webkit-user-select:none;-moz-user-select:none;-ms-user-select:none;user-select:none}label .label{margin-left:32px;font-size:16px;font-weight:400;color:var(--nylas-base-800);line-height:24px}', TR = wR, CR = ee(class extends te {
+const wR = ':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:100%}.checkbox-container{display:flex;flex-direction:column;gap:0.5rem}.checkbox-container p.error{color:var(--nylas-error);font-size:14px;font-weight:400;line-height:20px;font-family:var(--nylas-font-family);margin:0}label{display:flex;align-items:center;font-family:var(--nylas-font-family);cursor:pointer;position:relative;-webkit-user-select:none;-moz-user-select:none;-ms-user-select:none;user-select:none}label.readonly{cursor:not-allowed}label span.required{color:var(--nylas-error);padding:0 0.25rem}label input[type=checkbox]{position:absolute;opacity:0;cursor:pointer;border:1px solid var(--nylas-base-300)}label input[type=checkbox]:focus~.checkmark,label input[type=checkbox]:hover~.checkmark{border-color:var(--nylas-primary)}label input[type=checkbox]:checked~.checkmark{color:var(--nylas-base-0);background:var(--nylas-primary) url(data:image/svg+xml;base64,PD94bWwgdmVyc2lvbj0iMS4wIiBlbmNvZGluZz0iVVRGLTgiIHN0YW5kYWxvbmU9Im5vIj8+DQo8c3ZnIHdpZHRoPSIxMiIgaGVpZ2h0PSI5IiB2aWV3Qm94PSIwIDAgMTIgOSIgeG1sbnM9Imh0dHA6Ly93d3cudzMub3JnLzIwMDAvc3ZnIj4NCiAgPHBhdGggZD0iTTQuNTc1IDguOTc3cy0uNDA0LS4wMDctLjUzNi0uMTY1TC4wNTcgNS42NGwuODI5LTEuMjI3TDQuNDcgNy4yNjggMTAuOTIxLjA4NmwuOTIzIDEuMTAzLTYuODYzIDcuNjRjLS4xMzQtLjAwMy0uNDA2LjE0OC0uNDA2LjE0OHoiIGZpbGw9IiNGRkYiIGZpbGwtcnVsZT0iZXZlbm9kZCIvPg0KPC9zdmc+) 50% 40% no-repeat;border:2px solid var(--nylas-primary)}label input[type=checkbox]:disabled{cursor:not-allowed;background:var(--nylas-base-100);border:1px solid var(--nylas-base-300)}label .checkmark{border-radius:var(--nylas-border-radius);border:2px solid var(--nylas-base-800);position:absolute;left:0;top:2px;width:18px;height:18px;cursor:pointer;pointer-events:none;-webkit-user-select:none;-moz-user-select:none;-ms-user-select:none;user-select:none}label .label{margin-left:32px;font-size:16px;font-weight:400;color:var(--nylas-base-800);line-height:24px}', TR = wR, CR = ee(class extends te {
   constructor() {
     super(), this.__registerHost(), this.__attachShadow(), this.nylasFormCheckboxToggled = W(this, "nylasFormCheckboxToggled", 7), this.componentType = "checkbox", this.name = "checkbox", this.checked = void 0, this.label = "", this.readOnly = !1, this.required = !1, this.isChecked = void 0, this.error = "";
   }
@@ -19483,11 +19483,7 @@ const wR = ':host{display:block;--nylas-primary:#2563eb;--nylas-error:#cc4841;--
     this.isChecked = this.checked || !1;
   }
   handleBookingFormSubmitted(e) {
-    if (this.required && !this.isChecked) {
-      this.error = `${this.label} is required.`;
-      return;
-    }
-    this.error && e.preventDefault();
+    this.required && !this.isChecked && (this.error = `${this.label} is required.`), this.error && e.preventDefault();
   }
   toggleCheck() {
     this.error = "", this.isChecked = !this.isChecked, this.nylasFormCheckboxToggled.emit({
@@ -19497,7 +19493,7 @@ const wR = ':host{display:block;--nylas-primary:#2563eb;--nylas-error:#cc4841;--
     });
   }
   render() {
-    return p("div", { key: "436d313659a2d88e1373028efa14ec4422fdeb53", class: "checkbox-container" }, p("label", { key: "9cf84f5a1fa7a35257681afc1bd2a215ebe36aad", title: this.readOnly ? "read-only field" : void 0, class: { readonly: this.readOnly } }, p("input", { key: "600422d052cd28de6f053fac93c9a753f32637c1", type: "checkbox", disabled: this.readOnly, readOnly: this.readOnly, name: this.name, title: this.readOnly ? "read-only field" : void 0, checked: this.isChecked, onChange: () => this.toggleCheck() }), p("span", { key: "a3130e18c64555c54cd73695d2392148ef8c49f6", class: "checkmark" }), p("slot", { key: "808de6e68a5c5887ba0ca3b5a997aae2aed035a2", name: "label" }, p("span", { key: "4cb5b6c8d3548976ba9e1e5a5269aad3773e642f", class: "label" }, this.label))), this.error && p("p", { class: "error" }, this.error));
+    return p("div", { key: "595e161a792173db6af97d3d7ef13cdca534052a", class: "checkbox-container" }, p("label", { key: "625bd67ceec40d979d5f4f74ec576569866ff6ec", title: this.readOnly ? "read-only field" : void 0, class: { readonly: this.readOnly } }, p("input", { key: "dc099ed0899a91fe30b67bb0f2981b8bd5254bbb", type: "checkbox", disabled: this.readOnly, readOnly: this.readOnly, name: this.name, title: this.readOnly ? "read-only field" : void 0, checked: this.isChecked, onChange: () => this.toggleCheck() }), p("span", { key: "032c931e0b256a9e948551c9d938e14339f4c45e", class: "checkmark" }), p("slot", { key: "d932f4a7c5aa7e680827beff46f1ff86ce50b1d9", name: "label" }, p("span", { key: "b5ce4490b7be93f936d3061145dcbe4489dd74c9", class: "label" }, this.label, this.required && p("span", { class: "required" }, "*")))), this.error && p("p", { class: "error" }, this.error));
   }
   get el() {
     return this;
@@ -20603,6 +20599,7 @@ const TL = ':host{display:block;--nylas-primary:#2563eb;--nylas-error:#cc4841;--
     this.validate(this.value), this.error && e.preventDefault();
   }
   handleInput(e) {
+    this.error = "";
     const t = e.target;
     this.value = Kt(t.value), this.nylasFormInputChanged.emit({
       value: this.value,
@@ -20616,7 +20613,7 @@ const TL = ':host{display:block;--nylas-primary:#2563eb;--nylas-error:#cc4841;--
     this.required && !e ? this.error = `${this.label} is required.` : e.length > this.maxLength ? this.error = `${this.label} cannot exceed ${this.maxLength} characters.` : this.error = "";
   }
   render() {
-    return p("label", { key: "383001bd48b1178b4c9126f812175701f570931e", part: "tc__label", class: { error: !!this.error } }, p("p", { key: "17dad29e1c19d24bfb5e1736630c6d43651f1616" }, p("span", { key: "d1077d0eab18709b12e714650a20057b17720ebd", class: "label" }, this.label), this.required && p("span", { class: "required" }, "*"), this.tooltip && p("tooltip-component", null, p("info-icon", { slot: "tooltip-icon" }), p("span", { slot: "tooltip-content" }, this.tooltip))), p("textarea", { key: "b35934b9027ac4c7d27a1720c471d698905e5f62", name: this.name, title: this.readOnly ? "read-only field" : void 0, placeholder: this.placeholder, readOnly: this.readOnly, autoFocus: this.autoFocus, value: this.value, maxLength: this.maxLength, onInput: (e) => this.handleInput(e), class: { error: !!this.error }, part: "tc__textarea" }), this.error && p("span", { class: "error help-text" }, this.error));
+    return p("label", { key: "3b3dd5b1c594e2c3b3594826b1f0379925dd14e9", part: "tc__label", class: { error: !!this.error } }, p("p", { key: "0a544d90a3b087c3479412078b1a454261bf20db" }, p("span", { key: "c37a9e870a3ebe502b2db7fbf0968178fc7cc519", class: "label" }, this.label), this.required && p("span", { class: "required" }, "*"), this.tooltip && p("tooltip-component", null, p("info-icon", { slot: "tooltip-icon" }), p("span", { slot: "tooltip-content" }, this.tooltip))), p("textarea", { key: "1be0e90961ebd6110bffd347a930884768429037", name: this.name, title: this.readOnly ? "read-only field" : void 0, placeholder: this.placeholder, readOnly: this.readOnly, autoFocus: this.autoFocus, value: this.value, maxLength: this.maxLength, onInput: (e) => this.handleInput(e), class: { error: !!this.error }, part: "tc__textarea" }), this.error && p("span", { class: "error help-text" }, this.error));
   }
   static get style() {
     return CL;
@@ -24506,8 +24503,8 @@ function Dz(n, e) {
   return ht().captureException(n, void 0);
 }
 function Mz(n, e) {
-  const i = { captureContext: e };
-  return ht().captureMessage(n, void 0, i);
+  const t = typeof e == "string" ? e : void 0, i = typeof e != "string" ? { captureContext: e } : void 0;
+  return ht().captureMessage(n, t, i);
 }
 function Z9(n, e) {
   return ht().captureEvent(n, e);
@@ -28664,15 +28661,23 @@ const wn = (n, e) => {
   }
   feedbackSubmittedHandler(e) {
     const i = {
-      eventId: Mz("Scheduling Page User Feedback"),
+      eventId: Mz("Scheduling Page User Feedback", {
+        extra: {
+          configId: this.configurationId,
+          slug: this.slug
+        }
+      }),
       message: e.detail.feedback
     };
     rA(i, {
       includeReplay: !0,
       captureContext: {
         tags: {
-          "nylas-web-element": "nylas-schduling",
-          "nylas-web-element-version": "1.3.5"
+          "nylas-web-element": "nylas-scheduling",
+          "nylas-web-element-version": "1.3.5",
+          "nylas-config-id": this.configurationId,
+          "nylas-slug": this.slug,
+          "host-url": window.location.href
         },
         extra: {
           configId: this.configurationId,