npm - @nylas/web-elements - Versions diffs - 1.1.0-canary.16 → 1.1.0-canary.18 - Mend

@nylas/web-elements 1.1.0-canary.16 → 1.1.0-canary.18

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 (711) hide show

package/dist/esm/calendar-patterns-icon.entry.js CHANGED Viewed

@@ -9,7 +9,7 @@ const CalendarPatternsIcon = class {
         this.height = '20';
     }
     render() {
-        return (h("svg", { key: '51194c3d75fbd584a92f542e1577cd42d02220ea', width: this.width, height: this.height, fill: "none", xmlns: "http://www.w3.org/2000/svg" }, h("path", { key: '4c59913ad1970a360ae9cd8e69551131e66fc00e', d: "M3.25 0H11.75C13.2688 0 14.5 1.23122 14.5 2.75V11.25C14.5 12.7688 13.2688 14 11.75 14H3.25C1.73122 14 0.5 12.7688 0.5 11.25V2.75C0.5 1.23122 1.73122 0 3.25 0ZM2 2.75V4H13V2.75C13 2.05964 12.4404 1.5 11.75 1.5H3.25C2.55964 1.5 2 2.05964 2 2.75ZM12.2071 5L8.20711 9H10.7929L13 6.79289V5H12.2071ZM10.7929 5H8.20711L4.20711 9H6.79289L10.7929 5ZM2.79289 9L6.79289 5H4.20711L2 7.20711V9H2.79289ZM2 5.79289L2.79289 5H2V5.79289ZM12.2071 9H13V8.20711L12.2071 9Z", fill: "currentColor" })));
+        return (h("svg", { key: 'ca6df3db90bbbffc29dfdc6ee5a440266eaa153d', width: this.width, height: this.height, fill: "none", xmlns: "http://www.w3.org/2000/svg" }, h("path", { key: 'ab45118ff407127ca1673159e1b78c93c7c97bed', d: "M3.25 0H11.75C13.2688 0 14.5 1.23122 14.5 2.75V11.25C14.5 12.7688 13.2688 14 11.75 14H3.25C1.73122 14 0.5 12.7688 0.5 11.25V2.75C0.5 1.23122 1.73122 0 3.25 0ZM2 2.75V4H13V2.75C13 2.05964 12.4404 1.5 11.75 1.5H3.25C2.55964 1.5 2 2.05964 2 2.75ZM12.2071 5L8.20711 9H10.7929L13 6.79289V5H12.2071ZM10.7929 5H8.20711L4.20711 9H6.79289L10.7929 5ZM2.79289 9L6.79289 5H4.20711L2 7.20711V9H2.79289ZM2 5.79289L2.79289 5H2V5.79289ZM12.2071 9H13V8.20711L12.2071 9Z", fill: "currentColor" })));
     }
 };
 CalendarPatternsIcon.style = iconCss;

package/dist/esm/checkbox-component.entry.js CHANGED Viewed

@@ -23,7 +23,7 @@ const CheckboxComponent = class {
         });
     }
     render() {
-        return (h("label", { key: '38e5db24a5990c9b892fc824508148c28d918097' }, h("input", { key: '98d0bcc2e427035e7cc6fe216a1db105b65fc848', type: "checkbox", checked: this.isChecked, onChange: () => this.toggleCheck() }), h("span", { key: '9d475bd9e76606d62791e3aad90acd3286daae4b', class: "checkmark" }), h("slot", { key: '901fc53b3031d828a9e83f074b4223ef40ed0566', name: "label" }, h("span", { key: 'fa95b9232724d82e023214e666948f5dd9d11a4f', class: "label" }, this.label))));
+        return (h("label", { key: 'ff418217723b6044270dc691f7d0e11aea5fb204' }, h("input", { key: 'c45008c89d147534ba6b4a70120b7c5159a25ce6', type: "checkbox", name: this.name, checked: this.isChecked, onChange: () => this.toggleCheck() }), h("span", { key: 'a785e711233dab04bb19bcf1f1c6f665d7460015', class: "checkmark" }), h("slot", { key: '05e7f91a9e038bf9a467d63c9c004f7b90454b6f', name: "label" }, h("span", { key: '35a5c8bef4f998f993fbdcf2b752b83432218422', class: "label" }, this.label))));
     }
 };
 CheckboxComponent.style = checkboxComponentCss;

package/dist/esm/checkbox-component.entry.js.map CHANGED Viewed

	@@ -1 +1 @@
1	- {"file":"checkbox-component.entry.js","mappings":";;AAAA,MAAM,oBAAoB,GAAG,q8DAAq8D;;MCOr9D,iBAAiB;;;;oBACL,UAAU;uBACN,KAAK;qBACR,EAAE;yBAEI,IAAI,CAAC,OAAO;;IAQ1C,iBAAiB;QACf,IAAI,CAAC,SAAS,GAAG,IAAI,CAAC,OAAO,CAAC;KAC/B;IAED,WAAW;QACT,IAAI,CAAC,SAAS,GAAG,CAAC,IAAI,CAAC,SAAS,CAAC;QACjC,IAAI,CAAC,wBAAwB,CAAC,IAAI,CAAC;YACjC,OAAO,EAAE,IAAI,CAAC,SAAS;YACvB,IAAI,EAAE,IAAI,CAAC,IAAI;YACf,KAAK,EAAE,IAAI,CAAC,KAAK;SAClB,CAAC,CAAC;KACJ;IAED,MAAM;QACJ,QACE,gEACE,8DAAO,IAAI,EAAC,UAAU,EAAC,OAAO,EAAE,IAAI,CAAC,SAAS,EAAE,QAAQ,EAAE,MAAM,IAAI,CAAC,WAAW,EAAE,GAAI,~~EACtF~~,6DAAM,KAAK,EAAC,WAAW,GAAQ,EAC/B,6DAAM,IAAI,EAAC,OAAO,IAChB,6DAAM,KAAK,EAAC,OAAO,IAAE,IAAI,CAAC,KAAK,CAAQ,CAClC,CACD,EACR;KACH;;;;;;","names":[],"sources":["src/components/design-system/checkbox-component/checkbox-component.scss?tag=checkbox-component&encapsulation=shadow","src/components/design-system/checkbox-component/checkbox-component.tsx"],"sourcesContent":["@import '../../../common/styles/variables.scss';\n\nlabel {\n @include default-css-variables;\n display: flex;\n align-items: center;\n font-family: var(--nylas-font-family);\n cursor: pointer;\n position: relative;\n -webkit-user-select: none;\n -moz-user-select: none;\n -ms-user-select: none;\n user-select: none;\n input[type='checkbox'] {\n position: absolute;\n opacity: 0;\n cursor: pointer;\n &:focus ~ .checkmark,\n &:hover ~ .checkmark {\n border-color: var(--nylas-primary);\n }\n &:checked ~ .checkmark {\n color: var(--nylas-base-0);\n background: var(--nylas-primary)\n url(data:image/svg+xml;base64,PD94bWwgdmVyc2lvbj0iMS4wIiBlbmNvZGluZz0iVVRGLTgiIHN0YW5kYWxvbmU9Im5vIj8+DQo8c3ZnIHdpZHRoPSIxMiIgaGVpZ2h0PSI5IiB2aWV3Qm94PSIwIDAgMTIgOSIgeG1sbnM9Imh0dHA6Ly93d3cudzMub3JnLzIwMDAvc3ZnIj4NCiAgPHBhdGggZD0iTTQuNTc1IDguOTc3cy0uNDA0LS4wMDctLjUzNi0uMTY1TC4wNTcgNS42NGwuODI5LTEuMjI3TDQuNDcgNy4yNjggMTAuOTIxLjA4NmwuOTIzIDEuMTAzLTYuODYzIDcuNjRjLS4xMzQtLjAwMy0uNDA2LjE0OC0uNDA2LjE0OHoiIGZpbGw9IiNGRkYiIGZpbGwtcnVsZT0iZXZlbm9kZCIvPg0KPC9zdmc+)\n 50% 40% no-repeat;\n border: 2px solid var(--nylas-primary);\n }\n }\n .checkmark {\n border-radius: var(--nylas-border-radius);\n border: 2px solid var(--nylas-base-800);\n position: absolute;\n left: 0;\n top: 2px;\n width: 18px;\n height: 18px;\n cursor: pointer;\n pointer-events: none;\n -webkit-user-select: none;\n -moz-user-select: none;\n -ms-user-select: none;\n user-select: none;\n }\n\n .label {\n margin-left: 32px;\n font-size: 16px;\n font-weight: 400;\n color: var(--nylas-base-800);\n line-height: 24px;\n }\n}\n","import { Component, h, Prop, State, Event, EventEmitter } from '@stencil/core';\n\n@Component({\n tag: 'checkbox-component',\n styleUrl: 'checkbox-component.scss',\n shadow: true,\n})\nexport class CheckboxComponent {\n @Prop() name: string = 'checkbox';\n @Prop() checked: boolean = false;\n @Prop() label: string = '';\n\n @State() isChecked: boolean = this.checked;\n\n @Event() nylasFormCheckboxToggled!: EventEmitter<{\n checked: boolean;\n name: string;\n label: string;\n }>;\n\n componentWillLoad() {\n this.isChecked = this.checked;\n }\n\n toggleCheck() {\n this.isChecked = !this.isChecked;\n this.nylasFormCheckboxToggled.emit({\n checked: this.isChecked,\n name: this.name,\n label: this.label,\n });\n }\n\n render() {\n return (\n <label>\n <input type=\"checkbox\" checked={this.isChecked} onChange={() => this.toggleCheck()} />\n <span class=\"checkmark\"></span>\n <slot name=\"label\">\n <span class=\"label\">{this.label}</span>\n </slot>\n </label>\n );\n }\n}\n"],"version":3}
1	+ {"file":"checkbox-component.entry.js","mappings":";;AAAA,MAAM,oBAAoB,GAAG,q8DAAq8D;;MCOr9D,iBAAiB;;;;oBACL,UAAU;uBACN,KAAK;qBACR,EAAE;yBAEI,IAAI,CAAC,OAAO;;IAQ1C,iBAAiB;QACf,IAAI,CAAC,SAAS,GAAG,IAAI,CAAC,OAAO,CAAC;KAC/B;IAED,WAAW;QACT,IAAI,CAAC,SAAS,GAAG,CAAC,IAAI,CAAC,SAAS,CAAC;QACjC,IAAI,CAAC,wBAAwB,CAAC,IAAI,CAAC;YACjC,OAAO,EAAE,IAAI,CAAC,SAAS;YACvB,IAAI,EAAE,IAAI,CAAC,IAAI;YACf,KAAK,EAAE,IAAI,CAAC,KAAK;SAClB,CAAC,CAAC;KACJ;IAED,MAAM;QACJ,QACE,gEACE,8DAAO,IAAI,EAAC,UAAU,EAAC,IAAI,EAAE,IAAI,CAAC,IAAI,EAAE,OAAO,EAAE,IAAI,CAAC,SAAS,EAAE,QAAQ,EAAE,MAAM,IAAI,CAAC,WAAW,EAAE,GAAI,EACvG,6DAAM,KAAK,EAAC,WAAW,GAAQ,EAC/B,6DAAM,IAAI,EAAC,OAAO,IAChB,6DAAM,KAAK,EAAC,OAAO,IAAE,IAAI,CAAC,KAAK,CAAQ,CAClC,CACD,EACR;KACH;;;;;;","names":[],"sources":["src/components/design-system/checkbox-component/checkbox-component.scss?tag=checkbox-component&encapsulation=shadow","src/components/design-system/checkbox-component/checkbox-component.tsx"],"sourcesContent":["@import '../../../common/styles/variables.scss';\n\nlabel {\n @include default-css-variables;\n display: flex;\n align-items: center;\n font-family: var(--nylas-font-family);\n cursor: pointer;\n position: relative;\n -webkit-user-select: none;\n -moz-user-select: none;\n -ms-user-select: none;\n user-select: none;\n input[type='checkbox'] {\n position: absolute;\n opacity: 0;\n cursor: pointer;\n &:focus ~ .checkmark,\n &:hover ~ .checkmark {\n border-color: var(--nylas-primary);\n }\n &:checked ~ .checkmark {\n color: var(--nylas-base-0);\n background: var(--nylas-primary)\n url(data:image/svg+xml;base64,PD94bWwgdmVyc2lvbj0iMS4wIiBlbmNvZGluZz0iVVRGLTgiIHN0YW5kYWxvbmU9Im5vIj8+DQo8c3ZnIHdpZHRoPSIxMiIgaGVpZ2h0PSI5IiB2aWV3Qm94PSIwIDAgMTIgOSIgeG1sbnM9Imh0dHA6Ly93d3cudzMub3JnLzIwMDAvc3ZnIj4NCiAgPHBhdGggZD0iTTQuNTc1IDguOTc3cy0uNDA0LS4wMDctLjUzNi0uMTY1TC4wNTcgNS42NGwuODI5LTEuMjI3TDQuNDcgNy4yNjggMTAuOTIxLjA4NmwuOTIzIDEuMTAzLTYuODYzIDcuNjRjLS4xMzQtLjAwMy0uNDA2LjE0OC0uNDA2LjE0OHoiIGZpbGw9IiNGRkYiIGZpbGwtcnVsZT0iZXZlbm9kZCIvPg0KPC9zdmc+)\n 50% 40% no-repeat;\n border: 2px solid var(--nylas-primary);\n }\n }\n .checkmark {\n border-radius: var(--nylas-border-radius);\n border: 2px solid var(--nylas-base-800);\n position: absolute;\n left: 0;\n top: 2px;\n width: 18px;\n height: 18px;\n cursor: pointer;\n pointer-events: none;\n -webkit-user-select: none;\n -moz-user-select: none;\n -ms-user-select: none;\n user-select: none;\n }\n\n .label {\n margin-left: 32px;\n font-size: 16px;\n font-weight: 400;\n color: var(--nylas-base-800);\n line-height: 24px;\n }\n}\n","import { Component, h, Prop, State, Event, EventEmitter } from '@stencil/core';\n\n@Component({\n tag: 'checkbox-component',\n styleUrl: 'checkbox-component.scss',\n shadow: true,\n})\nexport class CheckboxComponent {\n @Prop() name: string = 'checkbox';\n @Prop() checked: boolean = false;\n @Prop() label: string = '';\n\n @State() isChecked: boolean = this.checked;\n\n @Event() nylasFormCheckboxToggled!: EventEmitter<{\n checked: boolean;\n name: string;\n label: string;\n }>;\n\n componentWillLoad() {\n this.isChecked = this.checked;\n }\n\n toggleCheck() {\n this.isChecked = !this.isChecked;\n this.nylasFormCheckboxToggled.emit({\n checked: this.isChecked,\n name: this.name,\n label: this.label,\n });\n }\n\n render() {\n return (\n <label>\n <input type=\"checkbox\" name={this.name} checked={this.isChecked} onChange={() => this.toggleCheck()} />\n <span class=\"checkmark\"></span>\n <slot name=\"label\">\n <span class=\"label\">{this.label}</span>\n </slot>\n </label>\n );\n }\n}\n"],"version":3}

