@nylas/web-elements 2.5.17 → 2.6.0

package/dist/collection/common/icons/trash-fill.js

@@ -5,7 +5,7 @@ export class TrashFillIcon {
         this.height = '15';
     }
     render() {
-        return (h("svg", { key: 'f4b6bf0a4e86ceb196065f771242ac6e4487fc1a', width: this.width, height: this.height, viewBox: "0 0 24 24", fill: "auto", xmlns: "http://www.w3.org/2000/svg" }, h("path", { key: 'dc1472db1426fca03c7709b167f4405f95e6f1f5', d: "M3 6H5H21", stroke: "auto", "stroke-width": "1.5" }), h("path", { key: '09f4731c1874955f7172f8423abea95632d89cd6', d: "M8 6V4C8 3.46957 8.21071 2.96086 8.58579 2.58579C8.96086 2.21071 9.46957 2 10 2H14C14.5304 2 15.0391 2.21071 15.4142 2.58579C15.7893 2.96086 16 3.46957 16 4V6M19 6V20C19 20.5304 18.7893 21.0391 18.4142 21.4142C18.0391 21.7893 17.5304 22 17 22H7C6.46957 22 5.96086 21.7893 5.58579 21.4142C5.21071 21.0391 5 20.5304 5 20V6H19Z", stroke: "auto", "stroke-width": "1.5" }), h("path", { key: '9a5326048ec96555dbbc4be234c773fa3fd663da', d: "M10 11V17", stroke: "auto", "stroke-width": "1.5" }), h("path", { key: 'fc50cf30fbef0f4ba33e16d6d9a5dd8bdec769d1', d: "M14 11V17", stroke: "auto", "stroke-width": "1.5" })));
+        return (h("svg", { key: '7364568098022fc43ef2660bf6c55c18f4984354', width: this.width, height: this.height, viewBox: "0 0 24 24", fill: "auto", xmlns: "http://www.w3.org/2000/svg" }, h("path", { key: 'fd1489e8f9d8552bb263ffb245b0c5331d9e0ff7', d: "M3 6H5H21", stroke: "auto", "stroke-width": "1.5" }), h("path", { key: 'bc177f2968eb1e13a0aeee74f3ad1062fb50029f', d: "M8 6V4C8 3.46957 8.21071 2.96086 8.58579 2.58579C8.96086 2.21071 9.46957 2 10 2H14C14.5304 2 15.0391 2.21071 15.4142 2.58579C15.7893 2.96086 16 3.46957 16 4V6M19 6V20C19 20.5304 18.7893 21.0391 18.4142 21.4142C18.0391 21.7893 17.5304 22 17 22H7C6.46957 22 5.96086 21.7893 5.58579 21.4142C5.21071 21.0391 5 20.5304 5 20V6H19Z", stroke: "auto", "stroke-width": "1.5" }), h("path", { key: '9bbbc06eb4138a2cb9e7bee54cae0c0e9635c106', d: "M10 11V17", stroke: "auto", "stroke-width": "1.5" }), h("path", { key: '62ff992828ce136651fe24c90074b29fea6839d6', d: "M14 11V17", stroke: "auto", "stroke-width": "1.5" })));
     }
     static get is() { return "trash-fill-icon"; }
     static get encapsulation() { return "scoped"; }

package/dist/collection/common/icons/trash.js

@@ -5,7 +5,7 @@ export class TrashIcon {
         this.height = '21';
     }
     render() {
-        return (h("svg", { key: '968d758513738446ce03862a916f385a2c8d63fd', width: this.width, height: this.height, viewBox: "0 0 20 21", fill: "none", xmlns: "http://www.w3.org/2000/svg" }, h("path", { key: 'fdc08f18f0b0df669431f58ab55c90f4a3742cc4', d: "M10 0.25C11.733 0.25 13.1492 1.60645 13.2449 3.31558L13.25 3.5H18.5C18.9142 3.5 19.25 3.83579 19.25 4.25C19.25 4.6297 18.9678 4.94349 18.6018 4.99315L18.5 5H17.704L16.4239 18.0192C16.2912 19.3683 15.1984 20.41 13.8626 20.4945L13.6871 20.5H6.31293C4.95734 20.5 3.81365 19.5145 3.59883 18.1934L3.57614 18.0192L2.295 5H1.5C1.1203 5 0.806509 4.71785 0.756847 4.35177L0.75 4.25C0.75 3.8703 1.03215 3.55651 1.39823 3.50685L1.5 3.5H6.75C6.75 1.70507 8.20507 0.25 10 0.25ZM16.197 5H3.802L5.06893 17.8724C5.12768 18.4696 5.60033 18.9343 6.18585 18.9936L6.31293 19H13.6871C14.2872 19 14.7959 18.5751 14.9123 17.9982L14.9311 17.8724L16.197 5ZM11.75 7.75C12.1297 7.75 12.4435 8.03215 12.4932 8.39823L12.5 8.5V15.5C12.5 15.9142 12.1642 16.25 11.75 16.25C11.3703 16.25 11.0565 15.9678 11.0068 15.6018L11 15.5V8.5C11 8.08579 11.3358 7.75 11.75 7.75ZM8.25 7.75C8.6297 7.75 8.94349 8.03215 8.99315 8.39823L9 8.5V15.5C9 15.9142 8.66421 16.25 8.25 16.25C7.8703 16.25 7.55651 15.9678 7.50685 15.6018L7.5 15.5V8.5C7.5 8.08579 7.83579 7.75 8.25 7.75ZM10 1.75C9.08183 1.75 8.32881 2.45711 8.2558 3.35647L8.25 3.5H11.75C11.75 2.5335 10.9665 1.75 10 1.75Z", fill: "currentColor" })));
+        return (h("svg", { key: '483ba2a5321bba27bfd71d88c40544149ea97d9a', width: this.width, height: this.height, viewBox: "0 0 20 21", fill: "none", xmlns: "http://www.w3.org/2000/svg" }, h("path", { key: '87a64fd83a51ae1827db20ad49f27f33ab90c7c6', d: "M10 0.25C11.733 0.25 13.1492 1.60645 13.2449 3.31558L13.25 3.5H18.5C18.9142 3.5 19.25 3.83579 19.25 4.25C19.25 4.6297 18.9678 4.94349 18.6018 4.99315L18.5 5H17.704L16.4239 18.0192C16.2912 19.3683 15.1984 20.41 13.8626 20.4945L13.6871 20.5H6.31293C4.95734 20.5 3.81365 19.5145 3.59883 18.1934L3.57614 18.0192L2.295 5H1.5C1.1203 5 0.806509 4.71785 0.756847 4.35177L0.75 4.25C0.75 3.8703 1.03215 3.55651 1.39823 3.50685L1.5 3.5H6.75C6.75 1.70507 8.20507 0.25 10 0.25ZM16.197 5H3.802L5.06893 17.8724C5.12768 18.4696 5.60033 18.9343 6.18585 18.9936L6.31293 19H13.6871C14.2872 19 14.7959 18.5751 14.9123 17.9982L14.9311 17.8724L16.197 5ZM11.75 7.75C12.1297 7.75 12.4435 8.03215 12.4932 8.39823L12.5 8.5V15.5C12.5 15.9142 12.1642 16.25 11.75 16.25C11.3703 16.25 11.0565 15.9678 11.0068 15.6018L11 15.5V8.5C11 8.08579 11.3358 7.75 11.75 7.75ZM8.25 7.75C8.6297 7.75 8.94349 8.03215 8.99315 8.39823L9 8.5V15.5C9 15.9142 8.66421 16.25 8.25 16.25C7.8703 16.25 7.55651 15.9678 7.50685 15.6018L7.5 15.5V8.5C7.5 8.08579 7.83579 7.75 8.25 7.75ZM10 1.75C9.08183 1.75 8.32881 2.45711 8.2558 3.35647L8.25 3.5H11.75C11.75 2.5335 10.9665 1.75 10 1.75Z", fill: "currentColor" })));
     }
     static get is() { return "trash-icon"; }
     static get encapsulation() { return "scoped"; }

package/dist/collection/common/icons/underline.js

@@ -5,7 +5,7 @@ export class UnderlineIcon {
         this.height = '15';
     }
     render() {
-        return (h("svg", { key: '4d71ec4fdf0fa2505394ec32a9595f576c90aba9', width: this.width, height: this.height, viewBox: "0 0 24 24", fill: "none", xmlns: "http://www.w3.org/2000/svg" }, h("path", { key: 'a1a86fed569522894b6a305bc107cf7885f721e1', d: "M19 4V10C19 13.866 15.866 17 12 17C8.13401 17 5 13.866 5 10V4M8.5 4V10C8.5 13.2218 10.6766 15.9352 13.6395 16.7501M4 21H20M3 4L10.5 4M17 4L21 4", stroke: "currentColor", "stroke-width": "2", "stroke-linecap": "round", "stroke-linejoin": "round" })));
+        return (h("svg", { key: 'c98b9cc6128178614fd19536f75327c2d8f30fea', width: this.width, height: this.height, viewBox: "0 0 24 24", fill: "none", xmlns: "http://www.w3.org/2000/svg" }, h("path", { key: '1548d691451f610bcfe46c5397f0817354b0e735', d: "M19 4V10C19 13.866 15.866 17 12 17C8.13401 17 5 13.866 5 10V4M8.5 4V10C8.5 13.2218 10.6766 15.9352 13.6395 16.7501M4 21H20M3 4L10.5 4M17 4L21 4", stroke: "currentColor", "stroke-width": "2", "stroke-linecap": "round", "stroke-linejoin": "round" })));
     }
     static get is() { return "underline-icon"; }
     static get encapsulation() { return "scoped"; }

package/dist/collection/common/icons/warning.js

@@ -5,7 +5,7 @@ export class WarningIcon {
         this.height = '16';
     }
     render() {
-        return (h("svg", { key: 'ebfcd1c97f6ae0518079ec8c6488d64028ca360f', width: this.width, height: this.height, fill: "none", xmlns: "http://www.w3.org/2000/svg" }, h("path", { key: '4091b1705b59de27899c22e3d0cc052c37e56fb8', d: "M7.68551 1.35232L1.12678 13.2773C0.576954 14.277 1.3002 15.5002 2.4411 15.5002H15.5586C16.6995 15.5002 17.4227 14.277 16.8729 13.2773L10.3142 1.35232C9.74426 0.316153 8.2554 0.316157 7.68551 1.35232ZM8.99982 5.25016C9.41403 5.25016 9.74982 5.58595 9.74982 6.00016V10.0002C9.74982 10.4144 9.41403 10.7502 8.99982 10.7502C8.5856 10.7502 8.24982 10.4144 8.24982 10.0002V6.00016C8.24982 5.58595 8.5856 5.25016 8.99982 5.25016ZM9.74982 12.2502C9.74982 12.6644 9.41403 13.0002 8.99982 13.0002C8.5856 13.0002 8.24982 12.6644 8.24982 12.2502C8.24982 11.8359 8.5856 11.5002 8.99982 11.5002C9.41403 11.5002 9.74982 11.8359 9.74982 12.2502Z", fill: "currentColor" })));
+        return (h("svg", { key: 'f25dd3cb90a80e17cbf5370d926afa329f396b65', width: this.width, height: this.height, fill: "none", xmlns: "http://www.w3.org/2000/svg" }, h("path", { key: '95be28aae068d723a24fb7ad4f576c5570b875bc', d: "M7.68551 1.35232L1.12678 13.2773C0.576954 14.277 1.3002 15.5002 2.4411 15.5002H15.5586C16.6995 15.5002 17.4227 14.277 16.8729 13.2773L10.3142 1.35232C9.74426 0.316153 8.2554 0.316157 7.68551 1.35232ZM8.99982 5.25016C9.41403 5.25016 9.74982 5.58595 9.74982 6.00016V10.0002C9.74982 10.4144 9.41403 10.7502 8.99982 10.7502C8.5856 10.7502 8.24982 10.4144 8.24982 10.0002V6.00016C8.24982 5.58595 8.5856 5.25016 8.99982 5.25016ZM9.74982 12.2502C9.74982 12.6644 9.41403 13.0002 8.99982 13.0002C8.5856 13.0002 8.24982 12.6644 8.24982 12.2502C8.24982 11.8359 8.5856 11.5002 8.99982 11.5002C9.41403 11.5002 9.74982 11.8359 9.74982 12.2502Z", fill: "currentColor" })));
     }
     static get is() { return "warning-icon"; }
     static get encapsulation() { return "scoped"; }

