npm - @nylas/web-elements - Versions diffs - 1.1.0-canary.4 → 1.1.0-canary.7 - Mend

@nylas/web-elements 1.1.0-canary.4 → 1.1.0-canary.7

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

Files changed (939) hide show

package/dist/components/nylas-logo2.js.map CHANGED Viewed

	@@ -1 +1 @@
1	- {"file":"nylas-logo2.js","mappings":";;AAAA,MAAM,OAAO,GAAG,gCAAgC;;MCOnC,SAAS;;;;qBACI,IAAI;sBACH,IAAI;;IAE7B,MAAM;QACJ,QACE,4DAAK,KAAK,EAAE,IAAI,CAAC,KAAK,EAAE,MAAM,EAAE,IAAI,CAAC,MAAM,EAAE,OAAO,EAAC,WAAW,EAAC,IAAI,EAAC,MAAM,EAAC,KAAK,EAAC,4BAA4B,IAC7G,uEAAa,sBAAsB,IACjC,6DACE,CAAC,EAAC,ysBAAysB,EAC3sB,IAAI,EAAC,cAAc,GACnB,EACF,6DACE,CAAC,EAAC,q7BAAq7B,EACv7B,IAAI,EAAC,cAAc,GACnB,EACF,6DACE,CAAC,EAAC,8XAA8X,EAChY,IAAI,EAAC,cAAc,GACnB,EACF,6DACE,CAAC,EAAC,yzEAAyzE,EAC3zE,IAAI,EAAC,cAAc,GACnB,EACF,6DACE,CAAC,EAAC,mQAAmQ,EACrQ,IAAI,EAAC,cAAc,GACnB,EACF,6DACE,CAAC,EAAC,ucAAuc,EACzc,IAAI,EAAC,cAAc,GACnB,EACF,6DACE,CAAC,EAAC,oJAAoJ,EACtJ,IAAI,EAAC,cAAc,GACnB,EACF,6DACE,CAAC,EAAC,2aAA2a,EAC7a,IAAI,EAAC,cAAc,GACnB,CACA,EACJ,+DACE,iEAAU,EAAE,EAAC,gBAAgB,IAC3B,6DAAM,KAAK,EAAC,SAAS,EAAC,MAAM,EAAC,SAAS,EAAC,IAAI,EAAC,OAAO,EAAC,SAAS,EAAC,8BAA8B,GAAG,CACtF,CACN,CACH,EACN;KACH~~;;;;;;;;;;;;;;;;;;;;;;;~~","names":[],"sources":["src/common/icons/icon.css?tag=nylas-logo&encapsulation=scoped","src/common/icons/nylas-logo.tsx"],"sourcesContent":[":host {\n display: flex;\n}\n","import { Component, Prop, h } from '@stencil/core';\n\n@Component({\n tag: 'nylas-logo',\n styleUrl: 'icon.css',\n scoped: true,\n})\nexport class NylasLogo {\n @Prop() width: string = '69';\n @Prop() height: string = '24';\n\n render() {\n return (\n <svg width={this.width} height={this.height} viewBox=\"0 0 69 20\" fill=\"none\" xmlns=\"http://www.w3.org/2000/svg\">\n <g clip-path=\"url(#clip0_455_3543)\">\n <path\n d=\"M15.8092 3.03248C14.6497 1.86996 13.1076 1.23047 11.4646 1.23047C9.82156 1.23047 8.27753 1.86996 7.11999 3.03248L0.835347 9.33381C0.686846 9.4827 0.60498 9.68123 0.60498 9.89312C0.60498 10.105 0.686846 10.3035 0.835347 10.4524C0.983848 10.6013 1.18185 10.6834 1.39318 10.6834C1.60451 10.6834 1.80251 10.6013 1.95101 10.4524L8.23374 4.15111C10.0139 2.36627 12.9134 2.36627 14.6935 4.15111C16.4736 5.93785 16.4756 8.84322 14.6935 10.6281L8.4108 16.9275C8.10428 17.2348 8.10428 17.7368 8.4108 18.0461C8.5593 18.195 8.75731 18.2771 8.96863 18.2771C9.17996 18.2771 9.37796 18.195 9.52646 18.0461L15.8092 11.7467C16.9687 10.5841 17.6064 9.03793 17.6064 7.39053C17.6064 5.74314 16.9687 4.19501 15.8092 3.03439V3.03248Z\"\n fill=\"currentColor\"\n />\n <path\n d=\"M14.9296 7.39038C14.9296 6.46074 14.5698 5.58837 13.9148 4.93361C12.5631 3.57828 10.3641 3.57828 9.01239 4.93361L0.663961 13.3023C0.51546 13.4512 0.433594 13.6497 0.433594 13.8616C0.433594 14.0735 0.51546 14.272 0.663961 14.4209C0.812462 14.5698 1.01046 14.6519 1.22179 14.6519C1.43312 14.6519 1.63112 14.5698 1.77962 14.4209L10.0367 6.1515L10.05 6.13623C10.0747 6.10759 10.1014 6.07705 10.128 6.05033C10.1585 6.01978 10.1928 5.99115 10.2251 5.96252L10.2442 5.94534C10.9886 5.31349 12.1119 5.3593 12.8011 6.05033C13.4903 6.74135 13.536 7.78171 12.9705 8.53192L12.9648 8.53955C12.9058 8.61591 12.8544 8.67699 12.8011 8.73044C12.7497 8.78198 12.6906 8.83352 12.6069 8.90033L4.45264 17.0991C4.30414 17.248 4.22227 17.4465 4.22227 17.6584C4.22227 17.8703 4.30414 18.0689 4.45264 18.2177C4.60114 18.3666 4.79914 18.4487 5.01047 18.4487C5.2218 18.4487 5.4198 18.3666 5.5683 18.2177L13.9167 9.84716C14.5698 9.1924 14.9315 8.31812 14.9315 7.39038H14.9296Z\"\n fill=\"currentColor\"\n />\n <path\n d=\"M10.6821 9.11238C10.4727 9.01694 10.2861 8.88904 10.1281 8.7306C9.97008 8.57216 9.84252 8.38508 9.74733 8.1751L9.69021 8.05103L0.467916 17.2978C0.287049 17.4792 0.174721 17.7082 0.149971 17.9411C0.125221 18.1778 0.19376 18.3897 0.344165 18.5405C0.471724 18.6684 0.65259 18.739 0.850592 18.739C1.11142 18.739 1.37796 18.6207 1.58358 18.4145L10.8059 9.16774L10.6821 9.11047V9.11238Z\"\n fill=\"currentColor\"\n />\n <path\n d=\"M68.401 10.6185C68.2126 10.2692 67.9593 9.97334 67.6433 9.73854C67.3235 9.49993 66.956 9.31094 66.5486 9.17541C66.1316 9.03606 65.7033 8.91771 65.2749 8.81844C64.7951 8.70582 64.3039 8.57983 63.8165 8.44811C63.3196 8.31258 62.9065 8.14269 62.5905 7.94225C62.4743 7.88689 62.3391 7.76663 62.3391 7.50129C62.3391 7.39821 62.3639 7.29704 62.4153 7.19587L62.4248 7.18059C62.5352 7.02216 62.7142 6.8828 62.975 6.75109C63.234 6.62128 63.609 6.55829 64.1231 6.55829C64.5286 6.55829 64.877 6.61365 65.1569 6.72436C65.4348 6.83508 65.6652 6.96871 65.8442 7.12524C66.0212 7.27986 66.1659 7.45357 66.2782 7.63873C66.3563 7.76854 66.4267 7.89262 66.4858 8.00525L68.2754 6.84081C68.1669 6.59456 68.0146 6.33495 67.8204 6.0677C67.6033 5.768 67.3254 5.4893 66.9922 5.23732C66.659 4.98534 66.2516 4.77345 65.7813 4.60929C65.3111 4.44512 64.7532 4.36304 64.1231 4.36304C63.3844 4.36304 62.7599 4.46421 62.2706 4.66083C61.7813 4.85935 61.3815 5.09988 61.0845 5.37667C60.7875 5.65346 60.5628 5.95125 60.4143 6.2605C60.2639 6.57547 60.1611 6.85799 60.1078 7.10233C60.0945 7.18059 60.0812 7.27031 60.0678 7.36767C60.0545 7.4593 60.0469 7.5452 60.0469 7.62537C60.0469 8.13314 60.1745 8.56074 60.4239 8.89671C60.679 9.24222 61.0045 9.53429 61.391 9.76336C61.7813 9.99624 62.2116 10.1852 62.6704 10.3227C63.1388 10.462 63.5862 10.5823 64.0012 10.6796C64.4067 10.777 64.7932 10.8782 65.1531 10.9774C65.5224 11.0786 65.8289 11.2122 66.0631 11.3745C66.2801 11.5425 66.3887 11.7448 66.3887 11.9777C66.3887 12.2278 66.2916 12.4263 66.0993 12.5695C65.9279 12.6954 65.7261 12.7985 65.4958 12.8711C65.273 12.9436 65.0407 12.9913 64.8066 13.0142C64.58 13.0352 64.3915 13.0467 64.2468 13.0467C63.8032 13.0467 63.4224 13.0028 63.1197 12.915C62.8151 12.8272 62.5638 12.7241 62.3734 12.6057C62.1811 12.4874 62.0288 12.3614 61.9222 12.2316C61.8213 12.1094 61.747 12.0082 61.7014 11.9319L61.4957 11.6303L59.708 12.7928C59.8508 13.0161 60.0298 13.2643 60.2392 13.5296C60.4772 13.8293 60.7837 14.1138 61.153 14.3734C61.5224 14.633 61.966 14.8525 62.4724 15.0243C62.9788 15.1961 63.5748 15.282 64.2468 15.282C64.797 15.282 65.2901 15.2324 65.7166 15.137C66.1412 15.0396 66.5162 14.9117 66.8285 14.7552C67.1388 14.6005 67.4015 14.4192 67.6109 14.2149C67.8223 14.0107 67.9974 13.8026 68.1326 13.6003C68.4563 13.1135 68.6409 12.5504 68.6828 11.9262C68.6828 11.4069 68.5876 10.9641 68.401 10.6166V10.6185Z\"\n fill=\"currentColor\"\n />\n <path\n d=\"M26.3585 4.27905C23.7901 4.27905 21.6997 6.37504 21.6997 8.95017V15.0701H23.9291V8.95017C23.9291 7.6082 25.0181 6.5163 26.3565 6.5163C27.695 6.5163 28.784 7.6082 28.784 8.95017V15.0701H31.0134V8.95017C31.0134 6.37504 28.9229 4.27905 26.3546 4.27905H26.3585Z\"\n fill=\"currentColor\"\n />\n <path\n d=\"M53.4522 4.27905C50.4251 4.27905 47.9634 6.74728 47.9634 9.78245C47.9634 12.8176 50.427 15.2859 53.4522 15.2859C54.5545 15.2859 55.6188 14.9594 56.5288 14.3409L56.7116 14.2169V15.0682H58.941V9.78245C58.941 6.74728 56.4793 4.27905 53.4522 4.27905ZM53.4522 13.0505C51.655 13.0505 50.1928 11.5845 50.1928 9.78245C50.1928 7.98044 51.655 6.51439 53.4522 6.51439C55.2494 6.51439 56.7116 7.98044 56.7116 9.78245C56.7116 11.5845 55.2494 13.0505 53.4522 13.0505Z\"\n fill=\"currentColor\"\n />\n <path\n d=\"M45.5795 10.6166V0.356201H43.3501V10.6166C43.3501 13.1517 45.3758 15.2228 47.8908 15.2858V13.0486C46.6057 12.9875 45.5795 11.9204 45.5795 10.6166Z\"\n fill=\"currentColor\"\n />\n <path\n d=\"M39.5428 4.4967V10.63C39.5428 11.6761 38.8669 12.621 37.9016 12.9284C37.1249 13.1746 36.3157 13.0486 35.6817 12.5829C35.0592 12.1247 34.6879 11.3917 34.6879 10.6186V4.4967H32.4585V10.5995C32.4585 12.7165 33.8388 14.57 35.8131 15.1084C37.0354 15.4424 38.2995 15.2973 39.3695 14.7037L39.5428 14.6063V14.9747C39.5428 16.2766 38.5166 17.3437 37.2315 17.4067V19.6439C39.7465 19.5809 41.7722 17.5117 41.7722 14.9747V4.4967H39.5428Z\"\n fill=\"currentColor\"\n />\n </g>\n <defs>\n <clipPath id=\"clip0_455_3543\">\n <rect width=\"68.7123\" height=\"19.2877\" fill=\"white\" transform=\"translate(0.144043 0.356201)\" />\n </clipPath>\n </defs>\n </svg>\n );\n }\n}\n"],"version":3}
1	+ {"file":"nylas-logo2.js","mappings":";;AAAA,MAAM,OAAO,GAAG,gCAAgC;;MCOnC,SAAS;;;;qBACI,IAAI;sBACH,IAAI;;IAE7B,MAAM;QACJ,QACE,4DAAK,KAAK,EAAE,IAAI,CAAC,KAAK,EAAE,MAAM,EAAE,IAAI,CAAC,MAAM,EAAE,OAAO,EAAC,WAAW,EAAC,IAAI,EAAC,MAAM,EAAC,KAAK,EAAC,4BAA4B,IAC7G,uEAAa,sBAAsB,IACjC,6DACE,CAAC,EAAC,ysBAAysB,EAC3sB,IAAI,EAAC,cAAc,GACnB,EACF,6DACE,CAAC,EAAC,q7BAAq7B,EACv7B,IAAI,EAAC,cAAc,GACnB,EACF,6DACE,CAAC,EAAC,8XAA8X,EAChY,IAAI,EAAC,cAAc,GACnB,EACF,6DACE,CAAC,EAAC,yzEAAyzE,EAC3zE,IAAI,EAAC,cAAc,GACnB,EACF,6DACE,CAAC,EAAC,mQAAmQ,EACrQ,IAAI,EAAC,cAAc,GACnB,EACF,6DACE,CAAC,EAAC,ucAAuc,EACzc,IAAI,EAAC,cAAc,GACnB,EACF,6DACE,CAAC,EAAC,oJAAoJ,EACtJ,IAAI,EAAC,cAAc,GACnB,EACF,6DACE,CAAC,EAAC,2aAA2a,EAC7a,IAAI,EAAC,cAAc,GACnB,CACA,EACJ,+DACE,iEAAU,EAAE,EAAC,gBAAgB,IAC3B,6DAAM,KAAK,EAAC,SAAS,EAAC,MAAM,EAAC,SAAS,EAAC,IAAI,EAAC,OAAO,EAAC,SAAS,EAAC,8BAA8B,GAAG,CACtF,CACN,CACH,EACN;KACH;;;;;;;;;;;;;;;;;;;;;;","names":[],"sources":["src/common/icons/icon.css?tag=nylas-logo&encapsulation=scoped","src/common/icons/nylas-logo.tsx"],"sourcesContent":[":host {\n display: flex;\n}\n","import { Component, Prop, h } from '@stencil/core';\n\n@Component({\n tag: 'nylas-logo',\n styleUrl: 'icon.css',\n scoped: true,\n})\nexport class NylasLogo {\n @Prop() width: string = '69';\n @Prop() height: string = '24';\n\n render() {\n return (\n <svg width={this.width} height={this.height} viewBox=\"0 0 69 20\" fill=\"none\" xmlns=\"http://www.w3.org/2000/svg\">\n <g clip-path=\"url(#clip0_455_3543)\">\n <path\n d=\"M15.8092 3.03248C14.6497 1.86996 13.1076 1.23047 11.4646 1.23047C9.82156 1.23047 8.27753 1.86996 7.11999 3.03248L0.835347 9.33381C0.686846 9.4827 0.60498 9.68123 0.60498 9.89312C0.60498 10.105 0.686846 10.3035 0.835347 10.4524C0.983848 10.6013 1.18185 10.6834 1.39318 10.6834C1.60451 10.6834 1.80251 10.6013 1.95101 10.4524L8.23374 4.15111C10.0139 2.36627 12.9134 2.36627 14.6935 4.15111C16.4736 5.93785 16.4756 8.84322 14.6935 10.6281L8.4108 16.9275C8.10428 17.2348 8.10428 17.7368 8.4108 18.0461C8.5593 18.195 8.75731 18.2771 8.96863 18.2771C9.17996 18.2771 9.37796 18.195 9.52646 18.0461L15.8092 11.7467C16.9687 10.5841 17.6064 9.03793 17.6064 7.39053C17.6064 5.74314 16.9687 4.19501 15.8092 3.03439V3.03248Z\"\n fill=\"currentColor\"\n />\n <path\n d=\"M14.9296 7.39038C14.9296 6.46074 14.5698 5.58837 13.9148 4.93361C12.5631 3.57828 10.3641 3.57828 9.01239 4.93361L0.663961 13.3023C0.51546 13.4512 0.433594 13.6497 0.433594 13.8616C0.433594 14.0735 0.51546 14.272 0.663961 14.4209C0.812462 14.5698 1.01046 14.6519 1.22179 14.6519C1.43312 14.6519 1.63112 14.5698 1.77962 14.4209L10.0367 6.1515L10.05 6.13623C10.0747 6.10759 10.1014 6.07705 10.128 6.05033C10.1585 6.01978 10.1928 5.99115 10.2251 5.96252L10.2442 5.94534C10.9886 5.31349 12.1119 5.3593 12.8011 6.05033C13.4903 6.74135 13.536 7.78171 12.9705 8.53192L12.9648 8.53955C12.9058 8.61591 12.8544 8.67699 12.8011 8.73044C12.7497 8.78198 12.6906 8.83352 12.6069 8.90033L4.45264 17.0991C4.30414 17.248 4.22227 17.4465 4.22227 17.6584C4.22227 17.8703 4.30414 18.0689 4.45264 18.2177C4.60114 18.3666 4.79914 18.4487 5.01047 18.4487C5.2218 18.4487 5.4198 18.3666 5.5683 18.2177L13.9167 9.84716C14.5698 9.1924 14.9315 8.31812 14.9315 7.39038H14.9296Z\"\n fill=\"currentColor\"\n />\n <path\n d=\"M10.6821 9.11238C10.4727 9.01694 10.2861 8.88904 10.1281 8.7306C9.97008 8.57216 9.84252 8.38508 9.74733 8.1751L9.69021 8.05103L0.467916 17.2978C0.287049 17.4792 0.174721 17.7082 0.149971 17.9411C0.125221 18.1778 0.19376 18.3897 0.344165 18.5405C0.471724 18.6684 0.65259 18.739 0.850592 18.739C1.11142 18.739 1.37796 18.6207 1.58358 18.4145L10.8059 9.16774L10.6821 9.11047V9.11238Z\"\n fill=\"currentColor\"\n />\n <path\n d=\"M68.401 10.6185C68.2126 10.2692 67.9593 9.97334 67.6433 9.73854C67.3235 9.49993 66.956 9.31094 66.5486 9.17541C66.1316 9.03606 65.7033 8.91771 65.2749 8.81844C64.7951 8.70582 64.3039 8.57983 63.8165 8.44811C63.3196 8.31258 62.9065 8.14269 62.5905 7.94225C62.4743 7.88689 62.3391 7.76663 62.3391 7.50129C62.3391 7.39821 62.3639 7.29704 62.4153 7.19587L62.4248 7.18059C62.5352 7.02216 62.7142 6.8828 62.975 6.75109C63.234 6.62128 63.609 6.55829 64.1231 6.55829C64.5286 6.55829 64.877 6.61365 65.1569 6.72436C65.4348 6.83508 65.6652 6.96871 65.8442 7.12524C66.0212 7.27986 66.1659 7.45357 66.2782 7.63873C66.3563 7.76854 66.4267 7.89262 66.4858 8.00525L68.2754 6.84081C68.1669 6.59456 68.0146 6.33495 67.8204 6.0677C67.6033 5.768 67.3254 5.4893 66.9922 5.23732C66.659 4.98534 66.2516 4.77345 65.7813 4.60929C65.3111 4.44512 64.7532 4.36304 64.1231 4.36304C63.3844 4.36304 62.7599 4.46421 62.2706 4.66083C61.7813 4.85935 61.3815 5.09988 61.0845 5.37667C60.7875 5.65346 60.5628 5.95125 60.4143 6.2605C60.2639 6.57547 60.1611 6.85799 60.1078 7.10233C60.0945 7.18059 60.0812 7.27031 60.0678 7.36767C60.0545 7.4593 60.0469 7.5452 60.0469 7.62537C60.0469 8.13314 60.1745 8.56074 60.4239 8.89671C60.679 9.24222 61.0045 9.53429 61.391 9.76336C61.7813 9.99624 62.2116 10.1852 62.6704 10.3227C63.1388 10.462 63.5862 10.5823 64.0012 10.6796C64.4067 10.777 64.7932 10.8782 65.1531 10.9774C65.5224 11.0786 65.8289 11.2122 66.0631 11.3745C66.2801 11.5425 66.3887 11.7448 66.3887 11.9777C66.3887 12.2278 66.2916 12.4263 66.0993 12.5695C65.9279 12.6954 65.7261 12.7985 65.4958 12.8711C65.273 12.9436 65.0407 12.9913 64.8066 13.0142C64.58 13.0352 64.3915 13.0467 64.2468 13.0467C63.8032 13.0467 63.4224 13.0028 63.1197 12.915C62.8151 12.8272 62.5638 12.7241 62.3734 12.6057C62.1811 12.4874 62.0288 12.3614 61.9222 12.2316C61.8213 12.1094 61.747 12.0082 61.7014 11.9319L61.4957 11.6303L59.708 12.7928C59.8508 13.0161 60.0298 13.2643 60.2392 13.5296C60.4772 13.8293 60.7837 14.1138 61.153 14.3734C61.5224 14.633 61.966 14.8525 62.4724 15.0243C62.9788 15.1961 63.5748 15.282 64.2468 15.282C64.797 15.282 65.2901 15.2324 65.7166 15.137C66.1412 15.0396 66.5162 14.9117 66.8285 14.7552C67.1388 14.6005 67.4015 14.4192 67.6109 14.2149C67.8223 14.0107 67.9974 13.8026 68.1326 13.6003C68.4563 13.1135 68.6409 12.5504 68.6828 11.9262C68.6828 11.4069 68.5876 10.9641 68.401 10.6166V10.6185Z\"\n fill=\"currentColor\"\n />\n <path\n d=\"M26.3585 4.27905C23.7901 4.27905 21.6997 6.37504 21.6997 8.95017V15.0701H23.9291V8.95017C23.9291 7.6082 25.0181 6.5163 26.3565 6.5163C27.695 6.5163 28.784 7.6082 28.784 8.95017V15.0701H31.0134V8.95017C31.0134 6.37504 28.9229 4.27905 26.3546 4.27905H26.3585Z\"\n fill=\"currentColor\"\n />\n <path\n d=\"M53.4522 4.27905C50.4251 4.27905 47.9634 6.74728 47.9634 9.78245C47.9634 12.8176 50.427 15.2859 53.4522 15.2859C54.5545 15.2859 55.6188 14.9594 56.5288 14.3409L56.7116 14.2169V15.0682H58.941V9.78245C58.941 6.74728 56.4793 4.27905 53.4522 4.27905ZM53.4522 13.0505C51.655 13.0505 50.1928 11.5845 50.1928 9.78245C50.1928 7.98044 51.655 6.51439 53.4522 6.51439C55.2494 6.51439 56.7116 7.98044 56.7116 9.78245C56.7116 11.5845 55.2494 13.0505 53.4522 13.0505Z\"\n fill=\"currentColor\"\n />\n <path\n d=\"M45.5795 10.6166V0.356201H43.3501V10.6166C43.3501 13.1517 45.3758 15.2228 47.8908 15.2858V13.0486C46.6057 12.9875 45.5795 11.9204 45.5795 10.6166Z\"\n fill=\"currentColor\"\n />\n <path\n d=\"M39.5428 4.4967V10.63C39.5428 11.6761 38.8669 12.621 37.9016 12.9284C37.1249 13.1746 36.3157 13.0486 35.6817 12.5829C35.0592 12.1247 34.6879 11.3917 34.6879 10.6186V4.4967H32.4585V10.5995C32.4585 12.7165 33.8388 14.57 35.8131 15.1084C37.0354 15.4424 38.2995 15.2973 39.3695 14.7037L39.5428 14.6063V14.9747C39.5428 16.2766 38.5166 17.3437 37.2315 17.4067V19.6439C39.7465 19.5809 41.7722 17.5117 41.7722 14.9747V4.4967H39.5428Z\"\n fill=\"currentColor\"\n />\n </g>\n <defs>\n <clipPath id=\"clip0_455_3543\">\n <rect width=\"68.7123\" height=\"19.2877\" fill=\"white\" transform=\"translate(0.144043 0.356201)\" />\n </clipPath>\n </defs>\n </svg>\n );\n }\n}\n"],"version":3}

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