package/dist/esm/checkmark-circle-icon.entry.js CHANGED Viewed

@@ -9,7 +9,7 @@ const CheckmarkCircleIcon = class {
         this.height = '20';
     }
     render() {
-        return (h("svg", { key: 'efeaa9ea20f8a4a119e5aeac2b01fb8398fa9821', xmlns: "http://www.w3.org/2000/svg", width: this.width, height: this.height, fill: "none", viewBox: "0 0 20 20" }, h("path", { key: 'd0562c5be99940d6a381edad2b0c763de95f2cd7', fill: "currentColor", d: "M10 2a8 8 0 1 1 0 16 8 8 0 0 1 0-16Zm0 1a7 7 0 1 0 0 14 7 7 0 0 0 0-14Zm3.358 4.646a.5.5 0 0 1 .058.638l-.058.07-4.004 4.004a.5.5 0 0 1-.638.058l-.07-.058-2-2a.5.5 0 0 1 .638-.765l.07.058L9 11.298l3.651-3.652a.5.5 0 0 1 .707 0Z" })));
+        return (h("svg", { key: 'b119dc458ae4a2e796a4424afeeddb5b19d7e397', xmlns: "http://www.w3.org/2000/svg", width: this.width, height: this.height, fill: "none", viewBox: "0 0 20 20" }, h("path", { key: '2b9cb0a90ec273a8266ce5a588b239f87901fa05', fill: "currentColor", d: "M10 2a8 8 0 1 1 0 16 8 8 0 0 1 0-16Zm0 1a7 7 0 1 0 0 14 7 7 0 0 0 0-14Zm3.358 4.646a.5.5 0 0 1 .058.638l-.058.07-4.004 4.004a.5.5 0 0 1-.638.058l-.07-.058-2-2a.5.5 0 0 1 .638-.765l.07.058L9 11.298l3.651-3.652a.5.5 0 0 1 .707 0Z" })));
     }
 };
 CheckmarkCircleIcon.style = iconCss;

package/dist/esm/chevron-icon.entry.js CHANGED Viewed

@@ -9,7 +9,7 @@ const ChevronIcon = class {
         this.height = '24';
     }
     render() {
-        return (h("svg", { key: 'a32876d49e77cfdd0622df9bc609c41e08f51440', xmlns: "http://www.w3.org/2000/svg", width: this.width, height: this.height, viewBox: "0 0 24 24", fill: "none" }, h("path", { key: 'ec1fe551a0eaf4600374a57294a005c426ee8568', fill: "currentColor", d: "M15.53 4.22a.75.75 0 0 1 0 1.06L8.81 12l6.72 6.72a.75.75 0 1 1-1.06 1.06l-7.25-7.25a.75.75 0 0 1 0-1.06l7.25-7.25a.75.75 0 0 1 1.06 0Z" })));
+        return (h("svg", { key: 'a2ba18045e1a3068427898b7b9d9755c80f0f53e', xmlns: "http://www.w3.org/2000/svg", width: this.width, height: this.height, viewBox: "0 0 24 24", fill: "none" }, h("path", { key: '0715fdfa6bb874fef9aee368d457e9dce64a6dea', fill: "currentColor", d: "M15.53 4.22a.75.75 0 0 1 0 1.06L8.81 12l6.72 6.72a.75.75 0 1 1-1.06 1.06l-7.25-7.25a.75.75 0 0 1 0-1.06l7.25-7.25a.75.75 0 0 1 1.06 0Z" })));
     }
 };
 ChevronIcon.style = iconCss;

package/dist/esm/chevron-icon_3.entry.js CHANGED Viewed

@@ -10,7 +10,7 @@ const ChevronIcon = class {
         this.height = '24';
     }
     render() {
-        return (h("svg", { key: 'a32876d49e77cfdd0622df9bc609c41e08f51440', xmlns: "http://www.w3.org/2000/svg", width: this.width, height: this.height, viewBox: "0 0 24 24", fill: "none" }, h("path", { key: 'ec1fe551a0eaf4600374a57294a005c426ee8568', fill: "currentColor", d: "M15.53 4.22a.75.75 0 0 1 0 1.06L8.81 12l6.72 6.72a.75.75 0 1 1-1.06 1.06l-7.25-7.25a.75.75 0 0 1 0-1.06l7.25-7.25a.75.75 0 0 1 1.06 0Z" })));
+        return (h("svg", { key: 'a2ba18045e1a3068427898b7b9d9755c80f0f53e', xmlns: "http://www.w3.org/2000/svg", width: this.width, height: this.height, viewBox: "0 0 24 24", fill: "none" }, h("path", { key: '0715fdfa6bb874fef9aee368d457e9dce64a6dea', fill: "currentColor", d: "M15.53 4.22a.75.75 0 0 1 0 1.06L8.81 12l6.72 6.72a.75.75 0 1 1-1.06 1.06l-7.25-7.25a.75.75 0 0 1 0-1.06l7.25-7.25a.75.75 0 0 1 1.06 0Z" })));
     }
 };
 ChevronIcon.style = ChevronIconStyle0;
@@ -25,7 +25,7 @@ const SearchIcon = class {
         this.height = '15';
     }
     render() {
-        return (h("svg", { key: '40a81a00f79c85303a904e3ef66e7833a240fff2', width: this.width, height: this.height, fill: "none", xmlns: "http://www.w3.org/2000/svg" }, h("path", { key: 'dd4c72fa1db6849fd72bfcb3fbde40f115caac11', fill: "currentColor", d: "M5.5 0C8.53757 0 11 2.46243 11 5.5C11 6.83879 10.5217 8.06586 9.72656 9.01962L13.8536 13.1464C14.0488 13.3417 14.0488 13.6583 13.8536 13.8536C13.68 14.0271 13.4106 14.0464 13.2157 13.9114L13.1464 13.8536L9.01962 9.72656C8.06586 10.5217 6.83879 11 5.5 11C2.46243 11 0 8.53757 0 5.5C0 2.46243 2.46243 0 5.5 0ZM5.5 1C3.01472 1 1 3.01472 1 5.5C1 7.98528 3.01472 10 5.5 10C7.98528 10 10 7.98528 10 5.5C10 3.01472 7.98528 1 5.5 1Z" })));
+        return (h("svg", { key: 'dcf22b14b42ef62b0a4e33b4985712c2f0aac88e', width: this.width, height: this.height, fill: "none", xmlns: "http://www.w3.org/2000/svg" }, h("path", { key: '1048ab3533bef7bdb57dbdccf489ce6240722cf1', fill: "currentColor", d: "M5.5 0C8.53757 0 11 2.46243 11 5.5C11 6.83879 10.5217 8.06586 9.72656 9.01962L13.8536 13.1464C14.0488 13.3417 14.0488 13.6583 13.8536 13.8536C13.68 14.0271 13.4106 14.0464 13.2157 13.9114L13.1464 13.8536L9.01962 9.72656C8.06586 10.5217 6.83879 11 5.5 11C2.46243 11 0 8.53757 0 5.5C0 2.46243 2.46243 0 5.5 0ZM5.5 1C3.01472 1 1 3.01472 1 5.5C1 7.98528 3.01472 10 5.5 10C7.98528 10 10 7.98528 10 5.5C10 3.01472 7.98528 1 5.5 1Z" })));
     }
 };
 SearchIcon.style = SearchIconStyle0;