package/dist/collection/common/icons/zoom.js

@@ -5,7 +5,7 @@ export class ZoomIcon {
         this.height = '20';
     }
     render() {
-        return (h("svg", { key: '34e0494ed17046b24244a6c6c34eeed046b2051e', width: this.width, height: this.height, fill: "none", xmlns: "http://www.w3.org/2000/svg" }, h("path", { key: '73d4f1b2fed3e361a27aa8b2f5f00c6b50fa9a16', d: "M19.7495 6.85792C19.2077 3.4745 16.5255 0.792345 13.1421 0.250451C12.1175 0.0865155 11.0702 0 10 0C8.92992 0 7.88256 0.0865155 6.85797 0.250451C3.47453 0.792345 0.792373 3.4745 0.250478 6.85792C0.0865433 7.87796 0 8.92987 0 10C0 11.0701 0.0865433 12.1175 0.250478 13.1421C0.792373 16.5255 3.47453 19.2077 6.85797 19.7495C7.88256 19.9135 8.92992 20 10 20C11.0702 20 12.1175 19.9135 13.1421 19.7495C16.5255 19.2077 19.2077 16.5255 19.7495 13.1421C19.9135 12.122 20 11.0701 20 10C20 8.92987 19.9135 7.88251 19.7495 6.85792Z", fill: "url(#paint0_linear_22_6272)" }), h("path", { key: '73df91b845912d3c4ebd8098c9fda7f87814b32a', d: "M12.154 12.1676C12.154 12.7596 11.6759 13.2377 11.0839 13.2377H6.42995C5.24598 13.2377 4.28516 12.2769 4.28516 11.0929V7.87794C4.28516 7.28596 4.76328 6.80786 5.35527 6.80786H10.0092C11.1932 6.80786 12.154 7.7687 12.154 8.95267V12.1676ZM14.8589 7.09475L13.2879 8.27412C13.0193 8.47448 12.8598 8.79324 12.8598 9.13022V10.9153C12.8598 11.2523 13.0193 11.5711 13.2879 11.7714L14.8589 12.9508C15.2141 13.2149 15.715 12.9645 15.715 12.5228V7.5228C15.715 7.08109 15.2096 6.83063 14.8589 7.09475Z", fill: "white" }), h("defs", { key: '8de70ed9809c800b81e4ab03aaff572d21a03dfb' }, h("linearGradient", { key: '847ea24c4de0e2bb92dff337dc13ca0f97135631', id: "paint0_linear_22_6272", x1: "10", y1: "19.9954", x2: "10", y2: "-0.00455379", gradientUnits: "userSpaceOnUse" }, h("stop", { key: '50650c90a77aa5eed24b2c066eff996fb6488eb8', "stop-color": "#003FAE" }), h("stop", { key: 'c80e78d99bae59bfc5d01d4116b3984287f737ff', offset: "0.02", "stop-color": "#0142B7" }), h("stop", { key: '39d8702a07f8b36b78b528b5e461814c47cc5de2', offset: "0.09", "stop-color": "#044BD1" }), h("stop", { key: '654dda002e3263c2622c2395d828a9e10b1ac039', offset: "0.16", "stop-color": "#0752E5" }), h("stop", { key: '76adf371316258276e15e557a58dda478ed42cc0', offset: "0.24", "stop-color": "#0958F4" }), h("stop", { key: '5a7983298abc667ec44cedf171afdfa17d695013', offset: "0.34", "stop-color": "#0A5BFC" }), h("stop", { key: '2284c878ae3e5827eed48c36a86eb666d255a0fe', offset: "0.5", "stop-color": "#0B5CFF" })))));
+        return (h("svg", { key: '039f41db8dfce325a6391bd39f60acdb8e1394f6', width: this.width, height: this.height, fill: "none", xmlns: "http://www.w3.org/2000/svg" }, h("path", { key: 'b22d71be969d53d705dd97e00d4a0eb88beb74f3', d: "M19.7495 6.85792C19.2077 3.4745 16.5255 0.792345 13.1421 0.250451C12.1175 0.0865155 11.0702 0 10 0C8.92992 0 7.88256 0.0865155 6.85797 0.250451C3.47453 0.792345 0.792373 3.4745 0.250478 6.85792C0.0865433 7.87796 0 8.92987 0 10C0 11.0701 0.0865433 12.1175 0.250478 13.1421C0.792373 16.5255 3.47453 19.2077 6.85797 19.7495C7.88256 19.9135 8.92992 20 10 20C11.0702 20 12.1175 19.9135 13.1421 19.7495C16.5255 19.2077 19.2077 16.5255 19.7495 13.1421C19.9135 12.122 20 11.0701 20 10C20 8.92987 19.9135 7.88251 19.7495 6.85792Z", fill: "url(#paint0_linear_22_6272)" }), h("path", { key: 'c8bcccee7f22cb66bc6954dcc05a97a275bf5aac', d: "M12.154 12.1676C12.154 12.7596 11.6759 13.2377 11.0839 13.2377H6.42995C5.24598 13.2377 4.28516 12.2769 4.28516 11.0929V7.87794C4.28516 7.28596 4.76328 6.80786 5.35527 6.80786H10.0092C11.1932 6.80786 12.154 7.7687 12.154 8.95267V12.1676ZM14.8589 7.09475L13.2879 8.27412C13.0193 8.47448 12.8598 8.79324 12.8598 9.13022V10.9153C12.8598 11.2523 13.0193 11.5711 13.2879 11.7714L14.8589 12.9508C15.2141 13.2149 15.715 12.9645 15.715 12.5228V7.5228C15.715 7.08109 15.2096 6.83063 14.8589 7.09475Z", fill: "white" }), h("defs", { key: 'd863c1f899a8662e881cfa3125223a9dfc05beb6' }, h("linearGradient", { key: '1570271aff4effb864fad7b81b7b8fbffe6f77db', id: "paint0_linear_22_6272", x1: "10", y1: "19.9954", x2: "10", y2: "-0.00455379", gradientUnits: "userSpaceOnUse" }, h("stop", { key: '6ed338727a1ca8fc66f350ab0769471ea7ded6fd', "stop-color": "#003FAE" }), h("stop", { key: '2c543297c2c81af4b35433718c7de783a49049f0', offset: "0.02", "stop-color": "#0142B7" }), h("stop", { key: 'e269c0c268fbce8473aac272e7c0a85e7b72349a', offset: "0.09", "stop-color": "#044BD1" }), h("stop", { key: '677952826bd72fefb01ff3737d0d6dbdf860cdcb', offset: "0.16", "stop-color": "#0752E5" }), h("stop", { key: '2e2ddd25d898c7ec92c33524411fc1a18fd72515', offset: "0.24", "stop-color": "#0958F4" }), h("stop", { key: '6a0052ebead7bb4a2b36021740228e55bc5435fb', offset: "0.34", "stop-color": "#0A5BFC" }), h("stop", { key: '4486e0d5d3a9533e0ad1455011d081e0a704002d', offset: "0.5", "stop-color": "#0B5CFF" })))));
     }
     static get is() { return "zoom-icon"; }
     static get encapsulation() { return "scoped"; }

package/dist/collection/common/types.js.map