@@ -1,6 +1,6 @@
 import { proxyCustomElement, HTMLElement, createEvent, h, Host } from '@stencil/core/internal/client';
 import { R as RegisterComponent } from './register-component.js';
-import { d as debug } from './utils.js';
+import { a as debug } from './utils.js';
 import { d as defineCustomElement$3 } from './chevron.js';
 import { d as defineCustomElement$2 } from './refresh.js';
@@ -165,7 +165,6 @@ function defineCustomElement$1() {
             break;
     } });
 }
-defineCustomElement$1(NylasMailboxPagination$1);
 const NylasMailboxPagination = NylasMailboxPagination$1;
 const defineCustomElement = defineCustomElement$1;

package/dist/components/nylas-mailbox-pagination.js.map CHANGED Viewed

	@@ -1 +1 @@
1	- {"file":"nylas-mailbox-pagination.js","mappings":"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","names":["NylasMailboxPagination"],"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"],"version":3}
1	+ {"file":"nylas-mailbox-pagination.js","mappings":"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","names":["NylasMailboxPagination"],"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"],"version":3}

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

@@ -1,6 +1,6 @@
 import { proxyCustomElement, HTMLElement, h, Host } from '@stencil/core/internal/client';
 import { R as RegisterComponent } from './register-component.js';