@@ -58,7 +58,7 @@ const SelectDropdown = class {
         this.filteredOptions = newValue;
     }
     defaultSelectedOptionChangedHandler(newValue, oldValue) {
-        if (newValue.label === oldValue.label) {
+        if (typeof newValue === 'undefined' || newValue?.label === oldValue?.label) {
             return;
         }
         this.selectedOption = newValue;
@@ -189,11 +189,11 @@ const SelectDropdown = class {
         }
     }
     render() {
-        return (h("div", { key: 'ac6e39d604f87ee8e154147cc8f82ffcfd81feef', class: "dropdown", part: "sd_dropdown" }, h("label", { key: '65ea5d43d46c9d3caa60b9d2a7453a75e3d59862', part: "sd_dropdown_label", class: { error: !!this.errorMessage } }, this.label && (h("p", null, h("span", { class: "label" }, this.label), this.required && h("span", { class: "required" }, "*"))), h("button", { key: 'a64e6e066a0e3b5c2436ea4ada9582995f416674', part: "sd_dropdown-button", class: { dropbtn: true, open: this.isOpen, error: !!this.errorMessage }, onClick: () => this.toggleDropdown(), "aria-haspopup": "listbox", "aria-expanded": this.isOpen ? 'true' : 'false', "aria-label": this.name, onKeyDown: e => this.handleSelectButtonKeyDown(e) }, h("slot", { key: '5558be7313b2513877366e5cc90c14059ca7a3d1', name: "select-icon", "aria-hidden": "true" }), h("span", { key: '561f266038fa16b3422974b2bd6b5e7dcfeb1577', class: "selected-option", part: "sd_dropdown-button-selected-label" }, this.selectedOption?.label ? `${this.selectedOption?.label + this.pluralizedLabel}` : ''), h("span", { key: '87308c6804530032c5e22750f8753e2589576d00', class: {
+        return (h("div", { key: '8c4d201f5fa71b9707a1cb50adc62399f32e5aba', class: "dropdown", part: "sd_dropdown" }, h("label", { key: 'b2e4851e2925d7e44c36a538a28001a838124cba', part: "sd_dropdown_label", class: { error: !!this.errorMessage } }, this.label && (h("p", null, h("span", { class: "label" }, this.label), this.required && h("span", { class: "required" }, "*"))), h("button", { key: '66559916660643e8ed8ed67bf821fa2eb122ea6c', part: "sd_dropdown-button", class: { dropbtn: true, open: this.isOpen, error: !!this.errorMessage }, onClick: () => this.toggleDropdown(), "aria-haspopup": "listbox", "aria-expanded": this.isOpen ? 'true' : 'false', "aria-label": this.name, onKeyDown: e => this.handleSelectButtonKeyDown(e) }, h("slot", { key: '2916f44530f59d218171c54dfe7a6949b3f773c4', name: "select-icon", "aria-hidden": "true" }), h("span", { key: '21653fb2f1225a0f9d64b6939da10b66eeeb8fcc', class: "selected-option", part: "sd_dropdown-button-selected-label" }, this.selectedOption?.label ? `${this.selectedOption?.label + this.pluralizedLabel}` : ''), h("span", { key: '900f31e8a1ca22a3be2f4ca965bdaa9099ef3fca', class: {
                 open: this.isOpen,
                 closed: !this.isOpen,
                 chevron: true,
-            }, "aria-hidden": "true" }, h("chevron-icon", { key: '47be995d85c4e3c3895785f41c89a8a23d0d1a64', width: "16", height: "16" }))), this.errorMessage && h("span", { class: "error help-text" }, this.errorMessage)), this.isOpen ? (h("div", { class: "dropdown-content", part: "sd_dropdown-content" }, this.withSearch && (h("div", { class: { 'search-box': true, 'open': this.isOpen } }, h("search-icon", { width: "15", height: "15", class: 'icon' }), h("input", { type: "text", role: "combobox", placeholder: "Search", value: this.searchValue, ref: el => (this.inputRef = el), onInput: event => this.filterOptions(event), onKeyDown: e => this.handleComboboxKeyDown(e) }))), h("ul", { tabindex: "-1", role: "listbox", "aria-label": this.name, "aria-activedescendant": this.ariaActivedescendant, onKeyDown: e => this.handleListboxKeydown(e) }, this.filteredOptions.map(option => option.value && (h("li", { tabindex: "0", key: option.value, id: option.value, onClick: () => this.selectOption(option), role: "option" }, option.labelHTML ? option.labelHTML : option.label)))))) : null));
+            }, "aria-hidden": "true" }, h("chevron-icon", { key: 'd0a08c205df0a9258b699618cad25eff5085fe84', width: "16", height: "16" }))), this.errorMessage && h("span", { class: "error help-text" }, this.errorMessage)), this.isOpen ? (h("div", { class: "dropdown-content", part: "sd_dropdown-content" }, this.withSearch && (h("div", { class: { 'search-box': true, 'open': this.isOpen } }, h("search-icon", { width: "15", height: "15", class: 'icon' }), h("input", { type: "text", role: "combobox", placeholder: "Search", value: this.searchValue, ref: el => (this.inputRef = el), onInput: event => this.filterOptions(event), onKeyDown: e => this.handleComboboxKeyDown(e) }))), h("ul", { tabindex: "-1", role: "listbox", "aria-label": this.name, "aria-activedescendant": this.ariaActivedescendant, onKeyDown: e => this.handleListboxKeydown(e) }, this.filteredOptions.map(option => option.value && (h("li", { tabindex: "0", key: option.value, id: option.value, onClick: () => this.selectOption(option), role: "option" }, option.labelHTML ? option.labelHTML : option.label)))))) : null));
     }
     get el() { return getElement(this); }
     static get watchers() { return {

package/dist/esm/chevron-icon_3.entry.js.map CHANGED Viewed

	@@ -1 +1 @@
1	- {"file":"chevron-icon.search-icon.select-dropdown.entry.js","mappings":"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","names":["iconCss"],"sources":["src/common/icons/icon.css?tag=chevron-icon&encapsulation=scoped","src/common/icons/chevron.tsx","src/common/icons/icon.css?tag=search-icon&encapsulation=scoped","src/common/icons/search.tsx","src/components/design-system/select-dropdown/select-dropdown.scss?tag=select-dropdown&encapsulation=shadow","src/components/design-system/select-dropdown/select-dropdown.tsx"],"sourcesContent":[":host {\n display: flex;\n}\n","import { Component, Prop, h } from '@stencil/core';\n\n@Component({\n tag: 'chevron-icon',\n styleUrl: 'icon.css',\n scoped: true,\n})\nexport class ChevronIcon {\n @Prop() width: string = '24';\n @Prop() height: string = '24';\n\n render() {\n return (\n <svg xmlns=\"http://www.w3.org/2000/svg\" width={this.width} height={this.height} viewBox=\"0 0 24 24\" fill=\"none\">\n <path fill=\"currentColor\" d=\"M15.53 4.22a.75.75 0 0 1 0 1.06L8.81 12l6.72 6.72a.75.75 0 1 1-1.06 1.06l-7.25-7.25a.75.75 0 0 1 0-1.06l7.25-7.25a.75.75 0 0 1 1.06 0Z\" />\n </svg>\n );\n }\n}\n",":host {\n display: flex;\n}\n","import { Component, Prop, h } from '@stencil/core';\n\n@Component({\n tag: 'search-icon',\n styleUrl: 'icon.css',\n scoped: true,\n})\nexport class SearchIcon {\n @Prop() width: string = '15';\n @Prop() height: string = '15';\n\n render() {\n return (\n <svg width={this.width} height={this.height} fill=\"none\" xmlns=\"http://www.w3.org/2000/svg\">\n <path\n fill=\"currentColor\"\n d=\"M5.5 0C8.53757 0 11 2.46243 11 5.5C11 6.83879 10.5217 8.06586 9.72656 9.01962L13.8536 13.1464C14.0488 13.3417 14.0488 13.6583 13.8536 13.8536C13.68 14.0271 13.4106 14.0464 13.2157 13.9114L13.1464 13.8536L9.01962 9.72656C8.06586 10.5217 6.83879 11 5.5 11C2.46243 11 0 8.53757 0 5.5C0 2.46243 2.46243 0 5.5 0ZM5.5 1C3.01472 1 1 3.01472 1 5.5C1 7.98528 3.01472 10 5.5 10C7.98528 10 10 7.98528 10 5.5C10 3.01472 7.98528 1 5.5 1Z\"\n />\n </svg>\n );\n }\n}\n","@import '../../../common/styles/variables.scss';\n@import '../../../common/mixins/inputs.scss';\n\n:host {\n display: block;\n position: relative;\n @media #{$mobile} {\n position: unset;\n }\n @include default-css-variables;\n width: 100%;\n}\n\nlabel {\n @include input-label;\n flex-direction: column;\n gap: 4px;\n font-family: var(--nylas-font-family);\n font-size: 16px;\n color: var(--nylas-base-800);\n p {\n margin: 0;\n }\n .error {\n color: var(--nylas-error);\n }\n}\n\n.dropdown {\n display: inline-block;\n width: inherit;\n}\n\n.dropbtn {\n color: var(--nylas-base-800);\n padding: 14px;\n font-size: 1rem;\n font-family: var(--nylas-font-family);\n cursor: pointer;\n display: flex;\n justify-content: space-between;\n gap: 0.5rem;\n background: transparent;\n border: 1px solid var(--nylas-base-300);\n border-radius: var(--nylas-border-radius-2x);\n &.error {\n border: 1px solid var(--nylas-error);\n }\n &.focus {\n background: transparent;\n }\n &:hover,\n &:active {\n outline: 1px solid var(--nylas-primary);\n }\n &:active {\n outline: 2px solid var(--nylas-primary);\n }\n span {\n &.chevron {\n display: flex;\n align-self: center;\n }\n &.open {\n transform: rotate(90deg);\n }\n &.closed {\n transform: rotate(270deg);\n }\n &.selected-option {\n text-overflow: ellipsis;\n overflow: hidden;\n white-space: nowrap;\n max-width: 144px;\n font-size: 14px;\n line-height: 20px;\n @media #{$mobile} {\n max-width: 124px;\n font-size: 16px;\n }\n }\n }\n}\n\n.dropdown-content {\n display: block;\n margin-top: 0.5rem;\n background-color: var(--nylas-base-0);\n width: 100%;\n max-height: 336px;\n overflow: auto;\n z-index: 1;\n border-radius: 4px;\n position: absolute;\n @media #{$mobile} {\n right: 0;\n width: 325px;\n max-width: unset;\n }\n box-shadow: 0px 4px 6px -2px rgba(0, 0, 0, 0.05);\n box-shadow: 0px 10px 15px -3px rgba(0, 0, 0, 0.1);\n}\n\n.search-box {\n border-bottom: 1px solid var(--nylas-base-200);\n padding: 10px;\n position: sticky;\n top: 0;\n background: var(--nylas-base-0);\n .icon {\n position: absolute;\n top: 1.25rem;\n left: 1.25rem;\n color: var(--nylas-base-300);\n }\n}\n\n.dropdown-content ul {\n padding: 0;\n list-style-type: none;\n color: var(--nylas-base-900);\n max-height: 336px;\n li {\n padding: 16px, 12px, 16px, 12px;\n color: black;\n padding: 12px 16px;\n text-decoration: none;\n display: block;\n font-family: inherit;\n font-size: 14px;\n font-weight: 400;\n line-height: 20px;\n letter-spacing: 0px;\n text-align: left;\n cursor: pointer;\n &:hover,\n &:focus {\n background-color: var(--nylas-base-100);\n }\n }\n}\n\n.dropdown-content .selected {\n background-color: #e7e7e7;\n}\n\ninput[type='text'] {\n width: -webkit-fill-available;\n padding: inherit;\n border: 1px solid #ccc;\n border-radius: 4px;\n position: sticky;\n background: no-repeat scroll 7px 7px;\n padding-left: 30px;\n background-size: 16px 16px;\n}\n","import { Component, Element, Event, EventEmitter, h, Listen, Prop, State, Watch } from '@stencil/core';\n\ninterface DropdownOption {\n labelHTML?: HTMLElement;\n label: string;\n value: string;\n}\n\n/*\n The `select-dropdown` component is a dropdown that allows users to select an option from a list of options.\n * @part sd_dropdown - The dropdown container\n * @part sd_dropdown-button - The dropdown button\n * @part sd_dropdown-button-selected-label - The selected option label\n * @part sd_dropdown-content - The dropdown content\n * @part sd_dropdown_label - The dropdown label\n /\n@Component({\n tag: 'select-dropdown',\n styleUrl: 'select-dropdown.scss',\n shadow: true,\n})\nexport class SelectDropdown {\n @Element() el!: HTMLElement;\n\n private inputRef?: HTMLInputElement;\n\n // Props\n /\n The name of the dropdown\n /\n @Prop() name!: string;\n /\n The options to display in the dropdown\n /\n @Prop() options: DropdownOption[] = [];\n /\n The default selected option\n /\n @Prop() defaultSelectedOption?: DropdownOption;\n /\n Should show search input\n /\n @Prop() withSearch: boolean = true;\n\n /\n The label for the dropdown, skipped if no label is provided\n /\n @Prop() label?: string;\n\n /\n If true, the dropdown is required for form submission\n /\n @Prop() required: boolean = false;\n\n /\n Show pluralized label for the selected option. This is s tring that is appended to the selected option label as a suffix.\n /\n @Prop() pluralizedLabel: string = '';\n\n // States\n /\n The selected option\n /\n @State() selectedOption: DropdownOption \| null = this.defaultSelectedOption \|\| null;\n /\n The open state of the dropdown\n /\n @State() isOpen: boolean = false;\n /\n The search value for the dropdown\n /\n @State() searchValue: string = '';\n /\n The filtered options based on the search value\n /\n @State() filteredOptions: DropdownOption[] = [...this.options];\n /\n The aria-activedescendant attribute for the listbox element to indicate the currently active\n * option in the list box to screen readers. The value of aria-activedescendant is the ID of\n * the active option.\n /\n @State() ariaActivedescendant: string = '';\n\n /\n The error message to display when the value is empty or null and the dropdown is required\n /\n @State() errorMessage: string = '';\n\n // Events\n /\n This event is fired when the selected option is changed\n /\n @Event({ bubbles: true, composed: true }) nylasFormDropdownChanged!: EventEmitter<{\n value: DropdownOption['value'];\n name: string;\n error?: string;\n label?: string;\n }>;\n\n @Watch('options')\n optionsChangedHandler(newValue: DropdownOption[], oldValue: DropdownOption[]) {\n if (newValue === oldValue) {\n return;\n }\n this.filteredOptions = newValue;\n }\n\n @Watch('defaultSelectedOption')\n defaultSelectedOptionChangedHandler(newValue: DropdownOption, oldValue: DropdownOption) {\n if (newValue.label === oldValue.label) {\n return;\n }\n this.selectedOption = newValue;\n }\n\n // Lifecycle methods\n componentWillLoad() {\n this.filteredOptions = this.options;\n // Set the selected option to the first option if no option is selected\n if (!this.selectedOption && !!this.defaultSelectedOption) {\n this.selectedOption = this.defaultSelectedOption;\n }\n if (!this.selectedOption && this.options.length > 0) {\n this.selectedOption = this.options[0];\n }\n }\n\n // Event listeners\n /\n Listen for the bookingFormSubmitted event to validate the input value when the form is submitted.\n /\n @Listen('bookingFormSubmitted', { target: 'document' })\n handleBookingFormSubmitted(event: CustomEvent) {\n this.validate(this.selectedOption?.value \|\| '');\n if (this.errorMessage) {\n event.preventDefault();\n }\n }\n\n // Methods\n validate(value: string) {\n if (this.required && !value) {\n this.errorMessage = `${this.label} is required.`;\n } else {\n this.errorMessage = '';\n }\n }\n toggleDropdown(): void {\n this.isOpen = !this.isOpen;\n }\n\n filterOptions(event: Event): void {\n const value = (event.target as HTMLInputElement).value;\n this.searchValue = value;\n this.filteredOptions = this.options.filter(option => option.label.toLowerCase().includes(value.toLowerCase()));\n }\n\n selectOption(option: DropdownOption): void {\n this.errorMessage = '';\n this.selectedOption = option;\n this.toggleDropdown();\n this.nylasFormDropdownChanged.emit({\n value: option.value,\n name: this.name,\n error: this.errorMessage,\n label: this.label,\n });\n }\n\n handleSelectButtonKeyDown(event: KeyboardEvent): void {\n switch (event.key) {\n case 'ArrowDown':\n case 'Enter':\n event.preventDefault();\n if (!this.isOpen) {\n this.toggleDropdown();\n }\n this.inputRef?.focus();\n break;\n case 'Escape':\n this.isOpen = false;\n break;\n }\n }\n\n handleListboxKeydown(e) {\n const items = this.filteredOptions; // Assuming this is the array of your current filtered options\n const currentIndex = items.findIndex(item => item.value === this.ariaActivedescendant);\n if (e.key === 'ArrowDown' \|\| (e.key === 'Tab' && !e.shiftKey)) {\n e.preventDefault();\n if (currentIndex === items.length - 1) {\n this.ariaActivedescendant = '';\n this.inputRef?.focus();\n return;\n }\n const nextIndex = currentIndex + 1 < items.length ? currentIndex + 1 : 0;\n this.ariaActivedescendant = items[nextIndex].value;\n this.focusOption(nextIndex);\n } else if (e.key === 'ArrowUp' \|\| (e.key === 'Tab' && e.shiftKey)) {\n e.preventDefault();\n if (currentIndex === 0) {\n this.ariaActivedescendant = '';\n this.inputRef?.focus();\n return;\n }\n const prevIndex = currentIndex - 1 >= 0 ? currentIndex - 1 : items.length - 1;\n this.ariaActivedescendant = items[prevIndex].value;\n this.focusOption(prevIndex);\n } else if (e.key === 'Enter') {\n e.preventDefault();\n if (this.ariaActivedescendant) {\n this.selectOption(items[currentIndex]);\n }\n } else if (e.key === 'Escape') {\n this.isOpen = false;\n }\n }\n\n focusOption(index) {\n const option = this.filteredOptions[index];\n if (!option) return; // Guard clause in case index is out of bounds\n\n const elementId = option.value;\n const element = this.el.shadowRoot?.getElementById(elementId) as HTMLLIElement;\n\n if (element) {\n element.focus(); // Set focus on the element\n element.scrollIntoView({ behavior: 'smooth', block: 'nearest' });\n }\n }\n\n handleComboboxKeyDown(event: KeyboardEvent): void {\n if (event.key === 'ArrowDown' \|\| (event.key == 'Tab' && !event.shiftKey)) {\n event.preventDefault();\n this.ariaActivedescendant = this.filteredOptions[0].value;\n this.focusOption(0);\n } else if (event.key === 'ArrowUp' \|\| (event.key === 'Tab' && event.shiftKey)) {\n event.preventDefault();\n this.ariaActivedescendant = this.filteredOptions[this.filteredOptions.length - 1].value;\n this.focusOption(this.filteredOptions.length - 1);\n } else if (event.key === 'Escape') {\n this.isOpen = false;\n }\n }\n\n // Event listeners\n @Listen('click', { target: 'document', capture: true })\n handleOutsideClick(event: MouseEvent) {\n // Get the path of the event\n const path = event.composedPath();\n\n // Check if the path includes the host element\n const isClickInside = path.includes(this.el);\n\n if (!isClickInside && this.isOpen) {\n this.isOpen = false;\n }\n }\n\n render() {\n return (\n <div class=\"dropdown\" part=\"sd_dropdown\">\n <label part=\"sd_dropdown_label\" class={{ error: !!this.errorMessage }}>\n {this.label && (\n <p>\n <span class=\"label\">{this.label}</span>\n {this.required && <span class=\"required\"></span>}\n </p>\n )}\n <button\n part=\"sd_dropdown-button\"\n class={{ dropbtn: true, open: this.isOpen, error: !!this.errorMessage }}\n onClick={() => this.toggleDropdown()}\n aria-haspopup=\"listbox\"\n aria-expanded={this.isOpen ? 'true' : 'false'}\n aria-label={this.name}\n onKeyDown={e => this.handleSelectButtonKeyDown(e)}\n >\n <slot name=\"select-icon\" aria-hidden=\"true\"></slot>\n <span class=\"selected-option\" part=\"sd_dropdown-button-selected-label\">\n {this.selectedOption?.label ? `${this.selectedOption?.label + this.pluralizedLabel}` : ''}\n </span>\n <span\n class={{\n open: this.isOpen,\n closed: !this.isOpen,\n chevron: true,\n }}\n aria-hidden=\"true\"\n >\n <chevron-icon width=\"16\" height=\"16\" />\n </span>\n </button>\n {this.errorMessage && <span class=\"error help-text\">{this.errorMessage}</span>}\n </label>\n\n {this.isOpen ? (\n <div class=\"dropdown-content\" part=\"sd_dropdown-content\">\n {this.withSearch && (\n <div class={{ 'search-box': true, 'open': this.isOpen }}>\n <search-icon width=\"15\" height=\"15\" class={'icon'} />\n <input\n type=\"text\"\n role=\"combobox\"\n placeholder=\"Search\"\n value={this.searchValue}\n ref={el => (this.inputRef = el)}\n onInput={event => this.filterOptions(event)}\n onKeyDown={e => this.handleComboboxKeyDown(e)}\n />\n </div>\n )}\n <ul tabindex=\"-1\" role=\"listbox\" aria-label={this.name} aria-activedescendant={this.ariaActivedescendant} onKeyDown={e => this.handleListboxKeydown(e)}>\n {this.filteredOptions.map(\n option =>\n option.value && (\n <li tabindex=\"0\" key={option.value} id={option.value} onClick={() => this.selectOption(option)} role=\"option\">\n {option.labelHTML ? option.labelHTML : option.label}\n </li>\n ),\n )}\n </ul>\n </div>\n ) : null}\n </div>\n );\n }\n}\n"],"version":3}
1	+ {"file":"chevron-icon.search-icon.select-dropdown.entry.js","mappings":"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","names":["iconCss"],"sources":["src/common/icons/icon.css?tag=chevron-icon&encapsulation=scoped","src/common/icons/chevron.tsx","src/common/icons/icon.css?tag=search-icon&encapsulation=scoped","src/common/icons/search.tsx","src/components/design-system/select-dropdown/select-dropdown.scss?tag=select-dropdown&encapsulation=shadow","src/components/design-system/select-dropdown/select-dropdown.tsx"],"sourcesContent":[":host {\n display: flex;\n}\n","import { Component, Prop, h } from '@stencil/core';\n\n@Component({\n tag: 'chevron-icon',\n styleUrl: 'icon.css',\n scoped: true,\n})\nexport class ChevronIcon {\n @Prop() width: string = '24';\n @Prop() height: string = '24';\n\n render() {\n return (\n <svg xmlns=\"http://www.w3.org/2000/svg\" width={this.width} height={this.height} viewBox=\"0 0 24 24\" fill=\"none\">\n <path fill=\"currentColor\" d=\"M15.53 4.22a.75.75 0 0 1 0 1.06L8.81 12l6.72 6.72a.75.75 0 1 1-1.06 1.06l-7.25-7.25a.75.75 0 0 1 0-1.06l7.25-7.25a.75.75 0 0 1 1.06 0Z\" />\n </svg>\n );\n }\n}\n",":host {\n display: flex;\n}\n","import { Component, Prop, h } from '@stencil/core';\n\n@Component({\n tag: 'search-icon',\n styleUrl: 'icon.css',\n scoped: true,\n})\nexport class SearchIcon {\n @Prop() width: string = '15';\n @Prop() height: string = '15';\n\n render() {\n return (\n <svg width={this.width} height={this.height} fill=\"none\" xmlns=\"http://www.w3.org/2000/svg\">\n <path\n fill=\"currentColor\"\n d=\"M5.5 0C8.53757 0 11 2.46243 11 5.5C11 6.83879 10.5217 8.06586 9.72656 9.01962L13.8536 13.1464C14.0488 13.3417 14.0488 13.6583 13.8536 13.8536C13.68 14.0271 13.4106 14.0464 13.2157 13.9114L13.1464 13.8536L9.01962 9.72656C8.06586 10.5217 6.83879 11 5.5 11C2.46243 11 0 8.53757 0 5.5C0 2.46243 2.46243 0 5.5 0ZM5.5 1C3.01472 1 1 3.01472 1 5.5C1 7.98528 3.01472 10 5.5 10C7.98528 10 10 7.98528 10 5.5C10 3.01472 7.98528 1 5.5 1Z\"\n />\n </svg>\n );\n }\n}\n","@import '../../../common/styles/variables.scss';\n@import '../../../common/mixins/inputs.scss';\n\n:host {\n display: block;\n position: relative;\n @media #{$mobile} {\n position: unset;\n }\n @include default-css-variables;\n width: 100%;\n}\n\nlabel {\n @include input-label;\n flex-direction: column;\n gap: 4px;\n font-family: var(--nylas-font-family);\n font-size: 16px;\n color: var(--nylas-base-800);\n p {\n margin: 0;\n }\n .error {\n color: var(--nylas-error);\n }\n}\n\n.dropdown {\n display: inline-block;\n width: inherit;\n}\n\n.dropbtn {\n color: var(--nylas-base-800);\n padding: 14px;\n font-size: 1rem;\n font-family: var(--nylas-font-family);\n cursor: pointer;\n display: flex;\n justify-content: space-between;\n gap: 0.5rem;\n background: transparent;\n border: 1px solid var(--nylas-base-300);\n border-radius: var(--nylas-border-radius-2x);\n &.error {\n border: 1px solid var(--nylas-error);\n }\n &.focus {\n background: transparent;\n }\n &:hover,\n &:active {\n outline: 1px solid var(--nylas-primary);\n }\n &:active {\n outline: 2px solid var(--nylas-primary);\n }\n span {\n &.chevron {\n display: flex;\n align-self: center;\n }\n &.open {\n transform: rotate(90deg);\n }\n &.closed {\n transform: rotate(270deg);\n }\n &.selected-option {\n text-overflow: ellipsis;\n overflow: hidden;\n white-space: nowrap;\n max-width: 144px;\n font-size: 14px;\n line-height: 20px;\n @media #{$mobile} {\n max-width: 124px;\n font-size: 16px;\n }\n }\n }\n}\n\n.dropdown-content {\n display: block;\n margin-top: 0.5rem;\n background-color: var(--nylas-base-0);\n width: 100%;\n max-height: 336px;\n overflow: auto;\n z-index: 1;\n border-radius: 4px;\n position: absolute;\n @media #{$mobile} {\n right: 0;\n width: 325px;\n max-width: unset;\n }\n box-shadow: 0px 4px 6px -2px rgba(0, 0, 0, 0.05);\n box-shadow: 0px 10px 15px -3px rgba(0, 0, 0, 0.1);\n}\n\n.search-box {\n border-bottom: 1px solid var(--nylas-base-200);\n padding: 10px;\n position: sticky;\n top: 0;\n background: var(--nylas-base-0);\n .icon {\n position: absolute;\n top: 1.25rem;\n left: 1.25rem;\n color: var(--nylas-base-300);\n }\n}\n\n.dropdown-content ul {\n padding: 0;\n list-style-type: none;\n color: var(--nylas-base-900);\n max-height: 336px;\n li {\n padding: 16px, 12px, 16px, 12px;\n color: black;\n padding: 12px 16px;\n text-decoration: none;\n display: block;\n font-family: inherit;\n font-size: 14px;\n font-weight: 400;\n line-height: 20px;\n letter-spacing: 0px;\n text-align: left;\n cursor: pointer;\n &:hover,\n &:focus {\n background-color: var(--nylas-base-100);\n }\n }\n}\n\n.dropdown-content .selected {\n background-color: #e7e7e7;\n}\n\ninput[type='text'] {\n width: -webkit-fill-available;\n padding: inherit;\n border: 1px solid #ccc;\n border-radius: 4px;\n position: sticky;\n background: no-repeat scroll 7px 7px;\n padding-left: 30px;\n background-size: 16px 16px;\n}\n","import { Component, Element, Event, EventEmitter, h, Listen, Prop, State, Watch } from '@stencil/core';\n\ninterface DropdownOption {\n labelHTML?: HTMLElement;\n label: string;\n value: string;\n}\n\n/*\n The `select-dropdown` component is a dropdown that allows users to select an option from a list of options.\n * @part sd_dropdown - The dropdown container\n * @part sd_dropdown-button - The dropdown button\n * @part sd_dropdown-button-selected-label - The selected option label\n * @part sd_dropdown-content - The dropdown content\n * @part sd_dropdown_label - The dropdown label\n /\n@Component({\n tag: 'select-dropdown',\n styleUrl: 'select-dropdown.scss',\n shadow: true,\n})\nexport class SelectDropdown {\n @Element() el!: HTMLElement;\n\n private inputRef?: HTMLInputElement;\n\n // Props\n /\n The name of the dropdown\n /\n @Prop() name!: string;\n /\n The options to display in the dropdown\n /\n @Prop() options: DropdownOption[] = [];\n /\n The default selected option\n /\n @Prop() defaultSelectedOption?: DropdownOption;\n /\n Should show search input\n /\n @Prop() withSearch: boolean = true;\n\n /\n The label for the dropdown, skipped if no label is provided\n /\n @Prop() label?: string;\n\n /\n If true, the dropdown is required for form submission\n /\n @Prop() required: boolean = false;\n\n /\n Show pluralized label for the selected option. This is s tring that is appended to the selected option label as a suffix.\n /\n @Prop() pluralizedLabel: string = '';\n\n // States\n /\n The selected option\n /\n @State() selectedOption: DropdownOption \| null = this.defaultSelectedOption \|\| null;\n /\n The open state of the dropdown\n /\n @State() isOpen: boolean = false;\n /\n The search value for the dropdown\n /\n @State() searchValue: string = '';\n /\n The filtered options based on the search value\n /\n @State() filteredOptions: DropdownOption[] = [...this.options];\n /\n The aria-activedescendant attribute for the listbox element to indicate the currently active\n * option in the list box to screen readers. The value of aria-activedescendant is the ID of\n * the active option.\n /\n @State() ariaActivedescendant: string = '';\n\n /\n The error message to display when the value is empty or null and the dropdown is required\n /\n @State() errorMessage: string = '';\n\n // Events\n /\n This event is fired when the selected option is changed\n /\n @Event({ bubbles: true, composed: true }) nylasFormDropdownChanged!: EventEmitter<{\n value: DropdownOption['value'];\n name: string;\n error?: string;\n label?: string;\n }>;\n\n @Watch('options')\n optionsChangedHandler(newValue: DropdownOption[], oldValue: DropdownOption[]) {\n if (newValue === oldValue) {\n return;\n }\n this.filteredOptions = newValue;\n }\n\n @Watch('defaultSelectedOption')\n defaultSelectedOptionChangedHandler(newValue: DropdownOption, oldValue: DropdownOption) {\n if (typeof newValue === 'undefined' \|\| newValue?.label === oldValue?.label) {\n return;\n }\n this.selectedOption = newValue;\n }\n\n // Lifecycle methods\n componentWillLoad() {\n this.filteredOptions = this.options;\n // Set the selected option to the first option if no option is selected\n if (!this.selectedOption && !!this.defaultSelectedOption) {\n this.selectedOption = this.defaultSelectedOption;\n }\n if (!this.selectedOption && this.options.length > 0) {\n this.selectedOption = this.options[0];\n }\n }\n\n // Event listeners\n /\n Listen for the bookingFormSubmitted event to validate the input value when the form is submitted.\n /\n @Listen('bookingFormSubmitted', { target: 'document' })\n handleBookingFormSubmitted(event: CustomEvent) {\n this.validate(this.selectedOption?.value \|\| '');\n if (this.errorMessage) {\n event.preventDefault();\n }\n }\n\n // Methods\n validate(value: string) {\n if (this.required && !value) {\n this.errorMessage = `${this.label} is required.`;\n } else {\n this.errorMessage = '';\n }\n }\n toggleDropdown(): void {\n this.isOpen = !this.isOpen;\n }\n\n filterOptions(event: Event): void {\n const value = (event.target as HTMLInputElement).value;\n this.searchValue = value;\n this.filteredOptions = this.options.filter(option => option.label.toLowerCase().includes(value.toLowerCase()));\n }\n\n selectOption(option: DropdownOption): void {\n this.errorMessage = '';\n this.selectedOption = option;\n this.toggleDropdown();\n this.nylasFormDropdownChanged.emit({\n value: option.value,\n name: this.name,\n error: this.errorMessage,\n label: this.label,\n });\n }\n\n handleSelectButtonKeyDown(event: KeyboardEvent): void {\n switch (event.key) {\n case 'ArrowDown':\n case 'Enter':\n event.preventDefault();\n if (!this.isOpen) {\n this.toggleDropdown();\n }\n this.inputRef?.focus();\n break;\n case 'Escape':\n this.isOpen = false;\n break;\n }\n }\n\n handleListboxKeydown(e) {\n const items = this.filteredOptions; // Assuming this is the array of your current filtered options\n const currentIndex = items.findIndex(item => item.value === this.ariaActivedescendant);\n if (e.key === 'ArrowDown' \|\| (e.key === 'Tab' && !e.shiftKey)) {\n e.preventDefault();\n if (currentIndex === items.length - 1) {\n this.ariaActivedescendant = '';\n this.inputRef?.focus();\n return;\n }\n const nextIndex = currentIndex + 1 < items.length ? currentIndex + 1 : 0;\n this.ariaActivedescendant = items[nextIndex].value;\n this.focusOption(nextIndex);\n } else if (e.key === 'ArrowUp' \|\| (e.key === 'Tab' && e.shiftKey)) {\n e.preventDefault();\n if (currentIndex === 0) {\n this.ariaActivedescendant = '';\n this.inputRef?.focus();\n return;\n }\n const prevIndex = currentIndex - 1 >= 0 ? currentIndex - 1 : items.length - 1;\n this.ariaActivedescendant = items[prevIndex].value;\n this.focusOption(prevIndex);\n } else if (e.key === 'Enter') {\n e.preventDefault();\n if (this.ariaActivedescendant) {\n this.selectOption(items[currentIndex]);\n }\n } else if (e.key === 'Escape') {\n this.isOpen = false;\n }\n }\n\n focusOption(index) {\n const option = this.filteredOptions[index];\n if (!option) return; // Guard clause in case index is out of bounds\n\n const elementId = option.value;\n const element = this.el.shadowRoot?.getElementById(elementId) as HTMLLIElement;\n\n if (element) {\n element.focus(); // Set focus on the element\n element.scrollIntoView({ behavior: 'smooth', block: 'nearest' });\n }\n }\n\n handleComboboxKeyDown(event: KeyboardEvent): void {\n if (event.key === 'ArrowDown' \|\| (event.key == 'Tab' && !event.shiftKey)) {\n event.preventDefault();\n this.ariaActivedescendant = this.filteredOptions[0].value;\n this.focusOption(0);\n } else if (event.key === 'ArrowUp' \|\| (event.key === 'Tab' && event.shiftKey)) {\n event.preventDefault();\n this.ariaActivedescendant = this.filteredOptions[this.filteredOptions.length - 1].value;\n this.focusOption(this.filteredOptions.length - 1);\n } else if (event.key === 'Escape') {\n this.isOpen = false;\n }\n }\n\n // Event listeners\n @Listen('click', { target: 'document', capture: true })\n handleOutsideClick(event: MouseEvent) {\n // Get the path of the event\n const path = event.composedPath();\n\n // Check if the path includes the host element\n const isClickInside = path.includes(this.el);\n\n if (!isClickInside && this.isOpen) {\n this.isOpen = false;\n }\n }\n\n render() {\n return (\n <div class=\"dropdown\" part=\"sd_dropdown\">\n <label part=\"sd_dropdown_label\" class={{ error: !!this.errorMessage }}>\n {this.label && (\n <p>\n <span class=\"label\">{this.label}</span>\n {this.required && <span class=\"required\"></span>}\n </p>\n )}\n <button\n part=\"sd_dropdown-button\"\n class={{ dropbtn: true, open: this.isOpen, error: !!this.errorMessage }}\n onClick={() => this.toggleDropdown()}\n aria-haspopup=\"listbox\"\n aria-expanded={this.isOpen ? 'true' : 'false'}\n aria-label={this.name}\n onKeyDown={e => this.handleSelectButtonKeyDown(e)}\n >\n <slot name=\"select-icon\" aria-hidden=\"true\"></slot>\n <span class=\"selected-option\" part=\"sd_dropdown-button-selected-label\">\n {this.selectedOption?.label ? `${this.selectedOption?.label + this.pluralizedLabel}` : ''}\n </span>\n <span\n class={{\n open: this.isOpen,\n closed: !this.isOpen,\n chevron: true,\n }}\n aria-hidden=\"true\"\n >\n <chevron-icon width=\"16\" height=\"16\" />\n </span>\n </button>\n {this.errorMessage && <span class=\"error help-text\">{this.errorMessage}</span>}\n </label>\n\n {this.isOpen ? (\n <div class=\"dropdown-content\" part=\"sd_dropdown-content\">\n {this.withSearch && (\n <div class={{ 'search-box': true, 'open': this.isOpen }}>\n <search-icon width=\"15\" height=\"15\" class={'icon'} />\n <input\n type=\"text\"\n role=\"combobox\"\n placeholder=\"Search\"\n value={this.searchValue}\n ref={el => (this.inputRef = el)}\n onInput={event => this.filterOptions(event)}\n onKeyDown={e => this.handleComboboxKeyDown(e)}\n />\n </div>\n )}\n <ul tabindex=\"-1\" role=\"listbox\" aria-label={this.name} aria-activedescendant={this.ariaActivedescendant} onKeyDown={e => this.handleListboxKeydown(e)}>\n {this.filteredOptions.map(\n option =>\n option.value && (\n <li tabindex=\"0\" key={option.value} id={option.value} onClick={() => this.selectOption(option)} role=\"option\">\n {option.labelHTML ? option.labelHTML : option.label}\n </li>\n ),\n )}\n </ul>\n </div>\n ) : null}\n </div>\n );\n }\n}\n"],"version":3}

package/dist/esm/clock-icon.entry.js CHANGED Viewed

@@ -9,7 +9,7 @@ const ClockIcon = class {
         this.height = '16';
     }
     render() {
-        return (h("svg", { key: '636b2338bb2426b55b87ee5d0fe88ba5c2e11a81', width: this.width, height: this.height, fill: "none", xmlns: "http://www.w3.org/2000/svg" }, h("path", { key: '1df6ceceaf9d7a5192e10ab4048363ec262bd9d1', d: "M8 0.5C12.1421 0.5 15.5 3.85786 15.5 8C15.5 12.1421 12.1421 15.5 8 15.5C3.85786 15.5 0.5 12.1421 0.5 8C0.5 3.85786 3.85786 0.5 8 0.5ZM8 1.4375C4.37563 1.4375 1.4375 4.37563 1.4375 8C1.4375 11.6244 4.37563 14.5625 8 14.5625C11.6244 14.5625 14.5625 11.6244 14.5625 8C14.5625 4.37563 11.6244 1.4375 8 1.4375ZM7.53125 3.3125C7.76137 3.3125 7.95276 3.47832 7.99245 3.69699L8 3.78125V8H10.3438C10.6026 8 10.8125 8.20987 10.8125 8.46875C10.8125 8.69887 10.6467 8.89026 10.428 8.92995L10.3438 8.9375H7.53125C7.30113 8.9375 7.10974 8.77168 7.07005 8.55301L7.0625 8.46875V3.78125C7.0625 3.52237 7.27237 3.3125 7.53125 3.3125Z", fill: "currentColor" })));
+        return (h("svg", { key: '63d2d06255adf5ee8ba71b9ae22c27a92b9a069b', width: this.width, height: this.height, fill: "none", xmlns: "http://www.w3.org/2000/svg" }, h("path", { key: '79770fc09cc2b4c2d715ff15529a6e8f525ddd1c', d: "M8 0.5C12.1421 0.5 15.5 3.85786 15.5 8C15.5 12.1421 12.1421 15.5 8 15.5C3.85786 15.5 0.5 12.1421 0.5 8C0.5 3.85786 3.85786 0.5 8 0.5ZM8 1.4375C4.37563 1.4375 1.4375 4.37563 1.4375 8C1.4375 11.6244 4.37563 14.5625 8 14.5625C11.6244 14.5625 14.5625 11.6244 14.5625 8C14.5625 4.37563 11.6244 1.4375 8 1.4375ZM7.53125 3.3125C7.76137 3.3125 7.95276 3.47832 7.99245 3.69699L8 3.78125V8H10.3438C10.6026 8 10.8125 8.20987 10.8125 8.46875C10.8125 8.69887 10.6467 8.89026 10.428 8.92995L10.3438 8.9375H7.53125C7.30113 8.9375 7.10974 8.77168 7.07005 8.55301L7.0625 8.46875V3.78125C7.0625 3.52237 7.27237 3.3125 7.53125 3.3125Z", fill: "currentColor" })));
     }
 };
 ClockIcon.style = iconCss;

package/dist/esm/clock-icon_2.entry.js CHANGED Viewed

@@ -10,7 +10,7 @@ const ClockIcon = class {
         this.height = '16';
     }
     render() {
-        return (h("svg", { key: '636b2338bb2426b55b87ee5d0fe88ba5c2e11a81', width: this.width, height: this.height, fill: "none", xmlns: "http://www.w3.org/2000/svg" }, h("path", { key: '1df6ceceaf9d7a5192e10ab4048363ec262bd9d1', d: "M8 0.5C12.1421 0.5 15.5 3.85786 15.5 8C15.5 12.1421 12.1421 15.5 8 15.5C3.85786 15.5 0.5 12.1421 0.5 8C0.5 3.85786 3.85786 0.5 8 0.5ZM8 1.4375C4.37563 1.4375 1.4375 4.37563 1.4375 8C1.4375 11.6244 4.37563 14.5625 8 14.5625C11.6244 14.5625 14.5625 11.6244 14.5625 8C14.5625 4.37563 11.6244 1.4375 8 1.4375ZM7.53125 3.3125C7.76137 3.3125 7.95276 3.47832 7.99245 3.69699L8 3.78125V8H10.3438C10.6026 8 10.8125 8.20987 10.8125 8.46875C10.8125 8.69887 10.6467 8.89026 10.428 8.92995L10.3438 8.9375H7.53125C7.30113 8.9375 7.10974 8.77168 7.07005 8.55301L7.0625 8.46875V3.78125C7.0625 3.52237 7.27237 3.3125 7.53125 3.3125Z", fill: "currentColor" })));
+        return (h("svg", { key: '63d2d06255adf5ee8ba71b9ae22c27a92b9a069b', width: this.width, height: this.height, fill: "none", xmlns: "http://www.w3.org/2000/svg" }, h("path", { key: '79770fc09cc2b4c2d715ff15529a6e8f525ddd1c', d: "M8 0.5C12.1421 0.5 15.5 3.85786 15.5 8C15.5 12.1421 12.1421 15.5 8 15.5C3.85786 15.5 0.5 12.1421 0.5 8C0.5 3.85786 3.85786 0.5 8 0.5ZM8 1.4375C4.37563 1.4375 1.4375 4.37563 1.4375 8C1.4375 11.6244 4.37563 14.5625 8 14.5625C11.6244 14.5625 14.5625 11.6244 14.5625 8C14.5625 4.37563 11.6244 1.4375 8 1.4375ZM7.53125 3.3125C7.76137 3.3125 7.95276 3.47832 7.99245 3.69699L8 3.78125V8H10.3438C10.6026 8 10.8125 8.20987 10.8125 8.46875C10.8125 8.69887 10.6467 8.89026 10.428 8.92995L10.3438 8.9375H7.53125C7.30113 8.9375 7.10974 8.77168 7.07005 8.55301L7.0625 8.46875V3.78125C7.0625 3.52237 7.27237 3.3125 7.53125 3.3125Z", fill: "currentColor" })));
     }
 };
 ClockIcon.style = ClockIconStyle0;
@@ -25,7 +25,7 @@ const PersonIcon = class {
         this.height = '16';
     }
     render() {
-        return (h("svg", { key: '3793715b5f6a412bb7ab564fb23df18fb29ae066', width: this.width, height: this.height, fill: "none", xmlns: "http://www.w3.org/2000/svg" }, h("path", { key: '29b1ef570e1f3726edc034b6b8c524aa99f0c77f', d: "M7 0C4.79086 0 3 1.79086 3 4C3 6.20914 4.79086 8 7 8C9.20914 8 11 6.20914 11 4C11 1.79086 9.20914 0 7 0ZM4 4C4 2.34315 5.34315 1 7 1C8.65685 1 10 2.34315 10 4C10 5.65685 8.65685 7 7 7C5.34315 7 4 5.65685 4 4ZM2.00873 9C0.903151 9 0 9.88687 0 11C0 12.6912 0.83281 13.9663 2.13499 14.7966C3.41697 15.614 5.14526 16 7 16C8.85474 16 10.583 15.614 11.865 14.7966C13.1672 13.9663 14 12.6912 14 11C14 9.89557 13.1045 9.00001 12 9.00001L2.00873 9ZM1 11C1 10.4467 1.44786 10 2.00873 10L12 10C12.5522 10 13 10.4478 13 11C13 12.3088 12.3777 13.2837 11.3274 13.9534C10.2568 14.636 8.73511 15 7 15C5.26489 15 3.74318 14.636 2.67262 13.9534C1.62226 13.2837 1 12.3088 1 11Z", fill: "currentColor" })));
+        return (h("svg", { key: '55b014fefee568d32972a083bc2aad02b5150fa8', width: this.width, height: this.height, fill: "none", xmlns: "http://www.w3.org/2000/svg" }, h("path", { key: '8129a1e94d2c50afd5a3a375ffe98cf7e7b6374f', d: "M7 0C4.79086 0 3 1.79086 3 4C3 6.20914 4.79086 8 7 8C9.20914 8 11 6.20914 11 4C11 1.79086 9.20914 0 7 0ZM4 4C4 2.34315 5.34315 1 7 1C8.65685 1 10 2.34315 10 4C10 5.65685 8.65685 7 7 7C5.34315 7 4 5.65685 4 4ZM2.00873 9C0.903151 9 0 9.88687 0 11C0 12.6912 0.83281 13.9663 2.13499 14.7966C3.41697 15.614 5.14526 16 7 16C8.85474 16 10.583 15.614 11.865 14.7966C13.1672 13.9663 14 12.6912 14 11C14 9.89557 13.1045 9.00001 12 9.00001L2.00873 9ZM1 11C1 10.4467 1.44786 10 2.00873 10L12 10C12.5522 10 13 10.4478 13 11C13 12.3088 12.3777 13.2837 11.3274 13.9534C10.2568 14.636 8.73511 15 7 15C5.26489 15 3.74318 14.636 2.67262 13.9534C1.62226 13.2837 1 12.3088 1 11Z", fill: "currentColor" })));
     }
 };
 PersonIcon.style = PersonIconStyle0;