@@ -1 +1 @@
-{"version":3,"file":"types.js","sourceRoot":"","sources":["../../../src/common/types.ts"],"names":[],"mappings":"","sourcesContent":["import { Appearance, Message, NylasErrorResponse, Notetaker } from '@nylas/core';\nimport { EventEmitter } from '@stencil/core';\n\nexport type DataState = 'loading' | 'ready';\n\ntype StoresType = unknown;\ntype StoreInstances = {\n  [K in keyof StoresType]: StoresType[K];\n};\ntype StoreStateKeys<T> = T extends { state: infer S } ? keyof S : never;\n\n/**\n * This type is used to create a union of all possible store state keys.\n * Example:\n * type CombinedStoreStateKeys = \"nylas.messages\" | \"nylasTheme.colour\"\n */\nexport type CombinedStoreStateKeys<SK extends keyof S, S = StoreInstances> = {\n  [StoreKey in SK]: StoreStateKeys<S[StoreKey]> extends never | undefined ? never : `${StoreKey & string}.${StoreStateKeys<S[StoreKey]> & string}`;\n}[SK];\n\nexport type InternalMessage = {\n  id: string;\n  data: Message;\n  collapse: boolean;\n  showContactData: boolean;\n};\n\nexport type InternalAttachment = {\n  blob: Blob;\n  filename: string;\n  contentType: string;\n  size: number;\n  messageId: string;\n};\n\nexport type MethodKeys<T> = {\n  [K in keyof T]: T[K] extends Function ? K : never;\n}[keyof T];\n\n// TODO: Move this to @nylas/core\nexport type AvailabilityTimeslot = {\n  emails: string[];\n  start_time: number;\n  end_time: number;\n  capacity?: number;\n};\n\nexport type AvailabilityResponse = {\n  order?: string[];\n  time_slots: AvailabilityTimeslot[];\n  participants: {\n    email: string;\n    name: string;\n  }[];\n  duration: number;\n};\n\nexport type UISettingsResponse = {\n  configuration_id: string;\n  app_client_id: string;\n  scheduler: {\n    available_days_in_future: number;\n    min_cancellation_notice: number;\n    min_booking_notice: number;\n    cancellation_policy: string;\n    notetaker_settings?: Notetaker;\n  };\n  organizer: {\n    name: string;\n    email: string;\n  };\n  slug: string;\n  appearance: Appearance;\n  booking_type: string;\n  name: string;\n};\n\n// Extracts a mapped type with keys of T that are EventEmitters, and their corresponding types\nexport type ExtractEventEmitterKeys<T> = {\n  [K in keyof T]: T[K] extends EventEmitter<any> ? K : never;\n}[keyof T];\n\n// Extracts the event type from an EventEmitter\nexport type EventEmitterEventType<T> = T extends EventEmitter<infer U> ? U : never;\n\n// Extracts a mapped type with keys of T that are EventEmitters, and their corresponding types\nexport type ExtractEventEmitterProperties<T> = {\n  [K in keyof T]: T[K] extends EventEmitter<infer U> ? { key: K; eventType: U } : never;\n}[keyof T];\n\nexport type NylasEvent = {\n  booking_id: string;\n  organizer: {\n    email: string;\n    name: string;\n    is_organizer?: boolean;\n  };\n  title: string;\n  description: string;\n  status: string;\n  event_id: string;\n  location: string;\n  booking_ref: string;\n};\n\nexport type BookedEventInfo = NylasEvent & {\n  start_time: string;\n  end_time: string;\n  timezone: string;\n  email_language: string;\n  additional_guests: NylasSchedulerBookingParticipant[];\n  guest: NylasSchedulerBookingParticipant;\n  additional_fields: Record<string, string>;\n};\n\nexport type NylasSchedulerBookingParticipant = { name: string; email: string; nameReadOnly?: boolean; emailReadOnly?: boolean };\n\nexport type NylasSchedulerBookingData = {\n  primaryParticipant: NylasSchedulerBookingParticipant;\n  startTime?: Date;\n  endTime?: Date;\n  timezone?: string;\n  language?: string;\n  guests?: NylasSchedulerBookingParticipant[];\n  additionalFields?: Record<\n    string,\n    {\n      value: string;\n      type?: string;\n      readOnly?: boolean;\n    }\n  >;\n};\n\n/**\n * This type is used to book event and pass data to the redirect page.\n */\nexport type NylasSchedulerBookingDataWithFlatFields = Omit<NylasSchedulerBookingData, 'additionalFields'> & {\n  additionalFields?: Record<string, string>;\n  location?: string;\n  booking_ref?: string;\n};\n\nexport type DataResponseError = Exclude<NylasErrorResponse['error'], undefined>;\nexport type DataResponseReturnType<T = any> = [T, null] | [null, DataResponseError];\n"]}
+{"version":3,"file":"types.js","sourceRoot":"","sources":["../../../src/common/types.ts"],"names":[],"mappings":"","sourcesContent":["import { Appearance, Message, NylasErrorResponse, Notetaker } from '@nylas/core';\nimport { EventEmitter } from '@stencil/core';\n\nexport type DataState = 'loading' | 'ready';\n\ntype StoresType = unknown;\ntype StoreInstances = {\n  [K in keyof StoresType]: StoresType[K];\n};\ntype StoreStateKeys<T> = T extends { state: infer S } ? keyof S : never;\n\n/**\n * This type is used to create a union of all possible store state keys.\n * Example:\n * type CombinedStoreStateKeys = \"nylas.messages\" | \"nylasTheme.colour\"\n */\nexport type CombinedStoreStateKeys<SK extends keyof S, S = StoreInstances> = {\n  [StoreKey in SK]: StoreStateKeys<S[StoreKey]> extends never | undefined ? never : `${StoreKey & string}.${StoreStateKeys<S[StoreKey]> & string}`;\n}[SK];\n\nexport type InternalMessage = {\n  id: string;\n  data: Message;\n  collapse: boolean;\n  showContactData: boolean;\n};\n\nexport type InternalAttachment = {\n  blob: Blob;\n  filename: string;\n  contentType: string;\n  size: number;\n  messageId: string;\n};\n\nexport type MethodKeys<T> = {\n  [K in keyof T]: T[K] extends Function ? K : never;\n}[keyof T];\n\n// TODO: Move this to @nylas/core\nexport type AvailabilityTimeslot = {\n  emails: string[];\n  start_time: number;\n  end_time: number;\n  capacity?: number;\n};\n\nexport type AvailabilityResponse = {\n  order?: string[];\n  time_slots: AvailabilityTimeslot[];\n  participants: {\n    email: string;\n    name: string;\n  }[];\n  duration: number;\n};\n\nexport type UISettingsResponse = {\n  configuration_id: string;\n  app_client_id: string;\n  scheduler: {\n    available_days_in_future: number;\n    min_cancellation_notice: number;\n    min_booking_notice: number;\n    cancellation_policy: string;\n    notetaker_settings?: Notetaker;\n  };\n  organizer: {\n    name: string;\n    email: string;\n  };\n  slug: string;\n  appearance: Appearance;\n  booking_type: string;\n  name: string;\n};\n\n// Extracts a mapped type with keys of T that are EventEmitters, and their corresponding types\nexport type ExtractEventEmitterKeys<T> = {\n  [K in keyof T]: T[K] extends EventEmitter<any> ? K : never;\n}[keyof T];\n\n// Extracts the event type from an EventEmitter\nexport type EventEmitterEventType<T> = T extends EventEmitter<infer U> ? U : never;\n\n// Extracts a mapped type with keys of T that are EventEmitters, and their corresponding types\nexport type ExtractEventEmitterProperties<T> = {\n  [K in keyof T]: T[K] extends EventEmitter<infer U> ? { key: K; eventType: U } : never;\n}[keyof T];\n\nexport type NylasEvent = {\n  booking_id: string;\n  organizer: {\n    email: string;\n    name: string;\n    is_organizer?: boolean;\n  };\n  title: string;\n  description: string;\n  status: string;\n  event_id: string;\n  location: string;\n  booking_ref: string;\n};\n\nexport type BookedEventInfo = NylasEvent & {\n  start_time: string;\n  end_time: string;\n  timezone: string;\n  email_language: string;\n  additional_guests: NylasSchedulerBookingParticipant[];\n  guest: NylasSchedulerBookingParticipant;\n  additional_fields: Record<string, string>;\n};\n\nexport type NylasSchedulerBookingParticipant = {\n  /** Setting this to an empty string clears a previously seeded value; omitting it leaves that value alone. */\n  name: string;\n  /** Setting this to an empty string clears a previously seeded value; omitting it leaves that value alone. */\n  email: string;\n  /**\n   * Render the name field as read-only. The prefilled value is shown but cannot be edited.\n   * Ignored when `nameHidden` is true.\n   */\n  nameReadOnly?: boolean;\n  /**\n   * Render the email field as read-only. The prefilled value is shown but cannot be edited.\n   * Ignored when `emailHidden` is true.\n   */\n  emailReadOnly?: boolean;\n  /**\n   * Omit the name field from the booking form entirely. The prefilled `name` is still\n   * submitted with the booking. Requires a prefilled value that survives sanitization: set\n   * without one, the field is rendered anyway (so the booker is never stuck on a required\n   * error with no input to fix) and the misconfiguration is reported on the console.\n   */\n  nameHidden?: boolean;\n  /**\n   * Omit the email field from the booking form entirely. The prefilled `email` is still\n   * submitted with the booking. Requires a prefilled value that survives sanitization: set\n   * without one, the field is rendered anyway (so the booker is never stuck on a required\n   * error with no input to fix) and the misconfiguration is reported on the console.\n   */\n  emailHidden?: boolean;\n};\n\nexport type NylasSchedulerBookingData = {\n  primaryParticipant: NylasSchedulerBookingParticipant;\n  startTime?: Date;\n  endTime?: Date;\n  timezone?: string;\n  language?: string;\n  guests?: NylasSchedulerBookingParticipant[];\n  additionalFields?: Record<\n    string,\n    {\n      value: string;\n      type?: string;\n      readOnly?: boolean;\n    }\n  >;\n};\n\n/**\n * This type is used to book event and pass data to the redirect page.\n */\nexport type NylasSchedulerBookingDataWithFlatFields = Omit<NylasSchedulerBookingData, 'additionalFields'> & {\n  additionalFields?: Record<string, string>;\n  location?: string;\n  booking_ref?: string;\n};\n\nexport type DataResponseError = Exclude<NylasErrorResponse['error'], undefined>;\nexport type DataResponseReturnType<T = any> = [T, null] | [null, DataResponseError];\n"]}

package/dist/collection/components/design-system/button-component/button-component.js

@@ -9,7 +9,7 @@ export class ButtonComponent {
     }
     render() {
         const className = `button-${this.variant}` + (this.disabled ? ' disabled' : '');
-        return (h("button", { key: '96ccf32b8d9df2950f00992ffaf98428ffaf7149', class: className, disabled: this.disabled, type: this.type, title: this.tooltip, onClick: this.clickHandler, onMouseOver: this.mouseOverHandler, onMouseOut: this.mouseOutHandler, onFocus: this.focusHandler, onBlur: this.blurHandler }, !!this.isLoading && h("loading-icon", { key: '899efdeeb0a2a0431a0cea6c4d1fe0f49ff4d6b4', slot: "icon" }), h("slot", { key: 'f8cb2e32f1692819d38c3f8144d1ba55ad7270b4' })));
+        return (h("button", { key: 'a6fa48fef8026f48c43fa91401b3dcab0f79b145', class: className, disabled: this.disabled, type: this.type, title: this.tooltip, onClick: this.clickHandler, onMouseOver: this.mouseOverHandler, onMouseOut: this.mouseOutHandler, onFocus: this.focusHandler, onBlur: this.blurHandler }, !!this.isLoading && h("loading-icon", { key: '25674b8e90302cf1c10ea14e7fcaf72a0ee43242', slot: "icon" }), h("slot", { key: 'a86f251bcee3f9678fca0c20403cbc679b1fc891' })));
     }
     static get is() { return "button-component"; }
     static get encapsulation() { return "scoped"; }

package/dist/collection/components/design-system/checkbox-component/checkbox-component.js

@@ -58,7 +58,7 @@ export class CheckboxComponent {
         });
     }
     render() {
-        return (h("div", { key: '4bba5a19bd46ed28887c0e9563463736f0797316', class: "checkbox-container" }, h("label", { key: '9b39faabdacc481f942ccd2fce8cda13b4004176', title: this.readOnly ? 'read-only field' : undefined, class: { readonly: this.readOnly } }, h("input", { key: 'e607c2c0c08494a60e4bf1868c64bd6c5fbc9fdb', type: "checkbox", disabled: this.readOnly, readOnly: this.readOnly, name: this.name, title: this.readOnly ? 'read-only field' : undefined, checked: this.isChecked, onChange: () => this.toggleCheck() }), h("span", { key: '741e07baa7163e13f1f15a1f83e46987e3b5e833', class: "checkmark" }), h("slot", { key: 'e3a6969e97b7b715e4e519511ea14e33121f93da', name: "label" }, h("span", { key: '779fdf99ae7da8c328caa0a52eaeedbb8ab38b5c', class: "label", part: "checkbox-label-span" }, this.label, this.required && h("span", { key: '4557ec4fe2202572b24612780b89ba16ff1d695a', class: "required" }, "*")))), this.error && h("p", { key: '8f91d5f9196627fabf3631a37df40c6c862bd753', class: "error" }, this.error)));
+        return (h("div", { key: '187b2c8923636d503d65188afe85da56412e76a5', class: "checkbox-container" }, h("label", { key: '8a9868991845ac4ccb8dd11368c85c87fcafba8a', title: this.readOnly ? 'read-only field' : undefined, class: { readonly: this.readOnly } }, h("input", { key: 'bf3bb86e4950d99af9a7d2cdf52180f35654668c', type: "checkbox", disabled: this.readOnly, readOnly: this.readOnly, name: this.name, title: this.readOnly ? 'read-only field' : undefined, checked: this.isChecked, onChange: () => this.toggleCheck() }), h("span", { key: '40e3b50f745e404e386f7259fa7fca237e4c482a', class: "checkmark" }), h("slot", { key: '928c5cb49a1c1b2618427acb7d734f8689de2c9e', name: "label" }, h("span", { key: 'b6f21f6459867b73dc01c0219833ad7e356f7a07', class: "label", part: "checkbox-label-span" }, this.label, this.required && h("span", { key: 'f1a64814d615db51a3441003c716593c9ce19200', class: "required" }, "*")))), this.error && h("p", { key: '54326db9c51b21b730d7d51f0926507c210784a9', class: "error" }, this.error)));
     }
     static get is() { return "checkbox-component"; }
     static get encapsulation() { return "shadow"; }

package/dist/collection/components/design-system/checkbox-group/checkbox-group.js

