@nylas/web-elements 1.1.0-canary.5 → 1.1.0-canary.8

package/dist/esm/document-refresh-icon.entry.js

@@ -9,7 +9,7 @@ const DocumentRefreshIcon = class {
         this.height = '18';
     }
     render() {
-        return (h("svg", { key: '342b2ec1d22ee4d18cdeca3e580dfab64f064f6e', xmlns: "http://www.w3.org/2000/svg", viewBox: "0 0 18 18", width: this.width, height: this.height }, h("rect", { key: '31c6b7537b841a88a4bb2e350d82b0fa2f7afb64', id: "Canvas", fill: "#ff13dc", opacity: "0" }), h("path", { key: '329d093aec82ef6d106c8b8804872b625353b245', d: "M9.19763,12.26283A4.44131,4.44131,0,0,1,16.948,10.71741l.62524-.62524a.24433.24433,0,0,1,.1748-.07373.25035.25035,0,0,1,.252.24875v2.50143a.25.25,0,0,1-.25.25l-2.4995-.00016A.25088.25088,0,0,1,15,12.76721v-.00054a.24436.24436,0,0,1,.07373-.175l.86988-.86987a3.02827,3.02827,0,0,0-5.29847.71808.48835.48835,0,0,1-.46081.30981H9.55908a.37949.37949,0,0,1-.36145-.48686Z" }), h("path", { key: '9a93dd95b038875b1e03d301e4f8e755c52577aa', d: "M17.80237,14.77441A4.4413,4.4413,0,0,1,10.052,16.31982l-.62524.62524a.24429.24429,0,0,1-.1748.07373A.25036.25036,0,0,1,9,16.77V14.26863a.25.25,0,0,1,.25-.25l2.4995.00016A.25087.25087,0,0,1,12,14.27v.00052a.24434.24434,0,0,1-.07373.175l-.86988.86988a3.02828,3.02828,0,0,0,5.29847-.71808.48836.48836,0,0,1,.46081-.30982h.62525a.3795.3795,0,0,1,.36145.48687Z" }), h("path", { key: '1a4884a9cbad845c54f8ec72be5228d9d66dd830', d: "M7,13.5A6.5,6.5,0,0,1,13.5,7c.16883,0,.33447.01264.5.02527V5H9.5A.5.5,0,0,1,9,4.5V0H2.5A.5.5,0,0,0,2,.5v15a.5.5,0,0,0,.5.5H7.49981A6.4779,6.4779,0,0,1,7,13.5Z" }), h("path", { key: '09d913a7482f9720ef4020cfd04770168c8d241b', d: "M10,0h.043a.5.5,0,0,1,.353.146L13.854,3.6A.5.5,0,0,1,14,3.957V4H10Z" })));
+        return (h("svg", { key: 'a3053bd3d13a837950938ece6ddbe01039144e30', xmlns: "http://www.w3.org/2000/svg", viewBox: "0 0 18 18", width: this.width, height: this.height }, h("rect", { key: 'a84576d67949e16b509fab6baed89b6cd8120b28', id: "Canvas", fill: "#ff13dc", opacity: "0" }), h("path", { key: '00e92a704614a8690f2853d57d813b905bfbef2c', d: "M9.19763,12.26283A4.44131,4.44131,0,0,1,16.948,10.71741l.62524-.62524a.24433.24433,0,0,1,.1748-.07373.25035.25035,0,0,1,.252.24875v2.50143a.25.25,0,0,1-.25.25l-2.4995-.00016A.25088.25088,0,0,1,15,12.76721v-.00054a.24436.24436,0,0,1,.07373-.175l.86988-.86987a3.02827,3.02827,0,0,0-5.29847.71808.48835.48835,0,0,1-.46081.30981H9.55908a.37949.37949,0,0,1-.36145-.48686Z" }), h("path", { key: '33c4dfb07d0118088a615869e19b7f2d65dc9e6d', d: "M17.80237,14.77441A4.4413,4.4413,0,0,1,10.052,16.31982l-.62524.62524a.24429.24429,0,0,1-.1748.07373A.25036.25036,0,0,1,9,16.77V14.26863a.25.25,0,0,1,.25-.25l2.4995.00016A.25087.25087,0,0,1,12,14.27v.00052a.24434.24434,0,0,1-.07373.175l-.86988.86988a3.02828,3.02828,0,0,0,5.29847-.71808.48836.48836,0,0,1,.46081-.30982h.62525a.3795.3795,0,0,1,.36145.48687Z" }), h("path", { key: 'b3966127005c056d0c95a13307ccf18cd2fb6651', d: "M7,13.5A6.5,6.5,0,0,1,13.5,7c.16883,0,.33447.01264.5.02527V5H9.5A.5.5,0,0,1,9,4.5V0H2.5A.5.5,0,0,0,2,.5v15a.5.5,0,0,0,.5.5H7.49981A6.4779,6.4779,0,0,1,7,13.5Z" }), h("path", { key: '84c8c1f068a86fc739e16ae7fab5c4a16cf5516f', d: "M10,0h.043a.5.5,0,0,1,.353.146L13.854,3.6A.5.5,0,0,1,14,3.957V4H10Z" })));
     }
 };
 DocumentRefreshIcon.style = iconCss;

package/dist/esm/flow-icon.entry.js