package/dist/esm/close-icon.entry.js CHANGED Viewed

@@ -9,7 +9,7 @@ const CloseIcon = class {
         this.height = '16';
     }
     render() {
-        return (h("svg", { key: 'c557fc120fad53fe3ebbf21a66d2dbfeac21b13b', width: "21", height: "21", fill: "none", xmlns: "http://www.w3.org/2000/svg" }, h("g", { key: '6d1649852d342654e1307ff351864be23164dc35', "clip-path": "url(#a)" }, h("path", { key: '0346ad3f320f41ee7289191535d39b5f1dff6f77', d: "M5.73 4.574a.75.75 0 1 0-1.061 1.06l4.419 4.42-4.42 4.42a.75.75 0 1 0 1.061 1.06l4.42-4.42 4.419 4.42a.75.75 0 0 0 1.06-1.06l-4.419-4.42 4.42-4.42a.75.75 0 1 0-1.061-1.06l-4.42 4.42-4.419-4.42Z", fill: "currentColor" })), h("defs", { key: '396275af82c104cd4e287eaf04acbe14fb3462f0' }, h("clipPath", { key: '956536ff31c1f1079bead101521560df62cfe0f7', id: "a" }, h("path", { key: 'a7eea7e4686f954d671e955100c7e917cf436245', fill: "#fff", transform: "translate(.148 .054)", d: "M0 0h20v20H0z" })))));
+        return (h("svg", { key: '0f4877401be56f05c3e078f1787090f1d4ef1828', width: "21", height: "21", fill: "none", xmlns: "http://www.w3.org/2000/svg" }, h("g", { key: '1de897afab65499f15dc52a688c0979688a0e1e6', "clip-path": "url(#a)" }, h("path", { key: 'a845971a716788575a41b7baa3cb3112c6b101dd', d: "M5.73 4.574a.75.75 0 1 0-1.061 1.06l4.419 4.42-4.42 4.42a.75.75 0 1 0 1.061 1.06l4.42-4.42 4.419 4.42a.75.75 0 0 0 1.06-1.06l-4.419-4.42 4.42-4.42a.75.75 0 1 0-1.061-1.06l-4.42 4.42-4.419-4.42Z", fill: "currentColor" })), h("defs", { key: '53535e0937ab07c5a668dd03286a54048f8486d7' }, h("clipPath", { key: 'cfc1b69ea9a3f2c77fbc1f639b083f89a53e69f5', id: "a" }, h("path", { key: '88c774bf4d75f09fbc2754feac3dfa293297b3a2', fill: "#fff", transform: "translate(.148 .054)", d: "M0 0h20v20H0z" })))));
     }
 };
 CloseIcon.style = iconCss;

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