-import { d as debug } from './utils.js';
+import { a as debug } from './utils.js';
 const nylasMailboxToolbarButtonCss = ":host{display:block}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}";
@@ -76,7 +76,7 @@ const NylasMailboxToolbarButton$1 = proxyCustomElement(class NylasMailboxToolbar
             state = this.dataState ? store.get(storeKey) === 'loading' : false;
         }
         const key = state ? `state-loading` : 'state-ready';
-        return (h(Host, { key: 'bc4a3e76b0b9ea32d5c640b6ef5944bc45edb2b1' }, h("sp-theme", { key: 'c52ad12f24b96ca8ee1da8f026db2441ae87d40e', scale: "medium", color: "dark" }, h("sp-button", { onClick: this.onClick, disabled: state, key: key, "icon-only": this.iconOnly, label: this.renderByState(state) }, this.hasSlot('icon') && (h("div", { slot: "icon", class: 'slot' }, h("slot", { name: "icon" }))), !this.iconOnly && this.renderByState(state)))));
+        return (h(Host, { key: '2454ef2e4270d1642cabe57dacf53908fcdb34e6' }, h("sp-theme", { key: '97d71094fabc3466b87142dfdd1d0bb22659fd32', scale: "medium", color: "dark" }, h("sp-button", { onClick: this.onClick, disabled: state, key: key, "icon-only": this.iconOnly, label: this.renderByState(state) }, this.hasSlot('icon') && (h("div", { slot: "icon", class: 'slot' }, h("slot", { name: "icon" }))), !this.iconOnly && this.renderByState(state)))));
     }
     get host() { return this; }
     static get style() { return nylasMailboxToolbarButtonCss; }
@@ -109,7 +109,6 @@ function defineCustomElement$1() {
             break;
     } });
 }
-defineCustomElement$1(NylasMailboxToolbarButton$1);
 const NylasMailboxToolbarButton = NylasMailboxToolbarButton$1;
 const defineCustomElement = defineCustomElement$1;

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

	@@ -1 +1 @@