@@ -79,7 +79,7 @@ export class CheckboxGroup {
         this.handleCheckboxToggle(event);
     }
     render() {
-        return (h("div", { key: 'fe97aab12e7f1be11a0f565a1029813c2f0eadcd', class: "checkbox-group-container" }, this.label && (h("div", { key: '2bca129a3f5d785bd47a7a95e75726e1c0a48c14', class: "group-label" }, this.label, this.required && h("span", { key: '0ee4c2e9d60c8f3cce2e341af765579192378a1b', class: "required" }, "*"))), h("div", { key: '6182ce7752d1fe41dcad71014868b7af411c1508', class: `checkbox-list ${this.direction}` }, this.options.map(option => (h("checkbox-component", { name: `${this.name}-${option.value}`, label: option.label, checked: this.selectedValues.includes(option.value), readOnly: option.disabled, required: this.required, themeConfig: this.themeConfig })))), this.error && h("p", { key: '00719569b2db2dd41d5ff3ba332dc48d03016dcc', class: "error" }, this.error)));
+        return (h("div", { key: '23978e91b423c794f1133c3841ac9a01e99835e4', class: "checkbox-group-container" }, this.label && (h("div", { key: '72d07a1d8a9f40d96f14925fe4d08024ce00dba2', class: "group-label" }, this.label, this.required && h("span", { key: '6386ad4a054a90812738c84be2f5304449c28971', class: "required" }, "*"))), h("div", { key: 'b014066301e1ed8f79502eb74efdeefc2e7e7ff9', class: `checkbox-list ${this.direction}` }, this.options.map(option => (h("checkbox-component", { name: `${this.name}-${option.value}`, label: option.label, checked: this.selectedValues.includes(option.value), readOnly: option.disabled, required: this.required, themeConfig: this.themeConfig })))), this.error && h("p", { key: '55c2b20c4da9a17cc4d98225cba5c5bcdbb31061', class: "error" }, this.error)));
     }
     static get is() { return "checkbox-group"; }
     static get encapsulation() { return "shadow"; }

package/dist/collection/components/design-system/input-color-picker/input-color-picker.js

@@ -53,11 +53,11 @@ export class InputColorPicker {
         }
     }
     render() {
-        return (h("div", { key: '4b096fb280524883192fca6ac1a1c6b5b99c8a3b', class: "color-picker-container", part: "icp_color-picker", tabindex: "0", onKeyDown: e => this.handleKeyDown(e) }, h("input", { key: '76b8a2488eff84c9098f38eb024f8ad73686ad89', type: "color", ref: el => (this.inputRef = el), id: this.name, name: this.name, value: this.selectedColor, tabindex: "-1", onFocus: () => this.handleFocus(), onBlur: () => this.handleBlur(), onInput: e => this.handleInput(e), onChange: e => this.handleChange(e), onKeyDown: e => this.handleKeyDown(e) }), h("label", { key: 'e7d72339ae088211580e27cca9706df41bdf39b1', part: "icp_color-picker-button", htmlFor: this.name, class: { labelBtn: true, open: this.isOpen, error: !!this.errorMessage }, "aria-haspopup": "listbox", "aria-expanded": this.isOpen ? 'true' : 'false', "aria-label": this.name }, h("span", { key: '4d94a10ee82e0b9d7a66db5101f5680ada1974ea', class: "selected-option", part: "icp_color-picker-button-selected-label", "data-lang": this.currentLanguage }, this.selectedColor || i18next.t('nylasPageStyling.selectAColor')), h("span", { key: '117d51a0d01b21037203f69fd3b8024d83183cc0', class: {
+        return (h("div", { key: 'e993ca8360d8902f62d8e1bbd8753ccb07453098', class: "color-picker-container", part: "icp_color-picker", tabindex: "0", onKeyDown: e => this.handleKeyDown(e) }, h("input", { key: '45d4a6b18f0335a3931610e20b95f7fc42a4fb36', type: "color", ref: el => (this.inputRef = el), id: this.name, name: this.name, value: this.selectedColor, tabindex: "-1", onFocus: () => this.handleFocus(), onBlur: () => this.handleBlur(), onInput: e => this.handleInput(e), onChange: e => this.handleChange(e), onKeyDown: e => this.handleKeyDown(e) }), h("label", { key: '589176bcd803a073136e86e88cb676d3cd5c9fcf', part: "icp_color-picker-button", htmlFor: this.name, class: { labelBtn: true, open: this.isOpen, error: !!this.errorMessage }, "aria-haspopup": "listbox", "aria-expanded": this.isOpen ? 'true' : 'false', "aria-label": this.name }, h("span", { key: '5d200d0444e032fefa85f26fcd5fb86c4c3ff6e3', class: "selected-option", part: "icp_color-picker-button-selected-label", "data-lang": this.currentLanguage }, this.selectedColor || i18next.t('nylasPageStyling.selectAColor')), h("span", { key: '92c15366c58aecfb5e6807c35545372a6a923ba9', class: {
                 open: this.isOpen,
                 closed: !this.isOpen,
                 chevron: true,
-            }, "aria-hidden": "true" }, h("chevron-icon", { key: '06f142cddd9cc8d4db0cefdf185e1f72c3860c72', width: "16", height: "16" })), this.errorMessage && h("span", { key: '1a212662e0f4aa862183556f7c2457ed19023755', class: "error help-text" }, this.errorMessage))));
+            }, "aria-hidden": "true" }, h("chevron-icon", { key: '4ca361b477862f45962a8bbfd23ca2b8f7298364', width: "16", height: "16" })), this.errorMessage && h("span", { key: 'bc155d1ea1bdd097c1e10fd6565c7bad7a1de0b4', class: "error help-text" }, this.errorMessage))));
     }
     static get is() { return "input-color-picker"; }
     static get encapsulation() { return "shadow"; }

package/dist/collection/components/design-system/input-component/input-component.js

@@ -132,7 +132,7 @@ export class InputComponent {
         }
     }
     render() {
-        return (h("label", { key: 'c6206c7365c42dc60b3deb055cee48eede6a677f', part: this.error ? 'ic__label ic__label--error' : 'ic__label', class: { error: !!this.error } }, this.label && (h("p", { key: '205f0b659bc9aa025f6d4fe482ee6ef701d7dc7e' }, h("span", { key: 'f227b5f6e331d273e4cd45121ea8b9e3b70938cf', class: "label" }, this.label), this.required && h("span", { key: '6909ea1480b25cce55402b565d018335e35ae3ed', class: "required" }, "*"))), h("div", { key: '0d0934358c0d3f50c202c0bc29ce1c1a6ebdbd57', part: "ic__input_wrapper", class: "input_wrapper" }, h("input", { key: '5bf3ef3639f44cf3ef42e827f528bd28ea31b499', type: this.type, name: this.name, part: this.error ? 'ic__input ic__input--error' : 'ic__input', title: this.readOnly ? 'read-only field' : undefined, readOnly: this.readOnly, autoFocus: this.autoFocus, value: this.value, maxLength: this.maxLength, max: this.type === 'number' ? this.maxValue : undefined, min: this.type === 'number' ? this.minValue : undefined, placeholder: this.placeholder, class: { error: !!this.error }, onInput: e => this.handleInput(e), onFocus: () => this.handleFocus(), onBlur: () => this.handleBlur() }), h("slot", { key: '669eb0595d3423db56087f7160c529a59ff6e81e', name: "additional-input" })), this.error && (h("span", { key: '16cd11aa774b3248dcb2b3279abe713ce6625ddd', class: "error help-text", part: "ic__error_message" }, this.error))));
+        return (h("label", { key: 'cc04f166a27d6211f29f265a1f62076be7b869aa', part: this.error ? 'ic__label ic__label--error' : 'ic__label', class: { error: !!this.error } }, this.label && (h("p", { key: '42a568c705d9bf8f12641006007a0717fbcd059a' }, h("span", { key: '61d65f6830ae7a17eb4fe3a950ddea19280818ac', class: "label" }, this.label), this.required && h("span", { key: '597d87b82703ffd9b31ebb7b42d871712265ed05', class: "required" }, "*"))), h("div", { key: '7bf70f095e7f21289d1600567e41a27c3749b635', part: "ic__input_wrapper", class: "input_wrapper" }, h("input", { key: '5b8e64723cac474f9cc3db57e4b74534ca2bcb3d', type: this.type, name: this.name, part: this.error ? 'ic__input ic__input--error' : 'ic__input', title: this.readOnly ? 'read-only field' : undefined, readOnly: this.readOnly, autoFocus: this.autoFocus, value: this.value, maxLength: this.maxLength, max: this.type === 'number' ? this.maxValue : undefined, min: this.type === 'number' ? this.minValue : undefined, placeholder: this.placeholder, class: { error: !!this.error }, onInput: e => this.handleInput(e), onFocus: () => this.handleFocus(), onBlur: () => this.handleBlur() }), h("slot", { key: '87bbc34c49a1a9a6a456b1bb9475181a319c5a50', name: "additional-input" })), this.error && (h("span", { key: '526ff2c41b85e378b578170c0f26518cfb72e3b5', class: "error help-text", part: "ic__error_message" }, this.error))));
     }
     static get is() { return "input-component"; }
     static get encapsulation() { return "shadow"; }

package/dist/collection/components/design-system/input-dropdown/input-dropdown.js