@@ -9,7 +9,7 @@ const DocumentRefreshIcon = class {
         this.height = '18';
     }
     render() {
-        return (h("svg", { key: '6abbae134b46b6e50a2cb24282b52a6ba408ba1f', xmlns: "http://www.w3.org/2000/svg", viewBox: "0 0 18 18", width: this.width, height: this.height }, h("rect", { key: '64df5047db1d39380bf97e8744efc3f3c0f5a1b7', id: "Canvas", fill: "#ff13dc", opacity: "0" }), h("path", { key: 'cb01c8315961830b97a39031b94f56ab9371ad5c', d: "M9.19763,12.26283A4.44131,4.44131,0,0,1,16.948,10.71741l.62524-.62524a.24433.24433,0,0,1,.1748-.07373.25035.25035,0,0,1,.252.24875v2.50143a.25.25,0,0,1-.25.25l-2.4995-.00016A.25088.25088,0,0,1,15,12.76721v-.00054a.24436.24436,0,0,1,.07373-.175l.86988-.86987a3.02827,3.02827,0,0,0-5.29847.71808.48835.48835,0,0,1-.46081.30981H9.55908a.37949.37949,0,0,1-.36145-.48686Z" }), h("path", { key: '8d7c5608d3adf066d4487f3a6e41937b32edc35c', d: "M17.80237,14.77441A4.4413,4.4413,0,0,1,10.052,16.31982l-.62524.62524a.24429.24429,0,0,1-.1748.07373A.25036.25036,0,0,1,9,16.77V14.26863a.25.25,0,0,1,.25-.25l2.4995.00016A.25087.25087,0,0,1,12,14.27v.00052a.24434.24434,0,0,1-.07373.175l-.86988.86988a3.02828,3.02828,0,0,0,5.29847-.71808.48836.48836,0,0,1,.46081-.30982h.62525a.3795.3795,0,0,1,.36145.48687Z" }), h("path", { key: '3567306a935ef0e19c25534e2688dfae08bda770', d: "M7,13.5A6.5,6.5,0,0,1,13.5,7c.16883,0,.33447.01264.5.02527V5H9.5A.5.5,0,0,1,9,4.5V0H2.5A.5.5,0,0,0,2,.5v15a.5.5,0,0,0,.5.5H7.49981A6.4779,6.4779,0,0,1,7,13.5Z" }), h("path", { key: '5e99392793c239585ee01d5b308ec647772857da', d: "M10,0h.043a.5.5,0,0,1,.353.146L13.854,3.6A.5.5,0,0,1,14,3.957V4H10Z" })));
+        return (h("svg", { key: 'd009d5dbbc4e4d6e8976a1eed54706f435b4687c', xmlns: "http://www.w3.org/2000/svg", viewBox: "0 0 18 18", width: this.width, height: this.height }, h("rect", { key: '140131d02e90be3c696414d63edbc29ae92ac81f', id: "Canvas", fill: "#ff13dc", opacity: "0" }), h("path", { key: '2653e8c638fd2ca4e9783a18e3dd70e91754fa5b', d: "M9.19763,12.26283A4.44131,4.44131,0,0,1,16.948,10.71741l.62524-.62524a.24433.24433,0,0,1,.1748-.07373.25035.25035,0,0,1,.252.24875v2.50143a.25.25,0,0,1-.25.25l-2.4995-.00016A.25088.25088,0,0,1,15,12.76721v-.00054a.24436.24436,0,0,1,.07373-.175l.86988-.86987a3.02827,3.02827,0,0,0-5.29847.71808.48835.48835,0,0,1-.46081.30981H9.55908a.37949.37949,0,0,1-.36145-.48686Z" }), h("path", { key: '0cf63c79c83425a5c39b8e6f48f36cbedd4fde2e', d: "M17.80237,14.77441A4.4413,4.4413,0,0,1,10.052,16.31982l-.62524.62524a.24429.24429,0,0,1-.1748.07373A.25036.25036,0,0,1,9,16.77V14.26863a.25.25,0,0,1,.25-.25l2.4995.00016A.25087.25087,0,0,1,12,14.27v.00052a.24434.24434,0,0,1-.07373.175l-.86988.86988a3.02828,3.02828,0,0,0,5.29847-.71808.48836.48836,0,0,1,.46081-.30982h.62525a.3795.3795,0,0,1,.36145.48687Z" }), h("path", { key: '460ebc7770b4a665283eebad127640d75e08ac76', d: "M7,13.5A6.5,6.5,0,0,1,13.5,7c.16883,0,.33447.01264.5.02527V5H9.5A.5.5,0,0,1,9,4.5V0H2.5A.5.5,0,0,0,2,.5v15a.5.5,0,0,0,.5.5H7.49981A6.4779,6.4779,0,0,1,7,13.5Z" }), h("path", { key: 'a64bb4310cc4350dd2671ca412753f28c9061973', d: "M10,0h.043a.5.5,0,0,1,.353.146L13.854,3.6A.5.5,0,0,1,14,3.957V4H10Z" })));
     }
 };
 DocumentRefreshIcon.style = iconCss;

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