@@ -9,7 +9,7 @@ const FlowIcon = class {
         this.height = '12';
     }
     render() {
-        return (h("svg", { key: 'ce2f820ce9aacb96c4464a56676f1f136980caa2', width: this.width, height: this.height, fill: "none", xmlns: "http://www.w3.org/2000/svg" }, h("path", { key: 'af4cba794e87457fd175d21a731c5088cd6a1819', 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" })));
+        return (h("svg", { key: 'e0f4da46b751754406e8b0551890a1bffb1100e4', width: this.width, height: this.height, fill: "none", xmlns: "http://www.w3.org/2000/svg" }, h("path", { key: '21997cb261d91c8589c3e87a01036dc8f91a8d9b', 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 = iconCss;

package/dist/esm/folder-icon.entry.js

@@ -9,7 +9,7 @@ const FolderIcon = class {
         this.height = '15';
     }
     render() {
-        return (h("svg", { key: '163635a37865d119df81123279ae521540d72316', width: this.width, height: this.height, viewBox: "0 0 24 24", fill: "auto", xmlns: "http://www.w3.org/2000/svg" }, h("path", { key: 'a5898814da9ca7186d5369c42c3329152cd0f3cc', d: "M3 8.2C3 7.07989 3 6.51984 3.21799 6.09202C3.40973 5.71569 3.71569 5.40973 4.09202 5.21799C4.51984 5 5.0799 5 6.2 5H9.67452C10.1637 5 10.4083 5 10.6385 5.05526C10.8425 5.10425 11.0376 5.18506 11.2166 5.29472C11.4184 5.4184 11.5914 5.59135 11.9373 5.93726L12.0627 6.06274C12.4086 6.40865 12.5816 6.5816 12.7834 6.70528C12.9624 6.81494 13.1575 6.89575 13.3615 6.94474C13.5917 7 13.8363 7 14.3255 7H17.8C18.9201 7 19.4802 7 19.908 7.21799C20.2843 7.40973 20.5903 7.71569 20.782 8.09202C21 8.51984 21 9.0799 21 10.2V15.8C21 16.9201 21 17.4802 20.782 17.908C20.5903 18.2843 20.2843 18.5903 19.908 18.782C19.4802 19 18.9201 19 17.8 19H6.2C5.07989 19 4.51984 19 4.09202 18.782C3.71569 18.5903 3.40973 18.2843 3.21799 17.908C3 17.4802 3 16.9201 3 15.8V8.2Z", stroke: "auto", "stroke-width": "2", "stroke-linecap": "round", "stroke-linejoin": "round" })));
+        return (h("svg", { key: '3426a025a15f6473ec8935df115dc65f6c21cc18', width: this.width, height: this.height, viewBox: "0 0 24 24", fill: "auto", xmlns: "http://www.w3.org/2000/svg" }, h("path", { key: '8e567fdf1ad34121d1830b57d6f93993cf50ac6f', d: "M3 8.2C3 7.07989 3 6.51984 3.21799 6.09202C3.40973 5.71569 3.71569 5.40973 4.09202 5.21799C4.51984 5 5.0799 5 6.2 5H9.67452C10.1637 5 10.4083 5 10.6385 5.05526C10.8425 5.10425 11.0376 5.18506 11.2166 5.29472C11.4184 5.4184 11.5914 5.59135 11.9373 5.93726L12.0627 6.06274C12.4086 6.40865 12.5816 6.5816 12.7834 6.70528C12.9624 6.81494 13.1575 6.89575 13.3615 6.94474C13.5917 7 13.8363 7 14.3255 7H17.8C18.9201 7 19.4802 7 19.908 7.21799C20.2843 7.40973 20.5903 7.71569 20.782 8.09202C21 8.51984 21 9.0799 21 10.2V15.8C21 16.9201 21 17.4802 20.782 17.908C20.5903 18.2843 20.2843 18.5903 19.908 18.782C19.4802 19 18.9201 19 17.8 19H6.2C5.07989 19 4.51984 19 4.09202 18.782C3.71569 18.5903 3.40973 18.2843 3.21799 17.908C3 17.4802 3 16.9201 3 15.8V8.2Z", stroke: "auto", "stroke-width": "2", "stroke-linecap": "round", "stroke-linejoin": "round" })));
     }
 };
 FolderIcon.style = iconCss;

package/dist/esm/forward-icon.entry.js

@@ -9,7 +9,7 @@ const ForwardIcon = class {
         this.height = '15';
     }
     render() {
-        return (h("svg", { key: '6a4eb6d9a2531279db927e298081ac4da5428fca', fill: "auto", width: this.width, height: this.height, viewBox: "0 0 1920 1920", xmlns: "http://www.w3.org/2000/svg" }, h("path", { key: 'ad2847c25e5d83df09cf22a76a198eb4e7f212f9', d: "m1246.246 64-90.496 90.496 477.952 477.952h-590.848C467.878 632.448.038 1100.416.038 1675.392v109.056h128v-109.056c0-504.576 410.368-914.944 914.816-914.944h590.848l-477.952 478.08 90.496 90.496 632.448-632.576L1246.246 64Z", "fill-rule": "evenodd" })));
+        return (h("svg", { key: 'c3c406f225989a53006d7deef67a2dd8dd3d5d81', fill: "auto", width: this.width, height: this.height, viewBox: "0 0 1920 1920", xmlns: "http://www.w3.org/2000/svg" }, h("path", { key: 'be9eae8233d00a07dd1501d7daf45f51d6049908', d: "m1246.246 64-90.496 90.496 477.952 477.952h-590.848C467.878 632.448.038 1100.416.038 1675.392v109.056h128v-109.056c0-504.576 410.368-914.944 914.816-914.944h590.848l-477.952 478.08 90.496 90.496 632.448-632.576L1246.246 64Z", "fill-rule": "evenodd" })));
     }
 };
 ForwardIcon.style = iconCss;

package/dist/esm/forward-icon_6.entry.js

@@ -1,6 +1,6 @@
 import { r as registerInstance, h, c as createEvent, H as Host, a as getElement, F as Fragment } from './index-7cb0dd3d.js';
-import { a as debug, j as htmlToPlainText, k as detectIfMessageIsHTML, l as detectHTMLOrPlainText, p as parsePlainTextToHTML } from './utils-d6204242.js';
-import { R as RegisterComponent } from './register-component-cf5c8420.js';
+import { a as debug, j as htmlToPlainText, k as detectIfMessageIsHTML, l as detectHTMLOrPlainText, p as parsePlainTextToHTML } from './utils-db11d29c.js';
+import { R as RegisterComponent } from './register-component-b9cfcbaf.js';
 import { c as commonjsGlobal } from './_commonjsHelpers-57e89916.js';
 
 const iconCss$2 = ".sc-forward-icon-h{display:flex}";
@@ -13,7 +13,7 @@ const ForwardIcon = class {
         this.height = '15';
     }
     render() {
-        return (h("svg", { key: '6a4eb6d9a2531279db927e298081ac4da5428fca', fill: "auto", width: this.width, height: this.height, viewBox: "0 0 1920 1920", xmlns: "http://www.w3.org/2000/svg" }, h("path", { key: 'ad2847c25e5d83df09cf22a76a198eb4e7f212f9', d: "m1246.246 64-90.496 90.496 477.952 477.952h-590.848C467.878 632.448.038 1100.416.038 1675.392v109.056h128v-109.056c0-504.576 410.368-914.944 914.816-914.944h590.848l-477.952 478.08 90.496 90.496 632.448-632.576L1246.246 64Z", "fill-rule": "evenodd" })));
+        return (h("svg", { key: 'c3c406f225989a53006d7deef67a2dd8dd3d5d81', fill: "auto", width: this.width, height: this.height, viewBox: "0 0 1920 1920", xmlns: "http://www.w3.org/2000/svg" }, h("path", { key: 'be9eae8233d00a07dd1501d7daf45f51d6049908', d: "m1246.246 64-90.496 90.496 477.952 477.952h-590.848C467.878 632.448.038 1100.416.038 1675.392v109.056h128v-109.056c0-504.576 410.368-914.944 914.816-914.944h590.848l-477.952 478.08 90.496 90.496 632.448-632.576L1246.246 64Z", "fill-rule": "evenodd" })));
     }
 };
 ForwardIcon.style = ForwardIconStyle0;
@@ -151,7 +151,7 @@ const NylasComposer = class {
         this.editorEl.focus();
     }
     render() {
-        return (h(Host, { key: '7537b7c56a1e609f88189c2c4deed986827eb193' }, h("sp-theme", { key: 'efa28f8ed5585ec21b44ae5ec174aa10a9c92aba', scale: "medium", color: "dark" }, h("div", { key: 'c7932bcedcb2b3cfa4e0900578cf2b749000125d', class: "editor", contentEditable: true, ref: r => (this.editorEl = r) }, h("div", { key: '89c06c0e76d29ea6713dd44b2452e261d0d7d43b', class: "toolbar", ref: r => (this.toolbarEl = r), contentEditable: false }, h("sp-button", { key: 'beeb60448f03c8818925aeb13ab5231aa72f7526', quiet: true, onClick: () => document.execCommand('bold') }, h("div", { key: '4e37be81a28ac4355f9d0d6d6c71b7b78cf41456', slot: "icon" }, h("bold-icon", { key: '56cf047799a6a5713310d5b095ca91e6004d6107' })), h("div", { key: '2fe47f8f364f7fb1016990f2aecec655e2e6eb30', slot: "label" }, "Bold")), h("sp-button", { key: '0416d13b88ccefd5005f4b97f7dded2118d37f43', quiet: true, onClick: () => document.execCommand('underline') }, h("div", { key: '6d20e215eafbb91a17ce452a6b64295ab4ef2bb9', slot: "icon" }, h("underline-icon", { key: 'b8d988fa168047ed213fbcceb53b24bf3f766d7a' })), h("div", { key: 'bd05639007b3ea849501b995137ceda70aed20da', slot: "label" }, "Underline")), h("sp-button", { key: '9775c4787363cd4d21778f4c848c7f5a7564b507', quiet: true, onClick: () => document.execCommand('italic') }, h("div", { key: 'ca9d557028981c0fe209045e5d1748b19bbb5069', slot: "icon" }, h("italic-icon", { key: '1be5debba3572e83ab132a3e44d8fc1e799f6619' })), h("div", { key: 'cccb70309840e20f558158e6ef9edf8fe0e52eed', slot: "label" }, "Italic")))), h("div", { key: '502854e008886de49ec435c1ebd73b48f2cc4c70', class: 'buttons' }, h("sp-button", { key: '9663a709ca8794dc76dec379a39c52a6a754cb6e', onClick: this.sendComposer, class: "send" }, "Send"), h("sp-button", { key: 'b0c7637932f2659c9115e74f1244db04992a69aa', onClick: this.closeComposer, class: "close" }, "Close")))));
+        return (h(Host, { key: '8d7f9c145099757c2a8dc48f1d2a223831f82cda' }, h("sp-theme", { key: 'e92e457e86701838f55d97b3f2c1c0f70f14bf59', scale: "medium", color: "dark" }, h("div", { key: '50eba2b6ee0c84d8eeb392385872604b74b11025', class: "editor", contentEditable: true, ref: r => (this.editorEl = r) }, h("div", { key: '38bdd2ec58e62699e2c604b1b2c586cb5ecf105a', class: "toolbar", ref: r => (this.toolbarEl = r), contentEditable: false }, h("sp-button", { key: '6415e5f9910a2d9798e7c85162329f359e500aeb', quiet: true, onClick: () => document.execCommand('bold') }, h("div", { key: 'e03cfe0f5736836f64aa350165fa519508e212f7', slot: "icon" }, h("bold-icon", { key: '1ad03230cff2f0843d6da22153716c3818ed04f7' })), h("div", { key: 'd90c50aff88b9ac7774d6792b91ea3ced21f4419', slot: "label" }, "Bold")), h("sp-button", { key: '466621fcdf2e8e1e85b613bba82b948ed2177a88', quiet: true, onClick: () => document.execCommand('underline') }, h("div", { key: '6be0737cf685b02f3ee8ef7c34fd18674793af00', slot: "icon" }, h("underline-icon", { key: '278b1b79d3aec25ab2c2181c3e5c631063b04e29' })), h("div", { key: '169d3039815082e208eb476b4490181f7eb54ee6', slot: "label" }, "Underline")), h("sp-button", { key: '92c20b2d03b709f08c63af3a1e88b10e407243d7', quiet: true, onClick: () => document.execCommand('italic') }, h("div", { key: '67eb3d5b5a2118d90bfb81c7b51d52c41b5ab2a2', slot: "icon" }, h("italic-icon", { key: '35ac96f9ff3f3f0c38c7e486092f42dc9451eb63' })), h("div", { key: 'f29fe84363cca6e178a3651a1c8e56929ebb3e32', slot: "label" }, "Italic")))), h("div", { key: '3d89b191642ab291fc338ffd66be16fe999950b1', class: 'buttons' }, h("sp-button", { key: 'f78c122acf4c69c788d411d2dcfd49649c99919e', onClick: this.sendComposer, class: "send" }, "Send"), h("sp-button", { key: 'b46873c911cb796e9af22eb7d19bf6e1cd2cd1be', onClick: this.closeComposer, class: "close" }, "Close")))));
     }
     get host() { return getElement(this); }
     static get watchers() { return {
@@ -310,12 +310,12 @@ const NylasSummarizeMessageButton = class {
         });
     }
     render() {
-        return (h(Host, { key: '8c0687fd071081bfe39b324debeb165a966301c0' }, h("sp-theme", { key: '30328464c09cb718c83ffa123018ea2ade596774', scale: "medium", color: "dark" }, h("sp-button", { key: 'b7f0095382095c2c69a664cfd848a7d44e3fee3a', label: "Summarize email", "icon-only": true, onClickCapture: this.onClick, class: {
+        return (h(Host, { key: '09d693158ce9480c000957afe31566d47f6fb5f2' }, h("sp-theme", { key: '21f246783a3d5786c1cee8f438e89947ee5f574d', scale: "medium", color: "dark" }, h("sp-button", { key: '7ef9c60895da162d3b521ddc7c070ff463e51094', label: "Summarize email", "icon-only": true, onClickCapture: this.onClick, class: {
                 'summarize-button': true,
                 'stopped': this.state === 'stopped',
                 'loading': this.state === 'loading',
                 'playing': this.state === 'playing',
-            } }, this.state === 'stopped' && h("play-icon", null), this.state === 'loading' && h("loading-icon", null), this.state === 'playing' && h("stop-icon", null)), h("audio", { key: 'a5595d5d2a40baa947eece71ee22110d9225c879', ref: r => (this.audioRef = r), autoPlay: true, onPlaying: () => (this.state = 'playing'), onPause: () => (this.state = 'stopped'), onEnded: () => {
+            } }, this.state === 'stopped' && h("play-icon", null), this.state === 'loading' && h("loading-icon", null), this.state === 'playing' && h("stop-icon", null)), h("audio", { key: '7481ceeb62b6eb21c627d0e04be0e0e7a9e986ec', ref: r => (this.audioRef = r), autoPlay: true, onPlaying: () => (this.state = 'playing'), onPause: () => (this.state = 'stopped'), onEnded: () => {
                 this.state = 'stopped';
                 debug(`[nylas-summarize-message-button] Audio ended`);
             } }))));
@@ -2162,7 +2162,7 @@ const NylasViewEmail = class {
     }
     render() {
         console.debug(`[nylas-view-email] render`, { hoistedFontURLs: this.hoistedFontURLs });
-        return (h(Host, { key: '4f0a1e688ae465d65943adc7dabac9cad6c62fe8' }, this.state === 'loading' && h("div", null, "Loading..."), this.state === 'ready' && (h(Fragment, null, this.styles.map(style => (h("style", null, DOMPurify.sanitize(style.innerHTML)))), h("div", { class: 'view-email', part: "view-email", innerHTML: this.sanitizedBody, ref: el => (this.viewEmailElement = el) })))));
+        return (h(Host, { key: 'fe606c06674789e63156056d8b71a5cb2202cf47' }, this.state === 'loading' && h("div", null, "Loading..."), this.state === 'ready' && (h(Fragment, null, this.styles.map(style => (h("style", null, DOMPurify.sanitize(style.innerHTML)))), h("div", { class: 'view-email', part: "view-email", innerHTML: this.sanitizedBody, ref: el => (this.viewEmailElement = el) })))));
     }
     get host() { return getElement(this); }
     static get watchers() { return {
@@ -2182,7 +2182,7 @@ const ReplyAllIcon = class {
         this.height = '15';
     }
     render() {
-        return (h("svg", { key: '5473055eb158788f0e5c29e437f68bc42975f443', fill: "auto", width: this.width, height: this.height, viewBox: "0 0 1920 1920", xmlns: "http://www.w3.org/2000/svg" }, h("path", { key: '8a27d6646e2807edce6b308ebfaa17e7e71c7ce7', d: "m1030.975 188 81.249 81.249-429.228 429.228h300.747c516.223 0 936.257 420.034 936.257 936.257v98.028h-114.92v-98.028c0-452.901-368.436-821.337-821.337-821.337H682.996l429.228 429.229-81.25 81.248-567.936-567.937L1030.975 188Zm-463.038.011 81.249 81.25-486.688 486.688 486.688 486.688-81.249 81.249L0 755.949 567.937 188.01Z", "fill-rule": "evenodd" })));
+        return (h("svg", { key: '2baf5fdfb4309e039a9a4e66ecacbf4481c2d7ca', fill: "auto", width: this.width, height: this.height, viewBox: "0 0 1920 1920", xmlns: "http://www.w3.org/2000/svg" }, h("path", { key: 'd7f1586f9af096cb3a1876b681ba408387899788', d: "m1030.975 188 81.249 81.249-429.228 429.228h300.747c516.223 0 936.257 420.034 936.257 936.257v98.028h-114.92v-98.028c0-452.901-368.436-821.337-821.337-821.337H682.996l429.228 429.229-81.25 81.248-567.936-567.937L1030.975 188Zm-463.038.011 81.249 81.25-486.688 486.688 486.688 486.688-81.249 81.249L0 755.949 567.937 188.01Z", "fill-rule": "evenodd" })));
     }
 };
 ReplyAllIcon.style = ReplyAllIconStyle0;
@@ -2197,7 +2197,7 @@ const ReplyIcon = class {
         this.height = '15';
     }
     render() {
-        return (h("svg", { key: 'fe3dcd629d521170b57ee467fc46c2cded6b74da', fill: "auto", width: this.width, height: this.height, viewBox: "0 0 1920 1920", xmlns: "http://www.w3.org/2000/svg" }, h("path", { key: '8b71c92d370bd5038c286aeab7b145a9095f0f80', d: "M835.942 632.563H244.966l478.08-478.08-90.496-90.496L-.026 696.563 632.55 1329.14l90.496-90.496-478.08-478.08h590.976c504.448 0 914.816 410.368 914.816 914.816v109.184h128V1675.38c0-574.976-467.84-1042.816-1042.816-1042.816", "fill-rule": "evenodd" })));
+        return (h("svg", { key: '07034b975afd3fa950dec8be4e28c16775b5a49e', fill: "auto", width: this.width, height: this.height, viewBox: "0 0 1920 1920", xmlns: "http://www.w3.org/2000/svg" }, h("path", { key: '5601b12fa1dde6412985fa2f701eeb3f9e2b07b4', d: "M835.942 632.563H244.966l478.08-478.08-90.496-90.496L-.026 696.563 632.55 1329.14l90.496-90.496-478.08-478.08h590.976c504.448 0 914.816 410.368 914.816 914.816v109.184h128V1675.38c0-574.976-467.84-1042.816-1042.816-1042.816", "fill-rule": "evenodd" })));
     }
 };
 ReplyIcon.style = ReplyIconStyle0;

package/dist/esm/globe-icon.entry.js

@@ -9,7 +9,7 @@ const GlobeIcon = class {
         this.height = '16';
     }
     render() {
-        return (h("svg", { key: 'f8a5a34bee5e081a6232b4eb17c11d4761881966', xmlns: "http://www.w3.org/2000/svg", width: this.width, height: this.height, viewBox: "0 0 16 16", fill: "none" }, h("path", { key: 'eedaeb8db7ba0f784c5c1837fbea8b3b951926f1', d: "M8 14C11.3137 14 14 11.3137 14 8C14 4.68629 11.3137 2 8 2C4.68629 2 2 4.68629 2 8C2 11.3137 4.68629 14 8 14ZM8 3C8.37372 3 8.87543 3.35608 9.31258 4.31781C9.4073 4.52619 9.49448 4.75446 9.57265 5H6.42735C6.50552 4.75446 6.5927 4.52619 6.68742 4.31781C7.12457 3.35608 7.62628 3 8 3ZM5.77705 3.90401C5.62614 4.23601 5.49428 4.6038 5.38411 5H3.99963C4.52341 4.30269 5.22525 3.74677 6.03766 3.39978C5.94287 3.56117 5.85596 3.7304 5.77705 3.90401ZM5.16299 6C5.05694 6.6275 5 7.30146 5 8C5 8.69854 5.05694 9.3725 5.16299 10H3.41604C3.14845 9.38754 3 8.7111 3 8C3 7.2889 3.14845 6.61246 3.41604 6H5.16299ZM5.38411 11C5.49428 11.3962 5.62614 11.764 5.77705 12.096C5.85596 12.2696 5.94287 12.4388 6.03766 12.6002C5.22525 12.2532 4.52341 11.6973 3.99963 11H5.38411ZM6.42735 11H9.57265C9.49448 11.2455 9.4073 11.4738 9.31258 11.6822C8.87543 12.6439 8.37372 13 8 13C7.62628 13 7.12457 12.6439 6.68742 11.6822C6.5927 11.4738 6.50552 11.2455 6.42735 11ZM9.82134 10H6.17866C6.06438 9.3892 6 8.71396 6 8C6 7.28604 6.06438 6.6108 6.17866 6H9.82134C9.93562 6.6108 10 7.28604 10 8C10 8.71396 9.93562 9.3892 9.82134 10ZM10.6159 11H12.0004C11.4766 11.6973 10.7747 12.2532 9.96234 12.6002C10.0571 12.4388 10.144 12.2696 10.2229 12.096C10.3739 11.764 10.5057 11.3962 10.6159 11ZM12.584 10H10.837C10.9431 9.3725 11 8.69854 11 8C11 7.30146 10.9431 6.6275 10.837 6H12.584C12.8516 6.61246 13 7.2889 13 8C13 8.7111 12.8516 9.38754 12.584 10ZM9.96234 3.39978C10.7747 3.74677 11.4766 4.30269 12.0004 5H10.6159C10.5057 4.6038 10.3739 4.23601 10.2229 3.90401C10.144 3.7304 10.0571 3.56117 9.96234 3.39978Z", fill: "currentColor" })));
+        return (h("svg", { key: 'f5143e3cb40a90ae9f1d944bfc452b7074d67582', xmlns: "http://www.w3.org/2000/svg", width: this.width, height: this.height, viewBox: "0 0 16 16", fill: "none" }, h("path", { key: 'f43a8401af32f5ddaa3e325a32371c858716145b', d: "M8 14C11.3137 14 14 11.3137 14 8C14 4.68629 11.3137 2 8 2C4.68629 2 2 4.68629 2 8C2 11.3137 4.68629 14 8 14ZM8 3C8.37372 3 8.87543 3.35608 9.31258 4.31781C9.4073 4.52619 9.49448 4.75446 9.57265 5H6.42735C6.50552 4.75446 6.5927 4.52619 6.68742 4.31781C7.12457 3.35608 7.62628 3 8 3ZM5.77705 3.90401C5.62614 4.23601 5.49428 4.6038 5.38411 5H3.99963C4.52341 4.30269 5.22525 3.74677 6.03766 3.39978C5.94287 3.56117 5.85596 3.7304 5.77705 3.90401ZM5.16299 6C5.05694 6.6275 5 7.30146 5 8C5 8.69854 5.05694 9.3725 5.16299 10H3.41604C3.14845 9.38754 3 8.7111 3 8C3 7.2889 3.14845 6.61246 3.41604 6H5.16299ZM5.38411 11C5.49428 11.3962 5.62614 11.764 5.77705 12.096C5.85596 12.2696 5.94287 12.4388 6.03766 12.6002C5.22525 12.2532 4.52341 11.6973 3.99963 11H5.38411ZM6.42735 11H9.57265C9.49448 11.2455 9.4073 11.4738 9.31258 11.6822C8.87543 12.6439 8.37372 13 8 13C7.62628 13 7.12457 12.6439 6.68742 11.6822C6.5927 11.4738 6.50552 11.2455 6.42735 11ZM9.82134 10H6.17866C6.06438 9.3892 6 8.71396 6 8C6 7.28604 6.06438 6.6108 6.17866 6H9.82134C9.93562 6.6108 10 7.28604 10 8C10 8.71396 9.93562 9.3892 9.82134 10ZM10.6159 11H12.0004C11.4766 11.6973 10.7747 12.2532 9.96234 12.6002C10.0571 12.4388 10.144 12.2696 10.2229 12.096C10.3739 11.764 10.5057 11.3962 10.6159 11ZM12.584 10H10.837C10.9431 9.3725 11 8.69854 11 8C11 7.30146 10.9431 6.6275 10.837 6H12.584C12.8516 6.61246 13 7.2889 13 8C13 8.7111 12.8516 9.38754 12.584 10ZM9.96234 3.39978C10.7747 3.74677 11.4766 4.30269 12.0004 5H10.6159C10.5057 4.6038 10.3739 4.23601 10.2229 3.90401C10.144 3.7304 10.0571 3.56117 9.96234 3.39978Z", fill: "currentColor" })));
     }
 };
 GlobeIcon.style = iconCss;

package/dist/esm/google-logo-icon.entry.js

@@ -9,7 +9,7 @@ const GoogleLogoIcon = class {
         this.height = '24';
     }
     render() {
-        return (h("svg", { key: 'e71880e55c9352a0e1ee2ad058727601f35e3ce4', width: this.width, height: this.height, viewBox: "0 0 24 24", fill: "none", xmlns: "http://www.w3.org/2000/svg" }, h("g", { key: '7fec6b17669641c93baae51ca32571112071fef7', "clip-path": "url(#clip0_959_12452)" }, h("path", { key: 'dc78e953321de09b2eb1a617d36757840fa3bc77', d: "M23.745 12.27C23.745 11.48 23.675 10.73 23.555 10H12.255V14.51H18.725C18.435 15.99 17.585 17.24 16.325 18.09V21.09H20.185C22.445 19 23.745 15.92 23.745 12.27Z", fill: "#4285F4" }), h("path", { key: 'fd3fa31399c0daddb0666b5e5bfa22df37d707ed', d: "M12.255 24C15.495 24 18.205 22.92 20.185 21.09L16.325 18.09C15.245 18.81 13.875 19.25 12.255 19.25C9.12504 19.25 6.47505 17.14 5.52505 14.29H1.54504V17.38C3.51504 21.3 7.56504 24 12.255 24Z", fill: "#34A853" }), h("path", { key: 'ba6682324108438a8d09fd8c2f485fd902ac7d1e', d: "M5.52501 14.2901C5.27501 13.5701 5.145 12.8001 5.145 12.0001C5.145 11.2001 5.28501 10.4301 5.52501 9.71012V6.62012H1.545C0.725004 8.24012 0.255005 10.0601 0.255005 12.0001C0.255005 13.9401 0.725004 15.7601 1.545 17.3801L5.52501 14.2901Z", fill: "#FBBC05" }), h("path", { key: '8f343c03d1881b1db41b2f259c58b0ad37256909', d: "M12.255 4.75C14.025 4.75 15.605 5.36 16.855 6.55L20.275 3.13C18.205 1.19 15.495 0 12.255 0C7.56504 0 3.51504 2.7 1.54504 6.62L5.52505 9.71C6.47505 6.86 9.12504 4.75 12.255 4.75Z", fill: "#EA4335" })), h("defs", { key: 'd139b2306583164474093240ab884fddbe240f16' }, h("clipPath", { key: 'd54b7ab509f646be7407b61c0e6b49765f5325d7', id: "clip0_959_12452" }, h("rect", { key: 'ac9a24a627127c049b291447ce1198424416f4ae', width: 24, height: 24, fill: "white" })))));
+        return (h("svg", { key: '2445589627197f9af06e10891e1772c17b140c0a', width: this.width, height: this.height, viewBox: "0 0 24 24", fill: "none", xmlns: "http://www.w3.org/2000/svg" }, h("g", { key: 'b84ea9a0cc741b646d9a63113404d34c5e155fc8', "clip-path": "url(#clip0_959_12452)" }, h("path", { key: '9c774266fb43cf807ea64846b71eb27c6272b17d', d: "M23.745 12.27C23.745 11.48 23.675 10.73 23.555 10H12.255V14.51H18.725C18.435 15.99 17.585 17.24 16.325 18.09V21.09H20.185C22.445 19 23.745 15.92 23.745 12.27Z", fill: "#4285F4" }), h("path", { key: 'ff0fe8133c31fc75ecf3e9fedecbbaef2e35dd54', d: "M12.255 24C15.495 24 18.205 22.92 20.185 21.09L16.325 18.09C15.245 18.81 13.875 19.25 12.255 19.25C9.12504 19.25 6.47505 17.14 5.52505 14.29H1.54504V17.38C3.51504 21.3 7.56504 24 12.255 24Z", fill: "#34A853" }), h("path", { key: '5851b3de9ee71263668f65e2e86f0dfab3039c83', d: "M5.52501 14.2901C5.27501 13.5701 5.145 12.8001 5.145 12.0001C5.145 11.2001 5.28501 10.4301 5.52501 9.71012V6.62012H1.545C0.725004 8.24012 0.255005 10.0601 0.255005 12.0001C0.255005 13.9401 0.725004 15.7601 1.545 17.3801L5.52501 14.2901Z", fill: "#FBBC05" }), h("path", { key: '2a79a335e1b8d03747b5f879a75deb5544e5cf63', d: "M12.255 4.75C14.025 4.75 15.605 5.36 16.855 6.55L20.275 3.13C18.205 1.19 15.495 0 12.255 0C7.56504 0 3.51504 2.7 1.54504 6.62L5.52505 9.71C6.47505 6.86 9.12504 4.75 12.255 4.75Z", fill: "#EA4335" })), h("defs", { key: 'f3b4d8d363cc9ac066b92de2354b9210d7190b46' }, h("clipPath", { key: '270b05e06d87d998c7525254f4f2ae3d5a0ab835', id: "clip0_959_12452" }, h("rect", { key: 'de0df984a8f12ccdd0c655968c4f8b2049996968', width: 24, height: 24, fill: "white" })))));
     }
 };
 GoogleLogoIcon.style = iconCss;

package/dist/esm/google-logo-icon_4.entry.js

@@ -1,6 +1,7 @@
 import { r as registerInstance, h, c as createEvent, H as Host, a as getElement } from './index-7cb0dd3d.js';
-import { R as RegisterComponent } from './register-component-cf5c8420.js';
-import { a as debug, m as parsePreviewLink } from './utils-d6204242.js';
+import { R as RegisterComponent } from './register-component-b9cfcbaf.js';
+import { a as debug, m as parsePreviewLink } from './utils-db11d29c.js';
+import { D as DEFAULT_OPEN_HOURS } from './constants-f34b9c6e.js';
 import './_commonjsHelpers-57e89916.js';
 
 const iconCss$1 = ".sc-google-logo-icon-h{display:flex}";
@@ -13,7 +14,7 @@ const GoogleLogoIcon = class {
         this.height = '24';
     }
     render() {
-        return (h("svg", { key: 'e71880e55c9352a0e1ee2ad058727601f35e3ce4', width: this.width, height: this.height, viewBox: "0 0 24 24", fill: "none", xmlns: "http://www.w3.org/2000/svg" }, h("g", { key: '7fec6b17669641c93baae51ca32571112071fef7', "clip-path": "url(#clip0_959_12452)" }, h("path", { key: 'dc78e953321de09b2eb1a617d36757840fa3bc77', d: "M23.745 12.27C23.745 11.48 23.675 10.73 23.555 10H12.255V14.51H18.725C18.435 15.99 17.585 17.24 16.325 18.09V21.09H20.185C22.445 19 23.745 15.92 23.745 12.27Z", fill: "#4285F4" }), h("path", { key: 'fd3fa31399c0daddb0666b5e5bfa22df37d707ed', d: "M12.255 24C15.495 24 18.205 22.92 20.185 21.09L16.325 18.09C15.245 18.81 13.875 19.25 12.255 19.25C9.12504 19.25 6.47505 17.14 5.52505 14.29H1.54504V17.38C3.51504 21.3 7.56504 24 12.255 24Z", fill: "#34A853" }), h("path", { key: 'ba6682324108438a8d09fd8c2f485fd902ac7d1e', d: "M5.52501 14.2901C5.27501 13.5701 5.145 12.8001 5.145 12.0001C5.145 11.2001 5.28501 10.4301 5.52501 9.71012V6.62012H1.545C0.725004 8.24012 0.255005 10.0601 0.255005 12.0001C0.255005 13.9401 0.725004 15.7601 1.545 17.3801L5.52501 14.2901Z", fill: "#FBBC05" }), h("path", { key: '8f343c03d1881b1db41b2f259c58b0ad37256909', d: "M12.255 4.75C14.025 4.75 15.605 5.36 16.855 6.55L20.275 3.13C18.205 1.19 15.495 0 12.255 0C7.56504 0 3.51504 2.7 1.54504 6.62L5.52505 9.71C6.47505 6.86 9.12504 4.75 12.255 4.75Z", fill: "#EA4335" })), h("defs", { key: 'd139b2306583164474093240ab884fddbe240f16' }, h("clipPath", { key: 'd54b7ab509f646be7407b61c0e6b49765f5325d7', id: "clip0_959_12452" }, h("rect", { key: 'ac9a24a627127c049b291447ce1198424416f4ae', width: 24, height: 24, fill: "white" })))));
+        return (h("svg", { key: '2445589627197f9af06e10891e1772c17b140c0a', width: this.width, height: this.height, viewBox: "0 0 24 24", fill: "none", xmlns: "http://www.w3.org/2000/svg" }, h("g", { key: 'b84ea9a0cc741b646d9a63113404d34c5e155fc8', "clip-path": "url(#clip0_959_12452)" }, h("path", { key: '9c774266fb43cf807ea64846b71eb27c6272b17d', d: "M23.745 12.27C23.745 11.48 23.675 10.73 23.555 10H12.255V14.51H18.725C18.435 15.99 17.585 17.24 16.325 18.09V21.09H20.185C22.445 19 23.745 15.92 23.745 12.27Z", fill: "#4285F4" }), h("path", { key: 'ff0fe8133c31fc75ecf3e9fedecbbaef2e35dd54', d: "M12.255 24C15.495 24 18.205 22.92 20.185 21.09L16.325 18.09C15.245 18.81 13.875 19.25 12.255 19.25C9.12504 19.25 6.47505 17.14 5.52505 14.29H1.54504V17.38C3.51504 21.3 7.56504 24 12.255 24Z", fill: "#34A853" }), h("path", { key: '5851b3de9ee71263668f65e2e86f0dfab3039c83', d: "M5.52501 14.2901C5.27501 13.5701 5.145 12.8001 5.145 12.0001C5.145 11.2001 5.28501 10.4301 5.52501 9.71012V6.62012H1.545C0.725004 8.24012 0.255005 10.0601 0.255005 12.0001C0.255005 13.9401 0.725004 15.7601 1.545 17.3801L5.52501 14.2901Z", fill: "#FBBC05" }), h("path", { key: '2a79a335e1b8d03747b5f879a75deb5544e5cf63', d: "M12.255 4.75C14.025 4.75 15.605 5.36 16.855 6.55L20.275 3.13C18.205 1.19 15.495 0 12.255 0C7.56504 0 3.51504 2.7 1.54504 6.62L5.52505 9.71C6.47505 6.86 9.12504 4.75 12.255 4.75Z", fill: "#EA4335" })), h("defs", { key: 'f3b4d8d363cc9ac066b92de2354b9210d7190b46' }, h("clipPath", { key: '270b05e06d87d998c7525254f4f2ae3d5a0ab835', id: "clip0_959_12452" }, h("rect", { key: 'de0df984a8f12ccdd0c655968c4f8b2049996968', width: 24, height: 24, fill: "white" })))));
     }
 };
 GoogleLogoIcon.style = GoogleLogoIconStyle0;
@@ -28,7 +29,7 @@ const MicrosoftLogoIcon = class {
         this.height = '22';
     }
     render() {
-        return (h("svg", { key: '48516ac28c70d446ba44e3b65252920c4e8d3b06', width: this.width, height: this.height, viewBox: "0 0 22 22", fill: "none", xmlns: "http://www.w3.org/2000/svg" }, h("path", { key: '29c0f58e11eb99e946fd2dcb33ef603620305d9d', d: "M0.043457 0.043457H10.4782V10.4782H0.043457V0.043457Z", fill: "#F35325" }), h("path", { key: '6b5303ad19e48b6c0ad9842ee748dc7db17e2a68', d: "M11.5217 0.043457H21.9565V10.4782H11.5217V0.043457Z", fill: "#81BC06" }), h("path", { key: '278ce5362ac072c57040ad1bf944557f71809b5f', d: "M0.043457 11.5217H10.4782V21.9565H0.043457V11.5217Z", fill: "#05A6F0" }), h("path", { key: '9c2b9b9c87a902dd80cae38db0c46c94435903c2', d: "M11.5217 11.5217H21.9565V21.9565H11.5217V11.5217Z", fill: "#FFBA08" })));
+        return (h("svg", { key: 'de39bfb3167fbd60d21025e74c1bc19cdd7d4dc9', width: this.width, height: this.height, viewBox: "0 0 22 22", fill: "none", xmlns: "http://www.w3.org/2000/svg" }, h("path", { key: '0f80864e892ff36e6e76ef03f5f36d62007d99ee', d: "M0.043457 0.043457H10.4782V10.4782H0.043457V0.043457Z", fill: "#F35325" }), h("path", { key: 'ab0e85f803a3cf2e32055ebeff1b0705edebe048', d: "M11.5217 0.043457H21.9565V10.4782H11.5217V0.043457Z", fill: "#81BC06" }), h("path", { key: 'b6359dcb76ade260f2a9e9bdf1be21ba84b77b79', d: "M0.043457 11.5217H10.4782V21.9565H0.043457V11.5217Z", fill: "#05A6F0" }), h("path", { key: 'cf38a555c09aaef94a15fd26b0951e2642eaad6d', d: "M11.5217 11.5217H21.9565V21.9565H11.5217V11.5217Z", fill: "#FFBA08" })));
     }
 };
 MicrosoftLogoIcon.style = MicrosoftLogoIconStyle0;
@@ -48,19 +49,18 @@ function TabContents({ id, formState, activeTab, calendars }) {
                         h("nylas-location-component", { name: "location", eventLocation: location, exportparts: "nel, nel__location, nel__dropdown, nel__dropdown-button, nel__dropdown-content" }),
                         h("nylas-event-description", { name: "description", eventDescription: eventDescription, exportparts: "nedesc, nedesc__textarea" })))));
         case 'availability':
-            const openHours = formState.availability;
-            const timezone = openHours?.[0]?.timezone ?? Intl.DateTimeFormat().resolvedOptions().timeZone;
+            const openHours = formState.availability.openHours;
+            const timezone = formState.availability.timezone ? formState.availability.timezone : Intl.DateTimeFormat().resolvedOptions().timeZone;
             const organizer = formState.participants?.find(p => p.is_organizer);
             const organizerEmail = organizer?.email ?? 'primary';
             const selectedCalendars = formState.calendarIds.length > 0 ? formState.calendarIds : [organizerEmail];
             const bookingCalendar = formState.bookingCalendar == 'primary' ? organizerEmail : formState.bookingCalendar;
             return (h("div", { key: id },
                 h("nylas-booking-calendar-picker", { name: "booking-calendar", calendars: calendars ?? [], defaultBookingCalendar: bookingCalendar, exportparts: 'nbcp, nbcp__header, nbcp__input-label, nbcp__dropdown, nbcp__dropdown-button, nbcp__dropdown-content' }),
-                h("nylas-calendar-picker", { name: "calendars", calendars: calendars ?? [], defaultSelectedCalendars: selectedCalendars, organizerEmail: organizerEmail, exportparts: 'ncp ncp__header, ncp__dropdown, ncp__dropdown-button, ncp__dropdown-content' }),
+                h("nylas-calendar-picker", { name: "calendars", calendars: calendars ?? [], defaultSelectedCalendars: selectedCalendars, exportparts: 'ncp ncp__header, ncp__dropdown, ncp__dropdown-button, ncp__dropdown-content' }),
                 h("nylas-availability-picker", { name: "availability", openHours: openHours, defaultTimezone: timezone, exportparts: 'nap__header, nap__select-timezone, nap__select-timezone-button, nap__select-timezone-dropdown-content, nap__availability, nap__day, nap__time-ranges, nap__time-range, nap__add-time-range, nap__time-picker-container, nap__time-picker-input, nap__time-picker-times' })));
         case 'bookingOptions':
             return (h("div", { key: id },
-                id == 'new' && h("p", null, "Config"),
                 h("nylas-buffer-time", { name: "buffer-time", buffer: formState.buffer, exportparts: 'nbt, nbt__header, nbt__body, nbt__dropdown-before, nbt__dropdown-button-before, nbt__dropdown-content-before, nbt__dropdown-after, nbt__dropdown-button-after, nbt__dropdown-content-after, nbt__preview' }),
                 h("nylas-custom-booking-flow", { name: "booking-type", bookingType: formState.bookingType, exportparts: 'ncbf, ncbf__header, ncbf__dropdown, ncbf__dropdown-button, ncbf__dropdown-content' }),
                 h("nylas-event-limits", null,
@@ -70,7 +70,7 @@ function TabContents({ id, formState, activeTab, calendars }) {
     }
 }
 
-const nylasEditorTabsCss = ".sc-nylas-editor-tabs-h{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}.scheduler-editor.sc-nylas-editor-tabs{display:flex;flex-direction:column}.scheduler-editor.sc-nylas-editor-tabs .form-contents.sc-nylas-editor-tabs{display:grid;grid-template-columns:minmax(224px, 25%) 1fr}@media screen and (max-width: 768px){.scheduler-editor.sc-nylas-editor-tabs .form-contents.sc-nylas-editor-tabs{display:table-column-group}}.scheduler-editor.sc-nylas-editor-tabs .form-contents.sc-nylas-editor-tabs .tabs.sc-nylas-editor-tabs{display:flex;flex-direction:column;border-right:1px solid var(--nylas-base-200);background-color:var(--nylas-base-25)}.scheduler-editor.sc-nylas-editor-tabs .form-contents.sc-nylas-editor-tabs .tabs.sc-nylas-editor-tabs .tab.sc-nylas-editor-tabs{display:flex;align-items:center;gap:0.5rem;padding:0.5rem 1rem;color:var(--nylas-base-900);background:var(--nylas-base-0);border:none;height:56px;font-family:var(--nylas-font-family);font-size:16px;font-weight:500;line-height:24px;cursor:pointer}.scheduler-editor.sc-nylas-editor-tabs .form-contents.sc-nylas-editor-tabs .tabs.sc-nylas-editor-tabs .tab.sc-nylas-editor-tabs:not(:first-of-type){margin-top:0.25rem}.scheduler-editor.sc-nylas-editor-tabs .form-contents.sc-nylas-editor-tabs .tabs.sc-nylas-editor-tabs .tab.active.sc-nylas-editor-tabs{font-weight:600;background:var(--nylas-base-0);color:var(--nylas-primary);border-left:4px solid var(--nylas-primary);box-shadow:0px 1px 2px 0px rgba(0, 0, 0, 0.0588235294);box-shadow:0px 1px 3px 0px rgba(0, 0, 0, 0.1019607843)}.scheduler-editor.sc-nylas-editor-tabs .form-contents.sc-nylas-editor-tabs .tab-content.sc-nylas-editor-tabs{max-width:692px}.scheduler-editor.sc-nylas-editor-tabs .form-contents.sc-nylas-editor-tabs .tab-content.sc-nylas-editor-tabs nylas-event-info.sc-nylas-editor-tabs div[slot=inputs].sc-nylas-editor-tabs,.scheduler-editor.sc-nylas-editor-tabs .form-contents.sc-nylas-editor-tabs .tab-content.sc-nylas-editor-tabs nylas-event-limits.sc-nylas-editor-tabs div[slot=inputs].sc-nylas-editor-tabs{display:flex;flex-direction:column;gap:1rem}.footer.sc-nylas-editor-tabs{display:flex;justify-content:space-between;align-items:center;gap:1rem;height:80px;padding:0 1rem;border-top:1px solid var(--nylas-base-200)}.footer.sc-nylas-editor-tabs .buttons.sc-nylas-editor-tabs{display:flex;justify-content:flex-end;align-items:center;justify-self:flex-end;gap:1rem}.footer.sc-nylas-editor-tabs .buttons.sc-nylas-editor-tabs .unsaved-changes.sc-nylas-editor-tabs{color:var(--nylas-base-600)}.footer.sc-nylas-editor-tabs .buttons.sc-nylas-editor-tabs .saved-changes.sc-nylas-editor-tabs{color:var(--nylas-success)}.footer.sc-nylas-editor-tabs .buttons.sc-nylas-editor-tabs button.sc-nylas-editor-tabs{background:var(--nylas-primary);color:var(--nylas-base-0);height:48px;border:none;border-radius:var(--nylas-border-radius-2x);font-size:1rem;line-height:24px;padding:0 1rem;cursor:pointer;width:148px}.footer.sc-nylas-editor-tabs .buttons.sc-nylas-editor-tabs button.sc-nylas-editor-tabs:hover{background:var(--nylas-base-600)}.footer.sc-nylas-editor-tabs .buttons.sc-nylas-editor-tabs button.sc-nylas-editor-tabs:active{background:var(--nylas-base-800)}.footer.sc-nylas-editor-tabs .buttons.sc-nylas-editor-tabs button.sc-nylas-editor-tabs:disabled{background:var(--nylas-base-300);cursor:not-allowed}.footer.sc-nylas-editor-tabs .buttons.sc-nylas-editor-tabs button.sc-nylas-editor-tabs span.sc-nylas-editor-tabs{display:flex;align-items:center;justify-content:center;gap:0.5rem}";
+const nylasEditorTabsCss = ".sc-nylas-editor-tabs-h{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}.scheduler-editor.sc-nylas-editor-tabs{display:flex;flex-direction:column}.scheduler-editor.sc-nylas-editor-tabs .form-contents.sc-nylas-editor-tabs{display:grid;grid-template-columns:minmax(224px, 25%) 1fr}@media screen and (max-width: 768px){.scheduler-editor.sc-nylas-editor-tabs .form-contents.sc-nylas-editor-tabs{display:table-column-group}}.scheduler-editor.sc-nylas-editor-tabs .form-contents.sc-nylas-editor-tabs .tabs.sc-nylas-editor-tabs{display:flex;flex-direction:column;border-right:1px solid var(--nylas-base-200);background-color:var(--nylas-base-25)}.scheduler-editor.sc-nylas-editor-tabs .form-contents.sc-nylas-editor-tabs .tabs.sc-nylas-editor-tabs .tab.sc-nylas-editor-tabs{display:flex;align-items:center;gap:0.5rem;padding:0.5rem 1rem;color:var(--nylas-base-900);background:var(--nylas-base-0);border:none;height:56px;font-family:var(--nylas-font-family);font-size:16px;font-weight:500;line-height:24px;cursor:pointer}.scheduler-editor.sc-nylas-editor-tabs .form-contents.sc-nylas-editor-tabs .tabs.sc-nylas-editor-tabs .tab.sc-nylas-editor-tabs:not(:first-of-type){margin-top:0.25rem}.scheduler-editor.sc-nylas-editor-tabs .form-contents.sc-nylas-editor-tabs .tabs.sc-nylas-editor-tabs .tab.active.sc-nylas-editor-tabs{font-weight:600;background:var(--nylas-base-0);color:var(--nylas-primary);border-left:4px solid var(--nylas-primary);box-shadow:0px 1px 2px 0px rgba(0, 0, 0, 0.0588235294);box-shadow:0px 1px 3px 0px rgba(0, 0, 0, 0.1019607843)}.scheduler-editor.sc-nylas-editor-tabs .form-contents.sc-nylas-editor-tabs .tab-content.sc-nylas-editor-tabs{max-width:692px}.scheduler-editor.sc-nylas-editor-tabs .form-contents.sc-nylas-editor-tabs .tab-content.sc-nylas-editor-tabs nylas-event-info.sc-nylas-editor-tabs div[slot=inputs].sc-nylas-editor-tabs,.scheduler-editor.sc-nylas-editor-tabs .form-contents.sc-nylas-editor-tabs .tab-content.sc-nylas-editor-tabs nylas-event-limits.sc-nylas-editor-tabs div[slot=inputs].sc-nylas-editor-tabs{display:flex;flex-direction:column;gap:1rem}.footer.sc-nylas-editor-tabs{display:flex;justify-content:space-between;align-items:center;gap:1rem;min-height:80px;padding:0 1rem;border-top:1px solid var(--nylas-base-200)}@media screen and (max-width: 768px){.footer.sc-nylas-editor-tabs{flex-direction:column;height:auto}}@media screen and (max-width: 768px){.footer.sc-nylas-editor-tabs .preview.sc-nylas-editor-tabs{margin-top:1rem;width:100%}}.footer.sc-nylas-editor-tabs .buttons.sc-nylas-editor-tabs{display:flex;justify-content:flex-end;align-items:center;justify-self:flex-end;gap:1rem}@media screen and (max-width: 768px){.footer.sc-nylas-editor-tabs .buttons.sc-nylas-editor-tabs{flex-direction:column-reverse;width:100%}}.footer.sc-nylas-editor-tabs .buttons.sc-nylas-editor-tabs p.sc-nylas-editor-tabs{max-width:524px}.footer.sc-nylas-editor-tabs .buttons.sc-nylas-editor-tabs p.unsaved-changes.sc-nylas-editor-tabs{color:var(--nylas-base-600)}.footer.sc-nylas-editor-tabs .buttons.sc-nylas-editor-tabs p.saved-changes.sc-nylas-editor-tabs{color:var(--nylas-success)}.footer.sc-nylas-editor-tabs .buttons.sc-nylas-editor-tabs p.error.sc-nylas-editor-tabs{color:var(--nylas-error)}.footer.sc-nylas-editor-tabs .buttons.sc-nylas-editor-tabs p.error-full-width.sc-nylas-editor-tabs{max-width:660px}@media screen and (max-width: 768px){.footer.sc-nylas-editor-tabs .buttons.sc-nylas-editor-tabs button-component.sc-nylas-editor-tabs{width:100%}}.footer.sc-nylas-editor-tabs .buttons.sc-nylas-editor-tabs button.sc-nylas-editor-tabs{background:var(--nylas-primary);color:var(--nylas-base-0);height:48px;border:none;border-radius:var(--nylas-border-radius-2x);font-size:1rem;line-height:24px;padding:0 1rem;cursor:pointer;width:148px}.footer.sc-nylas-editor-tabs .buttons.sc-nylas-editor-tabs button.sc-nylas-editor-tabs:hover{background:var(--nylas-base-600)}.footer.sc-nylas-editor-tabs .buttons.sc-nylas-editor-tabs button.sc-nylas-editor-tabs:active{background:var(--nylas-base-800)}.footer.sc-nylas-editor-tabs .buttons.sc-nylas-editor-tabs button.sc-nylas-editor-tabs:disabled{background:var(--nylas-base-300);cursor:not-allowed}.footer.sc-nylas-editor-tabs .buttons.sc-nylas-editor-tabs button.sc-nylas-editor-tabs span.sc-nylas-editor-tabs{display:flex;align-items:center;justify-content:center;gap:0.5rem}";
 const NylasEditorTabsStyle0 = nylasEditorTabsCss;
 
 var __decorate$1 = (undefined && undefined.__decorate) || function (decorators, target, key, desc) {
@@ -92,24 +92,33 @@ const NylasEditorTabs = class {
         registerInstance(this, hostRef);
         this.schedulerConfigChanged = createEvent(this, "schedulerConfigChanged", 7);
         this.cancelButtonClick = createEvent(this, "cancelButtonClick", 7);
+        this.formSubmitted = createEvent(this, "formSubmitted", 7);
         this.previewButtonClicked = createEvent(this, "previewButtonClicked", 7);
+        this.setError = (error) => {
+            this.error = error.message;
+        };
         this.formSubmissionHandler = async (event) => {
             event.preventDefault();
+            this.formSubmitted.emit();
+            const valid = this.formRef.checkValidity();
+            if (!valid) {
+                return;
+            }
             this.isLoading = true;
             this.hasUnsavedChanges = false;
-            this.updateFormState();
-            const { title, description, duration, availability, calendarIds, bookingCalendar, location, bookingType, buffer, availableDaysInFuture, minCancellationNotice } = this.formState;
-            const organizer = this.config?.participants?.find(p => p.is_organizer);
+            const formState = this.updateFormState();
+            const { title, description, duration, availability, calendarIds, bookingCalendar, location, bookingType, buffer, availableDaysInFuture, minCancellationNotice } = formState;
+            const organizer = this.selectedConfiguration?.participants?.find(p => p.is_organizer);
             const configObject = {
-                ...(this.config?.id && { id: this.config.id }),
-                version: this.config?.version ?? '1.0.0',
+                ...this.selectedConfiguration,
+                version: this.selectedConfiguration?.version ?? '1.0.0',
                 availability: {
                     duration_minutes: duration ? parseInt(duration) : 0,
                     availability_rules: {
-                        availability_method: this.config?.availability?.availability_rules?.availability_method ?? 'collective',
+                        availability_method: this.selectedConfiguration?.availability?.availability_rules?.availability_method ?? 'collective',
                         buffer: buffer || { before: 0, after: 0 },
-                        default_open_hours: this.config?.availability?.availability_rules?.default_open_hours ?? [],
-                        round_robin_group_id: this.config?.availability?.availability_rules?.round_robin_group_id ?? '',
+                        default_open_hours: this.selectedConfiguration?.availability?.availability_rules?.default_open_hours ?? DEFAULT_OPEN_HOURS,
+                        round_robin_group_id: this.selectedConfiguration?.availability?.availability_rules?.round_robin_group_id ?? '',
                     },
                 },
                 participants: [
@@ -119,7 +128,7 @@ const NylasEditorTabs = class {
                         is_organizer: true,
                         availability: {
                             calendar_ids: calendarIds?.length ? calendarIds : ['primary'],
-                            open_hours: availability ?? [],
+                            open_hours: availability?.openHours ?? [],
                         },
                         booking: {
                             calendar_id: bookingCalendar && bookingCalendar !== '' ? bookingCalendar : 'primary',
@@ -131,6 +140,7 @@ const NylasEditorTabs = class {
                     description: description?.toString() ?? '',
                     location: location?.toString() ?? '',
                     booking_type: bookingType?.toString() ?? 'booking',
+                    timezone: availability?.timezone ?? Intl.DateTimeFormat().resolvedOptions().timeZone,
                 },
                 scheduler: {
                     available_days_in_future: availableDaysInFuture ?? 30,
@@ -144,21 +154,23 @@ const NylasEditorTabs = class {
                     this.changesSaved = false;
                 }, 5000);
             };
-            this.schedulerConfigChanged.emit({ config: configObject, resetLoadingState, action: this.action });
+            this.schedulerConfigChanged.emit({ config: configObject, resetLoadingState, setError: this.setError, action: this.action });
         };
         this.calendars = undefined;
-        this.config = undefined;
+        this.selectedConfiguration = undefined;
         this.currentUser = undefined;
         this.schedulerPreviewLink = '';
         this.action = 'create';
+        this.mode = 'app';
         this.activeTab = 'eventInfo';
         this.isLoading = false;
         this.hasUnsavedChanges = false;
         this.changesSaved = false;
         this.formState = {};
+        this.error = '';
     }
     configChangedHandler(newConfig) {
-        debug('[nylas-editor-tabs]', 'configChangedHandler', newConfig, this.config);
+        debug('[nylas-editor-tabs]', 'configChangedHandler', newConfig, this.selectedConfiguration);
         this.formState = {
             ...this.getFormStateFromConfig(newConfig),
         };
@@ -174,7 +186,7 @@ const NylasEditorTabs = class {
     }
     componentWillLoad() {
         debug('[nylas-editor-tabs]', 'componentWillLoad');
-        this.formState = this.getFormStateFromConfig(this.config);
+        this.formState = this.getFormStateFromConfig(this.selectedConfiguration);
     }
     componentDidLoad() {
         debug('[nylas-editor-tabs]', 'componentDidLoad');
@@ -184,8 +196,10 @@ const NylasEditorTabs = class {
     }
     handleValueChanged(event) {
         debug('[nylas-editor-tabs]', 'handleValueChanged', event);
-        this.formState = { ...this.formState, [event.detail.name]: event.detail.value };
+        const { name, value } = event.detail;
+        this.formState = { ...this.formState, [name]: value };
         this.hasUnsavedChanges = true;
+        this.error = '';
     }
     getFormStateFromConfig(config) {
         const organizerParticipant = config?.participants?.find(p => p.is_organizer);
@@ -193,15 +207,18 @@ const NylasEditorTabs = class {
             title: config?.event_booking?.title ?? '',
             description: config?.event_booking?.description ?? '',
             duration: config?.availability?.duration_minutes?.toString() ?? '10',
-            availability: organizerParticipant?.availability?.open_hours ?? undefined,
+            availability: {
+                timezone: config?.event_booking?.timezone ?? Intl.DateTimeFormat().resolvedOptions().timeZone,
+                open_hours: organizerParticipant?.availability?.open_hours ?? undefined,
+            },
             calendarIds: organizerParticipant?.availability?.calendar_ids ?? [],
             participants: config?.participants ?? [],
             bookingCalendar: organizerParticipant?.booking?.calendar_id ?? organizerParticipant?.email ?? '',
-            location: this.config?.event_booking?.location ?? '',
-            bookingType: this.config?.event_booking?.booking_type ?? 'booking',
-            buffer: this.config?.availability?.availability_rules?.buffer ?? { before: 0, after: 0 },
-            availableDaysInFuture: this.config?.scheduler?.available_days_in_future ?? 30,
-            minCancellationNotice: this.config?.scheduler?.min_cancellation_notice ?? 0,
+            location: this.selectedConfiguration?.event_booking?.location ?? '',
+            bookingType: this.selectedConfiguration?.event_booking?.booking_type ?? 'booking',
+            buffer: this.selectedConfiguration?.availability?.availability_rules?.buffer ?? { before: 0, after: 0 },
+            availableDaysInFuture: this.selectedConfiguration?.scheduler?.available_days_in_future ?? 30,
+            minCancellationNotice: this.selectedConfiguration?.scheduler?.min_cancellation_notice ?? 0,
         };
     }
     updateFormState() {
@@ -247,6 +264,7 @@ const NylasEditorTabs = class {
             }
         });
         this.formState = { ...this.formState };
+        return this.formState;
     }
     setActiveTab(e, tabName) {
         e.preventDefault();
@@ -255,23 +273,26 @@ const NylasEditorTabs = class {
     }
     render() {
         debug('[nylas-editor-tabs]', 'render', this.formState);
-        return (h(Host, { key: '5a1e8ee246d47626dce5515c3ec4df3e6ae893a4' }, h("form", { key: 'f49d1fa60f2724c5cae8c1328dfee945ae24f1e2', onSubmit: this.formSubmissionHandler, class: "scheduler-editor", ref: el => (this.formRef = el) }, h("div", { key: 'f0b678836e12c3878128e4b810e5541f00ddee29', class: "form-contents" }, h("div", { key: '910dc155a6b7b01e300084fe405da0d0b0801847', class: "tabs" }, h("button", { key: '80ca54ac98ae0d3b2298ae62253ffcb9d3ae539d', class: { tab: true, active: this.activeTab == 'eventInfo' }, onClick: e => this.setActiveTab(e, 'eventInfo') }, h("calendar-info-icon", { key: '842e45f308921afa7948f8408b84f95d7b802850', width: "16", height: "16" }), "Event Info"), h("button", { key: '7b79207240cbae5dcd554d448f68dc544f2e6c80', class: { tab: true, active: this.activeTab == 'availability' }, onClick: e => this.setActiveTab(e, 'availability') }, h("calendar-patterns-icon", { key: '47b3d8cf7ee50eac7d377ab3faf35c27f1215e96', width: "16", height: "16" }), "Availability"), h("button", { key: 'ffb175caa6ccc4ba377ee4947759d0561ebb089b', class: { tab: true, active: this.activeTab == 'bookingOptions' }, onClick: e => this.setActiveTab(e, 'bookingOptions') }, h("flow-icon", { key: 'fc3bec08bd5080e7b2ec7816bb3c021876c20d7c', width: "16", height: "16" }), "Booking Options")), h("div", { key: '80802e1388eb767bcea718907e75d5b4a2de3701', class: "tab-content" }, h(TabContents, { key: '5c5618341227447d2a41061f415e54d83efc354a', formState: this.formState, activeTab: this.activeTab, calendars: this.calendars, id: this.config?.id ?? 'new' }))), h("div", { key: 'd315bad7ea2efe6699557a5e07b55053926a7517', class: "footer" }, h("div", { key: '4c92a480ee6d2f04d9fa36f3e870d414835406e1', class: "preview" }, this.schedulerPreviewLink !== '' && this.action === 'edit' && (h("button-component", { type: "button", disabled: this.isLoading, clickHandler: event => {
+        return (h(Host, { key: 'c1e6e9d2cfe242e407a909281063767a0985245e' }, h("form", { key: '4baaac0129e8a357b78980636bd32b3818ec0820', onSubmit: this.formSubmissionHandler, class: "scheduler-editor", ref: el => (this.formRef = el), noValidate: true }, this.mode === 'app' ? (h("div", { class: "form-contents" }, h("div", { class: "tabs" }, h("button", { class: { tab: true, active: this.activeTab == 'eventInfo' }, onClick: e => this.setActiveTab(e, 'eventInfo') }, h("calendar-info-icon", { width: "16", height: "16" }), "Event Info"), h("button", { class: { tab: true, active: this.activeTab == 'availability' }, onClick: e => this.setActiveTab(e, 'availability') }, h("calendar-patterns-icon", { width: "16", height: "16" }), "Availability"), h("button", { class: { tab: true, active: this.activeTab == 'bookingOptions' }, onClick: e => this.setActiveTab(e, 'bookingOptions') }, h("flow-icon", { width: "16", height: "16" }), "Booking Options")), h("div", { class: "tab-content" }, h(TabContents, { formState: this.formState, activeTab: this.activeTab, calendars: this.calendars, id: this.selectedConfiguration?.id ?? 'new' })))) : (h("slot", null)), h("div", { key: '38bdcdd7283d98ea54c7594a52cc16b85b3b776a', class: "footer" }, h("div", { key: '5543e3f7eb2fa9f2f3bbe6053fde7d0ea13c3bc0', class: "preview" }, this.schedulerPreviewLink !== '' && this.action === 'edit' && (h("button-component", { type: "button", disabled: this.isLoading, clickHandler: event => {
                 event.preventDefault();
                 const previewEvent = this.previewButtonClicked.emit(this.host);
                 if (!previewEvent.defaultPrevented) {
-                    window.open(parsePreviewLink(this.schedulerPreviewLink, this.config), '_blank');
+                    window.open(parsePreviewLink(this.schedulerPreviewLink, this.selectedConfiguration), '_blank');
                 }
-            }, variant: 'basic' }, "Preview"))), h("div", { key: '22fdd2183dcc2c299d2fdacf0db8922a95a5692e', class: "buttons" }, h("p", { key: '63ea7b4d8362f409caec467a7bce22142ccc1b20', class: {
+            }, variant: 'basic' }, "Preview"))), h("div", { key: '62470cdbc7c4670e6ff03e9979ca803f81482b15', class: "buttons" }, h("p", { key: '5ecdfa1082650aab2f8fef8ed7beeb11fedb381c', class: {
                 'unsaved-changes': this.hasUnsavedChanges && !this.changesSaved,
                 'saved-changes': this.changesSaved,
-            } }, this.hasUnsavedChanges && !this.changesSaved ? 'Unsaved changes' : this.changesSaved ? 'Changes saved!' : ''), h("button-component", { key: '6ceded872ee5510234ff79bff3f0173a72314714', type: "button", disabled: this.isLoading, clickHandler: event => {
+                'error': this.error !== '',
+                'error-full-width': this.error !== '' && this.action === 'create',
+            } }, this.error !== '' ? this.error : '', this.error == '' && this.hasUnsavedChanges && !this.changesSaved ? 'Unsaved changes' : this.error == '' && this.changesSaved ? 'Changes saved!' : ''), h("button-component", { key: '1bb3af5cc04c49e311267fb43ac326267acdaa1d', type: "button", disabled: this.isLoading, clickHandler: event => {
                 event.preventDefault();
                 this.cancelButtonClick.emit();
-            }, variant: 'basic' }, "Cancel"), h("button-component", { key: '4f33ad6071f503837395d900b67fafc8605d8043', type: "submit", disabled: this.isLoading }, this.isLoading ? (h("span", null, "Saving", h("loading-icon", null), ' ')) : this.action == 'create' ? ('Create') : ('Save changes')))))));
+                this.error = '';
+            }, variant: 'basic' }, "Cancel"), h("button-component", { key: '28c9725c69104d1849b2ab3068b61a269370f016', type: "submit", disabled: this.isLoading }, this.isLoading ? (h("span", null, "Saving", h("loading-icon", null), ' ')) : this.action == 'create' ? ('Create') : ('Save changes')))))));
     }
     get host() { return getElement(this); }
     static get watchers() { return {
-        "config": ["configChangedHandler"]
+        "selectedConfiguration": ["configChangedHandler"]
     }; }
 };
 __decorate$1([
@@ -279,20 +300,28 @@ __decorate$1([
         name: 'nylas-editor-tabs',
         stateToProps: new Map([
             ['schedulerConfig.calendars', 'calendars'],
-            ['schedulerConfig.config', 'config'],
+            ['schedulerConfig.selectedConfiguration', 'selectedConfiguration'],
             ['schedulerConfig.currentUser', 'currentUser'],
         ]),
         eventToProps: {
             schedulerConfigChanged: async (event, nylasSchedulerConfigConnector) => {
-                const { resetLoadingState, action, config } = event.detail;
-                if (resetLoadingState) {
-                    resetLoadingState(event);
-                }
+                const { resetLoadingState, setError, action, config } = event.detail;
+                const checkForErrors = (response) => {
+                    const [data, error] = response;
+                    if (!data && error && setError) {
+                        setError(error);
+                    }
+                    if (resetLoadingState) {
+                        resetLoadingState(event);
+                    }
+                };
                 if (action === 'edit') {
-                    await nylasSchedulerConfigConnector.schedulerConfig.updateConfiguration(config);
+                    const response = await nylasSchedulerConfigConnector.schedulerConfig.updateConfiguration(config);
+                    checkForErrors(response);
                 }
                 else {
-                    await nylasSchedulerConfigConnector.schedulerConfig.createConfiguration(config);
+                    const response = await nylasSchedulerConfigConnector.schedulerConfig.createConfiguration(config);
+                    checkForErrors(response);
                 }
             },
             cancelButtonClick: async (_, nylasSchedulerConfigConnector) => {
@@ -308,7 +337,7 @@ __decorate$1([
 ], NylasEditorTabs.prototype, "render", null);
 NylasEditorTabs.style = NylasEditorTabsStyle0;
 
-const nylasListConfigurationsCss = ":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}.header{display:flex;align-items:center;justify-content:space-between;margin-bottom:1rem}.header h2{margin:0;font-size:1.25rem;color:var(--nylas-base-900)}.header p{margin:0;font-size:1rem;color:var(--nylas-base-700)}.header .actions{justify-self:end}.configurations{border:1px solid var(--nylas-base-200);border-radius:var(--nylas-border-radius-2x)}.configurations table{width:100%;border-spacing:0;border-collapse:collapse}.configurations table tr{border-bottom:1px solid var(--nylas-base-200)}.configurations table tr:last-of-type{border-bottom:0}.configurations table tr.no-configurations td>div{display:flex;height:100%;justify-content:center;align-items:center;flex-direction:column;padding:var(--nylas-border-radius-3x)}.configurations table tr.no-configurations td>div h3{margin:0 0 1rem 0;color:var(--nylas-base-700)}.configurations table tr.no-configurations td>div p{margin:0 0 1rem 0;color:var(--nylas-base-600)}.configurations table tr.no-configurations td>div calendar-icon{margin-bottom:1rem;color:var(--nylas-base-200)}.configurations table th,.configurations table td{text-align:left;padding:1rem}.configurations table .actions{text-align:right}.configurations table .actions{display:flex;justify-content:flex-end;gap:1rem}.configurations table .title{display:flex;flex-direction:column}.configurations table .title .config-event-title{font-weight:600}.configurations table .title .config-event-description{font-size:0.75rem}";
+const nylasListConfigurationsCss = ":host{display:grid;grid-auto-flow:row;width:100%;font-family:inherit;font-optical-sizing:auto;--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}.header{display:flex;align-items:center;justify-content:space-between;margin-bottom:2rem;gap:1rem}@media screen and (max-width: 768px){.header{flex-direction:column}}.header h2{margin:0;font-size:1.25rem;color:var(--nylas-base-900);font-weight:600}.header p{margin:0;font-size:1rem;color:var(--nylas-base-700)}.header .actions{justify-self:end}@media screen and (max-width: 768px){.header .actions{width:100%}}.configurations{border:1px solid var(--nylas-base-200);border-radius:var(--nylas-border-radius-2x);overflow-x:auto}.configurations table{width:100%;border-spacing:0;border-collapse:collapse;font-family:inherit}.configurations table tr{color:var(--nylas-base-800);border-bottom:1px solid var(--nylas-base-200);font-family:inherit}.configurations table tr:last-of-type{border-bottom:0}.configurations table tr.hide{display:none}.configurations table th{font-weight:600;text-transform:uppercase}.configurations table tr.no-configurations td>div{display:flex;height:100%;justify-content:center;align-items:center;flex-direction:column;padding:var(--nylas-border-radius-3x)}.configurations table tr.no-configurations td>div h3{margin:0 0 1rem 0;color:var(--nylas-base-700)}.configurations table tr.no-configurations td>div p{margin:0 0 1rem 0;color:var(--nylas-base-600)}.configurations table tr.no-configurations td>div calendar-icon{margin-bottom:1rem;color:var(--nylas-base-200)}.configurations table th,.configurations table td{text-align:left;padding:1rem;font-family:inherit}.configurations table .actions{text-align:right}.configurations table .actions{display:flex;justify-content:flex-end;gap:1rem}.configurations table .title{display:flex;flex-direction:column}.configurations table .title .config-event-title{font-weight:600}.configurations table .title .config-event-description{font-size:0.75rem}.error-container{margin-top:1.5rem}.error-container .error{color:var(--nylas-error);padding:0.5rem 0;margin:1rem 0 0}";
 const NylasListConfigurationsStyle0 = nylasListConfigurationsCss;
 
 var __decorate = (undefined && undefined.__decorate) || function (decorators, target, key, desc) {
@@ -335,6 +364,7 @@ const NylasListConfigurations = class {
         this.configurations = [];
         this.schedulerPreviewLink = '';
         this.state = 'loading';
+        this.error = '';
     }
     connectedCallback() {
         debug('[nylas-list-configurations]', 'connectedCallback');
@@ -358,10 +388,15 @@ const NylasListConfigurations = class {
     async setState(state) {
         this.state = state;
     }
+    async setError(error) {
+        this.error = error;
+    }
     render() {
-        return (h(Host, { key: 'c6579bd33e43be81caa460d87e99ed53f8123c6a' }, h("div", { key: 'd3ff4fc25e34a2dab3820b774f52a845c37bb282', class: "nylas-list-configurations" }, h("div", { key: 'fc6ff138be7cf63196217b7ef7524ae8f0a82c5c', class: "header" }, h("div", { key: 'a518d44c645bfc5d5e8449119ebc4be7c475a5f3', class: "description" }, h("h2", { key: 'a9d999a93c26ee3d9040dcae09306ecb7da43fb5' }, "All scheduling configurations"), h("p", { key: '6361799617ce1ccf7469cce6a0064d94d97701b0' }, "Create, edit and manage all your scheduling configurations.")), this.configurations && this.configurations.length > 0 && (h("div", { class: "actions" }, h("button-component", { clickHandler: () => {
+        return (h(Host, null, h("div", { class: "header" }, h("div", { class: "description" }, h("h2", null, "All scheduling pages"), h("p", null, "Create, edit and manage all your scheduling pages.")), this.configurations && this.configurations.length > 0 && (h("div", { class: "actions" }, h("button-component", { clickHandler: () => {
                 this.createButtonClick.emit(this.host);
-            } }, "Create new")))), h("div", { key: '3f26491b35427c4364bcc1c5e1cbffdfabd52d37', class: "configurations" }, h("table", { key: 'ca8bf13b620b92cd4892b8dbf218988915ce4fc0' }, h("tr", { key: '09526ab48bbc988b0595f8060a184c340f1d43cc' }, h("th", { key: '7367e03d461f854eaf84e166d65471d356f44ee5' }, "Configuration event title"), h("th", { key: 'f983dcae11fdd33e21f0f202eb9b43a7d409b714' }, "Duration"), h("th", { key: '828c60e134498a1db8bd31ce0311bb8a771cb435', class: "actions" }, "Actions")), this.state === 'loading' && (h("tr", { class: "no-configurations" }, h("td", { colSpan: 3 }, h("div", null, h("h3", null, "Loading..."), h("p", null, "Please wait while we fetch your configurations"))))), this.state !== 'loading' && (!this.configurations || this.configurations.length === 0) && (h("tr", { class: "no-configurations" }, h("td", { colSpan: 3 }, h("div", null, h("calendar-icon", { width: "48", height: "48" }), h("h3", null, "No configurations found"), h("p", null, "Get started with creating your first scheduling page"), h("button-component", { clickHandler: () => {
+            } }, "Create new")))), h("div", { class: "configurations" }, h("table", null, h("tr", { class: {
+                hide: this.state === 'loading' || (this.configurations && this.configurations.length === 0),
+            } }, h("th", null, "Scheduling page event title"), h("th", null, "Duration"), h("th", { class: "actions" }, "Actions")), this.state === 'loading' && (h("tr", { class: "no-configurations" }, h("td", { colSpan: 3 }, h("div", null, h("h3", null, "Loading..."), h("p", null, "Please wait while we fetch the scheduling pages"))))), this.state !== 'loading' && (!this.configurations || this.configurations.length === 0) && (h("tr", { class: "no-configurations" }, h("td", { colSpan: 3 }, h("div", null, h("calendar-icon", { width: "48", height: "48" }), h("h3", null, "No scheduling pages found"), h("p", null, "Get started with creating your first scheduling page"), h("button-component", { clickHandler: () => {
                 this.createButtonClick.emit(this.host);
             } }, "Create new"))))), this.state !== 'loading' &&
             this.configurations.map(config => (h("tr", { key: config.id }, h("td", null, h("div", { class: "title" }, h("span", { class: 'config-event-title' }, config.event_booking.title), h("span", { class: 'config-event-description' }, config.event_booking.description))), h("td", null, h("div", null, config.availability.duration_minutes, " mins")), h("td", null, h("div", { class: "actions" }, h("button-component", { variant: 'basic', clickHandler: event => {
@@ -373,7 +408,7 @@ const NylasListConfigurations = class {
                 } }, "Edit"), h("button-component", { variant: 'basic', clickHandler: event => {
                     event.preventDefault();
                     this.deleteButtonClick.emit({ host: this.host, configuration: config });
-                } }, "Delete")))))))))));
+                } }, "Delete")))))))), h("div", { class: "error-container" }, h("p", { class: 'error' }, this.state === 'error' && this.error))));
     }
     get host() { return getElement(this); }
 };
@@ -386,20 +421,29 @@ __decorate([
             initListConfigurations: async (event, connector) => {
                 const host = event.detail;
                 await host.setState('loading');
-                await connector.schedulerConfig.getConfigurations();
+                const [data, error] = await connector.schedulerConfig.getConfigurations();
+                if (!data && error && error.message) {
+                    await host.setState('error');
+                    await host.setError(error.message);
+                    return;
+                }
                 await host.setState('loaded');
             },
             createButtonClick: async (_, connector) => {
-                connector.schedulerConfigStore.state.config = {};
+                connector.schedulerConfigStore.resetSelectedConfiguration();
                 connector.schedulerConfigStore.state.action = 'create';
             },
             deleteButtonClick: async (event, connector) => {
-                const { configuration } = event.detail;
-                await connector.schedulerConfig.deleteConfiguration(configuration.id);
+                const { host, configuration } = event.detail;
+                const [data, error] = await connector.schedulerConfig.deleteConfiguration(configuration.id);
+                if (!data && error && error.message) {
+                    await host.setState('error');
+                    await host.setError(error.message);
+                }
             },
             editButtonClick: async (event, connector) => {
                 const { configuration } = event.detail;
-                connector.schedulerConfigStore.state.config = configuration;
+                connector.schedulerConfigStore.state.selectedConfiguration = configuration;
                 connector.schedulerConfigStore.state.action = 'edit';
             },
         },