@@ -213,7 +213,7 @@ export class InputDropdown {
         }
     }
     render() {
-        return (h("div", { key: '1a897f13c3ad56fadbde3c3954b2d9b5f34b1c59', class: "dropdown", part: "id_dropdown" }, h("input", { key: '79d6323d90e60ab7c1815161072f4d1cb196d871', type: "text", name: this.name, id: this.name, part: "id_dropdown-input", class: { dropbtn: true, open: this.isOpen }, value: this.inputValue, onClick: (e) => {
+        return (h("div", { key: 'ccfb6ebafcb7ffe8fbe09a7915c6271c1da89d90', class: "dropdown", part: "id_dropdown" }, h("input", { key: '3740e437fa3e4265ce99e520f975819e1db4508f', type: "text", name: this.name, id: this.name, part: "id_dropdown-input", class: { dropbtn: true, open: this.isOpen }, value: this.inputValue, onClick: (e) => {
                 this.toggleDropdown();
                 this.shouldAutoScroll = true;
                 this.handleClick(e);

package/dist/collection/components/design-system/input-image-url/input-image-url.js

@@ -112,7 +112,7 @@ export class InputImageUrl {
         });
     }
     render() {
-        return (h(Host, { key: '46d580188755e02146220a428aeba0955c0bde5b' }, h("div", { key: '1809ef8f7a0a6e036aba5691c72671743e7ea7f2', class: "logo-container" }, h("div", { key: '825f3aee26e50ee01064920efc998885e11b894b', class: "input-container" }, h("input-component", { key: '6d66bdee726c4fb86f0f4e3995fad6ab2513ec84', name: this.name, id: this.name, type: "text", required: false, themeConfig: this.themeConfig, exportparts: "ic_input: iiu__logo-input-textfield", defaultValue: this.imageUrl ?? '' }), this.error && h("span", { key: '0999ac25d529d7d0c8725ed9fb2332725a61a49a', class: "error-message" }, this.error)), this.currentImageUrl && !this.error && (h("div", { key: '9ac1226670cccb7063984b8bd80218036ab65acc', class: "logo" }, h("img", { key: '16aa6c832ccccff8c94fa1e6bbb9efc1e400900b', src: this.currentImageUrl, alt: "Logo" }))))));
+        return (h(Host, { key: '717df974ef78925720b2e16e6f45ccad7d091e93' }, h("div", { key: '7edd5256a3f44411dee2b709eb69fb098c9f5fde', class: "logo-container" }, h("div", { key: '3efcd46f09572706c8d792bf8753651a1a03d0f5', class: "input-container" }, h("input-component", { key: '4470d2652194d9ae4b55643cf843c0be32fc954d', name: this.name, id: this.name, type: "text", required: false, themeConfig: this.themeConfig, exportparts: "ic_input: iiu__logo-input-textfield", defaultValue: this.imageUrl ?? '' }), this.error && h("span", { key: 'd4f2997f5a424d736b01ada0aba57a6f5aca3b90', class: "error-message" }, this.error)), this.currentImageUrl && !this.error && (h("div", { key: '940e8e651b2d92642b1668588beca420471534fa', class: "logo" }, h("img", { key: '2f24eccdcda75b3115e7821c8b6c30025e9a8b0a', src: this.currentImageUrl, alt: "Logo" }))))));
     }
     static get is() { return "input-image-url"; }
     static get encapsulation() { return "shadow"; }

package/dist/collection/components/design-system/multi-select-dropdown/multi-select-dropdown.js

@@ -190,9 +190,9 @@ export class MultiSelectDropdown {
             }, class: { selected: !!option.selected, disabled: !!option.disabled } }, h("label", { htmlFor: option.value }, h("input", { "aria-hidden": "true", id: option.value, type: "checkbox", checked: option.selected, disabled: !!option?.disabled }), h("span", null, option.label))));
     }
     render() {
-        return (h(Host, { key: '377989dab511f67cd9d0ebc7d5a18767fe33371d' }, h("div", { key: 'b48b1bac54a6db475c56bb7dd82f4f7e32eae083', class: "dropdown", part: "msd_dropdown" }, h("label", { key: 'e41d7acfda9c43c46c318051c9c8f758fccfb697', class: "dropdown-label", part: "msd_dropdown-label" }, h("p", { key: '2114c39648780206139c0981ef1f4fd3b32d1ef9' }, h("span", { key: 'ab8f7928a7ff5218c2cf080d1dcf901ac3140f77', class: "label" }, this.label), this.required && h("span", { key: '4e9e47ef9a8d27e7d8f94747abf9287bbeb14e04', class: "required" }, "*")), h("slot", { key: 'b9a5a0615e984b815aef31d3bc9d35e1424328aa', name: "label-icon", "aria-hidden": "true" })), h("button", { key: '06c9e68cad859f3c355982c5f52ddd35bf25fd40', name: this.name, part: `msd_dropdown-button ${this.error ? 'msd_dropdown-button--error' : ''}`, class: { dropbtn: true, open: this.isOpen, error: !!this.error }, onClick: () => this.toggleDropdown(), disabled: this.readOnly, title: this.readOnly ? 'read-only field' : undefined, "aria-haspopup": "listbox", "aria-expanded": this.isOpen ? 'true' : 'false', "aria-label": this.name, onKeyDown: e => this.handleSelectButtonKeyDown(e) }, h("slot", { key: 'a72aecf06d86fd375e25300c1649113e3a09234a', name: "select-icon", "aria-hidden": "true" }), h("span", { key: '247ae4b99460f6bba4481a27f35b4a161d65586b', class: "selected-option", part: "msd_dropdown-button-selected-label" }, this.getSelectedOptions().length > 1
+        return (h(Host, { key: '35f09313a3598bd10d804706e0eb5b82098148f8' }, h("div", { key: '1c79aaa9eae8ec374ddac5f315e4010602e303df', class: "dropdown", part: "msd_dropdown" }, h("label", { key: 'e86b85637b7d4ec2dfc97023c3a41833ed596a0b', class: "dropdown-label", part: "msd_dropdown-label" }, h("p", { key: 'b85bcca319cbebdaf83a05c14b22a458b7a5d14d' }, h("span", { key: '0f63480e50968c83879248c90e01e1b473933cab', class: "label" }, this.label), this.required && h("span", { key: '906682ef058ef382ce706f38710a060928596bd3', class: "required" }, "*")), h("slot", { key: '70dd7a8df870e1ae83b8ab24f61f893b5810276f', name: "label-icon", "aria-hidden": "true" })), h("button", { key: '20f2bb9a627fcdc0bccf30a0c7b0d1ab91090f0c', name: this.name, part: `msd_dropdown-button ${this.error ? 'msd_dropdown-button--error' : ''}`, class: { dropbtn: true, open: this.isOpen, error: !!this.error }, onClick: () => this.toggleDropdown(), disabled: this.readOnly, title: this.readOnly ? 'read-only field' : undefined, "aria-haspopup": "listbox", "aria-expanded": this.isOpen ? 'true' : 'false', "aria-label": this.name, onKeyDown: e => this.handleSelectButtonKeyDown(e) }, h("slot", { key: '5673a70b5990f8976da42e3de72d215a65061257', name: "select-icon", "aria-hidden": "true" }), h("span", { key: '1926567c8e06f40473d2a33cd7c70539f1ffe603', class: "selected-option", part: "msd_dropdown-button-selected-label" }, this.getSelectedOptions().length > 1
             ? this.multipleOptionsSelectedLabel
-            : this.availableOptions.filter(o => o.selected)[0]?.label ?? this.selectAtLeastOneOptionLabel ?? this.availableOptions[0]?.label), h("span", { key: 'ebcc202059542c797f12a64912b98b51bba55578', class: this.isOpen ? 'open' : 'closed', "aria-hidden": "true" }, h("chevron-icon", { key: 'c9315cd2929d1ce08f7417f2c5a814f980758d8f', width: "16", height: "16" }))), this.error ? (h("span", { class: "error", part: "msd_dropdown_error" }, this.error)) : null, h("div", { key: '346e0ef8a75edb234287dc81737c216c8f12058d', class: 'selected-options' }, this.getSelectedOptions().map(option => (h("span", { class: "selected-option" }, option.label, h("button", { disabled: this.readOnly || !!option?.disabled, key: option.label, onClick: () => this.selectOption(option) }, h("close-icon", null)))))), this.isOpen ? (h("div", { class: "dropdown-content", part: "msd_dropdown-content" }, h("ul", { tabindex: "-1", role: "listbox", "aria-label": this.name, "aria-multiselectable": true, "aria-activedescendant": this.ariaActivedescendant, onKeyDown: e => this.handleListboxKeydown(e) }, this.availableOptions.map(option => this.renderOption(option))))) : null)));
+            : this.availableOptions.filter(o => o.selected)[0]?.label ?? this.selectAtLeastOneOptionLabel ?? this.availableOptions[0]?.label), h("span", { key: '8b601c54b862b11bc6bca601085c63ad6697b5eb', class: this.isOpen ? 'open' : 'closed', "aria-hidden": "true" }, h("chevron-icon", { key: '94ed8ff3e6392c439203626a67b6587f13decbbe', width: "16", height: "16" }))), this.error ? (h("span", { class: "error", part: "msd_dropdown_error" }, this.error)) : null, h("div", { key: 'b089a43fc655ea15b46c769f22e60cd7c679f6b7', class: 'selected-options' }, this.getSelectedOptions().map(option => (h("span", { class: "selected-option" }, option.label, h("button", { disabled: this.readOnly || !!option?.disabled, key: option.label, onClick: () => this.selectOption(option) }, h("close-icon", null)))))), this.isOpen ? (h("div", { class: "dropdown-content", part: "msd_dropdown-content" }, h("ul", { tabindex: "-1", role: "listbox", "aria-label": this.name, "aria-multiselectable": true, "aria-activedescendant": this.ariaActivedescendant, onKeyDown: e => this.handleListboxKeydown(e) }, this.availableOptions.map(option => this.renderOption(option))))) : null)));
     }
     static get is() { return "multi-select-dropdown"; }
     static get encapsulation() { return "shadow"; }

package/dist/collection/components/design-system/nylas-date-component/nylas-date-component.js

@@ -115,7 +115,7 @@ export class NylasDateComponent {
         }
     }
     render() {
-        return (h("label", { key: '2b85ec5e76a7d585403b355b2e143ced48e98b81', part: "ic__label", class: { error: !!this.error || this.hasError } }, this.label && (h("p", { key: '3a7dce7c85961bb6695beef195d10f03eb8d8d33' }, h("span", { key: '0e4ddb991c5b5e9684f36eaac79c1961a33bf346', class: "label" }, this.label), this.required && h("span", { key: '9c4ff17b839a72f9a8b6d0228773f820be85f918', class: "required" }, "*"))), h("div", { key: 'ee9732ec821f68192191b368e3cd62a3f0f9d3cd', part: "ic__input_wrapper", class: "input_wrapper" }, h("input", { key: '56ec6ac542c470e23395b8f098932fdc4a0e2d6f', type: "date", min: this.minDate, value: this.value, name: this.name, part: "ic__date", title: this.readOnly ? 'read-only field' : undefined, readOnly: this.readOnly, autoFocus: this.autoFocus, maxLength: this.maxLength, placeholder: this.placeholder, class: { error: !!this.error || this.hasError }, onInput: e => this.handleInput(e), onFocus: () => this.handleFocus(), onBlur: () => this.handleBlur() }), h("slot", { key: 'b3158bc42f1586392ebc9304df23973e5bef5a7a', name: "additional-input" })), this.error && h("span", { key: 'abc73483451f6b009b6e830cdbc0a737728252c7', class: "error help-text" }, this.error)));
+        return (h("label", { key: '6cabab3a3c1f6b55039a92e64f4d0c8908044405', part: "ic__label", class: { error: !!this.error || this.hasError } }, this.label && (h("p", { key: 'a418e57a05ea6bf8defc8f9b2da248a3d18ed227' }, h("span", { key: '13ae0fb0cbcc6196dcf71032cde140ef1c61e9fb', class: "label" }, this.label), this.required && h("span", { key: '3f69103970b5b7518bc90ff1df01706354963832', class: "required" }, "*"))), h("div", { key: '7595277a818263718c66b88ee3b39a377bb22420', part: "ic__input_wrapper", class: "input_wrapper" }, h("input", { key: '65a2a611d4d3cbb25a98d55ef4f53d014943125a', type: "date", min: this.minDate, value: this.value, name: this.name, part: "ic__date", title: this.readOnly ? 'read-only field' : undefined, readOnly: this.readOnly, autoFocus: this.autoFocus, maxLength: this.maxLength, placeholder: this.placeholder, class: { error: !!this.error || this.hasError }, onInput: e => this.handleInput(e), onFocus: () => this.handleFocus(), onBlur: () => this.handleBlur() }), h("slot", { key: '809c04fb53ad65e8974c7660487add6d171fd942', name: "additional-input" })), this.error && h("span", { key: '1e33ea77cafd1615eb86fa38d388ab322bfc302f', class: "error help-text" }, this.error)));
     }
     static get is() { return "nylas-date-component"; }
     static get encapsulation() { return "shadow"; }

package/dist/collection/components/design-system/radio-button-group/radio-button-group.js

@@ -65,7 +65,7 @@ export class RadioButtonGroup {
         });
     }
     render() {
-        return (h("div", { key: '7d4f9dbc6fb35ba0d6ec854c67b04f320888bff0', class: "radio-group" }, h("slot", { key: '4e8f1ebf95e25021f49c0973bb16609730303c2d', name: "label" }, this.label && (h("p", { key: 'a944e18fac56caeb5582028c38d055b399cd6693', class: { error: !!this.error } }, h("span", { key: '2730c691418b2890b52b182d0389eb4a6ea42edb', class: "label" }, this.label), this.required && h("span", { key: 'ec2d3213ab090cf75a9499c03f64b1cf8ac860b8', class: "required" }, "*")))), this.options.map(option => (h("label", null, h("div", { class: "radio-option" }, h("input", { type: "radio", disabled: this.readOnly, readOnly: this.readOnly, title: this.readOnly ? 'read-only field' : undefined, name: this.name, value: option.value, checked: this.selectedValue === option.value, onChange: () => this.handleChange(option.value) }), h("p", null, h("span", { class: "title" }, option.label), h("span", { class: "description" }, option.description)))))), this.error && h("span", { key: 'bbe79d56c58731dd23fd68f6efea548faffcbc25', class: "error help-text" }, this.error)));
+        return (h("div", { key: '719b91f18f56222e85c7d40ec65447b3015fb9b7', class: "radio-group" }, h("slot", { key: '644d78deeec55bed39d12f5ff0b25a0c1f38b2ff', name: "label" }, this.label && (h("p", { key: '318698f30f98d88621c63e10a4b60ec2eea28816', class: { error: !!this.error } }, h("span", { key: '4d0273ad0f99af9411d23e54d966f52e79ac6f98', class: "label" }, this.label), this.required && h("span", { key: 'd693f96547424c53ea38b021620f1f6e62fa3ab1', class: "required" }, "*")))), this.options.map(option => (h("label", null, h("div", { class: "radio-option" }, h("input", { type: "radio", disabled: this.readOnly, readOnly: this.readOnly, title: this.readOnly ? 'read-only field' : undefined, name: this.name, value: option.value, checked: this.selectedValue === option.value, onChange: () => this.handleChange(option.value) }), h("p", null, h("span", { class: "title" }, option.label), h("span", { class: "description" }, option.description)))))), this.error && h("span", { key: '12496f14dc724e987f8446848c09fc8066d9b9aa', class: "error help-text" }, this.error)));
     }
     static get is() { return "radio-button-group"; }
     static get encapsulation() { return "shadow"; }

package/dist/collection/components/design-system/select-dropdown/select-dropdown.js

@@ -204,11 +204,11 @@ export class SelectDropdown {
     }
     render() {
         const buttonText = this.generateButtonText(this.selectedOption, this.dropdownButtonText);
-        return (h("div", { key: '4170e7e434aab1c475f71321a491af7aaf7dfa3f', class: "dropdown", part: "sd_dropdown" }, h("label", { key: '52383728e0c4b7110468f087f6611b0949193b0c', part: "sd_dropdown_label", class: { error: !!this.error } }, this.label && (h("p", { key: 'acd17dc97d25bcf6d1fedd2a41e22c2f0387d698' }, h("span", { key: '95deadc9b2fa5b228aecedf5228253acf7c26f68', class: "label" }, this.label), this.required && h("span", { key: '6bc582f2f27e4eb882ab83c65e28ce2f9c4f0c35', class: "required" }, "*"))), h("button", { key: 'e5312a988b2249327771e1f909945c9dfe972e43', part: "sd_dropdown-button", class: { dropbtn: true, open: this.isOpen, error: !!this.error }, onClick: () => this.toggleDropdown(), disabled: this.readOnly, "aria-haspopup": "listbox", title: this.readOnly ? 'read-only field' : buttonText, "aria-expanded": this.isOpen ? 'true' : 'false', "aria-label": this.name, onKeyDown: e => this.handleSelectButtonKeyDown(e) }, h("slot", { key: 'fdeec054aeed485f92c47eed1fccaee493cd3ad1', name: "select-icon", "aria-hidden": "true" }), h("span", { key: '1e4a3a45f952d1504c25638b51bab2c6785cb870', class: "selected-option", part: "sd_dropdown-button-selected-label" }, buttonText), this.withChevron && (h("span", { key: '1fb55d995640262e24b3466ebfab75c5f14a44f2', class: {
+        return (h("div", { key: '6c5cb78b59c3789456bcfac00721955310eaf75f', class: "dropdown", part: "sd_dropdown" }, h("label", { key: '8b0682806ea69f269d66ea9f4588b34880e44d9f', part: "sd_dropdown_label", class: { error: !!this.error } }, this.label && (h("p", { key: 'fef9aa64a13ca135afa919c25ad769f2b579d23e' }, h("span", { key: '80063a8618b491a6e4d8eee296dc0f43480885e4', class: "label" }, this.label), this.required && h("span", { key: 'bb95ef82f4a96e8e628ccff429aa88ef6409bedf', class: "required" }, "*"))), h("button", { key: '0db2d106eb6bee17c11739a4701678e7e95c68da', part: "sd_dropdown-button", class: { dropbtn: true, open: this.isOpen, error: !!this.error }, onClick: () => this.toggleDropdown(), disabled: this.readOnly, "aria-haspopup": "listbox", title: this.readOnly ? 'read-only field' : buttonText, "aria-expanded": this.isOpen ? 'true' : 'false', "aria-label": this.name, onKeyDown: e => this.handleSelectButtonKeyDown(e) }, h("slot", { key: '9948ed4af4c57d39ff7053162c9b4772bac6bb26', name: "select-icon", "aria-hidden": "true" }), h("span", { key: '457ab155450fd878947ffb97738e49c45d44da11', class: "selected-option", part: "sd_dropdown-button-selected-label" }, buttonText), this.withChevron && (h("span", { key: '2fb235ee2229fe8421522be693842dd105987db5', class: {
                 open: this.isOpen,
                 closed: !this.isOpen,
                 chevron: true,
-            }, "aria-hidden": "true" }, h("chevron-icon", { key: '7634b5110dfa9cb30d2cf08697d5e97be9187bd2', width: "16", height: "16" })))), this.error && h("span", { key: '616f39cb394df4ce568353753c9a962f5ed06efa', class: "error help-text" }, this.error)), this.isOpen ? (h("div", { class: "dropdown-content", part: "sd_dropdown-content" }, this.withSearch && (h("div", { class: { 'search-box': true, 'open': this.isOpen } }, h("search-icon", { width: "15", height: "15", class: 'icon' }), h("input", { type: "text", role: "combobox", placeholder: this.searchPlaceholder, value: this.searchValue, ref: el => (this.inputRef = el), onInput: event => this.filterOptions(event), onKeyDown: e => this.handleComboboxKeyDown(e) }))), h("ul", { tabindex: "-1", role: "listbox", "aria-label": this.name, "aria-activedescendant": this.ariaActivedescendant, onKeyDown: e => this.handleListboxKeydown(e) }, this.filteredOptions.map(option => option.value.toString() ? (h("li", { tabindex: "0", key: option.value, id: option.value, part: `${this.name}-${option.label}`, onClick: () => this.selectOption(option), role: "option" }, option.labelHTML ? h("div", { part: "sd_dropdown-labelhtml" }, option.labelHTML) : option.label)) : null)))) : null));
+            }, "aria-hidden": "true" }, h("chevron-icon", { key: 'e83c14dcb088ee96d0b57435b0ab053f7fe9fb75', width: "16", height: "16" })))), this.error && h("span", { key: 'eee3c08aa45634ba339a08ad188120872af30cb6', class: "error help-text" }, this.error)), this.isOpen ? (h("div", { class: "dropdown-content", part: "sd_dropdown-content" }, this.withSearch && (h("div", { class: { 'search-box': true, 'open': this.isOpen } }, h("search-icon", { width: "15", height: "15", class: 'icon' }), h("input", { type: "text", role: "combobox", placeholder: this.searchPlaceholder, value: this.searchValue, ref: el => (this.inputRef = el), onInput: event => this.filterOptions(event), onKeyDown: e => this.handleComboboxKeyDown(e) }))), h("ul", { tabindex: "-1", role: "listbox", "aria-label": this.name, "aria-activedescendant": this.ariaActivedescendant, onKeyDown: e => this.handleListboxKeydown(e) }, this.filteredOptions.map(option => option.value.toString() ? (h("li", { tabindex: "0", key: option.value, id: option.value, part: `${this.name}-${option.label}`, onClick: () => this.selectOption(option), role: "option" }, option.labelHTML ? h("div", { part: "sd_dropdown-labelhtml" }, option.labelHTML) : option.label)) : null)))) : null));
     }
     static get is() { return "select-dropdown"; }
     static get encapsulation() { return "shadow"; }

package/dist/collection/components/design-system/textarea-component/textarea-component.js

@@ -74,7 +74,7 @@ export class TextareaComponent {
         }
     }
     render() {
-        return (h("label", { key: '307fd22018755750ff1540a9e1e7d97dc205c5a4', part: "tc__label", class: { error: !!this.error } }, h("p", { key: 'c9bc4a1dfe8d123a574c68d2916a3e28c1321e2f' }, h("span", { key: 'b3580e9c2c1110b7dbdf434e1968145bee1ce12d', class: "label" }, this.label), this.required && h("span", { key: '0f8e927be6bda04b187830bfcf888f91f20402e9', class: "required" }, "*"), this.tooltip && (h("tooltip-component", { key: '1dde8ad4b514613cb279e3494df1e2c820adf009' }, h("info-icon", { key: 'e3c0c4f0e59a6a2f62b13f7066345653f3dc67d7', slot: "tooltip-icon" }), h("span", { key: '53f3c52add24fad35cde05dcc3fec25ca3665709', slot: "tooltip-content" }, this.tooltip)))), h("textarea", { key: 'ba8044c72d3d9519804fc628c44955a4916016ba', name: this.name, title: this.readOnly ? 'read-only field' : undefined, placeholder: this.placeholder, readOnly: this.readOnly, autoFocus: this.autoFocus, value: this.value, maxLength: this.maxLength, onInput: e => this.handleInput(e), class: { error: !!this.error }, part: "tc__textarea" }), this.error && h("span", { key: 'c9e6b5a5be9048486702b1e9fb07021769605793', class: "error help-text" }, this.error)));
+        return (h("label", { key: '9adbf0939b5a1ce1c5b6b8edb07ef2c45e40eba3', part: "tc__label", class: { error: !!this.error } }, h("p", { key: 'c1c3c666a71c807f7644ea84fbff3a4d36f5506b' }, h("span", { key: 'ed3c9f75d9a7a01506c6c0a2650b9004bb53506e', class: "label" }, this.label), this.required && h("span", { key: 'c7061191f85894967699b3cc8c083992e044d75f', class: "required" }, "*"), this.tooltip && (h("tooltip-component", { key: 'd433d4ae874c2dbbe9eee461067ae82dd31ba08f' }, h("info-icon", { key: '84771bc88b7cf1ac57dca26e52bc0ec6260bd2c3', slot: "tooltip-icon" }), h("span", { key: '5b08d4e098fd0f44c5edf57d1057975102e4d031', slot: "tooltip-content" }, this.tooltip)))), h("textarea", { key: 'fbb324b14f954783f96669ab67ffac87d5a29a22', name: this.name, title: this.readOnly ? 'read-only field' : undefined, placeholder: this.placeholder, readOnly: this.readOnly, autoFocus: this.autoFocus, value: this.value, maxLength: this.maxLength, onInput: e => this.handleInput(e), class: { error: !!this.error }, part: "tc__textarea" }), this.error && h("span", { key: '4a5f874c9196f00e8f4c6a519ebb44f73be10f50', class: "error help-text" }, this.error)));
     }
     static get is() { return "textarea-component"; }
     static get encapsulation() { return "shadow"; }

package/dist/collection/components/design-system/time-period-selector/time-period-selector.js

@@ -126,7 +126,7 @@ export class TimePeriodSelector {
         });
     }
     render() {
-        return (h("div", { key: '15150a2c5d56e0723dbb183c009ee62848e675a9', class: "time-period-selector" }, typeof this.selectedNumber == 'number' && (h("input-dropdown", { key: '8a741263b0430aaed540ad151dbbab5df425b947', id: "time-number", name: 'time-number', class: { error: this.hasError }, inputValue: this.selectedNumber.toString(), exportparts: "id_dropdown: tps__number-dropdown, id_dropdown-input: tps__number-dropdown-button, id_dropdown-content: tps__number-dropdown-content", options: this.numberOptions, defaultInputOption: this.numberOptions.find(i => i.value == this.selectedNumber.toString()), themeConfig: this.themeConfig })), typeof this.selectedPeriod == 'string' && (h("select-dropdown", { key: 'a24d2cb2d4027aaf06eb479c849c9b1e3d9b76f0', id: "time-period", name: 'time-period', options: this.timePeriodOptions, exportparts: "sd_dropdown: tps__period-dropdown, sd_dropdown-button: tps__period-dropdown-button, sd_dropdown-content: tps__period-dropdown-content", pluralizedLabel: this.selectedNumber > 1 ? i18next.t(`time.${this.selectedPeriod}s`) : i18next.t(`time.${this.selectedPeriod}`), defaultSelectedOption: this.timePeriodOptions?.find(i => i.value == this.selectedPeriod), withSearch: false, themeConfig: this.themeConfig }))));
+        return (h("div", { key: '30e5ebc54d287a3ed4229c902a6770d5a2756dca', class: "time-period-selector" }, typeof this.selectedNumber == 'number' && (h("input-dropdown", { key: 'c3873f24f49da47c23058f4bb714676c71ab240b', id: "time-number", name: 'time-number', class: { error: this.hasError }, inputValue: this.selectedNumber.toString(), exportparts: "id_dropdown: tps__number-dropdown, id_dropdown-input: tps__number-dropdown-button, id_dropdown-content: tps__number-dropdown-content", options: this.numberOptions, defaultInputOption: this.numberOptions.find(i => i.value == this.selectedNumber.toString()), themeConfig: this.themeConfig })), typeof this.selectedPeriod == 'string' && (h("select-dropdown", { key: '0f33cf4372c915f0164769fa21b1563cc95f031c', id: "time-period", name: 'time-period', options: this.timePeriodOptions, exportparts: "sd_dropdown: tps__period-dropdown, sd_dropdown-button: tps__period-dropdown-button, sd_dropdown-content: tps__period-dropdown-content", pluralizedLabel: this.selectedNumber > 1 ? i18next.t(`time.${this.selectedPeriod}s`) : i18next.t(`time.${this.selectedPeriod}`), defaultSelectedOption: this.timePeriodOptions?.find(i => i.value == this.selectedPeriod), withSearch: false, themeConfig: this.themeConfig }))));
     }
     static get is() { return "time-period-selector"; }
     static get encapsulation() { return "scoped"; }

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

