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/collection/components/design-system/toggle-switch/toggle-switch.js CHANGED Viewed

@@ -18,7 +18,7 @@ export class ToggleSwitchComponent {
         });
     }
     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" })));
+        return (h("label", { key: '330614e95b8c2edb0ec307d146126db6f5b59c86', class: "switch", part: "ts_label" }, h("input", { key: '0dae0bc7ea4691985a26704fcb71679a8dc3e365', type: "checkbox", part: "ts_input", name: this.name, checked: this.isChecked, onChange: () => this.toggleCheck() }), h("div", { key: '2c89de3075f6e459d271acd93fb82367b1bbd5a4', class: "slider round", part: "ts_slider" })));
     }
     static get is() { return "toggle-switch"; }
     static get encapsulation() { return "shadow"; }
@@ -46,7 +46,7 @@ export class ToggleSwitchComponent {
                 "optional": false,
                 "docs": {
                     "tags": [],
-                    "text": ""
+                    "text": "The name of the toggle switch. This is used to identify the toggle switch when submitting a form."
                 },
                 "attribute": "name",
                 "reflect": false,
@@ -64,7 +64,7 @@ export class ToggleSwitchComponent {
                 "optional": false,
                 "docs": {
                     "tags": [],
-                    "text": ""
+                    "text": "The default value of the toggle switch. This is the value that is displayed when the toggle switch is rendered."
                 },
                 "attribute": "checked",
                 "reflect": false,
@@ -82,7 +82,7 @@ export class ToggleSwitchComponent {
                 "optional": false,
                 "docs": {
                     "tags": [],
-                    "text": ""
+                    "text": "The label of the toggle switch. This is displayed next to the toggle switch."
                 },
                 "attribute": "label",
                 "reflect": false,
@@ -104,7 +104,7 @@ export class ToggleSwitchComponent {
                 "composed": true,
                 "docs": {
                     "tags": [],
-                    "text": ""
+                    "text": "This event is fired when the toggle switch is toggled."
                 },
                 "complexType": {
                     "original": "{\n    checked: boolean;\n    name: string;\n    label: string;\n  }",

package/dist/collection/components/design-system/toggle-switch/toggle-switch.js.map CHANGED Viewed

	@@ -1 +1 @@
1	- {"version":3,"file":"toggle-switch.js","sourceRoot":"","sources":["../../../../src/components/design-system/toggle-switch/toggle-switch.tsx"],"names":[],"mappings":"AAAA,OAAO,EAAE,SAAS,EAAE,CAAC,EAAE,IAAI,EAAE,KAAK,EAAE,KAAK,EAAgB,MAAM,eAAe,CAAC;~~AAc~~/E,MAAM,OAAO,qBAAqB;;~~oBACT~~,eAAe;~~uBACX~~,KAAK;~~qBACR~~,EAAE;~~yBAEI~~,IAAI,CAAC,OAAO;;~~IAQ1C~~,iBAAiB;QACf,IAAI,CAAC,SAAS,GAAG,IAAI,CAAC,OAAO,CAAC;IAChC,CAAC;IAED,WAAW;QACT,IAAI,CAAC,SAAS,GAAG,CAAC,IAAI,CAAC,SAAS,CAAC;QACjC,IAAI,CAAC,sBAAsB,CAAC,IAAI,CAAC;YAC/B,OAAO,EAAE,IAAI,CAAC,SAAS;YACvB,IAAI,EAAE,IAAI,CAAC,IAAI;YACf,KAAK,EAAE,IAAI,CAAC,KAAK;SAClB,CAAC,CAAC;IACL,CAAC;IAED,MAAM;QACJ,OAAO,CACL,8DAAO,KAAK,EAAC,QAAQ,EAAC,IAAI,EAAC,UAAU;YACnC,8DAAO,IAAI,EAAC,UAAU,EAAC,IAAI,EAAC,UAAU,EAAC,IAAI,EAAE,IAAI,CAAC,IAAI,EAAE,OAAO,EAAE,IAAI,CAAC,SAAS,EAAE,QAAQ,EAAE,GAAG,EAAE,CAAC,IAAI,CAAC,WAAW,EAAE,GAAI;YACvH,4DAAK,KAAK,EAAC,cAAc,EAAC,IAAI,EAAC,WAAW,GAAO,CAC3C,CACT,CAAC;IACJ,CAAC;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;CACF","sourcesContent":["import { Component, h, Prop, State, Event, EventEmitter } from '@stencil/core';\n\n/*\n The `toggle-switch` component is a UI component that allows users to toggle a switch.\n \n @part ts_label - The label of the toggle switch\n * @part ts_input - The input of the toggle switch\n * @part ts_slider - The slider of the toggle switch\n */\n@Component({\n tag: 'toggle-switch',\n styleUrl: 'toggle-switch.scss',\n shadow: true,\n})\nexport class ToggleSwitchComponent {\n @Prop() name: string = 'toggle-switch';\n @Prop() checked: boolean = false;\n @Prop() label: string = '';\n\n @State() isChecked: boolean = this.checked;\n\n @Event() nylasFormSwitchToggled!: EventEmitter<{\n checked: boolean;\n name: string;\n label: string;\n }>;\n\n componentWillLoad() {\n this.isChecked = this.checked;\n }\n\n toggleCheck() {\n this.isChecked = !this.isChecked;\n this.nylasFormSwitchToggled.emit({\n checked: this.isChecked,\n name: this.name,\n label: this.label,\n });\n }\n\n render() {\n return (\n <label class=\"switch\" part=\"ts_label\">\n <input type=\"checkbox\" part=\"ts_input\" name={this.name} checked={this.isChecked} onChange={() => this.toggleCheck()} />\n <div class=\"slider round\" part=\"ts_slider\"></div>\n </label>\n );\n }\n}\n"]}
1	+ {"version":3,"file":"toggle-switch.js","sourceRoot":"","sources":["../../../../src/components/design-system/toggle-switch/toggle-switch.tsx"],"names":[],"mappings":"AAAA,OAAO,EAAE,SAAS,EAAE,CAAC,EAAE,IAAI,EAAE,KAAK,EAAE,KAAK,EAAgB,MAAM,eAAe,CAAC;AAgB/E,MAAM,OAAO,qBAAqB;;oBAIT,eAAe;uBAIX,KAAK;qBAIR,EAAE;yBAKI,IAAI,CAAC,OAAO;;IAY1C,iBAAiB;QACf,IAAI,CAAC,SAAS,GAAG,IAAI,CAAC,OAAO,CAAC;IAChC,CAAC;IAED,WAAW;QACT,IAAI,CAAC,SAAS,GAAG,CAAC,IAAI,CAAC,SAAS,CAAC;QACjC,IAAI,CAAC,sBAAsB,CAAC,IAAI,CAAC;YAC/B,OAAO,EAAE,IAAI,CAAC,SAAS;YACvB,IAAI,EAAE,IAAI,CAAC,IAAI;YACf,KAAK,EAAE,IAAI,CAAC,KAAK;SAClB,CAAC,CAAC;IACL,CAAC;IAED,MAAM;QACJ,OAAO,CACL,8DAAO,KAAK,EAAC,QAAQ,EAAC,IAAI,EAAC,UAAU;YACnC,8DAAO,IAAI,EAAC,UAAU,EAAC,IAAI,EAAC,UAAU,EAAC,IAAI,EAAE,IAAI,CAAC,IAAI,EAAE,OAAO,EAAE,IAAI,CAAC,SAAS,EAAE,QAAQ,EAAE,GAAG,EAAE,CAAC,IAAI,CAAC,WAAW,EAAE,GAAI;YACvH,4DAAK,KAAK,EAAC,cAAc,EAAC,IAAI,EAAC,WAAW,GAAO,CAC3C,CACT,CAAC;IACJ,CAAC;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;CACF","sourcesContent":["import { Component, h, Prop, State, Event, EventEmitter } from '@stencil/core';\n\n/*\n The `toggle-switch` component is a UI component that allows users to toggle a switch.\n * This component is used in the scheduling form to input toggle switch type inputs.\n * Use it as a replacement for checkboxes when you want to present a switch in the UI.\n \n @part ts_label - The label of the toggle switch\n * @part ts_input - The input of the toggle switch\n * @part ts_slider - The slider of the toggle switch\n /\n@Component({\n tag: 'toggle-switch',\n styleUrl: 'toggle-switch.scss',\n shadow: true,\n})\nexport class ToggleSwitchComponent {\n /\n The name of the toggle switch. This is used to identify the toggle switch when submitting a form.\n /\n @Prop() name: string = 'toggle-switch';\n /\n The default value of the toggle switch. This is the value that is displayed when the toggle switch is rendered.\n /\n @Prop() checked: boolean = false;\n /\n The label of the toggle switch. This is displayed next to the toggle switch.\n /\n @Prop() label: string = '';\n\n /\n The checked state of the toggle switch.\n /\n @State() isChecked: boolean = this.checked;\n\n /\n This event is fired when the toggle switch is toggled.\n */\n @Event() nylasFormSwitchToggled!: EventEmitter<{\n checked: boolean;\n name: string;\n label: string;\n }>;\n\n // Lifecycle events\n componentWillLoad() {\n this.isChecked = this.checked;\n }\n\n toggleCheck() {\n this.isChecked = !this.isChecked;\n this.nylasFormSwitchToggled.emit({\n checked: this.isChecked,\n name: this.name,\n label: this.label,\n });\n }\n\n render() {\n return (\n <label class=\"switch\" part=\"ts_label\">\n <input type=\"checkbox\" part=\"ts_input\" name={this.name} checked={this.isChecked} onChange={() => this.toggleCheck()} />\n <div class=\"slider round\" part=\"ts_slider\"></div>\n </label>\n );\n }\n}\n"]}

package/dist/collection/components/design-system/tooltip-component/toolitp-component.js CHANGED Viewed

@@ -12,7 +12,7 @@ export class TooltipComponent {
         event.target.nextElementSibling.style.opacity = '0';
     }
     render() {
-        return (h("div", { key: '18b608bb808e958a45cf72aeb8b1e25c0227ea62', class: "tooltip-container", part: "tc__container" }, h("span", { key: '4e7a423a9de7f26914169d3b4b72507de459a782', class: "info-icon", tabindex: "0", onFocus: this.showTooltip.bind(this), onBlur: this.hideTooltip.bind(this) }, h("slot", { key: '6820cbb0852277eb96fb9f4b6ad88576f41d602f', name: "tooltip-icon" }, "i")), h("span", { key: '99c67c01fcadf2de5890498fb7422b26807e1562', class: `tooltip-content ${this.position}`, part: "tc__content" }, h("slot", { key: '416736464010dee66cc5f5fbb03114d6c6bc32f8', name: "tooltip-content" }, "This is a help text."))));
+        return (h("div", { key: 'd943b820dabf17942c9892bd029ee186fd393cde', class: "tooltip-container", part: "tc__container" }, h("span", { key: '8915e5b427e646ebbe0b8ff496d9a5cd113a4e52', class: "info-icon", tabindex: "0", onFocus: this.showTooltip.bind(this), onBlur: this.hideTooltip.bind(this) }, h("slot", { key: '81e1037d095b49891d74a81a80492dc86ebc6192', name: "tooltip-icon" }, "i")), h("span", { key: '7b6359c221c834e58115c9ea444dd2dddefd1cf7', class: `tooltip-content ${this.position}`, part: "tc__content" }, h("slot", { key: 'a3b353fd3bc079542d64ac868b4c3b66f0f86341', name: "tooltip-content" }, "This is a help text."))));
     }
     static get is() { return "tooltip-component"; }
     static get encapsulation() { return "shadow"; }

package/dist/collection/components/mailbox/nylas-composer/nylas-composer.js CHANGED Viewed

@@ -127,7 +127,7 @@ export class NylasComposer {
         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: 'a8cae87973663ced987b12f8a41385f3311910e5' }, h("sp-theme", { key: '9b732690d1f0c529704c614955c603af602f1805', scale: "medium", color: "dark" }, h("div", { key: '6f9da518afc2027bb938b50dced65383c83281f5', class: "editor", contentEditable: true, ref: r => (this.editorEl = r) }, h("div", { key: 'd665e4adebc7352b5c07137ead22793da96b1a6a', class: "toolbar", ref: r => (this.toolbarEl = r), contentEditable: false }, h("sp-button", { key: 'cf4c80151daac614613530c7f3973fa44285b943', quiet: true, onClick: () => document.execCommand('bold') }, h("div", { key: '406b64ee65391632212f69aab967cce595ef3145', slot: "icon" }, h("bold-icon", { key: '38a82fba1133e28052ae18f59148056213c76e63' })), h("div", { key: '8ab054e1caa8da4d5745a991e0a2ad197124466b', slot: "label" }, "Bold")), h("sp-button", { key: '52d7e1302c0624d4e1e5c337a412a5e0e3752914', quiet: true, onClick: () => document.execCommand('underline') }, h("div", { key: 'c64009e9818a9ccf0385f7cd2c8e3c9df2e08d0d', slot: "icon" }, h("underline-icon", { key: '75de67cc0add37d483d564c1cae6486147ad6669' })), h("div", { key: 'd46d90b0959349c237720890afd7b700a6f3cd71', slot: "label" }, "Underline")), h("sp-button", { key: 'af87cc784ed3c77e471ba54abbf7e18c3c391e1c', quiet: true, onClick: () => document.execCommand('italic') }, h("div", { key: '0e1d03379b6f212fe9b0d080577f0633c2ce5c4a', slot: "icon" }, h("italic-icon", { key: '6e127d2755fccaf634d6a261d95dc191bda77bd2' })), h("div", { key: 'f2e251b97838ed752af350ed0dae3213a3a14e68', slot: "label" }, "Italic")))), h("div", { key: '70399bf4636e5c061562c478504799b6fdf6e15c', class: 'buttons' }, h("sp-button", { key: '90d7d39c6dd284ea399425ea07e205f0562d1423', onClick: this.sendComposer, class: "send" }, "Send"), h("sp-button", { key: '7a1cd27929d585a43b076b8e8131b01f6835aba7', onClick: this.closeComposer, class: "close" }, "Close")))));
     }
     static get is() { return "nylas-composer"; }
     static get encapsulation() { return "shadow"; }

package/dist/collection/components/mailbox/nylas-list-folders/nylas-list-folders.js CHANGED Viewed

@@ -69,7 +69,7 @@ export class NylasListFolders {
         }
     }
     render() {
-        return (h(Host, { key: 'f7658523537781559e3fa8dcef8930beb8ae786f' }, h("div", { key: 'e08916ae6b756aded1ab5efa01f3e897ee3d97e3', class: "folders" }, this.defaultFolders?.map(folder => (h("sp-button", { onClick: () => this.folderSelectedHandler(folder), class: {
+        return (h(Host, { key: 'f25094f0820d2abb2d1a70ecf73da3fe5015d7b1' }, h("div", { key: '7cfb79a63dec4654e2f77640280b2718b8790f18', class: "folders" }, this.defaultFolders?.map(folder => (h("sp-button", { onClick: () => this.folderSelectedHandler(folder), class: {
                 folder: true,
                 selected: formatFolderName(folder.name ?? 'inbox').toLowerCase() === this.selectedFolder?.toLowerCase(),
             } }, h("div", { slot: "icon", class: "icon" }, this.getFolderIcon(folder)), this.formatFolderName(folder))))), this.otherFolders && (h(Fragment, null, h("hr", null), h("div", { class: "folders" }, this.otherFolders?.map(folder => (h("sp-button", { onClick: () => this.folderSelectedHandler(folder), class: {

package/dist/collection/components/mailbox/nylas-list-threads/nylas-list-threads.js CHANGED Viewed

@@ -43,7 +43,7 @@ export class NylasListThreads {
         debug(`[nylas-list-threads] Component did load`, { isAuthenticated: this.isAuthenticated });
     }
     render() {
-        return (h(Host, { key: '12a8ceca4ed6b48b6b2a792543e36c682c0ec6ec' }, h("div", { key: '351f7efcff7c52cba0b8074a8c67562cf083baa8', class: 'list-thread', part: "list-thread" }, this.state === 'loading' && new Array(10).fill(0).map((_, i) => h("div", { class: "thread loading", style: { animationDelay: `${i * 20}ms` } })), this.state === 'ready' &&
+        return (h(Host, { key: '56358d471a747aed0ab60466ed628b9ddb71d049' }, h("div", { key: 'c8f607e89607332c1e5875b6d2566194069cf9ac', class: 'list-thread', part: "list-thread" }, this.state === 'loading' && new Array(10).fill(0).map((_, i) => h("div", { class: "thread loading", style: { animationDelay: `${i * 20}ms` } })), this.state === 'ready' &&
             this.threads.map(thread => (h("button", { key: thread?.id, class: {
                     'thread': true,
                     'unread': thread?.unread === true,

package/dist/collection/components/mailbox/nylas-mailbox/nylas-mailbox.js CHANGED Viewed

@@ -119,7 +119,7 @@ export class NylasMailbox {
         return this.nylasMailboxConnector;
     }
     render() {
-        return (h(Host, { key: '425f7f57f8a5996e86ba7c97187b7e78ceaedba7' }, h("slot", { key: 'bb7ebdf7b8033ccd731cc13782f426cf8ed9cb31' })));
+        return (h(Host, { key: '94e312cb1068801958ad1ecbd9afafd05e9b892b' }, h("slot", { key: 'f0373962f58b64497eec19ecfa7a456925281bd4' })));
     }
     static get is() { return "nylas-mailbox"; }
     static get encapsulation() { return "shadow"; }

package/dist/collection/components/mailbox/nylas-mailbox-toolbar-button/nylas-mailbox-toolbar-button.js CHANGED Viewed

@@ -70,7 +70,7 @@ export class NylasMailboxToolbarButton {
             state = this.dataState ? store.get(storeKey) === 'loading' : false;
         }
         const key = state ? `state-loading` : 'state-ready';
-        return (h(Host, { key: '71a79133adce76f2fa4727c790ad69ad24891eb5' }, h("sp-theme", { key: '7880178def0f50d9622967459ed83e62f06e936d', scale: "medium", color: "dark" }, h("sp-button", { onClick: this.onClick, disabled: state, key: key, "icon-only": this.iconOnly, label: this.renderByState(state) }, this.hasSlot('icon') && (h("div", { slot: "icon", class: 'slot' }, h("slot", { name: "icon" }))), !this.iconOnly && this.renderByState(state)))));
+        return (h(Host, { key: '55dc30c835030d084a6b88042f38eef40b8bb9e2' }, h("sp-theme", { key: '64fae6a1f45665029b5507fe548d919abb263d69', scale: "medium", color: "dark" }, h("sp-button", { onClick: this.onClick, disabled: state, key: key, "icon-only": this.iconOnly, label: this.renderByState(state) }, this.hasSlot('icon') && (h("div", { slot: "icon", class: 'slot' }, h("slot", { name: "icon" }))), !this.iconOnly && this.renderByState(state)))));
     }
     static get is() { return "nylas-mailbox-toolbar-button"; }
     static get encapsulation() { return "shadow"; }

package/dist/collection/components/mailbox/nylas-summarize-message-button/nylas-summarize-message-button.js CHANGED Viewed

@@ -146,12 +146,12 @@ export class NylasSummarizeMessageButton {
         });
     }
     render() {
-        return (h(Host, { key: '977e97a8d9e6f0d5c3f56a8cedcdb18c65a18007' }, h("sp-theme", { key: '3e3e9a385317466347c5e4bac4cac584dc603063', scale: "medium", color: "dark" }, h("sp-button", { key: '4e47a9b38e47991c64236d567df1341df0a7a2b3', label: "Summarize email", "icon-only": true, onClickCapture: this.onClick, class: {
+        return (h(Host, { key: '66c864d9b70e34daf876f49120810dbd9082256e' }, h("sp-theme", { key: 'f210e4a870993a8c620b64458f1fb7abfdac88dd', scale: "medium", color: "dark" }, h("sp-button", { key: '9244f97e26c3ecfc1edcedd5b4b6a6080ad9920f', 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: '0a0a952634d68aeab930d9a0c9feb07a1dea2828', 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: 'f748ef06f332f119dbe6b5bd527e9db5e585cb08', 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`);
             } }))));

package/dist/collection/components/mailbox/nylas-threads-refresh/nylas-threads-refresh.js CHANGED Viewed

@@ -76,11 +76,11 @@ export class NylasThreadsRefresh {
         this.state = state;
     }
     render() {
-        return (h(Host, { key: 'fd0b82f21c069806d697d1997925fd01c2574594' }, h("div", { key: '653737af280d1a4a75433b47edc5455b1eaf61cd', class: "container", ref: r => (this.containerElement = r) }, h("button", { key: '835dbcdf5cfd24069258564b9e23cd3a7c03b8c6', class: {
+        return (h(Host, { key: '81ae0d8b4628bf87001b99241a1d037a02914de1' }, h("div", { key: 'b1459ff6f96d7f91b409bbb677bf9d70a900f8e5', class: "container", ref: r => (this.containerElement = r) }, h("button", { key: '6a114d596026a427518224311d44af229166082c', class: {
                 'pull-to-refresh': true,
                 'pulling': this.pulling,
                 'refreshing': this.state === 'loading',
-            }, "aria-label": "Refreshing..." }, this.state === 'loading' && h("refresh-icon", { slot: "icon" }), this.state !== 'loading' && h("arrow-icon", { slot: "icon" })), h("div", { key: 'b3e3db22c04e261b39c2ed53dd4bd4d33932ffe7', class: "content", ref: r => (this.contentElement = r) }, h("slot", { key: '01f37b6814fae9494dcd4c76c736034c6cc4f392' })))));
+            }, "aria-label": "Refreshing..." }, this.state === 'loading' && h("refresh-icon", { slot: "icon" }), this.state !== 'loading' && h("arrow-icon", { slot: "icon" })), h("div", { key: '44af3075217a91669d7d5ae386cde4b8e3c3349d', class: "content", ref: r => (this.contentElement = r) }, h("slot", { key: '79f6deb55632b74cc0c48ab164512ace49de04c7' })))));
     }
     static get is() { return "nylas-threads-refresh"; }
     static get encapsulation() { return "shadow"; }

package/dist/collection/components/mailbox/nylas-threads-search/nylas-threads-search.js CHANGED Viewed

@@ -43,7 +43,7 @@ export class NylasThreadsSearch {
         this.internalQuery = this.query;
     }
     render() {
-        return (h(Host, { key: 'b8f5ab7d60d06cb54da56d0362f8590d71646dca' }, h("sp-theme", { key: '3d90db95bcbfee7eed4187caa97c76fb7727f58b', scale: "medium", color: "dark" }, h("sp-search", { key: 'd47bd5ee54845a0889f742b8ab76bb56b74fb147', quiet: true, onSubmit: this.onSearch, onBlur: this.onSearch, value: this.internalQuery }))));
+        return (h(Host, { key: '0c80c811e61cb8c622fa19320ea93d6f98146ef1' }, h("sp-theme", { key: 'e9ee0938779ab3be25c82c07ab275f5e1fa30d9e', scale: "medium", color: "dark" }, h("sp-search", { key: 'd031b80043a03c19a4d8af232ec1ae531700cc7c', quiet: true, onSubmit: this.onSearch, onBlur: this.onSearch, value: this.internalQuery }))));
     }
     static get is() { return "nylas-threads-search"; }
     static get encapsulation() { return "shadow"; }

package/dist/collection/components/mailbox/nylas-view-email/nylas-view-email.js CHANGED Viewed

@@ -151,7 +151,7 @@ export class NylasViewEmail {
     }
     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: '285c8ae259a5c1de84aa7facdc2165f1f0383e31' }, 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) })))));
     }
     static get is() { return "nylas-view-email"; }
     static get encapsulation() { return "shadow"; }

package/dist/collection/components/mailbox/nylas-view-thread/nylas-view-thread.js CHANGED Viewed

@@ -121,7 +121,7 @@ export class NylasViewThread {
         const lastTwoMessages = this.internalMessages.slice(this.internalMessages.length - 2, this.internalMessages.length);
         const remainingMessages = this.internalMessages.slice(1, this.internalMessages.length - 2);
         const lastMessage = this.internalMessages[this.internalMessages.length - 1];
-        return (h(Host, { key: 'b9bcde80e7ee15061bfc217d99bb9422dfbe1d04' }, h("sp-theme", { key: '965e53796323e3e13983447abb4ac1b3a8651daa', scale: "medium", color: "dark" }, h("div", { key: '9efc644121efd09a2e837c23f9f8da80589f870b', class: "view-thread" }, h("div", { key: 'c1479929b6679a1b47f03dfe6d5cc1128484b703', class: "header" }, h("div", { key: '00c6788a461f9f6ca4532fb2acb2bf08e0f0c118', class: 'subject' }, this.thread?.subject), h("div", { key: '2e114754a9dd830e4a124cd9079ad4cf725908bd', class: 'folders' }, this.thread?.folders?.map(folder => h("sp-tag", { size: "s" }, toTitleCase(folder.replace('CATEGORY_', '').replace('_', ' ')))))), h("div", { key: '136d6a314c647991218dfe4090fa97c8d98b210d', class: "messages" }, fistMessage && (h(ViewThreadMessage, { message: fistMessage, attachments: this.attachments.filter(attachment => attachment.messageId === fistMessage.id), onMessageClick: this.onMessageClick, onShowContactDataClick: this.onShowContactDataClick, parent: this.host, viewEmailElement: this.nylasViewEmailElement, composerElement: this.nylasComposerElement })), remainingMessages.length > 0 && this.messages.length > 1 && !this.showAllEmails && lastTwoMessages.length > 0 && (h(Fragment, null, h("div", { class: 'show-more' }, h("button", { type: "button", onClick: this.onShowAllEmailsClick }, h("span", { class: 'avatar' }, remainingMessages.length), " ", h("span", { class: 'sr-only' }, "Show ", remainingMessages.length, " more emails"))), h("hr", null))), remainingMessages.length > 0 &&
+        return (h(Host, { key: '053c38f3da8b8535d0a71d51539660ce6eef6fb8' }, h("sp-theme", { key: 'dcb9a12a2577ed0cd183887355237e9a671f9cf9', scale: "medium", color: "dark" }, h("div", { key: 'b3d0f0d355cad065a790e6ad8f7f31692bd30b3f', class: "view-thread" }, h("div", { key: '47f588ecc5dbd6e9f680033c6784f9bfc3587dcb', class: "header" }, h("div", { key: 'cf102cc90b56d71d6fb2a98bc335189eb3e3b801', class: 'subject' }, this.thread?.subject), h("div", { key: '3bb42a18ce5b440c1bf76c491676a3570f4dd20b', class: 'folders' }, this.thread?.folders?.map(folder => h("sp-tag", { size: "s" }, toTitleCase(folder.replace('CATEGORY_', '').replace('_', ' ')))))), h("div", { key: 'a6a5a8bbebff5ee2fb0f101669614d7376f9da47', class: "messages" }, fistMessage && (h(ViewThreadMessage, { message: fistMessage, attachments: this.attachments.filter(attachment => attachment.messageId === fistMessage.id), onMessageClick: this.onMessageClick, onShowContactDataClick: this.onShowContactDataClick, parent: this.host, viewEmailElement: this.nylasViewEmailElement, composerElement: this.nylasComposerElement })), remainingMessages.length > 0 && this.messages.length > 1 && !this.showAllEmails && lastTwoMessages.length > 0 && (h(Fragment, null, h("div", { class: 'show-more' }, h("button", { type: "button", onClick: this.onShowAllEmailsClick }, h("span", { class: 'avatar' }, remainingMessages.length), " ", h("span", { class: 'sr-only' }, "Show ", remainingMessages.length, " more emails"))), h("hr", null))), remainingMessages.length > 0 &&
             this.showAllEmails &&
             this.messages.length > 2 &&
             remainingMessages.map(email => (h(ViewThreadMessage, { message: email, attachments: this.attachments.filter(attachment => attachment.messageId === fistMessage?.id), onMessageClick: this.onMessageClick, onShowContactDataClick: this.onShowContactDataClick, parent: this.host, viewEmailElement: this.nylasViewEmailElement, composerElement: this.nylasComposerElement }))), lastTwoMessages.length > 0 &&

package/dist/collection/components/nylas-if-state/nylas-if-state.js CHANGED Viewed

@@ -97,7 +97,7 @@ export class NylasIfState {
         }
     }
     render() {
-        return (h(Host, { key: '14c61cd55ec800a480889a16ea2f913b0e19f27f' }, h("div", { key: '4f97263914ce0afbd5f4f629f7ca8d2df8ad87c4', class: this.classes }, this.show && h("slot", null))));
+        return (h(Host, { key: '06fbcbd4f843c995a21fe2d9001854db5630de2d' }, h("div", { key: 'ffaefb05f1361c98fd9b449110d003f2c18137a7', class: this.classes }, this.show && h("slot", null))));
     }
     static get is() { return "nylas-if-state"; }
     static get encapsulation() { return "shadow"; }

package/dist/collection/components/nylas-login/nylas-login.js CHANGED Viewed

@@ -69,7 +69,7 @@ export class NylasLogin {
     }
     render() {
         const splitProviders = this.providers?.split(',') || [];
-        return (h(Host, { key: '00ff0a2496564f9e340f778b5310ca3d0359e726' }, this.loginMethod === 'redirect' && (h("div", { class: "redirect-container" }, !this.isAuthenticated && (h("sp-button", { part: "button", onClick: this._handleLoginRedirect }, this.buttonText)))), this.loginMethod === 'emebded' && (h("main", { class: "login-container" }, h("section", { class: "login-box" }, h("header", null, h("img", { src: this.logoUrl, alt: `${this.companyName} logo`, width: '100%', style: {
+        return (h(Host, { key: 'e3bd94415e84b96be032ba5ca9ca7f29f9f81efa' }, this.loginMethod === 'redirect' && (h("div", { class: "redirect-container" }, !this.isAuthenticated && (h("sp-button", { part: "button", onClick: this._handleLoginRedirect }, this.buttonText)))), this.loginMethod === 'emebded' && (h("main", { class: "login-container" }, h("section", { class: "login-box" }, h("header", null, h("img", { src: this.logoUrl, alt: `${this.companyName} logo`, width: '100%', style: {
                 minWidth: this.logoWidth,
             } }), h("h1", null, "Welcome")), h("p", null, "Log in to your account to continue to ", this.companyName), h("div", { class: "login-methods" }, splitProviders.includes('google') && (h("button", { class: "login-google", onClick: this._onGoogleButtonClick }, h("svg", { xmlns: "http://www.w3.org/2000/svg", "aria-hidden": "true", role: "img", width: "18", height: "18", preserveAspectRatio: "xMidYMid meet", viewBox: "0 0 256 262" }, h("path", { fill: "#4285F4", d: "M255.6 131.6c0-8.2-.8-16.2-2.2-23.9H130v45.3h70.3c-3 16.1-12.4 29.7-26.3 38.9v32.4h42.6c25-23 39.4-56.7 39.4-97.7z" }), h("path", { fill: "#34A853", d: "M130 262c35.3 0 64.9-11.7 86.5-31.7l-42.6-32.4c-11.7 7.9-26.7 12.6-43.9 12.6-33.7 0-62.3-22.7-72.5-53.4H14.5v33.3A130.3 130.3 0 00130 262z" }), h("path", { fill: "#FBBC05", d: "M57.5 158.1a72.7 72.7 0 010-54.2V70.6H14.5a130.4 130.4 0 000 120.8l43-33.3z" }), h("path", { fill: "#EA4335", d: "M130 51.6c19 0 36 6.5 49.4 19.2l37-36C195 13.1 165.2 0 130 0A130.3 130.3 0 0014.5 70.6l43 33.3c10.2-30.7 38.8-53.3 72.5-53.3z" })), "Continue with Google")), splitProviders.includes('microsoft') && (h("button", { class: "login-microsoft", onClick: this._onMicrosoftButtonClick }, h("svg", { xmlns: "http://www.w3.org/2000/svg", "aria-hidden": "true", role: "img", width: "18", height: "18", preserveAspectRatio: "xMidYMid meet", viewBox: "0 0 448 512" }, h("path", { fill: "#F3F3F3", d: "M0 32v192h192V32H0zm256 0v192h192V32H256zm192 256v192h-192V288h192zM0 224v192h192V224H0z" })), "Continue with Microsoft"))), h("form", { class: "login-form", method: "POST", onSubmit: this._onFormSubmit }, h("label", { htmlFor: "email" }, "Email"), h("input", { type: "email", id: "email", name: "email", required: true, value: this.email }), h("button", { type: "submit" }, "Next")))))));
     }

package/dist/collection/components/nylas-provider/nylas-provider.js CHANGED Viewed

@@ -101,7 +101,7 @@ export class NylasProvider {
         return this.baseProvider?.getStore('schedulerConfig');
     }
     render() {
-        return (h(Host, { key: '1eb5d566a5f7c425be7b30939b06a2dfbd34c7cc' }, h("slot", { key: 'f3a6afab3af5893af6602f971dfe67a795f9bd4f' })));
+        return (h(Host, { key: 'fed0fe6a1130877288e6758fa863c58e6be6015e' }, h("slot", { key: 'd06c95851d318f5cc245a6664c04b4f61b7f3192' })));
     }
     static get is() { return "nylas-provider"; }
     static get encapsulation() { return "shadow"; }

package/dist/collection/components/scheduler/nylas-booked-event-card/nylas-booked-event-card.js CHANGED Viewed

@@ -20,9 +20,9 @@ export class NylasBookedEventCard {
     constructor() {
         this.handleCancelBookingButtonClicked = () => {
             const startTime = new Date(this.selectedTimeslot.start_time);
-            const minCancellationNotice = this.configSettings?.scheduler.min_cancellation_notice;
+            const minCancellationNotice = this.configSettings?.scheduler?.min_cancellation_notice;
             const dateTillCancellation = startTime.getTime() - minCancellationNotice * 60 * 1000;
-            if (startTime.getTime() < dateTillCancellation) {
+            if (dateTillCancellation < new Date().getTime()) {
                 this.cancelBookedEventValidationError.emit({
                     error: {
                         title: 'Cancellation Error',
@@ -60,6 +60,7 @@ export class NylasBookedEventCard {
         this.selectedTimezone = Intl.DateTimeFormat().resolvedOptions().timeZone;
         this.selectedTimeslot = undefined;
         this.configSettings = undefined;
+        this.isLoading = undefined;
     }
     connectedCallback() { }
     disconnectedCallback() { }
@@ -76,7 +77,7 @@ export class NylasBookedEventCard {
         }
     }
     render() {
-        return (h(Host, { key: '25f461e554d352c8b62341f77c84d61521a40472', part: "nbec" }, h("sp-theme", { key: 'fa7ae9d97b3c334d71a64076bd6c5787b48b124b', theme: "spectrum", color: "dark", scale: "medium" }, h("div", { key: '731d9d89bfc2f63b8a1095ea671f39d1a99dc4a4', class: "booked-event-timezone" }, h("globe-icon", { key: 'e7a7d73d7c9461f34145ddf3e99bf5640b39ab56' }), TIMEZONE_MAP[this.selectedTimezone]), h("div", { key: 'dbb07cac45a1528a2633119af6050a630f8df173', class: "event-card-wrapper", part: "nbec__card" }, h("div", { key: '79b6b636707f8e867358da1b4340e6f0bfeb386e', class: "calendar-icon" }, h("calendar-check-icon", { key: 'a268b01ecbf64976dc61c9e3c66a67cade9d2227' })), h("div", { key: '52c4c97407582b05bfb87e1379930f7cf149c013', class: "booked-event-header" }, h("h2", { key: 'ed4631c601b4920b20c27d158063dcbef92084d4', slot: "card-title", part: "nbec__title" }, "Booking ", !!this.rescheduleBookingId ? 'rescheduled' : 'confirmed', "!"), h("div", { key: 'f5e93f73c4828764cb7e27cc3d5ab2b761e66fdc', part: "nbec__description" }, this.getOrganizer(this.eventInfo)?.name || this.getOrganizer(this.eventInfo)?.email, "\u00A0&\u00A0", this.bookingInfo?.primaryParticipant?.name || this.bookingInfo?.primaryParticipant?.email)), h("sp-divider", { key: 'd9f14eeb24c4935f131edebb3102ffd69d2bde43' }), h("div", { key: '57f6f7877162eb8de8898d6523dac452b3c841e9', class: "booking-date-time" }, h("checkmark-circle-icon", { key: '5bd672ae7c70b0102d6a14e2761b8ecc222ce488' }), h("h3", { key: '5e8ca582a26a51f790ca111648381a10f8ef917c' }, "Booking date and time"), h("p", { key: '0b98f73c94add678003f63cd1e59352f7acd29b3' }, new Date(this.selectedTimeslot?.start_time).toLocaleDateString(undefined, { dateStyle: 'full' }), " ", h("br", { key: 'cc2a50917760651ca2e015fa22f264740b545a58' }), new Date(this.selectedTimeslot?.start_time).toLocaleTimeString(undefined, { timeStyle: 'short' }), " -", ' ', new Date(this.selectedTimeslot?.end_time).toLocaleTimeString(undefined, { timeStyle: 'short' }))), h("div", { key: '5ccf1dbc6002c9eaf60b3bd9211e590ab9135d68', class: "booking-participants" }), h("sp-divider", { key: '7ff9b9f4fa4bfc19da47d358ddda325b13b1a465' }), h("div", { key: '2c3d69854b255864cca3782a9ad87175a18d8cf9', class: {
+        return (h(Host, { key: '64a71090c3bb639b725195733562ad0e25a10eba', part: "nbec" }, h("sp-theme", { key: '6c8b9a6502507836aba5d3a358681b4fb55178a5', theme: "spectrum", color: "dark", scale: "medium" }, h("div", { key: 'f49b01cfe925800eafd90eb1d31f5585fc43b595', class: "booked-event-timezone" }, h("globe-icon", { key: 'a222a15cfeaccfc969c51eecff485bfcce18f611' }), TIMEZONE_MAP[this.selectedTimezone]), h("div", { key: '490c2bdea9b10c878a1746ae47e444c5ef32e07e', class: "event-card-wrapper", part: "nbec__card" }, h("div", { key: 'd6e61e4633441e3d13f9560afc43622322b79e9f', class: "calendar-icon" }, h("calendar-check-icon", { key: 'e761a870d25ef7c965b9c4520c44c37f55111e5d' })), h("div", { key: '0dbed416d1fcd1678fa2935c25ed96cc2e1a1c26', class: "booked-event-header" }, h("h2", { key: '7c485fa82b8cd30f6e589783b03413785b9597dc', slot: "card-title", part: "nbec__title" }, "Booking ", !!this.rescheduleBookingId && !this.isLoading ? 'rescheduled' : 'confirmed', "!"), h("div", { key: '17c4d9ad8338947d9c3e30043f0882d141576e88', part: "nbec__description" }, this.getOrganizer(this.eventInfo)?.name || this.getOrganizer(this.eventInfo)?.email, "\u00A0&\u00A0", this.bookingInfo?.primaryParticipant?.name || this.bookingInfo?.primaryParticipant?.email)), h("sp-divider", { key: 'c6adc37a2d0b96a4ae5f6922aadcabaa67cc10b6' }), h("div", { key: 'c453be3d82ddad511771d7fd6944f0f772b7993c', class: "booking-date-time" }, h("checkmark-circle-icon", { key: '2ce7f0be037e54193904ea02c839dce1690de8d3' }), h("h3", { key: '8dad8e71df17003b3989a77fee4b03d5d6c10a54' }, "Booking date and time"), h("p", { key: '8bca1fab69c83e87e22a683ee248c9dd8864efb5' }, new Date(this.selectedTimeslot?.start_time).toLocaleDateString(undefined, { dateStyle: 'full' }), " ", h("br", { key: '56e5d95797fedd1169943b8af1c119290a90a75e' }), new Date(this.selectedTimeslot?.start_time).toLocaleTimeString(undefined, { timeStyle: 'short' }), " -", ' ', new Date(this.selectedTimeslot?.end_time).toLocaleTimeString(undefined, { timeStyle: 'short' }))), h("div", { key: '58b916f387d02bb74a39ae6d9775ad2db131e9b7', class: "booking-participants" }), h("sp-divider", { key: 'be8f4ca081787cd2856a92672668f4f80dd18a74' }), h("div", { key: '09d6315a3d1ff768f03f1dea70c7de630ce2e5f6', class: {
                 'footer': true,
                 'no-footer': this.configSettings?.scheduler?.hide_cancellation_options && this.configSettings?.scheduler?.hide_rescheduling_options,
                 'no-template-cols': this.configSettings?.scheduler?.hide_cancellation_options || this.configSettings?.scheduler?.hide_rescheduling_options,
@@ -180,7 +181,7 @@ export class NylasBookedEventCard {
                 "mutable": false,
                 "complexType": {
                     "original": "Timeslot",
-                    "resolved": "{ start_time: Date; end_time: Date; }",
+                    "resolved": "{ start_time: Date; end_time: Date; emails: string[]; }",
                     "references": {
                         "Timeslot": {
                             "location": "import",
@@ -218,6 +219,23 @@ export class NylasBookedEventCard {
                 },
                 "attribute": "config-settings",
                 "reflect": false
+            },
+            "isLoading": {
+                "type": "boolean",
+                "mutable": false,
+                "complexType": {
+                    "original": "boolean",
+                    "resolved": "boolean | undefined",
+                    "references": {}
+                },
+                "required": false,
+                "optional": true,
+                "docs": {
+                    "tags": [],
+                    "text": "The loading state prop. Used to display loading state when fetching availability."
+                },
+                "attribute": "is-loading",
+                "reflect": false
             }
         };
     }
@@ -305,6 +323,7 @@ __decorate([
             ['scheduler.rescheduleBookingId', 'rescheduleBookingId'],
             ['scheduler.selectedTimezone', 'selectedTimezone'],
             ['scheduler.selectedTimeslot', 'selectedTimeslot'],
+            ['scheduler.isLoading', 'isLoading'],
             ['scheduler.configSettings', 'configSettings'],
         ]),
         eventToProps: {

package/dist/collection/components/scheduler/nylas-booked-event-card/nylas-booked-event-card.js.map CHANGED Viewed

	@@ -1 +1 @@
1	- {"version":3,"file":"nylas-booked-event-card.js","sourceRoot":"","sources":["../../../../src/components/scheduler/nylas-booked-event-card/nylas-booked-event-card.tsx"],"names":[],"mappings":"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","sourcesContent":["import { RegisterComponent } from '@/common/register-component';\nimport { Component, EventEmitter, h, Host, Prop } from '@stencil/core';\nimport { ConfigSettings, NylasSchedulerBookingData, NylasSchedulerConnector } from '../../..';\nimport { NylasScheduling } from '../nylas-scheduling/nylas-scheduling';\nimport { debug } from '@/utils/utils';\nimport { TIMEZONE_MAP } from '@/common/constants';\nimport { NylasEvent } from '@/common/types';\nimport { Event } from '@stencil/core';\nimport { NylasSchedulerErrorResponse, Timeslot } from '@nylas/core';\n\n/*\n The `nylas-booked-event-card` component is a UI component that displays the booked event card.\n \n @part nbec - The booked event card host.\n * @part nbec__card - The booked event card.\n * @part nbec__title - The title of the booked event card.\n * @part nbec__description - The description of the booked event card.\n * @part nbec__button-outline - The cancel & reschedule button CTA.\n * @part nbec__cancel-cta - The cancel button CTA.\n * @part nbec__reschedule-cta - The reschedule button CTA.\n /\n@Component({\n tag: 'nylas-booked-event-card',\n styleUrl: 'nylas-booked-event-card.scss',\n shadow: true,\n})\nexport class NylasBookedEventCard {\n /\n The booked event.\n /\n @Prop() readonly eventInfo!: NylasEvent;\n\n /\n Booking flow type.\n /\n @Prop() readonly rescheduleBookingId?: string;\n\n /\n The booking info used to book / reschedule the event.\n /\n @Prop() readonly bookingInfo?: NylasSchedulerBookingData;\n\n /\n The selected timezone.\n /\n @Prop() readonly selectedTimezone: string = Intl.DateTimeFormat().resolvedOptions().timeZone;\n\n /\n The selected timeslot.\n /\n @Prop() readonly selectedTimeslot!: Timeslot;\n\n /\n The config settings for the scheduler.\n /\n @Prop() readonly configSettings?: ConfigSettings;\n\n /\n Cancel booking button clicked event.\n /\n @Event() readonly cancelBookingButtonClicked!: EventEmitter<{ bookingId: string }>;\n\n /\n Reschedule button clicked event.\n * /\n @Event() readonly rescheduleButtonClicked!: EventEmitter<{ bookingId: string; errorHandler?: (error: NylasSchedulerErrorResponse) => void }>;\n\n /\n This event is fired when an error occurs while rescheduling the booking.\n /\n @Event() readonly rescheduleBookedEventError!: EventEmitter<NylasSchedulerErrorResponse>;\n\n /\n This event is fired when an error occurs while cancelling the booking.\n /\n @Event() readonly cancelBookedEventValidationError!: EventEmitter<{\n error: {\n title: string;\n message: string;\n };\n }>;\n\n connectedCallback() {}\n\n disconnectedCallback() {}\n\n async componentWillLoad() {\n debug(`[nylas-booked-event-card] Component will load`);\n }\n\n async componentDidLoad() {\n debug(`[nylas-booked-event-card] Component did load`);\n if (!this.eventInfo) {\n console.warn('[nylas-booked-event-card] \"eventInfo\" prop missing. Please provide the event info to display the event details in the booked event card component.');\n }\n if (!this.bookingInfo) {\n console.warn('[nylas-booked-event-card] \"bookingInfo\" prop missing. Please provide the booking info to display the guest details in the booked event card component.');\n }\n }\n\n private handleCancelBookingButtonClicked = () => {\n const startTime = new Date(this.selectedTimeslot.start_time);\n const minCancellationNotice = this.configSettings?.scheduler.min_cancellation_notice;\n const dateTillCancellation = startTime.getTime() - minCancellationNotice 60 * 1000;\n if (startTime.getTime() < dateTillCancellation) {\n this.cancelBookedEventValidationError.emit({\n error: {\n title: 'Cancellation Error',\n message: `You cannot cancel the booking within ${minCancellationNotice} minutes of the event.`,\n },\n });\n } else {\n this.cancelBookingButtonClicked.emit({ bookingId: this.eventInfo.booking_id });\n }\n };\n\n private handleRescheduleButtonClicked = () => {\n const errorHandler = (error: NylasSchedulerErrorResponse) => {\n this.rescheduleBookedEventError.emit(error);\n };\n this.rescheduleButtonClicked.emit({ bookingId: this.eventInfo.booking_id, errorHandler });\n };\n\n private getOrganizer = (eventInfo: NylasEvent) => {\n const organizer = eventInfo?.organizer;\n return organizer;\n };\n\n getPaticipantType = (type: string) => {\n switch (type) {\n case 'host':\n return 'Host';\n case 'you':\n return 'You';\n default:\n return '';\n }\n };\n\n @RegisterComponent<NylasBookedEventCard, NylasSchedulerConnector, Exclude<NylasScheduling['stores'], undefined>>({\n name: 'nylas-booked-event-card',\n stateToProps: new Map([\n ['scheduler.bookingInfo', 'bookingInfo'],\n ['scheduler.rescheduleBookingId', 'rescheduleBookingId'],\n ['scheduler.selectedTimezone', 'selectedTimezone'],\n ['scheduler.selectedTimeslot', 'selectedTimeslot'],\n ['scheduler.configSettings', 'configSettings'],\n ]),\n eventToProps: {\n cancelBookingButtonClicked: async (event: CustomEvent<{ bookingId: string }>, nylasSchedulerConnector: NylasSchedulerConnector) => {\n nylasSchedulerConnector.scheduler.setCancel(event.detail.bookingId);\n },\n rescheduleButtonClicked: async (\n event: CustomEvent<{ bookingId: string; errorHandler?: (error: NylasSchedulerErrorResponse) => void }>,\n nylasSchedulerConnector: NylasSchedulerConnector,\n ) => {\n const result = await nylasSchedulerConnector.scheduler.setReschedule(event.detail.bookingId);\n const { errorHandler } = event.detail;\n if (errorHandler && (!result \|\| 'error' in result)) {\n errorHandler(result);\n }\n },\n },\n fireRegisterEvent: true,\n })\n render() {\n return (\n <Host part=\"nbec\">\n <sp-theme theme=\"spectrum\" color=\"dark\" scale=\"medium\">\n <div class=\"booked-event-timezone\">\n <globe-icon></globe-icon>\n {TIMEZONE_MAP[this.selectedTimezone]}\n </div>\n <div class=\"event-card-wrapper\" part=\"nbec__card\">\n <div class=\"calendar-icon\">\n <calendar-check-icon />\n </div>\n <div class=\"booked-event-header\">\n <h2 slot=\"card-title\" part=\"nbec__title\">\n Booking {!!this.rescheduleBookingId ? 'rescheduled' : 'confirmed'}!\n </h2>\n <div part=\"nbec__description\">\n {this.getOrganizer(this.eventInfo)?.name \|\| this.getOrganizer(this.eventInfo)?.email} & \n {this.bookingInfo?.primaryParticipant?.name \|\| this.bookingInfo?.primaryParticipant?.email}\n </div>\n </div>\n <sp-divider></sp-divider>\n <div class=\"booking-date-time\">\n <checkmark-circle-icon></checkmark-circle-icon>\n <h3>Booking date and time</h3>\n <p>\n {new Date(this.selectedTimeslot?.start_time).toLocaleDateString(undefined, { dateStyle: 'full' })} <br />\n {new Date(this.selectedTimeslot?.start_time).toLocaleTimeString(undefined, { timeStyle: 'short' })} -{' '}\n {new Date(this.selectedTimeslot?.end_time).toLocaleTimeString(undefined, { timeStyle: 'short' })}\n </p>\n </div>\n <div class=\"booking-participants\">\n {/* <people-icon></people-icon>\n <h3>All participants</h3>\n {this.eventInfo?.participants && (\n <p>\n {this.eventInfo?.participants?.map((participant: NylasEvent['participants'][0]) => {\n return (\n <span class=\"block\">\n {participant.email} {this.getPaticipantType(participant.type) && `(${this.getPaticipantType(participant.type)})`}\n </span>\n );\n })}\n </p>\n )} */}\n </div>\n <sp-divider></sp-divider>\n <div\n class={{\n 'footer': true,\n 'no-footer': this.configSettings?.scheduler?.hide_cancellation_options && this.configSettings?.scheduler?.hide_rescheduling_options,\n 'no-template-cols': this.configSettings?.scheduler?.hide_cancellation_options \|\| this.configSettings?.scheduler?.hide_rescheduling_options,\n }}\n >\n {!this.configSettings?.scheduler?.hide_cancellation_options && (\n <sp-button variant=\"secondary\" treatment=\"outline\" class=\"cancel\" onClick={this.handleCancelBookingButtonClicked} part=\"nbec__button-outline nbec__cancel-cta\">\n Cancel booking\n </sp-button>\n )}\n {!this.configSettings?.scheduler?.hide_rescheduling_options && (\n <sp-button variant=\"secondary\" treatment=\"outline\" class=\"reschedule\" onClick={this.handleRescheduleButtonClicked} part=\"nbec__button-outline nbec__reschedule-cta\">\n Reschedule\n </sp-button>\n )}\n </div>\n </div>\n </sp-theme>\n </Host>\n );\n }\n}\n"]}
1	+ {"version":3,"file":"nylas-booked-event-card.js","sourceRoot":"","sources":["../../../../src/components/scheduler/nylas-booked-event-card/nylas-booked-event-card.tsx"],"names":[],"mappings":"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","sourcesContent":["import { RegisterComponent } from '@/common/register-component';\nimport { Component, EventEmitter, h, Host, Prop } from '@stencil/core';\nimport { ConfigSettings, NylasSchedulerBookingData, NylasSchedulerConnector } from '../../..';\nimport { NylasScheduling } from '../nylas-scheduling/nylas-scheduling';\nimport { debug } from '@/utils/utils';\nimport { TIMEZONE_MAP } from '@/common/constants';\nimport { NylasEvent } from '@/common/types';\nimport { Event } from '@stencil/core';\nimport { NylasSchedulerErrorResponse, Timeslot } from '@nylas/core';\n\n/*\n The `nylas-booked-event-card` component is a UI component that displays the booked event card.\n \n @part nbec - The booked event card host.\n * @part nbec__card - The booked event card.\n * @part nbec__title - The title of the booked event card.\n * @part nbec__description - The description of the booked event card.\n * @part nbec__button-outline - The cancel & reschedule button CTA.\n * @part nbec__cancel-cta - The cancel button CTA.\n * @part nbec__reschedule-cta - The reschedule button CTA.\n /\n@Component({\n tag: 'nylas-booked-event-card',\n styleUrl: 'nylas-booked-event-card.scss',\n shadow: true,\n})\nexport class NylasBookedEventCard {\n /\n The booked event.\n /\n @Prop() readonly eventInfo!: NylasEvent;\n\n /\n Booking flow type.\n /\n @Prop() readonly rescheduleBookingId?: string;\n\n /\n The booking info used to book / reschedule the event.\n /\n @Prop() readonly bookingInfo?: NylasSchedulerBookingData;\n\n /\n The selected timezone.\n /\n @Prop() readonly selectedTimezone: string = Intl.DateTimeFormat().resolvedOptions().timeZone;\n\n /\n The selected timeslot.\n /\n @Prop() readonly selectedTimeslot!: Timeslot;\n\n /\n The config settings for the scheduler.\n /\n @Prop() readonly configSettings?: ConfigSettings;\n\n /\n The loading state prop. Used to display loading state when fetching availability.\n /\n @Prop() readonly isLoading?: boolean;\n\n /\n Cancel booking button clicked event.\n /\n @Event() readonly cancelBookingButtonClicked!: EventEmitter<{ bookingId: string }>;\n\n /\n Reschedule button clicked event.\n * /\n @Event() readonly rescheduleButtonClicked!: EventEmitter<{ bookingId: string; errorHandler?: (error: NylasSchedulerErrorResponse) => void }>;\n\n /\n This event is fired when an error occurs while rescheduling the booking.\n /\n @Event() readonly rescheduleBookedEventError!: EventEmitter<NylasSchedulerErrorResponse>;\n\n /\n This event is fired when an error occurs while cancelling the booking.\n /\n @Event() readonly cancelBookedEventValidationError!: EventEmitter<{\n error: {\n title: string;\n message: string;\n };\n }>;\n\n connectedCallback() {}\n\n disconnectedCallback() {}\n\n async componentWillLoad() {\n debug(`[nylas-booked-event-card] Component will load`);\n }\n\n async componentDidLoad() {\n debug(`[nylas-booked-event-card] Component did load`);\n if (!this.eventInfo) {\n console.warn('[nylas-booked-event-card] \"eventInfo\" prop missing. Please provide the event info to display the event details in the booked event card component.');\n }\n if (!this.bookingInfo) {\n console.warn('[nylas-booked-event-card] \"bookingInfo\" prop missing. Please provide the booking info to display the guest details in the booked event card component.');\n }\n }\n\n private handleCancelBookingButtonClicked = () => {\n const startTime = new Date(this.selectedTimeslot.start_time);\n const minCancellationNotice = this.configSettings?.scheduler?.min_cancellation_notice;\n const dateTillCancellation = startTime.getTime() - minCancellationNotice 60 * 1000;\n if (dateTillCancellation < new Date().getTime()) {\n this.cancelBookedEventValidationError.emit({\n error: {\n title: 'Cancellation Error',\n message: `You cannot cancel the booking within ${minCancellationNotice} minutes of the event.`,\n },\n });\n } else {\n this.cancelBookingButtonClicked.emit({ bookingId: this.eventInfo.booking_id });\n }\n };\n\n private handleRescheduleButtonClicked = () => {\n const errorHandler = (error: NylasSchedulerErrorResponse) => {\n this.rescheduleBookedEventError.emit(error);\n };\n this.rescheduleButtonClicked.emit({ bookingId: this.eventInfo.booking_id, errorHandler });\n };\n\n private getOrganizer = (eventInfo: NylasEvent) => {\n const organizer = eventInfo?.organizer;\n return organizer;\n };\n\n getPaticipantType = (type: string) => {\n switch (type) {\n case 'host':\n return 'Host';\n case 'you':\n return 'You';\n default:\n return '';\n }\n };\n\n @RegisterComponent<NylasBookedEventCard, NylasSchedulerConnector, Exclude<NylasScheduling['stores'], undefined>>({\n name: 'nylas-booked-event-card',\n stateToProps: new Map([\n ['scheduler.bookingInfo', 'bookingInfo'],\n ['scheduler.rescheduleBookingId', 'rescheduleBookingId'],\n ['scheduler.selectedTimezone', 'selectedTimezone'],\n ['scheduler.selectedTimeslot', 'selectedTimeslot'],\n ['scheduler.isLoading', 'isLoading'],\n ['scheduler.configSettings', 'configSettings'],\n ]),\n eventToProps: {\n cancelBookingButtonClicked: async (event: CustomEvent<{ bookingId: string }>, nylasSchedulerConnector: NylasSchedulerConnector) => {\n nylasSchedulerConnector.scheduler.setCancel(event.detail.bookingId);\n },\n rescheduleButtonClicked: async (\n event: CustomEvent<{ bookingId: string; errorHandler?: (error: NylasSchedulerErrorResponse) => void }>,\n nylasSchedulerConnector: NylasSchedulerConnector,\n ) => {\n const result = await nylasSchedulerConnector.scheduler.setReschedule(event.detail.bookingId);\n const { errorHandler } = event.detail;\n if (errorHandler && (!result \|\| 'error' in result)) {\n errorHandler(result);\n }\n },\n },\n fireRegisterEvent: true,\n })\n render() {\n return (\n <Host part=\"nbec\">\n <sp-theme theme=\"spectrum\" color=\"dark\" scale=\"medium\">\n <div class=\"booked-event-timezone\">\n <globe-icon></globe-icon>\n {TIMEZONE_MAP[this.selectedTimezone]}\n </div>\n <div class=\"event-card-wrapper\" part=\"nbec__card\">\n <div class=\"calendar-icon\">\n <calendar-check-icon />\n </div>\n <div class=\"booked-event-header\">\n <h2 slot=\"card-title\" part=\"nbec__title\">\n Booking {!!this.rescheduleBookingId && !this.isLoading ? 'rescheduled' : 'confirmed'}!\n </h2>\n <div part=\"nbec__description\">\n {this.getOrganizer(this.eventInfo)?.name \|\| this.getOrganizer(this.eventInfo)?.email} & \n {this.bookingInfo?.primaryParticipant?.name \|\| this.bookingInfo?.primaryParticipant?.email}\n </div>\n </div>\n <sp-divider></sp-divider>\n <div class=\"booking-date-time\">\n <checkmark-circle-icon></checkmark-circle-icon>\n <h3>Booking date and time</h3>\n <p>\n {new Date(this.selectedTimeslot?.start_time).toLocaleDateString(undefined, { dateStyle: 'full' })} <br />\n {new Date(this.selectedTimeslot?.start_time).toLocaleTimeString(undefined, { timeStyle: 'short' })} -{' '}\n {new Date(this.selectedTimeslot?.end_time).toLocaleTimeString(undefined, { timeStyle: 'short' })}\n </p>\n </div>\n <div class=\"booking-participants\">\n {/* <people-icon></people-icon>\n <h3>All participants</h3>\n {this.eventInfo?.participants && (\n <p>\n {this.eventInfo?.participants?.map((participant: NylasEvent['participants'][0]) => {\n return (\n <span class=\"block\">\n {participant.email} {this.getPaticipantType(participant.type) && `(${this.getPaticipantType(participant.type)})`}\n </span>\n );\n })}\n </p>\n )} */}\n </div>\n <sp-divider></sp-divider>\n <div\n class={{\n 'footer': true,\n 'no-footer': this.configSettings?.scheduler?.hide_cancellation_options && this.configSettings?.scheduler?.hide_rescheduling_options,\n 'no-template-cols': this.configSettings?.scheduler?.hide_cancellation_options \|\| this.configSettings?.scheduler?.hide_rescheduling_options,\n }}\n >\n {!this.configSettings?.scheduler?.hide_cancellation_options && (\n <sp-button variant=\"secondary\" treatment=\"outline\" class=\"cancel\" onClick={this.handleCancelBookingButtonClicked} part=\"nbec__button-outline nbec__cancel-cta\">\n Cancel booking\n </sp-button>\n )}\n {!this.configSettings?.scheduler?.hide_rescheduling_options && (\n <sp-button variant=\"secondary\" treatment=\"outline\" class=\"reschedule\" onClick={this.handleRescheduleButtonClicked} part=\"nbec__button-outline nbec__reschedule-cta\">\n Reschedule\n </sp-button>\n )}\n </div>\n </div>\n </sp-theme>\n </Host>\n );\n }\n}\n"]}

package/dist/collection/components/scheduler/nylas-booked-event-card/test/nylas-booked-event-card.spec.js CHANGED Viewed

@@ -15,6 +15,7 @@ const eventInfo = {
 const selectedTimeslot = {
     start_time: new Date('2023-03-13T14:00:00.000Z'),
     end_time: new Date('2023-03-13T15:00:00.000Z'),
+    emails: ['abcd@nylas.com'],
 };
 describe('nylas-booked-event-card', () => {
     beforeEach(() => {

package/dist/collection/components/scheduler/nylas-booked-event-card/test/nylas-booked-event-card.spec.js.map CHANGED Viewed

	@@ -1 +1 @@
1	- {"version":3,"file":"nylas-booked-event-card.spec.js","sourceRoot":"","sources":["../../../../../src/components/scheduler/nylas-booked-event-card/test/nylas-booked-event-card.spec.tsx"],"names":[],"mappings":"AAAA,OAAO,EAAE,WAAW,EAAE,MAAM,uBAAuB,CAAC;AACpD,OAAO,EAAE,oBAAoB,EAAE,MAAM,4BAA4B,CAAC;AAClE,OAAO,EAAE,CAAC,EAAE,MAAM,eAAe,CAAC;AAElC,MAAM,SAAS,GAAG;IAChB,UAAU,EAAE,KAAK;IACjB,KAAK,EAAE,WAAW;IAClB,WAAW,EAAE,EAAE;IACf,SAAS,EAAE;QACT,IAAI,EAAE,UAAU;QAChB,KAAK,EAAE,mBAAmB;QAC1B,YAAY,EAAE,IAAI;KACnB;IACD,MAAM,EAAE,QAAQ;CACjB,CAAC;AAEF,MAAM,gBAAgB,GAAG;IACvB,UAAU,EAAE,IAAI,IAAI,CAAC,0BAA0B,CAAC;IAChD,QAAQ,EAAE,IAAI,IAAI,CAAC,0BAA0B,CAAC;~~CAC/C~~,CAAC;AAEF,QAAQ,CAAC,yBAAyB,EAAE,GAAG,EAAE;IACvC,UAAU,CAAC,GAAG,EAAE;QAEd,IAAI,CAAC,aAAa,EAAE,CAAC;IACvB,CAAC,CAAC,CAAC;IAEH,EAAE,CAAC,SAAS,EAAE,KAAK,IAAI,EAAE;QACvB,MAAM,IAAI,GAAG,MAAM,WAAW,CAAC;YAC7B,UAAU,EAAE,CAAC,oBAAoB,CAAC;YAClC,QAAQ,EAAE,GAAG,EAAE,CAAC,+BAAyB,SAAS,EAAE,SAAS,EAAE,gBAAgB,EAAE,gBAAgB,GAA4B;YAC7H,IAAI,EAAE,qDAAqD;SAC5D,CAAC,CAAC;QACH,IAAI,CAAC,IAAI,CAAC,IAAI,EAAE,CAAC;YACf,MAAM,IAAI,KAAK,CAAC,2BAA2B,CAAC,CAAC;QAC/C,CAAC;QAED,MAAM,CAAC,IAAI,CAAC,IAAI,CAAC,CAAC,eAAe,EAAE,CAAC;IACtC,CAAC,CAAC,CAAC;IAEH,EAAE,CAAC,uEAAuE,EAAE,KAAK,IAAI,EAAE;QACrF,MAAM,IAAI,GAAG,MAAM,WAAW,CAAC;YAC7B,UAAU,EAAE,CAAC,oBAAoB,CAAC;YAClC,QAAQ,EAAE,GAAG,EAAE,CAAC,+BAAyB,SAAS,EAAE,SAAS,EAAE,gBAAgB,EAAE,gBAAgB,GAA4B;SAC9H,CAAC,CAAC;QACH,IAAI,CAAC,IAAI,CAAC,IAAI,EAAE,CAAC;YACf,MAAM,IAAI,KAAK,CAAC,2BAA2B,CAAC,CAAC;QAC/C,CAAC;QACD,IAAI,CAAC,IAAI,CAAC,mBAAmB,GAAG,gBAAgB,CAAC;QACjD,MAAM,CAAC,IAAI,CAAC,IAAI,CAAC,CAAC,eAAe,EAAE,CAAC;IACtC,CAAC,CAAC,CAAC;IAEH,EAAE,CAAC,+DAA+D,EAAE,KAAK,IAAI,EAAE;QAC7E,MAAM,QAAQ,GAAG,IAAI,CAAC,EAAE,EAAE,CAAC;QAC3B,MAAM,IAAI,GAAG,MAAM,WAAW,CAAC;YAC7B,UAAU,EAAE,CAAC,oBAAoB,CAAC;YAClC,QAAQ,EAAE,GAAG,EAAE,CAAC,+BAAyB,SAAS,EAAE,SAAS,EAAE,gBAAgB,EAAE,gBAAgB,GAA4B;SAC9H,CAAC,CAAC;QACH,IAAI,CAAC,IAAI,CAAC,IAAI,EAAE,CAAC;YACf,MAAM,IAAI,KAAK,CAAC,2BAA2B,CAAC,CAAC;QAC/C,CAAC;QAED,MAAM,SAAS,GAAG,IAAI,EAAE,IAAI,EAAE,UAAU,EAAE,aAAa,CAAC,SAAS,CAAsB,CAAC;QACxF,IAAI,CAAC,GAAG,CAAC,gBAAgB,CAAC,4BAA4B,EAAE,QAAQ,CAAC,CAAC;QAClE,SAAS,CAAC,KAAK,EAAE,CAAC;QAClB,MAAM,IAAI,CAAC,cAAc,EAAE,CAAC;QAC5B,MAAM,CAAC,QAAQ,CAAC,CAAC,gBAAgB,EAAE,CAAC;QACpC,MAAM,WAAW,GAAG,QAAQ,CAAC,IAAI,CAAC,KAAK,CAAC,CAAC,CAAC,CAAC,CAAC,CAAC,CAAC;QAC9C,MAAM,CAAC,WAAW,CAAC,MAAM,CAAC,SAAS,CAAC,CAAC,IAAI,CAAC,KAAK,CAAC,CAAC;IACnD,CAAC,CAAC,CAAC;IAEH,EAAE,CAAC,gEAAgE,EAAE,KAAK,IAAI,EAAE;QAC9E,MAAM,IAAI,GAAG,MAAM,WAAW,CAAC;YAC7B,UAAU,EAAE,CAAC,oBAAoB,CAAC;YAClC,QAAQ,EAAE,GAAG,EAAE,CAAC,+BAAyB,SAAS,EAAE,SAAS,EAAE,gBAAgB,EAAE,gBAAgB,GAA4B;SAC9H,CAAC,CAAC;QACH,IAAI,CAAC,IAAI,CAAC,IAAI,EAAE,CAAC;YACf,MAAM,IAAI,KAAK,CAAC,2BAA2B,CAAC,CAAC;QAC/C,CAAC;QAED,MAAM,aAAa,GAAG,IAAI,EAAE,IAAI,EAAE,UAAU,EAAE,aAAa,CAAC,aAAa,CAAsB,CAAC;QAChG,MAAM,QAAQ,GAAG,IAAI,CAAC,EAAE,EAAE,CAAC;QAC3B,IAAI,CAAC,GAAG,CAAC,gBAAgB,CAAC,yBAAyB,EAAE,QAAQ,CAAC,CAAC;QAC/D,aAAa,CAAC,KAAK,EAAE,CAAC;QACtB,MAAM,IAAI,CAAC,cAAc,EAAE,CAAC;QAC5B,MAAM,CAAC,QAAQ,CAAC,CAAC,gBAAgB,EAAE,CAAC;QACpC,MAAM,WAAW,GAAG,QAAQ,CAAC,IAAI,CAAC,KAAK,CAAC,CAAC,CAAC,CAAC,CAAC,CAAC,CAAC;QAC9C,MAAM,CAAC,WAAW,CAAC,MAAM,CAAC,SAAS,CAAC,CAAC,IAAI,CAAC,KAAK,CAAC,CAAC;IACnD,CAAC,CAAC,CAAC;IAEH,EAAE,CAAC,gCAAgC,EAAE,KAAK,IAAI,EAAE;QAC9C,MAAM,IAAI,GAAG,MAAM,WAAW,CAAC;YAC7B,UAAU,EAAE,CAAC,oBAAoB,CAAC;YAClC,QAAQ,EAAE,GAAG,EAAE,CAAC,+BAAyB,SAAS,EAAE,SAAS,EAAE,gBAAgB,EAAE,gBAAgB,GAA4B;SAC9H,CAAC,CAAC;QAEH,IAAI,CAAC,IAAI,CAAC,IAAI,EAAE,CAAC;YACf,MAAM,IAAI,KAAK,CAAC,2BAA2B,CAAC,CAAC;QAC/C,CAAC;QAED,MAAM,IAAI,CAAC,cAAc,EAAE,CAAC;QAC5B,MAAM,CAAC,IAAI,CAAC,IAAI,CAAC,CAAC,eAAe,EAAE,CAAC;IACtC,CAAC,CAAC,CAAC;AACL,CAAC,CAAC,CAAC","sourcesContent":["import { newSpecPage } from '@stencil/core/testing';\nimport { NylasBookedEventCard } from '../nylas-booked-event-card';\nimport { h } from '@stencil/core';\n\nconst eventInfo = {\n booking_id: '123',\n title: 'New event',\n description: '',\n organizer: {\n name: 'John Doe',\n email: 'johndoe@gmail.com',\n is_organizer: true,\n },\n status: 'booked',\n};\n\nconst selectedTimeslot = {\n start_time: new Date('2023-03-13T14:00:00.000Z'),\n end_time: new Date('2023-03-13T15:00:00.000Z'),\n};\n\ndescribe('nylas-booked-event-card', () => {\n beforeEach(() => {\n // Clear and reset the mock before each test if needed\n jest.clearAllMocks();\n });\n\n it('renders', async () => {\n const page = await newSpecPage({\n components: [NylasBookedEventCard],\n template: () => <nylas-booked-event-card eventInfo={eventInfo} selectedTimeslot={selectedTimeslot}></nylas-booked-event-card>,\n html: `<nylas-booked-event-card></nylas-booked-event-card>`,\n });\n if (!page.root) {\n throw new Error('Component did not render.');\n }\n\n expect(page.root).toMatchSnapshot();\n });\n\n it('renders header with event title based on the rescheduleBookingId prop', async () => {\n const page = await newSpecPage({\n components: [NylasBookedEventCard],\n template: () => <nylas-booked-event-card eventInfo={eventInfo} selectedTimeslot={selectedTimeslot}></nylas-booked-event-card>,\n });\n if (!page.root) {\n throw new Error('Component did not render.');\n }\n page.root.rescheduleBookingId = 'reschedulingId';\n expect(page.root).toMatchSnapshot();\n });\n\n it('emits cancelBookingButtonClicked event on cancel button click', async () => {\n const spyEvent = jest.fn();\n const page = await newSpecPage({\n components: [NylasBookedEventCard],\n template: () => <nylas-booked-event-card eventInfo={eventInfo} selectedTimeslot={selectedTimeslot}></nylas-booked-event-card>,\n });\n if (!page.root) {\n throw new Error('Component did not render.');\n }\n\n const cancelBtn = page?.root?.shadowRoot?.querySelector('.cancel') as HTMLButtonElement;\n page.win.addEventListener('cancelBookingButtonClicked', spyEvent);\n cancelBtn.click();\n await page.waitForChanges();\n expect(spyEvent).toHaveBeenCalled();\n const customEvent = spyEvent.mock.calls[0][0];\n expect(customEvent.detail.bookingId).toBe('123');\n });\n\n it('emits rescheduleButtonClicked event on reschedule button click', async () => {\n const page = await newSpecPage({\n components: [NylasBookedEventCard],\n template: () => <nylas-booked-event-card eventInfo={eventInfo} selectedTimeslot={selectedTimeslot}></nylas-booked-event-card>,\n });\n if (!page.root) {\n throw new Error('Component did not render.');\n }\n\n const rescheduleBtn = page?.root?.shadowRoot?.querySelector('.reschedule') as HTMLButtonElement;\n const spyEvent = jest.fn();\n page.win.addEventListener('rescheduleButtonClicked', spyEvent);\n rescheduleBtn.click();\n await page.waitForChanges();\n expect(spyEvent).toHaveBeenCalled();\n const customEvent = spyEvent.mock.calls[0][0];\n expect(customEvent.detail.bookingId).toBe('123');\n });\n\n it('renders with event information', async () => {\n const page = await newSpecPage({\n components: [NylasBookedEventCard],\n template: () => <nylas-booked-event-card eventInfo={eventInfo} selectedTimeslot={selectedTimeslot}></nylas-booked-event-card>,\n });\n\n if (!page.root) {\n throw new Error('Component did not render.');\n }\n\n await page.waitForChanges();\n expect(page.root).toMatchSnapshot();\n });\n});\n"]}
1	+ {"version":3,"file":"nylas-booked-event-card.spec.js","sourceRoot":"","sources":["../../../../../src/components/scheduler/nylas-booked-event-card/test/nylas-booked-event-card.spec.tsx"],"names":[],"mappings":"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","sourcesContent":["import { newSpecPage } from '@stencil/core/testing';\nimport { NylasBookedEventCard } from '../nylas-booked-event-card';\nimport { h } from '@stencil/core';\n\nconst eventInfo = {\n booking_id: '123',\n title: 'New event',\n description: '',\n organizer: {\n name: 'John Doe',\n email: 'johndoe@gmail.com',\n is_organizer: true,\n },\n status: 'booked',\n};\n\nconst selectedTimeslot = {\n start_time: new Date('2023-03-13T14:00:00.000Z'),\n end_time: new Date('2023-03-13T15:00:00.000Z'),\n emails: ['abcd@nylas.com'],\n};\n\ndescribe('nylas-booked-event-card', () => {\n beforeEach(() => {\n // Clear and reset the mock before each test if needed\n jest.clearAllMocks();\n });\n\n it('renders', async () => {\n const page = await newSpecPage({\n components: [NylasBookedEventCard],\n template: () => <nylas-booked-event-card eventInfo={eventInfo} selectedTimeslot={selectedTimeslot}></nylas-booked-event-card>,\n html: `<nylas-booked-event-card></nylas-booked-event-card>`,\n });\n if (!page.root) {\n throw new Error('Component did not render.');\n }\n\n expect(page.root).toMatchSnapshot();\n });\n\n it('renders header with event title based on the rescheduleBookingId prop', async () => {\n const page = await newSpecPage({\n components: [NylasBookedEventCard],\n template: () => <nylas-booked-event-card eventInfo={eventInfo} selectedTimeslot={selectedTimeslot}></nylas-booked-event-card>,\n });\n if (!page.root) {\n throw new Error('Component did not render.');\n }\n page.root.rescheduleBookingId = 'reschedulingId';\n expect(page.root).toMatchSnapshot();\n });\n\n it('emits cancelBookingButtonClicked event on cancel button click', async () => {\n const spyEvent = jest.fn();\n const page = await newSpecPage({\n components: [NylasBookedEventCard],\n template: () => <nylas-booked-event-card eventInfo={eventInfo} selectedTimeslot={selectedTimeslot}></nylas-booked-event-card>,\n });\n if (!page.root) {\n throw new Error('Component did not render.');\n }\n\n const cancelBtn = page?.root?.shadowRoot?.querySelector('.cancel') as HTMLButtonElement;\n page.win.addEventListener('cancelBookingButtonClicked', spyEvent);\n cancelBtn.click();\n await page.waitForChanges();\n expect(spyEvent).toHaveBeenCalled();\n const customEvent = spyEvent.mock.calls[0][0];\n expect(customEvent.detail.bookingId).toBe('123');\n });\n\n it('emits rescheduleButtonClicked event on reschedule button click', async () => {\n const page = await newSpecPage({\n components: [NylasBookedEventCard],\n template: () => <nylas-booked-event-card eventInfo={eventInfo} selectedTimeslot={selectedTimeslot}></nylas-booked-event-card>,\n });\n if (!page.root) {\n throw new Error('Component did not render.');\n }\n\n const rescheduleBtn = page?.root?.shadowRoot?.querySelector('.reschedule') as HTMLButtonElement;\n const spyEvent = jest.fn();\n page.win.addEventListener('rescheduleButtonClicked', spyEvent);\n rescheduleBtn.click();\n await page.waitForChanges();\n expect(spyEvent).toHaveBeenCalled();\n const customEvent = spyEvent.mock.calls[0][0];\n expect(customEvent.detail.bookingId).toBe('123');\n });\n\n it('renders with event information', async () => {\n const page = await newSpecPage({\n components: [NylasBookedEventCard],\n template: () => <nylas-booked-event-card eventInfo={eventInfo} selectedTimeslot={selectedTimeslot}></nylas-booked-event-card>,\n });\n\n if (!page.root) {\n throw new Error('Component did not render.');\n }\n\n await page.waitForChanges();\n expect(page.root).toMatchSnapshot();\n });\n});\n"]}

package/dist/collection/components/scheduler/nylas-booking-form/nylas-booking-form.js CHANGED Viewed

@@ -119,16 +119,12 @@ export class NylasBookingForm {
                     email: email,
                 },
                 guests: guests,
-                additionalFields: [...bookingInfoAdditionalFields, ...this.additionalFields],
+                additionalFields: { ...bookingInfoAdditionalFields, ...this.additionalFields },
             });
         };
-        this.updateAdditionalFields = (name, value, type) => {
-            const index = this.additionalFields.findIndex(field => field.name === name);
-            if (index > -1) {
-                this.additionalFields[index].value = value;
-            }
-            else {
-                this.additionalFields.push({ name: name, value: value, type: type || 'text' });
+        this.updateAdditionalFields = (name, value) => {
+            if (this.additionalFields) {
+                this.additionalFields[name] = value;
             }
         };
         this.isLoading = undefined;
@@ -141,7 +137,7 @@ export class NylasBookingForm {
         this.guestEmailErrors = {};
         this.isNameValid = true;
         this.isEmailValid = true;
-        this.additionalFields = [];
+        this.additionalFields = {};
         this.validationError = { name: '', email: '' };
     }
     connectedCallback() { }
@@ -192,15 +188,9 @@ export class NylasBookingForm {
                     });
                     return;
                 }
-                this.updateAdditionalFields(event.detail.label, event.detail.value, event.detail.type);
+                this.updateAdditionalFields(event.detail.label, event.detail.value);
                 break;
         }
-        if (event.detail.name === 'name') {
-            this.changeName(event.detail.value);
-        }
-        else if (event.detail.name === 'email') {
-            this.changeEmail(event.detail.value);
-        }
     }
     selectOptionChangedHandler(event) {
         if (event.detail.error) {
@@ -210,16 +200,19 @@ export class NylasBookingForm {
             });
             return;
         }
-        this.updateAdditionalFields(event.detail.label, event.detail.value, 'dropdown');
+        this.updateAdditionalFields(event.detail.label, event.detail.value);
     }
     switchToggledHandler(event) {
-        this.updateAdditionalFields(event.detail.label, event.detail.checked ? 'true' : 'false', 'checkbox');
+        this.updateAdditionalFields(event.detail.label, event.detail.checked ? 'true' : 'false');
     }
     checkboxToggledHandler(event) {
-        this.updateAdditionalFields(event.detail.label, event.detail.checked ? 'true' : 'false', 'checkbox');
+        this.updateAdditionalFields(event.detail.label, event.detail.checked ? 'true' : 'false');
+    }
+    radioChangedHandler(event) {
+        this.updateAdditionalFields(event.detail.label || event.detail.name, event.detail.value);
     }
     render() {
-        return (h(Host, { key: '1b81fd4591cd90c85a578a8d957ed561e457cba5' }, h("form", { key: '4a4fef983332d1752ccf44823620ec2b906bf71e', onSubmit: e => this.bookButtonClickedHandler(e), noValidate: true }, h("div", { key: 'e55ebf5bb6fbb5175e6175d06ce0e0a5266962cf', class: "nylas-booking-form" }, h("div", { key: 'd50d5fdbc7b68b3c54098a6dde600ed52c607eed', class: "input-wrapper" }, h("input-component", { key: 'a299cb5d2043e5fedd6f5f66889d7640e74b8b55', label: "Name", name: "name", id: "name", defaultValue: this.bookingInfo?.primaryParticipant?.name || this.name, placeholder: "Enter your name", type: "text", required: true, part: "nbf__input-textfield" })), h("div", { key: '0d095468473009d67120d668f5e961ca4d90c16d', class: "input-wrapper" }, h("input-component", { key: 'e81345e3aca7fa9cd0a90be50f81cfa544a23336', label: "Email", name: "email", id: "email", pattern: emailRegex, defaultValue: this.bookingInfo?.primaryParticipant?.email || this.email, placeholder: "Enter your email", type: "email", required: true, part: "nbf__input-textfield" })), this.configSettings?.scheduler?.hide_additional_guests !== true && (h("div", { class: "input-wrapper" }, this.guestEmails.map((email, index) => (h("div", { class: "input-wrapper button-wrapper" }, h("label", { class: {
+        return (h(Host, { key: '36976cb674781bce8d4ebf7448c6139e16871503' }, h("form", { key: 'b680520fd0dd5fc680fb93c2665a0fc3128ef18c', onSubmit: e => this.bookButtonClickedHandler(e), noValidate: true }, h("div", { key: 'd66af23e87ae82517d91802d7e1811888fe0460f', class: "nylas-booking-form" }, h("div", { key: '314fe1fabfbecfa4dc282724b2c50e37ea09ec97', class: "input-wrapper" }, h("input-component", { key: '2f789c887cd3b6f1f5fd325afbc1b507048501d7', label: "Name", name: "name", id: "name", defaultValue: this.bookingInfo?.primaryParticipant?.name || this.name, placeholder: "Enter your name", type: "text", required: true, part: "nbf__input-textfield" })), h("div", { key: '49e1cbcdf26466ac6b9634032b4e402850c8dae4', class: "input-wrapper" }, h("input-component", { key: '9248db828f4ccab15b66fd95e4baa4d76a2810df', label: "Email", name: "email", id: "email", pattern: emailRegex, defaultValue: this.bookingInfo?.primaryParticipant?.email || this.email, placeholder: "Enter your email", type: "email", required: true, part: "nbf__input-textfield" })), this.configSettings?.scheduler?.hide_additional_guests !== true && (h("div", { class: "input-wrapper" }, this.guestEmails.map((email, index) => (h("div", { class: "input-wrapper button-wrapper" }, h("label", { class: {
                 error: !!this.guestEmailErrors[index],
             } }, "Guest email"), h("div", { class: "guest-email-input" }, h("input", { type: "email", id: `guest-email-${index}`, maxLength: 100, class: {
                 'guest-email': true,
@@ -227,7 +220,24 @@ export class NylasBookingForm {
             }, placeholder: "Enter guest email", value: email, "data-index": index, part: "nbf__input-textfield", onBlur: (e) => this.handleGuestBlur(index, e.target?.value), onInput: (e) => this.handleGuestChange(index, e.target?.value) }), h("button-component", { variant: "basic", onClick: (e) => this.removeGuestButtonClickHandler(e, index), class: {
                 'remove-guest': true,
                 'error': !!this.guestEmailErrors[index],
-            } }, h("close-icon", null))), h("p", { class: "help-text" }, this.guestEmailErrors[index])))), h("button-component", { class: "add-guest", variant: "invisible", part: "nbf__button-ghost", onClick: e => this.addGuestButtonClickedHandler(e) }, h("div", { class: "button-content" }, h("add-circle-icon", { slot: "icon" }), "Add ", this.guestEmails.length > 0 ? 'another ' : '', "guest")))), h("slot", { key: 'f47bffdf6a15943c78d4bb75051d0f6704afd623', name: "custom-booking-form" })), h("div", { key: '12631d6648d7ebdc9e6714a54690486d53c8c623', class: "cta" }, h("sp-button", { key: 'a72caa2eb6b5d95ee83600aa37e89730bfd68fdb', treatment: "outline", variant: "secondary", class: 'back', part: "nbf__button-outline", onClick: this.handleBackButtonClicked }, h("slot", { key: 'be107ab400cb5802c6153217cde54b75ccede466', name: "booking-form-back-label" }, "Back")), h("sp-button", { key: 'd6f322389050d4cbbb1aada135b27b6bc4d34d6d', variant: "primary", class: 'book', part: "nbf__button-primary", type: "submit" }, this.isLoading && h("loading-icon", { slot: "icon" }), h("slot", { key: '17ee459bee19ba620505e9931ccd4a485f530ecc', name: "booking-form-book-label" }, "Book now"))))));
+            } }, h("close-icon", null))), h("p", { class: "help-text" }, this.guestEmailErrors[index])))), h("button-component", { class: "add-guest", variant: "invisible", part: "nbf__button-ghost", onClick: e => this.addGuestButtonClickedHandler(e) }, h("div", { class: "button-content" }, h("add-circle-icon", { slot: "icon" }), "Add ", this.guestEmails.length > 0 ? 'another ' : '', "guest")))), Object.entries((this.configSettings?.scheduler?.additional_fields || {}))
+            ?.sort((a, b) => a[1].order - b[1].order)
+            .map(x => {
+            const field = x[1];
+            const label = x[0];
+            switch (field.type) {
+                case 'dropdown':
+                    return (h("div", { class: "input-wrapper" }, h("select-dropdown", { label: label, name: label, id: label, withSearch: false, options: field.options?.map(option => ({ value: option, label: option })), required: field.required, part: "nbf__input-textfield" })));
+                case 'checkbox':
+                    return (h("div", { class: "input-wrapper" }, h("checkbox-component", { label: label, name: label, id: label, required: field.required, part: "nbf__input-textfield" })));
+                case 'radio_button':
+                    return (h("div", { class: "input-wrapper" }, h("radio-button-group", { label: label, name: label, id: label, options: field.options?.map(option => ({ value: option, label: option })), required: field.required, part: "nbf__input-textfield" })));
+                case 'multi_line_text':
+                    return (h("div", { class: "input-wrapper" }, h("textarea-component", { label: label, name: label, id: label, required: field.required, part: "nbf__input-textfield" })));
+                default:
+                    return (h("div", { class: "input-wrapper" }, h("input-component", { label: label, name: label, id: label, type: field.type, required: field.required, part: "nbf__input-textfield" })));
+            }
+        }), h("slot", { key: 'a3ed3aec89ed73ebac18ea67a81a26eafe2cdee1', name: "custom-booking-form" })), h("div", { key: '145d50be8074dacd8ec6e63a80d5ef06c7f01357', class: "cta" }, h("sp-button", { key: 'e7cc2a09db2f2365030aa7013aa0a7be3b04915a', treatment: "outline", variant: "secondary", class: 'back', part: "nbf__button-outline", onClick: this.handleBackButtonClicked }, h("slot", { key: '7c97f933480ec1fc279531dacebb4cf9458c35ff', name: "booking-form-back-label" }, "Back")), h("sp-button", { key: '368f5f5fc489d6fa06b818f2ad8dee46260fff1c', variant: "primary", class: 'book', part: "nbf__button-primary", type: "submit" }, this.isLoading && h("loading-icon", { slot: "icon" }), h("slot", { key: '9dcca97d8629337121b691a649b4a0bd7cd91554', name: "booking-form-book-label" }, "Book now"))))));
     }
     static get is() { return "nylas-booking-form"; }
     static get encapsulation() { return "shadow"; }
@@ -482,6 +492,12 @@ export class NylasBookingForm {
                 "target": undefined,
                 "capture": false,
                 "passive": false
+            }, {
+                "name": "nylasFormRadioChanged",
+                "method": "radioChangedHandler",
+                "target": undefined,
+                "capture": false,
+                "passive": false
             }];
     }
 }