@@ -9,7 +9,7 @@ const FlowIcon = class {
         this.height = '12';
     }
     render() {
-        return (h("svg", { key: '3cc6938f442a5a5929c7b649b2b1e63dc4ce9d9b', width: this.width, height: this.height, fill: "none", xmlns: "http://www.w3.org/2000/svg" }, h("path", { key: '2fd666481696e0717a006c6cc35d14bfe076e778', d: "M13 1.66211C11.8954 1.66211 11 2.55754 11 3.66211C11 4.76668 11.8954 5.66211 13 5.66211C14.1046 5.66211 15 4.76668 15 3.66211C15 2.55754 14.1046 1.66211 13 1.66211ZM10.0407 3.16678C10.2768 1.74563 11.5119 0.662109 13 0.662109C14.6569 0.662109 16 2.00526 16 3.66211C16 5.31896 14.6569 6.66211 13 6.66211C11.5162 6.66211 10.2839 5.58482 10.0428 4.16971C9.37629 4.23688 8.82682 4.7426 8.71466 5.41551L8.27173 8.07311C8.07929 9.22776 7.11428 10.087 5.9593 10.1574C5.72319 11.5786 4.48813 12.6621 3 12.6621C1.34315 12.6621 0 11.319 0 9.66211C0 8.00526 1.34315 6.66211 3 6.66211C4.48384 6.66211 5.71607 7.73939 5.95724 9.15451C6.62371 9.08734 7.17318 8.58162 7.28534 7.90871L7.72827 5.25111C7.92071 4.09646 8.88571 3.23718 10.0407 3.16678ZM3 7.66211C1.89543 7.66211 1 8.55754 1 9.66211C1 10.7667 1.89543 11.6621 3 11.6621C4.10457 11.6621 5 10.7667 5 9.66211C5 8.55754 4.10457 7.66211 3 7.66211Z", fill: "currentColor" })));
+        return (h("svg", { key: '18bdb1e3a2d6d1f4b9f9e1983c1ad7156e83e489', width: this.width, height: this.height, fill: "none", xmlns: "http://www.w3.org/2000/svg" }, h("path", { key: 'a291353c08dfca6bb961e83386a3bfe71a840299', d: "M13 1.66211C11.8954 1.66211 11 2.55754 11 3.66211C11 4.76668 11.8954 5.66211 13 5.66211C14.1046 5.66211 15 4.76668 15 3.66211C15 2.55754 14.1046 1.66211 13 1.66211ZM10.0407 3.16678C10.2768 1.74563 11.5119 0.662109 13 0.662109C14.6569 0.662109 16 2.00526 16 3.66211C16 5.31896 14.6569 6.66211 13 6.66211C11.5162 6.66211 10.2839 5.58482 10.0428 4.16971C9.37629 4.23688 8.82682 4.7426 8.71466 5.41551L8.27173 8.07311C8.07929 9.22776 7.11428 10.087 5.9593 10.1574C5.72319 11.5786 4.48813 12.6621 3 12.6621C1.34315 12.6621 0 11.319 0 9.66211C0 8.00526 1.34315 6.66211 3 6.66211C4.48384 6.66211 5.71607 7.73939 5.95724 9.15451C6.62371 9.08734 7.17318 8.58162 7.28534 7.90871L7.72827 5.25111C7.92071 4.09646 8.88571 3.23718 10.0407 3.16678ZM3 7.66211C1.89543 7.66211 1 8.55754 1 9.66211C1 10.7667 1.89543 11.6621 3 11.6621C4.10457 11.6621 5 10.7667 5 9.66211C5 8.55754 4.10457 7.66211 3 7.66211Z", fill: "currentColor" })));
     }
 };
 FlowIcon.style = iconCss;

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

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

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

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

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