1	- {"file":"nylas-mailbox-toolbar-button.js","mappings":"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~~;;;;;;;;;;;;;;;;;;;;;~~","names":["NylasMailboxToolbarButton"],"sources":["src/components/mailbox/nylas-mailbox-toolbar-button/nylas-mailbox-toolbar-button.scss?tag=nylas-mailbox-toolbar-button&encapsulation=shadow","src/components/mailbox/nylas-mailbox-toolbar-button/nylas-mailbox-toolbar-button.tsx"],"sourcesContent":[":host {\n display: block;\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","import { RegisterComponent } from '@/common/register-component';\nimport { MethodKeys } from '@/common/types';\nimport { NylasMailboxConnectorInterface } from '@/connector/connector-interface';\nimport { debug } from '@/utils/utils';\nimport { Component, Element, Host, Prop, h } from '@stencil/core';\nimport { ObservableMap } from '@stencil/store';\n\nexport type Stores = Record<string, ObservableMap<any>>;\nexport type PublicMethodsOfNylasMailboxConnector = Pick<NylasMailboxConnectorInterface, MethodKeys<NylasMailboxConnectorInterface>>;\nexport type PropertyPaths<T> = T extends object\n ? {\n [K in keyof T]: T[K] extends Function ? `${K & string}` : `${K & string}.${PropertyPaths<T[K]>}`;\n }[keyof T]\n : '';\nexport type MethodsOfNylasMailboxConnector = PropertyPaths<NylasMailboxConnectorInterface>;\n\n@Component({\n tag: 'nylas-mailbox-toolbar-button',\n styleUrl: 'nylas-mailbox-toolbar-button.scss',\n shadow: true,\n})\nexport class NylasMailboxToolbarButton {\n @Element() private host!: HTMLNylasMailboxToolbarButtonElement;\n\n /*\n The name of the mailbox connector method to call.\n /\n @Prop({ attribute: 'method' }) readonly method!: MethodsOfNylasMailboxConnector;\n\n /\n The value of the state to compare against to check if the data is loading, error, or ready.\n /\n @Prop({ attribute: 'data-state' }) readonly dataState?: string;\n\n /\n If true, then the component will render the icon only.\n /\n @Prop() readonly iconOnly: boolean = false;\n\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 mailboxConnector?: NylasMailboxConnectorInterface;\n\n constructor() {}\n\n connectedCallback() {}\n\n disconnectedCallback() {}\n\n async componentWillLoad() {\n debug(`[nylas-if-state] Component will load`);\n }\n\n async componentDidLoad() {\n debug(`[nylas-if-state] Component did load`);\n }\n\n /\n The click handler for the button.\n /\n private onClick = async () => {\n const method = this.method as unknown as string;\n debug(`[nylas-mailbox-toolbar-button] onClick`, { method, mailboxConnector: this.mailboxConnector });\n if (this.mailboxConnector && method) {\n const methodToCall = this.callMethod(this.mailboxConnector, method);\n if (methodToCall) {\n await methodToCall();\n }\n }\n };\n\n /\n Traverses the object to find the method.\n * @param obj The object to traverse.\n * @param accessString The string to access the method.\n * @returns The method if it exists, undefined otherwise.\n /\n private callMethod(obj: any, accessString: string): (() => void) \| undefined {\n // Split the string into parts\n const parts = accessString.split('.');\n\n // Traverse the object to find the method\n let current = obj;\n for (const part of parts.slice(0, -1)) {\n current = current[part];\n if (!current) {\n return undefined;\n }\n }\n\n // Get the method\n const methodName = parts[parts.length - 1];\n const method = current[methodName];\n\n // Check if the method is a function\n if (typeof method === 'function') {\n return method.bind(current);\n }\n\n return undefined;\n }\n\n /\n Renders the slot based on the state.\n * @param state The state of the data.\n /\n private renderByState(state: boolean) {\n return state ? <slot name=\"loading\">Loading...</slot> : <slot>Click</slot>;\n }\n\n /\n Checks if the slot exists.\n * @param name The name of the slot.\n * @returns True if the slot exists, false otherwise.\n */\n private hasSlot(name: string) {\n return !!this.host.querySelector(`[slot=\"${name}\"]`);\n }\n\n @RegisterComponent({\n name: 'nylas-mailbox-toolbar-button',\n connectorToProp: 'mailboxConnector',\n fireRegisterEvent: true,\n })\n render() {\n let state = false;\n const store = this.mailboxConnector?.nylasMailboxStore;\n if (typeof store !== 'undefined') {\n const storeKey = String(this.dataState) as keyof typeof store.state;\n state = this.dataState ? store.get(storeKey) === 'loading' : false;\n }\n const key = state ? `state-loading` : 'state-ready';\n return (\n <Host>\n <sp-theme scale=\"medium\" color=\"dark\">\n <sp-button onClick={this.onClick} disabled={state} key={key} icon-only={this.iconOnly} label={this.renderByState(state)}>\n {this.hasSlot('icon') && (\n <div slot=\"icon\" class={'slot'}>\n <slot name=\"icon\" />\n </div>\n )}\n {!this.iconOnly && this.renderByState(state)}\n </sp-button>\n </sp-theme>\n </Host>\n );\n }\n}\n"],"version":3}
1	+ {"file":"nylas-mailbox-toolbar-button.js","mappings":"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","names":["NylasMailboxToolbarButton"],"sources":["src/components/mailbox/nylas-mailbox-toolbar-button/nylas-mailbox-toolbar-button.scss?tag=nylas-mailbox-toolbar-button&encapsulation=shadow","src/components/mailbox/nylas-mailbox-toolbar-button/nylas-mailbox-toolbar-button.tsx"],"sourcesContent":[":host {\n display: block;\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","import { RegisterComponent } from '@/common/register-component';\nimport { MethodKeys } from '@/common/types';\nimport { NylasMailboxConnectorInterface } from '@/connector/connector-interface';\nimport { debug } from '@/utils/utils';\nimport { Component, Element, Host, Prop, h } from '@stencil/core';\nimport { ObservableMap } from '@stencil/store';\n\nexport type Stores = Record<string, ObservableMap<any>>;\nexport type PublicMethodsOfNylasMailboxConnector = Pick<NylasMailboxConnectorInterface, MethodKeys<NylasMailboxConnectorInterface>>;\nexport type PropertyPaths<T> = T extends object\n ? {\n [K in keyof T]: T[K] extends Function ? `${K & string}` : `${K & string}.${PropertyPaths<T[K]>}`;\n }[keyof T]\n : '';\nexport type MethodsOfNylasMailboxConnector = PropertyPaths<NylasMailboxConnectorInterface>;\n\n@Component({\n tag: 'nylas-mailbox-toolbar-button',\n styleUrl: 'nylas-mailbox-toolbar-button.scss',\n shadow: true,\n})\nexport class NylasMailboxToolbarButton {\n @Element() private host!: HTMLNylasMailboxToolbarButtonElement;\n\n /*\n The name of the mailbox connector method to call.\n /\n @Prop({ attribute: 'method' }) readonly method!: MethodsOfNylasMailboxConnector;\n\n /\n The value of the state to compare against to check if the data is loading, error, or ready.\n /\n @Prop({ attribute: 'data-state' }) readonly dataState?: string;\n\n /\n If true, then the component will render the icon only.\n /\n @Prop() readonly iconOnly: boolean = false;\n\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 mailboxConnector?: NylasMailboxConnectorInterface;\n\n constructor() {}\n\n connectedCallback() {}\n\n disconnectedCallback() {}\n\n async componentWillLoad() {\n debug(`[nylas-if-state] Component will load`);\n }\n\n async componentDidLoad() {\n debug(`[nylas-if-state] Component did load`);\n }\n\n /\n The click handler for the button.\n /\n private onClick = async () => {\n const method = this.method as unknown as string;\n debug(`[nylas-mailbox-toolbar-button] onClick`, { method, mailboxConnector: this.mailboxConnector });\n if (this.mailboxConnector && method) {\n const methodToCall = this.callMethod(this.mailboxConnector, method);\n if (methodToCall) {\n await methodToCall();\n }\n }\n };\n\n /\n Traverses the object to find the method.\n * @param obj The object to traverse.\n * @param accessString The string to access the method.\n * @returns The method if it exists, undefined otherwise.\n /\n private callMethod(obj: any, accessString: string): (() => void) \| undefined {\n // Split the string into parts\n const parts = accessString.split('.');\n\n // Traverse the object to find the method\n let current = obj;\n for (const part of parts.slice(0, -1)) {\n current = current[part];\n if (!current) {\n return undefined;\n }\n }\n\n // Get the method\n const methodName = parts[parts.length - 1];\n const method = current[methodName];\n\n // Check if the method is a function\n if (typeof method === 'function') {\n return method.bind(current);\n }\n\n return undefined;\n }\n\n /\n Renders the slot based on the state.\n * @param state The state of the data.\n /\n private renderByState(state: boolean) {\n return state ? <slot name=\"loading\">Loading...</slot> : <slot>Click</slot>;\n }\n\n /\n Checks if the slot exists.\n * @param name The name of the slot.\n * @returns True if the slot exists, false otherwise.\n */\n private hasSlot(name: string) {\n return !!this.host.querySelector(`[slot=\"${name}\"]`);\n }\n\n @RegisterComponent({\n name: 'nylas-mailbox-toolbar-button',\n connectorToProp: 'mailboxConnector',\n fireRegisterEvent: true,\n })\n render() {\n let state = false;\n const store = this.mailboxConnector?.nylasMailboxStore;\n if (typeof store !== 'undefined') {\n const storeKey = String(this.dataState) as keyof typeof store.state;\n state = this.dataState ? store.get(storeKey) === 'loading' : false;\n }\n const key = state ? `state-loading` : 'state-ready';\n return (\n <Host>\n <sp-theme scale=\"medium\" color=\"dark\">\n <sp-button onClick={this.onClick} disabled={state} key={key} icon-only={this.iconOnly} label={this.renderByState(state)}>\n {this.hasSlot('icon') && (\n <div slot=\"icon\" class={'slot'}>\n <slot name=\"icon\" />\n </div>\n )}\n {!this.iconOnly && this.renderByState(state)}\n </sp-button>\n </sp-theme>\n </Host>\n );\n }\n}\n"],"version":3}

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

@@ -1,6 +1,6 @@
 import { proxyCustomElement, HTMLElement, createEvent, h, Host } from '@stencil/core/internal/client';
 import { N as NylasBaseProvider, e as es } from './index.es.js';