@@ -43,7 +43,7 @@ export class ToggleSwitchComponent {
         });
     }
     render() {
-        return (h("label", { key: '5784996fd6adbebd98e0643f92b60262d2e97c9f', class: "switch", part: "ts_label" }, h("input", { key: '5421ce0678d25d7bce9ef25d44cbd57d12a7169b', type: "checkbox", part: "ts_input", name: this.name, checked: this.isChecked, onChange: () => this.toggleCheck() }), h("div", { key: 'ac730b66694d099f0ffdc4d928ce417117dd9938', class: "slider round", part: `ts_slider ${this.isChecked ? 'ts_slider_checked' : ''}` })));
+        return (h("label", { key: 'b462ca54427485e9c3ed287724132da9dff109fc', class: "switch", part: "ts_label" }, h("input", { key: 'e1cd56222b141813f2a9edc81bd850798f6ec7ca', type: "checkbox", part: "ts_input", name: this.name, checked: this.isChecked, onChange: () => this.toggleCheck() }), h("div", { key: 'e06cfde796712a915faf2599f075ae8a638ca077', class: "slider round", part: `ts_slider ${this.isChecked ? 'ts_slider_checked' : ''}` })));
     }
     static get is() { return "toggle-switch"; }
     static get encapsulation() { return "shadow"; }

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

