@nylas/web-elements 1.0.0-prealpha1

package/dist/nylas-web-elements/p-adacdaeb.entry.js

@@ -0,0 +1,2 @@
+import{r as t,h as e}from"./p-c66e27d0.js";const s=".sc-archive-icon-h{display:flex}";const c=s;const o=class{constructor(e){t(this,e);this.width="15";this.height="15"}render(){return e("svg",{key:"0329bd3ce631ac955a329c082153db1221ca1237",width:this.width,height:this.height,viewBox:"0 0 24 24",fill:"auto",xmlns:"http://www.w3.org/2000/svg"},e("path",{key:"d1e0976f40a05045ee782b1ba061d6c1e1dbf9f0",d:"M3 6H5H21",stroke:"auto","stroke-width":"1.5"}),e("path",{key:"aee7f407210afd75d8e30c340695a6324d7f9e9a",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"}),e("path",{key:"3f0f86b34ebd7ea3648f21dc858dd5b81a33335f",d:"M10 11V17",stroke:"auto","stroke-width":"1.5"}),e("path",{key:"482a3c137b13722870b1b36cfa111ad7ccafc48e",d:"M14 11V17",stroke:"auto","stroke-width":"1.5"}))}};o.style=c;const a=".sc-folder-icon-h{display:flex}";const d=a;const i=class{constructor(e){t(this,e);this.width="15";this.height="15"}render(){return e("svg",{key:"c0702f8ece1b14671f64810c217227334d73de6c",width:this.width,height:this.height,viewBox:"0 0 24 24",fill:"auto",xmlns:"http://www.w3.org/2000/svg"},e("path",{key:"f2d75e6d1c4c958d937e4ea12c7789a0d02dc945",d:"M3 8.2C3 7.07989 3 6.51984 3.21799 6.09202C3.40973 5.71569 3.71569 5.40973 4.09202 5.21799C4.51984 5 5.0799 5 6.2 5H9.67452C10.1637 5 10.4083 5 10.6385 5.05526C10.8425 5.10425 11.0376 5.18506 11.2166 5.29472C11.4184 5.4184 11.5914 5.59135 11.9373 5.93726L12.0627 6.06274C12.4086 6.40865 12.5816 6.5816 12.7834 6.70528C12.9624 6.81494 13.1575 6.89575 13.3615 6.94474C13.5917 7 13.8363 7 14.3255 7H17.8C18.9201 7 19.4802 7 19.908 7.21799C20.2843 7.40973 20.5903 7.71569 20.782 8.09202C21 8.51984 21 9.0799 21 10.2V15.8C21 16.9201 21 17.4802 20.782 17.908C20.5903 18.2843 20.2843 18.5903 19.908 18.782C19.4802 19 18.9201 19 17.8 19H6.2C5.07989 19 4.51984 19 4.09202 18.782C3.71569 18.5903 3.40973 18.2843 3.21799 17.908C3 17.4802 3 16.9201 3 15.8V8.2Z",stroke:"auto","stroke-width":"2","stroke-linecap":"round","stroke-linejoin":"round"}))}};i.style=d;const h=".sc-inbox-icon-h{display:flex}";const r=h;const f=class{constructor(e){t(this,e);this.width="15";this.height="15"}render(){return e("svg",{key:"f6e5dbde80e252a006336eed6966876b0983c6d3",width:this.width,height:this.height,viewBox:"0 0 24 24",fill:"auto",xmlns:"http://www.w3.org/2000/svg"},e("path",{key:"433599dc1fe9f5bfeebfbb74e7f121dd9fd0bab1",d:"M20 3H4C2.89543 3 2 3.89543 2 5V19C2 20.1046 2.89543 21 4 21H20C21.1046 21 22 20.1046 22 19V5C22 3.89543 21.1046 3 20 3Z",stroke:"auto","stroke-width":"1.5"}),e("path",{key:"5d9d3398bd89df400614405fbadf926f2967810b",d:"M2 5L12 12.5L22 5",stroke:"auto","stroke-width":"1.5"}))}};f.style=r;const n=".sc-sent-icon-h{display:flex}";const C=n;const k=class{constructor(e){t(this,e);this.width="15";this.height="15"}render(){return e("svg",{key:"a56b6925b675c170b4a7982fe1e0b168baaeceda",width:this.width,height:this.height,viewBox:"0 0 24 24",fill:"auto",xmlns:"http://www.w3.org/2000/svg"},e("path",{key:"0896c8c34a8ff0d347250dce6857991a20fe77a2",d:"M21.5 12L3.5 3.5L3.5 20.5L21.5 12Z",stroke:"auto","stroke-width":"1.5"}),e("path",{key:"9c62dc2663993187e4356689d5cdda56e71383be",d:"M3.5 3.5L12 10.5",stroke:"auto","stroke-width":"1.5"}),e("path",{key:"12608ff7122f9710fcc3dd7b796e5b1c6da2a33b",d:"M3.5 20.5L12 13.5",stroke:"auto","stroke-width":"1.5"}))}};k.style=C;const w=".sc-spam-icon-h{display:flex}";const b=w;const l=class{constructor(e){t(this,e);this.width="15";this.height="15"}render(){return e("svg",{key:"7eed20535ff6abe59cbb633a137911a69c82b5ae",width:this.width,height:this.height,viewBox:"0 0 24 24",fill:"auto",xmlns:"http://www.w3.org/2000/svg"},e("path",{key:"ed8fbfe1c5010249598077844db4ec62d02e6a49",d:"M20 3H4C2.89543 3 2 3.89543 2 5V19C2 20.1046 2.89543 21 4 21H20C21.1046 21 22 20.1046 22 19V5C22 3.89543 21.1046 3 20 3Z",stroke:"auto","stroke-width":"1.5"}),e("path",{key:"7116f0a20c00d708dad4f368e247fd35e875e33e",d:"M2 5L12 12.5L22 5",stroke:"auto","stroke-width":"1.5"}))}};l.style=b;const u=".sc-star-icon-h{display:flex}";const p=u;const y=class{constructor(e){t(this,e);this.width="15";this.height="15"}render(){return e("svg",{key:"cffea749ac68b3082143934428ec1d3c922ec34c",width:this.width,height:this.height,viewBox:"0 0 24 24",fill:"auto",xmlns:"http://www.w3.org/2000/svg"},e("path",{key:"9f53f69c1a4e360ff95c5ac0bacc86ce5b4dcdb1",d:"M9.15316 5.40838C10.4198 3.13613 11.0531 2 12 2C12.9469 2 13.5802 3.13612 14.8468 5.40837L15.1745 5.99623C15.5345 6.64193 15.7144 6.96479 15.9951 7.17781C16.2757 7.39083 16.6251 7.4699 17.3241 7.62805L17.9605 7.77203C20.4201 8.32856 21.65 8.60682 21.9426 9.54773C22.2352 10.4886 21.3968 11.4691 19.7199 13.4299L19.2861 13.9372C18.8096 14.4944 18.5713 14.773 18.4641 15.1177C18.357 15.4624 18.393 15.8341 18.465 16.5776L18.5306 17.2544C18.7841 19.8706 18.9109 21.1787 18.1449 21.7602C17.3788 22.3417 16.2273 21.8115 13.9243 20.7512L13.3285 20.4768C12.6741 20.1755 12.3469 20.0248 12 20.0248C11.6531 20.0248 11.3259 20.1755 10.6715 20.4768L10.0757 20.7512C7.77268 21.8115 6.62118 22.3417 5.85515 21.7602C5.08912 21.1787 5.21588 19.8706 5.4694 17.2544L5.53498 16.5776C5.60703 15.8341 5.64305 15.4624 5.53586 15.1177C5.42868 14.773 5.19043 14.4944 4.71392 13.9372L4.2801 13.4299C2.60325 11.4691 1.76482 10.4886 2.05742 9.54773C2.35002 8.60682 3.57986 8.32856 6.03954 7.77203L6.67589 7.62805C7.37485 7.4699 7.72433 7.39083 8.00494 7.17781C8.28555 6.96479 8.46553 6.64194 8.82547 5.99623L9.15316 5.40838Z",stroke:"auto","stroke-width":"1.5"}))}};y.style=p;const g=".sc-trash-icon-h{display:flex}";const x=g;const v=class{constructor(e){t(this,e);this.width="15";this.height="15"}render(){return e("svg",{key:"8d05e6938b2462ac983b3536cb19fb8ce840b690",width:this.width,height:this.height,viewBox:"0 0 24 24",fill:"auto",xmlns:"http://www.w3.org/2000/svg"},e("path",{key:"e740487d505d872259e0ca035525b2caa3fac45f",d:"M3 6H5H21",stroke:"auto","stroke-width":"1.5"}),e("path",{key:"2755f35e8e1de9e148456adcd17ca8f6e580d5ce",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"}),e("path",{key:"750e4c62517a5822d85bbeccfa3506188eb8eb4e",d:"M10 11V17",stroke:"auto","stroke-width":"1.5"}),e("path",{key:"82b18c5f39fc2f42c5b0c97a88f6f683a083b092",d:"M14 11V17",stroke:"auto","stroke-width":"1.5"}))}};v.style=x;export{o as archive_icon,i as folder_icon,f as inbox_icon,k as sent_icon,l as spam_icon,y as star_icon,v as trash_icon};
+//# sourceMappingURL=p-adacdaeb.entry.js.map

package/dist/nylas-web-elements/p-adacdaeb.entry.js.map

@@ -0,0 +1 @@
+{"version":3,"names":["iconCss","ArchiveIconStyle0","ArchiveIcon","render","h","key","width","this","height","viewBox","fill","xmlns","d","stroke","FolderIconStyle0","FolderIcon","InboxIconStyle0","InboxIcon","SentIconStyle0","SentIcon","SpamIconStyle0","SpamIcon","StarIconStyle0","StarIcon","TrashIconStyle0","TrashIcon"],"sources":["src/common/icons/icon.css?tag=archive-icon&encapsulation=scoped","src/common/icons/archive.tsx","src/common/icons/icon.css?tag=folder-icon&encapsulation=scoped","src/common/icons/folder.tsx","src/common/icons/icon.css?tag=inbox-icon&encapsulation=scoped","src/common/icons/inbox.tsx","src/common/icons/icon.css?tag=sent-icon&encapsulation=scoped","src/common/icons/sent.tsx","src/common/icons/icon.css?tag=spam-icon&encapsulation=scoped","src/common/icons/spam.tsx","src/common/icons/icon.css?tag=star-icon&encapsulation=scoped","src/common/icons/star.tsx","src/common/icons/icon.css?tag=trash-icon&encapsulation=scoped","src/common/icons/trash.tsx"],"sourcesContent":[":host {\n  display: flex;\n}\n","import { Component, Prop, h } from '@stencil/core';\n\n@Component({\n  tag: 'archive-icon',\n  styleUrl: 'icon.css',\n  scoped: true,\n})\nexport class ArchiveIcon {\n  @Prop() width: string = '15';\n  @Prop() height: string = '15';\n\n  render() {\n    // Archive icon svg\n    return (\n      <svg width={this.width} height={this.height} viewBox=\"0 0 24 24\" fill=\"auto\" xmlns=\"http://www.w3.org/2000/svg\">\n        <path d=\"M3 6H5H21\" stroke=\"auto\" stroke-width=\"1.5\" />\n        <path\n          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\"\n          stroke=\"auto\"\n          stroke-width=\"1.5\"\n        />\n        <path d=\"M10 11V17\" stroke=\"auto\" stroke-width=\"1.5\" />\n        <path d=\"M14 11V17\" stroke=\"auto\" stroke-width=\"1.5\" />\n      </svg>\n    );\n  }\n}\n",":host {\n  display: flex;\n}\n","import { Component, Prop, h } from '@stencil/core';\n\n@Component({\n  tag: 'folder-icon',\n  styleUrl: 'icon.css',\n  scoped: true,\n})\nexport class FolderIcon {\n  @Prop() width: string = '15';\n  @Prop() height: string = '15';\n\n  render() {\n    return (\n      <svg width={this.width} height={this.height} viewBox=\"0 0 24 24\" fill=\"auto\" xmlns=\"http://www.w3.org/2000/svg\">\n        <path\n          d=\"M3 8.2C3 7.07989 3 6.51984 3.21799 6.09202C3.40973 5.71569 3.71569 5.40973 4.09202 5.21799C4.51984 5 5.0799 5 6.2 5H9.67452C10.1637 5 10.4083 5 10.6385 5.05526C10.8425 5.10425 11.0376 5.18506 11.2166 5.29472C11.4184 5.4184 11.5914 5.59135 11.9373 5.93726L12.0627 6.06274C12.4086 6.40865 12.5816 6.5816 12.7834 6.70528C12.9624 6.81494 13.1575 6.89575 13.3615 6.94474C13.5917 7 13.8363 7 14.3255 7H17.8C18.9201 7 19.4802 7 19.908 7.21799C20.2843 7.40973 20.5903 7.71569 20.782 8.09202C21 8.51984 21 9.0799 21 10.2V15.8C21 16.9201 21 17.4802 20.782 17.908C20.5903 18.2843 20.2843 18.5903 19.908 18.782C19.4802 19 18.9201 19 17.8 19H6.2C5.07989 19 4.51984 19 4.09202 18.782C3.71569 18.5903 3.40973 18.2843 3.21799 17.908C3 17.4802 3 16.9201 3 15.8V8.2Z\"\n          stroke=\"auto\"\n          stroke-width=\"2\"\n          stroke-linecap=\"round\"\n          stroke-linejoin=\"round\"\n        />\n      </svg>\n    );\n  }\n}\n",":host {\n  display: flex;\n}\n","import { Component, Prop, h } from '@stencil/core';\n\n@Component({\n  tag: 'inbox-icon',\n  styleUrl: 'icon.css',\n  scoped: true,\n})\nexport class InboxIcon {\n  @Prop() width: string = '15';\n  @Prop() height: string = '15';\n\n  render() {\n    return (\n      <svg width={this.width} height={this.height} viewBox=\"0 0 24 24\" fill=\"auto\" xmlns=\"http://www.w3.org/2000/svg\">\n        <path d=\"M20 3H4C2.89543 3 2 3.89543 2 5V19C2 20.1046 2.89543 21 4 21H20C21.1046 21 22 20.1046 22 19V5C22 3.89543 21.1046 3 20 3Z\" stroke=\"auto\" stroke-width=\"1.5\" />\n        <path d=\"M2 5L12 12.5L22 5\" stroke=\"auto\" stroke-width=\"1.5\" />\n      </svg>\n    );\n  }\n}\n",":host {\n  display: flex;\n}\n","import { Component, Prop, h } from '@stencil/core';\n\n@Component({\n  tag: 'sent-icon',\n  styleUrl: 'icon.css',\n  scoped: true,\n})\nexport class SentIcon {\n  @Prop() width: string = '15';\n  @Prop() height: string = '15';\n\n  render() {\n    // Sent email icon svg, a paper airplane pointing to the right\n    return (\n      <svg width={this.width} height={this.height} viewBox=\"0 0 24 24\" fill=\"auto\" xmlns=\"http://www.w3.org/2000/svg\">\n        <path d=\"M21.5 12L3.5 3.5L3.5 20.5L21.5 12Z\" stroke=\"auto\" stroke-width=\"1.5\" />\n        <path d=\"M3.5 3.5L12 10.5\" stroke=\"auto\" stroke-width=\"1.5\" />\n        <path d=\"M3.5 20.5L12 13.5\" stroke=\"auto\" stroke-width=\"1.5\" />\n      </svg>\n    );\n  }\n}\n",":host {\n  display: flex;\n}\n","import { Component, Prop, h } from '@stencil/core';\n\n@Component({\n  tag: 'spam-icon',\n  styleUrl: 'icon.css',\n  scoped: true,\n})\nexport class SpamIcon {\n  @Prop() width: string = '15';\n  @Prop() height: string = '15';\n\n  render() {\n    // Spam icon svg\n    return (\n      <svg width={this.width} height={this.height} viewBox=\"0 0 24 24\" fill=\"auto\" xmlns=\"http://www.w3.org/2000/svg\">\n        <path d=\"M20 3H4C2.89543 3 2 3.89543 2 5V19C2 20.1046 2.89543 21 4 21H20C21.1046 21 22 20.1046 22 19V5C22 3.89543 21.1046 3 20 3Z\" stroke=\"auto\" stroke-width=\"1.5\" />\n        <path d=\"M2 5L12 12.5L22 5\" stroke=\"auto\" stroke-width=\"1.5\" />\n      </svg>\n    );\n  }\n}\n",":host {\n  display: flex;\n}\n","import { Component, Prop, h } from '@stencil/core';\n\n@Component({\n  tag: 'star-icon',\n  styleUrl: 'icon.css',\n  scoped: true,\n})\nexport class StarIcon {\n  @Prop() width: string = '15';\n  @Prop() height: string = '15';\n\n  render() {\n    return (\n      <svg width={this.width} height={this.height} viewBox=\"0 0 24 24\" fill=\"auto\" xmlns=\"http://www.w3.org/2000/svg\">\n        <path\n          d=\"M9.15316 5.40838C10.4198 3.13613 11.0531 2 12 2C12.9469 2 13.5802 3.13612 14.8468 5.40837L15.1745 5.99623C15.5345 6.64193 15.7144 6.96479 15.9951 7.17781C16.2757 7.39083 16.6251 7.4699 17.3241 7.62805L17.9605 7.77203C20.4201 8.32856 21.65 8.60682 21.9426 9.54773C22.2352 10.4886 21.3968 11.4691 19.7199 13.4299L19.2861 13.9372C18.8096 14.4944 18.5713 14.773 18.4641 15.1177C18.357 15.4624 18.393 15.8341 18.465 16.5776L18.5306 17.2544C18.7841 19.8706 18.9109 21.1787 18.1449 21.7602C17.3788 22.3417 16.2273 21.8115 13.9243 20.7512L13.3285 20.4768C12.6741 20.1755 12.3469 20.0248 12 20.0248C11.6531 20.0248 11.3259 20.1755 10.6715 20.4768L10.0757 20.7512C7.77268 21.8115 6.62118 22.3417 5.85515 21.7602C5.08912 21.1787 5.21588 19.8706 5.4694 17.2544L5.53498 16.5776C5.60703 15.8341 5.64305 15.4624 5.53586 15.1177C5.42868 14.773 5.19043 14.4944 4.71392 13.9372L4.2801 13.4299C2.60325 11.4691 1.76482 10.4886 2.05742 9.54773C2.35002 8.60682 3.57986 8.32856 6.03954 7.77203L6.67589 7.62805C7.37485 7.4699 7.72433 7.39083 8.00494 7.17781C8.28555 6.96479 8.46553 6.64194 8.82547 5.99623L9.15316 5.40838Z\"\n          stroke=\"auto\"\n          stroke-width=\"1.5\"\n        />\n      </svg>\n    );\n  }\n}\n",":host {\n  display: flex;\n}\n","import { Component, Prop, h } from '@stencil/core';\n\n@Component({\n  tag: 'trash-icon',\n  styleUrl: 'icon.css',\n  scoped: true,\n})\nexport class TrashIcon {\n  @Prop() width: string = '15';\n  @Prop() height: string = '15';\n\n  render() {\n    // Trash icon svg\n    return (\n      <svg width={this.width} height={this.height} viewBox=\"0 0 24 24\" fill=\"auto\" xmlns=\"http://www.w3.org/2000/svg\">\n        <path d=\"M3 6H5H21\" stroke=\"auto\" stroke-width=\"1.5\" />\n        <path\n          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\"\n          stroke=\"auto\"\n          stroke-width=\"1.5\"\n        />\n        <path d=\"M10 11V17\" stroke=\"auto\" stroke-width=\"1.5\" />\n        <path d=\"M14 11V17\" stroke=\"auto\" stroke-width=\"1.5\" />\n      </svg>\n    );\n  }\n}\n"],"mappings":"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"}

package/dist/nylas-web-elements/p-b7d4b7b5.entry.js

@@ -0,0 +1,2 @@
+import{r as t,c as i,h as n,H as e,a as s}from"./p-c66e27d0.js";import{R as o}from"./p-5862975b.js";import{d as a}from"./p-98ec4a7a.js";const r=":host{display:contents}.container{height:var(--container-height, 100dvh);overflow-y:var(--container-overflow-y, auto)}.pagination{display:flex;justify-content:center;align-items:center;margin:0 auto;padding:0;list-style:none;font-size:0.875rem;font-weight:600;color:var(--nylas-color-primary-600)}.pagination sp-button svg{animation:rotate 1s linear infinite}sp-button{border-radius:var(--nylas-border-radius);background-color:var(--nylas-color-primary-400);color:var(--nylas-color-primary-900);fill:var(--nylas-color-primary-900)}sp-button:hover{background-color:var(--nylas-color-primary-500)}sp-button:disabled{background-color:var(--nylas-color-primary-200);color:var(--nylas-color-primary-600);cursor:not-allowed}sp-button chevron-icon svg{width:15px;height:15px}.next chevron-icon{transform:rotate(180deg)}@keyframes rotate{from{transform:rotate(0deg)}to{transform:rotate(360deg)}}";const l=r;var c=undefined&&undefined.__decorate||function(t,i,n,e){var s=arguments.length,o=s<3?i:e===null?e=Object.getOwnPropertyDescriptor(i,n):e,a;if(typeof Reflect==="object"&&typeof Reflect.decorate==="function")o=Reflect.decorate(t,i,n,e);else for(var r=t.length-1;r>=0;r--)if(a=t[r])o=(s<3?a(o):s>3?a(i,n,o):a(i,n))||o;return s>3&&o&&Object.defineProperty(i,n,o),o};var h=undefined&&undefined.__metadata||function(t,i){if(typeof Reflect==="object"&&typeof Reflect.metadata==="function")return Reflect.metadata(t,i)};const d=class{constructor(n){t(this,n);this.next=i(this,"next",7);this.previous=i(this,"previous",7);this.state="ready";this.hasNextPage=false;this.hasPreviousPage=false;this.scrollTarget="container";this.mobileOnlyInfiniteScroll=true;this.mobileViewPortWidth=768;a(`[nylas-pagination] Constructed`);this.isScrollAtContainerBottom=this.isScrollAtContainerBottom.bind(this);this.isScrollAtPageBottom=this.isScrollAtPageBottom.bind(this);this.nextPage=this.nextPage.bind(this);this.previousPage=this.previousPage.bind(this);this.handlePageScroll=this.handlePageScroll.bind(this);this.handleContainerScroll=this.handleContainerScroll.bind(this)}connectedCallback(){a(`[nylas-pagination] Component connected`)}async componentWillLoad(){a(`[nylas-pagination] Component will load`)}async componentDidLoad(){a(`[nylas-pagination] Component did load`);if(this.containerElement){this.containerElement.addEventListener("scroll",this.handleContainerScroll)}}async componentWillRender(){a(`[nylas-pagination] Component will render`)}disconnectedCallback(){a(`[nylas-pagination] Component disconnected`);if(this.containerElement){this.containerElement.removeEventListener("scroll",this.handleContainerScroll)}}handlePageScroll(t){if(this.isScrollAtPageBottom()&&this.canScroll&&this.scrollTarget==="page"){this.nextPage()}}async nextPage(){const t=this.host.children.length>0;this.next.emit({hasChildren:t})}async previousPage(){const t=this.host.children.length>0;this.previous.emit({hasChildren:t})}handleContainerScroll(t){if(this.isScrollAtContainerBottom()&&this.canScroll&&this.scrollTarget==="container"){this.nextPage()}}isScrollAtContainerBottom(){if(!this.containerElement){return false}return this.containerElement&&this.containerElement.scrollTop+this.containerElement.clientHeight>=this.containerElement.scrollHeight}isScrollAtPageBottom(){return window.innerHeight+window.scrollY>=document.body.offsetHeight}get canScroll(){const t=this.host.children.length>0;return this.state==="ready"&&t&&(!this.mobileOnlyInfiniteScroll||window.innerWidth<this.mobileViewPortWidth)}render(){const t=this.host.children.length>0;if(t){return n(e,null,n("div",{class:"container",ref:t=>this.containerElement=t},n("slot",null),this.canScroll&&n("div",{class:"pagination"},n("sp-theme",{scale:"medium",color:"dark"},this.state==="ready"&&this.hasNextPage&&n("sp-button",{onClick:this.nextPage},n("div",{slot:"icon"},n("refresh-icon",{class:"refres-icon"}))," ","Load more...")))))}return n(e,null,n("sp-theme",{scale:"medium",color:"dark"},this.hasPreviousPage&&n("sp-button",{class:"previous",parr:"previous",onClick:this.previousPage},n("div",{slot:"icon"},n("chevron-icon",{class:"previous-icon"}))," ","Previous"),this.hasPreviousPage&&this.hasNextPage&&" ",this.hasNextPage&&n("sp-button",{class:"next",parr:"next",onClick:this.nextPage},n("div",{slot:"icon"},n("chevron-icon",{class:"next-icon"}))," ","Next")))}get host(){return s(this)}};c([o({name:"nylas-pagination",stateToProps:new Map([["mailbox.hasNextThreadPage","hasNextPage"],["mailbox.hasPreviousThreadPage","hasPreviousPage"],["mailbox.state","state"]]),eventToProps:{next:async(t,i)=>{a(`[nylas-pagination] Next page event fired`);const{hasChildren:n}=t.detail;await i.threads.nextThreadPage(n?"append":"overwrite",!n)},previous:async(t,i)=>{a(`[nylas-pagination] Previous page event fired`);const{hasChildren:n}=t.detail;await i.threads.previousThreadPage(n?"append":"overwrite",!n)}},fireRegisterEvent:true}),h("design:type",Function),h("design:paramtypes",[]),h("design:returntype",void 0)],d.prototype,"render",null);d.style=l;export{d as nylas_mailbox_pagination};
+//# sourceMappingURL=p-b7d4b7b5.entry.js.map

package/dist/nylas-web-elements/p-b7d4b7b5.entry.js.map

@@ -0,0 +1 @@
+{"version":3,"names":["nylasMailboxPaginationCss","NylasMailboxPaginationStyle0","NylasMailboxPagination","constructor","hostRef","debug","this","isScrollAtContainerBottom","bind","isScrollAtPageBottom","nextPage","previousPage","handlePageScroll","handleContainerScroll","connectedCallback","componentWillLoad","componentDidLoad","containerElement","addEventListener","componentWillRender","disconnectedCallback","removeEventListener","_event","canScroll","scrollTarget","hasChildren","host","children","length","next","emit","previous","scrollTop","clientHeight","scrollHeight","window","innerHeight","scrollY","document","body","offsetHeight","state","mobileOnlyInfiniteScroll","innerWidth","mobileViewPortWidth","render","h","Host","class","ref","r","scale","color","hasNextPage","onClick","slot","hasPreviousPage","parr","__decorate","RegisterComponent","name","stateToProps","Map","eventToProps","async","event","nylasConnector","detail","threads","nextThreadPage","previousThreadPage","fireRegisterEvent"],"sources":["src/components/mailbox/nylas-mailbox-pagination/nylas-mailbox-pagination.scss?tag=nylas-mailbox-pagination&encapsulation=shadow","src/components/mailbox/nylas-mailbox-pagination/nylas-mailbox-pagination.tsx"],"sourcesContent":[":host {\n  display: contents;\n}\n\n.container {\n  height: var(--container-height, 100dvh);\n  overflow-y: var(--container-overflow-y, auto);\n}\n\n.pagination {\n  display: flex;\n  justify-content: center;\n  align-items: center;\n  margin: 0 auto;\n  padding: 0;\n  list-style: none;\n  font-size: 0.875rem;\n  font-weight: 600;\n  color: var(--nylas-color-primary-600);\n\n  sp-button {\n    svg {\n      animation: rotate 1s linear infinite;\n    }\n  }\n}\n\nsp-button {\n  border-radius: var(--nylas-border-radius);\n  background-color: var(--nylas-color-primary-400);\n  color: var(--nylas-color-primary-900);\n  fill: var(--nylas-color-primary-900);\n\n  &:hover {\n    background-color: var(--nylas-color-primary-500);\n  }\n\n  &:disabled {\n    background-color: var(--nylas-color-primary-200);\n    color: var(--nylas-color-primary-600);\n    cursor: not-allowed;\n  }\n\n  chevron-icon {\n    svg {\n      width: 15px;\n      height: 15px;\n    }\n  }\n}\n\n.next {\n  chevron-icon {\n    transform: rotate(180deg);\n  }\n}\n\n@keyframes rotate {\n  from {\n    transform: rotate(0deg);\n  }\n  to {\n    transform: rotate(360deg);\n  }\n}\n","import { RegisterComponent } from '@/common/register-component';\nimport { debug } from '@/utils/utils';\nimport { Component, Element, Event, EventEmitter, Host, Listen, Method, Prop, h } from '@stencil/core';\nimport { NylasMailboxConnector } from '../../..';\nimport { NylasMailbox } from '../nylas-mailbox/nylas-mailbox';\n\nexport type PaginationEvent = {\n  hasChildren: boolean;\n};\n\n@Component({\n  tag: 'nylas-mailbox-pagination',\n  styleUrl: 'nylas-mailbox-pagination.scss',\n  shadow: true,\n})\nexport class NylasMailboxPagination {\n  /**\n   * @description The host element\n   */\n  @Element() host!: HTMLNylasMailboxPaginationElement;\n\n  /**\n   * @description The state of the mailbox\n   */\n  @Prop() state: 'ready' | 'loading' | 'error' = 'ready';\n\n  /**\n   * @description Whether or not the mailbox has a next or previous page of threads\n   */\n  @Prop() hasNextPage: boolean = false;\n\n  /**\n   * @description Whether or not the mailbox has a previous page of threads\n   */\n  @Prop() hasPreviousPage: boolean = false;\n\n  /**\n   * @description Whether or not the mailbox has a next or previous page of threads\n   */\n  @Prop() scrollTarget: 'container' | 'page' = 'container';\n\n  /**\n   * @description Whether or not the infinity scroll should only be enabled on mobile devices\n   */\n  @Prop() mobileOnlyInfiniteScroll: boolean = true;\n\n  /**\n   * @description The width of the mobile viewport\n   */\n  @Prop() mobileViewPortWidth: number = 768;\n\n  /**\n   * @description An event that is fired when the user scrolls to the bottom of the page\n   */\n  @Event() next!: EventEmitter<PaginationEvent>;\n\n  /**\n   * @description An event that is fired when the user scrolls to the top of the page\n   */\n  @Event() previous!: EventEmitter<PaginationEvent>;\n\n  /**\n   * @description The container element\n   */\n  private containerElement?: HTMLDivElement;\n\n  constructor() {\n    debug(`[nylas-pagination] Constructed`);\n    this.isScrollAtContainerBottom = this.isScrollAtContainerBottom.bind(this);\n    this.isScrollAtPageBottom = this.isScrollAtPageBottom.bind(this);\n    this.nextPage = this.nextPage.bind(this);\n    this.previousPage = this.previousPage.bind(this);\n    this.handlePageScroll = this.handlePageScroll.bind(this);\n    this.handleContainerScroll = this.handleContainerScroll.bind(this);\n  }\n\n  connectedCallback() {\n    debug(`[nylas-pagination] Component connected`);\n  }\n\n  async componentWillLoad() {\n    debug(`[nylas-pagination] Component will load`);\n  }\n\n  async componentDidLoad() {\n    debug(`[nylas-pagination] Component did load`);\n    if (this.containerElement) {\n      this.containerElement.addEventListener('scroll', this.handleContainerScroll);\n    }\n  }\n\n  async componentWillRender() {\n    debug(`[nylas-pagination] Component will render`);\n  }\n\n  disconnectedCallback() {\n    debug(`[nylas-pagination] Component disconnected`);\n    if (this.containerElement) {\n      this.containerElement.removeEventListener('scroll', this.handleContainerScroll);\n    }\n  }\n\n  /**\n   * @description Listen for scroll events and fire the next page event when the user scrolls to the bottom of the page\n   * @param _event An event that is fired when the user scrolls\n   */\n  @Listen('scroll', { target: 'window' })\n  public handlePageScroll(_event: Event) {\n    if (this.isScrollAtPageBottom() && this.canScroll && this.scrollTarget === 'page') {\n      this.nextPage();\n    }\n  }\n\n  /**\n   * @description Go to the next page of threads\n   */\n  @Method()\n  public async nextPage() {\n    const hasChildren = this.host.children.length > 0;\n    this.next.emit({\n      hasChildren,\n    });\n  }\n\n  /**\n   * @description Go to the previous page of threads\n   */\n  @Method()\n  public async previousPage() {\n    const hasChildren = this.host.children.length > 0;\n    this.previous.emit({\n      hasChildren,\n    });\n  }\n\n  /**\n   * @description Handle the scroll event\n   * @param event An event that is fired when the user scrolls\n   */\n  private handleContainerScroll(_event: Event) {\n    if (this.isScrollAtContainerBottom() && this.canScroll && this.scrollTarget === 'container') {\n      this.nextPage();\n    }\n  }\n\n  /**\n   * @description Check if the user has scrolled to the bottom of the page\n   */\n  private isScrollAtContainerBottom() {\n    if (!this.containerElement) {\n      return false;\n    }\n    return this.containerElement && this.containerElement.scrollTop + this.containerElement.clientHeight >= this.containerElement.scrollHeight;\n  }\n\n  /**\n   * @description Check if the user has scrolled to the bottom of the page\n   */\n  private isScrollAtPageBottom() {\n    return window.innerHeight + window.scrollY >= document.body.offsetHeight;\n  }\n\n  /**\n   * @description Check if the user can scroll to the next page\n   * @returns boolean\n   */\n  private get canScroll() {\n    const hasChildren = this.host.children.length > 0;\n    return this.state === 'ready' && hasChildren && (!this.mobileOnlyInfiniteScroll || window.innerWidth < this.mobileViewPortWidth);\n  }\n\n  @RegisterComponent<NylasMailboxPagination, NylasMailboxConnector, Exclude<NylasMailbox['stores'], undefined>>({\n    name: 'nylas-pagination',\n    stateToProps: new Map([\n      ['mailbox.hasNextThreadPage', 'hasNextPage'],\n      ['mailbox.hasPreviousThreadPage', 'hasPreviousPage'],\n      ['mailbox.state', 'state'],\n    ]),\n    eventToProps: {\n      next: async (event: CustomEvent<PaginationEvent>, nylasConnector: NylasMailboxConnector) => {\n        debug(`[nylas-pagination] Next page event fired`);\n        const { hasChildren } = event.detail;\n        await nylasConnector.threads.nextThreadPage(hasChildren ? 'append' : 'overwrite', !hasChildren);\n      },\n      previous: async (event: CustomEvent<PaginationEvent>, nylasConnector: NylasMailboxConnector) => {\n        debug(`[nylas-pagination] Previous page event fired`);\n        const { hasChildren } = event.detail;\n        await nylasConnector.threads.previousThreadPage(hasChildren ? 'append' : 'overwrite', !hasChildren);\n      },\n    },\n    fireRegisterEvent: true,\n  })\n  render() {\n    const hasChildren = this.host.children.length > 0;\n    if (hasChildren) {\n      return (\n        <Host>\n          <div class=\"container\" ref={r => (this.containerElement = r)}>\n            <slot></slot>\n            {this.canScroll && (\n              <div class={'pagination'}>\n                <sp-theme scale=\"medium\" color=\"dark\">\n                  {this.state === 'ready' && this.hasNextPage && (\n                    <sp-button onClick={this.nextPage}>\n                      <div slot=\"icon\">\n                        <refresh-icon class={'refres-icon'} />\n                      </div>{' '}\n                      Load more...\n                    </sp-button>\n                  )}\n                </sp-theme>\n              </div>\n            )}\n          </div>\n        </Host>\n      );\n    }\n\n    return (\n      <Host>\n        <sp-theme scale=\"medium\" color=\"dark\">\n          {this.hasPreviousPage && (\n            <sp-button class={'previous'} parr=\"previous\" onClick={this.previousPage}>\n              <div slot=\"icon\">\n                <chevron-icon class={'previous-icon'} />\n              </div>{' '}\n              Previous\n            </sp-button>\n          )}\n          {this.hasPreviousPage && this.hasNextPage && ' '}\n          {this.hasNextPage && (\n            <sp-button class={'next'} parr=\"next\" onClick={this.nextPage}>\n              <div slot=\"icon\">\n                <chevron-icon class={'next-icon'} />\n              </div>{' '}\n              Next\n            </sp-button>\n          )}\n        </sp-theme>\n      </Host>\n    );\n  }\n}\n"],"mappings":"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"}

package/dist/nylas-web-elements/p-b85dfeac.entry.js

@@ -0,0 +1,2 @@
+import{r as e,c as t,h as a,H as r}from"./p-c66e27d0.js";import{R as o}from"./p-5862975b.js";import{d as i,b as n,c as s}from"./p-98ec4a7a.js";const l=':host{display:block;font-size:var(--nylas-font-size, inherit);font-family:var(--nylas-font-family, inherit)}.list-thread{display:grid;grid-auto-flow:row;color:var(--nylas-color-primary-800);width:100%}.thread{position:relative;width:100%;display:grid;padding:0.5rem 1rem;column-gap:0.25rem;grid-template-areas:"........ from    count   ....... date actions" "checkbox subject subject subject subject actions" "........ snippet snippet snippet snippet actions";grid-template-columns:auto auto auto auto auto auto;margin-bottom:0.75rem;border-radius:var(--nylas-border-radius-2x);color:var(--nylas-color-primary-00);background-color:var(--nylas-color-primary-50);border:0;box-sizing:border-box;text-align:left;cursor:pointer;box-shadow:1px 1px 3px 0px rgba(0, 0, 0, 0.3);font-size:inherit;font-family:inherit}.thread.loading{animation:pulsate 1.5s infinite ease-in-out;width:100%;height:90px}.thread:last-of-type{margin-bottom:0}.thread.selected{box-shadow:0 2px 0 0 var(--nylas-color-primary-200);background-color:var(--nylas-color-primary-100)}.thread:hover{box-shadow:0 2px 0 0 var(--nylas-color-primary-200);background-color:var(--nylas-color-primary-100)}.thread>div{align-self:center;pointer-events:all !important}.thread .actions{grid-area:actions}.thread .actions sp-action-menu{pointer-events:initial !important}.thread .actions sp-action-button{pointer-events:initial !important}.thread .actions sp-menu-item{pointer-events:initial !important}.thread .checkbox{grid-area:checkbox;margin-right:0.5rem;pointer-events:initial !important}.thread .checkbox sp-checkbox{pointer-events:initial !important}.thread .star{grid-area:star;justify-self:end}.thread .from{grid-area:from;color:var(--nylas-color-primary-600)}.thread .count{grid-area:count;color:var(--nylas-color-primary-600)}.thread .subject{grid-area:subject;color:var(--nylas-color-primary-600)}.thread .snippet{grid-area:snippet;color:var(--nylas-color-primary-500)}.thread .date{grid-area:date;align-self:center;color:var(--nylas-color-primary-500)}.thread.unread .from,.thread.unread .count,.thread.unread .subject,.thread.unread .date{font-weight:600;color:var(--nylas-color-primary-800)}.thread.unread .snippet{color:var(--nylas-color-primary-700)}.thread .from{white-space:nowrap;overflow:hidden;text-overflow:ellipsis}.thread .snippet{white-space:nowrap;overflow:hidden;text-overflow:ellipsis}.thread .subject{white-space:nowrap;overflow:hidden;text-overflow:ellipsis}@media only screen and (min-width: 768px){.thread{column-gap:1rem;grid-template-areas:"checkbox from count subject snippet date actions";grid-template-columns:auto minmax(auto, 200px) auto auto 1fr auto auto;margin-bottom:0.5rem;border:1px solid var(--nylas-color-primary-100)}.thread.no-checkbox{grid-template-areas:"from count subject snippet date actions";grid-template-columns:minmax(auto, 200px) auto auto 1fr auto auto}.thread .checkbox{margin-right:0}}@keyframes pulsate{0%{background-color:var(--nylas-color-primary-50)}50%{background-color:var(--nylas-color-primary-100)}100%{background-color:var(--nylas-color-primary-50)}}';const d=l;var c=undefined&&undefined.__decorate||function(e,t,a,r){var o=arguments.length,i=o<3?t:r===null?r=Object.getOwnPropertyDescriptor(t,a):r,n;if(typeof Reflect==="object"&&typeof Reflect.decorate==="function")i=Reflect.decorate(e,t,a,r);else for(var s=e.length-1;s>=0;s--)if(n=e[s])i=(o<3?n(i):o>3?n(t,a,i):n(t,a))||i;return o>3&&i&&Object.defineProperty(t,a,i),i};var p=undefined&&undefined.__metadata||function(e,t){if(typeof Reflect==="object"&&typeof Reflect.metadata==="function")return Reflect.metadata(e,t)};const h=class{constructor(a){e(this,a);this.threadSelected=t(this,"threadSelected",7);this.handleThreadSelected=async e=>{i(`[nylas-list-threads] Thread selected`,{thread:e});const t=this.threadSelected.emit(e);if(!t.defaultPrevented){i(`[nylas-list-threads] Default event not prevented, selecting thread`)}};this.handleCheckboxClick=async e=>{i(`[nylas-list-threads] Checkbox clicked`,{event:e});e.stopPropagation()};this.threads=[];this.isAuthenticated=false;this.tokenInfo=undefined;this.state="ready";this.showCheckbox=false}connectedCallback(){}disconnectedCallback(){}async componentWillLoad(){i(`[nylas-list-threads] Component will load`)}async componentDidLoad(){i(`[nylas-list-threads] Component did load`,{isAuthenticated:this.isAuthenticated})}render(){return a(r,{key:"f8224d16a4bbf0202ae3bece1840871ad278b747"},a("div",{key:"266e3536d199a4de04abfd57c0d4f8ea2bb84d95",class:"list-thread",part:"list-thread"},this.state==="loading"&&new Array(10).fill(0).map(((e,t)=>a("div",{class:"thread loading",style:{animationDelay:`${t*20}ms`}}))),this.state==="ready"&&this.threads.map((e=>a("button",{key:e?.id,class:{thread:true,unread:e?.unread===true,"no-checkbox":this.showCheckbox===false},part:"thread","aria-label":`Thread with subject ${e?.subject}`,onClick:()=>this.handleThreadSelected(e)},this.showCheckbox&&a("div",{class:"checkbox",part:"checkbox"},a("sp-checkbox",{size:"s",value:e?.id,onClick:this.handleCheckboxClick})),a("div",{class:"from",part:"from"},n(e.participants??[],this.tokenInfo?.email,e?.message_ids?.length||1,1)),a("div",{class:"subject",part:"subject"},e?.subject),a("div",{class:"count",part:"count"},e?.message_ids?.length||1),a("div",{class:"snippet",part:"snippet"},e?.snippet?.trim()),e.latest_message_received_date&&a("div",{class:"date","aria-label":`${Intl.DateTimeFormat(undefined,{dateStyle:"full"}).format(new Date(e.latest_message_received_date*1e3))}`,part:"date"},s(e.latest_message_received_date)))))))}};c([o({name:"nylas-list-threads",stateToProps:new Map([["auth.isAuthenticated","isAuthenticated"],["auth.tokenInfo","tokenInfo"],["mailbox.threads","threads"],["mailbox.state","state"]]),eventToProps:{threadSelected:async(e,t)=>{i(`[nylas-list-threads] Thread selected`,{event:e});await t.threads.selectThread(e.detail)}},fireRegisterEvent:true}),p("design:type",Function),p("design:paramtypes",[]),p("design:returntype",void 0)],h.prototype,"render",null);h.style=d;export{h as nylas_list_threads};
+//# sourceMappingURL=p-b85dfeac.entry.js.map

package/dist/nylas-web-elements/p-b85dfeac.entry.js.map

@@ -0,0 +1 @@
+{"version":3,"names":["nylasListThreadsCss","NylasListThreadsStyle0","NylasListThreads","this","handleThreadSelected","async","thread","debug","event","threadSelected","emit","defaultPrevented","handleCheckboxClick","stopPropagation","connectedCallback","disconnectedCallback","componentWillLoad","componentDidLoad","isAuthenticated","render","h","Host","key","class","part","state","Array","fill","map","_","i","style","animationDelay","threads","id","unread","showCheckbox","subject","onClick","size","value","formatParticipants","participants","tokenInfo","email","message_ids","length","snippet","trim","latest_message_received_date","Intl","DateTimeFormat","undefined","dateStyle","format","Date","formatDateTime","__decorate","RegisterComponent","name","stateToProps","Map","eventToProps","nylasConnector","selectThread","detail","fireRegisterEvent"],"sources":["src/components/mailbox/nylas-list-threads/nylas-list-threads.scss?tag=nylas-list-threads&encapsulation=shadow","src/components/mailbox/nylas-list-threads/nylas-list-threads.tsx"],"sourcesContent":[":host {\n  display: block;\n  font-size: var(--nylas-font-size, inherit);\n  font-family: var(--nylas-font-family, inherit);\n}\n\n.list-thread {\n  display: grid;\n  grid-auto-flow: row;\n  color: var(--nylas-color-primary-800);\n  width: 100%;\n}\n\n.thread {\n  position: relative;\n  width: 100%;\n  display: grid;\n  padding: 0.5rem 1rem;\n  column-gap: 0.25rem;\n  grid-template-areas:\n    '........ from    count   ....... date actions'\n    'checkbox subject subject subject subject actions'\n    '........ snippet snippet snippet snippet actions';\n  grid-template-columns: auto auto auto auto auto auto;\n  margin-bottom: 0.75rem;\n  border-radius: var(--nylas-border-radius-2x);\n  color: var(--nylas-color-primary-00);\n  background-color: var(--nylas-color-primary-50);\n  border: 0;\n  box-sizing: border-box;\n  text-align: left;\n  cursor: pointer;\n  box-shadow: 1px 1px 3px 0px rgb(0 0 0 / 30%);\n\n  font-size: inherit;\n  font-family: inherit;\n\n  &.loading {\n    animation: pulsate 1.5s infinite ease-in-out;\n    width: 100%;\n    height: 90px;\n  }\n\n  &:last-of-type {\n    margin-bottom: 0;\n  }\n\n  &.selected {\n    box-shadow: 0 2px 0 0 var(--nylas-color-primary-200);\n    background-color: var(--nylas-color-primary-100);\n  }\n\n  &:hover {\n    box-shadow: 0 2px 0 0 var(--nylas-color-primary-200);\n    background-color: var(--nylas-color-primary-100);\n  }\n\n  > div {\n    align-self: center;\n    pointer-events: all !important;\n  }\n\n  .actions {\n    grid-area: actions;\n  }\n\n  .actions sp-action-menu {\n    pointer-events: initial !important;\n  }\n\n  .actions sp-action-button {\n    pointer-events: initial !important;\n  }\n\n  .actions sp-menu-item {\n    pointer-events: initial !important;\n  }\n\n  .checkbox {\n    grid-area: checkbox;\n    margin-right: 0.5rem;\n    pointer-events: initial !important;\n    sp-checkbox {\n      pointer-events: initial !important;\n    }\n  }\n\n  .star {\n    grid-area: star;\n    justify-self: end;\n  }\n\n  .from {\n    grid-area: from;\n    color: var(--nylas-color-primary-600);\n  }\n\n  .count {\n    grid-area: count;\n    color: var(--nylas-color-primary-600);\n  }\n\n  .subject {\n    grid-area: subject;\n    color: var(--nylas-color-primary-600);\n  }\n\n  .snippet {\n    grid-area: snippet;\n    color: var(--nylas-color-primary-500);\n  }\n\n  .date {\n    grid-area: date;\n    align-self: center;\n    color: var(--nylas-color-primary-500);\n  }\n\n  &.unread {\n    .from,\n    .count,\n    .subject,\n    .date {\n      font-weight: 600;\n      color: var(--nylas-color-primary-800);\n    }\n\n    .snippet {\n      color: var(--nylas-color-primary-700);\n    }\n  }\n\n  .from {\n    white-space: nowrap;\n    overflow: hidden;\n    text-overflow: ellipsis;\n  }\n\n  .snippet {\n    white-space: nowrap;\n    overflow: hidden;\n    text-overflow: ellipsis;\n  }\n\n  .subject {\n    white-space: nowrap;\n    overflow: hidden;\n    text-overflow: ellipsis;\n  }\n}\n\n/* Extra small devices (phones, 600px and down) */\n@media only screen and (max-width: 600px) {\n}\n\n/* Small devices (portrait tablets and large phones, 600px and up) */\n@media only screen and (min-width: 600px) {\n}\n\n/* Medium devices (landscape tablets, 768px and up) */\n@media only screen and (min-width: 768px) {\n  .thread {\n    column-gap: 1rem;\n    grid-template-areas: 'checkbox from count subject snippet date actions';\n    grid-template-columns: auto minmax(auto, 200px) auto auto 1fr auto auto;\n    margin-bottom: 0.5rem;\n    border: 1px solid var(--nylas-color-primary-100);\n\n    &.no-checkbox {\n      grid-template-areas: 'from count subject snippet date actions';\n      grid-template-columns: minmax(auto, 200px) auto auto 1fr auto auto;\n    }\n\n    .checkbox {\n      margin-right: 0;\n    }\n  }\n}\n\n@keyframes pulsate {\n  0% {\n    background-color: var(--nylas-color-primary-50);\n  }\n  50% {\n    background-color: var(--nylas-color-primary-100);\n  }\n  100% {\n    background-color: var(--nylas-color-primary-50);\n  }\n}\n\n/* Large devices (laptops/desktops, 992px and up) */\n@media only screen and (min-width: 992px) {\n}\n\n/* Extra large devices (large laptops and desktops, 1200px and up) */\n@media only screen and (min-width: 1200px) {\n}\n","import { RegisterComponent } from '@/common/register-component';\nimport { DataState } from '@/common/types';\nimport { debug, formatDateTime, formatParticipants } from '@/utils/utils';\nimport { Thread } from '@nylas/core';\nimport { TokenInfo } from '@nylas/core/dist/auth';\nimport { Component, Event, EventEmitter, Host, Prop, h } from '@stencil/core';\nimport { NylasMailboxConnector } from '../../..';\nimport { NylasMailbox } from '../nylas-mailbox/nylas-mailbox';\n\n@Component({\n  tag: 'nylas-list-threads',\n  styleUrl: 'nylas-list-threads.scss',\n  shadow: true,\n})\nexport class NylasListThreads {\n  @Prop() readonly threads: Thread[] = [];\n  @Prop() readonly isAuthenticated: boolean = false;\n  @Prop() readonly tokenInfo?: TokenInfo;\n  @Prop() readonly state: DataState = 'ready';\n  @Prop() readonly showCheckbox: boolean = false;\n  @Event({ cancelable: true }) readonly threadSelected!: EventEmitter<Thread>;\n\n  connectedCallback() {}\n\n  disconnectedCallback() {}\n\n  async componentWillLoad() {\n    debug(`[nylas-list-threads] Component will load`);\n  }\n\n  async componentDidLoad() {\n    debug(`[nylas-list-threads] Component did load`, { isAuthenticated: this.isAuthenticated });\n  }\n\n  /**\n   * Handle thread selected\n   * @param thread The thread that was selected\n   * @returns void\n   * @emits threadSelected\n   */\n  private handleThreadSelected = async (thread: Thread) => {\n    debug(`[nylas-list-threads] Thread selected`, { thread });\n    const event = this.threadSelected.emit(thread);\n    if (!event.defaultPrevented) {\n      debug(`[nylas-list-threads] Default event not prevented, selecting thread`);\n    }\n  };\n\n  /**\n   * Handle checkbox click\n   * @param event The click event\n   * @returns void\n   */\n  private handleCheckboxClick = async (event: Event) => {\n    debug(`[nylas-list-threads] Checkbox clicked`, { event });\n    event.stopPropagation();\n  };\n\n  @RegisterComponent<NylasListThreads, NylasMailboxConnector, Exclude<NylasMailbox['stores'], undefined>>({\n    name: 'nylas-list-threads',\n    stateToProps: new Map([\n      ['auth.isAuthenticated', 'isAuthenticated'],\n      ['auth.tokenInfo', 'tokenInfo'],\n      ['mailbox.threads', 'threads'],\n      ['mailbox.state', 'state'],\n    ]),\n    eventToProps: {\n      threadSelected: async (event: CustomEvent<Thread>, nylasConnector: NylasMailboxConnector) => {\n        debug(`[nylas-list-threads] Thread selected`, { event });\n        await nylasConnector.threads.selectThread(event.detail);\n      },\n    },\n    fireRegisterEvent: true,\n  })\n  render() {\n    return (\n      <Host>\n        <div class={'list-thread'} part=\"list-thread\">\n          {this.state === 'loading' && new Array(10).fill(0).map((_, i) => <div class=\"thread loading\" style={{ animationDelay: `${i * 20}ms` }} />)}\n          {this.state === 'ready' &&\n            this.threads.map(thread => (\n              <button\n                key={thread?.id}\n                class={{\n                  'thread': true,\n                  'unread': thread?.unread === true,\n                  'no-checkbox': this.showCheckbox === false,\n                }}\n                part=\"thread\"\n                aria-label={`Thread with subject ${thread?.subject}`}\n                onClick={() => this.handleThreadSelected(thread)}\n              >\n                {this.showCheckbox && (\n                  <div class=\"checkbox\" part=\"checkbox\">\n                    <sp-checkbox size=\"s\" value={thread?.id} onClick={this.handleCheckboxClick} />\n                  </div>\n                )}\n                <div class=\"from\" part=\"from\">\n                  {formatParticipants(thread.participants ?? [], this.tokenInfo?.email, thread?.message_ids?.length || 1, 1)}\n                </div>\n                <div class=\"subject\" part=\"subject\">\n                  {thread?.subject}\n                </div>\n                <div class=\"count\" part=\"count\">\n                  {thread?.message_ids?.length || 1}\n                </div>\n                <div class=\"snippet\" part=\"snippet\">\n                  {thread?.snippet?.trim()}\n                </div>\n                {thread.latest_message_received_date && (\n                  <div\n                    class=\"date\"\n                    aria-label={`${Intl.DateTimeFormat(undefined, { dateStyle: 'full' }).format(new Date(thread.latest_message_received_date * 1000))}`}\n                    part=\"date\"\n                  >\n                    {formatDateTime(thread.latest_message_received_date)}\n                  </div>\n                )}\n              </button>\n            ))}\n        </div>\n      </Host>\n    );\n  }\n}\n"],"mappings":"+IAAA,MAAMA,EAAsB,kgGAC5B,MAAAC,EAAeD,E,ugBCaFE,EAAgB,M,wEA0BnBC,KAAAC,qBAAuBC,MAAOC,IACpCC,EAAM,uCAAwC,CAAED,WAChD,MAAME,EAAQL,KAAKM,eAAeC,KAAKJ,GACvC,IAAKE,EAAMG,iBAAkB,CAC3BJ,EAAM,qE,GASFJ,KAAAS,oBAAsBP,MAAOG,IACnCD,EAAM,wCAAyC,CAAEC,UACjDA,EAAMK,iBAAiB,E,aAxCY,G,qBACO,M,oCAER,Q,kBACK,K,CAGzC,iBAAAC,GAAiB,CAEjB,oBAAAC,GAAoB,CAEpB,uBAAMC,GACJT,EAAM,2C,CAGR,sBAAMU,GACJV,EAAM,0CAA2C,CAAEW,gBAAiBf,KAAKe,iB,CA2C3E,MAAAC,GACE,OACEC,EAACC,EAAI,CAAAC,IAAA,4CACHF,EAAA,OAAAE,IAAA,2CAAKC,MAAO,cAAeC,KAAK,eAC7BrB,KAAKsB,QAAU,WAAa,IAAIC,MAAM,IAAIC,KAAK,GAAGC,KAAI,CAACC,EAAGC,IAAMV,EAAA,OAAKG,MAAM,iBAAiBQ,MAAO,CAAEC,eAAgB,GAAGF,EAAI,YAC5H3B,KAAKsB,QAAU,SACdtB,KAAK8B,QAAQL,KAAItB,GACfc,EAAA,UACEE,IAAKhB,GAAQ4B,GACbX,MAAO,CACLjB,OAAU,KACV6B,OAAU7B,GAAQ6B,SAAW,KAC7B,cAAehC,KAAKiC,eAAiB,OAEvCZ,KAAK,SAAQ,aACD,uBAAuBlB,GAAQ+B,UAC3CC,QAAS,IAAMnC,KAAKC,qBAAqBE,IAExCH,KAAKiC,cACJhB,EAAA,OAAKG,MAAM,WAAWC,KAAK,YACzBJ,EAAA,eAAamB,KAAK,IAAIC,MAAOlC,GAAQ4B,GAAII,QAASnC,KAAKS,uBAG3DQ,EAAA,OAAKG,MAAM,OAAOC,KAAK,QACpBiB,EAAmBnC,EAAOoC,cAAgB,GAAIvC,KAAKwC,WAAWC,MAAOtC,GAAQuC,aAAaC,QAAU,EAAG,IAE1G1B,EAAA,OAAKG,MAAM,UAAUC,KAAK,WACvBlB,GAAQ+B,SAEXjB,EAAA,OAAKG,MAAM,QAAQC,KAAK,SACrBlB,GAAQuC,aAAaC,QAAU,GAElC1B,EAAA,OAAKG,MAAM,UAAUC,KAAK,WACvBlB,GAAQyC,SAASC,QAEnB1C,EAAO2C,8BACN7B,EAAA,OACEG,MAAM,OAAM,aACA,GAAG2B,KAAKC,eAAeC,UAAW,CAAEC,UAAW,SAAUC,OAAO,IAAIC,KAAKjD,EAAO2C,6BAA+B,QAC3HzB,KAAK,QAEJgC,EAAelD,EAAO2C,mC,GAzCzCQ,EAAA,CAhBCC,EAAuG,CACtGC,KAAM,qBACNC,aAAc,IAAIC,IAAI,CACpB,CAAC,uBAAwB,mBACzB,CAAC,iBAAkB,aACnB,CAAC,kBAAmB,WACpB,CAAC,gBAAiB,WAEpBC,aAAc,CACZrD,eAAgBJ,MAAOG,EAA4BuD,KACjDxD,EAAM,uCAAwC,CAAEC,gBAC1CuD,EAAe9B,QAAQ+B,aAAaxD,EAAMyD,OAAO,GAG3DC,kBAAmB,O"}

package/dist/nylas-web-elements/p-b96b37f1.entry.js

@@ -0,0 +1,2 @@
+import{r as e,c as s,h as t,H as i,a}from"./p-c66e27d0.js";import{d as r,g as o,h as n}from"./p-98ec4a7a.js";import{t as h,d as l,a as d,b as c}from"./p-5770704d.js";const f=h((e=>{e.setTime(e-e.getMilliseconds()-e.getSeconds()*d)}),((e,s)=>{e.setTime(+e+s*l)}),((e,s)=>(s-e)/l),(e=>e.getMinutes()));const u=f.range;h((e=>{e.setUTCSeconds(0,0)}),((e,s)=>{e.setTime(+e+s*l)}),((e,s)=>(s-e)/l),(e=>e.getUTCMinutes()));const b=h((e=>{e.setTime(e-e.getMilliseconds()-e.getSeconds()*d-e.getMinutes()*l)}),((e,s)=>{e.setTime(+e+s*c)}),((e,s)=>(s-e)/c),(e=>e.getHours()));const p=b.range;h((e=>{e.setUTCMinutes(0,0,0)}),((e,s)=>{e.setTime(+e+s*c)}),((e,s)=>(s-e)/c),(e=>e.getUTCHours()));const g=':host{display:block;font-size:inherit;font-family:inherit;--nylas-grid-border-color:var(--nylas-base-100);--nylas-available-color:var(--nylas-base-500);--nylas-available-hover-color:var(--nylas-base-100);--nylas-unavailable-color:inherit}.legend{display:grid;grid-template-columns:1fr 1fr;gap:1rem;align-items:center;font-size:inherit;font-family:inherit;max-width:fit-content;margin:0 auto;margin-top:1rem}.legend .available{display:grid;grid-template-columns:auto 1fr;gap:0.5rem;align-items:center;font-size:inherit;font-family:inherit}.legend .available .box{width:2rem;height:2rem;background-color:var(--nylas-available-color);border:1px dashed var(--nylas-grid-border-color)}.legend .unavailable{display:grid;grid-template-columns:auto 1fr;gap:0.5rem;align-items:center;font-size:inherit;font-family:inherit}.legend .unavailable .box{width:2rem;height:2rem;background-color:var(--nylas-unavailable-color);border:1px dashed var(--nylas-grid-border-color)}.open-hours{display:grid;gap:1rem;grid-template:".... days days" "hours selected-hours selected-hours" 1fr/auto 1fr}.open-hours .days{grid-area:days;display:grid;grid-auto-flow:column;grid-template-columns:1fr 1fr 1fr 1fr 1fr 1fr 1fr;text-align:center;justify-items:center;font-size:inherit;font-family:inherit}.open-hours .hours{display:grid;grid-auto-flow:row;grid-area:hours;text-align:right;align-items:start;font-size:inherit;font-family:inherit}.open-hours .hours span{top:-0.6rem;display:block;position:relative}.open-hours .selected-hours{display:grid;grid-area:selected-hours;grid-template-columns:1fr 1fr 1fr 1fr 1fr 1fr 1fr}.open-hours .selected-hours .hour{display:grid;border:1px dashed var(--nylas-grid-border-color);height:40px;background-color:var(--nylas-unavailable-color)}.open-hours .selected-hours .hour.selected{background-color:var(--nylas-available-color)}.open-hours .selected-hours .hour.hovered{background-color:var(--nylas-available-hover-color)}.open-hours .selected-hours.inverse .hour{background-color:var(--nylas-available-color)}.open-hours .selected-hours.inverse .hour.selected{background-color:var(--nylas-unavailable-color)}.open-hours .selected-hours.inverse .hour.hovered{background-color:var(--nylas-available-hover-color)}';const v=g;const y=class{constructor(t){e(this,t);this.openHoursChanged=s(this,"openHoursChanged",7);this.dragStartTime=0;this.onSelectedHoursWeel=e=>{e.preventDefault();e.stopPropagation();const{deltaY:s}=e;const t=s>0?-1:1;if(this.intervalMinutes===this.stepMinutes&&t===-1){return}if(this.intervalMinutes===60&&t===1){return}this.intervalMinutes=this.intervalMinutes+t*this.stepMinutes;const i=new Date(this.startTime);i.setHours(this.endTime.getHours(),0,0,0);if(this.intervalMinutes<60){this.times=u(this.startTime,i,this.intervalMinutes)}else{this.times=p(this.startTime,i,this.intervalMinutes/60)}};this.onContextMenu=e=>{e.preventDefault();e.stopPropagation();this.inverse=!this.inverse};this.onMouseDown=(e,s)=>{this.draggingStartDate=s;this.dragStartTime=(new Date).getTime();e.preventDefault();e.stopPropagation()};this.onMouseOver=(e,s)=>{if(!this.isDragging()){return}this.draggingEndDate=s};this.onMouseUp=(e,s)=>{const t=this.host.querySelectorAll(".hovered");t.forEach((e=>{e.classList.remove("hovered")}));if(this.isDragging()&&this.draggingStartDate&&this.draggingEndDate){const e=[];let s=this.draggingStartDate;let t=this.draggingEndDate;t.setMinutes(t.getMinutes()+this.intervalMinutes);const i=s.getDay();const a=t.getDay();if(i===a){e.push({start:s,end:t})}else if(a>i){for(let r=0;r<=a-i;r++){const i=new Date(s);const a=new Date(s);i.setDate(s.getDate()+r);a.setDate(s.getDate()+r);a.setHours(t.getHours());e.push({start:i,end:a})}}for(let s of e){this.updateAvailableTimes(s.start,s.end)}}this.draggingStartDate=null;this.draggingEndDate=null;e.preventDefault();e.stopPropagation()};this.onTimeClick=e=>{if(this.isDragging()){r("dragging for more than threshold, skipping click event");return}this.draggingStartDate=null;const s=new Date(e);const t=new Date(e);t.setMinutes(t.getMinutes()+this.intervalMinutes);this.updateAvailableTimes(s,t)};this.isDragging=()=>{const e=(new Date).getTime();return this.draggingStartDate&&e-this.dragStartTime>this.dragThreshold};this.updateAvailableTimes=(e,s)=>{const{availableTimes:t}=this;const i=t.findIndex((t=>e.getTime()>=t.start.getTime()&&s.getTime()<=t.end.getTime()));if(i!==-1){t.splice(i,1);this.availableTimes=[...t];return}const a=t.findIndex((s=>e.getTime()===s.end.getTime()));if(a!==-1){t[a].end=s;this.availableTimes=[...t];return}const r=t.findIndex((e=>s.getTime()===e.start.getTime()));if(r!==-1){t[r].start=e;this.availableTimes=[...t];return}this.availableTimes=[...t,{start:e,end:s}]};this.isAvailableTime=e=>this.availableTimes.some((s=>s.start.getTime()<=e.getTime()&&s.end.getTime()>e.getTime()));this.getSelectedDate=e=>{const s=new Date(this.startTime);s.setDate(e%7+1);const t=Math.floor(e/7);s.setHours(this.times[t].getHours());s.setMinutes(this.times[t].getMinutes());return s};this.isHovering=e=>{if(!this.draggingStartDate||!this.draggingEndDate){return false}return e.getDay()>=this.draggingStartDate.getDay()&&e.getHours()>=this.draggingStartDate.getHours()&&e.getHours()<=this.draggingEndDate.getHours()&&e.getDay()<=this.draggingEndDate.getDay()};this.calculateAvailableTimes=e=>{const s=[];for(const t of e){for(const e of t.days){if(t.start===t.end){continue}const[i,a]=t.start.split(":").map((e=>parseInt(e,10)));const[r,o]=t.end.split(":").map((e=>parseInt(e,10)));const n=new Date(this.startTime);n.setDate(n.getDate()+e);n.setHours(i);n.setMinutes(a);const h=new Date(this.startTime);h.setDate(h.getDate()+e);h.setHours(r);h.setMinutes(o);s.push({start:n,end:h})}}s.sort(((e,s)=>e.start.getTime()-s.start.getTime()));r("availableTimes",s);return s};this.calculateOpenHours=()=>{const e={};const s=[];let t=[...this.availableTimes];t.sort(((e,s)=>e.start.getTime()-s.start.getTime()));if(this.inverse){const e=[...t];t=[];let s=this.startTime;for(const i of e){const e=i.start;t.push({start:s,end:e});s=i.end}t.push({start:s,end:this.endTime})}t.sort(((e,s)=>e.start.getTime()-s.start.getTime()));for(const s of t){const i=s.start.getDay();const a=s.end.getDay();const r=new Date(s.start);r.setDate(r.getDate()+1);r.setHours(0,0,0,0);if(i>a||a>i){t.push({start:r,end:s.end});s.end=new Date(s.start);s.end.setHours(23,0,0,0)}const n=o(s.start);const h=o(s.end);const l=`${n}-${h}`;if(!e[l]){e[l]=[i]}else{e[l].push(i)}}for(const t in e){const[i,a]=t.split("-");const r=e[t];const o={days:r,start:i,end:a,timezone:n()};s.push(o)}this.openHoursChanged.emit(s)};this.getNumberOfDatesBetween=(e,s)=>{const t=Math.abs(s.getTime()-e.getTime());return Math.ceil(t/(1e3*60*60*24))};this.openHours=[];this.startTime=new Date(2024,8,1,8,0,0,0);this.endTime=new Date(2024,8,7,18,0,0,0);this.stepMinutes=15;this.dragThreshold=150;this.mobileViewPortWidth=768;this.intervalMinutes=60;this.times=[];this.availableTimes=[];this.draggingStartDate=null;this.draggingEndDate=null;this.inverse=false;this.isMobile=false}componentWillLoad(){this.onResize();const e=new Date(this.startTime);e.setHours(this.endTime.getHours(),0,0,0);this.times=p(this.startTime,e,this.intervalMinutes/60);this.availableTimes=this.calculateAvailableTimes(this.openHours)}whenOpenHoursChanged(e,s){if(JSON.stringify(e)===JSON.stringify(s)){return}this.availableTimes=this.calculateAvailableTimes(e)}availableTimesChanged(){this.calculateOpenHours()}inverseChanged(){this.calculateOpenHours()}onResize(){const e=Math.max(document.documentElement.clientWidth||0,window.innerWidth||0);this.isMobile=e<=this.mobileViewPortWidth}render(){return t(i,{key:"7d7260510342c7d666f9596eddee704088451dbb"},t("div",{key:"8ebc305e29157af40c432ec8ff0e182c206cfda0",class:"open-hours",part:"open-hours"},t("div",{key:"df2e84e8387773ff864c56b78d5fbb3f8f7db606",class:"days",part:"days"},Array.from({length:this.getNumberOfDatesBetween(this.startTime,this.endTime)}).map(((e,s)=>{const i=new Date(this.startTime);i.setDate(i.getDate()+s);return t("span",null,i.toLocaleDateString(undefined,{weekday:this.isMobile?"short":"long"}))}))),t("div",{key:"88dff2631e52fed25458d0545dfaba0e0586b8ec",class:"hours",part:"hours"},this.times.map((e=>t("span",null,e.toLocaleTimeString(undefined,{timeStyle:"short"}))))),t("div",{key:"53f658bf52ea9367376fb297ce50d8849bf99841",class:{"selected-hours":true,inverse:this.inverse},part:"selected-hours",onWheel:this.onSelectedHoursWeel,onContextMenu:this.onContextMenu},Array.from({length:this.getNumberOfDatesBetween(this.startTime,this.endTime)*this.times.length}).map(((e,s)=>t("div",{part:"hour",class:{hour:true,selected:this.isAvailableTime(this.getSelectedDate(s)),hovered:this.isHovering(this.getSelectedDate(s))},onMouseDown:e=>this.onMouseDown(e,this.getSelectedDate(s)),onMouseUp:e=>this.onMouseUp(e,this.getSelectedDate(s)),onMouseOver:e=>this.onMouseOver(e,this.getSelectedDate(s)),onClick:()=>this.onTimeClick(this.getSelectedDate(s))}," "))))),t("div",{key:"2f0459102a39a37ee38ff550b7fe7d303bfa9fef",class:"legend",part:"legend"},t("div",{key:"b2ce6eb4496270ae2577164f2fecb9145e7120d5",class:"available",part:"available"},t("span",{key:"0fe60c643e3d9cee77509109bbb99059f1900716",class:"box",part:"box"}),t("span",{key:"3f03d82fe8b20dab316910ced828682880057a4d",class:"label",part:"label"},"Available")),t("div",{key:"188ea3df5640bcd2fe197bf00e2dfd4ede0189cf",class:"unavailable",part:"unavailable"},t("span",{key:"9b313c8a36f2752a8327612efd665ea275175fb5",class:"box",part:"box"}),t("span",{key:"772d25822bd93b80d434f8bb501b4487b5d6a04a",class:"label",part:"label"},"Unavailable"))))}get host(){return a(this)}static get watchers(){return{openHours:["whenOpenHoursChanged"],availableTimes:["availableTimesChanged"],inverse:["inverseChanged"]}}};y.style=v;export{y as nylas_open_hours_picker};
+//# sourceMappingURL=p-b96b37f1.entry.js.map

package/dist/nylas-web-elements/p-b96b37f1.entry.js.map

@@ -0,0 +1 @@
+{"version":3,"names":["timeMinute","timeInterval","date","setTime","getMilliseconds","getSeconds","durationSecond","step","durationMinute","start","end","getMinutes","timeMinutes","range","setUTCSeconds","getUTCMinutes","timeHour","durationHour","getHours","timeHours","setUTCMinutes","getUTCHours","nylasOpenHoursPickerCss","NylasOpenHoursPickerStyle0","NylasOpenHoursPicker","this","dragStartTime","onSelectedHoursWeel","event","preventDefault","stopPropagation","deltaY","intervalMinutes","stepMinutes","Date","startTime","setHours","endTime","times","onContextMenu","inverse","onMouseDown","draggingStartDate","getTime","onMouseOver","_event","isDragging","draggingEndDate","onMouseUp","_date","hoveredElements","host","querySelectorAll","forEach","element","classList","remove","availableTimes","setMinutes","startDay","getDay","endDay","push","i","newStart","newEnd","setDate","getDate","availableTime","updateAvailableTimes","onTimeClick","selectedDate","debug","now","dragThreshold","index","findIndex","aTime","splice","prevIndex","nextIndex","isAvailableTime","some","getSelectedDate","Math","floor","isHovering","hoveredDate","calculateAvailableTimes","openHours","openHour","day","days","startHours","startMinutes","split","map","s","parseInt","endHours","endMinutes","sort","a","b","calculateOpenHours","hours","copyOfAvailableTimes","nextDay","get24HourTime","pair","key","timezone","getUserTimezone","openHoursChanged","emit","getNumberOfDatesBetween","diff","abs","ceil","componentWillLoad","onResize","whenOpenHoursChanged","newValue","oldValue","JSON","stringify","availableTimesChanged","inverseChanged","vw","max","document","documentElement","clientWidth","window","innerWidth","isMobile","mobileViewPortWidth","render","h","Host","class","part","Array","from","length","_","toLocaleDateString","undefined","weekday","toLocaleTimeString","timeStyle","onWheel","hour","selected","hovered","onClick"],"sources":["../../node_modules/.pnpm/d3-time@3.1.0/node_modules/d3-time/src/minute.js","../../node_modules/.pnpm/d3-time@3.1.0/node_modules/d3-time/src/hour.js","src/components/scheduler/nylas-open-hours-picker/nylas-open-hours-picker.scss?tag=nylas-open-hours-picker&encapsulation=shadow","src/components/scheduler/nylas-open-hours-picker/nylas-open-hours-picker.tsx"],"sourcesContent":["import {timeInterval} from \"./interval.js\";\nimport {durationMinute, durationSecond} from \"./duration.js\";\n\nexport const timeMinute = timeInterval((date) => {\n  date.setTime(date - date.getMilliseconds() - date.getSeconds() * durationSecond);\n}, (date, step) => {\n  date.setTime(+date + step * durationMinute);\n}, (start, end) => {\n  return (end - start) / durationMinute;\n}, (date) => {\n  return date.getMinutes();\n});\n\nexport const timeMinutes = timeMinute.range;\n\nexport const utcMinute = timeInterval((date) => {\n  date.setUTCSeconds(0, 0);\n}, (date, step) => {\n  date.setTime(+date + step * durationMinute);\n}, (start, end) => {\n  return (end - start) / durationMinute;\n}, (date) => {\n  return date.getUTCMinutes();\n});\n\nexport const utcMinutes = utcMinute.range;\n","import {timeInterval} from \"./interval.js\";\nimport {durationHour, durationMinute, durationSecond} from \"./duration.js\";\n\nexport const timeHour = timeInterval((date) => {\n  date.setTime(date - date.getMilliseconds() - date.getSeconds() * durationSecond - date.getMinutes() * durationMinute);\n}, (date, step) => {\n  date.setTime(+date + step * durationHour);\n}, (start, end) => {\n  return (end - start) / durationHour;\n}, (date) => {\n  return date.getHours();\n});\n\nexport const timeHours = timeHour.range;\n\nexport const utcHour = timeInterval((date) => {\n  date.setUTCMinutes(0, 0, 0);\n}, (date, step) => {\n  date.setTime(+date + step * durationHour);\n}, (start, end) => {\n  return (end - start) / durationHour;\n}, (date) => {\n  return date.getUTCHours();\n});\n\nexport const utcHours = utcHour.range;\n",":host {\n  display: block;\n  font-size: inherit;\n  font-family: inherit;\n  --nylas-grid-border-color: var(--nylas-base-100);\n  --nylas-available-color: var(--nylas-base-500);\n  --nylas-available-hover-color: var(--nylas-base-100);\n  --nylas-unavailable-color: inherit;\n}\n\n.legend {\n  display: grid;\n  grid-template-columns: 1fr 1fr;\n  gap: 1rem;\n  align-items: center;\n  font-size: inherit;\n  font-family: inherit;\n\n  max-width: fit-content;\n  margin: 0 auto;\n  margin-top: 1rem;\n\n  .available {\n    display: grid;\n    grid-template-columns: auto 1fr;\n    gap: 0.5rem;\n    align-items: center;\n    font-size: inherit;\n    font-family: inherit;\n\n    .box {\n      width: 2rem;\n      height: 2rem;\n      background-color: var(--nylas-available-color);\n      border: 1px dashed var(--nylas-grid-border-color);\n    }\n  }\n\n  .unavailable {\n    display: grid;\n    grid-template-columns: auto 1fr;\n    gap: 0.5rem;\n    align-items: center;\n    font-size: inherit;\n    font-family: inherit;\n\n    .box {\n      width: 2rem;\n      height: 2rem;\n      background-color: var(--nylas-unavailable-color);\n      border: 1px dashed var(--nylas-grid-border-color);\n    }\n  }\n}\n\n.open-hours {\n  display: grid;\n  gap: 1rem;\n  grid-template:\n    '.... days days'\n    'hours selected-hours selected-hours' 1fr / auto 1fr;\n\n  .days {\n    grid-area: days;\n    display: grid;\n    grid-auto-flow: column;\n    grid-template-columns: 1fr 1fr 1fr 1fr 1fr 1fr 1fr;\n    text-align: center;\n    justify-items: center;\n    font-size: inherit;\n    font-family: inherit;\n  }\n\n  .hours {\n    display: grid;\n    grid-auto-flow: row;\n    grid-area: hours;\n    text-align: right;\n    align-items: start;\n    font-size: inherit;\n    font-family: inherit;\n\n    span {\n      top: -0.6rem;\n      display: block;\n      position: relative;\n    }\n  }\n\n  .selected-hours {\n    display: grid;\n    grid-area: selected-hours;\n    grid-template-columns: 1fr 1fr 1fr 1fr 1fr 1fr 1fr;\n\n    .hour {\n      display: grid;\n      border: 1px dashed var(--nylas-grid-border-color);\n\n      height: 40px;\n\n      background-color: var(--nylas-unavailable-color);\n\n      &.selected {\n        background-color: var(--nylas-available-color);\n      }\n\n      &.hovered {\n        background-color: var(--nylas-available-hover-color);\n      }\n    }\n\n    &.inverse {\n      .hour {\n        background-color: var(--nylas-available-color);\n\n        &.selected {\n          background-color: var(--nylas-unavailable-color);\n        }\n\n        &.hovered {\n          background-color: var(--nylas-available-hover-color);\n        }\n      }\n    }\n  }\n}\n","import { debug, get24HourTime, getUserTimezone } from '@/utils/utils';\nimport { OpenHour } from '@nylas/core';\nimport { Component, Element, Event, EventEmitter, Host, Listen, Prop, State, Watch, h } from '@stencil/core';\nimport { timeHours, timeMinutes } from 'd3-time';\n\n@Component({\n  tag: 'nylas-open-hours-picker',\n  styleUrl: 'nylas-open-hours-picker.scss',\n  shadow: true,\n})\nexport class NylasOpenHoursPicker {\n  @Element() public host!: HTMLElement;\n\n  /**\n   * A pre-populated open hour configuration.\n   */\n  @Prop() public readonly openHours: OpenHour[] = [];\n\n  /**\n   * The start time of the day.\n   * Leave this to the default date of 2024-09-01T00:00:00.000Z\n   * unless you want want available times to be a specific year, month, and day.\n   */\n  @Prop({ mutable: true }) public startTime = new Date(2024, 8, 1, 8, 0, 0, 0);\n\n  /**\n   * The end time of the day.\n   * Leave this to the default date of 2024-09-07T23:59:59.999Z\n   * unless you want want available times to be a specific year, month, and day.\n   */\n  @Prop({ mutable: true }) public endTime: Date = new Date(2024, 8, 7, 18, 0, 0, 0);\n\n  /**\n   * The number of minutes between each time.\n   * If this is 15, we'll show 15 minute intervals.\n   * If this is 60, we'll show 1 hour intervals.\n   */\n  @Prop() public stepMinutes: number = 15;\n\n  /**\n   * The number of milliseconds the user must be dragging for before we consider it a drag event.\n   */\n  @Prop() public dragThreshold: number = 150;\n\n  /**\n   * The width of the viewport in mobile.\n   */\n  @Prop() public readonly mobileViewPortWidth: number = 768;\n\n  @State() private intervalMinutes: number = 60;\n  @State() private times: Date[] = [];\n  @State() private availableTimes: { start: Date; end: Date }[] = [];\n  @State() private draggingStartDate: Date | null = null;\n  @State() private draggingEndDate: Date | null = null;\n  @State() private inverse: boolean = false;\n  @State() private isMobile: boolean = false;\n\n  /**\n   * Emitted when open hours is changed.\n   */\n  @Event() readonly openHoursChanged!: EventEmitter<OpenHour[]>;\n\n  private dragStartTime: number = 0;\n\n  componentWillLoad() {\n    this.onResize();\n    const end = new Date(this.startTime);\n    end.setHours(this.endTime.getHours(), 0, 0, 0);\n\n    this.times = timeHours(this.startTime, end, this.intervalMinutes / 60);\n    this.availableTimes = this.calculateAvailableTimes(this.openHours);\n  }\n\n  @Watch('openHours')\n  whenOpenHoursChanged(newValue: OpenHour[], oldValue: OpenHour[]) {\n    // Deep compare newValue with this.openHours\n    if (JSON.stringify(newValue) === JSON.stringify(oldValue)) {\n      return;\n    }\n\n    this.availableTimes = this.calculateAvailableTimes(newValue);\n  }\n\n  @Watch('availableTimes')\n  availableTimesChanged() {\n    this.calculateOpenHours();\n  }\n\n  @Watch('inverse')\n  inverseChanged() {\n    this.calculateOpenHours();\n  }\n\n  @Listen('resize', { target: 'window' })\n  onResize() {\n    const vw = Math.max(document.documentElement.clientWidth || 0, window.innerWidth || 0);\n    this.isMobile = vw <= this.mobileViewPortWidth;\n  }\n\n  private onSelectedHoursWeel = (event: WheelEvent) => {\n    event.preventDefault();\n    event.stopPropagation();\n\n    const { deltaY } = event;\n    const step = deltaY > 0 ? -1 : 1;\n\n    // Do nothing if this.intervalMinutes is 15 and we're scrolling up\n    if (this.intervalMinutes === this.stepMinutes && step === -1) {\n      return;\n    }\n\n    // Do nothing if this.intervalMinutes is 60 and we're scrolling dwon\n    if (this.intervalMinutes === 60 && step === 1) {\n      return;\n    }\n\n    // If scrolling up, increase the interval betwen times by this.stepMinutes minutes\n    // If scrolling down, decrease the interval between times by this.stepMinutes minutes\n    this.intervalMinutes = this.intervalMinutes + step * this.stepMinutes;\n\n    // If the interval is less than 1 hour, we'll use timeMinutes instead of timeHours\n    // This will allow us to show 15 minute intervals\n\n    const end = new Date(this.startTime);\n    end.setHours(this.endTime.getHours(), 0, 0, 0);\n\n    if (this.intervalMinutes < 60) {\n      this.times = timeMinutes(this.startTime, end, this.intervalMinutes);\n    } else {\n      this.times = timeHours(this.startTime, end, this.intervalMinutes / 60);\n    }\n  };\n\n  private onContextMenu = (event: MouseEvent) => {\n    event.preventDefault();\n    event.stopPropagation();\n    this.inverse = !this.inverse;\n  };\n\n  private onMouseDown = (event: MouseEvent, date: Date) => {\n    this.draggingStartDate = date;\n    this.dragStartTime = new Date().getTime();\n    event.preventDefault();\n    event.stopPropagation();\n  };\n\n  private onMouseOver = (_event: MouseEvent, date: Date) => {\n    // Only if draggingAt is within 500ms of the mouseup event\n    if (!this.isDragging()) {\n      return;\n    }\n\n    this.draggingEndDate = date;\n  };\n\n  private onMouseUp = (event: MouseEvent, _date: Date) => {\n    // Remove all hovered classes\n    const hoveredElements = this.host.querySelectorAll('.hovered');\n    hoveredElements.forEach(element => {\n      element.classList.remove('hovered');\n    });\n    // Only if draggingAt is within 500ms of the mouseup event\n    if (this.isDragging() && this.draggingStartDate && this.draggingEndDate) {\n      const availableTimes: { start: Date; end: Date }[] = [];\n      let start = this.draggingStartDate;\n      let end = this.draggingEndDate;\n      end.setMinutes(end.getMinutes() + this.intervalMinutes);\n\n      // Get the day of the week\n      const startDay = start.getDay();\n      const endDay = end.getDay();\n\n      if (startDay === endDay) {\n        availableTimes.push({ start, end });\n      } else if (endDay > startDay) {\n        for (let i = 0; i <= endDay - startDay; i++) {\n          const newStart = new Date(start);\n          const newEnd = new Date(start);\n          newStart.setDate(start.getDate() + i);\n          newEnd.setDate(start.getDate() + i);\n          newEnd.setHours(end.getHours());\n          availableTimes.push({ start: newStart, end: newEnd });\n        }\n      }\n\n      for (let availableTime of availableTimes) {\n        this.updateAvailableTimes(availableTime.start, availableTime.end);\n      }\n    }\n    this.draggingStartDate = null;\n    this.draggingEndDate = null;\n    event.preventDefault();\n    event.stopPropagation();\n  };\n\n  /**\n   * When a time is clicked, we'll add it to the list of available times.\n   * If the time is already in the list of available times, we'll remove it.\n   *\n   * If the time is near start of a previous available time, we'll extend the previous available time.\n   * If the time is near the end of a previous available time, we'll extend the previous available time.\n   */\n  private onTimeClick = (selectedDate: Date) => {\n    // If user has been dragging for more than threshold, skip click event\n    if (this.isDragging()) {\n      debug('dragging for more than threshold, skipping click event');\n      return;\n    }\n    this.draggingStartDate = null;\n\n    const start = new Date(selectedDate);\n    const end = new Date(selectedDate);\n    end.setMinutes(end.getMinutes() + this.intervalMinutes);\n\n    this.updateAvailableTimes(start, end);\n  };\n\n  private isDragging = () => {\n    const now = new Date().getTime();\n    return this.draggingStartDate && now - this.dragStartTime > this.dragThreshold;\n  };\n\n  private updateAvailableTimes = (start: Date, end: Date) => {\n    const { availableTimes } = this;\n\n    // If the selected date is already in the list of available times, remove it\n    const index = availableTimes.findIndex(aTime => start.getTime() >= aTime.start.getTime() && end.getTime() <= aTime.end.getTime());\n    if (index !== -1) {\n      availableTimes.splice(index, 1);\n      this.availableTimes = [...availableTimes];\n      return;\n    }\n\n    // If the selected date starts at the end of a previous available time, extend the previous available time\n    const prevIndex = availableTimes.findIndex(aTime => start.getTime() === aTime.end.getTime());\n    if (prevIndex !== -1) {\n      availableTimes[prevIndex].end = end;\n      this.availableTimes = [...availableTimes];\n      return;\n    }\n\n    // If the selected date is near the end of a previous available time, extend the previous available time\n    const nextIndex = availableTimes.findIndex(aTime => end.getTime() === aTime.start.getTime());\n    if (nextIndex !== -1) {\n      availableTimes[nextIndex].start = start;\n      this.availableTimes = [...availableTimes];\n      return;\n    }\n\n    // Otherwise, add the selected date to the list of available times\n    this.availableTimes = [...availableTimes, { start, end }];\n  };\n\n  private isAvailableTime = (date: Date) => {\n    return this.availableTimes.some(aTime => {\n      return aTime.start.getTime() <= date.getTime() && aTime.end.getTime() > date.getTime();\n    });\n  };\n\n  private getSelectedDate = (index: number) => {\n    // Create a new date object with the date and time\n    const selectedDate = new Date(this.startTime);\n    selectedDate.setDate((index % 7) + 1);\n    const i = Math.floor(index / 7);\n    selectedDate.setHours(this.times[i].getHours());\n    selectedDate.setMinutes(this.times[i].getMinutes());\n    return selectedDate;\n  };\n\n  private isHovering = (hoveredDate: Date): boolean => {\n    if (!this.draggingStartDate || !this.draggingEndDate) {\n      return false;\n    }\n\n    return (\n      hoveredDate.getDay() >= this.draggingStartDate.getDay() &&\n      hoveredDate.getHours() >= this.draggingStartDate.getHours() &&\n      hoveredDate.getHours() <= this.draggingEndDate.getHours() &&\n      hoveredDate.getDay() <= this.draggingEndDate.getDay()\n    );\n  };\n\n  private calculateAvailableTimes = (openHours: OpenHour[]) => {\n    const availableTimes: { start: Date; end: Date }[] = [];\n\n    // Loop through each OpenHour object\n    for (const openHour of openHours) {\n      // Loop through each day in the OpenHour object\n      for (const day of openHour.days) {\n        // Skip if invalid\n        if (openHour.start === openHour.end) {\n          continue;\n        }\n\n        // Get the start and end hours\n        const [startHours, startMinutes] = openHour.start.split(':').map(s => parseInt(s, 10));\n        const [endHours, endMinutes] = openHour.end.split(':').map(s => parseInt(s, 10));\n\n        // Create a new start date\n        const start = new Date(this.startTime);\n        start.setDate(start.getDate() + day);\n        start.setHours(startHours);\n        start.setMinutes(startMinutes);\n\n        // Create a new end date\n        const end = new Date(this.startTime);\n        end.setDate(end.getDate() + day);\n        end.setHours(endHours);\n        end.setMinutes(endMinutes);\n\n        // Add the start and end date to the availableTimes array\n        availableTimes.push({ start, end });\n      }\n    }\n\n    // Sort the availableTimes array\n    availableTimes.sort((a, b) => a.start.getTime() - b.start.getTime());\n\n    debug('availableTimes', availableTimes);\n\n    // Emit the openHoursChanged event\n    return availableTimes;\n  };\n\n  private calculateOpenHours = () => {\n    const hours: { [key: string]: number[] } = {};\n    const openHours: OpenHour[] = [];\n\n    let availableTimes = [...this.availableTimes];\n    availableTimes.sort((a, b) => a.start.getTime() - b.start.getTime());\n\n    if (this.inverse) {\n      const copyOfAvailableTimes = [...availableTimes];\n      availableTimes = [];\n      let start = this.startTime;\n      for (const availableTime of copyOfAvailableTimes) {\n        const end = availableTime.start;\n        availableTimes.push({ start, end });\n        start = availableTime.end;\n      }\n      availableTimes.push({ start, end: this.endTime });\n    }\n    availableTimes.sort((a, b) => a.start.getTime() - b.start.getTime());\n\n    for (const availableTime of availableTimes) {\n      const startDay = availableTime.start.getDay();\n      const endDay = availableTime.end.getDay();\n\n      const nextDay = new Date(availableTime.start);\n      nextDay.setDate(nextDay.getDate() + 1);\n      nextDay.setHours(0, 0, 0, 0);\n\n      if (startDay > endDay || endDay > startDay) {\n        availableTimes.push({ start: nextDay, end: availableTime.end });\n        availableTime.end = new Date(availableTime.start);\n        availableTime.end.setHours(23, 0, 0, 0);\n      }\n\n      const startHours = get24HourTime(availableTime.start);\n      const endHours = get24HourTime(availableTime.end);\n      const pair = `${startHours}-${endHours}`;\n\n      if (!hours[pair]) {\n        hours[pair] = [startDay];\n      } else {\n        hours[pair].push(startDay);\n      }\n    }\n\n    for (const key in hours) {\n      const [startHours, endHours] = key.split('-');\n      const days = hours[key];\n      const openHour: OpenHour = {\n        days,\n        start: startHours,\n        end: endHours,\n        timezone: getUserTimezone(),\n      };\n      openHours.push(openHour);\n    }\n\n    this.openHoursChanged.emit(openHours);\n  };\n\n  private getNumberOfDatesBetween = (start: Date, end: Date) => {\n    const diff = Math.abs(end.getTime() - start.getTime());\n    return Math.ceil(diff / (1000 * 60 * 60 * 24));\n  };\n\n  render() {\n    return (\n      <Host>\n        <div class=\"open-hours\" part=\"open-hours\">\n          <div class=\"days\" part=\"days\">\n            {\n              // Get the days of the week from the start time\n              // and loop through each day\n              Array.from({ length: this.getNumberOfDatesBetween(this.startTime, this.endTime) }).map((_, index) => {\n                const date = new Date(this.startTime);\n                date.setDate(date.getDate() + index);\n                return <span>{date.toLocaleDateString(undefined, { weekday: this.isMobile ? 'short' : 'long' })}</span>;\n              })\n            }\n          </div>\n          <div class=\"hours\" part=\"hours\">\n            {this.times.map(date => (\n              <span>{date.toLocaleTimeString(undefined, { timeStyle: 'short' })}</span>\n            ))}\n          </div>\n          <div\n            class={{\n              'selected-hours': true,\n              'inverse': this.inverse,\n            }}\n            part=\"selected-hours\"\n            onWheel={this.onSelectedHoursWeel}\n            onContextMenu={this.onContextMenu}\n          >\n            {\n              // Grid of 7 * this.hours.length\n              Array.from({ length: this.getNumberOfDatesBetween(this.startTime, this.endTime) * this.times.length }).map((_, index) => (\n                <div\n                  part=\"hour\"\n                  class={{\n                    hour: true,\n                    selected: this.isAvailableTime(this.getSelectedDate(index)),\n                    hovered: this.isHovering(this.getSelectedDate(index)),\n                  }}\n                  onMouseDown={event => this.onMouseDown(event, this.getSelectedDate(index))}\n                  onMouseUp={event => this.onMouseUp(event, this.getSelectedDate(index))}\n                  onMouseOver={event => this.onMouseOver(event, this.getSelectedDate(index))}\n                  onClick={() => this.onTimeClick(this.getSelectedDate(index))}\n                >\n                  &nbsp;\n                </div>\n              ))\n            }\n          </div>\n        </div>\n        <div class=\"legend\" part=\"legend\">\n          <div class=\"available\" part=\"available\">\n            <span class=\"box\" part=\"box\"></span>\n            <span class=\"label\" part=\"label\">\n              Available\n            </span>\n          </div>\n          <div class=\"unavailable\" part=\"unavailable\">\n            <span class=\"box\" part=\"box\"></span>\n            <span class=\"label\" part=\"label\">\n              Unavailable\n            </span>\n          </div>\n        </div>\n      </Host>\n    );\n  }\n}\n"],"mappings":"sKAGO,MAAMA,EAAaC,GAAcC,IACtCA,EAAKC,QAAQD,EAAOA,EAAKE,kBAAoBF,EAAKG,aAAeC,EAAe,IAC/E,CAACJ,EAAMK,KACRL,EAAKC,SAASD,EAAOK,EAAOC,EAAe,IAC1C,CAACC,EAAOC,KACDA,EAAMD,GAASD,IACrBN,GACKA,EAAKS,eAGP,MAAMC,EAAcZ,EAAWa,MAEbZ,GAAcC,IACrCA,EAAKY,cAAc,EAAG,EAAE,IACvB,CAACZ,EAAMK,KACRL,EAAKC,SAASD,EAAOK,EAAOC,EAAe,IAC1C,CAACC,EAAOC,KACDA,EAAMD,GAASD,IACrBN,GACKA,EAAKa,kBCnBP,MAAMC,EAAWf,GAAcC,IACpCA,EAAKC,QAAQD,EAAOA,EAAKE,kBAAoBF,EAAKG,aAAeC,EAAiBJ,EAAKS,aAAeH,EAAe,IACpH,CAACN,EAAMK,KACRL,EAAKC,SAASD,EAAOK,EAAOU,EAAa,IACxC,CAACR,EAAOC,KACDA,EAAMD,GAASQ,IACrBf,GACKA,EAAKgB,aAGP,MAAMC,EAAYH,EAASH,MAEXZ,GAAcC,IACnCA,EAAKkB,cAAc,EAAG,EAAG,EAAE,IAC1B,CAAClB,EAAMK,KACRL,EAAKC,SAASD,EAAOK,EAAOU,EAAa,IACxC,CAACR,EAAOC,KACDA,EAAMD,GAASQ,IACrBf,GACKA,EAAKmB,gBCtBd,MAAMC,EAA0B,irEAChC,MAAAC,EAAeD,E,MCSFE,EAAoB,M,4EAoDvBC,KAAAC,cAAwB,EAqCxBD,KAAAE,oBAAuBC,IAC7BA,EAAMC,iBACND,EAAME,kBAEN,MAAMC,OAAEA,GAAWH,EACnB,MAAMrB,EAAOwB,EAAS,GAAK,EAAI,EAG/B,GAAIN,KAAKO,kBAAoBP,KAAKQ,aAAe1B,KAAU,EAAG,CAC5D,M,CAIF,GAAIkB,KAAKO,kBAAoB,IAAMzB,IAAS,EAAG,CAC7C,M,CAKFkB,KAAKO,gBAAkBP,KAAKO,gBAAkBzB,EAAOkB,KAAKQ,YAK1D,MAAMvB,EAAM,IAAIwB,KAAKT,KAAKU,WAC1BzB,EAAI0B,SAASX,KAAKY,QAAQnB,WAAY,EAAG,EAAG,GAE5C,GAAIO,KAAKO,gBAAkB,GAAI,CAC7BP,KAAKa,MAAQ1B,EAAYa,KAAKU,UAAWzB,EAAKe,KAAKO,gB,KAC9C,CACLP,KAAKa,MAAQnB,EAAUM,KAAKU,UAAWzB,EAAKe,KAAKO,gBAAkB,G,GAI/DP,KAAAc,cAAiBX,IACvBA,EAAMC,iBACND,EAAME,kBACNL,KAAKe,SAAWf,KAAKe,OAAO,EAGtBf,KAAAgB,YAAc,CAACb,EAAmB1B,KACxCuB,KAAKiB,kBAAoBxC,EACzBuB,KAAKC,eAAgB,IAAIQ,MAAOS,UAChCf,EAAMC,iBACND,EAAME,iBAAiB,EAGjBL,KAAAmB,YAAc,CAACC,EAAoB3C,KAEzC,IAAKuB,KAAKqB,aAAc,CACtB,M,CAGFrB,KAAKsB,gBAAkB7C,CAAI,EAGrBuB,KAAAuB,UAAY,CAACpB,EAAmBqB,KAEtC,MAAMC,EAAkBzB,KAAK0B,KAAKC,iBAAiB,YACnDF,EAAgBG,SAAQC,IACtBA,EAAQC,UAAUC,OAAO,UAAU,IAGrC,GAAI/B,KAAKqB,cAAgBrB,KAAKiB,mBAAqBjB,KAAKsB,gBAAiB,CACvE,MAAMU,EAA+C,GACrD,IAAIhD,EAAQgB,KAAKiB,kBACjB,IAAIhC,EAAMe,KAAKsB,gBACfrC,EAAIgD,WAAWhD,EAAIC,aAAec,KAAKO,iBAGvC,MAAM2B,EAAWlD,EAAMmD,SACvB,MAAMC,EAASnD,EAAIkD,SAEnB,GAAID,IAAaE,EAAQ,CACvBJ,EAAeK,KAAK,CAAErD,QAAOC,O,MACxB,GAAImD,EAASF,EAAU,CAC5B,IAAK,IAAII,EAAI,EAAGA,GAAKF,EAASF,EAAUI,IAAK,CAC3C,MAAMC,EAAW,IAAI9B,KAAKzB,GAC1B,MAAMwD,EAAS,IAAI/B,KAAKzB,GACxBuD,EAASE,QAAQzD,EAAM0D,UAAYJ,GACnCE,EAAOC,QAAQzD,EAAM0D,UAAYJ,GACjCE,EAAO7B,SAAS1B,EAAIQ,YACpBuC,EAAeK,KAAK,CAAErD,MAAOuD,EAAUtD,IAAKuD,G,EAIhD,IAAK,IAAIG,KAAiBX,EAAgB,CACxChC,KAAK4C,qBAAqBD,EAAc3D,MAAO2D,EAAc1D,I,EAGjEe,KAAKiB,kBAAoB,KACzBjB,KAAKsB,gBAAkB,KACvBnB,EAAMC,iBACND,EAAME,iBAAiB,EAUjBL,KAAA6C,YAAeC,IAErB,GAAI9C,KAAKqB,aAAc,CACrB0B,EAAM,0DACN,M,CAEF/C,KAAKiB,kBAAoB,KAEzB,MAAMjC,EAAQ,IAAIyB,KAAKqC,GACvB,MAAM7D,EAAM,IAAIwB,KAAKqC,GACrB7D,EAAIgD,WAAWhD,EAAIC,aAAec,KAAKO,iBAEvCP,KAAK4C,qBAAqB5D,EAAOC,EAAI,EAG/Be,KAAAqB,WAAa,KACnB,MAAM2B,GAAM,IAAIvC,MAAOS,UACvB,OAAOlB,KAAKiB,mBAAqB+B,EAAMhD,KAAKC,cAAgBD,KAAKiD,aAAa,EAGxEjD,KAAA4C,qBAAuB,CAAC5D,EAAaC,KAC3C,MAAM+C,eAAEA,GAAmBhC,KAG3B,MAAMkD,EAAQlB,EAAemB,WAAUC,GAASpE,EAAMkC,WAAakC,EAAMpE,MAAMkC,WAAajC,EAAIiC,WAAakC,EAAMnE,IAAIiC,YACvH,GAAIgC,KAAW,EAAG,CAChBlB,EAAeqB,OAAOH,EAAO,GAC7BlD,KAAKgC,eAAiB,IAAIA,GAC1B,M,CAIF,MAAMsB,EAAYtB,EAAemB,WAAUC,GAASpE,EAAMkC,YAAckC,EAAMnE,IAAIiC,YAClF,GAAIoC,KAAe,EAAG,CACpBtB,EAAesB,GAAWrE,IAAMA,EAChCe,KAAKgC,eAAiB,IAAIA,GAC1B,M,CAIF,MAAMuB,EAAYvB,EAAemB,WAAUC,GAASnE,EAAIiC,YAAckC,EAAMpE,MAAMkC,YAClF,GAAIqC,KAAe,EAAG,CACpBvB,EAAeuB,GAAWvE,MAAQA,EAClCgB,KAAKgC,eAAiB,IAAIA,GAC1B,M,CAIFhC,KAAKgC,eAAiB,IAAIA,EAAgB,CAAEhD,QAAOC,OAAM,EAGnDe,KAAAwD,gBAAmB/E,GAClBuB,KAAKgC,eAAeyB,MAAKL,GACvBA,EAAMpE,MAAMkC,WAAazC,EAAKyC,WAAakC,EAAMnE,IAAIiC,UAAYzC,EAAKyC,YAIzElB,KAAA0D,gBAAmBR,IAEzB,MAAMJ,EAAe,IAAIrC,KAAKT,KAAKU,WACnCoC,EAAaL,QAASS,EAAQ,EAAK,GACnC,MAAMZ,EAAIqB,KAAKC,MAAMV,EAAQ,GAC7BJ,EAAanC,SAASX,KAAKa,MAAMyB,GAAG7C,YACpCqD,EAAab,WAAWjC,KAAKa,MAAMyB,GAAGpD,cACtC,OAAO4D,CAAY,EAGb9C,KAAA6D,WAAcC,IACpB,IAAK9D,KAAKiB,oBAAsBjB,KAAKsB,gBAAiB,CACpD,OAAO,K,CAGT,OACEwC,EAAY3B,UAAYnC,KAAKiB,kBAAkBkB,UAC/C2B,EAAYrE,YAAcO,KAAKiB,kBAAkBxB,YACjDqE,EAAYrE,YAAcO,KAAKsB,gBAAgB7B,YAC/CqE,EAAY3B,UAAYnC,KAAKsB,gBAAgBa,QAAQ,EAIjDnC,KAAA+D,wBAA2BC,IACjC,MAAMhC,EAA+C,GAGrD,IAAK,MAAMiC,KAAYD,EAAW,CAEhC,IAAK,MAAME,KAAOD,EAASE,KAAM,CAE/B,GAAIF,EAASjF,QAAUiF,EAAShF,IAAK,CACnC,Q,CAIF,MAAOmF,EAAYC,GAAgBJ,EAASjF,MAAMsF,MAAM,KAAKC,KAAIC,GAAKC,SAASD,EAAG,MAClF,MAAOE,EAAUC,GAAcV,EAAShF,IAAIqF,MAAM,KAAKC,KAAIC,GAAKC,SAASD,EAAG,MAG5E,MAAMxF,EAAQ,IAAIyB,KAAKT,KAAKU,WAC5B1B,EAAMyD,QAAQzD,EAAM0D,UAAYwB,GAChClF,EAAM2B,SAASyD,GACfpF,EAAMiD,WAAWoC,GAGjB,MAAMpF,EAAM,IAAIwB,KAAKT,KAAKU,WAC1BzB,EAAIwD,QAAQxD,EAAIyD,UAAYwB,GAC5BjF,EAAI0B,SAAS+D,GACbzF,EAAIgD,WAAW0C,GAGf3C,EAAeK,KAAK,CAAErD,QAAOC,O,EAKjC+C,EAAe4C,MAAK,CAACC,EAAGC,IAAMD,EAAE7F,MAAMkC,UAAY4D,EAAE9F,MAAMkC,YAE1D6B,EAAM,iBAAkBf,GAGxB,OAAOA,CAAc,EAGfhC,KAAA+E,mBAAqB,KAC3B,MAAMC,EAAqC,GAC3C,MAAMhB,EAAwB,GAE9B,IAAIhC,EAAiB,IAAIhC,KAAKgC,gBAC9BA,EAAe4C,MAAK,CAACC,EAAGC,IAAMD,EAAE7F,MAAMkC,UAAY4D,EAAE9F,MAAMkC,YAE1D,GAAIlB,KAAKe,QAAS,CAChB,MAAMkE,EAAuB,IAAIjD,GACjCA,EAAiB,GACjB,IAAIhD,EAAQgB,KAAKU,UACjB,IAAK,MAAMiC,KAAiBsC,EAAsB,CAChD,MAAMhG,EAAM0D,EAAc3D,MAC1BgD,EAAeK,KAAK,CAAErD,QAAOC,QAC7BD,EAAQ2D,EAAc1D,G,CAExB+C,EAAeK,KAAK,CAAErD,QAAOC,IAAKe,KAAKY,S,CAEzCoB,EAAe4C,MAAK,CAACC,EAAGC,IAAMD,EAAE7F,MAAMkC,UAAY4D,EAAE9F,MAAMkC,YAE1D,IAAK,MAAMyB,KAAiBX,EAAgB,CAC1C,MAAME,EAAWS,EAAc3D,MAAMmD,SACrC,MAAMC,EAASO,EAAc1D,IAAIkD,SAEjC,MAAM+C,EAAU,IAAIzE,KAAKkC,EAAc3D,OACvCkG,EAAQzC,QAAQyC,EAAQxC,UAAY,GACpCwC,EAAQvE,SAAS,EAAG,EAAG,EAAG,GAE1B,GAAIuB,EAAWE,GAAUA,EAASF,EAAU,CAC1CF,EAAeK,KAAK,CAAErD,MAAOkG,EAASjG,IAAK0D,EAAc1D,MACzD0D,EAAc1D,IAAM,IAAIwB,KAAKkC,EAAc3D,OAC3C2D,EAAc1D,IAAI0B,SAAS,GAAI,EAAG,EAAG,E,CAGvC,MAAMyD,EAAae,EAAcxC,EAAc3D,OAC/C,MAAM0F,EAAWS,EAAcxC,EAAc1D,KAC7C,MAAMmG,EAAO,GAAGhB,KAAcM,IAE9B,IAAKM,EAAMI,GAAO,CAChBJ,EAAMI,GAAQ,CAAClD,E,KACV,CACL8C,EAAMI,GAAM/C,KAAKH,E,EAIrB,IAAK,MAAMmD,KAAOL,EAAO,CACvB,MAAOZ,EAAYM,GAAYW,EAAIf,MAAM,KACzC,MAAMH,EAAOa,EAAMK,GACnB,MAAMpB,EAAqB,CACzBE,OACAnF,MAAOoF,EACPnF,IAAKyF,EACLY,SAAUC,KAEZvB,EAAU3B,KAAK4B,E,CAGjBjE,KAAKwF,iBAAiBC,KAAKzB,EAAU,EAG/BhE,KAAA0F,wBAA0B,CAAC1G,EAAaC,KAC9C,MAAM0G,EAAOhC,KAAKiC,IAAI3G,EAAIiC,UAAYlC,EAAMkC,WAC5C,OAAOyC,KAAKkC,KAAKF,GAAQ,IAAO,GAAK,GAAK,IAAI,E,eAlXA,G,eAOJ,IAAIlF,KAAK,KAAM,EAAG,EAAG,EAAG,EAAG,EAAG,G,aAO1B,IAAIA,KAAK,KAAM,EAAG,EAAG,GAAI,EAAG,EAAG,G,iBAO1C,G,mBAKE,I,yBAKe,I,qBAEX,G,WACV,G,oBAC+B,G,uBACd,K,qBACF,K,aACZ,M,cACC,K,CASrC,iBAAAqF,GACE9F,KAAK+F,WACL,MAAM9G,EAAM,IAAIwB,KAAKT,KAAKU,WAC1BzB,EAAI0B,SAASX,KAAKY,QAAQnB,WAAY,EAAG,EAAG,GAE5CO,KAAKa,MAAQnB,EAAUM,KAAKU,UAAWzB,EAAKe,KAAKO,gBAAkB,IACnEP,KAAKgC,eAAiBhC,KAAK+D,wBAAwB/D,KAAKgE,U,CAI1D,oBAAAgC,CAAqBC,EAAsBC,GAEzC,GAAIC,KAAKC,UAAUH,KAAcE,KAAKC,UAAUF,GAAW,CACzD,M,CAGFlG,KAAKgC,eAAiBhC,KAAK+D,wBAAwBkC,E,CAIrD,qBAAAI,GACErG,KAAK+E,oB,CAIP,cAAAuB,GACEtG,KAAK+E,oB,CAIP,QAAAgB,GACE,MAAMQ,EAAK5C,KAAK6C,IAAIC,SAASC,gBAAgBC,aAAe,EAAGC,OAAOC,YAAc,GACpF7G,KAAK8G,SAAWP,GAAMvG,KAAK+G,mB,CAqS7B,MAAAC,GACE,OACEC,EAACC,EAAI,CAAA7B,IAAA,4CACH4B,EAAA,OAAA5B,IAAA,2CAAK8B,MAAM,aAAaC,KAAK,cAC3BH,EAAA,OAAA5B,IAAA,2CAAK8B,MAAM,OAAOC,KAAK,QAInBC,MAAMC,KAAK,CAAEC,OAAQvH,KAAK0F,wBAAwB1F,KAAKU,UAAWV,KAAKY,WAAY2D,KAAI,CAACiD,EAAGtE,KACzF,MAAMzE,EAAO,IAAIgC,KAAKT,KAAKU,WAC3BjC,EAAKgE,QAAQhE,EAAKiE,UAAYQ,GAC9B,OAAO+D,EAAA,YAAOxI,EAAKgJ,mBAAmBC,UAAW,CAAEC,QAAS3H,KAAK8G,SAAW,QAAU,SAAiB,KAI7GG,EAAA,OAAA5B,IAAA,2CAAK8B,MAAM,QAAQC,KAAK,SACrBpH,KAAKa,MAAM0D,KAAI9F,GACdwI,EAAA,YAAOxI,EAAKmJ,mBAAmBF,UAAW,CAAEG,UAAW,cAG3DZ,EAAA,OAAA5B,IAAA,2CACE8B,MAAO,CACL,iBAAkB,KAClBpG,QAAWf,KAAKe,SAElBqG,KAAK,iBACLU,QAAS9H,KAAKE,oBACdY,cAAed,KAAKc,eAIlBuG,MAAMC,KAAK,CAAEC,OAAQvH,KAAK0F,wBAAwB1F,KAAKU,UAAWV,KAAKY,SAAWZ,KAAKa,MAAM0G,SAAUhD,KAAI,CAACiD,EAAGtE,IAC7G+D,EAAA,OACEG,KAAK,OACLD,MAAO,CACLY,KAAM,KACNC,SAAUhI,KAAKwD,gBAAgBxD,KAAK0D,gBAAgBR,IACpD+E,QAASjI,KAAK6D,WAAW7D,KAAK0D,gBAAgBR,KAEhDlC,YAAab,GAASH,KAAKgB,YAAYb,EAAOH,KAAK0D,gBAAgBR,IACnE3B,UAAWpB,GAASH,KAAKuB,UAAUpB,EAAOH,KAAK0D,gBAAgBR,IAC/D/B,YAAahB,GAASH,KAAKmB,YAAYhB,EAAOH,KAAK0D,gBAAgBR,IACnEgF,QAAS,IAAMlI,KAAK6C,YAAY7C,KAAK0D,gBAAgBR,KAAO,SAQtE+D,EAAA,OAAA5B,IAAA,2CAAK8B,MAAM,SAASC,KAAK,UACvBH,EAAA,OAAA5B,IAAA,2CAAK8B,MAAM,YAAYC,KAAK,aAC1BH,EAAA,QAAA5B,IAAA,2CAAM8B,MAAM,MAAMC,KAAK,QACvBH,EAAA,QAAA5B,IAAA,2CAAM8B,MAAM,QAAQC,KAAK,SAAO,cAIlCH,EAAA,OAAA5B,IAAA,2CAAK8B,MAAM,cAAcC,KAAK,eAC5BH,EAAA,QAAA5B,IAAA,2CAAM8B,MAAM,MAAMC,KAAK,QACvBH,EAAA,QAAA5B,IAAA,2CAAM8B,MAAM,QAAQC,KAAK,SAAO,iB"}

package/dist/nylas-web-elements/p-c2e69618.entry.js

@@ -0,0 +1,2 @@
+import{r as e,h as c}from"./p-c66e27d0.js";const a=".sc-document-refresh-icon-h{display:flex}";const f=a;const t=class{constructor(c){e(this,c);this.width="18";this.height="18"}render(){return c("svg",{key:"dc153253fd919881c145b00dc5b58ab1a30b1974",xmlns:"http://www.w3.org/2000/svg",viewBox:"0 0 18 18",width:this.width,height:this.height},c("rect",{key:"9c83808f8d6fecbbc863774ab43b403d644712ab",id:"Canvas",fill:"#ff13dc",opacity:"0"}),c("path",{key:"4717055191d2fa2ef7ff707f249ca924f0cedc48",d:"M9.19763,12.26283A4.44131,4.44131,0,0,1,16.948,10.71741l.62524-.62524a.24433.24433,0,0,1,.1748-.07373.25035.25035,0,0,1,.252.24875v2.50143a.25.25,0,0,1-.25.25l-2.4995-.00016A.25088.25088,0,0,1,15,12.76721v-.00054a.24436.24436,0,0,1,.07373-.175l.86988-.86987a3.02827,3.02827,0,0,0-5.29847.71808.48835.48835,0,0,1-.46081.30981H9.55908a.37949.37949,0,0,1-.36145-.48686Z"}),c("path",{key:"1cb8290848c95f446395e95ff577cedcdfe39b03",d:"M17.80237,14.77441A4.4413,4.4413,0,0,1,10.052,16.31982l-.62524.62524a.24429.24429,0,0,1-.1748.07373A.25036.25036,0,0,1,9,16.77V14.26863a.25.25,0,0,1,.25-.25l2.4995.00016A.25087.25087,0,0,1,12,14.27v.00052a.24434.24434,0,0,1-.07373.175l-.86988.86988a3.02828,3.02828,0,0,0,5.29847-.71808.48836.48836,0,0,1,.46081-.30982h.62525a.3795.3795,0,0,1,.36145.48687Z"}),c("path",{key:"3e6315560c981fbf85c716555c69e1a14bbb9bf5",d:"M7,13.5A6.5,6.5,0,0,1,13.5,7c.16883,0,.33447.01264.5.02527V5H9.5A.5.5,0,0,1,9,4.5V0H2.5A.5.5,0,0,0,2,.5v15a.5.5,0,0,0,.5.5H7.49981A6.4779,6.4779,0,0,1,7,13.5Z"}),c("path",{key:"306ebc4fd5e4ee53c2ae5fd35331e57b84be6ac3",d:"M10,0h.043a.5.5,0,0,1,.353.146L13.854,3.6A.5.5,0,0,1,14,3.957V4H10Z"}))}};t.style=f;export{t as document_refresh_icon};
+//# sourceMappingURL=p-c2e69618.entry.js.map

package/dist/nylas-web-elements/p-c2e69618.entry.js.map

@@ -0,0 +1 @@
+{"version":3,"names":["iconCss","DocumentRefreshIconStyle0","DocumentRefreshIcon","render","h","key","xmlns","viewBox","width","this","height","id","fill","opacity","d"],"sources":["src/common/icons/icon.css?tag=document-refresh-icon&encapsulation=scoped","src/common/icons/document-refresh.tsx"],"sourcesContent":[":host {\n  display: flex;\n}\n","import { Component, Prop, h } from '@stencil/core';\n\n@Component({\n  tag: 'document-refresh-icon',\n  styleUrl: 'icon.css',\n  scoped: true,\n})\nexport class DocumentRefreshIcon {\n  @Prop() width: string = '18';\n  @Prop() height: string = '18';\n\n  render() {\n    return (\n      <svg xmlns=\"http://www.w3.org/2000/svg\" viewBox=\"0 0 18 18\" width={this.width} height={this.height}>\n        <rect id=\"Canvas\" fill=\"#ff13dc\" opacity=\"0\" />\n        <path d=\"M9.19763,12.26283A4.44131,4.44131,0,0,1,16.948,10.71741l.62524-.62524a.24433.24433,0,0,1,.1748-.07373.25035.25035,0,0,1,.252.24875v2.50143a.25.25,0,0,1-.25.25l-2.4995-.00016A.25088.25088,0,0,1,15,12.76721v-.00054a.24436.24436,0,0,1,.07373-.175l.86988-.86987a3.02827,3.02827,0,0,0-5.29847.71808.48835.48835,0,0,1-.46081.30981H9.55908a.37949.37949,0,0,1-.36145-.48686Z\" />\n        <path d=\"M17.80237,14.77441A4.4413,4.4413,0,0,1,10.052,16.31982l-.62524.62524a.24429.24429,0,0,1-.1748.07373A.25036.25036,0,0,1,9,16.77V14.26863a.25.25,0,0,1,.25-.25l2.4995.00016A.25087.25087,0,0,1,12,14.27v.00052a.24434.24434,0,0,1-.07373.175l-.86988.86988a3.02828,3.02828,0,0,0,5.29847-.71808.48836.48836,0,0,1,.46081-.30982h.62525a.3795.3795,0,0,1,.36145.48687Z\" />\n        <path d=\"M7,13.5A6.5,6.5,0,0,1,13.5,7c.16883,0,.33447.01264.5.02527V5H9.5A.5.5,0,0,1,9,4.5V0H2.5A.5.5,0,0,0,2,.5v15a.5.5,0,0,0,.5.5H7.49981A6.4779,6.4779,0,0,1,7,13.5Z\" />\n        <path d=\"M10,0h.043a.5.5,0,0,1,.353.146L13.854,3.6A.5.5,0,0,1,14,3.957V4H10Z\" />\n      </svg>\n    );\n  }\n}\n"],"mappings":"2CAAA,MAAMA,EAAU,4CAChB,MAAAC,EAAeD,E,MCMFE,EAAmB,M,oCACN,K,YACC,I,CAEzB,MAAAC,GACE,OACEC,EAAA,OAAAC,IAAA,2CAAKC,MAAM,6BAA6BC,QAAQ,YAAYC,MAAOC,KAAKD,MAAOE,OAAQD,KAAKC,QAC1FN,EAAA,QAAAC,IAAA,2CAAMM,GAAG,SAASC,KAAK,UAAUC,QAAQ,MACzCT,EAAA,QAAAC,IAAA,2CAAMS,EAAE,mXACRV,EAAA,QAAAC,IAAA,2CAAMS,EAAE,wWACRV,EAAA,QAAAC,IAAA,2CAAMS,EAAE,mKACRV,EAAA,QAAAC,IAAA,2CAAMS,EAAE,wE"}

package/dist/nylas-web-elements/p-c440f148.entry.js

@@ -0,0 +1,2 @@
+import{r as t,h as e,H as i,c as s,a as n}from"./p-c66e27d0.js";import{R as o}from"./p-5862975b.js";import{d as a}from"./p-98ec4a7a.js";import{N as r,e as l}from"./p-a95208c7.js";import{N as h,a as c,b as d,c as f,C as u,d as p,H as m}from"./p-6ba7a037.js";import"./p-eeb0a591.js";const y=":host{display:block}div{height:inherit}@keyframes fadeIn{0%{opacity:0}100%{opacity:1}}@keyframes fadeOut{0%{opacity:1}100%{opacity:0}}.fade-in{animation:fadeIn 1.5s}.fade-out{animation:fadeOut 1.5s}@keyframes slideIn{0%{transform:translateY(100%)}100%{transform:translateY(0)}}@keyframes slideOut{0%{transform:translateY(0)}100%{transform:translateY(100%)}}.slide-in{animation:slideIn 1.5s}.slide-out{animation:slideOut 1.5s}@keyframes swipeIn{0%{transform:translateX(100%)}100%{transform:translateX(0)}}@keyframes swipeOut{0%{transform:translateX(0)}100%{transform:translateX(100%)}}.swipe-in{animation:swipeIn 1.5s}.swipe-out{animation:swipeOut 1.5s}";const g=y;var b=undefined&&undefined.__decorate||function(t,e,i,s){var n=arguments.length,o=n<3?e:s===null?s=Object.getOwnPropertyDescriptor(e,i):s,a;if(typeof Reflect==="object"&&typeof Reflect.decorate==="function")o=Reflect.decorate(t,e,i,s);else for(var r=t.length-1;r>=0;r--)if(a=t[r])o=(n<3?a(o):n>3?a(e,i,o):a(e,i))||o;return n>3&&o&&Object.defineProperty(e,i,o),o};var w=undefined&&undefined.__metadata||function(t,e){if(typeof Reflect==="object"&&typeof Reflect.metadata==="function")return Reflect.metadata(t,e)};const v=class{constructor(e){t(this,e);this.state=undefined;this.isStateSet=undefined;this.isBoolean=undefined;this.getStore=undefined;this.transition="none";this.show=false;this.classes={};this.initTransition=this.initTransition.bind(this)}connectedCallback(){}disconnectedCallback(){}async componentWillLoad(){a(`[nylas-if-state] Component will load`);this.watchStore(true)}async componentDidLoad(){a(`[nylas-if-state] Component did load`)}shouldRender(){const[t,e]=this.state?this.state.split("."):["",""];const i=this.getStore;if(typeof i==="undefined"){a(`[nylas-if-state] Store name: ${t} | State name: ${e}`,{getStore:i});return false}const s=i(t);if(typeof s==="undefined"){a(`[nylas-if-state] Store name: ${t} | State name: ${e}`,{store:s});return false}const n=s.state[e];if(typeof this.isStateSet==="boolean"){return this.isStateSet===false&&(typeof n==="undefined"||n===null||n.length===0)||this.isStateSet===true&&typeof n!=="undefined"&&n!==null}if(typeof this.isBoolean==="boolean"){return this.isBoolean===true&&typeof n!=="undefined"&&n===true||this.isBoolean===false&&typeof n!=="undefined"&&n===false}return false}onGetStoreChange(){this.watchStore(true)}watchStore(t=false){const[e,i]=this.state?this.state.split("."):["",""];const s=this.getStore;if(typeof s==="undefined"){a(`[nylas-if-state] Store name: ${e} | State name: ${i}`,{getStore:s});return null}const n=s(e);if(typeof n==="undefined"){a(`[nylas-if-state] Store name: ${e} | State name: ${i}`,{store:n});return null}if(t===true){this.initTransition()}n.onChange(i,this.initTransition)}initTransition(){const t=this.shouldRender();switch(this.transition){case"fade":case"slide":case"swipe":this.classes={[`${this.transition}-in`]:t,[`${this.transition}-out`]:!t};setTimeout((()=>{this.show=t}),150);break;default:this.show=this.shouldRender();break}}render(){return e(i,{key:"91d17bc89a09742106ef3bd9365c5ce48cf14e86"},e("div",{key:"9d0070be4bf5d9a5f405fc4a0733e6d832fa669a",class:this.classes},this.show&&e("slot",null)))}static get watchers(){return{getStore:["onGetStoreChange"]}}};b([o({name:"nylas-if-state",getStoresToProp:"getStore",fireRegisterEvent:true}),w("design:type",Function),w("design:paramtypes",[]),w("design:returntype",void 0)],v.prototype,"render",null);v.style=g;const x=":host{font-family:'Arial', sans-serif;background:var(--nylas-color-primary-50);color:var(--nylas-color-primary-800);margin:0;display:contents}input{box-sizing:border-box}.login-container{display:flex;justify-content:center;align-items:center;height:100%}.login-box{width:300px;padding:20px;box-shadow:0 4px 8px rgba(0, 0, 0, 0.1);border-radius:var(--nylas-border-radius-2x);background:var(--nylas-color-primary-50);text-align:center}.login-box h1{margin-top:0;margin-bottom:0.5em}.login-box p{margin-bottom:1em}.login-methods button{display:block;width:100%;padding:10px 10px 10px 50px;margin-bottom:10px;border:none;border-radius:var(--nylas-border-radius);border:1px solid var(--nylas-color-primary-300);background:var(--nylas-color-primary-100);color:var(--nylas-color-primary-600);cursor:pointer;transition:background 0.3s ease;position:relative;text-align:left}.login-methods button svg{position:absolute;left:16px;top:50%;transform:translateY(-50%)}.login-methods button:hover{background:var(--nylas-color-primary-200);}.login-form label{display:block;margin-bottom:5px;text-align:left}.login-form input{width:100%;padding:10px;margin-bottom:10px;border:1px solid var(--nylas-color-primary-200);border-radius:var(--nylas-border-radius);background:var(--nylas-color-primary-100);color:var(--nylas-color-primary-800);}.login-form button{width:100%;padding:10px;border:none;border-radius:var(--nylas-border-radius);background:var(--nylas-color-primary-500);color:var(--nylas-color-primary-50);cursor:pointer;transition:background 0.3s ease}.login-form button:hover{background:var(--nylas-color-primary-600);}";const k=x;var C=undefined&&undefined.__decorate||function(t,e,i,s){var n=arguments.length,o=n<3?e:s===null?s=Object.getOwnPropertyDescriptor(e,i):s,a;if(typeof Reflect==="object"&&typeof Reflect.decorate==="function")o=Reflect.decorate(t,e,i,s);else for(var r=t.length-1;r>=0;r--)if(a=t[r])o=(n<3?a(o):n>3?a(e,i,o):a(e,i))||o;return n>3&&o&&Object.defineProperty(e,i,o),o};var S=undefined&&undefined.__metadata||function(t,e){if(typeof Reflect==="object"&&typeof Reflect.metadata==="function")return Reflect.metadata(t,e)};const R=class{constructor(e){t(this,e);this.buttonClick=s(this,"buttonClick",7);this._handleLoginRedirect=async()=>{const t=await(this.nylasConnector?.auth.getHostedAuthRedirectURL(this.scopes));const e=this.buttonClick.emit({url:t});if(e.defaultPrevented){return}if(t){window.location.href=t}};this._onGoogleButtonClick=async t=>{t.preventDefault();const e=await(this.nylasConnector?.auth.getHostedAuthRedirectURL(this.scopes,undefined,"google"));if(e){window.location.href=e}};this._onMicrosoftButtonClick=async t=>{t.preventDefault();const e=await(this.nylasConnector?.auth.getHostedAuthRedirectURL(this.scopes,undefined,"microsoft"));if(e){window.location.href=e}};this._onFormSubmit=async t=>{t.preventDefault();const e=await(this.nylasConnector?.auth.getHostedAuthRedirectURL(this.scopes,this.email));if(e){window.location.href=e}};this.isAuthenticated=false;this.nylasConnector=undefined;this.scopes=undefined;this.loginMethod="redirect";this.companyName="Nylas";this.logoUrl="https://www.nylas.com/wp-content/uploads/main-logo.svg";this.logoWidth="min-content";this.providers="google,microsoft";this.buttonText="Login";this.email=""}connectedCallback(){}disconnectedCallback(){}componentWillLoad(){}async componentDidLoad(){const t=await(this.nylasConnector?.auth.manageHostedAuthCodeExchange(window.location.href));if(t){window.history.replaceState({},document.title,window.location.pathname)}}render(){const t=this.providers?.split(",")||[];return e(i,{key:"734ebbbe5cf2ba3c08943a665a4724f59705da5b"},this.loginMethod==="redirect"&&e("div",{class:"redirect-container"},!this.isAuthenticated&&e("sp-button",{part:"button",onClick:this._handleLoginRedirect},this.buttonText)),this.loginMethod==="emebded"&&e("main",{class:"login-container"},e("section",{class:"login-box"},e("header",null,e("img",{src:this.logoUrl,alt:`${this.companyName} logo`,width:"100%",style:{minWidth:this.logoWidth}}),e("h1",null,"Welcome")),e("p",null,"Log in to your account to continue to ",this.companyName),e("div",{class:"login-methods"},t.includes("google")&&e("button",{class:"login-google",onClick:this._onGoogleButtonClick},e("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"},e("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"}),e("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"}),e("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"}),e("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"),t.includes("microsoft")&&e("button",{class:"login-microsoft",onClick:this._onMicrosoftButtonClick},e("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"},e("path",{fill:"#F3F3F3",d:"M0 32v192h192V32H0zm256 0v192h192V32H256zm192 256v192h-192V288h192zM0 224v192h192V224H0z"})),"Continue with Microsoft")),e("form",{class:"login-form",method:"POST",onSubmit:this._onFormSubmit},e("label",{htmlFor:"email"},"Email"),e("input",{type:"email",id:"email",name:"email",required:true,value:this.email}),e("button",{type:"submit"},"Next")))))}};C([o({name:"nylas-login",connectorToProp:"nylasConnector",stateToProps:new Map([["auth.isAuthenticated","isAuthenticated"]]),fireRegisterEvent:true}),S("design:type",Function),S("design:paramtypes",[]),S("design:returntype",void 0)],R.prototype,"render",null);R.style=k;class A{constructor(t,e,i,s){this.router=t;this.nylasAuth=e;this.nylasAuthStore=i;this.nylasMailboxStore=s}init(){a("NylasMailboxConnector init")}get mailboxStore(){return this.nylasMailboxStore}get authStore(){return this.nylasAuthStore}get auth(){if(this._authConnector){return this._authConnector}this._authConnector=new h(this.nylasAuth,this.nylasAuthStore);return this._authConnector}get threads(){if(this._threadConnector){return this._threadConnector}this._threadConnector=new c(this.nylasAuth,this.nylasAuthStore,this.nylasMailboxStore,this.router);return this._threadConnector}get messages(){if(this._messageConnector){return this._messageConnector}this._messageConnector=new d(this.nylasAuth,this.nylasAuthStore,this.nylasMailboxStore);return this._messageConnector}get folders(){if(this._foldersConnector){return this._foldersConnector}this._foldersConnector=new f(this.nylasAuth,this.nylasAuthStore,this.nylasMailboxStore);return this._foldersConnector}getAuth(){return this.nylasAuth}resetStores(){this.nylasMailboxStore.reset();this.nylasAuthStore.reset()}async logout(){await this.nylasAuth.logout();this.resetStores()}}const M=":host{display:contents}";const j=M;const O=class{constructor(e){t(this,e);this.init=s(this,"init",7);this.loggedIn=s(this,"loggedIn",7);this.loggedOut=s(this,"loggedOut",7);this.handleAuthChange=async t=>{if(t){this.loggedIn.emit(this.host)}else{const t=this.loggedOut.emit(this.host);if(!t.defaultPrevented){await(this.nylasMailboxConnector?.logout())}}};this.automaticComponentRegistration=true;this.eventOverrides={};this.authConfig=undefined;this.defaultAuthStoreState=undefined;this.defaultMailboxStoreState=undefined}connectedCallback(){a("[nylas-mailbox] connectedCallback")}async componentWillLoad(){this.stores={auth:u(this.defaultAuthStoreState),mailbox:p(this.defaultMailboxStoreState)};this.baseProvider=new r(this.host,this.stores,this.automaticComponentRegistration,this.eventOverrides);this.router=new m;this.nylasAuth=l({apiUri:"https://api.us.nylas.com",elementsApiUri:"https://elements.us.nylas.com",storageType:"indexeddb",clientId:"YOUR_CLIENT_ID",defaultScopes:[],redirectURI:"/",...this.authConfig});const t=this.baseProvider?.getStore("auth");if(!t){throw new Error("Auth store is not defined")}const e=this.baseProvider?.getStore("mailbox");if(!e){throw new Error("Mailbox store is not defined")}this.nylasMailboxConnector=new A(this.router,this.nylasAuth,t,e);const i=this.init.emit(this.host);if(!i.defaultPrevented){await(this.nylasMailboxConnector?.auth.validateSession())}this.router?.addRouteChangeListener(`/thread/:threadId`,(async(t,e,i)=>{const s=i.threadId;const n=await(this.nylasMailboxConnector?.threads.getThread(s));if(n){this.nylasMailboxConnector?.mailboxStore.set("selectedThread",n)}}));this.router?.addRouteChangeListener(`/`,(async(e,i,s)=>{if(!t.state.isAuthenticated){return}this.nylasMailboxConnector?.threads.unSelectThread();this.nylasMailboxConnector?.folders.getFolders();const n=window.location.hash.split("?")[1];if(n){const t=new URLSearchParams(n);const e=t.get("query");if(e){await(this.nylasMailboxConnector?.threads.getThreads({search_query_native:e,page_token:undefined}))}}else{this.nylasMailboxConnector?.threads.getThreads()}}));this.router?.init();this.handleAuthChange(t.state.isAuthenticated);this.baseProvider?.componentWillLoad(this.nylasMailboxConnector)}async componentDidLoad(){const t=this.baseProvider?.getStore("auth");if(!t){throw new Error("Auth store is not defined")}t.onChange("isAuthenticated",this.handleAuthChange);this.baseProvider?.componentDidLoad()}componentDisconnected(){this.baseProvider?.componentDisconnected()}async registerComponentHandler(t){this.baseProvider?.registerComponent(t.detail)}async unregisterComponentHandler(t){this.baseProvider?.unregisterComponent(t.detail)}async getMailboxStore(){return this.baseProvider?.getStore("mailbox")}async getAuthStore(){return this.baseProvider?.getStore("auth")}async getNylasAuth(){return this.nylasAuth}async getNylasMailboxConnector(){return this.nylasMailboxConnector}render(){return e(i,{key:"08e87a3218f672e8944102d626b690aefb3bab3f"},e("slot",{key:"05ab1ca1539a00ea199bb9cb25c8b96af8d6ab66"}))}get host(){return n(this)}};O.style=j;export{v as nylas_if_state,R as nylas_login,O as nylas_mailbox};
+//# sourceMappingURL=p-c440f148.entry.js.map

package/dist/nylas-web-elements/p-c440f148.entry.js.map

@@ -0,0 +1 @@
+{"version":3,"names":["nylasIfStateCss","NylasIfStateStyle0","NylasIfState","constructor","hostRef","this","initTransition","bind","connectedCallback","disconnectedCallback","componentWillLoad","debug","watchStore","componentDidLoad","shouldRender","storeName","stateName","state","split","getStore","store","isStateSet","length","isBoolean","onGetStoreChange","immediate","onChange","show","transition","classes","setTimeout","render","h","Host","key","class","__decorate","RegisterComponent","name","getStoresToProp","fireRegisterEvent","nylasLoginCss","NylasLoginStyle0","NylasLogin","_handleLoginRedirect","async","url","nylasConnector","auth","getHostedAuthRedirectURL","scopes","event","buttonClick","emit","defaultPrevented","window","location","href","_onGoogleButtonClick","preventDefault","undefined","_onMicrosoftButtonClick","_onFormSubmit","email","exchangedToken","manageHostedAuthCodeExchange","history","replaceState","document","title","pathname","splitProviders","providers","loginMethod","isAuthenticated","part","onClick","buttonText","src","logoUrl","alt","companyName","width","style","minWidth","logoWidth","includes","xmlns","role","height","preserveAspectRatio","viewBox","fill","d","method","onSubmit","htmlFor","type","id","required","value","connectorToProp","stateToProps","Map","NylasMailboxConnector","router","nylasAuth","nylasAuthStore","nylasStore","nylasMailboxStore","init","mailboxStore","authStore","_authConnector","NylasAuthConnector","threads","_threadConnector","NylasThreadsConnector","messages","_messageConnector","NylasMessagesConnector","folders","_foldersConnector","NylasFoldersConnector","getAuth","resetStores","reset","logout","nylasMailboxCss","NylasMailboxStyle0","NylasMailbox","handleAuthChange","loggedIn","host","loggedOutEvent","loggedOut","nylasMailboxConnector","stores","CreateNylasAuthStore","defaultAuthStoreState","mailbox","CreateNylasMailboxStore","defaultMailboxStoreState","baseProvider","NylasBaseProvider","automaticComponentRegistration","eventOverrides","HashRouter","NylasAuth","apiUri","elementsApiUri","storageType","clientId","defaultScopes","redirectURI","authConfig","Error","initEvent","validateSession","addRouteChangeListener","_route","_path","routeParams","threadId","thread","getThread","set","_routeParams","unSelectThread","getFolders","queryParams","hash","params","URLSearchParams","searchQuery","get","getThreads","search_query_native","page_token","componentDisconnected","registerComponentHandler","registerComponent","detail","unregisterComponentHandler","unregisterComponent","getMailboxStore","getAuthStore","getNylasAuth","getNylasMailboxConnector"],"sources":["src/components/nylas-if-state/nylas-if-state.css?tag=nylas-if-state&encapsulation=shadow","src/components/nylas-if-state/nylas-if-state.tsx","src/components/nylas-login/nylas-login.css?tag=nylas-login&encapsulation=shadow","src/components/nylas-login/nylas-login.tsx","src/connector/nylas-mailbox-connector/index.ts","src/components/mailbox/nylas-mailbox/nylas-mailbox.css?tag=nylas-mailbox&encapsulation=shadow","src/components/mailbox/nylas-mailbox/nylas-mailbox.tsx"],"sourcesContent":[":host {\n  display: block;\n}\n\ndiv {\n  height: inherit;\n}\n\n@keyframes fadeIn {\n  0% {\n    opacity: 0;\n  }\n  100% {\n    opacity: 1;\n  }\n}\n\n@keyframes fadeOut {\n  0% {\n    opacity: 1;\n  }\n  100% {\n    opacity: 0;\n  }\n}\n.fade-in {\n  animation: fadeIn 1.5s;\n}\n\n.fade-out {\n  animation: fadeOut 1.5s;\n}\n\n@keyframes slideIn {\n  0% {\n    transform: translateY(100%);\n  }\n  100% {\n    transform: translateY(0);\n  }\n}\n\n@keyframes slideOut {\n  0% {\n    transform: translateY(0);\n  }\n  100% {\n    transform: translateY(100%);\n  }\n}\n\n.slide-in {\n  animation: slideIn 1.5s;\n}\n\n.slide-out {\n  animation: slideOut 1.5s;\n}\n\n@keyframes swipeIn {\n  0% {\n    transform: translateX(100%);\n  }\n  100% {\n    transform: translateX(0);\n  }\n}\n\n@keyframes swipeOut {\n  0% {\n    transform: translateX(0);\n  }\n  100% {\n    transform: translateX(100%);\n  }\n}\n\n.swipe-in {\n  animation: swipeIn 1.5s;\n}\n\n.swipe-out {\n  animation: swipeOut 1.5s;\n}\n","import { RegisterComponent } from '@/common/register-component';\nimport { debug } from '@/utils/utils';\nimport { Component, Host, Prop, State, Watch, h } from '@stencil/core';\nimport { ObservableMap } from '@stencil/store';\n\nexport type Stores = Record<string, ObservableMap<any>>;\n\nexport type Transitions = 'none' | 'fade' | 'slide' | 'swipe';\n\n@Component({\n  tag: 'nylas-if-state',\n  styleUrl: 'nylas-if-state.css',\n  shadow: true,\n})\nexport class NylasIfState {\n  /**\n   * The name of the state to watch.\n   */\n  @Prop() readonly state?: string;\n  /**\n   * If true, then the component will render if the state is set (empty or not set).\n   * This prop is used with the `state` prop.\n   */\n  @Prop() readonly isStateSet?: boolean;\n  /**\n   * If true, then the component will render if the state is true.\n   * This prop is used with the `state` prop.\n   */\n  @Prop() readonly isBoolean?: boolean;\n  @Prop() readonly getStore?: <K extends keyof Stores>(name: K) => Stores[K];\n  @Prop() readonly transition: Transitions = 'none';\n\n  @State() show: boolean = false;\n  @State() classes: Record<string, boolean> = {};\n\n  constructor() {\n    this.initTransition = this.initTransition.bind(this);\n  }\n\n  connectedCallback() {}\n\n  disconnectedCallback() {}\n\n  async componentWillLoad() {\n    debug(`[nylas-if-state] Component will load`);\n    this.watchStore(true);\n  }\n\n  async componentDidLoad() {\n    debug(`[nylas-if-state] Component did load`);\n  }\n\n  private shouldRender() {\n    // If a period exists in the state name, then we need to split the state name into the store name and the state name.\n    // For example, if the state name is `nylas.scheduler.selectableDates`, then the store name is `nylas` and the state name is `scheduler.selectableDates`.\n    const [storeName, stateName] = this.state ? this.state.split('.') : ['', ''];\n    const getStore = this.getStore;\n    if (typeof getStore === 'undefined') {\n      debug(`[nylas-if-state] Store name: ${storeName} | State name: ${stateName}`, { getStore });\n      return false;\n    }\n\n    const store = getStore(storeName as keyof Stores);\n    if (typeof store === 'undefined') {\n      debug(`[nylas-if-state] Store name: ${storeName} | State name: ${stateName}`, { store });\n      return false;\n    }\n\n    const state = store.state[stateName as string];\n\n    if (typeof this.isStateSet === 'boolean') {\n      return (\n        (this.isStateSet === false && (typeof state === 'undefined' || state === null || state.length === 0)) ||\n        (this.isStateSet === true && typeof state !== 'undefined' && state !== null)\n      );\n    }\n\n    if (typeof this.isBoolean === 'boolean') {\n      return (this.isBoolean === true && typeof state !== 'undefined' && state === true) || (this.isBoolean === false && typeof state !== 'undefined' && state === false);\n    }\n\n    return false;\n  }\n\n  @Watch('getStore')\n  onGetStoreChange() {\n    this.watchStore(true);\n  }\n\n  private watchStore(immediate: boolean = false) {\n    // If a period exists in the state name, then we need to split the state name into the store name and the state name.\n    // For example, if the state name is `nylas.scheduler.selectableDates`, then the store name is `nylas` and the state name is `scheduler.selectableDates`.\n    const [storeName, stateName] = this.state ? this.state.split('.') : ['', ''];\n    const getStore = this.getStore;\n    if (typeof getStore === 'undefined') {\n      debug(`[nylas-if-state] Store name: ${storeName} | State name: ${stateName}`, { getStore });\n      return null;\n    }\n\n    const store = getStore(storeName as keyof Stores);\n    if (typeof store === 'undefined') {\n      debug(`[nylas-if-state] Store name: ${storeName} | State name: ${stateName}`, { store });\n      return null;\n    }\n\n    if (immediate === true) {\n      this.initTransition();\n    }\n\n    store.onChange(stateName as string, this.initTransition);\n  }\n\n  private initTransition() {\n    const show = this.shouldRender();\n    switch (this.transition) {\n      case 'fade':\n      case 'slide':\n      case 'swipe':\n        this.classes = {\n          [`${this.transition}-in`]: show,\n          [`${this.transition}-out`]: !show,\n        };\n        setTimeout(() => {\n          this.show = show;\n        }, 150);\n        break;\n      default:\n        this.show = this.shouldRender();\n        break;\n    }\n  }\n\n  @RegisterComponent({\n    name: 'nylas-if-state',\n    getStoresToProp: 'getStore',\n    fireRegisterEvent: true,\n  })\n  render() {\n    return (\n      <Host>\n        <div class={this.classes}>{this.show && <slot></slot>}</div>\n      </Host>\n    );\n  }\n}\n",":host {\n  font-family: 'Arial', sans-serif;\n  background: var(--nylas-color-primary-50); /* Closest to #f0f0f0 */\n  color: var(--nylas-color-primary-800); /* Closest to #333 */\n  margin: 0;\n  display: contents;\n}\n\ninput {\n  box-sizing: border-box;\n}\n\n.login-container {\n  display: flex;\n  justify-content: center;\n  align-items: center;\n  height: 100%;\n}\n\n.login-box {\n  width: 300px;\n  padding: 20px;\n  box-shadow: 0 4px 8px rgba(0, 0, 0, 0.1);\n  border-radius: var(--nylas-border-radius-2x);\n  background: var(--nylas-color-primary-50); /* Assuming white background */\n  text-align: center;\n}\n\n.login-box h1 {\n  margin-top: 0;\n  margin-bottom: 0.5em;\n}\n\n.login-box p {\n  margin-bottom: 1em;\n}\n\n.login-methods button {\n  display: block;\n  width: 100%;\n  padding: 10px 10px 10px 50px;\n  margin-bottom: 10px;\n  border: none;\n  border-radius: var(--nylas-border-radius);\n  border: 1px solid var(--nylas-color-primary-300); /* Closest to #b1b1b1 */\n  background: var(--nylas-color-primary-100); /* Closest to #f1f1f1 */\n  color: var(--nylas-color-primary-600); /* Closest to #5f6368 */\n  cursor: pointer;\n  transition: background 0.3s ease;\n  position: relative;\n  text-align: left;\n}\n\n.login-methods button svg {\n  position: absolute;\n  left: 16px;\n  top: 50%;\n  transform: translateY(-50%);\n}\n\n.login-methods button:hover {\n  background: var(--nylas-color-primary-200); /* Closest to #e2e2e2 */\n}\n\n.login-form label {\n  display: block;\n  margin-bottom: 5px;\n  text-align: left;\n}\n\n.login-form input {\n  width: 100%;\n  padding: 10px;\n  margin-bottom: 10px;\n  border: 1px solid var(--nylas-color-primary-200); /* Closest to #ddd */\n  border-radius: var(--nylas-border-radius);\n  background: var(--nylas-color-primary-100); /* Closest to #f1f1f1 */\n  color: var(--nylas-color-primary-800); /* Closest to #333 */\n}\n\n.login-form button {\n  width: 100%;\n  padding: 10px;\n  border: none;\n  border-radius: var(--nylas-border-radius);\n  background: var(--nylas-color-primary-500); /* Closest to #007bff */\n  color: var(--nylas-color-primary-50); /* Assuming white text */\n  cursor: pointer;\n  transition: background 0.3s ease;\n}\n\n.login-form button:hover {\n  background: var(--nylas-color-primary-600); /* Closest to #0056b3 */\n}\n","import { RegisterComponent } from '@/common/register-component';\nimport { NylasAuthConnectorInterface } from '@/connector/connector-interface';\nimport { Component, Event, EventEmitter, Host, Prop, State, h } from '@stencil/core';\nimport { ObservableMap } from '@stencil/store';\nimport { NylasAuthStoreState } from '../../components';\n\n@Component({\n  tag: 'nylas-login',\n  styleUrl: 'nylas-login.css',\n  shadow: true,\n})\nexport class NylasLogin {\n  @Prop() readonly isAuthenticated: boolean = false;\n  @Prop() readonly nylasConnector?: NylasAuthConnectorInterface;\n  @Prop() readonly scopes?: string[];\n  @Prop() readonly loginMethod: 'redirect' | 'emebded' = 'redirect';\n  @Prop() readonly companyName: string = 'Nylas';\n  @Prop() readonly logoUrl: string = 'https://www.nylas.com/wp-content/uploads/main-logo.svg';\n  @Prop() readonly logoWidth?: string = 'min-content';\n  @Prop() readonly providers?: string = 'google,microsoft';\n  @Prop() readonly buttonText: string = 'Login';\n\n  @Event() buttonClick!: EventEmitter<{ url?: string }>;\n\n  @State() email: string = '';\n\n  connectedCallback() {}\n\n  disconnectedCallback() {}\n\n  componentWillLoad() {}\n\n  async componentDidLoad() {\n    const exchangedToken = await this.nylasConnector?.auth.manageHostedAuthCodeExchange(window.location.href);\n    if (exchangedToken) {\n      // Remove the code query param from the user's browser url\n      window.history.replaceState({}, document.title, window.location.pathname);\n    }\n  }\n\n  private _handleLoginRedirect = async () => {\n    const url = await this.nylasConnector?.auth.getHostedAuthRedirectURL(this.scopes);\n\n    const event = this.buttonClick.emit({ url });\n    if (event.defaultPrevented) {\n      return;\n    }\n\n    if (url) {\n      window.location.href = url;\n    }\n  };\n\n  private _onGoogleButtonClick = async (event: Event) => {\n    // Prevent the form from submitting\n    event.preventDefault();\n\n    const url = await this.nylasConnector?.auth.getHostedAuthRedirectURL(this.scopes, undefined, 'google');\n    if (url) {\n      window.location.href = url;\n    }\n  };\n\n  private _onMicrosoftButtonClick = async (event: Event) => {\n    // Prevent the form from submitting\n    event.preventDefault();\n\n    const url = await this.nylasConnector?.auth.getHostedAuthRedirectURL(this.scopes, undefined, 'microsoft');\n    if (url) {\n      window.location.href = url;\n    }\n  };\n\n  private _onFormSubmit = async (event: Event) => {\n    // Prevent the form from submitting\n    event.preventDefault();\n\n    const url = await this.nylasConnector?.auth.getHostedAuthRedirectURL(this.scopes, this.email);\n    if (url) {\n      window.location.href = url;\n    }\n  };\n\n  @RegisterComponent<\n    NylasLogin,\n    NylasAuthConnectorInterface,\n    {\n      auth: ObservableMap<NylasAuthStoreState>;\n    }\n  >({\n    name: 'nylas-login',\n    connectorToProp: 'nylasConnector',\n    stateToProps: new Map([['auth.isAuthenticated', 'isAuthenticated']]),\n    fireRegisterEvent: true,\n  })\n  render() {\n    const splitProviders = this.providers?.split(',') || [];\n    return (\n      <Host>\n        {this.loginMethod === 'redirect' && (\n          <div class=\"redirect-container\">\n            {!this.isAuthenticated && (\n              <sp-button part=\"button\" onClick={this._handleLoginRedirect}>\n                {this.buttonText}\n              </sp-button>\n            )}\n          </div>\n        )}\n        {this.loginMethod === 'emebded' && (\n          <main class=\"login-container\">\n            <section class=\"login-box\">\n              <header>\n                <img\n                  src={this.logoUrl}\n                  alt={`${this.companyName} logo`}\n                  width={'100%'}\n                  style={{\n                    minWidth: this.logoWidth,\n                  }}\n                />\n                <h1>Welcome</h1>\n              </header>\n              <p>Log in to your account to continue to {this.companyName}</p>\n              <div class=\"login-methods\">\n                {splitProviders.includes('google') && (\n                  <button class=\"login-google\" onClick={this._onGoogleButtonClick}>\n                    <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\">\n                      <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\" />\n                      <path\n                        fill=\"#34A853\"\n                        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\"\n                      />\n                      <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\" />\n                      <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\" />\n                    </svg>\n                    Continue with Google\n                  </button>\n                )}\n                {splitProviders.includes('microsoft') && (\n                  <button class=\"login-microsoft\" onClick={this._onMicrosoftButtonClick}>\n                    <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\">\n                      <path fill=\"#F3F3F3\" d=\"M0 32v192h192V32H0zm256 0v192h192V32H256zm192 256v192h-192V288h192zM0 224v192h192V224H0z\" />\n                    </svg>\n                    Continue with Microsoft\n                  </button>\n                )}\n                {/* <button class=\"login-all\">View all providers</button> */}\n              </div>\n              <form class=\"login-form\" method=\"POST\" onSubmit={this._onFormSubmit}>\n                <label htmlFor=\"email\">Email</label>\n                <input type=\"email\" id=\"email\" name=\"email\" required value={this.email} />\n                <button type=\"submit\">Next</button>\n              </form>\n            </section>\n          </main>\n        )}\n      </Host>\n    );\n  }\n}\n","import { RouterInterface } from '@/routers/router-interface';\nimport { NylasAuthStoreType } from '@/stores/auth-store';\nimport { NylasMailboxStoreType } from '@/stores/mailbox-store';\nimport { debug } from '@/utils/utils';\nimport type { NylasAuthType } from '@nylas/core';\nimport { NylasMailboxConnectorInterface } from '../connector-interface';\nimport { NylasAuthConnector } from '../shared/api/auth';\nimport { NylasMessagesConnector } from '../shared/api/messages';\nimport { NylasThreadsConnector } from '../shared/api/threads';\nimport { NylasFoldersConnector } from '../shared/api/folders';\n\n/**\n * Base class for the Nylas connector.\n */\nexport class NylasMailboxConnector implements NylasMailboxConnectorInterface {\n  public nylasAuth: NylasAuthType;\n  public nylasMailboxStore: NylasMailboxStoreType;\n  public nylasAuthStore: NylasAuthStoreType;\n  public router: RouterInterface;\n\n  private _authConnector: NylasAuthConnector | undefined;\n  private _threadConnector: NylasThreadsConnector | undefined;\n  private _messageConnector: NylasMessagesConnector | undefined;\n  private _foldersConnector: NylasFoldersConnector | undefined;\n\n  constructor(router: RouterInterface, nylasAuth: NylasAuthType, nylasAuthStore: NylasAuthStoreType, nylasStore: NylasMailboxStoreType) {\n    this.router = router;\n    this.nylasAuth = nylasAuth;\n    this.nylasAuthStore = nylasAuthStore;\n    this.nylasMailboxStore = nylasStore;\n  }\n\n  public init() {\n    debug('NylasMailboxConnector init');\n  }\n\n  public get mailboxStore() {\n    return this.nylasMailboxStore;\n  }\n\n  public get authStore() {\n    return this.nylasAuthStore;\n  }\n\n  public get auth() {\n    if (this._authConnector) {\n      return this._authConnector;\n    }\n    this._authConnector = new NylasAuthConnector(this.nylasAuth, this.nylasAuthStore);\n    return this._authConnector;\n  }\n\n  public get threads() {\n    if (this._threadConnector) {\n      return this._threadConnector;\n    }\n    this._threadConnector = new NylasThreadsConnector(this.nylasAuth, this.nylasAuthStore, this.nylasMailboxStore, this.router);\n    return this._threadConnector;\n  }\n\n  public get messages() {\n    if (this._messageConnector) {\n      return this._messageConnector;\n    }\n    this._messageConnector = new NylasMessagesConnector(this.nylasAuth, this.nylasAuthStore, this.nylasMailboxStore);\n    return this._messageConnector;\n  }\n\n  public get folders() {\n    if (this._foldersConnector) {\n      return this._foldersConnector;\n    }\n    this._foldersConnector = new NylasFoldersConnector(this.nylasAuth, this.nylasAuthStore, this.nylasMailboxStore);\n    return this._foldersConnector;\n  }\n\n  public getAuth() {\n    return this.nylasAuth;\n  }\n\n  public resetStores() {\n    this.nylasMailboxStore.reset();\n    this.nylasAuthStore.reset();\n  }\n\n  public async logout() {\n    await this.nylasAuth.logout();\n    this.resetStores();\n  }\n}\n\nexport type PublicMethods<T> = {\n  [K in keyof T]: T[K] extends Function ? (string extends K ? never : K) : never;\n}[keyof T];\n\nexport type NylasMailboxConnectorPublicMethods = PublicMethods<NylasMailboxConnector>;\n",":host {\n  display: contents;\n}\n","import { NylasBaseProvider } from '@/common/abstract-provider';\nimport { RegisteredComponent } from '@/common/register-component';\nimport type { EventOverride } from '@/common/component-types';\nimport { NylasMailboxConnector } from '@/connector/nylas-mailbox-connector';\nimport { HashRouter } from '@/routers/hash-router';\nimport { RouterInterface } from '@/routers/router-interface';\nimport { CreateNylasAuthStore, NylasAuthStoreState, NylasAuthStoreType } from '@/stores/auth-store';\nimport { CreateNylasMailboxStore, NylasMailboxStoreState, NylasMailboxStoreType } from '@/stores/mailbox-store';\nimport { AuthConfg, NylasAuth, NylasAuthType } from '@nylas/core';\nimport { Component, Element, Event, EventEmitter, Host, Listen, Method, Prop, h } from '@stencil/core';\nimport { debug } from '@/utils/utils';\n\n/**\n * The Nylas Mailbox component.\n * This component is used as a provider for all other Nylas Mailbox components.\n * It is responsible for managing the NylasAuth and NylasMailboxConnector instances.\n * It also manages the state of the NylasAuth and NylasMailboxStore instances.\n * @example\n * <nylas-mailbox\n *  auth-config={{\n *  clientId: 'YOUR_CLIENT_ID',\n *  }}\n * default-auth-store-state={{\n * threadQueryParams: {\n *  limit: 10,\n * }}\n * >\n *  <nylas-mailbox-thread-list></nylas-mailbox-thread-list>\n * </nylas-mailbox>\n */\n@Component({\n  tag: 'nylas-mailbox',\n  styleUrl: 'nylas-mailbox.css',\n  shadow: true,\n})\nexport class NylasMailbox {\n  /**\n   * Stores to be used by the provider.\n   */\n  private stores?: {\n    auth: NylasAuthStoreType;\n    mailbox: NylasMailboxStoreType;\n  };\n\n  /**\n   * This is a base provide that defines the common methods and properties\n   * that all providers should have.\n   *\n   * Because stencil does not support abstract classes, we have to use a\n   * property to store the base provider instance.\n   */\n  private baseProvider?: NylasBaseProvider<Exclude<typeof this.stores, undefined>>;\n\n  /**\n   * The Nylas Auth instance.\n   * Used to manage all things authentication with Nylas.\n   */\n  private nylasAuth?: NylasAuthType;\n\n  /**\n   * A router instance.\n   */\n  private router?: RouterInterface;\n\n  /**\n   * The Nylas Mailbox Connector instance.\n   * The branins of the provider. It manages data fetching and state synchronization.\n   */\n  private nylasMailboxConnector?: NylasMailboxConnector;\n\n  /**\n   * The host element.\n   * Used to manage the host element of the provider.\n   */\n  @Element() private host!: HTMLNylasMailboxElement;\n\n  /**\n   * Automatically register components that have the `@RegisterComponent` decorator.\n   * If this is set to false, you will need to manually register components using the\n   * `registerComponent` method.\n   */\n  @Prop() readonly automaticComponentRegistration: boolean = true;\n\n  /**\n   * This provides a way to override the default event handlers.\n   */\n  @Prop() eventOverrides: EventOverride<Exclude<typeof this.nylasMailboxConnector, undefined>> = {};\n\n  /**\n   * The Nylas Auth configuration.\n   * Used to manage all things authentication with Nylas.\n   */\n  @Prop({ attribute: 'auth-config' }) readonly authConfig?: AuthConfg;\n\n  /**\n   * The default auth store state.\n   * Used to set the initial state of the auth store.\n   */\n  @Prop({ attribute: 'default-auth-store-state' }) readonly defaultAuthStoreState?: NylasAuthStoreState;\n\n  /**\n   * The default mailbox store state.\n   * Used to set the initial state of the mailbox store.\n   */\n  @Prop({ attribute: 'default-mailbox-store-state' }) readonly defaultMailboxStoreState?: NylasMailboxStoreState;\n\n  /**\n   * This event is fired when the provider is initialized.\n   * It can be used to set the initial state of the provider,\n   * or to prevent the provider from firing some default behavior.\n   */\n  @Event({ cancelable: true }) readonly init!: EventEmitter<HTMLNylasMailboxElement>;\n\n  /**\n   * This event is fired when the the NyalsAuth isAuthenticated state changes\n   * to true.\n   */\n  @Event({ cancelable: true }) readonly loggedIn!: EventEmitter<HTMLNylasMailboxElement>;\n\n  /**\n   * This event is fired when the the NyalsAuth isAuthenticated state changes\n   * to true.\n   */\n  @Event({ cancelable: true }) readonly loggedOut!: EventEmitter<HTMLNylasMailboxElement>;\n\n  connectedCallback() {\n    debug('[nylas-mailbox] connectedCallback');\n  }\n\n  async componentWillLoad() {\n    this.stores = {\n      auth: CreateNylasAuthStore(this.defaultAuthStoreState),\n      mailbox: CreateNylasMailboxStore(this.defaultMailboxStoreState),\n    };\n\n    this.baseProvider = new NylasBaseProvider(this.host, this.stores, this.automaticComponentRegistration, this.eventOverrides);\n\n    /**\n     * Create the router instance.\n     * This will be used to manage the routing of the provider.\n     */\n    this.router = new HashRouter();\n\n    /**\n     * Create the NylasAuth instance.\n     * This will be used to manage all things authentication with Nylas.\n     */\n    this.nylasAuth = NylasAuth({\n      apiUri: 'https://api.us.nylas.com',\n      elementsApiUri: 'https://elements.us.nylas.com',\n      storageType: 'indexeddb',\n      clientId: 'YOUR_CLIENT_ID',\n      defaultScopes: [],\n      redirectURI: '/',\n      ...this.authConfig,\n    });\n\n    const authStore = this.baseProvider?.getStore('auth');\n    if (!authStore) {\n      throw new Error('Auth store is not defined');\n    }\n\n    const mailboxStore = this.baseProvider?.getStore('mailbox');\n    if (!mailboxStore) {\n      throw new Error('Mailbox store is not defined');\n    }\n\n    this.nylasMailboxConnector = new NylasMailboxConnector(this.router, this.nylasAuth, authStore, mailboxStore);\n\n    const initEvent = this.init.emit(this.host);\n    if (!initEvent.defaultPrevented) {\n      /**\n       * By default, on init, we will validate the session.\n       * This will check if the user is logged in and if the session is still valid.\n       * If the session is not valid, the user will be logged out.\n       */\n      await this.nylasMailboxConnector?.auth.validateSession();\n    }\n\n    // Handle our router\n    this.router?.addRouteChangeListener(`/thread/:threadId`, async (_route, _path, routeParams) => {\n      const threadId = routeParams.threadId;\n      const thread = await this.nylasMailboxConnector?.threads.getThread(threadId);\n      if (thread) {\n        this.nylasMailboxConnector?.mailboxStore.set('selectedThread', thread);\n      }\n    });\n    this.router?.addRouteChangeListener(`/`, async (_route, _path, _routeParams) => {\n      if (!authStore.state.isAuthenticated) {\n        return;\n      }\n      // Reset the selected thread\n      this.nylasMailboxConnector?.threads.unSelectThread();\n      this.nylasMailboxConnector?.folders.getFolders();\n\n      // If we have a query param, search for threads\n      const queryParams = window.location.hash.split('?')[1];\n      if (queryParams) {\n        const params = new URLSearchParams(queryParams);\n        const searchQuery = params.get('query');\n        if (searchQuery) {\n          await this.nylasMailboxConnector?.threads.getThreads({\n            search_query_native: searchQuery,\n            page_token: undefined,\n          });\n        }\n      } else {\n        this.nylasMailboxConnector?.threads.getThreads();\n      }\n    });\n\n    /**\n     * Initialize the router.\n     * This will be used to manage the routing of the provider.\n     */\n    this.router?.init();\n\n    /**\n     * Listen for changes in the NylasAuth isAuthenticated state.\n     * This is used to fire the loggedIn and loggedOut events.\n     */\n    this.handleAuthChange(authStore.state.isAuthenticated);\n    this.baseProvider?.componentWillLoad(this.nylasMailboxConnector);\n  }\n\n  async componentDidLoad() {\n    const authStore = this.baseProvider?.getStore('auth');\n    if (!authStore) {\n      throw new Error('Auth store is not defined');\n    }\n\n    authStore.onChange('isAuthenticated', this.handleAuthChange);\n    this.baseProvider?.componentDidLoad();\n  }\n\n  componentDisconnected() {\n    this.baseProvider?.componentDisconnected();\n  }\n\n  /**\n   * This is a custom event handler that is used to register a component with the provider.\n   * It is used by components that have the `@RegisterComponent` decorator.\n   * @param event A custom event that contains the component to register\n   * @returns Promise<void>\n   */\n  @Listen('registerComponent')\n  async registerComponentHandler(event: CustomEvent<RegisteredComponent<any, any>>): Promise<void> {\n    this.baseProvider?.registerComponent(event.detail);\n  }\n\n  /**\n   * This is a custom event handler that is used to unregister a component with the provider.\n   * It is used by components that have the `@RegisterComponent` decorator.\n   * @param event A custom event that contains the component to unregister\n   * @returns Promise<void>\n   */\n  @Listen('unregisterComponent')\n  async unregisterComponentHandler(event: CustomEvent<RegisteredComponent<any, any>>): Promise<void> {\n    this.baseProvider?.unregisterComponent(event.detail);\n  }\n\n  /**\n   * This method is used to retrieve the mailboxStore instance\n   * @returns The mailboxStore instance\n   */\n  @Method()\n  async getMailboxStore(): Promise<NylasMailboxStoreType | undefined> {\n    return this.baseProvider?.getStore('mailbox');\n  }\n\n  /**\n   * This method is used to retrieve the authStore instance\n   * @returns The authStore instance\n   */\n  @Method()\n  async getAuthStore(): Promise<NylasAuthStoreType | undefined> {\n    return this.baseProvider?.getStore('auth');\n  }\n\n  /**\n   * This method is used to retrieve the NylasAuth instance\n   * @returns The NylasAuth instance\n   */\n  @Method()\n  async getNylasAuth(): Promise<NylasAuthType | undefined> {\n    return this.nylasAuth;\n  }\n\n  /**\n   * This method is used to retrieve the NylasMailboxConnector instance\n   * @returns The NylasMailboxConnector instance\n   */\n  @Method()\n  async getNylasMailboxConnector() {\n    return this.nylasMailboxConnector;\n  }\n\n  /**\n   * This method is used to handle changes in the NylasAuth isAuthenticated state\n   * @param isAuthenticated isAuthenticated state\n   * @returns void\n   */\n  private handleAuthChange = async (isAuthenticated: boolean) => {\n    if (isAuthenticated) {\n      this.loggedIn.emit(this.host);\n    } else {\n      const loggedOutEvent = this.loggedOut.emit(this.host);\n      if (!loggedOutEvent.defaultPrevented) {\n        await this.nylasMailboxConnector?.logout();\n      }\n    }\n  };\n\n  render() {\n    return (\n      <Host>\n        <slot />\n      </Host>\n    );\n  }\n}\n"],"mappings":"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"}

package/dist/nylas-web-elements/p-c66e27d0.js

@@ -0,0 +1,3 @@
+const t="nylas-web-elements";let e;let n;let s=false;let o=null;let l=false;const c=(t,e="")=>{{return()=>{}}};const i=(t,e)=>{{return()=>{}}};const f="{visibility:hidden}.hydrated{visibility:inherit}";const r="slot-fb{display:contents}slot-fb[hidden]{display:none}";const u={};const a="http://www.w3.org/2000/svg";const d="http://www.w3.org/1999/xhtml";const v=t=>t!=null;const p=t=>{t=typeof t;return t==="object"||t==="function"};function y(t){var e,n,s;return(s=(n=(e=t.head)===null||e===void 0?void 0:e.querySelector('meta[name="csp-nonce"]'))===null||n===void 0?void 0:n.getAttribute("content"))!==null&&s!==void 0?s:undefined}const h=(t,e,...n)=>{let s=null;let o=null;let l=false;let c=false;const i=[];const f=e=>{for(let n=0;n<e.length;n++){s=e[n];if(Array.isArray(s)){f(s)}else if(s!=null&&typeof s!=="boolean"){if(l=typeof t!=="function"&&!p(s)){s=String(s)}if(l&&c){i[i.length-1].t+=s}else{i.push(l?b(null,s):s)}c=l}}};f(n);if(e){if(e.key){o=e.key}{const t=e.className||e.class;if(t){e.class=typeof t!=="object"?t:Object.keys(t).filter((e=>t[e])).join(" ")}}}if(typeof t==="function"){return t(e===null?{}:e,i,$)}const r=b(t,null);r.o=e;if(i.length>0){r.l=i}{r.i=o}return r};const b=(t,e)=>{const n={u:0,v:t,t:e,p:null,l:null};{n.o=null}{n.i=null}return n};const m={};const w=t=>t&&t.v===m;const $={forEach:(t,e)=>t.map(g).forEach(e),map:(t,e)=>t.map(g).map(e).map(S)};const g=t=>({vattrs:t.o,vchildren:t.l,vkey:t.i,vname:t.h,vtag:t.v,vtext:t.t});const S=t=>{if(typeof t.vtag==="function"){const e=Object.assign({},t.vattrs);if(t.vkey){e.key=t.vkey}if(t.vname){e.name=t.vname}return h(t.vtag,e,...t.vchildren||[])}const e=b(t.vtag,t.vtext);e.o=t.vattrs;e.l=t.vchildren;e.i=t.vkey;e.h=t.vname;return e};const j=(t,e)=>{if(t!=null&&!p(t)){if(e&4){return t==="false"?false:t===""||!!t}if(e&2){return parseFloat(t)}if(e&1){return String(t)}return t}return t};const O=t=>gt(t).$hostElement$;const k=(t,e,n)=>{const s=O(t);return{emit:t=>C(s,e,{bubbles:!!(n&4),composed:!!(n&2),cancelable:!!(n&1),detail:t})}};const C=(t,e,n)=>{const s=Lt.ce(e,n);t.dispatchEvent(s);return s};const M=new WeakMap;const x=(t,e,n)=>{let s=xt.get(t);if(Wt&&n){s=s||new CSSStyleSheet;if(typeof s==="string"){s=e}else{s.replaceSync(e)}}else{s=e}xt.set(t,s)};const P=(t,e,n)=>{var s;const o=L(e);const l=xt.get(o);t=t.nodeType===11?t:Et;if(l){if(typeof l==="string"){t=t.head||t;let n=M.get(t);let c;if(!n){M.set(t,n=new Set)}if(!n.has(o)){{c=Et.createElement("style");c.innerHTML=l;const e=(s=Lt.m)!==null&&s!==void 0?s:y(Et);if(e!=null){c.setAttribute("nonce",e)}t.insertBefore(c,t.querySelector("link"))}if(e.u&4){c.innerHTML+=r}if(n){n.add(o)}}}else if(!t.adoptedStyleSheets.includes(l)){t.adoptedStyleSheets=[...t.adoptedStyleSheets,l]}}return o};const E=t=>{const e=t.$;const n=t.$hostElement$;const s=e.u;const o=c("attachStyles",e.S);const l=P(n.shadowRoot?n.shadowRoot:n.getRootNode(),e);if(s&10){n["s-sc"]=l;n.classList.add(l+"-h");if(s&2){n.classList.add(l+"-s")}}o()};const L=(t,e)=>"sc-"+t.S;const R=(t,e,n,s,o,l)=>{if(n!==s){let c=Ot(t,e);let i=e.toLowerCase();if(e==="class"){const e=t.classList;const o=W(n);const l=W(s);e.remove(...o.filter((t=>t&&!l.includes(t))));e.add(...l.filter((t=>t&&!o.includes(t))))}else if(e==="style"){{for(const e in n){if(!s||s[e]==null){if(e.includes("-")){t.style.removeProperty(e)}else{t.style[e]=""}}}}for(const e in s){if(!n||s[e]!==n[e]){if(e.includes("-")){t.style.setProperty(e,s[e])}else{t.style[e]=s[e]}}}}else if(e==="key");else if(e==="ref"){if(s){s(t)}}else if(!c&&e[0]==="o"&&e[1]==="n"){if(e[2]==="-"){e=e.slice(3)}else if(Ot(Pt,i)){e=i.slice(2)}else{e=i[2]+e.slice(3)}if(n||s){const o=e.endsWith(A);e=e.replace(F,"");if(n){Lt.rel(t,e,n,o)}if(s){Lt.ael(t,e,s,o)}}}else{const i=p(s);if((c||i&&s!==null)&&!o){try{if(!t.tagName.includes("-")){const o=s==null?"":s;if(e==="list"){c=false}else if(n==null||t[e]!=o){t[e]=o}}else{t[e]=s}}catch(t){}}if(s==null||s===false){if(s!==false||t.getAttribute(e)===""){{t.removeAttribute(e)}}}else if((!c||l&4||o)&&!i){s=s===true?"":s;{t.setAttribute(e,s)}}}}};const U=/\s/;const W=t=>!t?[]:t.split(U);const A="Capture";const F=new RegExp(A+"$");const N=(t,e,n,s)=>{const o=e.p.nodeType===11&&e.p.host?e.p.host:e.p;const l=t&&t.o||u;const c=e.o||u;{for(s in l){if(!(s in c)){R(o,s,l[s],undefined,n,e.u)}}}for(s in c){R(o,s,l[s],c[s],n,e.u)}};const T=(t,o,l,c)=>{const i=o.l[l];let f=0;let r;let u;if(i.t!==null){r=i.p=Et.createTextNode(i.t)}else{if(!s){s=i.v==="svg"}r=i.p=Et.createElementNS(s?a:d,i.v);if(s&&i.v==="foreignObject"){s=false}{N(null,i,s)}if(v(e)&&r["s-si"]!==e){r.classList.add(r["s-si"]=e)}if(i.l){for(f=0;f<i.l.length;++f){u=T(t,i,f);if(u){r.appendChild(u)}}}{if(i.v==="svg"){s=false}else if(r.tagName==="foreignObject"){s=true}}}r["s-hn"]=n;return r};const H=(t,e,s,o,l,c)=>{let i=t;let f;if(i.shadowRoot&&i.tagName===n){i=i.shadowRoot}for(;l<=c;++l){if(o[l]){f=T(null,s,l);if(f){o[l].p=f;i.insertBefore(f,e)}}}};const q=(t,e,n)=>{for(let s=e;s<=n;++s){const e=t[s];if(e){const t=e.p;_(e);if(t){t.remove()}}}};const D=(t,e,n,s,o=false)=>{let l=0;let c=0;let i=0;let f=0;let r=e.length-1;let u=e[0];let a=e[r];let d=s.length-1;let v=s[0];let p=s[d];let y;let h;while(l<=r&&c<=d){if(u==null){u=e[++l]}else if(a==null){a=e[--r]}else if(v==null){v=s[++c]}else if(p==null){p=s[--d]}else if(I(u,v,o)){V(u,v,o);u=e[++l];v=s[++c]}else if(I(a,p,o)){V(a,p,o);a=e[--r];p=s[--d]}else if(I(u,p,o)){V(u,p,o);t.insertBefore(u.p,a.p.nextSibling);u=e[++l];p=s[--d]}else if(I(a,v,o)){V(a,v,o);t.insertBefore(a.p,u.p);a=e[--r];v=s[++c]}else{i=-1;{for(f=l;f<=r;++f){if(e[f]&&e[f].i!==null&&e[f].i===v.i){i=f;break}}}if(i>=0){h=e[i];if(h.v!==v.v){y=T(e&&e[c],n,i)}else{V(h,v,o);e[i]=undefined;y=h.p}v=s[++c]}else{y=T(e&&e[c],n,c);v=s[++c]}if(y){{u.p.parentNode.insertBefore(y,u.p)}}}}if(l>r){H(t,s[d+1]==null?null:s[d+1].p,n,s,c,d)}else if(c>d){q(e,l,r)}};const I=(t,e,n=false)=>{if(t.v===e.v){if(!n){return t.i===e.i}return true}return false};const V=(t,e,n=false)=>{const o=e.p=t.p;const l=t.l;const c=e.l;const i=e.v;const f=e.t;if(f===null){{s=i==="svg"?true:i==="foreignObject"?false:s}{if(i==="slot");else{N(t,e,s)}}if(l!==null&&c!==null){D(o,l,e,c,n)}else if(c!==null){if(t.t!==null){o.textContent=""}H(o,null,e,c,0,c.length-1)}else if(l!==null){q(l,0,l.length-1)}if(s&&i==="svg"){s=false}}else if(t.t!==f){o.data=f}};const _=t=>{{t.o&&t.o.ref&&t.o.ref(null);t.l&&t.l.map(_)}};const z=(t,s,o=false)=>{const l=t.$hostElement$;const c=t.j||b(null,null);const i=w(s)?s:h(null,null,s);n=l.tagName;if(o&&i.o){for(const t of Object.keys(i.o)){if(l.hasAttribute(t)&&!["key","ref","style","class"].includes(t)){i.o[t]=l[t]}}}i.v=null;i.u|=4;t.j=i;i.p=c.p=l.shadowRoot||l;{e=l["s-sc"]}V(c,i,o)};const B=(t,e)=>{if(e&&!t.O&&e["s-p"]){e["s-p"].push(new Promise((e=>t.O=e)))}};const G=(t,e)=>{{t.u|=16}if(t.u&4){t.u|=512;return}B(t,t.k);const n=()=>J(t,e);return Dt(n)};const J=(t,e)=>{const n=c("scheduleUpdate",t.$.S);const s=t.C;let o;if(e){{t.u|=256;if(t.M){t.M.map((([t,e])=>st(s,t,e)));t.M=undefined}}{o=st(s,"componentWillLoad")}}{o=K(o,(()=>st(s,"componentWillRender")))}n();return K(o,(()=>X(t,s,e)))};const K=(t,e)=>Q(t)?t.then(e):e();const Q=t=>t instanceof Promise||t&&t.then&&typeof t.then==="function";const X=async(t,e,n)=>{var s;const o=t.$hostElement$;const l=c("update",t.$.S);const i=o["s-rc"];if(n){E(t)}const f=c("render",t.$.S);{Y(t,e,o,n)}if(i){i.map((t=>t()));o["s-rc"]=undefined}f();l();{const e=(s=o["s-p"])!==null&&s!==void 0?s:[];const n=()=>tt(t);if(e.length===0){n()}else{Promise.all(e).then(n);t.u|=4;e.length=0}}};const Y=(t,e,n,s)=>{try{o=e;e=e.render();{t.u&=~16}{t.u|=2}{{{z(t,e,s)}}}}catch(e){kt(e,t.$hostElement$)}o=null;return null};const Z=()=>o;const tt=t=>{const e=t.$.S;const n=t.$hostElement$;const s=c("postUpdate",e);const o=t.C;const l=t.k;if(!(t.u&64)){t.u|=64;{ot(n)}{st(o,"componentDidLoad")}s();{t.P(n);if(!l){nt()}}}else{s()}{t.L(n)}{if(t.O){t.O();t.O=undefined}if(t.u&512){qt((()=>G(t,false)))}t.u&=~(4|512)}};const et=t=>{{const e=gt(t);const n=e.$hostElement$.isConnected;if(n&&(e.u&(2|16))===2){G(e,false)}return n}};const nt=e=>{{ot(Et.documentElement)}qt((()=>C(Pt,"appload",{detail:{namespace:t}})))};const st=(t,e,n)=>{if(t&&t[e]){try{return t[e](n)}catch(t){kt(t)}}return undefined};const ot=t=>t.classList.add("hydrated");const lt=(t,e)=>gt(t).R.get(e);const ct=(t,e,n,s)=>{const o=gt(t);const l=o.$hostElement$;const c=o.R.get(e);const i=o.u;const f=o.C;n=j(n,s.U[e][0]);const r=Number.isNaN(c)&&Number.isNaN(n);const u=n!==c&&!r;if((!(i&8)||c===undefined)&&u){o.R.set(e,n);if(f){if(s.W&&i&128){const t=s.W[e];if(t){t.map((t=>{try{f[t](n,c,e)}catch(t){kt(t,l)}}))}}if((i&(2|16))===2){G(o,false)}}}};const it=(t,e,n)=>{var s;const o=t.prototype;if(e.U){if(t.watchers){e.W=t.watchers}const l=Object.entries(e.U);l.map((([t,[s]])=>{if(s&31||n&2&&s&32){Object.defineProperty(o,t,{get(){return lt(this,t)},set(n){ct(this,t,n,e)},configurable:true,enumerable:true})}else if(n&1&&s&64){Object.defineProperty(o,t,{value(...e){var n;const s=gt(this);return(n=s===null||s===void 0?void 0:s.A)===null||n===void 0?void 0:n.then((()=>{var n;return(n=s.C)===null||n===void 0?void 0:n[t](...e)}))}})}}));if(n&1){const n=new Map;o.attributeChangedCallback=function(t,s,l){Lt.jmp((()=>{var c;const i=n.get(t);if(this.hasOwnProperty(i)){l=this[i];delete this[i]}else if(o.hasOwnProperty(i)&&typeof this[i]==="number"&&this[i]==l){return}else if(i==null){const n=gt(this);const o=n===null||n===void 0?void 0:n.u;if(o&&!(o&8)&&o&128&&l!==s){const o=n.C;const i=(c=e.W)===null||c===void 0?void 0:c[t];i===null||i===void 0?void 0:i.forEach((e=>{if(o[e]!=null){o[e].call(o,l,s,t)}}))}return}this[i]=l===null&&typeof this[i]==="boolean"?false:l}))};t.observedAttributes=Array.from(new Set([...Object.keys((s=e.W)!==null&&s!==void 0?s:{}),...l.filter((([t,e])=>e[0]&15)).map((([t,e])=>{const s=e[1]||t;n.set(s,t);return s}))]))}}return t};const ft=async(t,e,n,s)=>{let o;if((e.u&32)===0){e.u|=32;{o=Mt(n);if(o.then){const t=i();o=await o;t()}if(!o.isProxied){{n.W=o.watchers}it(o,n,2);o.isProxied=true}const t=c("createInstance",n.S);{e.u|=8}try{new o(e)}catch(t){kt(t)}{e.u&=~8}{e.u|=128}t();rt(e.C)}if(o.style){let t=o.style;const e=L(n);if(!xt.has(e)){const s=c("registerStyles",n.S);x(e,t,!!(n.u&1));s()}}}const l=e.k;const f=()=>G(e,true);if(l&&l["s-rc"]){l["s-rc"].push(f)}else{f()}};const rt=t=>{{st(t,"connectedCallback")}};const ut=t=>{if((Lt.u&1)===0){const e=gt(t);const n=e.$;const s=c("connectedCallback",n.S);if(!(e.u&1)){e.u|=1;{let n=t;while(n=n.parentNode||n.host){if(n["s-p"]){B(e,e.k=n);break}}}if(n.U){Object.entries(n.U).map((([e,[n]])=>{if(n&31&&t.hasOwnProperty(e)){const n=t[e];delete t[e];t[e]=n}}))}{ft(t,e,n)}}else{yt(t,e,n.F);if(e===null||e===void 0?void 0:e.C){rt(e.C)}else if(e===null||e===void 0?void 0:e.N){e.N.then((()=>rt(e.C)))}}s()}};const at=t=>{{st(t,"disconnectedCallback")}};const dt=async t=>{if((Lt.u&1)===0){const e=gt(t);{if(e.T){e.T.map((t=>t()));e.T=undefined}}if(e===null||e===void 0?void 0:e.C){at(e.C)}else if(e===null||e===void 0?void 0:e.N){e.N.then((()=>at(e.C)))}}};const vt=(t,e={})=>{var n;const s=c();const o=[];const l=e.exclude||[];const i=Pt.customElements;const u=Et.head;const a=u.querySelector("meta[charset]");const d=Et.createElement("style");const v=[];let p;let h=true;Object.assign(Lt,e);Lt.H=new URL(e.resourcesUrl||"./",Et.baseURI).href;let b=false;t.map((t=>{t[1].map((e=>{var n;const s={u:e[0],S:e[1],U:e[2],F:e[3]};if(s.u&4){b=true}{s.U=e[2]}{s.F=e[3]}{s.W=(n=e[4])!==null&&n!==void 0?n:{}}const c=s.S;const f=class extends HTMLElement{constructor(t){super(t);t=this;jt(t,s);if(s.u&1){{{t.attachShadow({mode:"open"})}}}}connectedCallback(){if(p){clearTimeout(p);p=null}if(h){v.push(this)}else{Lt.jmp((()=>ut(this)))}}disconnectedCallback(){Lt.jmp((()=>dt(this)))}componentOnReady(){return gt(this).N}};s.q=t[0];if(!l.includes(c)&&!i.get(c)){o.push(c);i.define(c,it(f,s,1))}}))}));if(b){d.innerHTML+=r}{d.innerHTML+=o+f}if(d.innerHTML.length){d.setAttribute("data-styles","");const t=(n=Lt.m)!==null&&n!==void 0?n:y(Et);if(t!=null){d.setAttribute("nonce",t)}u.insertBefore(d,a?a.nextSibling:u.firstChild)}h=false;if(v.length){v.map((t=>t.connectedCallback()))}else{{Lt.jmp((()=>p=setTimeout(nt,30)))}}s()};const pt=(t,e)=>e;const yt=(t,e,n,s)=>{if(n){n.map((([n,s,o])=>{const l=bt(t,n);const c=ht(e,o);const i=mt(n);Lt.ael(l,s,c,i);(e.T=e.T||[]).push((()=>Lt.rel(l,s,c,i)))}))}};const ht=(t,e)=>n=>{try{{if(t.u&256){t.C[e](n)}else{(t.M=t.M||[]).push([e,n])}}}catch(t){kt(t)}};const bt=(t,e)=>{if(e&8)return Pt;if(e&16)return Et.body;return t};const mt=t=>Rt?{passive:(t&1)!==0,capture:(t&2)!==0}:(t&2)!==0;const wt=t=>Lt.m=t;const $t=new WeakMap;const gt=t=>$t.get(t);const St=(t,e)=>$t.set(e.C=t,e);const jt=(t,e)=>{const n={u:0,$hostElement$:t,$:e,R:new Map};{n.A=new Promise((t=>n.L=t))}{n.N=new Promise((t=>n.P=t));t["s-p"]=[];t["s-rc"]=[]}yt(t,n,e.F);return $t.set(t,n)};const Ot=(t,e)=>e in t;const kt=(t,e)=>(0,console.error)(t,e);const Ct=new Map;const Mt=(t,e,n)=>{const s=t.S.replace(/-/g,"_");const o=t.q;const l=Ct.get(o);if(l){return l[s]}
+/*!__STENCIL_STATIC_IMPORT_SWITCH__*/return import(`./${o}.entry.js${""}`).then((t=>{{Ct.set(o,t)}return t[s]}),kt)};const xt=new Map;const Pt=typeof window!=="undefined"?window:{};const Et=Pt.document||{head:{}};const Lt={u:0,H:"",jmp:t=>t(),raf:t=>requestAnimationFrame(t),ael:(t,e,n,s)=>t.addEventListener(e,n,s),rel:(t,e,n,s)=>t.removeEventListener(e,n,s),ce:(t,e)=>new CustomEvent(t,e)};const Rt=(()=>{let t=false;try{Et.addEventListener("e",null,Object.defineProperty({},"passive",{get(){t=true}}))}catch(t){}return t})();const Ut=t=>Promise.resolve(t);const Wt=(()=>{try{new CSSStyleSheet;return typeof(new CSSStyleSheet).replaceSync==="function"}catch(t){}return false})();const At=[];const Ft=[];const Nt=(t,e)=>n=>{t.push(n);if(!l){l=true;if(e&&Lt.u&4){qt(Ht)}else{Lt.raf(Ht)}}};const Tt=t=>{for(let e=0;e<t.length;e++){try{t[e](performance.now())}catch(t){kt(t)}}t.length=0};const Ht=()=>{Tt(At);{Tt(Ft);if(l=At.length>0){Lt.raf(Ht)}}};const qt=t=>Ut().then(t);const Dt=Nt(Ft,true);export{pt as F,m as H,O as a,vt as b,k as c,et as f,Z as g,h,Ut as p,St as r,wt as s};
+//# sourceMappingURL=p-c66e27d0.js.map