-import { d as debug } from './utils.js';
+import { a as debug } from './utils.js';
 import { N as NylasAuthConnector, a as NylasThreadsConnector, b as NylasMessagesConnector, c as NylasFoldersConnector, C as CreateNylasAuthStore, d as CreateNylasMailboxStore, H as HashRouter } from './mailbox-store.js';
 class NylasMailboxConnector {
@@ -181,7 +181,7 @@ const NylasMailbox$1 = proxyCustomElement(class NylasMailbox extends HTMLElement
         return this.nylasMailboxConnector;
     }
     render() {
-        return (h(Host, { key: 'c60eb0c2f7929884b9ac702c50451ab6e09a2b6c' }, h("slot", { key: '7c5e0f6dfb81b7e3e4dd67a700b78e1143e2bf53' })));
+        return (h(Host, { key: '662c4d3f763c5cf9db31c4d2ba26bcdf47ead164' }, h("slot", { key: '5c2b75a569779dd2af6388648a4304721e82ba76' })));
     }
     get host() { return this; }
     static get style() { return nylasMailboxCss; }
@@ -209,7 +209,6 @@ function defineCustomElement$1() {
             break;
     } });
 }
-defineCustomElement$1(NylasMailbox$1);
 const NylasMailbox = NylasMailbox$1;
 const defineCustomElement = defineCustomElement$1;

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

	@@ -1 +1 @@