@@ -457,11 +457,11 @@ export class TooltipComponent {
         }
     }
     render() {
-        return (h("div", { key: '831542fee7806f76c29abe2a805ae05cec9ed015', class: "tooltip-container", part: "tc__container" }, h("span", { key: 'bf8e1ac93e4a90076499dd1aa11c3199154725e2', class: "info-icon", tabindex: "0", role: "button", "aria-describedby": this.tooltipId, "aria-expanded": this.isVisible ? 'true' : 'false', "aria-pressed": this.isPinned ? 'true' : 'false', onClick: this.handleClick, onMouseEnter: this.handleMouseEnter, onMouseLeave: this.handleMouseLeave, onFocus: this.handleFocus, onBlur: this.handleBlur }, h("slot", { key: '5a53111657bf09fd20dcd3721f1aa3a0ef84da74', name: "tooltip-icon" }, "i")), h("div", { key: 'aba60735c83cfb558a5a5122a74c793288da415c', style: { display: 'none' } }, h("slot", { key: 'd9cf660c79e623247bea55a07eb121f5c000ddb2', name: "tooltip-content" }, "This is a help text.")), h("span", { key: '63c3fd381a97908fe75b1c879947ef05a25ef836', id: this.tooltipId, role: "tooltip", "aria-hidden": !this.isVisible ? 'true' : 'false', class: {
+        return (h("div", { key: '2e68ab64c126d2c1e153b9254a48081dbc0fbecb', class: "tooltip-container", part: "tc__container" }, h("span", { key: '0228fe439c4244f274eb23ac95cdb45f032742d8', class: "info-icon", tabindex: "0", role: "button", "aria-describedby": this.tooltipId, "aria-expanded": this.isVisible ? 'true' : 'false', "aria-pressed": this.isPinned ? 'true' : 'false', onClick: this.handleClick, onMouseEnter: this.handleMouseEnter, onMouseLeave: this.handleMouseLeave, onFocus: this.handleFocus, onBlur: this.handleBlur }, h("slot", { key: '1cae03ea14b8ade385ba7f54d2a6363d906e3477', name: "tooltip-icon" }, "i")), h("div", { key: 'a09a9bb712409f98313f87f86b299fcd845a3cb5', style: { display: 'none' } }, h("slot", { key: '19123cf1b7298754f2b8f2ad09fb9317c762b522', name: "tooltip-content" }, "This is a help text.")), h("span", { key: '0549f27887e68b763bc3bc83b4a39aec7a07ca52', id: this.tooltipId, role: "tooltip", "aria-hidden": !this.isVisible ? 'true' : 'false', class: {
                 'tooltip-content': true,
                 'tooltip-visible': this.isVisible,
                 [this.actualPosition]: true,
-            }, part: "tc__content", style: { display: 'none' } }, h("slot", { key: 'a53d31c0c15d767939f82305bd572e2b554d68dc', name: "tooltip-content-aria" }, h("slot", { key: '181d71d4958b22977370a4e734fbd84eaf8249a2', name: "tooltip-content" }, "This is a help text.")))));
+            }, part: "tc__content", style: { display: 'none' } }, h("slot", { key: 'a46a202575dba624455ba5b10928ad7e3cbed5fa', name: "tooltip-content-aria" }, h("slot", { key: 'e8d7a6775603b415e938112cf33689ae21071291', name: "tooltip-content" }, "This is a help text.")))));
     }
     static get is() { return "tooltip-component"; }
     static get encapsulation() { return "shadow"; }

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

@@ -14,7 +14,7 @@ var __metadata = (this && this.__metadata) || function (k, v) {
 };
 import { Host, h } from "@stencil/core";
 import { RegisterComponent } from "../../../common/register-component";