@@ -14,7 +14,7 @@ const ForwardIcon = class {
         this.height = '15';
     }
     render() {
-        return (h("svg", { key: '4459922a9da41ee6755a6374ed801c99e78cc872', fill: "auto", width: this.width, height: this.height, viewBox: "0 0 1920 1920", xmlns: "http://www.w3.org/2000/svg" }, h("path", { key: '44eebaf7f76223a343560213b7aff4bae70a6387', d: "m1246.246 64-90.496 90.496 477.952 477.952h-590.848C467.878 632.448.038 1100.416.038 1675.392v109.056h128v-109.056c0-504.576 410.368-914.944 914.816-914.944h590.848l-477.952 478.08 90.496 90.496 632.448-632.576L1246.246 64Z", "fill-rule": "evenodd" })));
+        return (h("svg", { key: '56e947b67fe88f2a095cca9a0dd4c3ca9e570e7f', fill: "auto", width: this.width, height: this.height, viewBox: "0 0 1920 1920", xmlns: "http://www.w3.org/2000/svg" }, h("path", { key: '6d6da4d1c35613bdedc7fac5d2d8f0e6f2c3042c', d: "m1246.246 64-90.496 90.496 477.952 477.952h-590.848C467.878 632.448.038 1100.416.038 1675.392v109.056h128v-109.056c0-504.576 410.368-914.944 914.816-914.944h590.848l-477.952 478.08 90.496 90.496 632.448-632.576L1246.246 64Z", "fill-rule": "evenodd" })));
     }
 };
 ForwardIcon.style = ForwardIconStyle0;