1	- {"file":"nylas-mailbox.js","mappings":"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","names":["NylasMailbox","NylasAuth"],"sources":["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":["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 { AuthConfig, 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?: AuthConfig;\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"],"version":3}
1	+ {"file":"nylas-mailbox.js","mappings":"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","names":["NylasMailbox","NylasAuth"],"sources":["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":["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 { AuthConfig, 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?: AuthConfig;\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"],"version":3}

package/dist/components/nylas-min-cancellation-notice2.js CHANGED Viewed

@@ -1,6 +1,6 @@
 import { proxyCustomElement, HTMLElement, createEvent, h, Host } from '@stencil/core/internal/client';
 import { R as RegisterComponent } from './register-component.js';
-import { d as debug } from './utils.js';
+import { a as debug } from './utils.js';
 import { d as defineCustomElement$6 } from './chevron.js';
 import { d as defineCustomElement$5 } from './info.js';
 import { d as defineCustomElement$4 } from './search.js';
@@ -31,6 +31,7 @@ const NylasMinCancellationNotice = proxyCustomElement(class NylasMinCancellation
         this.__attachShadow();
         this.valueChanged = createEvent(this, "valueChanged", 7);
         this.internals = this.attachInternals();
+        this.selectedConfiguration = undefined;
         this.minCancellationNotice = undefined;
         this.name = 'min-cancellation-notice';
         this.selectedNumber = 1;
@@ -40,10 +41,14 @@ const NylasMinCancellationNotice = proxyCustomElement(class NylasMinCancellation
         debug('nylas-min-cancellation-notice', 'elementNameChangedHandler', newValue);
         this.host.setAttribute('name', newValue);
     }
+    selectedConfigurationChangedHandler(newVal) {
+        const minCancellationNotice = newVal?.scheduler?.min_cancellation_notice;
+        if (minCancellationNotice) {
+            this.updateNumberAndPeriodFromMinutes(minCancellationNotice);
+        }
+    }
     availableDaysInFutureChanged(newValue) {
-        const { number, period } = this.calculateNumberAndPeriodFromMinutes(newValue);
-        this.selectedNumber = number;
-        this.selectedPeriod = period;
+        this.updateNumberAndPeriodFromMinutes(newValue);
     }
     connectedCallback() {
         debug('nylas-min-cancellation-notice', 'connectedCallback');
@@ -88,55 +93,67 @@ const NylasMinCancellationNotice = proxyCustomElement(class NylasMinCancellation
         else {
             totalMinutes = 0;
         }
-        this.valueChanged.emit({ value: totalMinutes, name: this.name });
+        this.valueChanged.emit({ value: totalMinutes, name: 'minCancellationNotice' });
         if (typeof this.internals.setFormValue !== 'function') {
             return;
         }
         this.internals.setFormValue(totalMinutes.toString(), this.name);
     }
-    calculateNumberAndPeriodFromMinutes(minutes) {
+    updateNumberAndPeriodFromMinutes(minutes) {
         const minutesInHour = 60;
         const minutesInDay = minutesInHour * 24;
         const minutesInWeek = minutesInDay * 7;
         const minutesInMonth = minutesInDay * 30;
+        let number, period;
         if (minutes >= minutesInMonth) {
-            return { number: Math.floor(minutes / minutesInMonth), period: 'month' };
+            number = Math.floor(minutes / minutesInMonth);
+            period = 'month';
         }
         else if (minutes >= minutesInWeek) {
-            return { number: Math.floor(minutes / minutesInWeek), period: 'week' };
+            number = Math.floor(minutes / minutesInWeek);
+            period = 'week';
         }
         else if (minutes >= minutesInDay) {
-            return { number: Math.floor(minutes / minutesInDay), period: 'day' };
+            number = Math.floor(minutes / minutesInDay);
+            period = 'day';
         }
         else if (minutes >= minutesInHour) {
-            return { number: Math.floor(minutes / minutesInHour), period: 'hour' };
+            number = Math.floor(minutes / minutesInHour);
+            period = 'hour';
         }
         else {
-            return { number: minutes, period: 'minute' };
+            number = minutes;
+            period = 'minute';
         }
+        this.selectedNumber = number;
+        this.selectedPeriod = period;
     }
     render() {
-        return (h(Host, { key: '594c4e6ca9c565f486f5c09159de518fe586f7b8' }, h("div", { key: '712baa63d3ea867b5a7893a254954fcea49c80f0', class: "nylas-min-cancellation-notice", part: "nmcn" }, h("label", { key: '7256ab66b7908dc8b972b2987276e0d2d04dd0ee' }, "Minimum cancellation notice", h("span", { key: '515772bd9028f2718ad350acef7b293269e12279', class: "label-icon" }, h("tooltip-component", { key: '1fe93b6067d38d4d78fe0c16fbd21d67ea5db0fd' }, h("info-icon", { key: '2b1e4eb5c88b329441a98009d2e81fbe6c807ccd', slot: "tooltip-icon" }), h("span", { key: '44f83c20d9041f31bb4b58c190c5877cfcdd41b3', slot: "tooltip-content" }, "Set the minimum amount of time required to cancel an event.")))), h("time-period-selector", { key: '4b1725b8d90355b2481a37d8b894414ea5549cd8', id: "min-cancellation-notice", exportparts: "tps__number-dropdown: nmcn__number-dropdown, tps__number-dropdown-button: nmcn__number-dropdown-button, tps__number-dropdown-content: nmcn__number-dropdown-content, tps__period-dropdown: nmcn__period-dropdown, tps__period-dropdown-button: nmcn__period-dropdown-button, tps__period-dropdown-content: nmcn__period-dropdown-content", timePeriods: ['minute', 'hour', 'day', 'week'], defaultSelectedNumber: this.selectedNumber, defaultSelectedPeriod: this.selectedPeriod }))));
+        return (h(Host, { key: 'd2eb0d080d1ce4645a642a4f5d55270ed170e882' }, h("div", { key: '2743c3c781ad47c9d0d53fdad2773f45d172e1f4', class: "nylas-min-cancellation-notice", part: "nmcn" }, h("label", { key: '457729b50558651645ecb10398586af1078cfd34' }, "Minimum cancellation notice", h("span", { key: '00b310035def5b8bbc183fa03d2bcb37d7c04b42', class: "label-icon" }, h("tooltip-component", { key: '27c7695f6302e2d043899656f15a70846c2858e2' }, h("info-icon", { key: '10f878cb410cc284e86890a0d6047c27bdc7f455', slot: "tooltip-icon" }), h("span", { key: 'e853afaa116b43371d01fcb3b801e622902e22cd', slot: "tooltip-content" }, "Set the minimum amount of time required to cancel an event.")))), h("time-period-selector", { key: '8bb3955f8cce7661e213fbf2c107f8326937b467', id: "min-cancellation-notice", exportparts: "tps__number-dropdown: nmcn__number-dropdown, tps__number-dropdown-button: nmcn__number-dropdown-button, tps__number-dropdown-content: nmcn__number-dropdown-content, tps__period-dropdown: nmcn__period-dropdown, tps__period-dropdown-button: nmcn__period-dropdown-button, tps__period-dropdown-content: nmcn__period-dropdown-content", timePeriods: ['minute', 'hour', 'day', 'week'], defaultSelectedNumber: this.selectedNumber, defaultSelectedPeriod: this.selectedPeriod }))));
     }
     static get formAssociated() { return true; }
     get host() { return this; }
     static get watchers() { return {
         "name": ["elementNameChangedHandler"],
+        "selectedConfiguration": ["selectedConfigurationChangedHandler"],
         "availableDaysInFuture": ["availableDaysInFutureChanged"]
     }; }
     static get style() { return nylasMinCancellationNoticeCss; }
 }, [65, "nylas-min-cancellation-notice", {
+        "selectedConfiguration": [16],
         "minCancellationNotice": [2, "min-cancellation-notice"],
         "name": [1],
         "selectedNumber": [32],
         "selectedPeriod": [32]
     }, [[0, "timePeriodChanged", "timePeriodChangedHandler"]], {
         "name": ["elementNameChangedHandler"],
+        "selectedConfiguration": ["selectedConfigurationChangedHandler"],
         "availableDaysInFuture": ["availableDaysInFutureChanged"]
     }]);
 __decorate([
     RegisterComponent({
         name: 'nylas-min-cancellation-notice',
+        stateToProps: new Map([['schedulerConfig.selectedConfiguration', 'selectedConfiguration']]),
         eventToProps: {},
         fireRegisterEvent: true,
     }),
@@ -187,7 +204,6 @@ function defineCustomElement() {
             break;
     } });
 }
-defineCustomElement(NylasMinCancellationNotice);
 export { NylasMinCancellationNotice as N, defineCustomElement as d };

package/dist/components/nylas-min-cancellation-notice2.js.map CHANGED Viewed

	@@ -1 +1 @@
1	- {"file":"nylas-min-cancellation-notice2.js","mappings":"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","names":[],"sources":["src/components/scheduler-editor/nylas-min-cancellation-notice/nylas-min-cancellation-notice.scss?tag=nylas-min-cancellation-notice&encapsulation=shadow","src/components/scheduler-editor/nylas-min-cancellation-notice/nylas-min-cancellation-notice.tsx"],"sourcesContent":["@import '../../../common/styles/variables.scss';\n\n:host {\n @include default-css-variables;\n}\n\n.nylas-min-cancellation-notice {\n display: flex;\n justify-content: space-between;\n font-family: var(--nylas-font-family);\n label {\n display: flex;\n align-items: center;\n color: var(--nylas-base-800);\n font-size: 14px;\n font-style: normal;\n font-weight: 400;\n line-height: 150%; /* 21px /\n span.label-icon {\n margin-left: 4px;\n tooltip-component {\n display: flex;\n }\n }\n }\n}\n","import { RegisterComponent } from '@/common/register-component';\nimport { NylasSchedulerConfigConnector } from '@/connector/nylas-scheduler-config-connector';\nimport { debug } from '@/utils/utils';\nimport { AttachInternals, Component, Host, State, h, Element, Prop, Watch, Event, EventEmitter, Listen } from '@stencil/core';\nimport { NylasSchedulerEditor } from '../nylas-scheduler-editor/nylas-scheduler-editor';\n\n/\n The `nylas-min-cancellation-notice` component is a form input for the description of an event.\n * @part nmcn - The minimum cancellation notice container\n * @part nmcn__number-dropdown - The number dropdown container\n * @part nmcn__number-dropdown-button - The number dropdown button\n * @part nmcn__number-dropdown-content - The number dropdown content\n * @part nmcn__period-dropdown - The period dropdown container\n * @part nmcn__period-dropdown-button - The period dropdown button\n * @part nmcn__period-dropdown-content - The period dropdown content\n /\n@Component({\n tag: 'nylas-min-cancellation-notice',\n styleUrl: 'nylas-min-cancellation-notice.scss',\n shadow: true,\n formAssociated: true,\n})\nexport class NylasMinCancellationNotice {\n @Prop() minCancellationNotice?: number;\n @AttachInternals() internals!: ElementInternals;\n @Element() host!: HTMLElement;\n @Prop() name: string = 'min-cancellation-notice';\n\n @State() selectedNumber: number = 1;\n @State() selectedPeriod: string = 'day';\n\n /\n When a name prop is passed, stencil does not automatically set the name attribute on the host element.\n * Since this component is form-associated, the name attribute is required for form submission.\n * This is a workaround to ensure that the name attribute is set on the host element.\n /\n @Watch('name')\n elementNameChangedHandler(newValue: string) {\n debug('nylas-min-cancellation-notice', 'elementNameChangedHandler', newValue);\n this.host.setAttribute('name', newValue);\n }\n\n @Watch('availableDaysInFuture')\n availableDaysInFutureChanged(newValue: number) {\n const { number, period } = this.calculateNumberAndPeriodFromMinutes(newValue);\n this.selectedNumber = number;\n this.selectedPeriod = period;\n }\n\n @Event() valueChanged!: EventEmitter<{\n value: string;\n name: string;\n }>;\n\n connectedCallback() {\n debug('nylas-min-cancellation-notice', 'connectedCallback');\n }\n\n componentWillLoad() {\n debug('nylas-min-cancellation-notice', 'componentWillLoad');\n this.host.setAttribute('name', this.name);\n }\n\n componentDidLoad() {\n debug('nylas-min-cancellation-notice', 'componentDidLoad');\n this.availableDaysInFutureChanged(this.minCancellationNotice ?? 1);\n if (typeof this.internals.setFormValue !== 'function') {\n return;\n }\n this.internals.setFormValue(this.minCancellationNotice?.toString() ?? '1', this.name);\n }\n\n disconnectedCallback() {\n debug('nylas-min-cancellation-notice', 'disconnectedCallback');\n }\n\n @Listen('timePeriodChanged')\n timePeriodChangedHandler(\n event: CustomEvent<{\n number: number;\n period: string;\n }>,\n ) {\n const { number, period } = event.detail;\n let totalMinutes;\n const minutesInHour = 60;\n const minutesInDay = minutesInHour 24;\n const minutesInWeek = minutesInDay * 7;\n const minutesInMonth = minutesInDay * 30; // Assuming 30 days in a month for simplification\n\n if (period === 'minute') {\n totalMinutes = number;\n } else if (period === 'hour') {\n totalMinutes = number * minutesInHour;\n } else if (period === 'day') {\n totalMinutes = number * minutesInDay;\n } else if (period === 'week') {\n totalMinutes = number * minutesInWeek;\n } else if (period === 'month') {\n totalMinutes = number * minutesInMonth;\n } else {\n totalMinutes = 0;\n }\n this.valueChanged.emit({ value: totalMinutes, name: this.name });\n if (typeof this.internals.setFormValue !== 'function') {\n return;\n }\n this.internals.setFormValue(totalMinutes.toString(), this.name);\n }\n\n private calculateNumberAndPeriodFromMinutes(minutes: number): { number: number; period: string } {\n const minutesInHour = 60;\n const minutesInDay = minutesInHour * 24;\n const minutesInWeek = minutesInDay * 7;\n const minutesInMonth = minutesInDay * 30; // Assuming 30 days in a month for simplification\n\n if (minutes >= minutesInMonth) {\n return { number: Math.floor(minutes / minutesInMonth), period: 'month' };\n } else if (minutes >= minutesInWeek) {\n return { number: Math.floor(minutes / minutesInWeek), period: 'week' };\n } else if (minutes >= minutesInDay) {\n return { number: Math.floor(minutes / minutesInDay), period: 'day' };\n } else if (minutes >= minutesInHour) {\n return { number: Math.floor(minutes / minutesInHour), period: 'hour' };\n } else {\n return { number: minutes, period: 'minute' };\n }\n }\n\n @RegisterComponent<NylasMinCancellationNotice, NylasSchedulerConfigConnector, Exclude<NylasSchedulerEditor['stores'], undefined>>({\n name: 'nylas-min-cancellation-notice',\n eventToProps: {},\n fireRegisterEvent: true,\n })\n render() {\n return (\n <Host>\n <div class=\"nylas-min-cancellation-notice\" part=\"nmcn\">\n <label>\n Minimum cancellation notice\n <span class=\"label-icon\">\n <tooltip-component>\n <info-icon slot=\"tooltip-icon\" />\n <span slot=\"tooltip-content\">Set the minimum amount of time required to cancel an event.</span>\n </tooltip-component>\n </span>\n </label>\n <time-period-selector\n id=\"min-cancellation-notice\"\n exportparts=\"tps__number-dropdown: nmcn__number-dropdown, tps__number-dropdown-button: nmcn__number-dropdown-button, tps__number-dropdown-content: nmcn__number-dropdown-content, tps__period-dropdown: nmcn__period-dropdown, tps__period-dropdown-button: nmcn__period-dropdown-button, tps__period-dropdown-content: nmcn__period-dropdown-content\"\n timePeriods={['minute', 'hour', 'day', 'week']}\n defaultSelectedNumber={this.selectedNumber}\n defaultSelectedPeriod={this.selectedPeriod}\n />\n </div>\n </Host>\n );\n }\n}\n"],"version":3}
1	+ {"file":"nylas-min-cancellation-notice2.js","mappings":"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","names":[],"sources":["src/components/scheduler-editor/nylas-min-cancellation-notice/nylas-min-cancellation-notice.scss?tag=nylas-min-cancellation-notice&encapsulation=shadow","src/components/scheduler-editor/nylas-min-cancellation-notice/nylas-min-cancellation-notice.tsx"],"sourcesContent":["@import '../../../common/styles/variables.scss';\n\n:host {\n @include default-css-variables;\n}\n\n.nylas-min-cancellation-notice {\n display: flex;\n justify-content: space-between;\n font-family: var(--nylas-font-family);\n label {\n display: flex;\n align-items: center;\n color: var(--nylas-base-800);\n font-size: 14px;\n font-style: normal;\n font-weight: 400;\n line-height: 150%; /* 21px /\n span.label-icon {\n margin-left: 4px;\n tooltip-component {\n display: flex;\n }\n }\n }\n}\n","import { RegisterComponent } from '@/common/register-component';\nimport { NylasSchedulerConfigConnector } from '@/connector/nylas-scheduler-config-connector';\nimport { debug } from '@/utils/utils';\nimport { AttachInternals, Component, Host, State, h, Element, Prop, Watch, Event, EventEmitter, Listen } from '@stencil/core';\nimport { NylasSchedulerEditor } from '../nylas-scheduler-editor/nylas-scheduler-editor';\nimport { Configuration } from '@nylas/core';\n\n/\n The `nylas-min-cancellation-notice` component is a form input for the description of an event.\n * @part nmcn - The minimum cancellation notice container\n * @part nmcn__number-dropdown - The number dropdown container\n * @part nmcn__number-dropdown-button - The number dropdown button\n * @part nmcn__number-dropdown-content - The number dropdown content\n * @part nmcn__period-dropdown - The period dropdown container\n * @part nmcn__period-dropdown-button - The period dropdown button\n * @part nmcn__period-dropdown-content - The period dropdown content\n /\n@Component({\n tag: 'nylas-min-cancellation-notice',\n styleUrl: 'nylas-min-cancellation-notice.scss',\n shadow: true,\n formAssociated: true,\n})\nexport class NylasMinCancellationNotice {\n /\n The selected config\n /\n @Prop() selectedConfiguration?: Configuration;\n @Prop() minCancellationNotice?: number;\n @AttachInternals() internals!: ElementInternals;\n @Element() host!: HTMLElement;\n @Prop() name: string = 'min-cancellation-notice';\n\n @State() selectedNumber: number = 1;\n @State() selectedPeriod: string = 'day';\n\n /\n When a name prop is passed, stencil does not automatically set the name attribute on the host element.\n * Since this component is form-associated, the name attribute is required for form submission.\n * This is a workaround to ensure that the name attribute is set on the host element.\n /\n @Watch('name')\n elementNameChangedHandler(newValue: string) {\n debug('nylas-min-cancellation-notice', 'elementNameChangedHandler', newValue);\n this.host.setAttribute('name', newValue);\n }\n\n @Watch('selectedConfiguration')\n selectedConfigurationChangedHandler(newVal: Configuration) {\n const minCancellationNotice = newVal?.scheduler?.min_cancellation_notice;\n if (minCancellationNotice) {\n this.updateNumberAndPeriodFromMinutes(minCancellationNotice);\n }\n }\n\n @Watch('availableDaysInFuture')\n availableDaysInFutureChanged(newValue: number) {\n this.updateNumberAndPeriodFromMinutes(newValue);\n }\n\n @Event() valueChanged!: EventEmitter<{\n value: string;\n name: string;\n }>;\n\n connectedCallback() {\n debug('nylas-min-cancellation-notice', 'connectedCallback');\n }\n\n componentWillLoad() {\n debug('nylas-min-cancellation-notice', 'componentWillLoad');\n this.host.setAttribute('name', this.name);\n }\n\n componentDidLoad() {\n debug('nylas-min-cancellation-notice', 'componentDidLoad');\n this.availableDaysInFutureChanged(this.minCancellationNotice ?? 1);\n if (typeof this.internals.setFormValue !== 'function') {\n return;\n }\n this.internals.setFormValue(this.minCancellationNotice?.toString() ?? '1', this.name);\n }\n\n disconnectedCallback() {\n debug('nylas-min-cancellation-notice', 'disconnectedCallback');\n }\n\n @Listen('timePeriodChanged')\n timePeriodChangedHandler(\n event: CustomEvent<{\n number: number;\n period: string;\n }>,\n ) {\n const { number, period } = event.detail;\n let totalMinutes;\n const minutesInHour = 60;\n const minutesInDay = minutesInHour 24;\n const minutesInWeek = minutesInDay * 7;\n const minutesInMonth = minutesInDay * 30; // Assuming 30 days in a month for simplification\n\n if (period === 'minute') {\n totalMinutes = number;\n } else if (period === 'hour') {\n totalMinutes = number * minutesInHour;\n } else if (period === 'day') {\n totalMinutes = number * minutesInDay;\n } else if (period === 'week') {\n totalMinutes = number * minutesInWeek;\n } else if (period === 'month') {\n totalMinutes = number * minutesInMonth;\n } else {\n totalMinutes = 0;\n }\n this.valueChanged.emit({ value: totalMinutes, name: 'minCancellationNotice' });\n if (typeof this.internals.setFormValue !== 'function') {\n return;\n }\n this.internals.setFormValue(totalMinutes.toString(), this.name);\n }\n\n private updateNumberAndPeriodFromMinutes(minutes: number): void {\n const minutesInHour = 60;\n const minutesInDay = minutesInHour * 24;\n const minutesInWeek = minutesInDay * 7;\n const minutesInMonth = minutesInDay * 30; // Assuming 30 days in a month for simplification\n let number, period;\n if (minutes >= minutesInMonth) {\n number = Math.floor(minutes / minutesInMonth);\n period = 'month';\n } else if (minutes >= minutesInWeek) {\n number = Math.floor(minutes / minutesInWeek);\n period = 'week';\n } else if (minutes >= minutesInDay) {\n number = Math.floor(minutes / minutesInDay);\n period = 'day';\n } else if (minutes >= minutesInHour) {\n number = Math.floor(minutes / minutesInHour);\n period = 'hour';\n } else {\n number = minutes;\n period = 'minute';\n }\n this.selectedNumber = number;\n this.selectedPeriod = period;\n }\n\n @RegisterComponent<NylasMinCancellationNotice, NylasSchedulerConfigConnector, Exclude<NylasSchedulerEditor['stores'], undefined>>({\n name: 'nylas-min-cancellation-notice',\n stateToProps: new Map([['schedulerConfig.selectedConfiguration', 'selectedConfiguration']]),\n eventToProps: {},\n fireRegisterEvent: true,\n })\n render() {\n return (\n <Host>\n <div class=\"nylas-min-cancellation-notice\" part=\"nmcn\">\n <label>\n Minimum cancellation notice\n <span class=\"label-icon\">\n <tooltip-component>\n <info-icon slot=\"tooltip-icon\" />\n <span slot=\"tooltip-content\">Set the minimum amount of time required to cancel an event.</span>\n </tooltip-component>\n </span>\n </label>\n <time-period-selector\n id=\"min-cancellation-notice\"\n exportparts=\"tps__number-dropdown: nmcn__number-dropdown, tps__number-dropdown-button: nmcn__number-dropdown-button, tps__number-dropdown-content: nmcn__number-dropdown-content, tps__period-dropdown: nmcn__period-dropdown, tps__period-dropdown-button: nmcn__period-dropdown-button, tps__period-dropdown-content: nmcn__period-dropdown-content\"\n timePeriods={['minute', 'hour', 'day', 'week']}\n defaultSelectedNumber={this.selectedNumber}\n defaultSelectedPeriod={this.selectedPeriod}\n />\n </div>\n </Host>\n );\n }\n}\n"],"version":3}

package/dist/components/nylas-notification2.js CHANGED Viewed

@@ -1,5 +1,5 @@
 import { proxyCustomElement, HTMLElement, h, Host, Fragment } from '@stencil/core/internal/client';
-import { d as debug } from './utils.js';
+import { a as debug } from './utils.js';
 import { d as defineCustomElement$2 } from './close.js';
 import { d as defineCustomElement$1 } from './warning.js';
@@ -55,7 +55,7 @@ const NylasNotification = proxyCustomElement(class NylasNotification extends HTM
         this.notifications = this.notifications.filter(notif => notif.id !== id);
     }
     render() {
-        return (h(Host, { key: '947c58f3617a73e55731cc6f6c03c1931008d000' }, h(Fragment, { key: 'd84045b56a35c322a194e4bf4c9d3982a5ce6d32' }, this.notifications.map(notif => (h("div", { class: `notif ${notif.type}`, key: notif.id }, h("div", { class: "content" }, h("span", { class: `icon ${notif.type}` }, (notif.type === 'error' || notif.type === 'warning') && h("warning-icon", null)), h("span", { class: "message" }, h("span", { class: "title" }, notif.title), notif.description && h("span", { class: "description" }, notif.description))), h("button", { class: "dismiss-btn", onClick: () => this.dismissNotification(notif.id) }, h("close-icon", null))))), h("slot", { key: 'e246e847f46fe0d99370eb909cc89a3546186089' }))));
+        return (h(Host, { key: '16bd673245819e3ed76ba5689c3292be510e3cd7' }, h(Fragment, { key: 'd88e8ea863d00a8c982c7e26007c975526c7457f' }, this.notifications.map(notif => (h("div", { class: `notif ${notif.type}`, key: notif.id }, h("div", { class: "content" }, h("span", { class: `icon ${notif.type}` }, (notif.type === 'error' || notif.type === 'warning') && h("warning-icon", null)), h("span", { class: "message" }, h("span", { class: "title" }, notif.title), notif.description && h("span", { class: "description" }, notif.description))), h("button", { class: "dismiss-btn", onClick: () => this.dismissNotification(notif.id) }, h("close-icon", null))))), h("slot", { key: 'c40cb61ce0a1dbd3416824b7c26e08e3aea01eae' }))));
     }
     static get style() { return nylasNotificationCss; }
 }, [1, "nylas-notification", {
@@ -86,7 +86,6 @@ function defineCustomElement() {
             break;
     } });
 }