-import { debug, sanitize } from "../../../utils/utils";
+import { debug, error, sanitize } from "../../../utils/utils";
 import sanitizeHtml from "sanitize-html";
 import i18next from "../../../utils/i18n";
 const emailRegex = /^[a-zA-Z0-9.!#$%&'*+/=?^_`{|}~-]+@[a-zA-Z0-9](?:[a-zA-Z0-9-]{0,61}[a-zA-Z0-9])?(?:\.[a-zA-Z0-9](?:[a-zA-Z0-9-]{0,61}[a-zA-Z0-9])?)*$/;
@@ -39,6 +39,7 @@ export class NylasBookingForm {
             const guests = [...this.guestEmails];
             guests[guestIndex] = sanitizeHtml(email);
             this.guestEmails = [...guests];
+            this.guestEmailsChanged.emit(this.guestEmails);
         };
         this.handleGuestBlur = (guestIndex, email) => {
             this.resetGuestEmailError(guestIndex);
@@ -55,6 +56,7 @@ export class NylasBookingForm {
         this.addGuestButtonClickedHandler = e => {
             e.preventDefault();
             this.guestEmails = [...this.guestEmails, ''];
+            this.guestEmailsChanged.emit(this.guestEmails);
         };
         this.removeGuestButtonClickHandler = (e, guestIndex) => {
             e.preventDefault();
@@ -62,6 +64,7 @@ export class NylasBookingForm {
             const guests = [...this.guestEmails];
             guests.splice(guestIndex, 1);
             this.guestEmails = [...guests];
+            this.guestEmailsChanged.emit(this.guestEmails);
         };
         this.handleBackButtonClicked = e => {
             e.preventDefault();
@@ -154,6 +157,7 @@ export class NylasBookingForm {
         this.updateAdditionalFields = (name, value) => {
             if (this.additionalFields) {
                 this.additionalFields[name] = value;
+                this.additionalFieldsChanged.emit({ ...this.additionalFields });
             }
         };
     }
@@ -171,19 +175,39 @@ export class NylasBookingForm {
     }
     componentDidLoad() {
         debug('nylas-booking-form', 'componentDidLoad', this.bookingInfo);
+        if (this.bookingInfo) {
+            this.bookingInfoChangedHandler(this.bookingInfo);
+        }
         if (this.configSettings?.booking) {
             this.configSettingsChangedHandler(this.configSettings);
         }
-        else if (this.bookingInfo) {
-            this.bookingInfoChangedHandler(this.bookingInfo);
-        }
+        this.warnIfHiddenWithoutValue();
     }
     componentDidRender() {
     }
+    prefilledValue(field) {
+        const raw = this.bookingInfo?.primaryParticipant?.[field] || this.configSettings?.booking?.guest?.[field];
+        if (!raw) {
+            return '';
+        }
+        return field === 'email' ? sanitizeHtml(raw) : sanitize(raw);
+    }
+    isFieldHidden(field) {
+        const hidden = field === 'email' ? this.bookingInfo?.primaryParticipant?.emailHidden : this.bookingInfo?.primaryParticipant?.nameHidden;
+        return hidden === true && !!this.prefilledValue(field);
+    }
+    warnIfHiddenWithoutValue() {
+        ['name', 'email'].forEach(field => {
+            const hidden = field === 'email' ? this.bookingInfo?.primaryParticipant?.emailHidden : this.bookingInfo?.primaryParticipant?.nameHidden;
+            if (hidden === true && !this.prefilledValue(field)) {
+                error(`nylas-booking-form: bookingInfo.primaryParticipant.${field}Hidden was set without a usable ${field}, so the ${field} field is shown instead.`);
+            }
+        });
+    }
     bookingInfoChangedHandler(newValue) {
         if (newValue && newValue.primaryParticipant) {
-            this.name = newValue.primaryParticipant.name || this.name;
-            this.email = newValue.primaryParticipant.email || this.email;
+            this.name = newValue.primaryParticipant.name != null ? sanitize(newValue.primaryParticipant.name) : this.name;
+            this.email = newValue.primaryParticipant.email != null ? sanitizeHtml(newValue.primaryParticipant.email) : this.email;
         }
         if (newValue?.guests && Array.isArray(newValue.guests)) {
             this.guestEmails = newValue.guests.map(guest => guest.email);
@@ -191,10 +215,10 @@ export class NylasBookingForm {
     }
     configSettingsChangedHandler(newValue) {
         if (!this.bookingInfo?.primaryParticipant?.name && newValue && newValue.booking?.guest?.name) {
-            this.name = newValue.booking.guest.name || this.name;
+            this.name = sanitize(newValue.booking.guest.name) || this.name;
         }
         if (!this.bookingInfo?.primaryParticipant?.email && newValue && newValue.booking?.guest?.email) {
-            this.email = newValue.booking.guest.email || this.email;
+            this.email = sanitizeHtml(newValue.booking.guest.email) || this.email;
         }
         if (!this.bookingInfo?.guests && newValue?.booking?.additional_guests && Array.isArray(newValue.booking.additional_guests)) {
             this.guestEmails = newValue.booking.additional_guests.map(guest => guest.email);
@@ -321,10 +345,18 @@ export class NylasBookingForm {
     dropdownDefaultSelectedHandler(event) {
         this.updateAdditionalFields(event.detail.name, event.detail.value);
     }
+    renderPrimaryParticipantField(field) {
+        if (this.isFieldHidden(field)) {
+            return null;
+        }
+        const isEmail = field === 'email';
+        const readOnly = (isEmail ? this.bookingInfo?.primaryParticipant?.emailReadOnly : this.bookingInfo?.primaryParticipant?.nameReadOnly) || false;
+        return (h("div", { class: "input-wrapper", part: "nbf__input-wrapper" }, h("input-component", { label: i18next.t(field), name: field, id: field, pattern: isEmail ? emailRegex : undefined, defaultValue: this.prefilledValue(field) || (isEmail ? this.email : this.name), placeholder: i18next.t(isEmail ? 'emailPlaceholder' : 'namePlaceholder'), type: isEmail ? 'email' : 'text', readOnly: readOnly, required: true, requiredError: isEmail ? this.emailRequiredError : this.nameRequiredError, patternError: isEmail ? this.emailPatternError : this.namePatternError, themeConfig: this.themeConfig, part: "nbf__input-textfield" })));
+    }
     render() {
         const isGroupEvent = !!this.selectedTimeslot?.event_id && !!this.selectedTimeslot?.capacity;
         const showConsentMessage = this.configSettings?.scheduler?.notetaker_settings?.show_ui_consent_message === true;
-        return (h(Host, { key: 'ff7be9b66b5a472cae4a9ee6bd0ac7f4d7d55080' }, h("form", { key: 'efc1dc1cf3790f1b7d1da15c95d0e7c01b8e09b7', onSubmit: e => this.bookButtonClickedHandler(e), ref: el => (this.formRef = el), noValidate: true }, h("div", { key: 'b054882d9b3e86432666ca2a4c78be28527141d7', class: "nylas-booking-form", part: "nbf" }, h("div", { key: '72cc111b5b14e75419decf4a35c8c062619747c3', class: "input-wrapper", part: "nbf__input-wrapper" }, h("input-component", { key: '8e0622d77d38733b46637c22296bc22ad9594b98', label: i18next.t('name'), name: "name", id: "name", defaultValue: this.bookingInfo?.primaryParticipant?.name || this.configSettings?.booking?.guest?.name || this.name, placeholder: i18next.t('namePlaceholder'), type: "text", readOnly: this.bookingInfo?.primaryParticipant?.nameReadOnly || false, required: true, requiredError: this.nameRequiredError, patternError: this.namePatternError, themeConfig: this.themeConfig, part: "nbf__input-textfield" })), h("div", { key: 'b33b7f03f3986e09b8f8cd25e7c2f50613283693', class: "input-wrapper", part: "nbf__input-wrapper" }, h("input-component", { key: 'ff9d6627901004d5d82682fc475d798aeb50f35c', label: i18next.t('email'), name: "email", id: "email", pattern: emailRegex, defaultValue: this.bookingInfo?.primaryParticipant?.email || this.configSettings?.booking?.guest?.email || this.email, placeholder: i18next.t('emailPlaceholder'), type: "email", readOnly: this.bookingInfo?.primaryParticipant?.emailReadOnly || false, required: true, requiredError: this.emailRequiredError, patternError: this.emailPatternError, themeConfig: this.themeConfig, part: "nbf__input-textfield" })), this.configSettings?.scheduler?.hide_additional_guests !== true && (h("div", { key: '0cf431d2b0cf104b9abf6e15071b5d4bc5a004b7', class: "input-wrapper", part: "nbf__input-wrapper" }, this.guestEmails.map((email, index) => (h("div", { class: "input-wrapper button-wrapper" }, h("label", { class: {
+        return (h(Host, { key: '922bf5bc3917fe5b9521ff55d09cb184f092fdc0' }, h("form", { key: '22f7479e474a2c8dc626d60706ecee0fac27a293', onSubmit: e => this.bookButtonClickedHandler(e), ref: el => (this.formRef = el), noValidate: true }, h("div", { key: 'fbbc42d4414a90e1603dea96f50283727d7db202', class: "nylas-booking-form", part: "nbf" }, this.renderPrimaryParticipantField('name'), this.renderPrimaryParticipantField('email'), this.configSettings?.scheduler?.hide_additional_guests !== true && (h("div", { key: 'faae9a8ad25349cd0a3c783996ad52d546528332', class: "input-wrapper", part: "nbf__input-wrapper" }, this.guestEmails.map((email, index) => (h("div", { class: "input-wrapper button-wrapper" }, h("label", { class: {
                 error: !!this.guestEmailErrors[index],
             } }, i18next.t('guestEmail')), h("div", { class: "guest-email-input" }, h("input", { type: "email", id: `guest-email-${index}`, maxLength: 100, class: {
                 'guest-email': true,
@@ -332,7 +364,7 @@ export class NylasBookingForm {
             }, placeholder: i18next.t('guestEmailPlaceholder'), 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", tooltip: "Remove guest", 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])))), !isGroupEvent && (h("button-component", { key: '2b149ffe1bdd0117dc23f75bd6aa21f28a9b9652', class: "add-guest", variant: "invisible", part: "nbf__button-ghost", onClick: e => this.addGuestButtonClickedHandler(e) }, h("div", { key: 'd30ef6a29786a6faa4ef8e1b5f0b6d96d494fb7f', class: "button-content" }, h("add-circle-icon", { key: 'a6d1d9cdfef40554a443a8a9b3685fd16e0ea8f4', slot: "icon" }), this.guestEmails.length > 0 ? `${i18next.t('addAnotherGuest')}` : `${i18next.t('addGuest')}`))))), Object.entries((this.configSettings?.scheduler?.additional_fields || {}))
+            } }, h("close-icon", null))), h("p", { class: "help-text" }, this.guestEmailErrors[index])))), !isGroupEvent && (h("button-component", { key: '7394fd4210ce0e2c241ce7609bbe4d1a36eec1af', class: "add-guest", variant: "invisible", part: "nbf__button-ghost", onClick: e => this.addGuestButtonClickedHandler(e) }, h("div", { key: '096ad3d0b8ac04f91515352e3ef5317d3ceb2b84', class: "button-content" }, h("add-circle-icon", { key: '84b48bb92f1e1daeacc0f93f5ed3a159403ad3e4', slot: "icon" }), this.guestEmails.length > 0 ? `${i18next.t('addAnotherGuest')}` : `${i18next.t('addGuest')}`))))), Object.entries((this.configSettings?.scheduler?.additional_fields || {}))
             ?.sort((a, b) => a[1].order - b[1].order)
             .map(x => {
             const field = x[1];
@@ -363,7 +395,7 @@ export class NylasBookingForm {
                 default:
                     return (h("div", { class: "input-wrapper", part: "nbf__input-wrapper" }, h("input-component", { label: label, name: key, id: key, type: field.type, readOnly: fieldReadOnly, defaultValue: defaultValue || '', requiredError: i18next.t('fieldRequired', { field: label }), patternError: i18next.t('invalidInputFormat', { field: label }), required: field.required, part: "nbf__input-textfield", themeConfig: this.themeConfig })));
             }
-        })), h("div", { key: 'cc4eef64c581d709dd04aa9a1911b8e16395bfca', class: "cta" }, showConsentMessage && h("div", { key: '646406e9b164645b733f70720d024bf9f38c42c7', class: "consent-disclaimer" }, i18next.t('notetakerConsentMessage')), h("button-component", { key: '0a50849e94a7024c79cb32ab28d7259006bbe886', variant: 'basic', class: "back", part: "nbf__button-outline", isLoading: this.backButtonLoading && this.isLoading, onClick: this.handleBackButtonClicked }, h("slot", { key: '4a20f06c8173c9c18be25b3303852139f76eb812', name: "booking-form-back-label" }, `${i18next.t('backButton')}`)), h("button-component", { key: '334c1bab37af898e49867205c84baedeb612860b', variant: 'primary', isLoading: !this.backButtonLoading && this.isLoading, disabled: this.isLoading, part: "nbf__button-primary", type: "submit" }, h("slot", { key: '3f421a94afaf0f2e2defdd5f03d04e0553cf6b24', name: "booking-form-book-label" }, `${i18next.t('bookNowButton')}`))))));
+        })), h("div", { key: '9af53ba4870ce0abacc121c69fe6459233b58965', class: "cta" }, showConsentMessage && h("div", { key: 'f2ec6d1963f42571afce4bae992c25f988e0a28f', class: "consent-disclaimer" }, i18next.t('notetakerConsentMessage')), h("button-component", { key: '88e467568575056a66f2e49870b8c03cf924b764', variant: 'basic', class: "back", part: "nbf__button-outline", isLoading: this.backButtonLoading && this.isLoading, onClick: this.handleBackButtonClicked }, h("slot", { key: '97472e0d98b1decff91ccdd857eb3ae6da12817f', name: "booking-form-back-label" }, `${i18next.t('backButton')}`)), h("button-component", { key: 'afb75d441b13022e9563dded3bf5cc7107739725', variant: 'primary', isLoading: !this.backButtonLoading && this.isLoading, disabled: this.isLoading, part: "nbf__button-primary", type: "submit" }, h("slot", { key: '11a988bd04e6ddaab31fdfe3c3c8ac3bbb6fe164', name: "booking-form-book-label" }, `${i18next.t('bookNowButton')}`))))));
     }
     static get is() { return "nylas-booking-form"; }
     static get encapsulation() { return "shadow"; }
@@ -421,7 +453,7 @@ export class NylasBookingForm {
                 "docs": {
                     "tags": [{
                             "name": "standalone",
-                            "text": "The booking info."
+                            "text": "The booking info.\n\n`primaryParticipant.name` / `primaryParticipant.email` prefill the booker's details.\nPair them with `nameReadOnly` / `emailReadOnly` to show the values without allowing\nedits, or with `nameHidden` / `emailHidden` to omit the fields from the form while\nstill submitting the prefilled values. Hiding requires a prefilled value: set without\none, the field is rendered anyway and the misconfiguration is logged for the integrator."
                         }],
                     "text": ""
                 },
@@ -604,6 +636,41 @@ export class NylasBookingForm {
                     "resolved": "string",
                     "references": {}
                 }
+            }, {
+                "method": "guestEmailsChanged",
+                "name": "guestEmailsChanged",
+                "bubbles": true,
+                "cancelable": true,
+                "composed": true,
+                "docs": {
+                    "tags": [],
+                    "text": "This event is fired when the additional guest emails are changed."
+                },
+                "complexType": {
+                    "original": "string[]",
+                    "resolved": "string[]",
+                    "references": {}
+                }
+            }, {
+                "method": "additionalFieldsChanged",
+                "name": "additionalFieldsChanged",
+                "bubbles": true,
+                "cancelable": true,
+                "composed": true,
+                "docs": {
+                    "tags": [],
+                    "text": "This event is fired when the additional/custom fields are changed."
+                },
+                "complexType": {
+                    "original": "Record<string, string>",
+                    "resolved": "{ [x: string]: string; }",
+                    "references": {
+                        "Record": {
+                            "location": "global",
+                            "id": "global::Record"
+                        }
+                    }
+                }
             }, {
                 "method": "backButtonClicked",
                 "name": "backButtonClicked",
@@ -766,6 +833,12 @@ __decorate([
             emailChanged: async (event, nylasSchedulerConnector) => {
                 nylasSchedulerConnector.scheduler.setParticipantEmail(event.detail);
             },
+            guestEmailsChanged: async (event, nylasSchedulerConnector) => {
+                nylasSchedulerConnector.scheduler.setGuests(event.detail);
+            },
+            additionalFieldsChanged: async (event, nylasSchedulerConnector) => {
+                nylasSchedulerConnector.scheduler.setAdditionalFields(event.detail);
+            },
             detailsConfirmed: async (event, _nylasSchedulerConnector) => {
                 debug('nylas-booking-form', 'detailsConfirmed', event.detail);
             },