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

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

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

Files changed (876) hide show

package/dist/esm/calendar-info-icon_28.entry.js DELETED Viewed

@@ -1,2904 +0,0 @@
-import { r as registerInstance, h, c as createEvent, H as Host, a as getElement } from './index-7cb0dd3d.js';
-import { a as debug, y as timeToMinutes, z as convertTo12HourFormat, A as convertTo24HourFormat, B as minutesToTime, C as checkForMissingSlots, D as getBrowser, E as isNonPrintableKey } from './utils-f79fc8b5.js';
-import { R as RegisterComponent } from './register-component-a5a9ca5d.js';
-import { T as TIMEZONE_MAP, E as EVENT_TITLE_TOKENS } from './constants-f34b9c6e.js';
-import { s as sanitizeHtml } from './index-6d9eeb53.js';
-import './buffer-es6-aad332f1.js';
-import './_commonjsHelpers-57e89916.js';
-import './index-53420959.js';
-const iconCss$5 = ".sc-calendar-info-icon-h{display:flex}";
-const CalendarInfoIconStyle0 = iconCss$5;
-const CalendarInfoIcon = class {
-    constructor(hostRef) {
-        registerInstance(this, hostRef);
-        this.width = '20';
-        this.height = '20';
-    }
-    render() {
-        return (h("svg", { key: '9012ae7b873d35927c299ed62d247b77757bb679', width: this.width, height: this.height, fill: "none", xmlns: "http://www.w3.org/2000/svg" }, h("path", { key: '0a3a11d84c99d05ad964d3b5606c072dd31872a7', d: "M12 0C13.3807 0 14.5 1.11929 14.5 2.5V6.59971C14.1832 6.43777 13.8486 6.30564 13.5 6.20703V4H1.5V11.5C1.5 12.3284 2.17157 13 3 13H6.70703C6.80564 13.3486 6.93777 13.6832 7.09971 14H3C1.61929 14 0.5 12.8807 0.5 11.5V2.5C0.5 1.11929 1.61929 0 3 0H12ZM12 1H3C2.17157 1 1.5 1.67157 1.5 2.5V3H13.5V2.5C13.5 1.67157 12.8284 1 12 1ZM11.375 9.5C11.375 9.15482 11.6548 8.875 12 8.875C12.3452 8.875 12.625 9.15482 12.625 9.5C12.625 9.84518 12.3452 10.125 12 10.125C11.6548 10.125 11.375 9.84518 11.375 9.5ZM12.5 13.5C12.5 13.7761 12.2761 14 12 14C11.7239 14 11.5 13.7761 11.5 13.5V11.5C11.5 11.2239 11.7239 11 12 11C12.2761 11 12.5 11.2239 12.5 11.5V13.5ZM7.5 11.5C7.5 9.01472 9.51472 7 12 7C14.4853 7 16.5 9.01472 16.5 11.5C16.5 13.9853 14.4853 16 12 16C9.51472 16 7.5 13.9853 7.5 11.5ZM8.5 11.5C8.5 13.433 10.067 15 12 15C13.933 15 15.5 13.433 15.5 11.5C15.5 9.567 13.933 8 12 8C10.067 8 8.5 9.567 8.5 11.5Z", fill: "currentColor" })));
-    }
-};
-CalendarInfoIcon.style = CalendarInfoIconStyle0;
-const iconCss$4 = ".sc-calendar-patterns-icon-h{display:flex}";
-const CalendarPatternsIconStyle0 = iconCss$4;
-const CalendarPatternsIcon = class {
-    constructor(hostRef) {
-        registerInstance(this, hostRef);
-        this.width = '20';
-        this.height = '20';
-    }
-    render() {
-        return (h("svg", { key: 'ca6df3db90bbbffc29dfdc6ee5a440266eaa153d', width: this.width, height: this.height, fill: "none", xmlns: "http://www.w3.org/2000/svg" }, h("path", { key: 'ab45118ff407127ca1673159e1b78c93c7c97bed', d: "M3.25 0H11.75C13.2688 0 14.5 1.23122 14.5 2.75V11.25C14.5 12.7688 13.2688 14 11.75 14H3.25C1.73122 14 0.5 12.7688 0.5 11.25V2.75C0.5 1.23122 1.73122 0 3.25 0ZM2 2.75V4H13V2.75C13 2.05964 12.4404 1.5 11.75 1.5H3.25C2.55964 1.5 2 2.05964 2 2.75ZM12.2071 5L8.20711 9H10.7929L13 6.79289V5H12.2071ZM10.7929 5H8.20711L4.20711 9H6.79289L10.7929 5ZM2.79289 9L6.79289 5H4.20711L2 7.20711V9H2.79289ZM2 5.79289L2.79289 5H2V5.79289ZM12.2071 9H13V8.20711L12.2071 9Z", fill: "currentColor" })));
-    }
-};
-CalendarPatternsIcon.style = CalendarPatternsIconStyle0;
-const checkboxComponentCss = "label{--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;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 input[type=checkbox]{position:absolute;opacity:0;cursor:pointer}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 .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}";
-const CheckboxComponentStyle0 = checkboxComponentCss;
-const CheckboxComponent = class {
-    constructor(hostRef) {
-        registerInstance(this, hostRef);
-        this.nylasFormCheckboxToggled = createEvent(this, "nylasFormCheckboxToggled", 7);
-        this.name = 'checkbox';
-        this.checked = false;
-        this.label = '';
-        this.isChecked = this.checked;
-    }
-    componentWillLoad() {
-        this.isChecked = this.checked;
-    }
-    toggleCheck() {
-        this.isChecked = !this.isChecked;
-        this.nylasFormCheckboxToggled.emit({
-            checked: this.isChecked,
-            name: this.name,
-            label: this.label,
-        });
-    }
-    render() {
-        return (h("label", { key: 'ff418217723b6044270dc691f7d0e11aea5fb204' }, h("input", { key: 'c45008c89d147534ba6b4a70120b7c5159a25ce6', type: "checkbox", name: this.name, checked: this.isChecked, onChange: () => this.toggleCheck() }), h("span", { key: 'a785e711233dab04bb19bcf1f1c6f665d7460015', class: "checkmark" }), h("slot", { key: '05e7f91a9e038bf9a467d63c9c004f7b90454b6f', name: "label" }, h("span", { key: '35a5c8bef4f998f993fbdcf2b752b83432218422', class: "label" }, this.label))));
-    }
-};
-CheckboxComponent.style = CheckboxComponentStyle0;
-const iconCss$3 = ".sc-flow-icon-h{display:flex}";
-const FlowIconStyle0 = iconCss$3;
-const FlowIcon = class {
-    constructor(hostRef) {
-        registerInstance(this, hostRef);
-        this.width = '16';
-        this.height = '12';
-    }
-    render() {
-        return (h("svg", { key: '18bdb1e3a2d6d1f4b9f9e1983c1ad7156e83e489', width: this.width, height: this.height, fill: "none", xmlns: "http://www.w3.org/2000/svg" }, h("path", { key: 'a291353c08dfca6bb961e83386a3bfe71a840299', d: "M13 1.66211C11.8954 1.66211 11 2.55754 11 3.66211C11 4.76668 11.8954 5.66211 13 5.66211C14.1046 5.66211 15 4.76668 15 3.66211C15 2.55754 14.1046 1.66211 13 1.66211ZM10.0407 3.16678C10.2768 1.74563 11.5119 0.662109 13 0.662109C14.6569 0.662109 16 2.00526 16 3.66211C16 5.31896 14.6569 6.66211 13 6.66211C11.5162 6.66211 10.2839 5.58482 10.0428 4.16971C9.37629 4.23688 8.82682 4.7426 8.71466 5.41551L8.27173 8.07311C8.07929 9.22776 7.11428 10.087 5.9593 10.1574C5.72319 11.5786 4.48813 12.6621 3 12.6621C1.34315 12.6621 0 11.319 0 9.66211C0 8.00526 1.34315 6.66211 3 6.66211C4.48384 6.66211 5.71607 7.73939 5.95724 9.15451C6.62371 9.08734 7.17318 8.58162 7.28534 7.90871L7.72827 5.25111C7.92071 4.09646 8.88571 3.23718 10.0407 3.16678ZM3 7.66211C1.89543 7.66211 1 8.55754 1 9.66211C1 10.7667 1.89543 11.6621 3 11.6621C4.10457 11.6621 5 10.7667 5 9.66211C5 8.55754 4.10457 7.66211 3 7.66211Z", fill: "currentColor" })));
-    }
-};
-FlowIcon.style = FlowIconStyle0;
-const iconCss$2 = ".sc-location-icon-h{display:flex}";
-const LocationIconStyle0 = iconCss$2;
-const LocationIcon = class {
-    constructor(hostRef) {
-        registerInstance(this, hostRef);
-        this.width = '16';
-        this.height = '18';
-    }
-    render() {
-        return (h("svg", { key: 'c4b6ed753f7c3c3e26ae2fe2e92b429abe4eceb4', width: this.width, height: this.height, fill: "none", xmlns: "http://www.w3.org/2000/svg" }, h("path", { key: 'cff1afc5e511a814bfc16fc7c8fdaef6356a7952', d: "M10 7.66211C10 9.31896 8.65685 10.6621 7 10.6621C5.34315 10.6621 4 9.31896 4 7.66211C4 6.00526 5.34315 4.66211 7 4.66211C8.65685 4.66211 10 6.00526 10 7.66211ZM9 7.66211C9 6.55754 8.10457 5.66211 7 5.66211C5.89543 5.66211 5 6.55754 5 7.66211C5 8.76668 5.89543 9.66211 7 9.66211C8.10457 9.66211 9 8.76668 9 7.66211ZM11.9497 12.6171C14.6834 9.88221 14.6834 5.44812 11.9497 2.71326C9.21608 -0.0216067 4.78392 -0.0216067 2.05025 2.71326C-0.683418 5.44812 -0.683418 9.88221 2.05025 12.6171L3.57128 14.1159L5.61408 16.101L5.74691 16.2188C6.52168 16.8468 7.65623 16.8076 8.38611 16.1012L10.8223 13.7312L11.9497 12.6171ZM2.75499 3.4183C5.09944 1.07282 8.90055 1.07282 11.245 3.4183C13.5294 5.70364 13.5879 9.3725 11.4207 11.7288L11.245 11.912L9.92371 13.216L7.69315 15.3846L7.60016 15.4642C7.24594 15.732 6.7543 15.732 6.40012 15.4642L6.30713 15.3845L3.3263 12.4791L2.75499 11.912L2.57927 11.7288C0.412077 9.3725 0.47065 5.70364 2.75499 3.4183Z", fill: "currentColor" })));
-    }
-};
-LocationIcon.style = LocationIconStyle0;
-const iconCss$1 = ".sc-location-off-icon-h{display:flex}";
-const LocationOffIconStyle0 = iconCss$1;
-const LocationOffIcon = class {
-    constructor(hostRef) {
-        registerInstance(this, hostRef);
-        this.width = '16';
-        this.height = '18';
-    }
-    render() {
-        return (h("svg", { key: 'b7eb987c802beac155700ccbd2c51189708f3422', width: this.width, height: this.height, fill: "none", xmlns: "http://www.w3.org/2000/svg" }, h("path", { key: '91e1d8458400d7d502def34ce86611fc17110cb4', d: "M0.146447 0.808556C0.341709 0.613294 0.658291 0.613294 0.853553 0.808556L15.8536 15.8086C16.0488 16.0038 16.0488 16.3204 15.8536 16.5157C15.6583 16.7109 15.3417 16.7109 15.1464 16.5157L12.0938 13.463L11.8223 13.7312L9.38611 16.1012C8.65623 16.8076 7.52168 16.8468 6.74691 16.2188L6.61408 16.101L4.57128 14.1159L3.05025 12.6171C0.607421 10.1732 0.347525 6.37239 2.27056 3.63976L0.146447 1.51566C-0.0488155 1.3204 -0.0488155 1.00382 0.146447 0.808556ZM9.07768 10.4469C8.74346 10.576 8.38024 10.6468 8.0005 10.6468C6.34839 10.6468 5.00909 9.30689 5.00909 7.65406C5.00909 7.27461 5.07967 6.91166 5.20843 6.57763L2.98793 4.35713C1.49206 6.62038 1.68917 9.67377 3.57927 11.7288L3.75499 11.912L4.3263 12.4791L7.30713 15.3845L7.40012 15.4642C7.7543 15.732 8.24594 15.732 8.60016 15.4642L8.69315 15.3846L10.9237 13.216L11.3883 12.7575L9.07768 10.4469ZM9.85409 8.39486L10.5983 9.13904C10.8487 8.70143 10.9919 8.19447 10.9919 7.65406C10.9919 6.00122 9.65261 4.66134 8.0005 4.66134C7.45986 4.66134 6.95271 4.80482 6.51504 5.05581L7.25921 5.79998C7.48839 5.70819 7.73855 5.6577 8.0005 5.6577C9.10258 5.6577 9.99599 6.5515 9.99599 7.65406C9.99599 7.91581 9.94564 8.16581 9.85409 8.39486ZM4.35291 2.89368C6.70671 1.08827 10.0908 1.26314 12.245 3.4183C14.3986 5.57283 14.5739 8.95702 12.771 11.3118L13.4812 12.022C15.6702 9.27273 15.493 5.25762 12.9497 2.71326C10.4058 0.168159 6.39081 -0.00843871 3.64269 2.18347L4.35291 2.89368Z", fill: "currentColor" })));
-    }
-};
-LocationOffIcon.style = LocationOffIconStyle0;
-const multiSelectDropdownCss = ":host{display:block;width:inherit;--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}.dropdown{display:inline-block;width:100%;position:relative}.dropdown .dropdown-label{display:flex;align-items:center;gap:0.25rem;color:var(--nylas-base-800)}.dropbtn{width:inherit;height:48px;color:black;padding:0.5rem;font-size:1rem;cursor:pointer;display:flex;gap:0.5rem;justify-content:space-between;align-items:center;background:transparent;border:1px solid var(--nylas-base-200);border-radius:var(--nylas-border-radius-2x)}.dropbtn.focus{background:transparent}.dropbtn:hover,.dropbtn:active{border:1px solid var(--nylas-primary)}.dropbtn:active{outline:2px solid var(--nylas-primary)}.dropbtn span.open{transform:rotate(90deg)}.dropbtn span.closed{transform:rotate(270deg)}.dropdown-content{display:block;margin-top:0.5rem;background-color:var(--nylas-base-0);width:100%;max-height:336px;overflow:auto;border:1px solid #ddd;z-index:1;border-radius:4px;position:absolute;box-shadow:0px 4px 6px -2px rgba(0, 0, 0, 0.0509803922);box-shadow:0px 10px 15px -3px rgba(0, 0, 0, 0.1019607843)}.dropdown-content ul{padding:0;list-style-type:none;color:var(--nylas-base-900);max-height:336px}.dropdown-content ul li{padding:16px, 12px, 16px, 12px;color:black;padding:12px 16px;text-decoration:none;display:block;font-family:inherit;font-size:14px;font-weight:400;line-height:20px;letter-spacing:0px;text-align:left;cursor:pointer}.dropdown-content ul li:hover,.dropdown-content ul li:focus{background-color:var(--nylas-base-100)}.dropdown-content ul li label{display:flex;align-items:center;gap:0.5rem}.dropdown-content ul li label input{margin:0}.selected-options{display:flex;flex-wrap:wrap;gap:0.5rem;padding:0.5rem 0;margin-top:0.25rem;background:var(--nylas-base-0)}.selected-options .selected-option{display:flex;align-items:center;gap:0.5rem;padding:4px 8px;border-radius:var(--nylas-border-radius-2x);background:var(--nylas-base-100);color:var(--nylas-base-800);font-size:16px;font-weight:500;line-height:1.5rem;letter-spacing:0.5px}.selected-options .selected-option button{background:transparent;border:none;cursor:pointer;padding:0}.selected-options .selected-option button:hover{color:var(--nylas-primary)}";
-const MultiSelectDropdownStyle0 = multiSelectDropdownCss;
-const MultiSelectDropdown = class {
-    constructor(hostRef) {
-        registerInstance(this, hostRef);
-        this.selectedOptionsChanged = createEvent(this, "selectedOptionsChanged", 7);
-        this.name = undefined;
-        this.label = undefined;
-        this.options = [];
-        this.availableOptions = this.options;
-        this.isOpen = false;
-        this.ariaActivedescendant = '';
-        this.shouldFocusFirstOption = false;
-    }
-    componentDidRender() {
-        debug('multi-select-dropdown', 'componentDidRender');
-        if (this.isOpen && this.shouldFocusFirstOption) {
-            this.ariaActivedescendant = this.availableOptions[0].value;
-            this.focusOption(0);
-            this.shouldFocusFirstOption = false;
-        }
-    }
-    handleOutsideClick(event) {
-        const path = event.composedPath();
-        const isClickInside = path.includes(this.el);
-        if (!isClickInside && this.isOpen) {
-            this.isOpen = false;
-        }
-    }
-    selectOption(option) {
-        this.availableOptions = this.availableOptions.map(o => {
-            if (o.value === option.value) {
-                o.selected = option.selected ? false : true;
-            }
-            return o;
-        });
-        const selectedOptions = this.availableOptions.filter(o => o.selected).map(o => o.value);
-        this.selectedOptionsChanged.emit({
-            value: selectedOptions,
-            name: this.name,
-        });
-    }
-    toggleDropdown() {
-        this.isOpen = !this.isOpen;
-        if (this.isOpen) {
-            this.shouldFocusFirstOption = true;
-        }
-        else {
-            this.ariaActivedescendant = '';
-        }
-    }
-    handleSelectButtonKeyDown(event) {
-        switch (event.key) {
-            case 'ArrowDown':
-            case 'Enter':
-                event.preventDefault();
-                if (!this.isOpen) {
-                    this.toggleDropdown();
-                }
-                break;
-            case 'Escape':
-                this.isOpen = false;
-                break;
-        }
-    }
-    handleListboxKeydown(e) {
-        const items = this.availableOptions;
-        const currentIndex = items.findIndex(item => item.value === this.ariaActivedescendant);
-        switch (e.key) {
-            case 'ArrowDown':
-            case 'Tab':
-                if (!e.shiftKey) {
-                    e.preventDefault();
-                    const nextIndex = currentIndex + 1 < items.length ? currentIndex + 1 : 0;
-                    this.ariaActivedescendant = items[nextIndex].value;
-                    this.focusOption(nextIndex);
-                }
-                else {
-                    e.preventDefault();
-                    const prevIndex = currentIndex - 1 >= 0 ? currentIndex - 1 : items.length - 1;
-                    this.ariaActivedescendant = items[prevIndex].value;
-                    this.focusOption(prevIndex);
-                }
-                break;
-            case 'ArrowUp':
-                e.preventDefault();
-                const prevIndex = currentIndex - 1 >= 0 ? currentIndex - 1 : items.length - 1;
-                this.ariaActivedescendant = items[prevIndex].value;
-                this.focusOption(prevIndex);
-                break;
-            case 'Enter':
-                e.preventDefault();
-                if (this.ariaActivedescendant) {
-                    this.selectOption(items[currentIndex]);
-                }
-                break;
-            case 'Escape':
-                this.isOpen = false;
-                break;
-        }
-    }
-    focusOption(index) {
-        const option = this.availableOptions[index];
-        if (!option)
-            return;
-        const elementId = option.value;
-        const element = this.el.shadowRoot?.getElementById(elementId);
-        if (element) {
-            element.focus();
-            element.scrollIntoView({ behavior: 'smooth', block: 'nearest' });
-        }
-    }
-    getSelectedOptions() {
-        return this.availableOptions.filter(option => option.selected);
-    }
-    renderOption(option) {
-        return (h("li", { key: option.value, id: option.value, role: "option", tabindex: "0", "aria-selected": option.selected ? 'true' : 'false', onClick: e => {
-                e.stopImmediatePropagation();
-                this.selectOption(option);
-            }, class: { selected: !!option.selected } }, h("label", { htmlFor: option.value }, h("input", { "aria-hidden": "true", id: option.value, type: "checkbox", checked: option.selected }), h("span", null, option.label))));
-    }
-    render() {
-        return (h(Host, { key: 'af0befb6c6c059e41a99ebe56c9632e6445e897b' }, h("div", { key: 'e93abae0184670a75caa02b4f687a374fce9a055', class: "dropdown", part: "msd_dropdown" }, h("label", { key: 'cb7ab81e0c7e23934dfc814a4c5281470e2ad510', class: "dropdown-label" }, this.label, h("slot", { key: '88fdcec62b47bf2b7da977c06b36300722789373', name: "label-icon", "aria-hidden": "true" })), h("button", { key: '17e03081353c32b5f571e7655fbe7b0c2ea87a35', part: "msd_dropdown-button", class: { dropbtn: true, open: this.isOpen }, onClick: () => this.toggleDropdown(), "aria-haspopup": "listbox", "aria-expanded": this.isOpen ? 'true' : 'false', "aria-label": this.name, onKeyDown: e => this.handleSelectButtonKeyDown(e) }, h("slot", { key: 'f1925d4d315c6be091a07f18261e574792883fd7', name: "select-icon", "aria-hidden": "true" }), h("span", { key: '02c03946856eed3b6207ec84abbba0d16554af9f', class: "selected-option", part: "msd_dropdown-button-selected-label" }, this.getSelectedOptions().length > 1
-            ? `Multiple ${this.name}s selected`
-            : this.availableOptions.filter(o => o.selected)[0]?.label ?? this.availableOptions[0]?.label), h("span", { key: 'bbd36a37a7ee28e299da6b22612206e4bbbcf8db', class: this.isOpen ? 'open' : 'closed', "aria-hidden": "true" }, h("chevron-icon", { key: '4e6f9c3dfd33c8d87b9584648487783e417961c6', width: "16", height: "16" }))), this.isOpen ? null : (h("div", { class: 'selected-options' }, this.getSelectedOptions().map(option => (h("span", { class: "selected-option" }, option.label, h("button", { key: option.label, onClick: () => this.selectOption(option) }, h("close-icon", null))))))), this.isOpen ? (h("div", { class: "dropdown-content", part: "msd_dropdown-content" }, h("ul", { tabindex: "-1", role: "listbox", "aria-label": this.name, "aria-multiselectable": true, "aria-activedescendant": this.ariaActivedescendant, onKeyDown: e => this.handleListboxKeydown(e) }, this.availableOptions.map(option => this.renderOption(option))))) : null)));
-    }
-    get el() { return getElement(this); }
-};
-MultiSelectDropdown.style = MultiSelectDropdownStyle0;
-const nylasAdditionalParticipantsCss = ":host{display:block;margin:1rem;--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}.nylas-additional-participants__title{color:var(--nylas-base-nylas-base-900-aaa, #101323);font-size:16px;font-style:normal;font-weight:600;line-height:20px;margin:0;text-align:left}.nylas-additional-participants__subtitle{color:var(--nylas-base-600);font-size:14px;font-style:normal;font-weight:400;line-height:20px;margin:0.25rem 0px 0px;text-align:left}.nylas-additional-participants__content{padding:1rem;display:flex;flex-direction:column;gap:1rem}.nylas-additional-participants__input_group{padding-top:8px;display:flex;flex-direction:column;gap:4px}.nylas-additional-participants__input_group label{display:flex;align-items:center;color:var(--nylas-base-800);font-size:14px;font-style:normal;font-weight:400;line-height:150%}.nylas-additional-participants__input_wrapper{display:flex;border-width:1;border-radius:8px;border:1px solid var(--nylas-base-300)}.nylas-additional-participants__input_wrapper button{padding:12px;border:none;border-left:1px solid var(--nylas-base-300);background:none;cursor:pointer}.nylas-additional-participants__input_wrapper button:hover,.nylas-additional-participants__input_wrapper button:active{color:var(--nylas-primary)}.nylas-additional-participants__input_wrapper_organizer{background:var(--nylas-base-50)}.nylas-additional-participants__input{flex:1;display:flex;justify-content:space-between}.nylas-additional-participants__input.organizer{padding:12px 16px}.nylas-additional-participants__input input{border:none;outline:none;background:none;width:100%}.nylas-additional-participants__input input-dropdown{width:100%}.nylas-additional-participants__input input-dropdown::part(id_dropdown){width:100%;height:100%}.nylas-additional-participants__input input-dropdown::part(id_dropdown-input){height:100%;border-radius:var(--nylas-border-radius-2x);border:none;border-top-right-radius:initial;border-bottom-right-radius:initial;padding-left:16px}.nylas-additional-participants__add{padding:12px;display:flex;align-items:center;border:none;background:none;cursor:pointer}.nylas-additional-participants__add span{padding:0 8px;font-size:16px;font-style:normal;font-weight:500}.nylas-additional-participants__add:hover,.nylas-additional-participants__add:active{color:var(--nylas-primary)}";
-const NylasAdditionalParticipantsStyle0 = nylasAdditionalParticipantsCss;
-var __decorate$h = (undefined && undefined.__decorate) || function (decorators, target, key, desc) {
-    var c = arguments.length, r = c < 3 ? target : desc === null ? desc = Object.getOwnPropertyDescriptor(target, key) : desc, d;
-    if (typeof Reflect === "object" && typeof Reflect.decorate === "function")
-        r = Reflect.decorate(decorators, target, key, desc);
-    else
-        for (var i = decorators.length - 1; i >= 0; i--)
-            if (d = decorators[i])
-                r = (c < 3 ? d(r) : c > 3 ? d(target, key, r) : d(target, key)) || r;
-    return c > 3 && r && Object.defineProperty(target, key, r), r;
-};
-var __metadata$h = (undefined && undefined.__metadata) || function (k, v) {
-    if (typeof Reflect === "object" && typeof Reflect.metadata === "function")
-        return Reflect.metadata(k, v);
-};
-const NylasAdditionalParticipants = class {
-    constructor(hostRef) {
-        registerInstance(this, hostRef);
-        this.valueChanged = createEvent(this, "valueChanged", 7);
-        if (hostRef.$hostElement$["s-ei"]) {
-            this.internals = hostRef.$hostElement$["s-ei"];
-        }
-        else {
-            this.internals = hostRef.$hostElement$.attachInternals();
-            hostRef.$hostElement$["s-ei"] = this.internals;
-        }
-        this.name = 'participants';
-        this.eventParticipants = undefined;
-        this.participantOptions = undefined;
-        this.participants = this.eventParticipants ?? [];
-        this.participantsValid = true;
-    }
-    elementNameChangedHandler(newValue) {
-        debug('nylas-additional-participants', 'elementNameChangedHandler', newValue);
-        this.host.setAttribute('name', newValue);
-    }
-    connectedCallback() {
-        debug('nylas-additional-participants', 'connectedCallback');
-    }
-    componentWillLoad() {
-        debug('nylas-additional-participants', 'componentWillLoad');
-        this.host.setAttribute('name', this.name);
-    }
-    componentDidLoad() {
-        debug('nylas-additional-participants', 'componentDidLoad');
-        this.updateFormValue();
-    }
-    disconnectedCallback() {
-        debug('nylas-additional-participants', 'disconnectedCallback');
-    }
-    onInputOptionChanged(event) {
-        debug('nylas-additional-participants', 'onInputOptionChanged');
-        const index = event.detail.name;
-        this.participants[index].email = event.detail.value;
-        const participant = this.participantOptions?.find(participant => participant.email === event.detail.value);
-        this.participants[index].availability = participant ? { calendar_ids: ['primary'] } : undefined;
-        this.participants[index].name = participant?.name || event.detail.value;
-        this.participants = [...this.participants];
-        this.updateFormValue();
-    }
-    onParticipantChange(event, index) {
-        debug('nylas-additional-participants', 'onParticipantChange');
-        this.participants[index].email = event.target.value;
-        this.updateFormValue();
-    }
-    addParticipant() {
-        debug('nylas-additional-participants', 'addParticipant');
-        this.participants = [...this.participants, { name: '', email: '', is_organizer: false }];
-        this.updateFormValue();
-    }
-    removeParticipant(index) {
-        debug('nylas-additional-participants', 'removeParticipant');
-        this.participants = this.participants.filter((_, i) => i !== index);
-        this.updateFormValue();
-    }
-    validate(email, index) {
-        debug('nylas-additional-participants', 'validate');
-        const regex = /^(([^<>()\[\]\\.,;:\s@"]+(\.[^<>()\[\]\\.,;:\s@"]+)*)|(".+"))@((\[[0-9]{1,3}\.[0-9]{1,3}\.[0-9]{1,3}\.[0-9]{1,3}])|(([a-zA-Z\-0-9]+\.)+[a-zA-Z]{2,}))$/;
-        const valid = regex.test(String(email).toLowerCase());
-        this.participants[index].is_valid = valid;
-        this.updateFormValue();
-    }
-    updateFormValue() {
-        debug('nylas-additional-participants', 'updateFormValue');
-        this.internals.setFormValue(JSON.stringify(this.participants), this.name);
-        this.valueChanged.emit({ value: JSON.stringify(this.participants), name: this.name });
-    }
-    getArrayDifference(array1, array2) {
-        const filtered = array1.filter(participant1 => !array2.some(participant2 => participant1.email === participant2.email));
-        return filtered.map(participant => {
-            return { value: participant.email, label: participant.email };
-        });
-    }
-    render() {
-        return (h(Host, { key: '30915e4727e68b0652fc265ced20a3fce93f94d7' }, h("nylas-form-card", { key: 'e652c77a0e382aeaab234593ad1cd8fa6cc1b858' }, h("h3", { key: 'ee6d3ac07461ef43976e32069cd978a2dc32ba96', slot: "header-title", class: "nylas-additional-participants__title", part: "nap__title" }, "Additional participants"), h("p", { key: '72d712c00b839ad8220ea23cce11cfc233cf14b5', slot: "header-subtitle", class: "nylas-additional-participants__subtitle", part: "nap__subtitle" }, "Add anyone else who would be joining for this event."), h("div", { key: '87b08e14dc5a16b2381728263e079c46545284f4', slot: "content", class: "nylas-additional-participants__content" }, h("div", { key: 'da67ac11f9c977007ce885531bcdcbf9c59aca0c' }, this.participants.map((participant, index) => {
-            return (h("div", { class: 'nylas-additional-participants__input_group', part: "nap__input_group" }, h("label", null, participant.is_organizer ? 'Organizer' : `Participant ${index}`), h("div", { part: "nap__input_wrapper", class: `nylas-additional-participants__input_wrapper ${participant.is_organizer && 'nylas-additional-participants__input_wrapper_organizer'} ${participant.is_valid === false && 'nylas-additional-participants__input_wrapper_invalid'}` }, h("div", { class: { 'nylas-additional-participants__input': true, 'organizer': participant.is_organizer }, part: "nap__input" }, participant.is_organizer ? (h("input", { type: "text", value: participant.email, onInput: e => {
-                    this.onParticipantChange(e, index);
-                }, readOnly: participant.is_organizer, onBlur: () => this.validate(participant.email, index) })) : (h("input-dropdown", { name: `${index}`, filterable: true, inputValue: participant.email, options: this.getArrayDifference(this.participantOptions || [], this.participants) })), !participant.is_organizer && (h("button", { onClick: () => this.removeParticipant(index), part: "nap__remove-participant" }, h("close-icon", null)))))));
-        })), h("button", { key: 'dd0f412f9affa5cf2b3ab5a331365d5b217e1ade', class: "nylas-additional-participants__add", part: "nap__add-participant", onClick: () => this.addParticipant() }, h("add-circle-icon", { key: '089167b221913ef3e0393efa23db2698a93b3e73' }), " ", h("span", { key: '70860b8258a871e714f2f33890d35ec46835f349' }, "Add ", this.participants.length > 1 ? 'another' : 'a', " participant"))))));
-    }
-    static get formAssociated() { return true; }
-    get host() { return getElement(this); }
-    static get watchers() { return {
-        "name": ["elementNameChangedHandler"]
-    }; }
-};
-__decorate$h([
-    RegisterComponent({
-        name: 'nylas-additional-participants',
-        stateToProps: new Map([['schedulerConfig.additionalParticipants', 'participantOptions']]),
-        eventToProps: {},
-        fireRegisterEvent: true,
-    }),
-    __metadata$h("design:type", Function),
-    __metadata$h("design:paramtypes", []),
-    __metadata$h("design:returntype", void 0)
-], NylasAdditionalParticipants.prototype, "render", null);
-NylasAdditionalParticipants.style = NylasAdditionalParticipantsStyle0;
-const nylasAvailabilityPickerCss = ":host{display:block;--nylas-primary:#2563eb;--nylas-error:#cc4841;--nylas-error-pressed:#992222;--nylas-wraning:#f06c00;--nylas-success:#16a392;--nylas-info:#2b8fc2;--nylas-base-0:#ffffff;--nylas-base-25:#fcfcfd;--nylas-base-50:#f8f9fc;--nylas-base-100:#eaecf5;--nylas-base-200:#d5d9eb;--nylas-base-300:#b3b8d8;--nylas-base-400:#717bbc;--nylas-base-500:#4e5ba6;--nylas-base-600:#3e4784;--nylas-base-700:#263f72;--nylas-base-800:#293056;--nylas-base-900:#101323;--nylas-base-950:#0e101b;--nylas-border-radius:0.25rem;--nylas-border-radius-2x:0.5rem;--nylas-border-radius-3x:0.75rem;--nylas-font-family:\"Inter\", sans-serif;width:inherit}.nylas-availability-picker{width:inherit;display:flex;flex-direction:column;margin:1rem;border-radius:var(--nylas-border-radius-2x);border:1px solid var(--nylas-base-200)}.nylas-availability-picker .header{padding:1rem}.nylas-availability-picker .header h3{margin:0;font-size:16px;font-weight:600;line-height:20px;color:var(--nylas-base-900);text-align:left}.nylas-availability-picker .header p{margin:0.25rem 0 0 0;font-size:0.875rem;font-weight:400;line-height:20px;color:var(--nylas-base-600);text-align:left}.nylas-availability-picker .content{padding:1rem;color:var(--nylas-base-900);font-size:16px;font-family:var(--nylas-font-family);border-top:1px solid var(--nylas-base-200)}@media screen and (max-width: 504px){.nylas-availability-picker .content{font-size:15px}}.nylas-availability-picker .content .select-timezone{display:flex;justify-content:space-between;align-items:center;border-bottom:1px solid var(--nylas-base-200);padding-bottom:1rem;gap:1rem}.nylas-availability-picker .content .select-timezone h4{display:flex;gap:0.5rem;align-items:center;margin:0;font-size:16px;font-weight:500;line-height:20px}@media screen and (max-width: 504px){.nylas-availability-picker .content .select-timezone h4{font-size:15px}}.nylas-availability-picker .content .availability{display:flex;flex-direction:column;gap:1rem;padding:0 0.5rem;margin:1rem 0}@media screen and (max-width: 504px){.nylas-availability-picker .content .availability{gap:0.5rem;padding:0}}.nylas-availability-picker .content .availability .availability-day{display:grid;grid-template-columns:minmax(auto, 65px) 1fr minmax(auto, 40px);gap:1rem;align-items:baseline}@media screen and (max-width: 768px){.nylas-availability-picker .content .availability .availability-day{grid-template-columns:78px 1fr auto}}@media screen and (max-width: 504px){.nylas-availability-picker .content .availability .availability-day{display:inline-grid;gap:8px;grid-template-columns:60px 1fr auto}}.nylas-availability-picker .content .availability .availability-day .day{display:flex;gap:0.5rem;align-items:center}@media screen and (max-width: 504px){.nylas-availability-picker .content .availability .availability-day .day{gap:0.25rem}}.nylas-availability-picker .content .availability .availability-day .day input[type=checkbox]{transform:scale(1.3)}.nylas-availability-picker .content .availability .availability-day .time-ranges span.unavailable{height:48px;display:flex;align-items:center;justify-content:center}.nylas-availability-picker .content .availability .availability-day .time-ranges .time-range{display:flex;gap:1.5rem;justify-content:space-between;align-items:baseline}@media screen and (max-width: 504px){.nylas-availability-picker .content .availability .availability-day .time-ranges .time-range{justify-content:unset;gap:0.5rem}}.nylas-availability-picker .content .availability .availability-day .time-ranges .time-range .pickers{display:flex;gap:1rem}@media screen and (max-width: 504px){.nylas-availability-picker .content .availability .availability-day .time-ranges .time-range .pickers{gap:0.5rem}}.nylas-availability-picker .content .availability .availability-day .time-ranges .time-range .pickers span{margin-top:0.75rem}.nylas-availability-picker .content .availability .availability-day .time-ranges .time-range:not(:last-of-type){margin-bottom:1rem}.nylas-availability-picker .content .availability .availability-day .time-ranges p.error{color:var(--nylas-error)}.nylas-availability-picker .content .availability .availability-day button{border:none;background:transparent;height:40px;cursor:pointer;color:var(--nylas-base-800)}.nylas-availability-picker .content .availability .availability-day button:hover,.nylas-availability-picker .content .availability .availability-day button:active{color:var(--nylas-primary)}select-dropdown{width:auto}select-dropdown::part(sd_dropdown-button){justify-content:initial}";
-const NylasAvailabilityPickerStyle0 = nylasAvailabilityPickerCss;
-var __decorate$g = (undefined && undefined.__decorate) || function (decorators, target, key, desc) {
-    var c = arguments.length, r = c < 3 ? target : desc === null ? desc = Object.getOwnPropertyDescriptor(target, key) : desc, d;
-    if (typeof Reflect === "object" && typeof Reflect.decorate === "function")
-        r = Reflect.decorate(decorators, target, key, desc);
-    else
-        for (var i = decorators.length - 1; i >= 0; i--)
-            if (d = decorators[i])
-                r = (c < 3 ? d(r) : c > 3 ? d(target, key, r) : d(target, key)) || r;
-    return c > 3 && r && Object.defineProperty(target, key, r), r;
-};
-var __metadata$g = (undefined && undefined.__metadata) || function (k, v) {
-    if (typeof Reflect === "object" && typeof Reflect.metadata === "function")
-        return Reflect.metadata(k, v);
-};
-const NylasAvailabilityPicker = class {
-    constructor(hostRef) {
-        registerInstance(this, hostRef);
-        this.valueChanged = createEvent(this, "valueChanged", 7);
-        if (hostRef.$hostElement$["s-ei"]) {
-            this.internals = hostRef.$hostElement$["s-ei"];
-        }
-        else {
-            this.internals = hostRef.$hostElement$.attachInternals();
-            hostRef.$hostElement$["s-ei"] = this.internals;
-        }
-        this.selectedConfiguration = undefined;
-        this.openHours = undefined;
-        this.name = 'availability';
-        this.defaultTimezone = Intl.DateTimeFormat().resolvedOptions().timeZone;
-        this.hideHeader = false;
-        this.schedule = {
-            SUN: [],
-            MON: [{ start: '09:00am', end: '05:00pm' }],
-            TUE: [{ start: '09:00am', end: '05:00pm' }],
-            WED: [{ start: '09:00am', end: '05:00pm' }],
-            THU: [{ start: '09:00am', end: '05:00pm' }],
-            FRI: [{ start: '09:00am', end: '05:00pm' }],
-            SAT: [],
-        };
-        this.timezone = Intl.DateTimeFormat().resolvedOptions().timeZone;
-        this.overlapDays = {};
-    }
-    elementNameChangedHandler(newValue) {
-        debug('nylas-calendar-picker', 'elementNameChangedHandler', newValue);
-        this.host.setAttribute('name', newValue);
-    }
-    configChangedHandler(newConfig) {
-        const defaultOpenHours = newConfig?.availability?.availability_rules?.default_open_hours;
-        if (defaultOpenHours) {
-            this.openHoursToSchedule(defaultOpenHours);
-        }
-    }
-    scheduleChanged(newValue, oldValue) {
-        if (newValue !== oldValue) {
-            let overlapDays = {};
-            Object.keys(newValue).forEach(key => {
-                const dayTimeRanges = newValue[key];
-                if (dayTimeRanges.length > 0) {
-                    const overlaps = this.getOverlaps(dayTimeRanges);
-                    if (overlaps.length > 0) {
-                        overlapDays[key] = overlaps;
-                    }
-                }
-            });
-            this.overlapDays = overlapDays;
-            if (typeof this.internals.setFormValue !== 'function') {
-                return;
-            }
-            if (Object.keys(overlapDays).length > 0) {
-                const element = this.host.shadowRoot?.getElementById(Object.keys(overlapDays)[0]);
-                if (element) {
-                    debug('nylas-availability-picker', 'The time ranges are overlapping. Overlap: ', overlapDays);
-                    this.internals.setValidity({ customError: true }, 'Overlapping time ranges found', element);
-                }
-            }
-            else {
-                this.internals.setValidity({ customError: false });
-                this.internals.setFormValue(JSON.stringify({
-                    openHours: this.scheduleToOpenHours(this.schedule),
-                    timezone: this.timezone,
-                }));
-            }
-            this.valueChanged.emit({
-                value: JSON.stringify({
-                    openHours: this.scheduleToOpenHours(newValue),
-                    timezone: this.timezone,
-                }),
-                name: this.name,
-            });
-        }
-    }
-    nylasFormDropdownChangedHandler(event) {
-        const { name, value } = event.detail;
-        if (name === 'timezone') {
-            this.timezone = value;
-            if (typeof this.internals.setFormValue !== 'function') {
-                return;
-            }
-            const updateValue = {
-                openHours: this.scheduleToOpenHours(this.schedule),
-                timezone: this.timezone,
-            };
-            this.internals.setFormValue(JSON.stringify(updateValue));
-            this.valueChanged.emit({
-                value: JSON.stringify(updateValue),
-                name: this.name,
-            });
-        }
-    }
-    connectedCallback() {
-        debug('nylas-availability-picker', 'connectedCallback');
-    }
-    disconnectedCallback() {
-        debug('nylas-availability-picker', 'disconnectedCallback');
-    }
-    componentWillLoad() {
-        debug('nylas-availability-picker', 'componentWillLoad');
-        this.host.setAttribute('name', this.name);
-    }
-    componentDidLoad() {
-        debug('nylas-availability-picker', 'componentDidLoad');
-        if (this.openHours && this.openHours.length > 0) {
-            this.openHoursToSchedule(this.openHours);
-        }
-        if (typeof this.internals.setFormValue !== 'function') {
-            return;
-        }
-        const updateValue = {
-            openHours: this.scheduleToOpenHours(this.schedule),
-            timezone: this.timezone,
-        };
-        this.internals.setFormValue(JSON.stringify(updateValue));
-        this.valueChanged.emit({
-            value: JSON.stringify(updateValue),
-            name: this.name,
-        });
-    }
-    getOverlaps(timeRanges) {
-        let timeRangesInMinutes = timeRanges.map((range, index) => ({
-            start: timeToMinutes(range.start),
-            end: timeToMinutes(range.end),
-            originalIndex: index,
-        }));
-        timeRangesInMinutes.sort((a, b) => a.start - b.start);
-        let overlaps = [];
-        for (let i = 1; i < timeRangesInMinutes.length; i++) {
-            if (timeRangesInMinutes[i].start < timeRangesInMinutes[i - 1].end) {
-                if (!overlaps.includes(timeRangesInMinutes[i].originalIndex)) {
-                    overlaps.push(timeRangesInMinutes[i].originalIndex);
-                }
-                if (!overlaps.includes(timeRangesInMinutes[i - 1].originalIndex)) {
-                    overlaps.push(timeRangesInMinutes[i - 1].originalIndex);
-                }
-            }
-        }
-        return overlaps.sort((a, b) => a - b);
-    }
-    addTimeRange(day) {
-        const currentTimeRanges = this.schedule[day];
-        const dayStart = 0;
-        const dayEnd = 1425;
-        if (currentTimeRanges.length === 0) {
-            this.schedule[day] = [{ start: '09:00am', end: '05:00pm' }];
-        }
-        else {
-            const timeRangesInMinutes = currentTimeRanges
-                .map(range => ({
-                start: timeToMinutes(range.start),
-                end: timeToMinutes(range.end),
-            }))
-                .sort((a, b) => a.start - b.start);
-            const lastRangeEnd = timeRangesInMinutes[timeRangesInMinutes.length - 1].end;
-            if (lastRangeEnd + 60 <= dayEnd) {
-                this.schedule[day].push({
-                    start: convertTo12HourFormat(minutesToTime(lastRangeEnd)),
-                    end: convertTo12HourFormat(minutesToTime(lastRangeEnd + 60)),
-                });
-            }
-            else {
-                let gapFound = false;
-                if (timeRangesInMinutes[0].start > dayStart + 60) {
-                    this.schedule[day].push({
-                        start: convertTo12HourFormat(minutesToTime(dayStart)),
-                        end: convertTo12HourFormat(minutesToTime(dayStart + 60)),
-                    });
-                    gapFound = true;
-                }
-                if (!gapFound) {
-                    for (let i = 0; i < timeRangesInMinutes.length - 1; i++) {
-                        const currentEnd = timeRangesInMinutes[i].end;
-                        const nextStart = timeRangesInMinutes[i + 1].start;
-                        if (nextStart - currentEnd >= 60) {
-                            this.schedule[day].push({
-                                start: convertTo12HourFormat(minutesToTime(currentEnd)),
-                                end: convertTo12HourFormat(minutesToTime(currentEnd + 60)),
-                            });
-                            break;
-                        }
-                    }
-                }
-            }
-        }
-        this.schedule[day].sort((a, b) => timeToMinutes(a.start) - timeToMinutes(b.start));
-        this.schedule = { ...this.schedule };
-    }
-    removeTimeRange(day, index) {
-        this.schedule[day].splice(index, 1);
-        this.schedule = { ...this.schedule };
-    }
-    setTime(event) {
-        const { key, value } = event.detail;
-        const [dayIndex, timeType] = key.split('_');
-        const [day, index] = dayIndex.split(':');
-        if (timeType === 'start') {
-            this.schedule[day][index].start = value;
-        }
-        else if (timeType === 'end') {
-            this.schedule[day][index].end = value;
-        }
-        this.internals.setValidity({ customError: false });
-        this.schedule = { ...this.schedule };
-    }
-    setFormError(event) {
-        const { key } = event.detail;
-        const [_, timeType] = key.split('_');
-        const element = this.host.shadowRoot?.getElementById(key);
-        if (element) {
-            this.internals.setValidity({ customError: true }, `Invalid ${timeType} time`, element);
-        }
-    }
-    openHoursToSchedule(openHours) {
-        const newSchedule = {
-            SUN: [],
-            MON: [],
-            TUE: [],
-            WED: [],
-            THU: [],
-            FRI: [],
-            SAT: [],
-        };
-        openHours.forEach(openHour => {
-            openHour.days.forEach(day => {
-                const dayKey = this.getDayKey(day);
-                const start12hr = convertTo12HourFormat(openHour.start);
-                const end12hr = convertTo12HourFormat(openHour.end);
-                const timeRange = { start: start12hr, end: end12hr };
-                let timeRangeExists = false;
-                if (newSchedule[dayKey]) {
-                    timeRangeExists = newSchedule[dayKey].some(range => range.start === timeRange.start && range.end === timeRange.end);
-                }
-                if (!timeRangeExists) {
-                    if (newSchedule[dayKey]) {
-                        newSchedule[dayKey].push(timeRange);
-                    }
-                    else {
-                        newSchedule[dayKey] = [timeRange];
-                    }
-                }
-            });
-        });
-        this.timezone = this.defaultTimezone;
-        this.schedule = newSchedule;
-    }
-    getDayKey(dayIndex) {
-        const days = ['SUN', 'MON', 'TUE', 'WED', 'THU', 'FRI', 'SAT'];
-        return days[dayIndex];
-    }
-    scheduleToOpenHours(schedule) {
-        const dayKeys = ['SUN', 'MON', 'TUE', 'WED', 'THU', 'FRI', 'SAT'];
-        let openHoursMap = new Map();
-        dayKeys.forEach((dayKey, index) => {
-            if (schedule[dayKey]) {
-                schedule[dayKey].forEach(timeRange => {
-                    const start24hr = convertTo24HourFormat(timeRange.start);
-                    const end24hr = convertTo24HourFormat(timeRange.end);
-                    const key = `${start24hr}-${end24hr}`;
-                    if (!openHoursMap.has(key)) {
-                        openHoursMap.set(key, { days: [index], start: start24hr, end: end24hr });
-                    }
-                    else {
-                        let entry = openHoursMap.get(key);
-                        if (entry) {
-                            entry.days.push(index);
-                            openHoursMap.set(key, entry);
-                        }
-                    }
-                });
-            }
-        });
-        let selectedOpenHours = [];
-        openHoursMap.forEach((value, _key) => {
-            selectedOpenHours.push({
-                days: value.days,
-                start: value.start,
-                end: value.end,
-                timezone: this.timezone,
-            });
-        });
-        return selectedOpenHours;
-    }
-    render() {
-        const timezoneOptions = Object.keys(TIMEZONE_MAP).map(key => ({
-            label: TIMEZONE_MAP[key],
-            value: key,
-        }));
-        return (h(Host, { key: 'bb0a4148b2d9728d7a2a9fdab8359382dd1ae5d5' }, h("div", { key: '27c5e85931d318e6ec66a155faa78e021b570f70', class: "nylas-availability-picker", part: "nap" }, !this.hideHeader && (h("div", { class: "header", part: "nap__header" }, h("h3", null, "General availability"), h("p", null, "Set your availability for scheduling meetings."))), h("div", { key: 'f2b3434dc127fc19fe6fe915cdc5f4a9d12ba6e7', class: "content" }, h("div", { key: 'bd75cb0749168b32c6366aea6f4df5920d098ec7', class: "select-timezone", part: "nap__select-timezone" }, h("h4", { key: '0c74924a291afaa07ff5b06781720a8cbadeea4d', class: "sub-header" }, "Select timezone", h("span", { key: '64933b3f6623f2d0b13559406db3d14afa99e0b6', class: "icon" }, h("tooltip-component", { key: '09c42633826e0ad358b4877f7d48bb70ce7ca518' }, h("info-icon", { key: '9ea9340b193710d759e71081e59ad6ccf762e4a8', slot: "tooltip-icon" }), h("span", { key: '83e596171dc8fb74543b21e957855f9cd32423b1', slot: "tooltip-content" }, "Select your timezone for displaying availability.")))), h("select-dropdown", { key: 'd65b32234b1669a5e7bef4b88024f50548011b98', name: "timezone", exportparts: "sd_dropdown: nap__timezone-container, sd_dropdown-button: nap__timezone-button, sd_dropdown-content: nap__timezone-dropdown-content", options: timezoneOptions, defaultSelectedOption: timezoneOptions.find(i => i.value === this.defaultTimezone) }, h("span", { key: '3387e2d39b7a052557d7668d5a7822fda1440da7', slot: "select-icon" }, h("globe-icon", { key: 'e92459b2ce063e199d8685f5a422a88e7a50fbd6', width: "20", height: "20" })))), h("div", { key: 'd510d9538189898f52e56388d661158e243fc8dd', class: "availability", part: "nap__availability" }, Object.keys(this.schedule).map(key => {
-            const day = key;
-            const timeRanges = this.schedule[key];
-            return (h("div", { class: "availability-day" }, h("div", { class: "day", part: "nap__day" }, h("input", { type: "checkbox", name: day, id: day, checked: timeRanges.length > 0, onClick: () => {
-                    if (timeRanges.length > 0) {
-                        this.schedule[day] = [];
-                    }
-                    else {
-                        this.schedule[day] = [{ start: '09:00am', end: '05:00pm' }];
-                    }
-                    this.schedule = { ...this.schedule };
-                } }), h("label", { htmlFor: day, "aria-label": "Select day" }, day)), h("div", { class: "time-ranges", part: "nap__time-ranges" }, timeRanges.length ? null : h("span", { class: "unavailable" }, "Unavailable"), timeRanges.length > 0 &&
-                timeRanges.map((timeRange, timeRangeIndex) => {
-                    const startKey = `${key}:${timeRangeIndex}_start`;
-                    const endKey = `${key}:${timeRangeIndex}_end`;
-                    return (h("div", { class: "time-range", part: "nap__time-range" }, h("div", { class: "pickers" }, h("nylas-time-window-picker", { id: startKey, hasError: this.overlapDays[day]?.includes(timeRangeIndex), time: timeRange.start, name: startKey, key: startKey, exportparts: "time-picker: nap__time-picker-container, time-input: nap__time-picker-input, times: nap__time-picker-times" }), h("span", null, " - "), h("nylas-time-window-picker", { id: endKey, hasError: this.overlapDays[day]?.includes(timeRangeIndex), time: timeRange.end, name: endKey, key: endKey, minimumStartTime: timeRange.start, exportparts: "time-picker: nap__time-picker-container, time-input: nap__time-picker-input, times: nap__time-picker-times" })), h("button", { onClick: () => this.removeTimeRange(day, timeRangeIndex) }, h("close-icon", null))));
-                }), h("p", { class: "error" }, this.overlapDays[day] ? 'Overlapping time ranges' : '')), h("div", null, timeRanges.length > 0 ? (h("button", { onClick: () => this.addTimeRange(day), part: "nap__add-time-range" }, h("add-circle-icon", null))) : null)));
-        }))))));
-    }
-    static get formAssociated() { return true; }
-    get host() { return getElement(this); }
-    static get watchers() { return {
-        "name": ["elementNameChangedHandler"],
-        "selectedConfiguration": ["configChangedHandler"],
-        "schedule": ["scheduleChanged"]
-    }; }
-};
-__decorate$g([
-    RegisterComponent({
-        name: 'nylas-availability-picker',
-        stateToProps: new Map([['schedulerConfig.selectedConfiguration', 'selectedConfiguration']]),
-        fireRegisterEvent: true,
-    }),
-    __metadata$g("design:type", Function),
-    __metadata$g("design:paramtypes", []),
-    __metadata$g("design:returntype", void 0)
-], NylasAvailabilityPicker.prototype, "render", null);
-NylasAvailabilityPicker.style = NylasAvailabilityPickerStyle0;
-const nylasBookingCalendarPickerCss = ":host{display:block;--nylas-primary:#2563eb;--nylas-error:#cc4841;--nylas-error-pressed:#992222;--nylas-wraning:#f06c00;--nylas-success:#16a392;--nylas-info:#2b8fc2;--nylas-base-0:#ffffff;--nylas-base-25:#fcfcfd;--nylas-base-50:#f8f9fc;--nylas-base-100:#eaecf5;--nylas-base-200:#d5d9eb;--nylas-base-300:#b3b8d8;--nylas-base-400:#717bbc;--nylas-base-500:#4e5ba6;--nylas-base-600:#3e4784;--nylas-base-700:#263f72;--nylas-base-800:#293056;--nylas-base-900:#101323;--nylas-base-950:#0e101b;--nylas-border-radius:0.25rem;--nylas-border-radius-2x:0.5rem;--nylas-border-radius-3x:0.75rem;--nylas-font-family:\"Inter\", sans-serif;width:inherit}.nylas-booking-calendar-picker{width:inherit;display:flex;flex-direction:column;margin:1rem;border-radius:var(--nylas-border-radius-2x);border:1px solid var(--nylas-base-200)}.nylas-booking-calendar-picker .header{padding:1rem;border-bottom:1px solid var(--nylas-base-200)}.nylas-booking-calendar-picker .header h3{margin:0;font-size:1rem;font-weight:600;line-height:20px;color:var(--nylas-base-900);text-align:left}.nylas-booking-calendar-picker .header p{margin:0.25rem 0 0 0;font-size:0.875rem;font-weight:400;line-height:20px;color:var(--nylas-base-600);text-align:left}.nylas-booking-calendar-picker .nylas-booking-calendar-picker__loading{padding-bottom:1rem;display:flex;flex-direction:column;gap:4px}.nylas-booking-calendar-picker .nylas-booking-calendar-picker__loading .label{display:flex;align-items:center;gap:0.5rem;margin:1rem 1rem 0;color:var(--nylas-base-800)}.nylas-booking-calendar-picker .nylas-booking-calendar-picker__loading .loading-button{margin:0 1rem;padding:0;width:inherit;height:48px;color:black;font-size:1rem;cursor:not-allowed;display:flex;gap:0.5rem;justify-content:space-between;align-items:center;background:transparent;border:1px solid var(--nylas-base-200);border-radius:var(--nylas-border-radius-2x)}.nylas-booking-calendar-picker .nylas-booking-calendar-picker__loading .loading-button span{padding:0 1rem}.nylas-booking-calendar-picker .nylas-booking-calendar-picker__dropdown{padding:1rem;display:flex;flex-direction:column;gap:4px}.nylas-booking-calendar-picker .nylas-booking-calendar-picker__dropdown span.label{display:flex;align-items:center;gap:4px;color:var(--nylas-base-800)}.nylas-booking-calendar-picker .nylas-booking-calendar-picker__dropdown span.label tooltip-component{display:flex}.nylas-booking-calendar-picker .nylas-booking-calendar-picker__dropdown select-dropdown::part(sd_dropdown){width:100%}.nylas-booking-calendar-picker .nylas-booking-calendar-picker__dropdown select-dropdown::part(sd_dropdown-content){width:100%;max-width:unset}.nylas-booking-calendar-picker .nylas-booking-calendar-picker__dropdown select-dropdown::part(sd_dropdown-button){width:100%;display:flex;justify-content:space-between;align-items:center;border:1px solid var(--nylas-base-200);border-radius:var(--nylas-border-radius-2x)}.nylas-booking-calendar-picker .nylas-booking-calendar-picker__dropdown select-dropdown::part(sd_dropdown-button-selected-label){max-width:calc(100% - 2rem);font-family:var(--nylas-font-family);font-size:16px;line-height:24px}";
-const NylasBookingCalendarPickerStyle0 = nylasBookingCalendarPickerCss;
-var __decorate$f = (undefined && undefined.__decorate) || function (decorators, target, key, desc) {
-    var c = arguments.length, r = c < 3 ? target : desc === null ? desc = Object.getOwnPropertyDescriptor(target, key) : desc, d;
-    if (typeof Reflect === "object" && typeof Reflect.decorate === "function")
-        r = Reflect.decorate(decorators, target, key, desc);
-    else
-        for (var i = decorators.length - 1; i >= 0; i--)
-            if (d = decorators[i])
-                r = (c < 3 ? d(r) : c > 3 ? d(target, key, r) : d(target, key)) || r;
-    return c > 3 && r && Object.defineProperty(target, key, r), r;
-};
-var __metadata$f = (undefined && undefined.__metadata) || function (k, v) {
-    if (typeof Reflect === "object" && typeof Reflect.metadata === "function")
-        return Reflect.metadata(k, v);
-};
-const NylasBookingCalendarPicker = class {
-    constructor(hostRef) {
-        registerInstance(this, hostRef);
-        this.valueChanged = createEvent(this, "valueChanged", 7);
-        if (hostRef.$hostElement$["s-ei"]) {
-            this.internals = hostRef.$hostElement$["s-ei"];
-        }
-        else {
-            this.internals = hostRef.$hostElement$.attachInternals();
-            hostRef.$hostElement$["s-ei"] = this.internals;
-        }
-        this.calendars = undefined;
-        this.currentUser = undefined;
-        this.name = 'booking-calendar';
-        this.defaultBookingCalendar = '';
-        this.selectedCalendar = '';
-    }
-    connectedCallback() {
-        debug('nylas-booking-calendar-picker', 'connectedCallback');
-    }
-    disconnectedCallback() {
-        debug('nylas-booking-calendar-picker', 'disconnectedCallback');
-    }
-    componentWillLoad() {
-        debug('nylas-booking-calendar-picker', 'componentWillLoad');
-        this.host.setAttribute('name', this.name);
-    }
-    componentDidLoad() {
-        debug('nylas-booking-calendar-picker', 'componentDidLoad');
-        this.defaultBookingCalendar = this.defaultBookingCalendar || this.currentUser?.email || '';
-        if (typeof this.internals.setFormValue === 'function') {
-            this.internals.setFormValue(this.defaultBookingCalendar.toString(), 'booking-calendar');
-        }
-        this.selectedCalendar = this.defaultBookingCalendar || this.currentUser?.email || '';
-    }
-    componentWillUpdate() {
-        debug('nylas-booking-calendar-picker', 'componentWillUpdate');
-    }
-    componentDidUpdate() {
-        debug('nylas-booking-calendar-picker', 'componentDidUpdate');
-    }
-    componentWillRender() {
-        debug('nylas-booking-calendar-picker', 'componentWillRender');
-    }
-    componentDidRender() {
-        debug('nylas-booking-calendar-picker', 'componentDidRender');
-    }
-    elementNameChangedHandler(newValue) {
-        debug('nylas-booking-calendar-picker', 'elementNameChangedHandler', newValue);
-        this.host.setAttribute('name', newValue);
-    }
-    nylasFormDropdownChangedHandler(event) {
-        debug('nylas-booking-calendar-picker', 'nylasFormDropdownChangedHandler', event.detail);
-        const valueChanged = (event) => {
-            const { value } = event.detail;
-            this.selectedCalendar = value;
-            this.internals.setFormValue(value.toString(), this.name);
-        };
-        this.valueChanged.emit({ value: event.detail.value, name: this.name, valueChanged });
-    }
-    render() {
-        const calendarOptions = this.calendars?.map(calendar => {
-            return {
-                value: calendar.id,
-                label: calendar.name,
-            };
-        }) ?? [];
-        return (h(Host, null, h("div", { class: "nylas-booking-calendar-picker", part: "nbcp" }, h("div", { class: "header", part: "nbcp__header" }, h("h3", null, "Calendar booking"), h("p", null, "Choose calendar where you\u2019d like the event bookings to show up.")), calendarOptions.length > 0 ? (h("div", { class: "nylas-booking-calendar-picker__dropdown" }, h("span", { class: "label", part: "nbcp__input-label" }, "Select a calendar to book meetings on", h("tooltip-component", null, h("info-icon", { slot: "tooltip-icon" }), h("span", { slot: "tooltip-content" }, "Check availability across one or multiple calendars. If multiple calendars are selected, you must be available across all of them to be considered available."))), h("select-dropdown", { name: "booking-calendar", options: calendarOptions, withSearch: false, exportparts: "sd_dropdown: nbcp__dropdown, sd_dropdown-button: nbcp__dropdown-button, sd_dropdown-content: nbcp__dropdown-content", defaultSelectedOption: calendarOptions.find(cal => cal.value == this.defaultBookingCalendar) ?? calendarOptions[0] }))) : (h("div", { class: "nylas-booking-calendar-picker__loading" }, h("span", { class: "label" }, "Select a calendar to book meetings on ", h("info-icon", null)), h("div", { class: "loading-button" }, h("span", null, "Loading...")))))));
-    }
-    static get formAssociated() { return true; }
-    get host() { return getElement(this); }
-    static get watchers() { return {
-        "name": ["elementNameChangedHandler"]
-    }; }
-};
-__decorate$f([
-    RegisterComponent({
-        name: 'nylas-booking-calendar-picker',
-        stateToProps: new Map([
-            ['schedulerConfig.calendars', 'calendars'],
-            ['schedulerConfig.currentUser', 'currentUser'],
-        ]),
-        eventToProps: {
-            valueChanged: async (event, _nylasSchedulerConfigConnector) => {
-                const { valueChanged } = event.detail;
-                if (valueChanged) {
-                    valueChanged(event);
-                }
-            },
-        },
-        fireRegisterEvent: true,
-    }),
-    __metadata$f("design:type", Function),
-    __metadata$f("design:paramtypes", []),
-    __metadata$f("design:returntype", void 0)
-], NylasBookingCalendarPicker.prototype, "render", null);
-NylasBookingCalendarPicker.style = NylasBookingCalendarPickerStyle0;
-const nylasBufferTimeCss = ":host{display:block;--nylas-primary:#2563eb;--nylas-error:#cc4841;--nylas-error-pressed:#992222;--nylas-wraning:#f06c00;--nylas-success:#16a392;--nylas-info:#2b8fc2;--nylas-base-0:#ffffff;--nylas-base-25:#fcfcfd;--nylas-base-50:#f8f9fc;--nylas-base-100:#eaecf5;--nylas-base-200:#d5d9eb;--nylas-base-300:#b3b8d8;--nylas-base-400:#717bbc;--nylas-base-500:#4e5ba6;--nylas-base-600:#3e4784;--nylas-base-700:#263f72;--nylas-base-800:#293056;--nylas-base-900:#101323;--nylas-base-950:#0e101b;--nylas-border-radius:0.25rem;--nylas-border-radius-2x:0.5rem;--nylas-border-radius-3x:0.75rem;--nylas-font-family:\"Inter\", sans-serif;width:inherit}.nylas-buffer-time{width:inherit;display:flex;flex-direction:column;margin:1rem;border-radius:var(--nylas-border-radius-2x);border:1px solid var(--nylas-base-200);text-align:left}.nylas-buffer-time .header{padding:1rem;border-bottom:1px solid var(--nylas-base-200)}.nylas-buffer-time .header h3{margin:0;font-size:1rem;font-weight:600;line-height:20px;color:var(--nylas-base-900);text-align:left}.nylas-buffer-time .header p{margin:0.25rem 0 0 0;font-size:0.875rem;font-weight:400;line-height:20px;color:var(--nylas-base-600);text-align:left}.nylas-buffer-time .nylas-buffer-time__body{display:grid;grid-template-columns:1fr auto}@media screen and (max-width: 768px){.nylas-buffer-time .nylas-buffer-time__body{grid-template-columns:1fr}}.nylas-buffer-time .nylas-buffer-time__body .nylas-buffer-time__dropdown{padding:1rem;display:flex;flex-direction:column;gap:1rem;border-right:1px solid var(--nylas-base-200);color:var(--nylas-base-800)}@media screen and (max-width: 768px){.nylas-buffer-time .nylas-buffer-time__body .nylas-buffer-time__dropdown{border:none}}.nylas-buffer-time .nylas-buffer-time__body .nylas-buffer-time__dropdown .nylas-buffer-time__row{display:grid;grid-template-columns:auto 1fr;align-items:center;gap:1rem}.nylas-buffer-time .nylas-buffer-time__body .nylas-buffer-time__dropdown .nylas-buffer-time__row label{width:200px}.nylas-buffer-time .nylas-buffer-time__body .nylas-buffer-time__dropdown .nylas-buffer-time__row .dropdown-container{display:flex;gap:1rem;align-items:center;justify-content:flex-end}.nylas-buffer-time .nylas-buffer-time__body .nylas-buffer-time__preview{width:208px;background:var(--nylas-base-25);border-bottom-right-radius:var(--nylas-border-radius-2x)}@media screen and (max-width: 768px){.nylas-buffer-time .nylas-buffer-time__body .nylas-buffer-time__preview{width:inherit;border-bottom-left-radius:var(--nylas-border-radius-2x)}}.nylas-buffer-time .nylas-buffer-time__body .nylas-buffer-time__preview h4{font-size:14px;line-height:24px;color:var(--nylas-base-600);font-family:var(--nylas-font-family);font-weight:500;text-align:center;margin:0.75rem 0}.nylas-buffer-time .nylas-buffer-time__body .nylas-buffer-time__preview .preview-container{padding:0 2rem 1rem}.nylas-buffer-time .nylas-buffer-time__body .nylas-buffer-time__preview .preview-container .slot{background-color:transparent;border-top:1px solid var(--nylas-base-300)}.nylas-buffer-time .nylas-buffer-time__body .nylas-buffer-time__preview .preview-container .slot.active{background-color:var(--nylas-base-100)}.nylas-buffer-time .nylas-buffer-time__body .nylas-buffer-time__preview .preview-container .slot:last-of-type{border-bottom:1px solid var(--nylas-base-300)}.nylas-buffer-time .nylas-buffer-time__body .nylas-buffer-time__preview .preview-container .event-slot{background-color:var(--nylas-base-600);border-top:1px solid var(--nylas-base-300)}.nylas-buffer-time .nylas-buffer-time__dropdown select-dropdown::part(sd_dropdown-button){width:104px;display:flex;justify-content:space-between;align-items:center;border:1px solid var(--nylas-base-200);border-radius:var(--nylas-border-radius-2x);padding:1rem}.nylas-buffer-time .nylas-buffer-time__dropdown select-dropdown::part(sd_dropdown-content){width:100%}.nylas-buffer-time .nylas-buffer-time__dropdown select-dropdown::part(sd_dropdown-button-selected-label){max-width:calc(100% - 2rem);font-family:var(--nylas-font-family);font-size:16px;line-height:24px}";
-const NylasBufferTimeStyle0 = nylasBufferTimeCss;
-var __decorate$e = (undefined && undefined.__decorate) || function (decorators, target, key, desc) {
-    var c = arguments.length, r = c < 3 ? target : desc === null ? desc = Object.getOwnPropertyDescriptor(target, key) : desc, d;
-    if (typeof Reflect === "object" && typeof Reflect.decorate === "function")
-        r = Reflect.decorate(decorators, target, key, desc);
-    else
-        for (var i = decorators.length - 1; i >= 0; i--)
-            if (d = decorators[i])
-                r = (c < 3 ? d(r) : c > 3 ? d(target, key, r) : d(target, key)) || r;
-    return c > 3 && r && Object.defineProperty(target, key, r), r;
-};
-var __metadata$e = (undefined && undefined.__metadata) || function (k, v) {
-    if (typeof Reflect === "object" && typeof Reflect.metadata === "function")
-        return Reflect.metadata(k, v);
-};
-const NylasBufferTime = class {
-    constructor(hostRef) {
-        registerInstance(this, hostRef);
-        this.valueChanged = createEvent(this, "valueChanged", 7);
-        if (hostRef.$hostElement$["s-ei"]) {
-            this.internals = hostRef.$hostElement$["s-ei"];
-        }
-        else {
-            this.internals = hostRef.$hostElement$.attachInternals();
-            hostRef.$hostElement$["s-ei"] = this.internals;
-        }
-        this.name = 'buffer-time';
-        this.buffer = { before: 0, after: 0 };
-        this.selectedBeforeBufferTime = this.buffer.before;
-        this.selectedAfterBufferTime = this.buffer.after;
-    }
-    connectedCallback() {
-        debug('nylas-buffer-time', 'connectedCallback');
-    }
-    disconnectedCallback() {
-        debug('nylas-buffer-time', 'disconnectedCallback');
-    }
-    componentWillLoad() {
-        debug('nylas-buffer-time', 'componentWillLoad');
-        this.host.setAttribute('name', this.name);
-    }
-    componentDidLoad() {
-        debug('nylas-buffer-time', 'componentDidLoad');
-        if (typeof this.internals.setFormValue === 'function') {
-            const bufferTime = {
-                before: this.selectedBeforeBufferTime,
-                after: this.selectedAfterBufferTime,
-            };
-            this.internals.setFormValue(JSON.stringify(bufferTime), this.name);
-        }
-        this.selectedAfterBufferTime = this.buffer.after;
-        this.selectedBeforeBufferTime = this.buffer.before;
-    }
-    componentWillUpdate() {
-        debug('nylas-buffer-time', 'componentWillUpdate');
-    }
-    componentDidUpdate() {
-        debug('nylas-buffer-time', 'componentDidUpdate');
-    }
-    componentWillRender() {
-        debug('nylas-buffer-time', 'componentWillRender');
-    }
-    componentDidRender() {
-        debug('nylas-buffer-time', 'componentDidRender');
-    }
-    elementNameChangedHandler(newValue) {
-        debug('nylas-buffer-time', 'elementNameChangedHandler', newValue);
-        this.host.setAttribute('name', newValue);
-    }
-    nylasFormDropdownChangedHandler(event) {
-        debug('nylas-buffer-time', 'nylasFormDropdownChangedHandler', event.detail);
-        const valueChanged = (event) => {
-            const { value, name } = event.detail;
-            if (name === 'before-buffer-time') {
-                this.selectedBeforeBufferTime = parseInt(value);
-            }
-            else if (name === 'after-buffer-time') {
-                this.selectedAfterBufferTime = parseInt(value);
-            }
-            const bufferTime = {
-                before: this.selectedBeforeBufferTime,
-                after: this.selectedAfterBufferTime,
-            };
-            this.internals.setFormValue(JSON.stringify(bufferTime), 'booking-calendar');
-        };
-        this.valueChanged.emit({ ...event.detail, valueChanged });
-    }
-    renderPreview() {
-        const totalSlots = 4;
-        const slotHeight = 10;
-        const eventSlotHeight = slotHeight * 2;
-        const slotFill = minutes => {
-            const fullSlots = Math.floor(minutes / 30);
-            const partialFillHeight = ((minutes % 30) / 30) * slotHeight;
-            return {
-                fullSlots,
-                partialFillHeight,
-            };
-        };
-        const createBeforeSlots = () => {
-            const { fullSlots, partialFillHeight } = slotFill(this.selectedBeforeBufferTime);
-            return Array.from({ length: totalSlots }, (_, index) => {
-                const isActive = this.selectedBeforeBufferTime > 0 && index > totalSlots - fullSlots - 1;
-                const isPartial = this.selectedBeforeBufferTime > 0 && index === totalSlots - fullSlots - 1 && partialFillHeight > 0;
-                let slotStyle = {};
-                if (isActive && !isPartial) {
-                    slotStyle.backgroundColor = 'var(--nylas-base-100)';
-                }
-                else if (isPartial) {
-                    slotStyle.background = `linear-gradient(to top, var(--nylas-base-100) ${partialFillHeight}px, transparent 0)`;
-                }
-                return (h("div", { key: index, class: `slot ${isActive ? 'active' : ''}`, style: {
-                        height: `${slotHeight}px`,
-                        ...slotStyle,
-                    } }));
-            });
-        };
-        const createAfterSlots = () => {
-            const { fullSlots, partialFillHeight } = slotFill(this.selectedAfterBufferTime);
-            return Array.from({ length: totalSlots }, (_, index) => {
-                const isActive = this.selectedAfterBufferTime > 0 && index < fullSlots;
-                const isPartial = index === fullSlots && partialFillHeight > 0;
-                let slotStyle = {};
-                if (isActive && !isPartial) {
-                    slotStyle.backgroundColor = 'var(--nylas-base-100)';
-                }
-                else if (isPartial) {
-                    slotStyle.background = `linear-gradient(to bottom, var(--nylas-base-100) ${partialFillHeight}px, transparent 0)`;
-                }
-                return (h("div", { key: index, class: `slot ${isActive ? 'active' : ''}`, style: {
-                        height: `${slotHeight}px`,
-                        ...slotStyle,
-                    } }));
-            });
-        };
-        return (h("div", { class: "preview-container" }, createBeforeSlots(), h("div", { class: "event-slot", style: { height: `${eventSlotHeight}px` } }), createAfterSlots()));
-    }
-    render() {
-        const minuteOptions = Array.from({ length: 25 }, (_, i) => {
-            const value = i * 5;
-            return {
-                label: value.toString(),
-                value: value,
-            };
-        });
-        return (h(Host, null, h("div", { class: "nylas-buffer-time", part: "nbt" }, h("div", { class: "header", part: "nbt__header" }, h("h3", null, "Buffer time"), h("p", null, "Add buffer time before and after the event.")), h("div", { class: "nylas-buffer-time__body", part: "nbt__body" }, h("div", { class: "nylas-buffer-time__dropdown" }, h("div", { class: "nylas-buffer-time__row" }, h("label", null, "Before the event"), h("div", { class: "dropdown-container" }, h("select-dropdown", { id: "before-buffer-time", withSearch: false, 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: minuteOptions, defaultSelectedOption: minuteOptions.find(min => min.value == this.selectedBeforeBufferTime) ?? minuteOptions[0] }), h("span", null, "mins"))), h("div", { class: "nylas-buffer-time__row" }, h("label", null, "After the event"), h("div", { class: "dropdown-container" }, h("select-dropdown", { id: "after-buffer-time", withSearch: false, 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: minuteOptions, defaultSelectedOption: minuteOptions.find(min => min.value == this.selectedAfterBufferTime) ?? minuteOptions[0] }), h("span", null, "mins")))), h("div", { class: "nylas-buffer-time__preview", part: "nbt__preview" }, h("h4", null, "PREVIEW"), this.renderPreview())))));
-    }
-    static get formAssociated() { return true; }
-    get host() { return getElement(this); }
-    static get watchers() { return {
-        "name": ["elementNameChangedHandler"]
-    }; }
-};
-__decorate$e([
-    RegisterComponent({
-        name: 'nylas-buffer-time',
-        eventToProps: {
-            valueChanged: async (event, _nylasSchedulerConfigConnector) => {
-                const { valueChanged } = event.detail;
-                if (valueChanged) {
-                    valueChanged(event);
-                }
-            },
-        },
-        fireRegisterEvent: true,
-    }),
-    __metadata$e("design:type", Function),
-    __metadata$e("design:paramtypes", []),
-    __metadata$e("design:returntype", void 0)
-], NylasBufferTime.prototype, "render", null);
-NylasBufferTime.style = NylasBufferTimeStyle0;
-const nylasCalendarPickerCss = ":host{display:block;--nylas-primary:#2563eb;--nylas-error:#cc4841;--nylas-error-pressed:#992222;--nylas-wraning:#f06c00;--nylas-success:#16a392;--nylas-info:#2b8fc2;--nylas-base-0:#ffffff;--nylas-base-25:#fcfcfd;--nylas-base-50:#f8f9fc;--nylas-base-100:#eaecf5;--nylas-base-200:#d5d9eb;--nylas-base-300:#b3b8d8;--nylas-base-400:#717bbc;--nylas-base-500:#4e5ba6;--nylas-base-600:#3e4784;--nylas-base-700:#263f72;--nylas-base-800:#293056;--nylas-base-900:#101323;--nylas-base-950:#0e101b;--nylas-border-radius:0.25rem;--nylas-border-radius-2x:0.5rem;--nylas-border-radius-3x:0.75rem;--nylas-font-family:\"Inter\", sans-serif;width:inherit}.nylas-calendar-picker{width:inherit;display:flex;flex-direction:column;margin:1rem;border-radius:var(--nylas-border-radius-2x);border:1px solid var(--nylas-base-200)}.nylas-calendar-picker .header{padding:1rem;border-bottom:1px solid var(--nylas-base-200)}.nylas-calendar-picker .header h3{margin:0;font-size:1rem;font-weight:600;line-height:20px;color:var(--nylas-base-900);text-align:left}.nylas-calendar-picker .header p{margin:0.25rem 0 0 0;font-size:0.875rem;font-weight:400;line-height:20px;color:var(--nylas-base-600);text-align:left}.nylas-calendar-picker .nylas-calendar-picker__loading{padding-bottom:1rem;display:flex;flex-direction:column;gap:4px}.nylas-calendar-picker .nylas-calendar-picker__loading .label{display:flex;align-items:center;gap:0.5rem;margin:1rem 1rem 0;color:var(--nylas-base-800)}.nylas-calendar-picker .nylas-calendar-picker__loading .label tooltip-component{display:flex}.nylas-calendar-picker .nylas-calendar-picker__loading .loading-button{margin:0 1rem;padding:0;width:inherit;height:48px;color:black;font-size:1rem;cursor:not-allowed;display:flex;gap:0.5rem;justify-content:space-between;align-items:center;background:transparent;border:1px solid var(--nylas-base-200);border-radius:var(--nylas-border-radius-2x)}.nylas-calendar-picker .nylas-calendar-picker__loading .loading-button span{padding:0 1rem}.nylas-calendar-picker .nylas-calendar-picker__dropdown{padding:1rem}.nylas-calendar-picker .nylas-calendar-picker__dropdown multi-select-dropdown::part(msd_dropdown){width:100%;display:flex;flex-direction:column;gap:4px}.nylas-calendar-picker .nylas-calendar-picker__dropdown multi-select-dropdown::part(msd_dropdown-button){width:100%;display:flex;justify-content:space-between;align-items:center;border:1px solid var(--nylas-base-200);border-radius:var(--nylas-border-radius-2x);padding:1rem}.nylas-calendar-picker .nylas-calendar-picker__dropdown multi-select-dropdown::part(msd_dropdown-content){width:100%;max-width:unset}.nylas-calendar-picker .nylas-calendar-picker__dropdown multi-select-dropdown::part(msd_dropdown-button-selected-label){max-width:calc(100% - 2rem);font-family:var(--nylas-font-family);font-size:16px;line-height:24px}";
-const NylasCalendarPickerStyle0 = nylasCalendarPickerCss;
-var __decorate$d = (undefined && undefined.__decorate) || function (decorators, target, key, desc) {
-    var c = arguments.length, r = c < 3 ? target : desc === null ? desc = Object.getOwnPropertyDescriptor(target, key) : desc, d;
-    if (typeof Reflect === "object" && typeof Reflect.decorate === "function")
-        r = Reflect.decorate(decorators, target, key, desc);
-    else
-        for (var i = decorators.length - 1; i >= 0; i--)
-            if (d = decorators[i])
-                r = (c < 3 ? d(r) : c > 3 ? d(target, key, r) : d(target, key)) || r;
-    return c > 3 && r && Object.defineProperty(target, key, r), r;
-};
-var __metadata$d = (undefined && undefined.__metadata) || function (k, v) {
-    if (typeof Reflect === "object" && typeof Reflect.metadata === "function")
-        return Reflect.metadata(k, v);
-};
-const NylasCalendarPicker = class {
-    constructor(hostRef) {
-        registerInstance(this, hostRef);
-        this.valueChanged = createEvent(this, "valueChanged", 7);
-        if (hostRef.$hostElement$["s-ei"]) {
-            this.internals = hostRef.$hostElement$["s-ei"];
-        }
-        else {
-            this.internals = hostRef.$hostElement$.attachInternals();
-            hostRef.$hostElement$["s-ei"] = this.internals;
-        }
-        this.calendars = undefined;
-        this.currentUser = undefined;
-        this.name = 'calendar';
-        this.defaultSelectedCalendars = [];
-        this.selectedCalendars = [];
-    }
-    elementNameChangedHandler(newValue) {
-        debug('nylas-calendar-picker', 'elementNameChangedHandler', newValue);
-        this.host.setAttribute('name', newValue);
-    }
-    connectedCallback() {
-        debug('nylas-calendar-picker', 'connectedCallback');
-    }
-    disconnectedCallback() {
-        debug('nylas-calendar-picker', 'disconnectedCallback');
-    }
-    componentWillLoad() {
-        debug('nylas-calendar-picker', 'componentWillLoad');
-        this.host.setAttribute('name', this.name);
-    }
-    componentDidLoad() {
-        debug('nylas-calendar-picker', 'componentDidLoad');
-        if (typeof this.internals.setFormValue === 'function') {
-            this.internals.setFormValue(this.defaultSelectedCalendars.toString(), 'calendar');
-        }
-    }
-    componentWillUpdate() {
-        debug('nylas-calendar-picker', 'componentWillUpdate');
-    }
-    componentDidUpdate() {
-        debug('nylas-calendar-picker', 'componentDidUpdate');
-    }
-    componentWillRender() {
-        debug('nylas-calendar-picker', 'componentWillRender');
-    }
-    componentDidRender() {
-        debug('nylas-calendar-picker', 'componentDidRender');
-    }
-    selectedOptionsChangedHandler(event) {
-        debug('nylas-calendar-picker', 'nylasFormDropdownChangedHandler', event.detail);
-        const valueChangedHandler = (event) => {
-            const { value } = event.detail;
-            this.selectedCalendars = [...value];
-            this.internals.setFormValue(value.toString(), 'calendar');
-        };
-        this.valueChanged.emit({ ...event.detail, name: this.name, valueChangedHandler });
-    }
-    render() {
-        const calendarOptions = this.calendars?.map(calendar => {
-            return {
-                value: calendar.id,
-                label: calendar.name,
-                selected: this.defaultSelectedCalendars?.includes(calendar.id) ||
-                    (this.defaultSelectedCalendars?.includes('primary') || this.defaultSelectedCalendars?.length === 0 ? calendar.id === this.currentUser?.email : false),
-            };
-        }) ?? [];
-        return (h(Host, null, h("div", { class: "nylas-calendar-picker", part: "ncp" }, h("div", { class: "header", part: "ncp__header" }, h("h3", null, "Calendar availability"), h("p", null, "Select calendars that you\u2019d like to use for checking your availability.")), calendarOptions.length > 0 ? (h("div", { class: "nylas-calendar-picker__dropdown" }, h("multi-select-dropdown", { name: 'calendar', label: "Select calendars that will be checked for availability", options: calendarOptions, exportparts: "msd_dropdown: ncp__dropdown, msd_dropdown-button: ncp__dropdown-button, msd_dropdown-content: ncp__dropdown-content" }, h("span", { slot: "label-icon" }, h("tooltip-component", null, h("info-icon", { slot: "tooltip-icon" }), h("span", { slot: "tooltip-content" }, "Check availability across one or multiple calendars. If multiple calendars are selected, you must be available across all of them to be considered available. The default is your primary calendar if none are selected.")))))) : (h("div", { class: "nylas-calendar-picker__loading" }, h("span", { class: "label" }, "Select calendars that will be checked for availability ", h("info-icon", null)), h("div", { class: "loading-button" }, h("span", null, "Loading...")))))));
-    }
-    static get formAssociated() { return true; }
-    get host() { return getElement(this); }
-    static get watchers() { return {
-        "name": ["elementNameChangedHandler"]
-    }; }
-};
-__decorate$d([
-    RegisterComponent({
-        name: 'nylas-calendar-picker',
-        stateToProps: new Map([
-            ['schedulerConfig.calendars', 'calendars'],
-            ['schedulerConfig.currentUser', 'currentUser'],
-        ]),
-        eventToProps: {
-            valueChanged: async (event, _nylasSchedulerConfigConnector) => {
-                const { valueChangedHandler } = event.detail;
-                if (valueChangedHandler) {
-                    valueChangedHandler(event);
-                }
-            },
-        },
-        fireRegisterEvent: true,
-    }),
-    __metadata$d("design:type", Function),
-    __metadata$d("design:paramtypes", []),
-    __metadata$d("design:returntype", void 0)
-], NylasCalendarPicker.prototype, "render", null);
-NylasCalendarPicker.style = NylasCalendarPickerStyle0;
-const nylasCancellationPolicyCss = ":host{--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}.nylas-cancellation-policy{display:flex;flex-direction:column;gap:4px}.nylas-cancellation-policy label{display:flex;align-items:center;color:var(--nylas-base-800);font-size:16px;font-style:normal;font-weight:400;line-height:150%;}.nylas-cancellation-policy label span.label-icon{margin-left:4px}.nylas-cancellation-policy label span.label-icon tooltip-component{display:flex}.nylas-cancellation-policy textarea{padding:12px 16px;border-width:1;resize:vertical;border-radius:8px;font-family:var(--nylas-font-family);font-size:16px;line-height:24px;border:1px solid var(--nylas-base-200)}.nylas-cancellation-policy textarea::-webkit-resizer{display:none}";
-const NylasCancellationPolicyStyle0 = nylasCancellationPolicyCss;
-var __decorate$c = (undefined && undefined.__decorate) || function (decorators, target, key, desc) {
-    var c = arguments.length, r = c < 3 ? target : desc === null ? desc = Object.getOwnPropertyDescriptor(target, key) : desc, d;
-    if (typeof Reflect === "object" && typeof Reflect.decorate === "function")
-        r = Reflect.decorate(decorators, target, key, desc);
-    else
-        for (var i = decorators.length - 1; i >= 0; i--)
-            if (d = decorators[i])
-                r = (c < 3 ? d(r) : c > 3 ? d(target, key, r) : d(target, key)) || r;
-    return c > 3 && r && Object.defineProperty(target, key, r), r;
-};
-var __metadata$c = (undefined && undefined.__metadata) || function (k, v) {
-    if (typeof Reflect === "object" && typeof Reflect.metadata === "function")
-        return Reflect.metadata(k, v);
-};
-const NylasCancellationPolicy = class {
-    constructor(hostRef) {
-        registerInstance(this, hostRef);
-        this.valueChanged = createEvent(this, "valueChanged", 7);
-        if (hostRef.$hostElement$["s-ei"]) {
-            this.internals = hostRef.$hostElement$["s-ei"];
-        }
-        else {
-            this.internals = hostRef.$hostElement$.attachInternals();
-            hostRef.$hostElement$["s-ei"] = this.internals;
-        }
-        this.selectedConfiguration = undefined;
-        this.cancellationPolicy = undefined;
-        this.name = 'cancelation-policy';
-        this.message = this.cancellationPolicy || this.selectedConfiguration?.scheduler?.cancellation_policy || '';
-    }
-    elementNameChangedHandler(newValue) {
-        debug('nylas-cancellation-policy', 'elementNameChangedHandler', newValue);
-        this.host.setAttribute('name', newValue);
-    }
-    selectedConfigurationChangedHandler(newValue, oldValue) {
-        debug('nylas-custom-booking-flow', 'selectedConfigurationChangedHandler', newValue, oldValue);
-        if (newValue?.scheduler?.cancellation_policy) {
-            this.message = newValue?.scheduler?.cancellation_policy;
-        }
-    }
-    connectedCallback() {
-        debug('nylas-cancellation-policy', 'connectedCallback');
-    }
-    componentWillLoad() {
-        debug('nylas-cancellation-policy', 'componentWillLoad');
-        this.host.setAttribute('name', this.name);
-    }
-    componentDidLoad() {
-        debug('nylas-cancellation-policy', 'componentDidLoad');
-    }
-    disconnectedCallback() {
-        debug('nylas-cancellation-policy', 'disconnectedCallback');
-    }
-    handleChange(event) {
-        const value = sanitizeHtml(event.target.value);
-        this.message = value;
-        this.internals.setFormValue(value, this.name);
-        this.valueChanged.emit({ value: value, name: this.name });
-    }
-    render() {
-        return (h(Host, { key: '7a57476ea21860b39103ab43f8b86a5804ddc055' }, h("div", { key: '67d7d2c00b2b658778dabe316a4512472bddf435', class: "nylas-cancellation-policy", part: "ncpolicy" }, h("label", { key: '2f0abff08c2485c93efaf6202a5c9720107f11d1', htmlFor: this.name }, "Cancellation policy message", h("span", { key: '2c16d52ce3b6fea15f23e57d50afe55872f920d6', class: "label-icon" }, h("tooltip-component", { key: '8bde2b6a884e8d180ef7296bbf29322df14128ef' }, h("info-icon", { key: 'cffadcf00bc6c3b07dffeb633bf87b423d6f4c59', slot: "tooltip-icon" }), h("span", { key: '5c37fbce026bb6f5a37f7867236fc27284323c42', slot: "tooltip-content" }, "Attendees receive this message if trying to cancel the event. Attendees are asked to provide a reason for cancellation.")))), h("textarea", { key: '0f492885372a90650104bbb4679cde1374296504', id: this.name, part: "ncpolicy__textarea", name: this.name, value: this.message, maxlength: "250", onInput: e => this.handleChange(e) }))));
-    }
-    static get formAssociated() { return true; }
-    get host() { return getElement(this); }
-    static get watchers() { return {
-        "name": ["elementNameChangedHandler"],
-        "selectedConfiguration": ["selectedConfigurationChangedHandler"]
-    }; }
-};
-__decorate$c([
-    RegisterComponent({
-        name: 'nylas-cancellation-policy',
-        stateToProps: new Map([['schedulerConfig.selectedConfiguration', 'selectedConfiguration']]),
-        eventToProps: {},
-        fireRegisterEvent: true,
-    }),
-    __metadata$c("design:type", Function),
-    __metadata$c("design:paramtypes", []),
-    __metadata$c("design:returntype", void 0)
-], NylasCancellationPolicy.prototype, "render", null);
-NylasCancellationPolicy.style = NylasCancellationPolicyStyle0;
-const nylasCustomizeBookingSettingsCss = ":host{display:block;--nylas-primary:#2563eb;--nylas-error:#cc4841;--nylas-error-pressed:#992222;--nylas-wraning:#f06c00;--nylas-success:#16a392;--nylas-info:#2b8fc2;--nylas-base-0:#ffffff;--nylas-base-25:#fcfcfd;--nylas-base-50:#f8f9fc;--nylas-base-100:#eaecf5;--nylas-base-200:#d5d9eb;--nylas-base-300:#b3b8d8;--nylas-base-400:#717bbc;--nylas-base-500:#4e5ba6;--nylas-base-600:#3e4784;--nylas-base-700:#263f72;--nylas-base-800:#293056;--nylas-base-900:#101323;--nylas-base-950:#0e101b;--nylas-border-radius:0.25rem;--nylas-border-radius-2x:0.5rem;--nylas-border-radius-3x:0.75rem;--nylas-font-family:\"Inter\", sans-serif;width:inherit}.nylas-customize-booking-settings{width:inherit;display:flex;flex-direction:column;margin:1rem;border-radius:var(--nylas-border-radius-2x);border:1px solid var(--nylas-base-200)}.nylas-customize-booking-settings .header{padding:1rem;border-bottom:1px solid var(--nylas-base-200)}.nylas-customize-booking-settings .header h3{margin:0;font-size:1rem;font-weight:600;line-height:20px;color:var(--nylas-base-900);text-align:left}.nylas-customize-booking-settings .header p{margin:0.25rem 0 0 0;font-size:0.875rem;font-weight:400;line-height:20px;color:var(--nylas-base-600);text-align:left}.nylas-customize-booking-settings .nylas-customize-booking-settings__settings{display:flex;flex-direction:column;gap:1.5rem;padding:1rem;margin:1rem 0}.nylas-customize-booking-settings .nylas-customize-booking-settings__settings .nylas-customize-booking-settings__settings-div{display:flex;align-items:center;gap:4px}.label{margin-left:32px;font-size:16px;font-weight:400;color:var(--nylas-base-800);line-height:24px}.label .label-contents{margin:0;display:inline-block}@media screen and (max-width: 768px){.label .label-contents{display:block}}.label tooltip-component{display:inline-block}@media screen and (max-width: 768px){tooltip-component#guests::part(tc__content){left:58px}}tooltip-component#reschedule::part(tc__content){left:58px}@media screen and (max-width: 768px){tooltip-component#reschedule::part(tc__content){left:58px}}tooltip-component#cancel::part(tc__content){left:-58px}@media screen and (max-width: 768px){tooltip-component#cancel::part(tc__content){left:58px}}";
-const NylasCustomizeBookingSettingsStyle0 = nylasCustomizeBookingSettingsCss;
-var __decorate$b = (undefined && undefined.__decorate) || function (decorators, target, key, desc) {
-    var c = arguments.length, r = c < 3 ? target : desc === null ? desc = Object.getOwnPropertyDescriptor(target, key) : desc, d;
-    if (typeof Reflect === "object" && typeof Reflect.decorate === "function")
-        r = Reflect.decorate(decorators, target, key, desc);
-    else
-        for (var i = decorators.length - 1; i >= 0; i--)
-            if (d = decorators[i])
-                r = (c < 3 ? d(r) : c > 3 ? d(target, key, r) : d(target, key)) || r;
-    return c > 3 && r && Object.defineProperty(target, key, r), r;
-};
-var __metadata$b = (undefined && undefined.__metadata) || function (k, v) {
-    if (typeof Reflect === "object" && typeof Reflect.metadata === "function")
-        return Reflect.metadata(k, v);
-};
-const NylasCustomizeBookingSettings = class {
-    constructor(hostRef) {
-        registerInstance(this, hostRef);
-        this.valueChanged = createEvent(this, "valueChanged", 7);
-        if (hostRef.$hostElement$["s-ei"]) {
-            this.internals = hostRef.$hostElement$["s-ei"];
-        }
-        else {
-            this.internals = hostRef.$hostElement$.attachInternals();
-            hostRef.$hostElement$["s-ei"] = this.internals;
-        }
-        this.selectedConfiguration = undefined;
-        this.defaultAdditionalGuestsHidden = this.selectedConfiguration?.scheduler?.hide_additional_guests ?? false;
-        this.defaultHideCancellationOptions = this.selectedConfiguration?.scheduler?.hide_cancellation_options ?? false;
-        this.defaultHideReschedulingOptions = this.selectedConfiguration?.scheduler?.hide_rescheduling_options ?? false;
-        this.name = 'customize-booking-settings';
-        this.allowGuestsToInvite = this.defaultAdditionalGuestsHidden;
-        this.hideCancellationOptions = this.defaultHideCancellationOptions;
-        this.hideReschedulingOptions = this.defaultHideReschedulingOptions;
-    }
-    elementNameChangedHandler(newValue) {
-        debug('nylas-customize-booking-settings', 'elementNameChangedHandler', newValue);
-        this.host.setAttribute('name', newValue);
-    }
-    selectedConfigurationChangedHandler(newValue) {
-        debug('nylas-customize-booking-settings', 'selectedConfigurationChangedHandler', newValue);
-        this.allowGuestsToInvite = !newValue?.scheduler?.hide_additional_guests;
-        this.hideCancellationOptions = newValue?.scheduler?.hide_cancellation_options ?? false;
-        this.hideReschedulingOptions = newValue?.scheduler?.hide_rescheduling_options ?? false;
-    }
-    connectedCallback() {
-        debug('nylas-customize-booking-settings', 'connectedCallback');
-    }
-    disconnectedCallback() {
-        debug('nylas-customize-booking-settings', 'disconnectedCallback');
-    }
-    componentWillLoad() {
-        debug('nylas-customize-booking-settings', 'componentWillLoad');
-        this.host.setAttribute('name', this.name);
-    }
-    componentDidLoad() {
-        debug('nylas-customize-booking-settings', 'componentDidLoad');
-    }
-    componentWillUpdate() {
-        debug('nylas-customize-booking-settings', 'componentWillUpdate');
-    }
-    componentDidUpdate() {
-        debug('nylas-customize-booking-settings', 'componentDidUpdate');
-    }
-    componentWillRender() {
-        debug('nylas-customize-booking-settings', 'componentWillRender');
-    }
-    componentDidRender() {
-        debug('nylas-customize-booking-settings', 'componentDidRender');
-    }
-    checkboxToggledHandler(event) {
-        const { name, checked } = event.detail;
-        switch (name) {
-            case 'hide_additional_guests':
-                this.allowGuestsToInvite = checked;
-                break;
-            case 'hide_cancellation_options':
-                this.hideCancellationOptions = checked;
-                break;
-            case 'hide_rescheduling_options':
-                this.hideReschedulingOptions = checked;
-                break;
-        }
-        this.valueChanged.emit({
-            value: JSON.stringify({
-                additionalGuestsHidden: !this.allowGuestsToInvite,
-                hideCancellationOptions: this.hideCancellationOptions,
-                hideReschedulingOptions: this.hideReschedulingOptions,
-            }),
-            name: this.name,
-        });
-        this.internals.setFormValue(JSON.stringify({
-            additionalGuestsHidden: !this.allowGuestsToInvite,
-            hideCancellationOptions: this.hideCancellationOptions,
-            hideReschedulingOptions: this.hideReschedulingOptions,
-        }), this.name);
-    }
-    render() {
-        return (h(Host, { key: '543f4fc64d9dab03c528c5738cd4c1b1bb9cfd2a' }, h("div", { key: 'e3f153847ad5256327952d4be0aace03543b1d40', class: "nylas-customize-booking-settings", part: "ncbs" }, h("div", { key: '5b35f27785f6f6bc8e8848d94857869b73108df0', class: "header", part: "ncbs__header" }, h("h3", { key: 'd50a9614e3b0b5227a196356a43f12aab4acb158' }, "Additional settings"), h("p", { key: 'f29bbb165479e276cf87087582e9c60eb21c37d1' }, "Booking settings for the event.")), h("div", { key: 'd091485f983d0cc3ff86e7ca89df8d75526d3cef', class: "nylas-customize-booking-settings__settings", part: "ncbs__settings" }, h("div", { key: '7f7888a718a70a681795e599075c92cfbc16853a', class: "nylas-customize-booking-settings__settings-div", part: "ncbs__settings-div , ncbs__additional_guests" }, h("checkbox-component", { key: 'e37474d77812d96fe264d26c329078502c074dbe', name: "hide_additional_guests", label: "Allow guests to invite additional guests.", checked: this.allowGuestsToInvite }, h("span", { key: '00b45833c0223e373edf0b42669e4a154938b1eb', slot: "label", class: "label" }, h("p", { key: 'e66de8b9f53230347417a8ec0a7ae7a19af9db31', class: "label-contents" }, "Allow guests to invite additional guests to the booking."), h("tooltip-component", { key: '1ba5558e1991235c21f57ca1968220ea7bf43fcb', id: "guests" }, h("info-icon", { key: '3e62cc64cc55eb3dd4d0a73cef80a64c8dc9c38f', slot: "tooltip-icon" }), h("span", { key: '3853d0d575be29420ea012c90b0a2c07913a86a7', slot: "tooltip-content" }, "Allow guests to invite additional guests to the event. If enabled, the guest will be able to add additional guests' email addresses."))))), h("div", { key: '92e209a924673d8b1dee03475ffabfea5d9bf09b', class: "nylas-customize-booking-settings__settings-div", part: "ncbs__settings-div , ncbs__rescheduling_options" }, h("checkbox-component", { key: 'f7b522c07700938d25b17e14d236edb2aae12b21', name: "hide_rescheduling_options", label: "Hide 'Reschedule' option on booking page and emails.", checked: this.hideReschedulingOptions }, h("span", { key: '590cb5d983ff6eef95ebb370b845e1cc8e3080e4', slot: "label", class: "label" }, h("p", { key: '8f2d2742976e21a81268c793ae1c6c9dafdcecc3', class: "label-contents" }, "Hide the\u00A0", h("strong", { key: '4b01f75e4067d7c8d26ca785d5c6ad841633130c' }, "Reschedule"), "\u00A0button on the Scheduling Page and in the email notifications."), h("tooltip-component", { key: '8a157115569a4413143779c9e09c8389394973f9', id: "reschedule" }, h("info-icon", { key: 'b3a2c734d2d7a303d1d4d2622b51113aa7d3dfaf', slot: "tooltip-icon" }), h("span", { key: '2d08ceb49e744787da6863d72cf2c6df50f1a7cc', slot: "tooltip-content" }, "Hide the 'Reschedule' button on the Scheduling page and in the email notifications. If enabled, the guest will not be able to reschedule the booking."))))), h("div", { key: '6bc7f1a30a750ba85453d852f6f7e05c0513673d', class: "nylas-customize-booking-settings__settings-div", part: "ncbs__settings-div , ncbs__cancellation_options" }, h("checkbox-component", { key: '089ca174d8aabb26d87f5bb8cb871b9e82b7c04f', name: "hide_cancellation_options", label: "Hide 'Cancel' option on booking page and emails.", checked: this.hideCancellationOptions }, h("span", { key: '9ec50185d728baddbe0805eaeff057686b153bea', slot: "label", class: "label" }, h("p", { key: '118c1c3cc06dba90f451711aba0dde3efeeec9f0', class: "label-contents" }, "Hide the\u00A0", h("strong", { key: 'c1a26aa5c832fba488d60fc3af5a3c000ada144d' }, "Cancel"), "\u00A0button on the Scheduling Page and in the email notifications."), h("tooltip-component", { key: 'b70473d1e93c11d9b05a9dcec67d77795638bbeb', id: "cancel" }, h("info-icon", { key: '2f0d812ac9fb7a52260b601c590b7a629036ea7c', slot: "tooltip-icon" }), h("span", { key: '4c5b3b51b57761a377ccfa7f66d6d69486d8cb11', slot: "tooltip-content" }, "Hide the 'Cancel' button on the Scheduling page and in the email notifications. If enabled, the guest will not be able to cancel the booking.")))))))));
-    }
-    static get formAssociated() { return true; }
-    get host() { return getElement(this); }
-    static get watchers() { return {
-        "name": ["elementNameChangedHandler"],
-        "selectedConfiguration": ["selectedConfigurationChangedHandler"]
-    }; }
-};
-__decorate$b([
-    RegisterComponent({
-        name: 'nylas-customize-booking-settings',
-        stateToProps: new Map([['schedulerConfig.selectedConfiguration', 'selectedConfiguration']]),
-        fireRegisterEvent: true,
-    }),
-    __metadata$b("design:type", Function),
-    __metadata$b("design:paramtypes", []),
-    __metadata$b("design:returntype", void 0)
-], NylasCustomizeBookingSettings.prototype, "render", null);
-NylasCustomizeBookingSettings.style = NylasCustomizeBookingSettingsStyle0;
-const nylasEventDescriptionCss = ":host{--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}.nylas-event-description{display:flex;flex-direction:column;gap:4px}.nylas-event-description label{display:flex;align-items:center;color:var(--nylas-base-800);font-size:16px;font-style:normal;font-weight:400;line-height:150%;}.nylas-event-description label span.label-icon{margin-left:4px}.nylas-event-description label span.label-icon tooltip-component{display:flex}.nylas-event-description textarea{padding:12px 16px;border-width:1;resize:vertical;border-radius:8px;font-family:var(--nylas-font-family);font-size:16px;line-height:24px;border:1px solid var(--nylas-base-200)}.nylas-event-description textarea::-webkit-resizer{display:none}";
-const NylasEventDescriptionStyle0 = nylasEventDescriptionCss;
-var __decorate$a = (undefined && undefined.__decorate) || function (decorators, target, key, desc) {
-    var c = arguments.length, r = c < 3 ? target : desc === null ? desc = Object.getOwnPropertyDescriptor(target, key) : desc, d;
-    if (typeof Reflect === "object" && typeof Reflect.decorate === "function")
-        r = Reflect.decorate(decorators, target, key, desc);
-    else
-        for (var i = decorators.length - 1; i >= 0; i--)
-            if (d = decorators[i])
-                r = (c < 3 ? d(r) : c > 3 ? d(target, key, r) : d(target, key)) || r;
-    return c > 3 && r && Object.defineProperty(target, key, r), r;
-};
-var __metadata$a = (undefined && undefined.__metadata) || function (k, v) {
-    if (typeof Reflect === "object" && typeof Reflect.metadata === "function")
-        return Reflect.metadata(k, v);
-};
-const NylasEventDescription = class {
-    constructor(hostRef) {
-        registerInstance(this, hostRef);
-        this.valueChanged = createEvent(this, "valueChanged", 7);
-        if (hostRef.$hostElement$["s-ei"]) {
-            this.internals = hostRef.$hostElement$["s-ei"];
-        }
-        else {
-            this.internals = hostRef.$hostElement$.attachInternals();
-            hostRef.$hostElement$["s-ei"] = this.internals;
-        }
-        this.selectedConfiguration = undefined;
-        this.eventDescription = undefined;
-        this.name = 'description';
-        this.description = this.eventDescription || this.selectedConfiguration?.event_booking?.description || '';
-    }
-    elementNameChangedHandler(newValue) {
-        debug('nylas-event-description', 'elementNameChangedHandler', newValue);
-        this.host.setAttribute('name', newValue);
-    }
-    selectedConfigurationChangedHandler(newValue, oldValue) {
-        debug('nylas-custom-booking-flow', 'selectedConfigurationChangedHandler', newValue, oldValue);
-        if (newValue?.event_booking?.description) {
-            this.description = newValue?.event_booking?.description;
-        }
-    }
-    connectedCallback() {
-        debug('nylas-event-description', 'connectedCallback');
-    }
-    componentWillLoad() {
-        debug('nylas-event-description', 'componentWillLoad');
-        this.host.setAttribute('name', this.name);
-    }
-    componentDidLoad() {
-        debug('nylas-event-description', 'componentDidLoad');
-    }
-    disconnectedCallback() {
-        debug('nylas-event-description', 'disconnectedCallback');
-    }
-    handleChange(event) {
-        const value = sanitizeHtml(event.target.value);
-        this.description = value;
-        this.internals.setFormValue(value, 'description');
-        this.valueChanged.emit({ value: value, name: this.name });
-    }
-    render() {
-        return (h(Host, { key: 'ac483c56982373fb625c6d1af54eed749ce820e2' }, h("div", { key: '3924853ea2c94d72bf2a04a319bee5fc61eb7642', class: "nylas-event-description", part: "nedesc" }, h("label", { key: 'e8f9990a4f0766de9691080ef02b823c4cd6beb4', htmlFor: "description" }, "Event description", h("span", { key: 'dc7fa731cc60ed6e59032cdb35d0b410de300750', class: "label-icon" }, h("tooltip-component", { key: '1c0b1a5a547227bf7d4f499cc7c319349ec26e2d' }, h("info-icon", { key: 'e74034f5a5d8ab86c0d497b15c9cb8016d22f38e', slot: "tooltip-icon" }), h("span", { key: 'c5efa1fc3adc9290e39d40f1f7998e0c6bdd3bf4', slot: "tooltip-content" }, "Provide any additional details for your event.")))), h("textarea", { key: '45d8cc241ab90a24ec437499234b02cc401fa720', id: "description", part: "nedesc__textarea", name: "description", value: this.description, maxlength: "8192", onInput: e => this.handleChange(e) }))));
-    }
-    static get formAssociated() { return true; }
-    get host() { return getElement(this); }
-    static get watchers() { return {
-        "name": ["elementNameChangedHandler"],
-        "selectedConfiguration": ["selectedConfigurationChangedHandler"]
-    }; }
-};
-__decorate$a([
-    RegisterComponent({
-        name: 'nylas-event-description',
-        stateToProps: new Map([['schedulerConfig.selectedConfiguration', 'selectedConfiguration']]),
-        eventToProps: {},
-        fireRegisterEvent: true,
-    }),
-    __metadata$a("design:type", Function),
-    __metadata$a("design:paramtypes", []),
-    __metadata$a("design:returntype", void 0)
-], NylasEventDescription.prototype, "render", null);
-NylasEventDescription.style = NylasEventDescriptionStyle0;
-const nylasEventDurationCss = ":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}.nylas-event-duration{display:flex;flex-direction:column;gap:4px}.nylas-event-duration label{display:flex;align-items:center;color:var(--nylas-base-800);font-size:16px;font-style:normal;font-weight:400;line-height:150%;}.nylas-event-duration label span.required{color:var(--nylas-error, #cc4841)}.nylas-event-duration label span.label-icon{margin-left:4px}.nylas-event-duration label span.label-icon tooltip-component{display:flex}.nylas-event-duration__wrapper{display:flex;align-items:center;gap:0.5rem}.nylas-event-duration__wrapper input{padding:12px 16px;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:48px}.nylas-event-duration__wrapper input-dropdown::part(id_dropdown-input){border:1px solid var(--nylas-base-200);border-radius:var(--nylas-border-radius-2x);padding:14px 16px;width:50px}.nylas-event-duration__wrapper input-dropdown::part(id_dropdown-content){width:100%;min-width:unset;height:200px}.nylas-event-duration__wrapper select-dropdown{width:120px}@media screen and (max-width: 768px){.nylas-event-duration__wrapper select-dropdown{width:100%}}.nylas-event-duration__wrapper select-dropdown::part(sd_dropdown-button){border:1px solid var(--nylas-base-200)}";
-const NylasEventDurationStyle0 = nylasEventDurationCss;
-var __decorate$9 = (undefined && undefined.__decorate) || function (decorators, target, key, desc) {
-    var c = arguments.length, r = c < 3 ? target : desc === null ? desc = Object.getOwnPropertyDescriptor(target, key) : desc, d;
-    if (typeof Reflect === "object" && typeof Reflect.decorate === "function")
-        r = Reflect.decorate(decorators, target, key, desc);
-    else
-        for (var i = decorators.length - 1; i >= 0; i--)
-            if (d = decorators[i])
-                r = (c < 3 ? d(r) : c > 3 ? d(target, key, r) : d(target, key)) || r;
-    return c > 3 && r && Object.defineProperty(target, key, r), r;
-};
-var __metadata$9 = (undefined && undefined.__metadata) || function (k, v) {
-    if (typeof Reflect === "object" && typeof Reflect.metadata === "function")
-        return Reflect.metadata(k, v);
-};
-const NylasEventDuration = class {
-    constructor(hostRef) {
-        registerInstance(this, hostRef);
-        this.valueChanged = createEvent(this, "valueChanged", 7);
-        if (hostRef.$hostElement$["s-ei"]) {
-            this.internals = hostRef.$hostElement$["s-ei"];
-        }
-        else {
-            this.internals = hostRef.$hostElement$.attachInternals();
-            hostRef.$hostElement$["s-ei"] = this.internals;
-        }
-        this.selectedConfiguration = undefined;
-        this.name = 'duration';
-        this.eventDurationMinutes = undefined;
-        this.duration = this.eventDurationMinutes ? (this.eventDurationMinutes >= 60 ? this.eventDurationMinutes / 60 : this.eventDurationMinutes) : 30;
-        this.durationMinutes = this.eventDurationMinutes ?? 30;
-        this.durationIncrement = this.eventDurationMinutes ? (this.eventDurationMinutes >= 60 ? 60 : 1) : 1;
-        this.durationMinutesOptions = [
-            { value: 15, label: '15' },
-            { value: 30, label: '30' },
-            { value: 45, label: '45' },
-            { value: 60, label: '60' },
-        ];
-    }
-    elementNameChangedHandler(newValue) {
-        debug('nylas-event-duration', 'elementNameChangedHandler', newValue);
-        this.host.setAttribute('name', newValue);
-    }
-    selectedConfigurationChangedHandler(newVal) {
-        const configDuration = newVal?.availability?.duration_minutes;
-        if (configDuration) {
-            this.duration = configDuration >= 60 ? configDuration / 60 : configDuration;
-            this.durationMinutes = configDuration ?? 30;
-            this.durationIncrement = configDuration >= 60 ? 60 : 1;
-        }
-    }
-    durationMinutesChangedHandler(newValue, oldValue) {
-        debug('nylas-event-duration', 'durationMinutesChangedHandler', newValue);
-        if (newValue === oldValue) {
-            return;
-        }
-        this.valueChanged.emit({ value: newValue.toString(), name: this.name });
-    }
-    connectedCallback() {
-        debug('nylas-event-duration', 'connectedCallback');
-    }
-    componentWillLoad() {
-        debug('nylas-event-duration', 'componentWillLoad');
-        this.host.setAttribute('name', this.name);
-        this.setDurationMintueOptions();
-    }
-    componentDidLoad() {
-        debug('nylas-event-duration', 'componentDidLoad');
-        this.internals.setFormValue(this.durationMinutes.toString(), 'duration');
-    }
-    disconnectedCallback() {
-        debug('nylas-event-duration', 'disconnectedCallback');
-    }
-    setDurationMintueOptions() {
-        if (this.durationIncrement === 1) {
-            this.durationMinutesOptions = [
-                { value: 15, label: '15' },
-                { value: 30, label: '30' },
-                { value: 45, label: '45' },
-                { value: 60, label: '60' },
-            ];
-        }
-        else {
-            this.durationMinutesOptions = Array.from({ length: 23 }, (_, i) => ({ value: i + 1, label: (i + 1).toString() }));
-        }
-        return this.durationMinutesOptions;
-    }
-    handleChange(event) {
-        this.duration = event.target.value;
-        this.durationMinutes = this.duration * this.durationIncrement;
-        this.internals.setFormValue(this.durationMinutes.toString(), this.name);
-    }
-    nylasFormDropdownChangedHandler(event) {
-        debug('nylas-calendar-picker', 'nylasFormDropdownChangedHandler', event.detail);
-        const { value } = event.detail;
-        this.durationIncrement = parseInt(value);
-        if (this.durationIncrement === 1) {
-            this.duration = 60;
-        }
-        else {
-            this.duration = 1;
-        }
-        this.setDurationMintueOptions();
-        this.durationMinutes = this.duration * this.durationIncrement;
-        this.internals.setFormValue(this.durationMinutes.toString(), 'duration');
-    }
-    inputOptionChangedHandler(event) {
-        debug('nylas-calendar-picker', 'inputOptionChangedHandler', event.detail);
-        const { value } = event.detail;
-        this.duration = value;
-        this.durationMinutes = this.duration * this.durationIncrement;
-        this.internals.setFormValue(this.durationMinutes.toString(), this.name);
-    }
-    render() {
-        const durationOptions = [
-            { value: 1, label: 'minute' },
-            { value: 60, label: 'hour' },
-        ];
-        return (h(Host, { key: 'c8ab90c7a45ce6a5379552af0a9059b9d829e82c' }, h("div", { key: 'd957e610bd31a55430235b0ca903905c8bf3706b', class: "nylas-event-duration", part: "ned" }, h("label", { key: '39324d77ad9da4bc0c1f36d15c28384f423c1976', htmlFor: "duration" }, "Event duration", h("span", { key: '8f222a8a5d03899ff06790133434028dd1a62cd4', class: "required" }, "*"), h("span", { key: '6b83c675faa33db229ded711eac8c1f565bc9a61', class: "label-icon" }, h("tooltip-component", { key: '01b7ba340e2883e5a22d4559f67feda4bc745109' }, h("info-icon", { key: 'acbfa3dcbc994dec0e502ea9ded00612bf24b315', slot: "tooltip-icon" }), h("span", { key: 'e691c2a8ce4953e448cb6850ab2648645ae688c0', slot: "tooltip-content" }, "Set the duration of your event.")))), h("div", { key: '294766a022ba73042705050bc2fbc294cd1433b4', class: "nylas-event-duration__wrapper" }, h("input-dropdown", { key: '9a61a9527ae4c9991dc1f1596fbed85a5dd57966', 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(i => i.value == this.duration) ?? durationOptions[0] }), h("select-dropdown", { key: 'edcda0700a80961b9a8b9f325288d70a1aa4e6f0', name: 'event-duration', options: durationOptions, pluralizedLabel: this.duration > 1 ? 's' : '', exportparts: "sd_dropdown: ned__dropdown, sd_dropdown-button: ned__dropdown-button, sd_dropdown-content: ned__dropdown-content", defaultSelectedOption: durationOptions.find(i => i.value == this.durationIncrement) ?? durationOptions[0], withSearch: false })))));
-    }
-    static get formAssociated() { return true; }
-    get host() { return getElement(this); }
-    static get watchers() { return {
-        "name": ["elementNameChangedHandler"],
-        "selectedConfiguration": ["selectedConfigurationChangedHandler"],
-        "durationMinutes": ["durationMinutesChangedHandler"]
-    }; }
-};
-__decorate$9([
-    RegisterComponent({
-        name: 'nylas-event-duration',
-        stateToProps: new Map([['schedulerConfig.selectedConfiguration', 'selectedConfiguration']]),
-        eventToProps: {},
-        fireRegisterEvent: true,
-    }),
-    __metadata$9("design:type", Function),
-    __metadata$9("design:paramtypes", []),
-    __metadata$9("design:returntype", void 0)
-], NylasEventDuration.prototype, "render", null);
-NylasEventDuration.style = NylasEventDurationStyle0;
-const nylasEventInfoCss = ":host{display:block;margin:1rem;--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}.nylas-event-info__title{color:var(--nylas-base-900);font-size:16px;font-style:normal;font-weight:600;line-height:20px;margin:0;text-align:left}.nylas-event-info__subtitle{color:var(--nylas-base-600);font-size:14px;font-style:normal;font-weight:400;line-height:20px;margin:0.25rem 0px 0px;text-align:left}.nylas-event-info__content{padding:1rem;display:flex;flex-direction:column;gap:1rem}.nylas-event-info__block{display:flex;justify-content:space-between;gap:0.5rem}";
-const NylasEventInfoStyle0 = nylasEventInfoCss;
-var __decorate$8 = (undefined && undefined.__decorate) || function (decorators, target, key, desc) {
-    var c = arguments.length, r = c < 3 ? target : desc === null ? desc = Object.getOwnPropertyDescriptor(target, key) : desc, d;
-    if (typeof Reflect === "object" && typeof Reflect.decorate === "function")
-        r = Reflect.decorate(decorators, target, key, desc);
-    else
-        for (var i = decorators.length - 1; i >= 0; i--)
-            if (d = decorators[i])
-                r = (c < 3 ? d(r) : c > 3 ? d(target, key, r) : d(target, key)) || r;
-    return c > 3 && r && Object.defineProperty(target, key, r), r;
-};
-var __metadata$8 = (undefined && undefined.__metadata) || function (k, v) {
-    if (typeof Reflect === "object" && typeof Reflect.metadata === "function")
-        return Reflect.metadata(k, v);
-};
-const NylasEventInfo = class {
-    constructor(hostRef) {
-        registerInstance(this, hostRef);
-        if (hostRef.$hostElement$["s-ei"]) {
-            this.internals = hostRef.$hostElement$["s-ei"];
-        }
-        else {
-            this.internals = hostRef.$hostElement$.attachInternals();
-            hostRef.$hostElement$["s-ei"] = this.internals;
-        }
-    }
-    connectedCallback() {
-        debug('nylas-event-info', 'connectedCallback');
-    }
-    componentWillLoad() {
-        debug('nylas-event-info', 'componentWillLoad');
-    }
-    componentDidLoad() {
-        debug('nylas-event-info', 'componentDidLoad');
-        checkForMissingSlots(['inputs'], this.el);
-    }
-    disconnectedCallback() {
-        debug('nylas-event-info', 'disconnectedCallback');
-    }
-    render() {
-        return (h(Host, { key: 'adf72357920be8fadb32c683735719e5dbf76883' }, h("nylas-form-card", { key: '33823a1bbd57716f9b056f5addba8a5fb316ac93' }, h("h1", { key: 'eb14a7f95322992e24dad4e9ff612ffcb7c7634a', slot: "header-title", class: "nylas-event-info__title" }, "Event information"), h("h3", { key: '366d9ed654b03ea7bfe9d902240fcd4ad3c2b177', slot: "header-subtitle", class: "nylas-event-info__subtitle" }, "Enter all event information."), h("div", { key: 'a6abc2c53dbce1d8d0ad444033d1361171bc5720', slot: "content", class: "nylas-event-info__content" }, h("slot", { key: 'c814d4c24582dc76ee96f8e87c9b610a06205273', name: "inputs" })))));
-    }
-    static get formAssociated() { return true; }
-    get el() { return getElement(this); }
-};
-__decorate$8([
-    RegisterComponent({
-        name: 'nylas-event-info',
-        eventToProps: {},
-        fireRegisterEvent: true,
-    }),
-    __metadata$8("design:type", Function),
-    __metadata$8("design:paramtypes", []),
-    __metadata$8("design:returntype", void 0)
-], NylasEventInfo.prototype, "render", null);
-NylasEventInfo.style = NylasEventInfoStyle0;
-const nylasEventLimitsCss = ":host{display:block;margin:1rem;--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}.nylas-event-limits__title{color:var(--nylas-base-900);font-size:16px;font-style:normal;font-weight:600;line-height:20px;margin:0;text-align:left}.nylas-event-limits__subtitle{color:var(--nylas-base-600);font-size:14px;font-style:normal;font-weight:400;line-height:20px;margin:0.25rem 0px 0px;text-align:left}.nylas-event-limits__content{padding:1rem;display:flex;flex-direction:column;gap:1rem}.nylas-event-limits__block{display:flex;justify-content:space-between;gap:0.5rem}";
-const NylasEventLimitsStyle0 = nylasEventLimitsCss;
-var __decorate$7 = (undefined && undefined.__decorate) || function (decorators, target, key, desc) {
-    var c = arguments.length, r = c < 3 ? target : desc === null ? desc = Object.getOwnPropertyDescriptor(target, key) : desc, d;
-    if (typeof Reflect === "object" && typeof Reflect.decorate === "function")
-        r = Reflect.decorate(decorators, target, key, desc);
-    else
-        for (var i = decorators.length - 1; i >= 0; i--)
-            if (d = decorators[i])
-                r = (c < 3 ? d(r) : c > 3 ? d(target, key, r) : d(target, key)) || r;
-    return c > 3 && r && Object.defineProperty(target, key, r), r;
-};
-var __metadata$7 = (undefined && undefined.__metadata) || function (k, v) {
-    if (typeof Reflect === "object" && typeof Reflect.metadata === "function")
-        return Reflect.metadata(k, v);
-};
-const NylasEventLimits = class {
-    constructor(hostRef) {
-        registerInstance(this, hostRef);
-        if (hostRef.$hostElement$["s-ei"]) {
-            this.internals = hostRef.$hostElement$["s-ei"];
-        }
-        else {
-            this.internals = hostRef.$hostElement$.attachInternals();
-            hostRef.$hostElement$["s-ei"] = this.internals;
-        }
-    }
-    connectedCallback() {
-        debug('nylas-event-limits', 'connectedCallback');
-    }
-    componentWillLoad() {
-        debug('nylas-event-limits', 'componentWillLoad');
-    }
-    componentDidLoad() {
-        debug('nylas-event-limits', 'componentDidLoad');
-        checkForMissingSlots(['inputs'], this.el);
-    }
-    disconnectedCallback() {
-        debug('nylas-event-limits', 'disconnectedCallback');
-    }
-    render() {
-        return (h(Host, { key: '4afbe82f9887a84579e5a16fa628a8785927e19f' }, h("nylas-form-card", { key: 'b092de56ed7f3902ed5de970963697e19f47b5ea' }, h("h1", { key: 'c1a940f48d1e8daeaa719cfcefc7b5948960ea5c', slot: "header-title", class: "nylas-event-limits__title" }, "Set event limits"), h("h3", { key: '68c6426b83df6c15a85f6bae5bc0fd47aa17e8b4', slot: "header-subtitle", class: "nylas-event-limits__subtitle" }, "Customize event limits for the event."), h("div", { key: 'e70ed6be6d75a69b9405c38c0ab68accbc799670', slot: "content", class: "nylas-event-limits__content" }, h("slot", { key: '7220956029fa2ae7f8ab7f05342ab2ee8d15c15f', name: "inputs" })))));
-    }
-    static get formAssociated() { return true; }
-    get el() { return getElement(this); }
-};
-__decorate$7([
-    RegisterComponent({
-        name: 'nylas-event-limits',
-        eventToProps: {},
-        fireRegisterEvent: true,
-    }),
-    __metadata$7("design:type", Function),
-    __metadata$7("design:paramtypes", []),
-    __metadata$7("design:returntype", void 0)
-], NylasEventLimits.prototype, "render", null);
-NylasEventLimits.style = NylasEventLimitsStyle0;
-const nylasEventLocationCss = ":host{--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}.nylas-event-location{display:flex;flex-direction:column;gap:4px;font-family:var(--nylas-font-family)}.nylas-event-location label{display:flex;align-items:center;color:var(--nylas-base-800);font-size:16px;font-style:normal;font-weight:400;line-height:150%;}.nylas-event-location label span.label-icon{margin-left:4px}.nylas-event-location label span.label-icon tooltip-component{display:flex}.nylas-event-location span[slot=select-icon]{border-right:1px solid var(--nylas-base-200);padding:16px 0.75rem 16px 0.5rem;border-radius:var(--nylas-border-radius-2x);border-bottom-right-radius:0;border-top-right-radius:0;height:20px}.nylas-event-location div.location-input{display:grid;grid-template-columns:auto 1fr;width:100%;gap:0.5rem}@media screen and (max-width: 768px){.nylas-event-location div.location-input{grid-template-columns:1fr}}.nylas-event-location div.location-input input{border:1px solid var(--nylas-base-200);border-radius:var(--nylas-border-radius-2x);padding:12px 16px;font-family:var(--nylas-font-family);font-size:16px;line-height:24px}.nylas-event-location select-dropdown{width:208px}@media screen and (max-width: 768px){.nylas-event-location select-dropdown{width:100%}}.nylas-event-location select-dropdown::part(sd_dropdown){width:100%}.nylas-event-location select-dropdown::part(sd_dropdown-content){left:calc(35px + 0.5rem)}.nylas-event-location select-dropdown::part(sd_dropdown-button){display:flex;justify-content:space-between;width:100%;border:1px solid var(--nylas-base-200);padding:0 0.5rem}.nylas-event-location select-dropdown::part(sd_dropdown-button-selected-label){display:inline-flex;align-self:center;padding:14px 0;font-family:var(--nylas-font-family);font-size:16px;line-height:24px}";
-const NylasEventLocationStyle0 = nylasEventLocationCss;
-var __decorate$6 = (undefined && undefined.__decorate) || function (decorators, target, key, desc) {
-    var c = arguments.length, r = c < 3 ? target : desc === null ? desc = Object.getOwnPropertyDescriptor(target, key) : desc, d;
-    if (typeof Reflect === "object" && typeof Reflect.decorate === "function")
-        r = Reflect.decorate(decorators, target, key, desc);
-    else
-        for (var i = decorators.length - 1; i >= 0; i--)
-            if (d = decorators[i])
-                r = (c < 3 ? d(r) : c > 3 ? d(target, key, r) : d(target, key)) || r;
-    return c > 3 && r && Object.defineProperty(target, key, r), r;
-};
-var __metadata$6 = (undefined && undefined.__metadata) || function (k, v) {
-    if (typeof Reflect === "object" && typeof Reflect.metadata === "function")
-        return Reflect.metadata(k, v);
-};
-const NylasEventLocation = class {
-    constructor(hostRef) {
-        registerInstance(this, hostRef);
-        this.valueChanged = createEvent(this, "valueChanged", 7);
-        if (hostRef.$hostElement$["s-ei"]) {
-            this.internals = hostRef.$hostElement$["s-ei"];
-        }
-        else {
-            this.internals = hostRef.$hostElement$.attachInternals();
-            hostRef.$hostElement$["s-ei"] = this.internals;
-        }
-        this.name = 'location';
-        this.selectedConfiguration = undefined;
-        this.eventLocation = undefined;
-        this.location = this.eventLocation ?? '';
-        this.selectedLocationOption = this.eventLocation ? 'custom' : 'none';
-    }
-    elementNameChangedHandler(newValue) {
-        debug('nylas-event-location', 'elementNameChangedHandler', newValue);
-        this.host.setAttribute('name', newValue);
-    }
-    selectedConfigurationChangedHandler(newValue, oldValue) {
-        debug('nylas-custom-booking-flow', 'selectedConfigurationChangedHandler', newValue, oldValue);
-        const configLocation = newValue?.event_booking?.location;
-        if (configLocation) {
-            this.selectedLocationOption = configLocation ? 'custom' : 'none';
-            this.location = configLocation;
-        }
-    }
-    eventLocationChangedHandler(newValue, oldValue) {
-        debug('nylas-event-location', 'eventLocationChangedHandler', newValue);
-        if (newValue === oldValue) {
-            return;
-        }
-        this.selectedLocationOption = newValue ? 'custom' : 'none';
-    }
-    connectedCallback() {
-        debug('nylas-event-location', 'connectedCallback');
-    }
-    componentWillLoad() {
-        debug('nylas-event-location', 'componentWillLoad');
-        this.host.setAttribute('name', this.name);
-    }
-    componentDidLoad() {
-        debug('nylas-event-location', 'componentDidLoad');
-    }
-    disconnectedCallback() {
-        debug('nylas-event-location', 'disconnectedCallback');
-    }
-    nylasFormDropdownChangedHandler(event) {
-        this.selectedLocationOption = event.detail.value;
-        if (this.selectedLocationOption === 'none') {
-            this.location = '';
-            this.setFormValue('', 'location');
-            this.valueChanged.emit({ value: '', name: this.name });
-        }
-    }
-    setFormValue(value, name) {
-        if (typeof this.internals.setFormValue === 'function') {
-            this.internals.setFormValue(value, name);
-        }
-    }
-    handleChange(event) {
-        const value = sanitizeHtml(event.target.value);
-        this.location = value;
-        this.setFormValue(value, 'location');
-        this.valueChanged.emit({ value: value, name: this.name });
-    }
-    render() {
-        const locationOptions = [
-            { value: 'none', label: 'None' },
-            { value: 'custom', label: 'Custom location' },
-        ];
-        const icons = {
-            none: h("location-off-icon", { key: 'b83e4c1ee5292f3261fca8489ec10a6ded3378dc' }),
-            custom: h("location-icon", { key: '6ba8c483b7e242b0accf8a55ccb11efc8b4e19a5' }),
-        };
-        return (h(Host, { key: 'f65e817196207fa0397fb599bc89a8cb72b7e8e1' }, h("div", { key: '7410dde44d2b93d0aa655feb0c9dede3b14f3f1e', class: "nylas-event-location", part: "nel" }, h("label", { key: '4d158faf262e76e325e1dc35792bc36800a3df6f', htmlFor: "location" }, "Location type", h("span", { key: '28b4287f14b80b9a1db726470bf27dd017b3ba37', class: "label-icon" }, h("tooltip-component", { key: '65a2db2bdf57377beb1b5b4801a89f5a74320205' }, h("info-icon", { key: '350b0f6f2c7f442cc4fb3fdee838c600d271d667', slot: "tooltip-icon" }), h("span", { key: '31027673d5cd518b6cbc847c0010f482b0540de6', slot: "tooltip-content" }, "Choose how you\u2019ll meet with the participants at the scheduled time. Pick from available conferencing options or add a custom location.")))), h("div", { key: 'a902e62a97f181dcb6b0e0e4daea1ec4c817fe58', class: "location-input" }, h("select-dropdown", { key: '5f271d86549b8fa286b630f169e191d4c1d73e3d', withSearch: false, name: "location", options: locationOptions, defaultSelectedOption: locationOptions.find(i => i.value == this.selectedLocationOption), exportparts: "sd_dropdown: nel__dropdown, sd_dropdown-button: nel__dropdown-button, sd_dropdown-content: nel__dropdown-content" }, h("span", { key: 'cdc3f3fcdf971ffe3495f085b39cac2a1e77df11', slot: "select-icon" }, icons[this.selectedLocationOption])), this.selectedLocationOption === 'custom' && (h("input", { type: "text", part: "nel__location", id: "location", name: "location", maxlength: "1024", value: this.location, onInput: e => this.handleChange(e) }))))));
-    }
-    static get formAssociated() { return true; }
-    get host() { return getElement(this); }
-    static get watchers() { return {
-        "name": ["elementNameChangedHandler"],
-        "selectedConfiguration": ["selectedConfigurationChangedHandler"],
-        "eventLocation": ["eventLocationChangedHandler"]
-    }; }
-};
-__decorate$6([
-    RegisterComponent({
-        name: 'nylas-event-location',
-        stateToProps: new Map([['schedulerConfig.selectedConfiguration', 'selectedConfiguration']]),
-        eventToProps: {},
-        fireRegisterEvent: true,
-    }),
-    __metadata$6("design:type", Function),
-    __metadata$6("design:paramtypes", []),
-    __metadata$6("design:returntype", void 0)
-], NylasEventLocation.prototype, "render", null);
-NylasEventLocation.style = NylasEventLocationStyle0;
-const nylasEventTitleCss = ":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}.nylas-event-title{display:flex;flex-direction:column;gap:4px;position:relative;text-align:left}.nylas-event-title div.title{padding:12px 16px;border:1px solid var(--nylas-base-200);border-radius:var(--nylas-border-radius-2x);overflow:scroll;white-space:nowrap;scrollbar-width:thin}.nylas-event-title div.title::-webkit-scrollbar{width:6px;height:6px}.nylas-event-title div.title.error{border-color:var(--nylas-error);outline:none}.nylas-event-title input{padding:12px 16px;border-width:1;border-radius:8px;border:1px solid var(--nylas-base-200)}.nylas-event-title span.help-text{color:var(--nylas-base-800);font-size:14px;font-style:normal;font-weight:400;line-height:21px}.nylas-event-title span.error-message{color:var(--nylas-error)}.nylas-event-title label{display:flex;align-items:center;color:var(--nylas-base-800);font-size:16px;font-style:normal;font-weight:400;line-height:150%;}.nylas-event-title label span.required{color:var(--nylas-error, #cc4841)}.nylas-event-title label span.label-icon{margin-left:4px}.nylas-event-title label span.label-icon tooltip-component{display:flex}.highlighted-tag{background-color:var(--nylas-base-200);border-radius:var(--nylas-border-radius);padding:5px;margin-left:4px}.token-options{display:block;background-color:var(--nylas-base-0);width:100%;max-height:336px;overflow:auto;z-index:1;border-radius:4px;position:absolute;top:80px;box-shadow:0px 4px 6px -2px rgba(0, 0, 0, 0.0509803922);box-shadow:0px 10px 15px -3px rgba(0, 0, 0, 0.1019607843)}@media screen and (max-width: 768px){.token-options{right:0;width:325px;max-width:unset}}.token-options ul{padding:0;list-style-type:none;color:var(--nylas-base-900);max-height:336px;margin:0}.token-options ul li{padding:16px, 12px, 16px, 12px;color:black;padding:12px 16px;text-decoration:none;display:block;font-family:inherit;font-size:14px;font-weight:400;line-height:20px;letter-spacing:0px;text-align:left;cursor:pointer}.token-options ul li .token-label{display:flex;flex-direction:column;font-weight:400}.token-options ul li .token-label .token{color:var(--nylas-abse-900);font-size:16px;line-height:24px}.token-options ul li .token-label .description{color:var(--nylas-base-600);font-size:14px;line-height:21px}.token-options ul li:hover,.token-options ul li:focus,.token-options ul li:active,.token-options ul li.active{background-color:var(--nylas-base-100)}.token-options ul li:hover .token-label .token,.token-options ul li:focus .token-label .token,.token-options ul li:active .token-label .token,.token-options ul li.active .token-label .token{color:var(--nylas-primary)}.token-options .selected{background-color:var(--nylas-base-100)}";
-const NylasEventTitleStyle0 = nylasEventTitleCss;
-var __decorate$5 = (undefined && undefined.__decorate) || function (decorators, target, key, desc) {
-    var c = arguments.length, r = c < 3 ? target : desc === null ? desc = Object.getOwnPropertyDescriptor(target, key) : desc, d;
-    if (typeof Reflect === "object" && typeof Reflect.decorate === "function")
-        r = Reflect.decorate(decorators, target, key, desc);
-    else
-        for (var i = decorators.length - 1; i >= 0; i--)
-            if (d = decorators[i])
-                r = (c < 3 ? d(r) : c > 3 ? d(target, key, r) : d(target, key)) || r;
-    return c > 3 && r && Object.defineProperty(target, key, r), r;
-};
-var __metadata$5 = (undefined && undefined.__metadata) || function (k, v) {
-    if (typeof Reflect === "object" && typeof Reflect.metadata === "function")
-        return Reflect.metadata(k, v);
-};
-const NylasEventTitle = class {
-    constructor(hostRef) {
-        registerInstance(this, hostRef);
-        this.valueChanged = createEvent(this, "valueChanged", 7);
-        if (hostRef.$hostElement$["s-ei"]) {
-            this.internals = hostRef.$hostElement$["s-ei"];
-        }
-        else {
-            this.internals = hostRef.$hostElement$.attachInternals();
-            hostRef.$hostElement$["s-ei"] = this.internals;
-        }
-        this.selectedConfiguration = undefined;
-        this.eventTitle = this.selectedConfiguration?.event_booking?.title;
-        this.name = 'title';
-        this.showTokens = false;
-        this.availableTokens = EVENT_TITLE_TOKENS.map(token => ({
-            label: token.token,
-            value: token.value,
-            labelHTML: token,
-        }));
-        this.filteredTokens = this.availableTokens;
-        this.ariaActivedescendant = '';
-        this.currentWord = { $value: '', fullText: '', index: -1, focusOffset: -1 };
-        this.validationError = '';
-    }
-    elementNameChangedHandler(newValue) {
-        debug('nylas-event-title', 'elementNameChangedHandler', newValue);
-        this.host.setAttribute('name', newValue);
-    }
-    ariaActivedescendantChangedHandler(newValue) {
-        debug('nylas-event-title', 'ariaActivedescendantChangedHandler', newValue);
-        if (newValue !== '') {
-            const activeOption = this.host.shadowRoot?.getElementById(newValue);
-            activeOption?.classList.add('active');
-        }
-        else {
-            const options = this.host.shadowRoot?.querySelectorAll('.token-options li.active');
-            options?.forEach(option => option.classList.remove('active'));
-        }
-    }
-    configChangedHandler(newVal) {
-        const title = newVal?.event_booking?.title;
-        if (title) {
-            this.updateEventTitleFromProp(title);
-        }
-    }
-    connectedCallback() {
-        debug('nylas-event-title', 'connectedCallback');
-    }
-    componentWillLoad() {
-        debug('nylas-event-title', 'componentWillLoad');
-        this.host.setAttribute('name', this.name);
-    }
-    componentDidLoad() {
-        debug('nylas-event-title', 'componentDidLoad');
-        this.updateEventTitleFromProp(this.eventTitle || '');
-    }
-    disconnectedCallback() {
-        debug('nylas-event-title', 'disconnectedCallback');
-    }
-    formSubmittedHandler(event) {
-        debug('nylas-event-title', 'formSubmittedHandler', event);
-        if (!this.internals?.validity?.valid) {
-            this.validationError = 'Event title is required';
-        }
-        else {
-            this.validationError = '';
-        }
-    }
-    updateEventTitleFromProp(newValue) {
-        debug('nylas-event-title', 'eventTitleChangedHandler', newValue);
-        if (this.titleRef) {
-            this.titleRef.innerHTML = this.highlightTokens(newValue);
-            this.titleRef.focus();
-            if (typeof this.internals.setValidity === 'function') {
-                if (newValue === '') {
-                    this.internals?.setValidity({ customError: true }, `Event title is required`, this.titleRef);
-                }
-                else {
-                    this.internals?.setValidity({ customError: false });
-                }
-            }
-        }
-    }
-    highlightTokens(title) {
-        let outputHtml = title;
-        EVENT_TITLE_TOKENS.forEach(tokenObj => {
-            const token = tokenObj.value;
-            const regex = new RegExp(`(\\${token})(?!\\w)`, 'g');
-            outputHtml = outputHtml.replace(regex, '<span class="highlighted-tag">$1</span>');
-        });
-        return outputHtml;
-    }
-    getCurrentSelectionForBrowser() {
-        const getSelectionTextData = (nodeValue, offset, node, allSelected) => {
-            const text = nodeValue.replace(/[\u200B-\u200D\uFEFF]/g, '');
-            const dollarIndex = text.lastIndexOf('$');
-            const lastWord = text.substring(dollarIndex).split(' ')[0];
-            return {
-                focusOffset: offset,
-                dollarIndex,
-                lastWord,
-                currentText: text,
-                node,
-                allSelected,
-            };
-        };
-        const isAllSelected = (selection) => selection.anchorOffset === 0 && selection.focusOffset === selection.focusNode?.nodeValue?.length;
-        const currentBrowser = getBrowser();
-        switch (currentBrowser) {
-            case 'Chrome':
-                const shadowRootSelection = this.host.shadowRoot?.getSelection();
-                const focusNode = shadowRootSelection?.focusNode;
-                const focusNodeValue = focusNode?.nodeValue || '';
-                const allSelected = shadowRootSelection && isAllSelected(shadowRootSelection);
-                return getSelectionTextData(focusNodeValue, shadowRootSelection?.focusOffset || -1, focusNode, allSelected);
-            case 'Firefox':
-                const selection = document.getSelection();
-                const anchorNodeValue = selection?.anchorNode?.nodeValue || '';
-                const allSelectedFirefox = selection && isAllSelected(selection);
-                return getSelectionTextData(anchorNodeValue, selection?.focusOffset || -1, selection?.anchorNode, allSelectedFirefox);
-            case 'Safari':
-                const windowSelection = window.getSelection();
-                const anchorNode = windowSelection?.getComposedRanges(this.host.shadowRoot)[0];
-                const currentText = anchorNode?.startContainer?.nodeValue || '';
-                const allSelectedSafari = windowSelection && isAllSelected(windowSelection);
-                return getSelectionTextData(currentText, anchorNode?.endOffset || -1, anchorNode?.startContainer, allSelectedSafari);
-            default:
-                console.warn('Browser not supported');
-                return null;
-        }
-    }
-    handleChange(event) {
-        let textContent = event.target.textContent || '';
-        textContent = sanitizeHtml(textContent);
-        const currentSelection = this.getCurrentSelectionForBrowser();
-        if (!currentSelection) {
-            this.updateEventTitle(textContent);
-            this.resetDropdown();
-            return;
-        }
-        const { focusOffset, dollarIndex, lastWord, currentText } = currentSelection;
-        if (dollarIndex === -1 || focusOffset < dollarIndex) {
-            this.updateEventTitle(textContent);
-            this.resetDropdown();
-            return;
-        }
-        if (lastWord.startsWith('$')) {
-            this.showTokens = true;
-            this.currentWord = {
-                $value: lastWord,
-                fullText: currentText,
-                index: dollarIndex,
-                focusOffset,
-            };
-            this.populateSuggestionsDropdown(lastWord);
-        }
-        else {
-            this.resetDropdown();
-        }
-        this.updateEventTitle(textContent);
-    }
-    handleInputKeyDown(event) {
-        const selection = this.getCurrentSelectionForBrowser();
-        if (selection?.allSelected && !isNonPrintableKey(event)) {
-            this.titleRef.innerHTML = '';
-        }
-        if (event.key === 'Enter') {
-            event.preventDefault();
-            const activeOption = this.host.shadowRoot?.getElementById(this.ariaActivedescendant);
-            if (activeOption) {
-                activeOption.click();
-                this.ariaActivedescendant = '';
-            }
-        }
-        else if (event.key === 'ArrowDown') {
-            event.preventDefault();
-            const activeOption = this.host.shadowRoot?.getElementById(this.ariaActivedescendant);
-            if (activeOption) {
-                const nextOption = activeOption.nextElementSibling;
-                if (nextOption) {
-                    this.ariaActivedescendant = nextOption.id;
-                }
-                else {
-                    this.ariaActivedescendant = this.filteredTokens[0].label;
-                }
-            }
-            else {
-                this.ariaActivedescendant = this.filteredTokens[0].label;
-            }
-        }
-        else if (event.key === 'ArrowUp') {
-            event.preventDefault();
-            const activeOption = this.host.shadowRoot?.getElementById(this.ariaActivedescendant);
-            if (activeOption) {
-                const prevOption = activeOption.previousElementSibling;
-                if (prevOption) {
-                    this.ariaActivedescendant = prevOption.id;
-                }
-                else {
-                    this.ariaActivedescendant = this.filteredTokens[this.filteredTokens.length - 1].label;
-                }
-            }
-            else {
-                this.ariaActivedescendant = this.filteredTokens[this.filteredTokens.length - 1].label;
-            }
-        }
-        else if (event.key === 'Escape') {
-            event.preventDefault();
-            this.resetDropdown();
-        }
-        else if (event.key === 'Backspace' || event.key === 'Delete') {
-            if (selection?.currentText.startsWith('${')) {
-                selection?.node?.parentNode && selection.node.parentNode.removeChild(selection.node);
-            }
-            if (this.titleRef.textContent === '' || selection?.currentText === '' || selection?.allSelected) {
-                this.titleRef.innerHTML = '';
-            }
-        }
-    }
-    selectOption(e, option) {
-        e.preventDefault();
-        const word = this.currentWord.fullText;
-        const dollarWord = this.currentWord.$value;
-        let currentNode = this.titleRef.firstChild;
-        let textNode = null;
-        while (currentNode) {
-            if (currentNode.nodeType === 3) {
-                const currentNodeText = currentNode.textContent?.replace(/[\u200B-\u200D\uFEFF]/g, '') || '';
-                const wordText = word.replace(/[\u200B-\u200D\uFEFF]/g, '');
-                if (currentNodeText.includes(wordText)) {
-                    textNode = currentNode;
-                    break;
-                }
-            }
-            currentNode = currentNode.nextSibling;
-        }
-        if (!textNode) {
-            return;
-        }
-        const text = textNode.textContent || '';
-        const index = text.indexOf(dollarWord);
-        const textBefore = text.substring(0, index);
-        const textAfter = text.substring(index + dollarWord.length);
-        const newTextNode = document.createTextNode(textBefore);
-        const newRange = document.createRange();
-        const tagSpan = document.createElement('span');
-        tagSpan.classList.add('highlighted-tag');
-        tagSpan.textContent = `${option.value}`;
-        const newTextNodeAfter = document.createTextNode(textAfter);
-        if (textAfter !== '') {
-            textNode.replaceWith(newTextNode, tagSpan, newTextNodeAfter);
-            newRange.setStart(newTextNodeAfter, 1);
-        }
-        else {
-            const afterNode = document.createTextNode('\u200B');
-            textNode.replaceWith(newTextNode, tagSpan, afterNode);
-            newRange.setStart(afterNode, 1);
-        }
-        this.resetDropdown();
-        this.titleRef.focus();
-        const sel = window.getSelection();
-        newRange.collapse(true);
-        sel?.removeAllRanges();
-        sel?.addRange(newRange);
-        this.updateEventTitle(this.titleRef.textContent || '');
-    }
-    populateSuggestionsDropdown(query = '') {
-        this.filteredTokens = this.availableTokens.filter(obj => {
-            return obj.label.startsWith(query.toString()) || obj.value.startsWith(query.toString());
-        });
-        if (this.filteredTokens.length > 0) {
-            this.ariaActivedescendant = this.filteredTokens[0].label;
-        }
-    }
-    updateEventTitle(text) {
-        const value = text.replace(/ +/g, ' ');
-        if (value === '') {
-            this.internals?.setValidity({ customError: true }, `Event title is required`, this.titleRef);
-            this.validationError = 'Event title is required';
-        }
-        else {
-            this.internals?.setValidity({ customError: false });
-            this.validationError = '';
-        }
-        this.internals?.setFormValue(value, this.name);
-        this.valueChanged.emit({ value: value, name: this.name });
-    }
-    resetDropdown() {
-        this.showTokens = false;
-        this.ariaActivedescendant = '';
-    }
-    getLabelHTML(token) {
-        return (h("div", { class: "token-label" }, h("span", { class: "token" }, token.token), h("span", { class: "description" }, token.description)));
-    }
-    render() {
-        return (h(Host, { key: 'ec414f2f4c738230078bed7b7c5477ba5fdbcb70' }, h("div", { key: '17f665e5f307c1b6510891e76daa765449958c3e', class: "nylas-event-title", part: "net" }, h("label", { key: 'e4beac83e857bab219ec4276238f7953645c4711', htmlFor: "title" }, "Event title", h("span", { key: '3033d6ef407f2a3df94dc1f80be2f5e3c378abd0', class: "required" }, "*"), h("span", { key: '29dba11e88726329513ef15078eba34f103914de', class: "label-icon" }, h("tooltip-component", { key: '29a373fc979f15eb3527b9e5a446bd7518ee4562' }, h("info-icon", { key: '12f9a0190185b96a2090cdb0ca7a43f6342cc016', slot: "tooltip-icon" }), h("span", { key: 'dd6e505591f9cded5bc70a812e448b44f1faa4e1', slot: "tooltip-content" }, "Enter a title for your event.")))), h("div", { key: '87807255004e909850b93d600b636d2d2e1d8ed1', class: {
-                title: true,
-                error: this.validationError !== '',
-            }, part: "net__title", ref: el => (this.titleRef = el), contentEditable: "true", onInput: e => this.handleChange(e), onKeyDown: event => this.handleInputKeyDown(event) }), this.showTokens && this.filteredTokens?.length > 0 && (h("div", { class: "token-options", part: "net__dropdown-content" }, h("ul", { tabindex: "-1", role: "listbox", "aria-label": this.name, "aria-activedescendant": this.ariaActivedescendant }, this.filteredTokens.map(option => (h("li", { tabindex: "0", key: option.label, id: option.label, class: { active: this.ariaActivedescendant === option.label }, onClick: e => this.selectOption(e, option), role: "option" }, this.getLabelHTML(option.labelHTML))))))), h("span", { key: '3ba87900ffbc4b69c5f9fac01a8f9f577dd034c5', class: "help-text" }, "Create a dynamic templated event title by typing $. Learn more"), this.validationError != '' && h("span", { class: "error-message" }, this.validationError))));
-    }
-    static get formAssociated() { return true; }
-    get host() { return getElement(this); }
-    static get watchers() { return {
-        "name": ["elementNameChangedHandler"],
-        "ariaActivedescendant": ["ariaActivedescendantChangedHandler"],
-        "selectedConfiguration": ["configChangedHandler"]
-    }; }
-};
-__decorate$5([
-    RegisterComponent({
-        name: 'nylas-event-title',
-        stateToProps: new Map([['schedulerConfig.selectedConfiguration', 'selectedConfiguration']]),
-        eventToProps: {},
-        fireRegisterEvent: true,
-    }),
-    __metadata$5("design:type", Function),
-    __metadata$5("design:paramtypes", []),
-    __metadata$5("design:returntype", void 0)
-], NylasEventTitle.prototype, "render", null);
-NylasEventTitle.style = NylasEventTitleStyle0;
-const nylasLimitFutureBookingsCss = ":host{--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}.nylas-limit-future-bookings{display:flex;justify-content:space-between;font-family:var(--nylas-font-family)}@media screen and (max-width: 768px){.nylas-limit-future-bookings{flex-direction:column;gap:0.5rem}}.nylas-limit-future-bookings label{display:flex;align-items:center;color:var(--nylas-base-800);font-size:16px;font-style:normal;font-weight:400;line-height:150%;}.nylas-limit-future-bookings label span.label-icon{margin-left:4px}.nylas-limit-future-bookings label span.label-icon tooltip-component{display:flex}select-dropdown::part(sd_dropdown-button){border:none}";
-const NylasLimitFutureBookingsStyle0 = nylasLimitFutureBookingsCss;
-var __decorate$4 = (undefined && undefined.__decorate) || function (decorators, target, key, desc) {
-    var c = arguments.length, r = c < 3 ? target : desc === null ? desc = Object.getOwnPropertyDescriptor(target, key) : desc, d;
-    if (typeof Reflect === "object" && typeof Reflect.decorate === "function")
-        r = Reflect.decorate(decorators, target, key, desc);
-    else
-        for (var i = decorators.length - 1; i >= 0; i--)
-            if (d = decorators[i])
-                r = (c < 3 ? d(r) : c > 3 ? d(target, key, r) : d(target, key)) || r;
-    return c > 3 && r && Object.defineProperty(target, key, r), r;
-};
-var __metadata$4 = (undefined && undefined.__metadata) || function (k, v) {
-    if (typeof Reflect === "object" && typeof Reflect.metadata === "function")
-        return Reflect.metadata(k, v);
-};
-const NylasLimitFutureBookings = class {
-    constructor(hostRef) {
-        registerInstance(this, hostRef);
-        this.valueChanged = createEvent(this, "valueChanged", 7);
-        if (hostRef.$hostElement$["s-ei"]) {
-            this.internals = hostRef.$hostElement$["s-ei"];
-        }
-        else {
-            this.internals = hostRef.$hostElement$.attachInternals();
-            hostRef.$hostElement$["s-ei"] = this.internals;
-        }
-        this.selectedConfiguration = undefined;
-        this.availableDaysInFuture = undefined;
-        this.name = 'limit-future-bookings';
-        this.selectedNumber = 1;
-        this.selectedPeriod = 'day';
-    }
-    elementNameChangedHandler(newValue) {
-        debug('nylas-limit-future-bookings', 'elementNameChangedHandler', newValue);
-        this.host.setAttribute('name', newValue);
-    }
-    selectedConfigurationChangedHandler(newVal) {
-        const daysInFuture = newVal?.scheduler?.available_days_in_future;
-        if (daysInFuture) {
-            this.updateNumberAndPeriodFromDays(daysInFuture);
-        }
-    }
-    availableDaysInFutureChanged(newValue) {
-        this.updateNumberAndPeriodFromDays(newValue);
-    }
-    connectedCallback() {
-        debug('nylas-limit-future-bookings', 'connectedCallback');
-    }
-    componentWillLoad() {
-        debug('nylas-limit-future-bookings', 'componentWillLoad');
-        this.host.setAttribute('name', this.name);
-    }
-    componentDidLoad() {
-        debug('nylas-limit-future-bookings', 'componentDidLoad');
-        this.availableDaysInFutureChanged(this.availableDaysInFuture ?? 1);
-        if (typeof this.internals.setFormValue !== 'function') {
-            return;
-        }
-        this.internals.setFormValue(this.availableDaysInFuture?.toString() ?? '1', this.name);
-    }
-    disconnectedCallback() {
-        debug('nylas-limit-future-bookings', 'disconnectedCallback');
-    }
-    timePeriodChangedHandler(event) {
-        const { number, period } = event.detail;
-        let availableDaysInFuture;
-        if (period === 'day') {
-            availableDaysInFuture = number;
-        }
-        else if (period === 'week') {
-            availableDaysInFuture = number * 7;
-        }
-        else {
-            availableDaysInFuture = number * 30;
-        }
-        this.valueChanged.emit({ value: availableDaysInFuture, name: 'availableDaysInFuture' });
-        if (typeof this.internals.setFormValue !== 'function') {
-            return;
-        }
-        this.internals.setFormValue(availableDaysInFuture.toString(), this.name);
-    }
-    updateNumberAndPeriodFromDays(days) {
-        let number, period;
-        if (days >= 30 && days % 30 === 0) {
-            number = days / 30;
-            period = 'month';
-        }
-        else if (days >= 7 && days % 7 === 0) {
-            number = days / 7;
-            period = 'week';
-        }
-        else {
-            number = days;
-            period = 'day';
-        }
-        this.selectedNumber = number;
-        this.selectedPeriod = period;
-    }
-    render() {
-        return (h(Host, { key: '9efaf822025f476c80f4c5124f226e45ef9047f9' }, h("div", { key: 'acb0ed9bb24d9e789c01127b2343194d47c37c5f', class: "nylas-limit-future-bookings", part: "nlfb" }, h("label", { key: 'b4bbe14a0870451be5c7754dbbd3adb029b1d24c' }, "Limit future bookings", h("span", { key: 'e1e671d334ec20347852549c4b4d63fa626a2186', class: "label-icon" }, h("tooltip-component", { key: '378c5a41fe7920cebd1f9de4ea16873e951584cf' }, h("info-icon", { key: 'dee6d8d027c746b19b4de42a7e57754a6dcf0a34', slot: "tooltip-icon" }), h("span", { key: 'f128781fb212013489d7db03e7b5fb1a02681b5a', slot: "tooltip-content" }, "Set a limit on how far in the future bookings can be made.")))), h("time-period-selector", { key: 'fb00fd64c7dec2beb976132a397bb067e72c0cc3', id: "limit-future-bookings", timePeriods: ['day', 'week', 'month'], exportparts: "tps__number-dropdown: nlfb__number-dropdown, tps__number-dropdown-button: nlfb__number-dropdown-button, tps__number-dropdown-content: nlfb__number-dropdown-content, tps__period-dropdown: nlfb__period-dropdown, tps__period-dropdown-button: nlfb__period-dropdown-button, tps__period-dropdown-content: nlfb__period-dropdown-content", defaultSelectedNumber: this.selectedNumber, defaultSelectedPeriod: this.selectedPeriod }))));
-    }
-    static get formAssociated() { return true; }
-    get host() { return getElement(this); }
-    static get watchers() { return {
-        "name": ["elementNameChangedHandler"],
-        "selectedConfiguration": ["selectedConfigurationChangedHandler"],
-        "availableDaysInFuture": ["availableDaysInFutureChanged"]
-    }; }
-};
-__decorate$4([
-    RegisterComponent({
-        name: 'nylas-limit-future-bookings',
-        stateToProps: new Map([['schedulerConfig.selectedConfiguration', 'selectedConfiguration']]),
-        eventToProps: {},
-        fireRegisterEvent: true,
-    }),
-    __metadata$4("design:type", Function),
-    __metadata$4("design:paramtypes", []),
-    __metadata$4("design:returntype", void 0)
-], NylasLimitFutureBookings.prototype, "render", null);
-NylasLimitFutureBookings.style = NylasLimitFutureBookingsStyle0;
-const nylasMinBookingNoticeCss = ":host{--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}.nylas-min-booking-notice{display:flex;justify-content:space-between;font-family:var(--nylas-font-family)}@media screen and (max-width: 768px){.nylas-min-booking-notice{flex-direction:column;gap:0.5rem}}.nylas-min-booking-notice label{display:flex;align-items:center;color:var(--nylas-base-800);font-size:16px;font-style:normal;font-weight:400;line-height:150%;}.nylas-min-booking-notice label span.label-icon{margin-left:4px}.nylas-min-booking-notice label span.label-icon tooltip-component{display:flex}select-dropdown::part(sd_dropdown-button){border:none}";
-const NylasMinBookingNoticeStyle0 = nylasMinBookingNoticeCss;
-var __decorate$3 = (undefined && undefined.__decorate) || function (decorators, target, key, desc) {
-    var c = arguments.length, r = c < 3 ? target : desc === null ? desc = Object.getOwnPropertyDescriptor(target, key) : desc, d;
-    if (typeof Reflect === "object" && typeof Reflect.decorate === "function")
-        r = Reflect.decorate(decorators, target, key, desc);
-    else
-        for (var i = decorators.length - 1; i >= 0; i--)
-            if (d = decorators[i])
-                r = (c < 3 ? d(r) : c > 3 ? d(target, key, r) : d(target, key)) || r;
-    return c > 3 && r && Object.defineProperty(target, key, r), r;
-};
-var __metadata$3 = (undefined && undefined.__metadata) || function (k, v) {
-    if (typeof Reflect === "object" && typeof Reflect.metadata === "function")
-        return Reflect.metadata(k, v);
-};
-const NylasMinBookingNotice = class {
-    constructor(hostRef) {
-        registerInstance(this, hostRef);
-        this.valueChanged = createEvent(this, "valueChanged", 7);
-        if (hostRef.$hostElement$["s-ei"]) {
-            this.internals = hostRef.$hostElement$["s-ei"];
-        }
-        else {
-            this.internals = hostRef.$hostElement$.attachInternals();
-            hostRef.$hostElement$["s-ei"] = this.internals;
-        }
-        this.selectedConfiguration = undefined;
-        this.minBookingNotice = undefined;
-        this.name = 'min-booking-notice';
-        this.selectedNumber = 1;
-        this.selectedPeriod = 'hour';
-    }
-    elementNameChangedHandler(newValue) {
-        debug('nylas-min-booking-notice', 'elementNameChangedHandler', newValue);
-        this.host.setAttribute('name', newValue);
-    }
-    selectedConfigurationChangedHandler(newVal) {
-        const minBookingNotice = newVal?.scheduler?.min_booking_notice;
-        if (minBookingNotice) {
-            this.updateNumberAndPeriodFromMinutes(minBookingNotice);
-        }
-    }
-    availableDaysInFutureChanged(newValue) {
-        this.updateNumberAndPeriodFromMinutes(newValue);
-    }
-    connectedCallback() {
-        debug('nylas-min-booking-notice', 'connectedCallback');
-    }
-    componentWillLoad() {
-        debug('nylas-min-booking-notice', 'componentWillLoad');
-        this.host.setAttribute('name', this.name);
-    }
-    componentDidLoad() {
-        debug('nylas-min-booking-notice', 'componentDidLoad');
-        this.availableDaysInFutureChanged(this.minBookingNotice ?? 1);
-        if (typeof this.internals.setFormValue !== 'function') {
-            return;
-        }
-        this.internals.setFormValue(this.minBookingNotice?.toString() ?? '1', this.name);
-    }
-    disconnectedCallback() {
-        debug('nylas-min-booking-notice', 'disconnectedCallback');
-    }
-    timePeriodChangedHandler(event) {
-        const { number, period } = event.detail;
-        let totalMinutes;
-        const minutesInHour = 60;
-        const minutesInDay = minutesInHour * 24;
-        const minutesInWeek = minutesInDay * 7;
-        const minutesInMonth = minutesInDay * 30;
-        if (period === 'minute') {
-            totalMinutes = number;
-        }
-        else if (period === 'hour') {
-            totalMinutes = number * minutesInHour;
-        }
-        else if (period === 'day') {
-            totalMinutes = number * minutesInDay;
-        }
-        else if (period === 'week') {
-            totalMinutes = number * minutesInWeek;
-        }
-        else if (period === 'month') {
-            totalMinutes = number * minutesInMonth;
-        }
-        else {
-            totalMinutes = 0;
-        }
-        this.valueChanged.emit({ value: totalMinutes, name: 'minBookingNotice' });
-        if (typeof this.internals.setFormValue !== 'function') {
-            return;
-        }
-        this.internals.setFormValue(totalMinutes.toString(), this.name);
-    }
-    updateNumberAndPeriodFromMinutes(minutes) {
-        const minutesInHour = 60;
-        const minutesInDay = minutesInHour * 24;
-        const minutesInWeek = minutesInDay * 7;
-        const minutesInMonth = minutesInDay * 30;
-        let number, period;
-        if (minutes >= minutesInMonth) {
-            number = Math.floor(minutes / minutesInMonth);
-            period = 'month';
-        }
-        else if (minutes >= minutesInWeek) {
-            number = Math.floor(minutes / minutesInWeek);
-            period = 'week';
-        }
-        else if (minutes >= minutesInDay) {
-            number = Math.floor(minutes / minutesInDay);
-            period = 'day';
-        }
-        else if (minutes >= minutesInHour) {
-            number = Math.floor(minutes / minutesInHour);
-            period = 'hour';
-        }
-        else {
-            number = minutes;
-            period = 'minute';
-        }
-        this.selectedNumber = number;
-        this.selectedPeriod = period;
-    }
-    render() {
-        return (h(Host, { key: 'b00e1ce3adc1082c819774df6888d86fd93b06b6' }, h("div", { key: '0cd17759b7e1d3790904fe868addfa02065a3115', class: "nylas-min-booking-notice", part: "nmbn" }, h("label", { key: 'c27bc50a60686fb925904c5f86c9f19a7ab8079c' }, "Minimum booking notice", h("span", { key: '67b1a1351adbe6265d549501609af036d993920b', class: "label-icon" }, h("tooltip-component", { key: '4e64d044707c9fe94aa84caa242a0e034c0a89f7' }, h("info-icon", { key: 'bf64b04e4d308449249dae8a19a6c4043f26c1dd', slot: "tooltip-icon" }), h("span", { key: '434e31ddf539c4fcb287b198d780b6593808a607', slot: "tooltip-content" }, "The minimum amount of time in the future for planning the event.")))), h("time-period-selector", { key: 'efd40f4731319bd7da2aed6995279c8068e505ac', id: "min-booking-notice", exportparts: "tps__number-dropdown: nmbn__number-dropdown, tps__number-dropdown-button: nmbn__number-dropdown-button, tps__number-dropdown-content: nmbn__number-dropdown-content, tps__period-dropdown: nmbn__period-dropdown, tps__period-dropdown-button: nmbn__period-dropdown-button, tps__period-dropdown-content: nmbn__period-dropdown-content", timePeriods: ['minute', 'hour', 'day', 'week'], defaultSelectedNumber: this.selectedNumber, defaultSelectedPeriod: this.selectedPeriod }))));
-    }
-    static get formAssociated() { return true; }
-    get host() { return getElement(this); }
-    static get watchers() { return {
-        "name": ["elementNameChangedHandler"],
-        "selectedConfiguration": ["selectedConfigurationChangedHandler"],
-        "availableDaysInFuture": ["availableDaysInFutureChanged"]
-    }; }
-};
-__decorate$3([
-    RegisterComponent({
-        name: 'nylas-min-booking-notice',
-        stateToProps: new Map([['schedulerConfig.selectedConfiguration', 'selectedConfiguration']]),
-        eventToProps: {},
-        fireRegisterEvent: true,
-    }),
-    __metadata$3("design:type", Function),
-    __metadata$3("design:paramtypes", []),
-    __metadata$3("design:returntype", void 0)
-], NylasMinBookingNotice.prototype, "render", null);
-NylasMinBookingNotice.style = NylasMinBookingNoticeStyle0;
-const nylasMinCancellationNoticeCss = ":host{--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}.nylas-min-cancellation-notice{display:flex;justify-content:space-between;font-family:var(--nylas-font-family)}@media screen and (max-width: 768px){.nylas-min-cancellation-notice{flex-direction:column;gap:0.5rem}}.nylas-min-cancellation-notice label{display:flex;align-items:center;color:var(--nylas-base-800);font-size:16px;font-style:normal;font-weight:400;line-height:150%;}.nylas-min-cancellation-notice label span.label-icon{margin-left:4px}.nylas-min-cancellation-notice label span.label-icon tooltip-component{display:flex}select-dropdown::part(sd_dropdown-button){border:none}";
-const NylasMinCancellationNoticeStyle0 = nylasMinCancellationNoticeCss;
-var __decorate$2 = (undefined && undefined.__decorate) || function (decorators, target, key, desc) {
-    var c = arguments.length, r = c < 3 ? target : desc === null ? desc = Object.getOwnPropertyDescriptor(target, key) : desc, d;
-    if (typeof Reflect === "object" && typeof Reflect.decorate === "function")
-        r = Reflect.decorate(decorators, target, key, desc);
-    else
-        for (var i = decorators.length - 1; i >= 0; i--)
-            if (d = decorators[i])
-                r = (c < 3 ? d(r) : c > 3 ? d(target, key, r) : d(target, key)) || r;
-    return c > 3 && r && Object.defineProperty(target, key, r), r;
-};
-var __metadata$2 = (undefined && undefined.__metadata) || function (k, v) {
-    if (typeof Reflect === "object" && typeof Reflect.metadata === "function")
-        return Reflect.metadata(k, v);
-};
-const NylasMinCancellationNotice = class {
-    constructor(hostRef) {
-        registerInstance(this, hostRef);
-        this.valueChanged = createEvent(this, "valueChanged", 7);
-        if (hostRef.$hostElement$["s-ei"]) {
-            this.internals = hostRef.$hostElement$["s-ei"];
-        }
-        else {
-            this.internals = hostRef.$hostElement$.attachInternals();
-            hostRef.$hostElement$["s-ei"] = this.internals;
-        }
-        this.selectedConfiguration = undefined;
-        this.minCancellationNotice = undefined;
-        this.name = 'min-cancellation-notice';
-        this.selectedNumber = 1;
-        this.selectedPeriod = 'day';
-    }
-    elementNameChangedHandler(newValue) {
-        debug('nylas-min-cancellation-notice', 'elementNameChangedHandler', newValue);
-        this.host.setAttribute('name', newValue);
-    }
-    selectedConfigurationChangedHandler(newVal) {
-        const minCancellationNotice = newVal?.scheduler?.min_cancellation_notice;
-        if (minCancellationNotice) {
-            this.updateNumberAndPeriodFromMinutes(minCancellationNotice);
-        }
-    }
-    availableDaysInFutureChanged(newValue) {
-        this.updateNumberAndPeriodFromMinutes(newValue);
-    }
-    connectedCallback() {
-        debug('nylas-min-cancellation-notice', 'connectedCallback');
-    }
-    componentWillLoad() {
-        debug('nylas-min-cancellation-notice', 'componentWillLoad');
-        this.host.setAttribute('name', this.name);
-    }
-    componentDidLoad() {
-        debug('nylas-min-cancellation-notice', 'componentDidLoad');
-        this.availableDaysInFutureChanged(this.minCancellationNotice ?? 1);
-        if (typeof this.internals.setFormValue !== 'function') {
-            return;
-        }
-        this.internals.setFormValue(this.minCancellationNotice?.toString() ?? '1', this.name);
-    }
-    disconnectedCallback() {
-        debug('nylas-min-cancellation-notice', 'disconnectedCallback');
-    }
-    timePeriodChangedHandler(event) {
-        const { number, period } = event.detail;
-        let totalMinutes;
-        const minutesInHour = 60;
-        const minutesInDay = minutesInHour * 24;
-        const minutesInWeek = minutesInDay * 7;
-        const minutesInMonth = minutesInDay * 30;
-        if (period === 'minute') {
-            totalMinutes = number;
-        }
-        else if (period === 'hour') {
-            totalMinutes = number * minutesInHour;
-        }
-        else if (period === 'day') {
-            totalMinutes = number * minutesInDay;
-        }
-        else if (period === 'week') {
-            totalMinutes = number * minutesInWeek;
-        }
-        else if (period === 'month') {
-            totalMinutes = number * minutesInMonth;
-        }
-        else {
-            totalMinutes = 0;
-        }
-        this.valueChanged.emit({ value: totalMinutes, name: 'minCancellationNotice' });
-        if (typeof this.internals.setFormValue !== 'function') {
-            return;
-        }
-        this.internals.setFormValue(totalMinutes.toString(), this.name);
-    }
-    updateNumberAndPeriodFromMinutes(minutes) {
-        const minutesInHour = 60;
-        const minutesInDay = minutesInHour * 24;
-        const minutesInWeek = minutesInDay * 7;
-        const minutesInMonth = minutesInDay * 30;
-        let number, period;
-        if (minutes >= minutesInMonth) {
-            number = Math.floor(minutes / minutesInMonth);
-            period = 'month';
-        }
-        else if (minutes >= minutesInWeek) {
-            number = Math.floor(minutes / minutesInWeek);
-            period = 'week';
-        }
-        else if (minutes >= minutesInDay) {
-            number = Math.floor(minutes / minutesInDay);
-            period = 'day';
-        }
-        else if (minutes >= minutesInHour) {
-            number = Math.floor(minutes / minutesInHour);
-            period = 'hour';
-        }
-        else {
-            number = minutes;
-            period = 'minute';
-        }
-        this.selectedNumber = number;
-        this.selectedPeriod = period;
-    }
-    render() {
-        return (h(Host, { key: '6c14649f767cebe544dd5fc3039e4bace051f759' }, h("div", { key: 'e6b0965bb6bc49b6e7ede7a4c2b2c2056a212c96', class: "nylas-min-cancellation-notice", part: "nmcn" }, h("label", { key: '1998d897f882c0783e2012ca85b651c43517ba64' }, "Minimum cancellation notice", h("span", { key: 'eccae26b18bd269648d1bce2affae5d3e469ea02', class: "label-icon" }, h("tooltip-component", { key: '50caa33903115b0da9da25ed3a18cbbf8a4df353' }, h("info-icon", { key: '8b466b236668439cbca8e250d60524b69ce4f7f3', slot: "tooltip-icon" }), h("span", { key: 'c4c9d73798c85d317aa1f89a2b0f1c66c9ca41d2', slot: "tooltip-content" }, "Set the minimum amount of time required to cancel an event.")))), h("time-period-selector", { key: 'bb4c0a9ecfb9bc9ebf88b229c871abd4b8427385', id: "min-cancellation-notice", exportparts: "tps__number-dropdown: nmcn__number-dropdown, tps__number-dropdown-button: nmcn__number-dropdown-button, tps__number-dropdown-content: nmcn__number-dropdown-content, tps__period-dropdown: nmcn__period-dropdown, tps__period-dropdown-button: nmcn__period-dropdown-button, tps__period-dropdown-content: nmcn__period-dropdown-content", timePeriods: ['minute', 'hour', 'day', 'week'], defaultSelectedNumber: this.selectedNumber, defaultSelectedPeriod: this.selectedPeriod }))));
-    }
-    static get formAssociated() { return true; }
-    get host() { return getElement(this); }
-    static get watchers() { return {
-        "name": ["elementNameChangedHandler"],
-        "selectedConfiguration": ["selectedConfigurationChangedHandler"],
-        "availableDaysInFuture": ["availableDaysInFutureChanged"]
-    }; }
-};
-__decorate$2([
-    RegisterComponent({
-        name: 'nylas-min-cancellation-notice',
-        stateToProps: new Map([['schedulerConfig.selectedConfiguration', 'selectedConfiguration']]),
-        eventToProps: {},
-        fireRegisterEvent: true,
-    }),
-    __metadata$2("design:type", Function),
-    __metadata$2("design:paramtypes", []),
-    __metadata$2("design:returntype", void 0)
-], NylasMinCancellationNotice.prototype, "render", null);
-NylasMinCancellationNotice.style = NylasMinCancellationNoticeStyle0;
-const nylasParticipantsCustomAvailabilityCss = ":host{display:block;--nylas-primary:#2563eb;--nylas-error:#cc4841;--nylas-error-pressed:#992222;--nylas-wraning:#f06c00;--nylas-success:#16a392;--nylas-info:#2b8fc2;--nylas-base-0:#ffffff;--nylas-base-25:#fcfcfd;--nylas-base-50:#f8f9fc;--nylas-base-100:#eaecf5;--nylas-base-200:#d5d9eb;--nylas-base-300:#b3b8d8;--nylas-base-400:#717bbc;--nylas-base-500:#4e5ba6;--nylas-base-600:#3e4784;--nylas-base-700:#263f72;--nylas-base-800:#293056;--nylas-base-900:#101323;--nylas-base-950:#0e101b;--nylas-border-radius:0.25rem;--nylas-border-radius-2x:0.5rem;--nylas-border-radius-3x:0.75rem;--nylas-font-family:\"Inter\", sans-serif;width:inherit}.nylas-participants-custom-availability{width:inherit;display:flex;flex-direction:column;margin:1rem;border-radius:var(--nylas-border-radius-2x);border:1px solid var(--nylas-base-200)}.nylas-participants-custom-availability .header{padding:1rem}.nylas-participants-custom-availability .header h3{margin:0;font-size:16px;font-weight:600;line-height:20px;color:var(--nylas-base-900);text-align:left}.nylas-participants-custom-availability .header p{margin:0.25rem 0 0 0;font-size:0.875rem;font-weight:400;line-height:20px;color:var(--nylas-base-600);text-align:left}.nylas-participants-custom-availability .content .participant-container{padding-top:8px;border-top:1px solid var(--nylas-base-200)}.nylas-participants-custom-availability .content .participant-container .participant-title{display:flex;justify-content:space-between;align-items:center;padding:4px 16px 12px}.nylas-participants-custom-availability .content .participant-container .participant-title p{margin:0}.nylas-participants-custom-availability .content .participant-container .participant-title .participant-toggle{display:flex;gap:24px;align-items:center}.nylas-participants-custom-availability .content .participant-container .participant-title .participant-toggle .chevron{display:flex;align-self:center;cursor:pointer}.nylas-participants-custom-availability .content .participant-container .participant-title .participant-toggle .chevron:hover,.nylas-participants-custom-availability .content .participant-container .participant-title .participant-toggle .chevron:active{color:var(--nylas-primary)}.nylas-participants-custom-availability .content .participant-container .participant-title .participant-toggle .chevron.open{transform:rotate(90deg)}.nylas-participants-custom-availability .content .participant-container .participant-title .participant-toggle .chevron.closed{transform:rotate(270deg)}.nylas-participants-custom-availability .content .participant-container .participant-title .participant-toggle .chevron.disabled{cursor:not-allowed;color:var(--nylas-base-300)}.nylas-participants-custom-availability .content .participant-container .participant-title .participant-toggle .chevron.disabled:hover{color:var(--nylas-base-300)}.nylas-participants-custom-availability .content .participant-container nylas-availability-picker::part(nap){margin:0;border:none}";
-const NylasParticipantsCustomAvailabilityStyle0 = nylasParticipantsCustomAvailabilityCss;
-var __decorate$1 = (undefined && undefined.__decorate) || function (decorators, target, key, desc) {
-    var c = arguments.length, r = c < 3 ? target : desc === null ? desc = Object.getOwnPropertyDescriptor(target, key) : desc, d;
-    if (typeof Reflect === "object" && typeof Reflect.decorate === "function")
-        r = Reflect.decorate(decorators, target, key, desc);
-    else
-        for (var i = decorators.length - 1; i >= 0; i--)
-            if (d = decorators[i])
-                r = (c < 3 ? d(r) : c > 3 ? d(target, key, r) : d(target, key)) || r;
-    return c > 3 && r && Object.defineProperty(target, key, r), r;
-};
-var __metadata$1 = (undefined && undefined.__metadata) || function (k, v) {
-    if (typeof Reflect === "object" && typeof Reflect.metadata === "function")
-        return Reflect.metadata(k, v);
-};
-const NylasParticipantsCustomAvailability = class {
-    constructor(hostRef) {
-        registerInstance(this, hostRef);
-        this.valueChanged = createEvent(this, "valueChanged", 7);
-        if (hostRef.$hostElement$["s-ei"]) {
-            this.internals = hostRef.$hostElement$["s-ei"];
-        }
-        else {
-            this.internals = hostRef.$hostElement$.attachInternals();
-            hostRef.$hostElement$["s-ei"] = this.internals;
-        }
-        this.name = 'participant-custom-availability';
-        this.participants = undefined;
-        this.selectedParticipants = this.setParticipants(this.participants);
-    }
-    elementNameChangedHandler(newValue) {
-        debug('nylas-participants-custom-availability', 'elementNameChangedHandler', newValue);
-        this.host.setAttribute('name', newValue);
-    }
-    participantsChangedHandler(newValue) {
-        debug('nylas-participants-custom-availability', 'participantsChangedHandler', newValue);
-        this.selectedParticipants = this.setParticipants(newValue);
-    }
-    connectedCallback() {
-        debug('nylas-participants-custom-availability', 'connectedCallback');
-    }
-    disconnectedCallback() {
-        debug('nylas-participants-custom-availability', 'disconnectedCallback');
-    }
-    componentWillLoad() {
-        debug('nylas-participants-custom-availability', 'componentWillLoad');
-    }
-    componentDidLoad() {
-        debug('nylas-participants-custom-availability', 'componentDidLoad');
-    }
-    nylasFormSwitchToggledHandler(event) {
-        debug('nylas-participants-custom-availability', 'nylasFormSwitchToggledHandler', event.detail);
-        this.selectedParticipants[event.detail.name]['isOpen'] = event.detail.checked;
-        this.selectedParticipants[event.detail.name]['setCustom'] = event.detail.checked;
-        this.selectedParticipants = { ...this.selectedParticipants };
-    }
-    handleValueChanged(event) {
-        debug('[nylas-editor-tabs]', 'handleValueChanged', event);
-        const { name, value } = event.detail;
-        if (!name.startsWith('participant-')) {
-            return;
-        }
-        if (!this.participantFormRef.checkValidity()) {
-            this.internals.setValidity({ customError: true }, 'Please fix the overlapping time ranges.');
-            return;
-        }
-        else {
-            this.internals.setValidity({});
-        }
-        const jsonValue = JSON.parse(value);
-        const key = name.split('-')[2];
-        if (!this.selectedParticipants[key])
-            return;
-        this.selectedParticipants[key]['openHours'] = jsonValue.openHours;
-        this.selectedParticipants = { ...this.selectedParticipants };
-        const participantOpenHours = {};
-        this.participants.forEach(participant => {
-            participantOpenHours[participant.email] = this.selectedParticipants[participant.email].openHours;
-        });
-        this.internals.setFormValue(JSON.stringify(participantOpenHours), this.name);
-        this.valueChanged.emit({ value: JSON.stringify(participantOpenHours), name: this.name });
-    }
-    setParticipants(participants) {
-        const selectedParticipants = {};
-        participants.forEach(participant => {
-            const isOpen = participant.is_organizer ? true : false;
-            selectedParticipants[participant.email] = {
-                isOpen: isOpen,
-                setCustom: !!participant.availability?.open_hours ? true : false,
-                openHours: participant.availability?.open_hours || [],
-                name: participant.name || participant.email,
-                availability: participant.availability,
-            };
-        });
-        return selectedParticipants;
-    }
-    render() {
-        return (h(Host, { key: '051df44e8bf6bab14cfbccb0a3c5f920993cbae9' }, h("div", { key: '128d044cb2bbee76d695d6f5d4bc38a211d06360', class: "nylas-participants-custom-availability", part: "npca" }, h("div", { key: 'ed326c442f9663b0613e5cf62a31aabf5fa1034d', class: "header", part: "npca__header" }, h("h3", { key: '10994aace54d17110ab2e70fc82a5c11231b5a23' }, "Set Custom Availability for Participants"), h("p", { key: '6df3bc37aec02f5a4468f6c6515c6de2c696e817' }, "Set custom availability for scheduling meetings, or default to general availability.")), h("div", { key: 'e1e67385b15430e8a7eb6d8411f9b87742621969', class: "content", part: "npca__content" }, h("form", { key: '589df249c050b132dc8da5b3ef7e58fa829ae300', ref: el => (this.participantFormRef = el) }, Object.keys(this.selectedParticipants).map((key, index) => {
-            const participant = this.selectedParticipants[key];
-            if (!participant || !participant.name || !participant.availability)
-                return;
-            return (h("div", { class: "participant-container", part: "npca__participant-container", key: `participant-conatiner-${index}` }, h("div", { class: "participant-title", part: "npca__participant-title" }, h("p", null, "Set ", participant.name, "'s custom availability"), h("div", { class: "participant-toggle", part: "npca__participant-toggle--container" }, h("toggle-switch", { exportparts: "ts_label: npca__toggle-label, ts_input: npca_toggle-input, ts_slider: npca_toggle-slider", name: key, checked: !!participant.openHours && participant.openHours.length > 0 }), h("span", { class: `chevron ${participant.isOpen ? 'open' : 'closed'} ${participant.setCustom ? '' : 'disabled'}`, onClick: () => {
-                    if (!participant.setCustom)
-                        return;
-                    this.selectedParticipants[key].isOpen = !participant.isOpen;
-                    this.selectedParticipants = { ...this.selectedParticipants };
-                } }, h("chevron-icon", { width: "24", height: "24" })))), participant.isOpen && (h("nylas-availability-picker", { key: index, name: `participant-${index}-${key}`, openHours: participant.openHours, defaultTimezone: participant.openHours?.[0]?.timezone, hideHeader: true }))));
-        }))))));
-    }
-    static get formAssociated() { return true; }
-    get host() { return getElement(this); }
-    static get watchers() { return {
-        "name": ["elementNameChangedHandler"],
-        "participants": ["participantsChangedHandler"]
-    }; }
-};
-__decorate$1([
-    RegisterComponent({
-        name: 'nylas-participants-custom-availability',
-        eventToProps: {},
-        fireRegisterEvent: true,
-    }),
-    __metadata$1("design:type", Function),
-    __metadata$1("design:paramtypes", []),
-    __metadata$1("design:returntype", void 0)
-], NylasParticipantsCustomAvailability.prototype, "render", null);
-NylasParticipantsCustomAvailability.style = NylasParticipantsCustomAvailabilityStyle0;
-const nylasTimeslotIntervalCss = ":host{display:block;--nylas-primary:#2563eb;--nylas-error:#cc4841;--nylas-error-pressed:#992222;--nylas-wraning:#f06c00;--nylas-success:#16a392;--nylas-info:#2b8fc2;--nylas-base-0:#ffffff;--nylas-base-25:#fcfcfd;--nylas-base-50:#f8f9fc;--nylas-base-100:#eaecf5;--nylas-base-200:#d5d9eb;--nylas-base-300:#b3b8d8;--nylas-base-400:#717bbc;--nylas-base-500:#4e5ba6;--nylas-base-600:#3e4784;--nylas-base-700:#263f72;--nylas-base-800:#293056;--nylas-base-900:#101323;--nylas-base-950:#0e101b;--nylas-border-radius:0.25rem;--nylas-border-radius-2x:0.5rem;--nylas-border-radius-3x:0.75rem;--nylas-font-family:\"Inter\", sans-serif;width:inherit}.nylas-timeslot-interval{width:inherit;display:flex;flex-direction:column;margin:1rem;border-radius:var(--nylas-border-radius-2x);border:1px solid var(--nylas-base-200)}.nylas-timeslot-interval .header{padding:1rem;border-bottom:1px solid var(--nylas-base-200)}.nylas-timeslot-interval .header h3{margin:0;font-size:1rem;font-weight:600;line-height:20px;color:var(--nylas-base-900);text-align:left}.nylas-timeslot-interval .header p{margin:0.25rem 0 0 0;font-size:0.875rem;font-weight:400;line-height:20px;color:var(--nylas-base-600);text-align:left}.nylas-timeslot-interval .nylas-timeslot-interval__dropdown{padding:1rem;display:flex;flex-direction:column;gap:4px}.nylas-timeslot-interval .nylas-timeslot-interval__dropdown span.label{display:flex;align-items:center;gap:4px;color:var(--nylas-base-800)}.nylas-timeslot-interval .nylas-timeslot-interval__dropdown span.label tooltip-component{display:flex}.nylas-timeslot-interval .nylas-timeslot-interval__dropdown select-dropdown{margin-bottom:1.5rem}.nylas-timeslot-interval .nylas-timeslot-interval__dropdown select-dropdown::part(sd_dropdown){width:100%}.nylas-timeslot-interval .nylas-timeslot-interval__dropdown select-dropdown::part(sd_dropdown-content){width:100%;max-width:unset}.nylas-timeslot-interval .nylas-timeslot-interval__dropdown select-dropdown::part(sd_dropdown-button){width:100%;display:flex;justify-content:space-between;align-items:center;border:1px solid var(--nylas-base-200);border-radius:var(--nylas-border-radius-2x);padding:1rem}.nylas-timeslot-interval .nylas-timeslot-interval__dropdown select-dropdown::part(sd_dropdown-button-selected-label){max-width:calc(100% - 2rem);font-family:var(--nylas-font-family);font-size:16px;line-height:24px}";
-const NylasTimeslotIntervalStyle0 = nylasTimeslotIntervalCss;
-var __decorate = (undefined && undefined.__decorate) || function (decorators, target, key, desc) {
-    var c = arguments.length, r = c < 3 ? target : desc === null ? desc = Object.getOwnPropertyDescriptor(target, key) : desc, d;
-    if (typeof Reflect === "object" && typeof Reflect.decorate === "function")
-        r = Reflect.decorate(decorators, target, key, desc);
-    else
-        for (var i = decorators.length - 1; i >= 0; i--)
-            if (d = decorators[i])
-                r = (c < 3 ? d(r) : c > 3 ? d(target, key, r) : d(target, key)) || r;
-    return c > 3 && r && Object.defineProperty(target, key, r), r;
-};
-var __metadata = (undefined && undefined.__metadata) || function (k, v) {
-    if (typeof Reflect === "object" && typeof Reflect.metadata === "function")
-        return Reflect.metadata(k, v);
-};
-const defaultRoundToMinustes = 15;
-const NylasTimeslotInterval = class {
-    constructor(hostRef) {
-        registerInstance(this, hostRef);
-        this.valueChanged = createEvent(this, "valueChanged", 7);
-        if (hostRef.$hostElement$["s-ei"]) {
-            this.internals = hostRef.$hostElement$["s-ei"];
-        }
-        else {
-            this.internals = hostRef.$hostElement$.attachInternals();
-            hostRef.$hostElement$["s-ei"] = this.internals;
-        }
-        this.selectedConfiguration = undefined;
-        this.name = 'timeslot-picker';
-        this.eventDurationMinutes = this.selectedConfiguration?.availability?.duration_minutes ?? 5;
-        this.defaultIntervalMinutes = this.selectedConfiguration?.availability?.interval_minutes ?? this.eventDurationMinutes;
-        this.defaultRoundTo = this.selectedConfiguration?.availability?.round_to ?? undefined;
-        this.selectedInterval = this.defaultIntervalMinutes;
-        this.selectedRoundTo = this.defaultRoundTo && this.defaultRoundTo === this.defaultIntervalMinutes ? true : false;
-    }
-    elementNameChangedHandler(newValue) {
-        debug('nylas-timeslot-interval', 'elementNameChangedHandler', newValue);
-        this.host.setAttribute('name', newValue);
-    }
-    selectedConfigurationChangedHandler(newValue) {
-        debug('nylas-timeslot-interval', 'selectedConfigurationChangedHandler', newValue);
-        this.defaultIntervalMinutes = newValue.availability?.interval_minutes ?? this.eventDurationMinutes;
-        this.defaultRoundTo = newValue.availability?.round_to ?? undefined;
-        this.selectedInterval = this.defaultIntervalMinutes;
-        this.selectedRoundTo = this.defaultRoundTo && this.defaultRoundTo === this.defaultIntervalMinutes ? true : false;
-    }
-    connectedCallback() {
-        debug('nylas-timeslot-interval', 'connectedCallback');
-    }
-    disconnectedCallback() {
-        debug('nylas-timeslot-interval', 'disconnectedCallback');
-    }
-    componentWillLoad() {
-        debug('nylas-timeslot-interval', 'componentWillLoad');
-        this.host.setAttribute('name', this.name);
-    }
-    componentDidLoad() {
-        debug('nylas-timeslot-interval', 'componentDidLoad');
-    }
-    componentWillUpdate() {
-        debug('nylas-timeslot-interval', 'componentWillUpdate');
-    }
-    componentDidUpdate() {
-        debug('nylas-timeslot-interval', 'componentDidUpdate');
-    }
-    componentWillRender() {
-        debug('nylas-timeslot-interval', 'componentWillRender');
-    }
-    componentDidRender() {
-        debug('nylas-timeslot-interval', 'componentDidRender');
-    }
-    nylasFormDropdownChangedHandler(event) {
-        debug('nylas-timeslot-interval', 'nylasFormDropdownChangedHandler', event.detail);
-        const value = event.detail.value;
-        if (value === 'duration') {
-            this.selectedInterval = this.eventDurationMinutes;
-        }
-        else {
-            this.selectedInterval = parseInt(event.detail.value);
-        }
-        console.log('nylasFormDropdownChanged selectedRoundTo', this.selectedRoundTo);
-        this.valueChanged.emit({
-            value: JSON.stringify({
-                interval: this.selectedInterval,
-                roundTo: this.selectedRoundTo ? this.selectedInterval : defaultRoundToMinustes,
-            }),
-            name: this.name,
-        });
-        if (typeof this.internals.setFormValue === 'function') {
-            this.internals.setFormValue(JSON.stringify({ interval: this.selectedInterval, roundTo: this.selectedRoundTo ? this.selectedInterval : defaultRoundToMinustes }), this.name);
-        }
-    }
-    radioSelectionChangedHandler(event) {
-        debug('nylas-timeslot-interval', 'radioSelectionChangedHandler', event.detail);
-        const value = event.detail.value;
-        if (value === 'no-rounding') {
-            this.selectedRoundTo = false;
-        }
-        else {
-            this.selectedRoundTo = true;
-        }
-        console.log('selectedRoundTo', this.selectedRoundTo);
-        this.valueChanged.emit({
-            value: JSON.stringify({
-                interval: this.selectedInterval,
-                roundTo: this.selectedRoundTo ? this.selectedInterval : defaultRoundToMinustes,
-            }),
-            name: this.name,
-        });
-        if (typeof this.internals.setFormValue === 'function') {
-            this.internals.setFormValue(JSON.stringify({ interval: this.selectedInterval, roundTo: this.selectedRoundTo ? this.selectedInterval : defaultRoundToMinustes }), this.name);
-        }
-    }
-    render() {
-        const intervalPreferenceOptions = [
-            { value: 'duration', label: 'Length of the booking' },
-            { value: '5', label: '5 mins' },
-            { value: '10', label: '10 mins' },
-            { value: '15', label: '15 mins' },
-            { value: '20', label: '20 mins' },
-            { value: '30', label: '30 mins' },
-            { value: '45', label: '45 mins' },
-            { value: '60', label: '60 mins' },
-        ];
-        return (h(Host, { key: 'ebad4dc8f82dc565f4608c262d54f06495a69144' }, h("div", { key: '46641f5cd23afc527d14c57fa62fe2627d1a92f5', class: "nylas-timeslot-interval", part: "nti" }, h("div", { key: '729c8356b955ba357bd00f3cdf28c51bb42b741d', class: "header", part: "nti__header" }, h("h3", { key: '348543e170e107ea65c74a6154739627e7c4a271' }, "Time-slot interval preferences"), h("p", { key: '1cf34b79990edef1950d6c970932e5e0805e6d0a' }, "Choose your interval preference for time-slots.")), h("div", { key: '965fe8f8e235f9696bc237bc7774ca6fdea2cd42', class: "nylas-timeslot-interval__dropdown" }, h("span", { key: '6346e2f31c9322cc3264885f362ce2b29c4a4c2e', class: "label", part: "nti__input-label" }, "Select interval preference", h("tooltip-component", { key: '27901960cae97d4809153aac5d427c8c2ff7bf1e' }, h("info-icon", { key: '94c81d2c169da3714d2a1955da0fbe542b688fb6', slot: "tooltip-icon" }), h("span", { key: '6e8660e7696c16d81214d97e5e2087579f9fa1bd', slot: "tooltip-content" }, "Set the interval preference for the time-slots."))), h("select-dropdown", { key: '49b886894bb4d405ed13578809609511830389f1', name: "booking-calendar", options: intervalPreferenceOptions, withSearch: false, exportparts: "sd_dropdown: nti__dropdown, sd_dropdown-button: nti__dropdown-button, sd_dropdown-content: nti__dropdown-content", defaultSelectedOption: this.defaultIntervalMinutes == this.eventDurationMinutes
-                ? intervalPreferenceOptions[0]
-                : intervalPreferenceOptions.find(op => op.value == this.defaultIntervalMinutes.toString()) ?? intervalPreferenceOptions[0] }), h("span", { key: '40079758106c1e7075b247f81a3bc30e11eb1138', class: "label", part: "nti__input-label" }, "Select the type of time-slot rounding", h("tooltip-component", { key: 'c1a1b86a732439b5474be36a1eb67d0a1fabe52c' }, h("info-icon", { key: '9e185781f8def48475c5f65cff916e5be6423b72', slot: "tooltip-icon" }), h("span", { key: 'df108083daab268e8980194ebff8485c945aab1c', slot: "tooltip-content" }, "Select if you want to round the time slots to the nearest interval."))), h("radio-button-group", { key: 'eb4c58b028ac0e2dd0468c30c1839558ae57178a', name: "interval-preference", defaultSelectedValue: this.defaultRoundTo && this.defaultRoundTo === this.defaultIntervalMinutes ? 'rounding' : 'no-rounding', options: [
-                { value: 'no-rounding', label: 'Default', description: 'Time-slots will be rounded to the nearest quarter-hour.' },
-                {
-                    value: 'rounding',
-                    label: 'Interval rounding',
-                    description: 'Time-slots will begin at times rounded to the interval value.',
-                },
-            ] })))));
-    }
-    static get formAssociated() { return true; }
-    get host() { return getElement(this); }
-    static get watchers() { return {
-        "name": ["elementNameChangedHandler"],
-        "selectedConfiguration": ["selectedConfigurationChangedHandler"]
-    }; }
-};
-__decorate([
-    RegisterComponent({
-        name: 'nylas-timeslot-interval',
-        stateToProps: new Map([['schedulerConfig.selectedConfiguration', 'selectedConfiguration']]),
-        fireRegisterEvent: true,
-    }),
-    __metadata("design:type", Function),
-    __metadata("design:paramtypes", []),
-    __metadata("design:returntype", void 0)
-], NylasTimeslotInterval.prototype, "render", null);
-NylasTimeslotInterval.style = NylasTimeslotIntervalStyle0;
-const iconCss = ".sc-people-icon-h{display:flex}";
-const PeopleIconStyle0 = iconCss;
-const PeopleIcon = class {
-    constructor(hostRef) {
-        registerInstance(this, hostRef);
-        this.width = '20';
-        this.height = '20';
-    }
-    render() {
-        return (h("svg", { key: '4a54f616162baf613895348e27cafd2088f5fd16', xmlns: "http://www.w3.org/2000/svg", width: this.width, height: this.height, fill: "none", viewBox: "0 0 20 20" }, h("path", { key: '80e1ca7240235b635a08369ba836e727825b7be4', fill: "currentColor", d: "M11 10a2 2 0 0 1 2 2v1.5c0 2.054-2.088 3.5-5.5 3.5S2 15.554 2 13.5V12a2 2 0 0 1 2-2h7Zm0 1H4a1 1 0 0 0-1 1v1.5C3 14.907 4.579 16 7.5 16c2.921 0 4.5-1.093 4.5-2.5V12a1 1 0 0 0-1-1Zm5-1a2 2 0 0 1 2 2v.5c0 2.089-1.568 3.5-4.5 3.5-.141 0-.28-.003-.414-.01.208-.242.382-.502.522-.781l.097-.213h.039C15.976 14.931 17 13.96 17 12.5V12a1 1 0 0 0-1-1h-2.171a3 3 0 0 0-.594-1H16ZM7.5 2a3.5 3.5 0 1 1 0 7 3.5 3.5 0 0 1 0-7Zm7 2a2.5 2.5 0 1 1 0 5 2.5 2.5 0 0 1 0-5Zm-7-1a2.5 2.5 0 1 0 0 5 2.5 2.5 0 0 0 0-5Zm7 2a1.5 1.5 0 1 0 0 3 1.5 1.5 0 0 0 0-3Z" })));
-    }
-};
-PeopleIcon.style = PeopleIconStyle0;
-const radioButtonGroupCss = ".radio-group{display:flex;flex-direction:column}.radio-group label{display:flex;font-family:var(--nylas-font-family);cursor:pointer}.radio-group label .radio-option{display:flex;align-items:flex-start;gap:0.5rem}.radio-group label .radio-option input[type=radio]{cursor:pointer}.radio-group label .radio-option input[type=radio i]{width:20px;height:20px;color:var(--nylas-primary);margin-top:16px}.radio-group label .radio-option p{display:flex;flex-direction:column;gap:0.5rem}.radio-group label .radio-option p .title{font-size:16px;font-weight:500;line-height:20px;color:var(--nylas-base-800)}.radio-group label .radio-option p .description{font-size:14px;font-weight:400;line-height:20px;color:var(--nylas-base-600)}";
-const RadioButtonGroupStyle0 = radioButtonGroupCss;
-const RadioButtonGroup = class {
-    constructor(hostRef) {
-        registerInstance(this, hostRef);
-        this.radioSelectionChanged = createEvent(this, "radioSelectionChanged", 7);
-        this.name = 'radio-group';
-        this.options = [];
-        this.defaultSelectedValue = '';
-        this.selectedValue = this.defaultSelectedValue;
-    }
-    handleChange(value) {
-        this.selectedValue = value;
-        this.radioSelectionChanged.emit({
-            value,
-            name: this.name,
-        });
-    }
-    render() {
-        return (h("div", { key: '82c0a38507193f6e941c820c38f9e5c477dc14dc', class: "radio-group" }, this.options.map(option => (h("label", null, h("div", { class: "radio-option" }, h("input", { type: "radio", name: this.name, value: option.value, checked: this.selectedValue === option.value, onChange: () => this.handleChange(option.value) }), h("p", null, h("span", { class: "title" }, option.label), h("span", { class: "description" }, option.description))))))));
-    }
-};
-RadioButtonGroup.style = RadioButtonGroupStyle0;
-const toggleSwitchCss = ".switch{--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;display:inline-block;height:34px;position:relative;width:60px}.switch input{display:none}.slider{background-color:var(--nylas-base-400);bottom:0;cursor:pointer;left:0;position:absolute;right:0;top:0;transition:0.4s}.slider:before{background-color:var(--nylas-base-0);bottom:4px;content:\"\";height:32px;left:4px;position:absolute;transition:0.4s;width:32px}input:checked+.slider{background-color:var(--nylas-success)}input:checked+.slider:before{transform:translateX(32px)}.slider.round{border-radius:35px;width:72px;height:40px}.slider.round:before{border-radius:50%}";
-const ToggleSwitchStyle0 = toggleSwitchCss;
-const ToggleSwitchComponent = class {
-    constructor(hostRef) {
-        registerInstance(this, hostRef);
-        this.nylasFormSwitchToggled = createEvent(this, "nylasFormSwitchToggled", 7);
-        this.name = 'toggle-switch';
-        this.checked = false;
-        this.label = '';
-        this.isChecked = this.checked;
-    }
-    componentWillLoad() {
-        this.isChecked = this.checked;
-    }
-    toggleCheck() {
-        this.isChecked = !this.isChecked;
-        this.nylasFormSwitchToggled.emit({
-            checked: this.isChecked,
-            name: this.name,
-            label: this.label,
-        });
-    }
-    render() {
-        return (h("label", { key: 'a0da5f3c6cac6310e9368ec4a5ed737decd04b5b', class: "switch", part: "ts_label" }, h("input", { key: '89e844d8135eadd471b960910794143ab1699afb', type: "checkbox", part: "ts_input", name: this.name, checked: this.isChecked, onChange: () => this.toggleCheck() }), h("div", { key: '19e8cea0befc42520c775555c8de96ac83d1612d', class: "slider round", part: "ts_slider" })));
-    }
-};
-ToggleSwitchComponent.style = ToggleSwitchStyle0;
-export { CalendarInfoIcon as calendar_info_icon, CalendarPatternsIcon as calendar_patterns_icon, CheckboxComponent as checkbox_component, FlowIcon as flow_icon, LocationIcon as location_icon, LocationOffIcon as location_off_icon, MultiSelectDropdown as multi_select_dropdown, NylasAdditionalParticipants as nylas_additional_participants, NylasAvailabilityPicker as nylas_availability_picker, NylasBookingCalendarPicker as nylas_booking_calendar_picker, NylasBufferTime as nylas_buffer_time, NylasCalendarPicker as nylas_calendar_picker, NylasCancellationPolicy as nylas_cancellation_policy, NylasCustomizeBookingSettings as nylas_customize_booking_settings, NylasEventDescription as nylas_event_description, NylasEventDuration as nylas_event_duration, NylasEventInfo as nylas_event_info, NylasEventLimits as nylas_event_limits, NylasEventLocation as nylas_event_location, NylasEventTitle as nylas_event_title, NylasLimitFutureBookings as nylas_limit_future_bookings, NylasMinBookingNotice as nylas_min_booking_notice, NylasMinCancellationNotice as nylas_min_cancellation_notice, NylasParticipantsCustomAvailability as nylas_participants_custom_availability, NylasTimeslotInterval as nylas_timeslot_interval, PeopleIcon as people_icon, RadioButtonGroup as radio_button_group, ToggleSwitchComponent as toggle_switch };
-//# sourceMappingURL=calendar-info-icon_28.entry.js.map