-defineCustomElement(NylasNotification);
 export { NylasNotification as N, defineCustomElement as d };

package/dist/components/nylas-notification2.js.map CHANGED Viewed

	@@ -1 +1 @@
1	- {"file":"nylas-notification2.js","mappings":"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~~;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;~~","names":[],"sources":["src/components/scheduler/nylas-notification/nylas-notification.scss?tag=nylas-notification&encapsulation=shadow","src/components/scheduler/nylas-notification/nylas-notification.tsx"],"sourcesContent":["@import '../../../common/styles/variables.scss';\n\n:host {\n display: block;\n margin-bottom: -12px; // offset for the rounded border\n width: 100%;\n z-index: 1;\n @include default-css-variables;\n}\n.notif {\n display: flex;\n @media #{$mobile} {\n width: auto;\n }\n padding: 17px;\n align-items: flex-start;\n justify-content: space-between;\n gap: 16px;\n border-radius: var(--nylas-border-radius-2x);\n border: 1.5px solid var(--nylas-error);\n background: var(--nylas-base-0);\n .content {\n display: flex;\n flex-direction: row;\n gap: 8px;\n .message {\n font-size: 14px;\n font-weight: 400;\n color: var(--nylas-base-800);\n .title {\n font-size: 16px;\n font-weight: 600;\n color: var(--nylas-base-950);\n display: block;\n }\n .description {\n font-size: 14px;\n font-weight: 400;\n color: var(--nylas-base-800);\n display: block;\n }\n }\n .icon {\n &.error {\n color: var(--nylas-error);\n }\n }\n }\n\n &.error {\n border-color: var(--nylas-error);\n }\n &.warning {\n border-color: var(--nylas-warning);\n }\n &.info {\n border-color: var(--nylas-info);\n }\n &.success {\n border-color: var(--nylas-success);\n }\n\n .dismiss-btn {\n background: none;\n border: none;\n color: var(--nylas-base-950);\n cursor: pointer;\n }\n}\n","import { Notification } from '@nylas/core';\nimport { Component, Fragment, Host, Listen, Prop, State, h } from '@stencil/core';\nimport { debug } from '@/utils/utils';\n\n/*\n The `nylas-notification` component is a UI component that displays notifications.\n /\n@Component({\n tag: 'nylas-notification',\n styleUrl: 'nylas-notification.scss',\n shadow: true,\n})\nexport class NylasNotification {\n /\n The time-to-live for notifications in milliseconds. Set to 'none' to disable auto-dismissal.\n */\n @Prop() ttl: number \| 'none' = 5000;\n @Prop() allowedCategories: string[] = ['component', 'api', 'validation', 'invalid_session'];\n\n @State() notifications: Notification[] = [];\n\n @Listen('nylasSchedulerError', { target: 'body' })\n onError(event: CustomEvent<Notification>) {\n debug(`[nylas-notification] Error: ${event.detail.title}`);\n this.handleNotification(event);\n }\n\n @Listen('nylasSchedulerWarning', { target: 'body' })\n onWarning(event: CustomEvent<Notification>) {\n debug(`[nylas-notification] Warning: ${event.detail.title}`);\n this.handleNotification(event);\n }\n\n @Listen('nylasSchedulerInfo', { target: 'body' })\n onInfo(event: CustomEvent<Notification>) {\n debug(`[nylas-notification] Info: ${event.detail.title}`);\n this.handleNotification(event);\n }\n\n @Listen('nylasSchedulerSuccess', { target: 'body' })\n onSuccess(event: CustomEvent<Notification>) {\n debug(`[nylas-notification] Success: ${event.detail.title}`);\n this.handleNotification(event);\n }\n\n private handleNotification(event: CustomEvent<Notification>) {\n if (event.defaultPrevented) {\n debug(`[nylas-notification] Event default prevented`);\n return;\n }\n if (this.ttl === 0) {\n debug(`[nylas-notification] TTL is 0`);\n return;\n }\n if (this.allowedCategories.length > 0 && !this.allowedCategories.includes(event.detail.category)) {\n debug(`[nylas-notification] Category not allowed`);\n return;\n }\n\n this.notifications = [...this.notifications, { ...event.detail }];\n if (event.detail.ttl !== 'none') {\n const ttl = event.detail.ttl ? event.detail.ttl : (this.ttl as number);\n window.setTimeout(() => {\n this.notifications = this.notifications.filter(notif => notif.id !== event.detail.id);\n }, ttl);\n }\n }\n\n private dismissNotification(id: string) {\n this.notifications = this.notifications.filter(notif => notif.id !== id);\n }\n\n render() {\n return (\n <Host>\n <Fragment>\n {this.notifications.map(notif => (\n <div class={`notif ${notif.type}`} key={notif.id}>\n <div class=\"content\">\n <span class={`icon ${notif.type}`}>{(notif.type === 'error' \|\| notif.type === 'warning') && <warning-icon />}</span>\n <span class=\"message\">\n <span class=\"title\">{notif.title}</span>\n {notif.description && <span class=\"description\">{notif.description}</span>}\n </span>\n </div>\n <button class=\"dismiss-btn\" onClick={() => this.dismissNotification(notif.id)}>\n <close-icon />\n </button>\n </div>\n ))}\n <slot />\n </Fragment>\n </Host>\n );\n }\n}\n"],"version":3}
1	+ {"file":"nylas-notification2.js","mappings":"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","names":[],"sources":["src/components/scheduler/nylas-notification/nylas-notification.scss?tag=nylas-notification&encapsulation=shadow","src/components/scheduler/nylas-notification/nylas-notification.tsx"],"sourcesContent":["@import '../../../common/styles/variables.scss';\n\n:host {\n display: block;\n margin-bottom: -12px; // offset for the rounded border\n width: 100%;\n z-index: 1;\n @include default-css-variables;\n}\n.notif {\n display: flex;\n @media #{$mobile} {\n width: auto;\n }\n padding: 17px;\n align-items: flex-start;\n justify-content: space-between;\n gap: 16px;\n border-radius: var(--nylas-border-radius-2x);\n border: 1.5px solid var(--nylas-error);\n background: var(--nylas-base-0);\n .content {\n display: flex;\n flex-direction: row;\n gap: 8px;\n .message {\n font-size: 14px;\n font-weight: 400;\n color: var(--nylas-base-800);\n .title {\n font-size: 16px;\n font-weight: 600;\n color: var(--nylas-base-950);\n display: block;\n }\n .description {\n font-size: 14px;\n font-weight: 400;\n color: var(--nylas-base-800);\n display: block;\n }\n }\n .icon {\n &.error {\n color: var(--nylas-error);\n }\n }\n }\n\n &.error {\n border-color: var(--nylas-error);\n }\n &.warning {\n border-color: var(--nylas-warning);\n }\n &.info {\n border-color: var(--nylas-info);\n }\n &.success {\n border-color: var(--nylas-success);\n }\n\n .dismiss-btn {\n background: none;\n border: none;\n color: var(--nylas-base-950);\n cursor: pointer;\n }\n}\n","import { Notification } from '@nylas/core';\nimport { Component, Fragment, Host, Listen, Prop, State, h } from '@stencil/core';\nimport { debug } from '@/utils/utils';\n\n/*\n The `nylas-notification` component is a UI component that displays notifications.\n /\n@Component({\n tag: 'nylas-notification',\n styleUrl: 'nylas-notification.scss',\n shadow: true,\n})\nexport class NylasNotification {\n /\n The time-to-live for notifications in milliseconds. Set to 'none' to disable auto-dismissal.\n */\n @Prop() ttl: number \| 'none' = 5000;\n @Prop() allowedCategories: string[] = ['component', 'api', 'validation', 'invalid_session'];\n\n @State() notifications: Notification[] = [];\n\n @Listen('nylasSchedulerError', { target: 'body' })\n onError(event: CustomEvent<Notification>) {\n debug(`[nylas-notification] Error: ${event.detail.title}`);\n this.handleNotification(event);\n }\n\n @Listen('nylasSchedulerWarning', { target: 'body' })\n onWarning(event: CustomEvent<Notification>) {\n debug(`[nylas-notification] Warning: ${event.detail.title}`);\n this.handleNotification(event);\n }\n\n @Listen('nylasSchedulerInfo', { target: 'body' })\n onInfo(event: CustomEvent<Notification>) {\n debug(`[nylas-notification] Info: ${event.detail.title}`);\n this.handleNotification(event);\n }\n\n @Listen('nylasSchedulerSuccess', { target: 'body' })\n onSuccess(event: CustomEvent<Notification>) {\n debug(`[nylas-notification] Success: ${event.detail.title}`);\n this.handleNotification(event);\n }\n\n private handleNotification(event: CustomEvent<Notification>) {\n if (event.defaultPrevented) {\n debug(`[nylas-notification] Event default prevented`);\n return;\n }\n if (this.ttl === 0) {\n debug(`[nylas-notification] TTL is 0`);\n return;\n }\n if (this.allowedCategories.length > 0 && !this.allowedCategories.includes(event.detail.category)) {\n debug(`[nylas-notification] Category not allowed`);\n return;\n }\n\n this.notifications = [...this.notifications, { ...event.detail }];\n if (event.detail.ttl !== 'none') {\n const ttl = event.detail.ttl ? event.detail.ttl : (this.ttl as number);\n window.setTimeout(() => {\n this.notifications = this.notifications.filter(notif => notif.id !== event.detail.id);\n }, ttl);\n }\n }\n\n private dismissNotification(id: string) {\n this.notifications = this.notifications.filter(notif => notif.id !== id);\n }\n\n render() {\n return (\n <Host>\n <Fragment>\n {this.notifications.map(notif => (\n <div class={`notif ${notif.type}`} key={notif.id}>\n <div class=\"content\">\n <span class={`icon ${notif.type}`}>{(notif.type === 'error' \|\| notif.type === 'warning') && <warning-icon />}</span>\n <span class=\"message\">\n <span class=\"title\">{notif.title}</span>\n {notif.description && <span class=\"description\">{notif.description}</span>}\n </span>\n </div>\n <button class=\"dismiss-btn\" onClick={() => this.dismissNotification(notif.id)}>\n <close-icon />\n </button>\n </div>\n ))}\n <slot />\n </Fragment>\n </Host>\n );\n }\n}\n"],"version":3}

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