@@ -152,7 +152,7 @@ const NylasComposer = class {
         this.editorEl.focus();
     }
     render() {
-        return (h(Host, { key: 'c8ab18162320c10834660c655141a985c36958ac' }, h("sp-theme", { key: '01a86b0ddef68c16b139cdb95bf3f9df102ead60', scale: "medium", color: "dark" }, h("div", { key: '280d8dfbee592023d7461e6691805a6e44e8837b', class: "editor", contentEditable: true, ref: r => (this.editorEl = r) }, h("div", { key: '35437f24077f1e5a9b629bfca6437ec6740c8780', class: "toolbar", ref: r => (this.toolbarEl = r), contentEditable: false }, h("sp-button", { key: '378551180f48beb175216d045acd4d65355f3234', quiet: true, onClick: () => document.execCommand('bold') }, h("div", { key: 'a7a6872cfc4d34939aaeba4e45e67d8ca1ac52ab', slot: "icon" }, h("bold-icon", { key: '198210356c76239162c2d44251845529b5765e04' })), h("div", { key: '6ecdf762f2a29a39bce8c49da6cc366594218c52', slot: "label" }, "Bold")), h("sp-button", { key: '6ee0821abd7462a9105f13228a4441ed302d0df9', quiet: true, onClick: () => document.execCommand('underline') }, h("div", { key: '37745f4ee7e5bac2d4bba65d3682338590b49c88', slot: "icon" }, h("underline-icon", { key: '9b7a46dbf44378c001c16afca0e8c30e0b1ea12f' })), h("div", { key: '54e6ce111dcc82421b475040a0a85d26c648c1d4', slot: "label" }, "Underline")), h("sp-button", { key: 'ae292c9f8f55a7ae82ddfaaa75ba9a045c80c02d', quiet: true, onClick: () => document.execCommand('italic') }, h("div", { key: 'fdfdf0265a51eeca44c72ec7de634f9c23a5a846', slot: "icon" }, h("italic-icon", { key: '6308247060d42eb21284e6687a0abc18cf63e32c' })), h("div", { key: '49487a1f0677fc394dd617abfdb645c56e441f55', slot: "label" }, "Italic")))), h("div", { key: '08b56206aef08fbc262ec615c1c593949ef05c82', class: 'buttons' }, h("sp-button", { key: 'f099e2091f8070adaf80cd9fd4299e53e25ef39b', onClick: this.sendComposer, class: "send" }, "Send"), h("sp-button", { key: '78c73f9aec9dd29a7b1360192ef190d20f0bb092', onClick: this.closeComposer, class: "close" }, "Close")))));
+        return (h(Host, { key: '7537b7c56a1e609f88189c2c4deed986827eb193' }, h("sp-theme", { key: 'efa28f8ed5585ec21b44ae5ec174aa10a9c92aba', scale: "medium", color: "dark" }, h("div", { key: 'c7932bcedcb2b3cfa4e0900578cf2b749000125d', class: "editor", contentEditable: true, ref: r => (this.editorEl = r) }, h("div", { key: '89c06c0e76d29ea6713dd44b2452e261d0d7d43b', class: "toolbar", ref: r => (this.toolbarEl = r), contentEditable: false }, h("sp-button", { key: 'beeb60448f03c8818925aeb13ab5231aa72f7526', quiet: true, onClick: () => document.execCommand('bold') }, h("div", { key: '4e37be81a28ac4355f9d0d6d6c71b7b78cf41456', slot: "icon" }, h("bold-icon", { key: '56cf047799a6a5713310d5b095ca91e6004d6107' })), h("div", { key: '2fe47f8f364f7fb1016990f2aecec655e2e6eb30', slot: "label" }, "Bold")), h("sp-button", { key: '0416d13b88ccefd5005f4b97f7dded2118d37f43', quiet: true, onClick: () => document.execCommand('underline') }, h("div", { key: '6d20e215eafbb91a17ce452a6b64295ab4ef2bb9', slot: "icon" }, h("underline-icon", { key: 'b8d988fa168047ed213fbcceb53b24bf3f766d7a' })), h("div", { key: 'bd05639007b3ea849501b995137ceda70aed20da', slot: "label" }, "Underline")), h("sp-button", { key: '9775c4787363cd4d21778f4c848c7f5a7564b507', quiet: true, onClick: () => document.execCommand('italic') }, h("div", { key: 'ca9d557028981c0fe209045e5d1748b19bbb5069', slot: "icon" }, h("italic-icon", { key: '1be5debba3572e83ab132a3e44d8fc1e799f6619' })), h("div", { key: 'cccb70309840e20f558158e6ef9edf8fe0e52eed', slot: "label" }, "Italic")))), h("div", { key: '502854e008886de49ec435c1ebd73b48f2cc4c70', class: 'buttons' }, h("sp-button", { key: '9663a709ca8794dc76dec379a39c52a6a754cb6e', onClick: this.sendComposer, class: "send" }, "Send"), h("sp-button", { key: 'b0c7637932f2659c9115e74f1244db04992a69aa', onClick: this.closeComposer, class: "close" }, "Close")))));
     }
     get host() { return getElement(this); }
     static get watchers() { return {
@@ -311,12 +311,12 @@ const NylasSummarizeMessageButton = class {
         });
     }
     render() {
-        return (h(Host, { key: '62f141a0a4bdba909ee313c05be61dfa5000bcaf' }, h("sp-theme", { key: '3839bf561000187ab456ae201cb539df420ec653', scale: "medium", color: "dark" }, h("sp-button", { key: '5bc73336c7afc299ac213c9b2903424a014a3f13', label: "Summarize email", "icon-only": true, onClickCapture: this.onClick, class: {
+        return (h(Host, { key: '977e97a8d9e6f0d5c3f56a8cedcdb18c65a18007' }, h("sp-theme", { key: '3e3e9a385317466347c5e4bac4cac584dc603063', scale: "medium", color: "dark" }, h("sp-button", { key: '4e47a9b38e47991c64236d567df1341df0a7a2b3', label: "Summarize email", "icon-only": true, onClickCapture: this.onClick, class: {
                 'summarize-button': true,
                 'stopped': this.state === 'stopped',
                 'loading': this.state === 'loading',
                 'playing': this.state === 'playing',
-            } }, this.state === 'stopped' && h("play-icon", null), this.state === 'loading' && h("loading-icon", null), this.state === 'playing' && h("stop-icon", null)), h("audio", { key: 'acf15db8df8104a59f452f29b797f4967f8243b3', ref: r => (this.audioRef = r), autoPlay: true, onPlaying: () => (this.state = 'playing'), onPause: () => (this.state = 'stopped'), onEnded: () => {
+            } }, this.state === 'stopped' && h("play-icon", null), this.state === 'loading' && h("loading-icon", null), this.state === 'playing' && h("stop-icon", null)), h("audio", { key: '0a0a952634d68aeab930d9a0c9feb07a1dea2828', ref: r => (this.audioRef = r), autoPlay: true, onPlaying: () => (this.state = 'playing'), onPause: () => (this.state = 'stopped'), onEnded: () => {
                 this.state = 'stopped';
                 debug(`[nylas-summarize-message-button] Audio ended`);
             } }))));
@@ -2163,7 +2163,7 @@ const NylasViewEmail = class {
     }
     render() {
         console.debug(`[nylas-view-email] render`, { hoistedFontURLs: this.hoistedFontURLs });
-        return (h(Host, { key: '2b8f2ef90fc96788d4925a70b1cdb692b7e7d183' }, this.state === 'loading' && h("div", null, "Loading..."), this.state === 'ready' && (h(Fragment, null, this.styles.map(style => (h("style", null, DOMPurify.sanitize(style.innerHTML)))), h("div", { class: 'view-email', part: "view-email", innerHTML: this.sanitizedBody, ref: el => (this.viewEmailElement = el) })))));
+        return (h(Host, { key: '4f0a1e688ae465d65943adc7dabac9cad6c62fe8' }, this.state === 'loading' && h("div", null, "Loading..."), this.state === 'ready' && (h(Fragment, null, this.styles.map(style => (h("style", null, DOMPurify.sanitize(style.innerHTML)))), h("div", { class: 'view-email', part: "view-email", innerHTML: this.sanitizedBody, ref: el => (this.viewEmailElement = el) })))));
     }
     get host() { return getElement(this); }
     static get watchers() { return {
@@ -2183,7 +2183,7 @@ const ReplyAllIcon = class {
         this.height = '15';
     }
     render() {
-        return (h("svg", { key: 'cf3a910b7232018b6579cfe31a868e3ba54f30b0', fill: "auto", width: this.width, height: this.height, viewBox: "0 0 1920 1920", xmlns: "http://www.w3.org/2000/svg" }, h("path", { key: '1db5bb9aa170d0a00c5939cdd7bfe7b878124c2c', d: "m1030.975 188 81.249 81.249-429.228 429.228h300.747c516.223 0 936.257 420.034 936.257 936.257v98.028h-114.92v-98.028c0-452.901-368.436-821.337-821.337-821.337H682.996l429.228 429.229-81.25 81.248-567.936-567.937L1030.975 188Zm-463.038.011 81.249 81.25-486.688 486.688 486.688 486.688-81.249 81.249L0 755.949 567.937 188.01Z", "fill-rule": "evenodd" })));
+        return (h("svg", { key: '27304a19b7ec5d4fb64051ba1edbd99699adc3c5', fill: "auto", width: this.width, height: this.height, viewBox: "0 0 1920 1920", xmlns: "http://www.w3.org/2000/svg" }, h("path", { key: '185831a5360ae2e5b3559e22839c38fe8667e027', d: "m1030.975 188 81.249 81.249-429.228 429.228h300.747c516.223 0 936.257 420.034 936.257 936.257v98.028h-114.92v-98.028c0-452.901-368.436-821.337-821.337-821.337H682.996l429.228 429.229-81.25 81.248-567.936-567.937L1030.975 188Zm-463.038.011 81.249 81.25-486.688 486.688 486.688 486.688-81.249 81.249L0 755.949 567.937 188.01Z", "fill-rule": "evenodd" })));
     }
 };
 ReplyAllIcon.style = ReplyAllIconStyle0;
@@ -2198,7 +2198,7 @@ const ReplyIcon = class {
         this.height = '15';
     }
     render() {
-        return (h("svg", { key: 'a353055eb9122f1dae36fbf49a557c431fd8580a', fill: "auto", width: this.width, height: this.height, viewBox: "0 0 1920 1920", xmlns: "http://www.w3.org/2000/svg" }, h("path", { key: '97ac62efd50d229e10b45fc2a47f3c8c5a9b6e5d', d: "M835.942 632.563H244.966l478.08-478.08-90.496-90.496L-.026 696.563 632.55 1329.14l90.496-90.496-478.08-478.08h590.976c504.448 0 914.816 410.368 914.816 914.816v109.184h128V1675.38c0-574.976-467.84-1042.816-1042.816-1042.816", "fill-rule": "evenodd" })));
+        return (h("svg", { key: '8f2d5daffb8ab92a42abacce15e2abd868f979a7', fill: "auto", width: this.width, height: this.height, viewBox: "0 0 1920 1920", xmlns: "http://www.w3.org/2000/svg" }, h("path", { key: 'fcad20369efbf76e019c7b433e380419c696e481', d: "M835.942 632.563H244.966l478.08-478.08-90.496-90.496L-.026 696.563 632.55 1329.14l90.496-90.496-478.08-478.08h590.976c504.448 0 914.816 410.368 914.816 914.816v109.184h128V1675.38c0-574.976-467.84-1042.816-1042.816-1042.816", "fill-rule": "evenodd" })));
     }
 };
 ReplyIcon.style = ReplyIconStyle0;

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

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

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

@@ -9,7 +9,7 @@ const GoogleLogoIcon = class {
         this.height = '24';
     }
     render() {
-        return (h("svg", { key: '48ccae649f280d48621dfb214a08b980155680a1', width: this.width, height: this.height, viewBox: "0 0 24 24", fill: "none", xmlns: "http://www.w3.org/2000/svg" }, h("g", { key: '10196951caa0fa0b94b57c57a62d8bcb31d92d91', "clip-path": "url(#clip0_959_12452)" }, h("path", { key: '0d2358cd1dcbd7f9ef2dfa17a5075a341210a43c', d: "M23.745 12.27C23.745 11.48 23.675 10.73 23.555 10H12.255V14.51H18.725C18.435 15.99 17.585 17.24 16.325 18.09V21.09H20.185C22.445 19 23.745 15.92 23.745 12.27Z", fill: "#4285F4" }), h("path", { key: '8540c5619b64996b6b158fe50609aa378dfd468f', d: "M12.255 24C15.495 24 18.205 22.92 20.185 21.09L16.325 18.09C15.245 18.81 13.875 19.25 12.255 19.25C9.12504 19.25 6.47505 17.14 5.52505 14.29H1.54504V17.38C3.51504 21.3 7.56504 24 12.255 24Z", fill: "#34A853" }), h("path", { key: 'b683a33b6068de0793ef4426e6404d438dbdf73e', d: "M5.52501 14.2901C5.27501 13.5701 5.145 12.8001 5.145 12.0001C5.145 11.2001 5.28501 10.4301 5.52501 9.71012V6.62012H1.545C0.725004 8.24012 0.255005 10.0601 0.255005 12.0001C0.255005 13.9401 0.725004 15.7601 1.545 17.3801L5.52501 14.2901Z", fill: "#FBBC05" }), h("path", { key: '916d663bbb04c8267e595adf9125068232414ed7', d: "M12.255 4.75C14.025 4.75 15.605 5.36 16.855 6.55L20.275 3.13C18.205 1.19 15.495 0 12.255 0C7.56504 0 3.51504 2.7 1.54504 6.62L5.52505 9.71C6.47505 6.86 9.12504 4.75 12.255 4.75Z", fill: "#EA4335" })), h("defs", { key: 'a941f8ccb1711f648dc3e2db750496a2491b4b55' }, h("clipPath", { key: 'caef3b6e814ed957bcee43a794130dce6760702d', id: "clip0_959_12452" }, h("rect", { key: 'df7c24b60402fd2e9d248f4e5ccfbaa640d549ae', width: 24, height: 24, fill: "white" })))));
+        return (h("svg", { key: '0e9d7d49a7c9b6cd2087805b88f0e5a2067dfaed', width: this.width, height: this.height, viewBox: "0 0 24 24", fill: "none", xmlns: "http://www.w3.org/2000/svg" }, h("g", { key: 'e97ac24bfe96bdba16a9709dde3ebc675e942d56', "clip-path": "url(#clip0_959_12452)" }, h("path", { key: '231167532157853cb95fddc85fa8cffcf1134ef4', d: "M23.745 12.27C23.745 11.48 23.675 10.73 23.555 10H12.255V14.51H18.725C18.435 15.99 17.585 17.24 16.325 18.09V21.09H20.185C22.445 19 23.745 15.92 23.745 12.27Z", fill: "#4285F4" }), h("path", { key: '4f964a28a6b0894940c9d762a91db0c099f6c2c7', d: "M12.255 24C15.495 24 18.205 22.92 20.185 21.09L16.325 18.09C15.245 18.81 13.875 19.25 12.255 19.25C9.12504 19.25 6.47505 17.14 5.52505 14.29H1.54504V17.38C3.51504 21.3 7.56504 24 12.255 24Z", fill: "#34A853" }), h("path", { key: '9ada4b2f2625f18538ff4455b1160efcfccbd646', d: "M5.52501 14.2901C5.27501 13.5701 5.145 12.8001 5.145 12.0001C5.145 11.2001 5.28501 10.4301 5.52501 9.71012V6.62012H1.545C0.725004 8.24012 0.255005 10.0601 0.255005 12.0001C0.255005 13.9401 0.725004 15.7601 1.545 17.3801L5.52501 14.2901Z", fill: "#FBBC05" }), h("path", { key: '6a260b3024a69fa930820a80a917152dc7ef52a7', d: "M12.255 4.75C14.025 4.75 15.605 5.36 16.855 6.55L20.275 3.13C18.205 1.19 15.495 0 12.255 0C7.56504 0 3.51504 2.7 1.54504 6.62L5.52505 9.71C6.47505 6.86 9.12504 4.75 12.255 4.75Z", fill: "#EA4335" })), h("defs", { key: '56bc051b67a1bfa29ecaf64bac03ee1017836365' }, h("clipPath", { key: '8057800f9035048497e8198789e1e0b4dba1c64a', id: "clip0_959_12452" }, h("rect", { key: '6c0299822390d3433158d87c607fe9546e878eb0', width: 24, height: 24, fill: "white" })))));
     }
 };
 GoogleLogoIcon.style = iconCss;