@@ -1,6 +1,6 @@
 import { proxyCustomElement, HTMLElement, createEvent, h, Host } from '@stencil/core/internal/client';
 import { N as NylasBaseProvider, e as es } from './index.es.js';
-import { d as debug } from './utils.js';
+import { a as debug } from './utils.js';
 import { N as NylasAuthConnector, a as NylasThreadsConnector, b as NylasMessagesConnector, c as NylasFoldersConnector, C as CreateNylasAuthStore, d as CreateNylasMailboxStore, H as HashRouter } from './mailbox-store.js';
 import { N as NylaSchedulerAPIConnector, C as CreateNylasSchedulerStore } from './scheduler-store.js';
 import { C as CreateNylasSchedulerConfigStore } from './scheduler-config-store.js';
@@ -182,7 +182,7 @@ const NylasProvider$1 = proxyCustomElement(class NylasProvider extends HTMLEleme
         return this.baseProvider?.getStore('schedulerConfig');
     }
     render() {
-        return (h(Host, { key: 'cf7646d512fe6614ad4a73ac63c3581f20af1ab2' }, h("slot", { key: 'bf17dda1b22695e9862a549866fcd140b5d2e0db' })));
+        return (h(Host, { key: '782d47608825fb870d87153c8d43d778dc6c2b87' }, h("slot", { key: '2b01537d9d4a0cf4c81ad0b77ce3e6d761f3e1db' })));
     }
     get host() { return this; }
     static get style() { return nylasProviderCss; }
@@ -210,7 +210,6 @@ function defineCustomElement$1() {
             break;
     } });
 }
-defineCustomElement$1(NylasProvider$1);
 const NylasProvider = NylasProvider$1;
 const defineCustomElement = defineCustomElement$1;