New Case Study:See how Anthropic automated 95% of dependency reviews with Socket.Learn More →
Socket
Sign inDemoInstall
Socket
Sign inDemoInstall

@axa-ch/button

Package Overview
Dependencies
Maintainers
49
Versions
122
Alerts
File Explorer

Advanced tools

License
Socket logo

Install Socket

Detect and block malicious and high-risk dependencies

Install

@axa-ch/button - npm Package Compare versions

Comparing version 8.2.1 to 8.2.2

6

dist/index.js

@@ -41,5 +41,5 @@ var window=function(){"use strict";

${o(":host(:not([size=original])) svg {\n width: 24px;\n height: 24px;\n}\n\n:host([size=small]) svg {\n width: 20px;\n height: 20px;\n}\n\n:host([size=large]) svg {\n width: 32px;\n height: 32px;\n}")}
`}static get iconsMapping(){return{"arrow-left":'<svg width="24" height="24" viewBox="0 0 24 24" fill="none" xmlns="http://www.w3.org/2000/svg"><path fill-rule="evenodd" clip-rule="evenodd" d="M19.078 12.5a1 1 0 01-1 1h-10.5a1 1 0 110-2h10.5a1 1 0 011 1z" fill="currentColor"/><path fill-rule="evenodd" clip-rule="evenodd" d="M10.202 8.219a1 1 0 01.157 1.405L8.06 12.5l2.3 2.876a1 1 0 01-1.563 1.248L5.5 12.5l3.297-4.124a1 1 0 011.405-.157z" fill="currentColor"/></svg>',"arrow-right":'<svg width="24" height="24" viewBox="0 0 24 24" fill="none" xmlns="http://www.w3.org/2000/svg"><path fill-rule="evenodd" clip-rule="evenodd" d="M4.922 11.5a1 1 0 011-1h10.5a1 1 0 110 2h-10.5a1 1 0 01-1-1z" fill="currentColor"/><path fill-rule="evenodd" clip-rule="evenodd" d="M13.798 15.781a1 1 0 01-.157-1.405L15.94 11.5l-2.3-2.876a1 1 0 011.563-1.248L18.5 11.5l-3.297 4.124a1 1 0 01-1.405.157z" fill="currentColor"/></svg>',collapse:'<svg xmlns="http://www.w3.org/2000/svg" width="24" height="24" viewBox="0 0 24 24"><path fill="currentColor" d="M12 8l-6 6 1.41 1.41L12 10.83l4.59 4.58L18 14z"/></svg>',document:'<svg xmlns="http://www.w3.org/2000/svg" width="24" height="24" viewBox="0 0 24 24"><path fill="currentColor" d="M6 2c-1.1 0-1.99.9-1.99 2L4 20c0 1.1.89 2 1.99 2H18c1.1 0 2-.9 2-2V8l-6-6H6zm7 7V3.5L18.5 9H13z"/></svg>',download:'<svg xmlns="http://www.w3.org/2000/svg" width="24" height="24" viewBox="0 0 24 24"><path fill="currentColor" d="M19 9h-4V3H9v6H5l7 7 7-7zM5 18v2h14v-2H5z"/></svg>',email:'<svg xmlns="http://www.w3.org/2000/svg" width="24" height="24" viewBox="0 0 24 24"><path fill="currentColor" d="M20 4H4c-1.1 0-1.99.9-1.99 2L2 18c0 1.1.9 2 2 2h16c1.1 0 2-.9 2-2V6c0-1.1-.9-2-2-2zm0 4l-8 5-8-5V6l8 5 8-5v2z"/></svg>',expand:'<svg xmlns="http://www.w3.org/2000/svg" width="24" height="24" viewBox="0 0 24 24"><path fill="currentColor" d="M16.59 8.59L12 13.17 7.41 8.59 6 10l6 6 6-6z"/></svg>',mobile:'<svg xmlns="http://www.w3.org/2000/svg" width="24" height="24" viewBox="0 0 24 24"><path fill="currentColor" d="M15.5 1h-8C6.12 1 5 2.12 5 3.5v17C5 21.88 6.12 23 7.5 23h8c1.38 0 2.5-1.12 2.5-2.5v-17C18 2.12 16.88 1 15.5 1zm-4 21c-.83 0-1.5-.67-1.5-1.5s.67-1.5 1.5-1.5 1.5.67 1.5 1.5-.67 1.5-1.5 1.5zm4.5-4H7V4h9v14z"/></svg>',phone:'<svg xmlns="http://www.w3.org/2000/svg" width="24" height="24" viewBox="0 0 24 24"><path fill="currentColor" d="M6.62 10.79c1.44 2.83 3.76 5.14 6.59 6.59l2.2-2.2c.27-.27.67-.36 1.02-.24 1.12.37 2.33.57 3.57.57.55 0 1 .45 1 1V20c0 .55-.45 1-1 1-9.39 0-17-7.61-17-17 0-.55.45-1 1-1h3.5c.55 0 1 .45 1 1 0 1.25.2 2.45.57 3.57.11.35.03.74-.25 1.02l-2.2 2.2z"/></svg>',add:'<svg xmlns="http://www.w3.org/2000/svg" width="24" height="24" viewBox="0 0 24 24"><path fill="currentColor" d="M19 13h-6v6h-2v-6H5v-2h6V5h2v6h6v2z"/></svg>',search:'<svg xmlns="http://www.w3.org/2000/svg" width="24" height="24" viewBox="0 0 24 24"><path fill="currentColor" d="M15.5 14h-.79l-.28-.27C15.41 12.59 16 11.11 16 9.5 16 5.91 13.09 3 9.5 3S3 5.91 3 9.5 5.91 16 9.5 16c1.61 0 3.09-.59 4.23-1.57l.27.28v.79l5 4.99L20.49 19l-4.99-5zm-6 0C7.01 14 5 11.99 5 9.5S7.01 5 9.5 5 14 7.01 14 9.5 11.99 14 9.5 14z"/></svg>',upload:'<svg xmlns="http://www.w3.org/2000/svg" width="24" height="24" viewBox="0 0 24 24"><path fill="currentColor" d="M9 16h6v-6h4l-7-7-7 7h4zm-4 2h14v2H5z"/></svg>',"cloud-upload":'<svg xmlns="http://www.w3.org/2000/svg" width="24" height="24" viewBox="0 0 24 24"><path fill="currentColor" d="M19.35 10.04C18.67 6.59 15.64 4 12 4 9.11 4 6.6 5.64 5.35 8.04 2.34 8.36 0 10.91 0 14c0 3.31 2.69 6 6 6h13c2.76 0 5-2.24 5-5 0-2.64-2.05-4.78-4.65-4.96zM14 13v4h-4v-4H7l5-5 5 5h-3z"/></svg>',"axa-logo":'<svg xmlns="http://www.w3.org/2000/svg" viewBox="0 0 283.467 283.467"><path fill="#00008f" d="M.003.003h283.464v283.464H.003z"/><path fill="#ff1721" d="M175.659 139.99L283.467 0h-15.923L159.38 139.99h16.279z"/><path fill="#fff" d="M216.597 202.461c4.941 13.823 15.122 49.795 19.17 52.661h-26.729a44.571 44.571 0 00-1.254-9.434c-1.153-4.111-10.821-35.214-10.821-35.214h-42.456l-6.675 9.463s8.018 25.097 8.515 26.327c.865 2.217 4.693 8.858 4.693 8.858h-25.615s-.664-3.833-.913-5.43c-.2-1.289-2.427-8.349-2.427-8.349s-5.806 6.362-7.388 9.312c-1.596 2.943-2.304 4.467-2.304 4.467h-20.04s-.668-3.833-.917-5.43c-.196-1.289-2.647-8.916-2.647-8.916s-5.61 6.812-7.207 9.756c-1.587 2.95-2.27 4.59-2.27 4.59h-19.82s5.601-5.332 7.559-7.622c3.3-3.882 15.6-19.956 15.6-19.956l-4.931-17.07H45.586s-24.023 31.567-24.97 32.543c-.957.962-7.96 11.011-8.116 12.105H0v-7.949a5.987 5.987 0 01.493-.479c.386-.283 18.213-22.412 34.59-44.233 14.717-19.029 28.526-37.535 29.737-39.297 2.934-4.263 7.163-13.467 7.163-13.467h21.781s.675 8.467 1.31 10.522c.565 1.817 13.837 45.362 14.15 45.831l7.338-9.385-12.543-38.614s-2.94-7.265-3.897-8.354h25.445a22.166 22.166 0 00.83 6.919c1.034 3.184 6.489 22.866 6.489 22.866s17.354-21.753 18.369-23.315a14.1 14.1 0 002.143-6.47H174.6s-3.881 2.837-10.683 11.44c-2.285 2.896-24.673 31.348-24.673 31.348s1.953 6.66 2.905 9.976c.26.952.44 1.597.44 1.665 0 .03.493-.576 1.343-1.665 5.776-7.32 32.05-41.772 33.643-44.722 1.284-2.382 3.173-5.092 4.282-8.041h20.683s.478 6.176 1.109 7.885zm-31.475-32.612c-3.037 6.533-20.913 28.296-20.913 28.296h28.31s-5.488-16.9-6.445-20.709a30.233 30.233 0 01-.557-7.402c0-.346-.063-.908-.395-.185zm-108.775 0c-3.036 6.533-20.912 28.296-20.912 28.296h28.31s-5.483-16.9-6.44-20.709a30.233 30.233 0 01-.557-7.402c0-.346-.068-.908-.4-.185zm42.623 65.986l7.793-10.703c-.718-.772-5.107-14.082-5.107-14.082l-7.535 9.775z"/></svg>',"axa-logo-open":'<svg xmlns="http://www.w3.org/2000/svg" viewBox="0 0 80 80"><path fill="#FF1721" d="M49.026 39.457L77.948 1.9h-4.272L44.658 39.457z"/><path d="M0 0v79.85h79.85V0H0zm77.948 77.948H1.901v-7.604h3.353c.042-.293 1.92-2.99 2.177-3.247.254-.262 6.7-8.731 6.7-8.731h11.303l1.323 4.58s-3.3 4.312-4.186 5.353c-.525.615-2.027 2.045-2.027 2.045h5.317s.183-.44.609-1.231c.428-.79 1.933-2.618 1.933-2.618s.658 2.047.71 2.392c.067.429.247 1.457.247 1.457h5.376s.19-.409.618-1.199c.424-.79 1.982-2.498 1.982-2.498s.597 1.895.65 2.24c.068.429.246 1.457.246 1.457h6.872s-1.027-1.781-1.26-2.376c-.133-.33-2.284-7.063-2.284-7.063l1.791-2.54h11.39s2.594 8.345 2.903 9.448c.202.83.315 1.678.336 2.531h7.171c-1.086-.769-3.817-10.42-5.143-14.128l-3.474-12.04c-.169-.458-.297-2.115-.297-2.115h-5.549c-.297.791-.804 1.518-1.149 2.157-.427.792-7.476 10.035-9.025 11.998-.228.292-.36.455-.36.447 0-.018-.049-.191-.118-.447-.256-.89-.78-2.676-.78-2.676s6.006-7.633 6.62-8.41c1.824-2.308 2.865-3.069 2.865-3.069h-5.687a3.783 3.783 0 01-.575 1.736c-.273.419-4.928 6.255-4.928 6.255s-1.464-5.28-1.741-6.135a5.947 5.947 0 01-.223-1.856h-6.826c.257.292 1.045 2.241 1.045 2.241l3.365 10.36-1.968 2.517c-.084-.126-3.645-11.808-3.797-12.295-.17-.551-.35-2.823-.35-2.823h-5.844s-1.135 2.47-1.922 3.613c-.325.473-4.03 5.437-7.978 10.542-4.393 5.854-9.176 11.791-9.28 11.867a1.6 1.6 0 00-.13.128V1.9h76.046v76.047zM22.64 49.503c.256 1.022 1.727 5.555 1.727 5.555h-7.595s4.796-5.838 5.61-7.59c.09-.195.108-.044.108.049a8.11 8.11 0 00.15 1.986zm9.876 11.64l2.022-2.622s1.177 3.57 1.37 3.777l-2.09 2.872-1.302-4.027zm19.304-11.64c.257 1.022 1.729 5.555 1.729 5.555h-7.595s4.796-5.838 5.61-7.59c.09-.195.106-.044.106.049a8.111 8.111 0 00.15 1.986z" fill="#00008F"/></svg>',"check-circle":'<svg xmlns="http://www.w3.org/2000/svg" width="24" height="24" viewBox="0 0 24 24"><path fill="currentColor" d="M12 2C6.48 2 2 6.48 2 12s4.48 10 10 10 10-4.48 10-10S17.52 2 12 2zm-2 15l-5-5 1.41-1.41L10 14.17l7.59-7.59L19 8l-9 9z"/></svg>',check:'<svg xmlns="http://www.w3.org/2000/svg" width="24" height="24" viewBox="0 0 24 24"><path fill="currentColor" d="M9 16.17L4.83 12l-1.42 1.41L9 19 21 7l-1.41-1.41z"/></svg>',"info-outline":'<svg xmlns="http://www.w3.org/2000/svg" width="24" height="24" viewBox="0 0 24 24"><path fill="currentColor" d="M11 17h2v-6h-2v6zm1-15C6.48 2 2 6.48 2 12s4.48 10 10 10 10-4.48 10-10S17.52 2 12 2zm0 18c-4.41 0-8-3.59-8-8s3.59-8 8-8 8 3.59 8 8-3.59 8-8 8zM11 9h2V7h-2v2z"/></svg>',"warning-amber":'<svg width="24" height="24" viewBox="0 0 24 24" fill="none" xmlns="http://www.w3.org/2000/svg"><path fill-rule="evenodd" clip-rule="evenodd" d="M1 21.5L12 2.5L23 21.5H1ZM19.53 19.5L12 6.49L4.47 19.5H19.53ZM11 16.5V18.5H13V16.5H11ZM11 10.5H13V14.5H11V10.5Z" fill="currentColor"/></svg>',cloudy:'<svg width="25" height="24" viewBox="0 0 25 24" fill="none" xmlns="http://www.w3.org/2000/svg"><path fill-rule="evenodd" clip-rule="evenodd" d="M5.34278 4.04C6.59226 1.64 9.11121 0 12 0C15.6385 0 18.6672 2.59 19.3569 6.04C21.9459 6.22 23.995 8.36 23.995 11C23.995 13.76 21.7559 16 18.9971 16H6.00251C2.69388 16 0.00500488 13.31 0.00500488 10C0.00500488 6.91 2.34403 4.36 5.34278 4.04ZM17.3978 6.43C16.888 3.86 14.6089 2 12 2C9.94086 2 8.07164 3.14 7.13204 4.97L6.63224 5.92L5.56269 6.03C3.53353 6.24 2.00417 7.95 2.00417 10C2.00417 12.21 3.79343 14 6.00251 14H18.9971C20.6464 14 21.9958 12.65 21.9958 11C21.9958 9.45 20.7764 8.15 19.217 8.04L17.6976 7.93L17.3978 6.43Z" fill="currentColor"/><path fill-rule="evenodd" clip-rule="evenodd" d="M7.70521 22.7053L3.99997 19L5.41418 17.5858L9.11942 21.2911L7.70521 22.7053Z" fill="currentColor"/><path fill-rule="evenodd" clip-rule="evenodd" d="M17.7052 22.7053L14 19L15.4142 17.5858L19.1194 21.2911L17.7052 22.7053Z" fill="currentColor"/><path fill-rule="evenodd" clip-rule="evenodd" d="M12.7052 22.7053L8.99997 19L10.4142 17.5858L14.1194 21.2911L12.7052 22.7053Z" fill="currentColor"/><path fill-rule="evenodd" clip-rule="evenodd" d="M22.7052 22.7053L19 19L20.4142 17.5858L24.1194 21.2911L22.7052 22.7053Z" fill="currentColor"/></svg>',close:'<svg xmlns="http://www.w3.org/2000/svg" width="24" height="24" viewBox="0 0 24 24"><path fill="currentColor" d="M19 6.41L17.59 5 12 10.59 6.41 5 5 6.41 10.59 12 5 17.59 6.41 19 12 13.41 17.59 19 19 17.59 13.41 12z"/></svg>'}}static get properties(){return{icon:{type:String},size:{type:String,reflect:!0,defaultValue:"medium"},_loadedSvg:{type:String}}}constructor(){super(),ft(this)}updated(){const{icon:t}=this;var e;/\.svg/.test(t)?(e=t,new Promise(((t,n)=>{const i=new XMLHttpRequest;i.open("GET",e),i.onload=()=>t(i.responseText),i.onerror=()=>n(i.statusText),i.send()}))).then((t=>{this._loadedSvg=t})):/<svg/.test(t)?this._loadedSvg=t:this._loadedSvg=bt.iconsMapping[t]||""}render(){return this._loadedSvg&&st((t=>{const e=document.createElement("div");e.innerHTML=t;const n=e.firstElementChild;if(!n||"svg"!==n.tagName.toLowerCase())return"";if(n.getElementsByTagName("script").length)return"";for(let t=0,e=n.attributes,i=e.length;t<i;t++)if(e[t].name.startsWith("on"))return"";return t})(this._loadedSvg))}}dt([bt],{"axa-button":{"axa-button":"8.2.0","axa-icon":"8.0.8"}});const wt="arrow-right";class mt extends G{static get tagName(){return"axa-button"}static get styles(){return s`
`}static get iconsMapping(){return{"arrow-left":'<svg width="24" height="24" viewBox="0 0 24 24" fill="none" xmlns="http://www.w3.org/2000/svg"><path fill-rule="evenodd" clip-rule="evenodd" d="M19.078 12.5a1 1 0 01-1 1h-10.5a1 1 0 110-2h10.5a1 1 0 011 1z" fill="currentColor"/><path fill-rule="evenodd" clip-rule="evenodd" d="M10.202 8.219a1 1 0 01.157 1.405L8.06 12.5l2.3 2.876a1 1 0 01-1.563 1.248L5.5 12.5l3.297-4.124a1 1 0 011.405-.157z" fill="currentColor"/></svg>',"arrow-right":'<svg width="24" height="24" viewBox="0 0 24 24" fill="none" xmlns="http://www.w3.org/2000/svg"><path fill-rule="evenodd" clip-rule="evenodd" d="M4.922 11.5a1 1 0 011-1h10.5a1 1 0 110 2h-10.5a1 1 0 01-1-1z" fill="currentColor"/><path fill-rule="evenodd" clip-rule="evenodd" d="M13.798 15.781a1 1 0 01-.157-1.405L15.94 11.5l-2.3-2.876a1 1 0 011.563-1.248L18.5 11.5l-3.297 4.124a1 1 0 01-1.405.157z" fill="currentColor"/></svg>',collapse:'<svg xmlns="http://www.w3.org/2000/svg" width="24" height="24" viewBox="0 0 24 24"><path fill="currentColor" d="M12 8l-6 6 1.41 1.41L12 10.83l4.59 4.58L18 14z"/></svg>',document:'<svg xmlns="http://www.w3.org/2000/svg" width="24" height="24" viewBox="0 0 24 24"><path fill="currentColor" d="M6 2c-1.1 0-1.99.9-1.99 2L4 20c0 1.1.89 2 1.99 2H18c1.1 0 2-.9 2-2V8l-6-6H6zm7 7V3.5L18.5 9H13z"/></svg>',download:'<svg xmlns="http://www.w3.org/2000/svg" width="24" height="24" viewBox="0 0 24 24"><path fill="currentColor" d="M19 9h-4V3H9v6H5l7 7 7-7zM5 18v2h14v-2H5z"/></svg>',email:'<svg xmlns="http://www.w3.org/2000/svg" width="24" height="24" viewBox="0 0 24 24"><path fill="currentColor" d="M20 4H4c-1.1 0-1.99.9-1.99 2L2 18c0 1.1.9 2 2 2h16c1.1 0 2-.9 2-2V6c0-1.1-.9-2-2-2zm0 4l-8 5-8-5V6l8 5 8-5v2z"/></svg>',expand:'<svg xmlns="http://www.w3.org/2000/svg" width="24" height="24" viewBox="0 0 24 24"><path fill="currentColor" d="M16.59 8.59L12 13.17 7.41 8.59 6 10l6 6 6-6z"/></svg>',mobile:'<svg xmlns="http://www.w3.org/2000/svg" width="24" height="24" viewBox="0 0 24 24"><path fill="currentColor" d="M15.5 1h-8C6.12 1 5 2.12 5 3.5v17C5 21.88 6.12 23 7.5 23h8c1.38 0 2.5-1.12 2.5-2.5v-17C18 2.12 16.88 1 15.5 1zm-4 21c-.83 0-1.5-.67-1.5-1.5s.67-1.5 1.5-1.5 1.5.67 1.5 1.5-.67 1.5-1.5 1.5zm4.5-4H7V4h9v14z"/></svg>',phone:'<svg xmlns="http://www.w3.org/2000/svg" width="24" height="24" viewBox="0 0 24 24"><path fill="currentColor" d="M6.62 10.79c1.44 2.83 3.76 5.14 6.59 6.59l2.2-2.2c.27-.27.67-.36 1.02-.24 1.12.37 2.33.57 3.57.57.55 0 1 .45 1 1V20c0 .55-.45 1-1 1-9.39 0-17-7.61-17-17 0-.55.45-1 1-1h3.5c.55 0 1 .45 1 1 0 1.25.2 2.45.57 3.57.11.35.03.74-.25 1.02l-2.2 2.2z"/></svg>',add:'<svg xmlns="http://www.w3.org/2000/svg" width="24" height="24" viewBox="0 0 24 24"><path fill="currentColor" d="M19 13h-6v6h-2v-6H5v-2h6V5h2v6h6v2z"/></svg>',search:'<svg xmlns="http://www.w3.org/2000/svg" width="24" height="24" viewBox="0 0 24 24"><path fill="currentColor" d="M15.5 14h-.79l-.28-.27C15.41 12.59 16 11.11 16 9.5 16 5.91 13.09 3 9.5 3S3 5.91 3 9.5 5.91 16 9.5 16c1.61 0 3.09-.59 4.23-1.57l.27.28v.79l5 4.99L20.49 19l-4.99-5zm-6 0C7.01 14 5 11.99 5 9.5S7.01 5 9.5 5 14 7.01 14 9.5 11.99 14 9.5 14z"/></svg>',upload:'<svg xmlns="http://www.w3.org/2000/svg" width="24" height="24" viewBox="0 0 24 24"><path fill="currentColor" d="M9 16h6v-6h4l-7-7-7 7h4zm-4 2h14v2H5z"/></svg>',"cloud-upload":'<svg xmlns="http://www.w3.org/2000/svg" width="24" height="24" viewBox="0 0 24 24"><path fill="currentColor" d="M19.35 10.04C18.67 6.59 15.64 4 12 4 9.11 4 6.6 5.64 5.35 8.04 2.34 8.36 0 10.91 0 14c0 3.31 2.69 6 6 6h13c2.76 0 5-2.24 5-5 0-2.64-2.05-4.78-4.65-4.96zM14 13v4h-4v-4H7l5-5 5 5h-3z"/></svg>',"axa-logo":'<svg xmlns="http://www.w3.org/2000/svg" viewBox="0 0 283.467 283.467"><path fill="#00008f" d="M.003.003h283.464v283.464H.003z"/><path fill="#ff1721" d="M175.659 139.99L283.467 0h-15.923L159.38 139.99h16.279z"/><path fill="#fff" d="M216.597 202.461c4.941 13.823 15.122 49.795 19.17 52.661h-26.729a44.571 44.571 0 00-1.254-9.434c-1.153-4.111-10.821-35.214-10.821-35.214h-42.456l-6.675 9.463s8.018 25.097 8.515 26.327c.865 2.217 4.693 8.858 4.693 8.858h-25.615s-.664-3.833-.913-5.43c-.2-1.289-2.427-8.349-2.427-8.349s-5.806 6.362-7.388 9.312c-1.596 2.943-2.304 4.467-2.304 4.467h-20.04s-.668-3.833-.917-5.43c-.196-1.289-2.647-8.916-2.647-8.916s-5.61 6.812-7.207 9.756c-1.587 2.95-2.27 4.59-2.27 4.59h-19.82s5.601-5.332 7.559-7.622c3.3-3.882 15.6-19.956 15.6-19.956l-4.931-17.07H45.586s-24.023 31.567-24.97 32.543c-.957.962-7.96 11.011-8.116 12.105H0v-7.949a5.987 5.987 0 01.493-.479c.386-.283 18.213-22.412 34.59-44.233 14.717-19.029 28.526-37.535 29.737-39.297 2.934-4.263 7.163-13.467 7.163-13.467h21.781s.675 8.467 1.31 10.522c.565 1.817 13.837 45.362 14.15 45.831l7.338-9.385-12.543-38.614s-2.94-7.265-3.897-8.354h25.445a22.166 22.166 0 00.83 6.919c1.034 3.184 6.489 22.866 6.489 22.866s17.354-21.753 18.369-23.315a14.1 14.1 0 002.143-6.47H174.6s-3.881 2.837-10.683 11.44c-2.285 2.896-24.673 31.348-24.673 31.348s1.953 6.66 2.905 9.976c.26.952.44 1.597.44 1.665 0 .03.493-.576 1.343-1.665 5.776-7.32 32.05-41.772 33.643-44.722 1.284-2.382 3.173-5.092 4.282-8.041h20.683s.478 6.176 1.109 7.885zm-31.475-32.612c-3.037 6.533-20.913 28.296-20.913 28.296h28.31s-5.488-16.9-6.445-20.709a30.233 30.233 0 01-.557-7.402c0-.346-.063-.908-.395-.185zm-108.775 0c-3.036 6.533-20.912 28.296-20.912 28.296h28.31s-5.483-16.9-6.44-20.709a30.233 30.233 0 01-.557-7.402c0-.346-.068-.908-.4-.185zm42.623 65.986l7.793-10.703c-.718-.772-5.107-14.082-5.107-14.082l-7.535 9.775z"/></svg>',"axa-logo-open":'<svg xmlns="http://www.w3.org/2000/svg" viewBox="0 0 80 80"><path fill="#FF1721" d="M49.026 39.457L77.948 1.9h-4.272L44.658 39.457z"/><path d="M0 0v79.85h79.85V0H0zm77.948 77.948H1.901v-7.604h3.353c.042-.293 1.92-2.99 2.177-3.247.254-.262 6.7-8.731 6.7-8.731h11.303l1.323 4.58s-3.3 4.312-4.186 5.353c-.525.615-2.027 2.045-2.027 2.045h5.317s.183-.44.609-1.231c.428-.79 1.933-2.618 1.933-2.618s.658 2.047.71 2.392c.067.429.247 1.457.247 1.457h5.376s.19-.409.618-1.199c.424-.79 1.982-2.498 1.982-2.498s.597 1.895.65 2.24c.068.429.246 1.457.246 1.457h6.872s-1.027-1.781-1.26-2.376c-.133-.33-2.284-7.063-2.284-7.063l1.791-2.54h11.39s2.594 8.345 2.903 9.448c.202.83.315 1.678.336 2.531h7.171c-1.086-.769-3.817-10.42-5.143-14.128l-3.474-12.04c-.169-.458-.297-2.115-.297-2.115h-5.549c-.297.791-.804 1.518-1.149 2.157-.427.792-7.476 10.035-9.025 11.998-.228.292-.36.455-.36.447 0-.018-.049-.191-.118-.447-.256-.89-.78-2.676-.78-2.676s6.006-7.633 6.62-8.41c1.824-2.308 2.865-3.069 2.865-3.069h-5.687a3.783 3.783 0 01-.575 1.736c-.273.419-4.928 6.255-4.928 6.255s-1.464-5.28-1.741-6.135a5.947 5.947 0 01-.223-1.856h-6.826c.257.292 1.045 2.241 1.045 2.241l3.365 10.36-1.968 2.517c-.084-.126-3.645-11.808-3.797-12.295-.17-.551-.35-2.823-.35-2.823h-5.844s-1.135 2.47-1.922 3.613c-.325.473-4.03 5.437-7.978 10.542-4.393 5.854-9.176 11.791-9.28 11.867a1.6 1.6 0 00-.13.128V1.9h76.046v76.047zM22.64 49.503c.256 1.022 1.727 5.555 1.727 5.555h-7.595s4.796-5.838 5.61-7.59c.09-.195.108-.044.108.049a8.11 8.11 0 00.15 1.986zm9.876 11.64l2.022-2.622s1.177 3.57 1.37 3.777l-2.09 2.872-1.302-4.027zm19.304-11.64c.257 1.022 1.729 5.555 1.729 5.555h-7.595s4.796-5.838 5.61-7.59c.09-.195.106-.044.106.049a8.111 8.111 0 00.15 1.986z" fill="#00008F"/></svg>',"check-circle":'<svg xmlns="http://www.w3.org/2000/svg" width="24" height="24" viewBox="0 0 24 24"><path fill="currentColor" d="M12 2C6.48 2 2 6.48 2 12s4.48 10 10 10 10-4.48 10-10S17.52 2 12 2zm-2 15l-5-5 1.41-1.41L10 14.17l7.59-7.59L19 8l-9 9z"/></svg>',check:'<svg xmlns="http://www.w3.org/2000/svg" width="24" height="24" viewBox="0 0 24 24"><path fill="currentColor" d="M9 16.17L4.83 12l-1.42 1.41L9 19 21 7l-1.41-1.41z"/></svg>',"info-outline":'<svg xmlns="http://www.w3.org/2000/svg" width="24" height="24" viewBox="0 0 24 24"><path fill="currentColor" d="M11 17h2v-6h-2v6zm1-15C6.48 2 2 6.48 2 12s4.48 10 10 10 10-4.48 10-10S17.52 2 12 2zm0 18c-4.41 0-8-3.59-8-8s3.59-8 8-8 8 3.59 8 8-3.59 8-8 8zM11 9h2V7h-2v2z"/></svg>',"warning-amber":'<svg width="24" height="24" viewBox="0 0 24 24" fill="none" xmlns="http://www.w3.org/2000/svg"><path fill-rule="evenodd" clip-rule="evenodd" d="M1 21.5L12 2.5L23 21.5H1ZM19.53 19.5L12 6.49L4.47 19.5H19.53ZM11 16.5V18.5H13V16.5H11ZM11 10.5H13V14.5H11V10.5Z" fill="currentColor"/></svg>',cloudy:'<svg width="25" height="24" viewBox="0 0 25 24" fill="none" xmlns="http://www.w3.org/2000/svg"><path fill-rule="evenodd" clip-rule="evenodd" d="M5.34278 4.04C6.59226 1.64 9.11121 0 12 0C15.6385 0 18.6672 2.59 19.3569 6.04C21.9459 6.22 23.995 8.36 23.995 11C23.995 13.76 21.7559 16 18.9971 16H6.00251C2.69388 16 0.00500488 13.31 0.00500488 10C0.00500488 6.91 2.34403 4.36 5.34278 4.04ZM17.3978 6.43C16.888 3.86 14.6089 2 12 2C9.94086 2 8.07164 3.14 7.13204 4.97L6.63224 5.92L5.56269 6.03C3.53353 6.24 2.00417 7.95 2.00417 10C2.00417 12.21 3.79343 14 6.00251 14H18.9971C20.6464 14 21.9958 12.65 21.9958 11C21.9958 9.45 20.7764 8.15 19.217 8.04L17.6976 7.93L17.3978 6.43Z" fill="currentColor"/><path fill-rule="evenodd" clip-rule="evenodd" d="M7.70521 22.7053L3.99997 19L5.41418 17.5858L9.11942 21.2911L7.70521 22.7053Z" fill="currentColor"/><path fill-rule="evenodd" clip-rule="evenodd" d="M17.7052 22.7053L14 19L15.4142 17.5858L19.1194 21.2911L17.7052 22.7053Z" fill="currentColor"/><path fill-rule="evenodd" clip-rule="evenodd" d="M12.7052 22.7053L8.99997 19L10.4142 17.5858L14.1194 21.2911L12.7052 22.7053Z" fill="currentColor"/><path fill-rule="evenodd" clip-rule="evenodd" d="M22.7052 22.7053L19 19L20.4142 17.5858L24.1194 21.2911L22.7052 22.7053Z" fill="currentColor"/></svg>',close:'<svg xmlns="http://www.w3.org/2000/svg" width="24" height="24" viewBox="0 0 24 24"><path fill="currentColor" d="M19 6.41L17.59 5 12 10.59 6.41 5 5 6.41 10.59 12 5 17.59 6.41 19 12 13.41 17.59 19 19 17.59 13.41 12z"/></svg>'}}static get properties(){return{icon:{type:String},size:{type:String,reflect:!0,defaultValue:"medium"},_loadedSvg:{type:String}}}constructor(){super(),ft(this)}updated(){const{icon:t}=this;var e;/\.svg/.test(t)?(e=t,new Promise(((t,n)=>{const i=new XMLHttpRequest;i.open("GET",e),i.onload=()=>t(i.responseText),i.onerror=()=>n(i.statusText),i.send()}))).then((t=>{this._loadedSvg=t})):/<svg/.test(t)?this._loadedSvg=t:this._loadedSvg=bt.iconsMapping[t]||""}render(){return this._loadedSvg&&st((t=>{const e=document.createElement("div");e.innerHTML=t;const n=e.firstElementChild;if(!n||"svg"!==n.tagName.toLowerCase())return"";if(n.getElementsByTagName("script").length)return"";for(let t=0,e=n.attributes,i=e.length;t<i;t++)if(e[t].name.startsWith("on"))return"";return t})(this._loadedSvg))}}dt([bt],{"axa-button":{"axa-button":"8.2.1","axa-icon":"8.0.9"}});const wt="arrow-right";class mt extends G{static get tagName(){return"axa-button"}static get styles(){return s`
${o(':host {\n display: inline-block;\n appearance: none;\n}\n\n:host([block]) {\n display: block;\n}\n\n:host([block]) .a-button {\n display: block;\n width: 100%;\n}\n\n.a-button {\n font-size: 14px;\n letter-spacing: 0.02em;\n line-height: 17px;\n font-family: "Source Sans Pro", Arial, sans-serif;\n display: inline-block;\n vertical-align: middle;\n appearance: none;\n position: relative;\n box-sizing: border-box;\n padding: 0 30px;\n margin: 0;\n min-height: 40px;\n width: 100%;\n hyphens: auto;\n overflow-wrap: break-word;\n word-wrap: break-word;\n text-transform: uppercase;\n text-decoration: none;\n color: #fff;\n background-color: #00008f;\n border: solid 2px #00008f;\n border-bottom-color: #00005b;\n text-align: center;\n}\n.a-button:hover, .a-button:active, .a-button:focus {\n cursor: pointer;\n text-decoration: none;\n background-color: #00005b;\n border-color: #00005b;\n outline: 0;\n}\n.a-button:disabled, .a-button[aria-disabled=true] {\n color: #999;\n background-color: #e5e5e5;\n border-color: #e5e5e5;\n border-bottom-color: #ccc;\n pointer-events: none;\n}\n.a-button__flex-wrapper {\n display: flex;\n justify-content: center;\n align-items: center;\n min-height: 36px;\n}\n.a-button__icon {\n display: flex;\n margin-right: 10px;\n}\n.a-button__arrow {\n display: flex;\n margin-left: 10px;\n}\n.a-button--large {\n min-height: 50px;\n font-size: 16px;\n letter-spacing: 0.02em;\n line-height: 24px;\n font-family: "Source Sans Pro", Arial, sans-serif;\n}\n.a-button--large .a-button__flex-wrapper {\n min-height: 46px;\n}\n.a-button--small {\n min-height: 30px;\n font-size: 14px;\n letter-spacing: 0.02em;\n line-height: 17px;\n font-family: "Source Sans Pro", Arial, sans-serif;\n}\n.a-button--motion {\n z-index: 0;\n overflow: hidden;\n transition: color 0.3s cubic-bezier(0.455, 0.03, 0.515, 0.955) 0s;\n}\n.a-button--motion::after {\n position: absolute;\n top: 50%;\n left: 50%;\n z-index: -1;\n display: block;\n width: 0.001px;\n height: 100vw;\n content: "";\n transform: translateX(-50%) translateY(-50%) rotate(45deg);\n transition: width 0.3s cubic-bezier(0.455, 0.03, 0.515, 0.955) 0s;\n background-color: #00005b;\n}\n.a-button--motion:hover, .a-button--motion:focus {\n background-color: #00008f;\n color: #fff;\n}\n.a-button--motion:hover::after, .a-button--motion:focus::after {\n width: 110%;\n background-color: #00005b;\n}\n.a-button--red {\n background-color: #f07662;\n border-color: #f07662;\n border-bottom-color: #ec4d33;\n}\n.a-button--red:hover, .a-button--red:active, .a-button--red:focus {\n background-color: #ec4d33;\n border-color: #ec4d33;\n}\n.a-button--red.a-button--motion::after {\n background-color: #ec4d33;\n}\n.a-button--red.a-button--motion:hover, .a-button--red.a-button--motion:focus {\n background-color: #f07662;\n color: #fff;\n}\n.a-button--red.a-button--motion:hover::after, .a-button--red.a-button--motion:focus::after {\n background-color: #ec4d33;\n}\n.a-button--secondary {\n background-color: transparent;\n border-bottom-color: #00008f;\n color: #00008f;\n}\n.a-button--secondary:hover, .a-button--secondary:active, .a-button--secondary:focus {\n color: #fff;\n}\n.a-button--secondary.a-button--motion {\n background-color: transparent;\n}\n.a-button--inverted {\n background-color: transparent;\n border-color: #fff;\n color: #fff;\n}\n.a-button--inverted:hover, .a-button--inverted:active, .a-button--inverted:focus {\n background-color: #fff;\n border-color: #fff;\n color: #00005b;\n}\n.a-button--inverted.a-button--motion {\n background-color: transparent;\n}\n.a-button--inverted.a-button--motion::after {\n background-color: #fff;\n}\n.a-button--inverted-blue-ocean:hover, .a-button--inverted-blue-ocean:active, .a-button--inverted-blue-ocean:focus {\n color: #4976ba;\n}\n.a-button--inverted-red-tosca:hover, .a-button--inverted-red-tosca:active, .a-button--inverted-red-tosca:focus {\n color: #914146;\n}\n.a-button--inverted-purple-logan:hover, .a-button--inverted-purple-logan:active, .a-button--inverted-purple-logan:focus {\n color: #9190ac;\n}\n.a-button--inverted-green-viridian:hover, .a-button--inverted-green-viridian:active, .a-button--inverted-green-viridian:focus {\n color: #668980;\n}\n.a-button--inverted-blue-teal:hover, .a-button--inverted-blue-teal:active, .a-button--inverted-blue-teal:focus {\n color: #027180;\n}')}
`}static get properties(){return{type:{type:String,reflect:!0,defaultValue:"button"},variant:{type:String},icon:{type:String},size:{type:String},block:{type:Boolean,reflect:!0},motionOff:{type:Boolean},disabled:{type:Boolean,reflect:!0},href:{type:String},external:{type:Boolean},onClick:{type:Function,attribute:!1}}}constructor(){super(),ft(this),dt([bt],{"axa-button":{"axa-button":"8.2.0","axa-icon":"8.0.8"}},this),this.handleClick=this.handleClick.bind(this)}get isTypeSubmitOrReset(){return"submit"===this.type||"reset"===this.type}get showIcon(){return this.icon&&this.icon!==wt}get showArrow(){return this.icon===wt}watch(t){switch(t){case"stop":this._observer&&this._observer.disconnect();break;case"start":this._observer||(this._observer=new MutationObserver((()=>this.attachFakeButton()))),this._observer.observe(this,{childList:!0})}}attachFakeButton(){const t=document.createElement("button");t.type=this.type,t.style.display="none",this.watch("stop"),this.appendChild(t),this.watch("start"),this.fakeButton=t}firstUpdated(){this.isTypeSubmitOrReset&&this.attachFakeButton(),"function"==typeof this.onclick&&(this.originalOnclick=this.onclick),this.onclick=t=>{this.handleClick(t,!0)}}handleClick(t,e=!1){t.isTrusted&&this.isTypeSubmitOrReset&&(t.stopPropagation(),this.fakeButton.click());const n=this.onClick||this.originalOnclick;e||"function"!=typeof n||n(t)}render(){const{type:t,motionOff:e,disabled:n,variant:i="",icon:o="",size:s="",href:r,external:l}=this,a={"a-button":!0,"a-button--large":"large"===s,"a-button--small":"small"===s,"a-button--motion":!e,"a-button--secondary":"secondary"===i,"a-button--red":"red"===i,"a-button--inverted":i.includes("inverted"),"a-button--inverted-blue-ocean":"inverted-blue-ocean"===i,"a-button--inverted-red-tosca":"inverted-red-tosca"===i,"a-button--inverted-purple-logan":"inverted-purple-logan"===i,"a-button--inverted-green-viridian":"inverted-green-viridian"===i,"a-button--inverted-blue-teal":"inverted-blue-teal"===i},h=()=>H`<span class="a-button__flex-wrapper">
`}static get properties(){return{type:{type:String,reflect:!0,defaultValue:"button"},variant:{type:String},icon:{type:String},size:{type:String},block:{type:Boolean,reflect:!0},motionOff:{type:Boolean},disabled:{type:Boolean,reflect:!0},href:{type:String},external:{type:Boolean},onClick:{type:Function,attribute:!1}}}constructor(){super(),ft(this),dt([bt],{"axa-button":{"axa-button":"8.2.1","axa-icon":"8.0.9"}},this),this.handleClick=this.handleClick.bind(this)}get isTypeSubmitOrReset(){return"submit"===this.type||"reset"===this.type}get showIcon(){return this.icon&&this.icon!==wt}get showArrow(){return this.icon===wt}watch(t){switch(t){case"stop":this._observer&&this._observer.disconnect();break;case"start":this._observer||(this._observer=new MutationObserver((()=>this.attachFakeButton()))),this._observer.observe(this,{childList:!0})}}attachFakeButton(){const t=document.createElement("button");t.type=this.type,t.style.display="none",this.watch("stop"),this.appendChild(t),this.watch("start"),this.fakeButton=t}firstUpdated(){this.isTypeSubmitOrReset&&this.attachFakeButton(),"function"==typeof this.onclick&&(this.originalOnclick=this.onclick),this.onclick=t=>{this.handleClick(t,!0)}}handleClick(t,e=!1){t.isTrusted&&this.isTypeSubmitOrReset&&(t.stopPropagation(),this.fakeButton.click());const n=this.onClick||this.originalOnclick;e||"function"!=typeof n||n(t)}render(){const{type:t,motionOff:e,disabled:n,variant:i="",icon:o="",size:s="",href:r,external:l}=this,a={"a-button":!0,"a-button--large":"large"===s,"a-button--small":"small"===s,"a-button--motion":!e,"a-button--secondary":"secondary"===i,"a-button--red":"red"===i,"a-button--inverted":i.includes("inverted"),"a-button--inverted-blue-ocean":"inverted-blue-ocean"===i,"a-button--inverted-red-tosca":"inverted-red-tosca"===i,"a-button--inverted-purple-logan":"inverted-purple-logan"===i,"a-button--inverted-green-viridian":"inverted-green-viridian"===i,"a-button--inverted-blue-teal":"inverted-blue-teal"===i},h=()=>H`<span class="a-button__flex-wrapper">
${this.showIcon?ut(this)`<axa-icon class="a-button__icon" icon="${o}"></axa-icon> `:""}

@@ -65,2 +65,2 @@ <slot></slot>

</button>
`}disconnectedCallback(){super.disconnectedCallback(),this.watch("stop")}}return dt([mt],{"axa-button":{"axa-button":"8.2.0","axa-icon":"8.0.8"}}),mt}();
`}disconnectedCallback(){super.disconnectedCallback(),this.watch("stop")}}return dt([mt],{"axa-button":{"axa-button":"8.2.1","axa-icon":"8.0.9"}}),mt}();

4

lib/index.js
import{html as t,LitElement as n,css as e,unsafeCSS as o}from"lit";import{classMap as r}from"lit/directives/class-map.js";import a from"@axa-ch/icon";const i=t=>!(null==t),s=new Map;[[String,""],[Boolean,!1],[Object,{}],[Array,[]],[Number,0],[Function,()=>{}]].forEach((([t,n])=>{s.set(t,n)}));const c=()=>{},l=t=>{const{constructor:{properties:n}}=t;Object.keys(n).forEach((e=>{const o=n[e],{type:r,converter:a,defaultValue:l}=o;if(!r){if(!a)throw new Error(`<${t.nodeName}> property "${e}" is missing a type!`);return}let u=t[e];i(u)||(u=r===Boolean?t.hasAttribute(e):t.getAttribute(e),i(u)?t[e]=((t,n)=>n===Number?parseFloat(t):n===Function?c:n===Array||n===Object?JSON.parse(t):t)(u,r):void 0===l&&"defaultValue"in o||(t[e]="defaultValue"in o?l:s.get(r)))}))};var u=(t,n)=>{const e=t.toLowerCase();return window.customElements.get(e)||window.customElements.define(e,n),e};const b=(t,n)=>{return`${t}-${e=n,`${e}`.replace(/\./g,"-").replace(/[^A-Za-z0-9-]/g,"")}`;var e},d=(t,n="",e="<")=>`${e}${n}${t}`,p=(t,n,e)=>d(b(t,n),e,"{"),h=(t,n,e)=>t.map((t=>t.split(d(n)).join(p(n,e)).split(d(n,"/")).join(p(n,e,"/")))),f=(t,n,e)=>{const o="string"==typeof n&&n;let r="";return t.forEach((t=>{const a=t instanceof HTMLElement?t.constructor:t,{tagName:i}=a,s=!o&&n[i];if(s){if(!window.customElements.get(i)&&a.versions)throw Error(`'versions' is a reserved class property, but was found in ${i}'s class`);a.versions=s,u(i,a)}let{versions:c}=a;!c&&e&&(c=n[e.constructor.tagName],c[i]=Object.values(c)[0]);const l=o||c[i];r=b(i,l),u(r,class extends a{})})),r},g=n=>(e,...o)=>{const r=n.constructor,[a,i]=(t=>{const{versions:n,tagName:e}=t,o=Object.keys(n).filter((t=>t!==e)).sort(((t,n)=>n.length-t.length));return[o,o.map((t=>n[t]))]})(r);let s=e;for(let t=0,n=a.length;t<n;t++)s=h(s,a[t],i[t]);for(let t=0,n=s.length;t<n;t++)s[t]=s[t].split("{").join("<");return s.raw=s,t(s,...o)};class v extends n{static get tagName(){return"axa-button"}static get styles(){return e`
${o(':host {\n display: inline-block;\n appearance: none;\n}\n\n:host([block]) {\n display: block;\n}\n\n:host([block]) .a-button {\n display: block;\n width: 100%;\n}\n\n.a-button {\n font-size: 14px;\n letter-spacing: 0.02em;\n line-height: 17px;\n font-family: "Source Sans Pro", Arial, sans-serif;\n display: inline-block;\n vertical-align: middle;\n appearance: none;\n position: relative;\n box-sizing: border-box;\n padding: 0 30px;\n margin: 0;\n min-height: 40px;\n width: 100%;\n hyphens: auto;\n overflow-wrap: break-word;\n word-wrap: break-word;\n text-transform: uppercase;\n text-decoration: none;\n color: #fff;\n background-color: #00008f;\n border: solid 2px #00008f;\n border-bottom-color: #00005b;\n text-align: center;\n}\n.a-button:hover, .a-button:active, .a-button:focus {\n cursor: pointer;\n text-decoration: none;\n background-color: #00005b;\n border-color: #00005b;\n outline: 0;\n}\n.a-button:disabled, .a-button[aria-disabled=true] {\n color: #999;\n background-color: #e5e5e5;\n border-color: #e5e5e5;\n border-bottom-color: #ccc;\n pointer-events: none;\n}\n.a-button__flex-wrapper {\n display: flex;\n justify-content: center;\n align-items: center;\n min-height: 36px;\n}\n.a-button__icon {\n display: flex;\n margin-right: 10px;\n}\n.a-button__arrow {\n display: flex;\n margin-left: 10px;\n}\n.a-button--large {\n min-height: 50px;\n font-size: 16px;\n letter-spacing: 0.02em;\n line-height: 24px;\n font-family: "Source Sans Pro", Arial, sans-serif;\n}\n.a-button--large .a-button__flex-wrapper {\n min-height: 46px;\n}\n.a-button--small {\n min-height: 30px;\n font-size: 14px;\n letter-spacing: 0.02em;\n line-height: 17px;\n font-family: "Source Sans Pro", Arial, sans-serif;\n}\n.a-button--motion {\n z-index: 0;\n overflow: hidden;\n transition: color 0.3s cubic-bezier(0.455, 0.03, 0.515, 0.955) 0s;\n}\n.a-button--motion::after {\n position: absolute;\n top: 50%;\n left: 50%;\n z-index: -1;\n display: block;\n width: 0.001px;\n height: 100vw;\n content: "";\n transform: translateX(-50%) translateY(-50%) rotate(45deg);\n transition: width 0.3s cubic-bezier(0.455, 0.03, 0.515, 0.955) 0s;\n background-color: #00005b;\n}\n.a-button--motion:hover, .a-button--motion:focus {\n background-color: #00008f;\n color: #fff;\n}\n.a-button--motion:hover::after, .a-button--motion:focus::after {\n width: 110%;\n background-color: #00005b;\n}\n.a-button--red {\n background-color: #f07662;\n border-color: #f07662;\n border-bottom-color: #ec4d33;\n}\n.a-button--red:hover, .a-button--red:active, .a-button--red:focus {\n background-color: #ec4d33;\n border-color: #ec4d33;\n}\n.a-button--red.a-button--motion::after {\n background-color: #ec4d33;\n}\n.a-button--red.a-button--motion:hover, .a-button--red.a-button--motion:focus {\n background-color: #f07662;\n color: #fff;\n}\n.a-button--red.a-button--motion:hover::after, .a-button--red.a-button--motion:focus::after {\n background-color: #ec4d33;\n}\n.a-button--secondary {\n background-color: transparent;\n border-bottom-color: #00008f;\n color: #00008f;\n}\n.a-button--secondary:hover, .a-button--secondary:active, .a-button--secondary:focus {\n color: #fff;\n}\n.a-button--secondary.a-button--motion {\n background-color: transparent;\n}\n.a-button--inverted {\n background-color: transparent;\n border-color: #fff;\n color: #fff;\n}\n.a-button--inverted:hover, .a-button--inverted:active, .a-button--inverted:focus {\n background-color: #fff;\n border-color: #fff;\n color: #00005b;\n}\n.a-button--inverted.a-button--motion {\n background-color: transparent;\n}\n.a-button--inverted.a-button--motion::after {\n background-color: #fff;\n}\n.a-button--inverted-blue-ocean:hover, .a-button--inverted-blue-ocean:active, .a-button--inverted-blue-ocean:focus {\n color: #4976ba;\n}\n.a-button--inverted-red-tosca:hover, .a-button--inverted-red-tosca:active, .a-button--inverted-red-tosca:focus {\n color: #914146;\n}\n.a-button--inverted-purple-logan:hover, .a-button--inverted-purple-logan:active, .a-button--inverted-purple-logan:focus {\n color: #9190ac;\n}\n.a-button--inverted-green-viridian:hover, .a-button--inverted-green-viridian:active, .a-button--inverted-green-viridian:focus {\n color: #668980;\n}\n.a-button--inverted-blue-teal:hover, .a-button--inverted-blue-teal:active, .a-button--inverted-blue-teal:focus {\n color: #027180;\n}')}
`}static get properties(){return{type:{type:String,reflect:!0,defaultValue:"button"},variant:{type:String},icon:{type:String},size:{type:String},block:{type:Boolean,reflect:!0},motionOff:{type:Boolean},disabled:{type:Boolean,reflect:!0},href:{type:String},external:{type:Boolean},onClick:{type:Function,attribute:!1}}}constructor(){super(),l(this),f([a],{"axa-button":{"axa-button":"8.2.0","axa-icon":"8.0.8"}},this),this.handleClick=this.handleClick.bind(this)}get isTypeSubmitOrReset(){return"submit"===this.type||"reset"===this.type}get showIcon(){return this.icon&&"arrow-right"!==this.icon}get showArrow(){return"arrow-right"===this.icon}watch(t){switch(t){case"stop":this._observer&&this._observer.disconnect();break;case"start":this._observer||(this._observer=new MutationObserver((()=>this.attachFakeButton()))),this._observer.observe(this,{childList:!0})}}attachFakeButton(){const t=document.createElement("button");t.type=this.type,t.style.display="none",this.watch("stop"),this.appendChild(t),this.watch("start"),this.fakeButton=t}firstUpdated(){this.isTypeSubmitOrReset&&this.attachFakeButton(),"function"==typeof this.onclick&&(this.originalOnclick=this.onclick),this.onclick=t=>{this.handleClick(t,!0)}}handleClick(t,n=!1){t.isTrusted&&this.isTypeSubmitOrReset&&(t.stopPropagation(),this.fakeButton.click());const e=this.onClick||this.originalOnclick;n||"function"!=typeof e||e(t)}render(){const{type:n,motionOff:e,disabled:o,variant:a="",icon:i="",size:s="",href:c,external:l}=this,u={"a-button":!0,"a-button--large":"large"===s,"a-button--small":"small"===s,"a-button--motion":!e,"a-button--secondary":"secondary"===a,"a-button--red":"red"===a,"a-button--inverted":a.includes("inverted"),"a-button--inverted-blue-ocean":"inverted-blue-ocean"===a,"a-button--inverted-red-tosca":"inverted-red-tosca"===a,"a-button--inverted-purple-logan":"inverted-purple-logan"===a,"a-button--inverted-green-viridian":"inverted-green-viridian"===a,"a-button--inverted-blue-teal":"inverted-blue-teal"===a},b=()=>t`<span class="a-button__flex-wrapper">
`}static get properties(){return{type:{type:String,reflect:!0,defaultValue:"button"},variant:{type:String},icon:{type:String},size:{type:String},block:{type:Boolean,reflect:!0},motionOff:{type:Boolean},disabled:{type:Boolean,reflect:!0},href:{type:String},external:{type:Boolean},onClick:{type:Function,attribute:!1}}}constructor(){super(),l(this),f([a],{"axa-button":{"axa-button":"8.2.1","axa-icon":"8.0.9"}},this),this.handleClick=this.handleClick.bind(this)}get isTypeSubmitOrReset(){return"submit"===this.type||"reset"===this.type}get showIcon(){return this.icon&&"arrow-right"!==this.icon}get showArrow(){return"arrow-right"===this.icon}watch(t){switch(t){case"stop":this._observer&&this._observer.disconnect();break;case"start":this._observer||(this._observer=new MutationObserver((()=>this.attachFakeButton()))),this._observer.observe(this,{childList:!0})}}attachFakeButton(){const t=document.createElement("button");t.type=this.type,t.style.display="none",this.watch("stop"),this.appendChild(t),this.watch("start"),this.fakeButton=t}firstUpdated(){this.isTypeSubmitOrReset&&this.attachFakeButton(),"function"==typeof this.onclick&&(this.originalOnclick=this.onclick),this.onclick=t=>{this.handleClick(t,!0)}}handleClick(t,n=!1){t.isTrusted&&this.isTypeSubmitOrReset&&(t.stopPropagation(),this.fakeButton.click());const e=this.onClick||this.originalOnclick;n||"function"!=typeof e||e(t)}render(){const{type:n,motionOff:e,disabled:o,variant:a="",icon:i="",size:s="",href:c,external:l}=this,u={"a-button":!0,"a-button--large":"large"===s,"a-button--small":"small"===s,"a-button--motion":!e,"a-button--secondary":"secondary"===a,"a-button--red":"red"===a,"a-button--inverted":a.includes("inverted"),"a-button--inverted-blue-ocean":"inverted-blue-ocean"===a,"a-button--inverted-red-tosca":"inverted-red-tosca"===a,"a-button--inverted-purple-logan":"inverted-purple-logan"===a,"a-button--inverted-green-viridian":"inverted-green-viridian"===a,"a-button--inverted-blue-teal":"inverted-blue-teal"===a},b=()=>t`<span class="a-button__flex-wrapper">
${this.showIcon?g(this)`<axa-icon class="a-button__icon" icon="${i}"></axa-icon> `:""}

@@ -24,2 +24,2 @@ <slot></slot>

</button>
`}disconnectedCallback(){super.disconnectedCallback(),this.watch("stop")}}f([v],{"axa-button":{"axa-button":"8.2.0","axa-icon":"8.0.8"}});export{v as default};
`}disconnectedCallback(){super.disconnectedCallback(),this.watch("stop")}}f([v],{"axa-button":{"axa-button":"8.2.1","axa-icon":"8.0.9"}});export{v as default};

6

lib/index.react.d.ts
import React from 'react';
import { Icon } from '@axa-ch/icon/lib/index.d';
export interface AXAMouseEvent<T = HTMLElement> extends MouseEvent {
target: EventTarget & T;
}
export type ButtonType = 'button' | 'submit' | 'reset';

@@ -29,3 +33,3 @@ export type Size = 'small' | 'large';

external?: boolean;
onClick?: (event: MouseEvent) => void;
onClick?: (event: AXAMouseEvent) => void;
}

@@ -32,0 +36,0 @@

4

lib/index.react.js
import{html as t,LitElement as n,css as e,unsafeCSS as o}from"lit";import{classMap as r}from"lit/directives/class-map.js";import a from"@axa-ch/icon";const{customElements:i}=window,s=new Map,c=new WeakMap;if(i){const{define:t}=i;i.define=(n,e)=>(s.set(e,n),t.call(i,n,e))}const l=({attrs:t,events:n,props:e,ref:o})=>r=>{r&&(((t,n)=>{n&&Object.keys(n).forEach((e=>{const o=n[e];null==o?t.removeAttribute(e):t.setAttribute(e,o)}))})(r,t),((t,n={})=>{const e=c.get(t)||{};c.set(t,n),Object.keys(e).forEach((o=>{e[o]&&e[o]!==n[o]&&t.removeEventListener(o,e[o])})),Object.keys(n).forEach((o=>{n[o]!==e[o]&&t.addEventListener(o,n[o])}))})(r,n),((t,n)=>{Object.keys(n||{}).forEach((e=>{t[e]=n[e]}))})(r,e)),((t,n)=>{n&&n(t)})(r,o)},u=t=>(n,e,...o)=>{const r=(t=>s.get(t)||t)(n),a=(t=>{const{attrs:n,events:e,ref:o,key:r,dangerouslySetInnerHTML:a,...i}=t||{};return{ref:l({attrs:n,events:e,props:i,ref:o}),key:r,dangerouslySetInnerHTML:a}})(e);return t(r,a,...o)};var b=(t,n)=>{const e=t.toLowerCase();return window.customElements.get(e)||window.customElements.define(e,n),e};const d=(t,n)=>{return`${t}-${e=n,`${e}`.replace(/\./g,"-").replace(/[^A-Za-z0-9-]/g,"")}`;var e},p=(t,n="",e="<")=>`${e}${n}${t}`,f=(t,n,e)=>p(d(t,n),e,"{"),h=(t,n,e)=>t.map((t=>t.split(p(n)).join(f(n,e)).split(p(n,"/")).join(f(n,e,"/")))),v=(t,n,e)=>{const o="string"==typeof n&&n;let r="";return t.forEach((t=>{const a=t instanceof HTMLElement?t.constructor:t,{tagName:i}=a,s=!o&&n[i];if(s){if(!window.customElements.get(i)&&a.versions)throw Error(`'versions' is a reserved class property, but was found in ${i}'s class`);a.versions=s,b(i,a)}let{versions:c}=a;!c&&e&&(c=n[e.constructor.tagName],c[i]=Object.values(c)[0]);const l=o||c[i];r=d(i,l),b(r,class extends a{})})),r},g=n=>(e,...o)=>{const r=n.constructor,[a,i]=(t=>{const{versions:n,tagName:e}=t,o=Object.keys(n).filter((t=>t!==e)).sort(((t,n)=>n.length-t.length));return[o,o.map((t=>n[t]))]})(r);let s=e;for(let t=0,n=a.length;t<n;t++)s=h(s,a[t],i[t]);for(let t=0,n=s.length;t<n;t++)s[t]=s[t].split("{").join("<");return s.raw=s,t(s,...o)},m=(t,n)=>{const e={},o={};let r;return Object.keys(t).forEach((a=>{const i=t[a];let s;const c=n.properties[a]||{},{type:l}=c;switch(s=0===a.indexOf("on")&&a.charAt(2)===a.charAt(2).toUpperCase()?Function:"className"===a?"className":l,s){case"className":case Array:case Object:case Function:case Boolean:r=o;break;default:r=l?o:e}void 0!==i&&(r[a]="style"===a?(t=>Object.keys(t).reduce(((n,e)=>{let o=n;return`${o+=e.split(/(?=[A-Z])/).join("-").toLowerCase()}:${t[e]};`}),""))(i):i)})),{attrs:e,props:o}};const y=t=>!(null==t),k=new Map;[[String,""],[Boolean,!1],[Object,{}],[Array,[]],[Number,0],[Function,()=>{}]].forEach((([t,n])=>{k.set(t,n)}));const w=()=>{},x=t=>{const{constructor:{properties:n}}=t;Object.keys(n).forEach((e=>{const o=n[e],{type:r,converter:a,defaultValue:i}=o;if(!r){if(!a)throw new Error(`<${t.nodeName}> property "${e}" is missing a type!`);return}let s=t[e];y(s)||(s=r===Boolean?t.hasAttribute(e):t.getAttribute(e),y(s)?t[e]=((t,n)=>n===Number?parseFloat(t):n===Function?w:n===Array||n===Object?JSON.parse(t):t)(s,r):void 0===i&&"defaultValue"in o||(t[e]="defaultValue"in o?i:k.get(r)))}))};class $ extends n{static get tagName(){return"axa-button"}static get styles(){return e`
${o(':host {\n display: inline-block;\n appearance: none;\n}\n\n:host([block]) {\n display: block;\n}\n\n:host([block]) .a-button {\n display: block;\n width: 100%;\n}\n\n.a-button {\n font-size: 14px;\n letter-spacing: 0.02em;\n line-height: 17px;\n font-family: "Source Sans Pro", Arial, sans-serif;\n display: inline-block;\n vertical-align: middle;\n appearance: none;\n position: relative;\n box-sizing: border-box;\n padding: 0 30px;\n margin: 0;\n min-height: 40px;\n width: 100%;\n hyphens: auto;\n overflow-wrap: break-word;\n word-wrap: break-word;\n text-transform: uppercase;\n text-decoration: none;\n color: #fff;\n background-color: #00008f;\n border: solid 2px #00008f;\n border-bottom-color: #00005b;\n text-align: center;\n}\n.a-button:hover, .a-button:active, .a-button:focus {\n cursor: pointer;\n text-decoration: none;\n background-color: #00005b;\n border-color: #00005b;\n outline: 0;\n}\n.a-button:disabled, .a-button[aria-disabled=true] {\n color: #999;\n background-color: #e5e5e5;\n border-color: #e5e5e5;\n border-bottom-color: #ccc;\n pointer-events: none;\n}\n.a-button__flex-wrapper {\n display: flex;\n justify-content: center;\n align-items: center;\n min-height: 36px;\n}\n.a-button__icon {\n display: flex;\n margin-right: 10px;\n}\n.a-button__arrow {\n display: flex;\n margin-left: 10px;\n}\n.a-button--large {\n min-height: 50px;\n font-size: 16px;\n letter-spacing: 0.02em;\n line-height: 24px;\n font-family: "Source Sans Pro", Arial, sans-serif;\n}\n.a-button--large .a-button__flex-wrapper {\n min-height: 46px;\n}\n.a-button--small {\n min-height: 30px;\n font-size: 14px;\n letter-spacing: 0.02em;\n line-height: 17px;\n font-family: "Source Sans Pro", Arial, sans-serif;\n}\n.a-button--motion {\n z-index: 0;\n overflow: hidden;\n transition: color 0.3s cubic-bezier(0.455, 0.03, 0.515, 0.955) 0s;\n}\n.a-button--motion::after {\n position: absolute;\n top: 50%;\n left: 50%;\n z-index: -1;\n display: block;\n width: 0.001px;\n height: 100vw;\n content: "";\n transform: translateX(-50%) translateY(-50%) rotate(45deg);\n transition: width 0.3s cubic-bezier(0.455, 0.03, 0.515, 0.955) 0s;\n background-color: #00005b;\n}\n.a-button--motion:hover, .a-button--motion:focus {\n background-color: #00008f;\n color: #fff;\n}\n.a-button--motion:hover::after, .a-button--motion:focus::after {\n width: 110%;\n background-color: #00005b;\n}\n.a-button--red {\n background-color: #f07662;\n border-color: #f07662;\n border-bottom-color: #ec4d33;\n}\n.a-button--red:hover, .a-button--red:active, .a-button--red:focus {\n background-color: #ec4d33;\n border-color: #ec4d33;\n}\n.a-button--red.a-button--motion::after {\n background-color: #ec4d33;\n}\n.a-button--red.a-button--motion:hover, .a-button--red.a-button--motion:focus {\n background-color: #f07662;\n color: #fff;\n}\n.a-button--red.a-button--motion:hover::after, .a-button--red.a-button--motion:focus::after {\n background-color: #ec4d33;\n}\n.a-button--secondary {\n background-color: transparent;\n border-bottom-color: #00008f;\n color: #00008f;\n}\n.a-button--secondary:hover, .a-button--secondary:active, .a-button--secondary:focus {\n color: #fff;\n}\n.a-button--secondary.a-button--motion {\n background-color: transparent;\n}\n.a-button--inverted {\n background-color: transparent;\n border-color: #fff;\n color: #fff;\n}\n.a-button--inverted:hover, .a-button--inverted:active, .a-button--inverted:focus {\n background-color: #fff;\n border-color: #fff;\n color: #00005b;\n}\n.a-button--inverted.a-button--motion {\n background-color: transparent;\n}\n.a-button--inverted.a-button--motion::after {\n background-color: #fff;\n}\n.a-button--inverted-blue-ocean:hover, .a-button--inverted-blue-ocean:active, .a-button--inverted-blue-ocean:focus {\n color: #4976ba;\n}\n.a-button--inverted-red-tosca:hover, .a-button--inverted-red-tosca:active, .a-button--inverted-red-tosca:focus {\n color: #914146;\n}\n.a-button--inverted-purple-logan:hover, .a-button--inverted-purple-logan:active, .a-button--inverted-purple-logan:focus {\n color: #9190ac;\n}\n.a-button--inverted-green-viridian:hover, .a-button--inverted-green-viridian:active, .a-button--inverted-green-viridian:focus {\n color: #668980;\n}\n.a-button--inverted-blue-teal:hover, .a-button--inverted-blue-teal:active, .a-button--inverted-blue-teal:focus {\n color: #027180;\n}')}
`}static get properties(){return{type:{type:String,reflect:!0,defaultValue:"button"},variant:{type:String},icon:{type:String},size:{type:String},block:{type:Boolean,reflect:!0},motionOff:{type:Boolean},disabled:{type:Boolean,reflect:!0},href:{type:String},external:{type:Boolean},onClick:{type:Function,attribute:!1}}}constructor(){super(),x(this),v([a],{"axa-button":{"axa-button":"8.2.0","axa-icon":"8.0.8"}},this),this.handleClick=this.handleClick.bind(this)}get isTypeSubmitOrReset(){return"submit"===this.type||"reset"===this.type}get showIcon(){return this.icon&&"arrow-right"!==this.icon}get showArrow(){return"arrow-right"===this.icon}watch(t){switch(t){case"stop":this._observer&&this._observer.disconnect();break;case"start":this._observer||(this._observer=new MutationObserver((()=>this.attachFakeButton()))),this._observer.observe(this,{childList:!0})}}attachFakeButton(){const t=document.createElement("button");t.type=this.type,t.style.display="none",this.watch("stop"),this.appendChild(t),this.watch("start"),this.fakeButton=t}firstUpdated(){this.isTypeSubmitOrReset&&this.attachFakeButton(),"function"==typeof this.onclick&&(this.originalOnclick=this.onclick),this.onclick=t=>{this.handleClick(t,!0)}}handleClick(t,n=!1){t.isTrusted&&this.isTypeSubmitOrReset&&(t.stopPropagation(),this.fakeButton.click());const e=this.onClick||this.originalOnclick;n||"function"!=typeof e||e(t)}render(){const{type:n,motionOff:e,disabled:o,variant:a="",icon:i="",size:s="",href:c,external:l}=this,u={"a-button":!0,"a-button--large":"large"===s,"a-button--small":"small"===s,"a-button--motion":!e,"a-button--secondary":"secondary"===a,"a-button--red":"red"===a,"a-button--inverted":a.includes("inverted"),"a-button--inverted-blue-ocean":"inverted-blue-ocean"===a,"a-button--inverted-red-tosca":"inverted-red-tosca"===a,"a-button--inverted-purple-logan":"inverted-purple-logan"===a,"a-button--inverted-green-viridian":"inverted-green-viridian"===a,"a-button--inverted-blue-teal":"inverted-blue-teal"===a},b=()=>t`<span class="a-button__flex-wrapper">
`}static get properties(){return{type:{type:String,reflect:!0,defaultValue:"button"},variant:{type:String},icon:{type:String},size:{type:String},block:{type:Boolean,reflect:!0},motionOff:{type:Boolean},disabled:{type:Boolean,reflect:!0},href:{type:String},external:{type:Boolean},onClick:{type:Function,attribute:!1}}}constructor(){super(),x(this),v([a],{"axa-button":{"axa-button":"8.2.1","axa-icon":"8.0.9"}},this),this.handleClick=this.handleClick.bind(this)}get isTypeSubmitOrReset(){return"submit"===this.type||"reset"===this.type}get showIcon(){return this.icon&&"arrow-right"!==this.icon}get showArrow(){return"arrow-right"===this.icon}watch(t){switch(t){case"stop":this._observer&&this._observer.disconnect();break;case"start":this._observer||(this._observer=new MutationObserver((()=>this.attachFakeButton()))),this._observer.observe(this,{childList:!0})}}attachFakeButton(){const t=document.createElement("button");t.type=this.type,t.style.display="none",this.watch("stop"),this.appendChild(t),this.watch("start"),this.fakeButton=t}firstUpdated(){this.isTypeSubmitOrReset&&this.attachFakeButton(),"function"==typeof this.onclick&&(this.originalOnclick=this.onclick),this.onclick=t=>{this.handleClick(t,!0)}}handleClick(t,n=!1){t.isTrusted&&this.isTypeSubmitOrReset&&(t.stopPropagation(),this.fakeButton.click());const e=this.onClick||this.originalOnclick;n||"function"!=typeof e||e(t)}render(){const{type:n,motionOff:e,disabled:o,variant:a="",icon:i="",size:s="",href:c,external:l}=this,u={"a-button":!0,"a-button--large":"large"===s,"a-button--small":"small"===s,"a-button--motion":!e,"a-button--secondary":"secondary"===a,"a-button--red":"red"===a,"a-button--inverted":a.includes("inverted"),"a-button--inverted-blue-ocean":"inverted-blue-ocean"===a,"a-button--inverted-red-tosca":"inverted-red-tosca"===a,"a-button--inverted-purple-logan":"inverted-purple-logan"===a,"a-button--inverted-green-viridian":"inverted-green-viridian"===a,"a-button--inverted-blue-teal":"inverted-blue-teal"===a},b=()=>t`<span class="a-button__flex-wrapper">
${this.showIcon?g(this)`<axa-icon class="a-button__icon" icon="${i}"></axa-icon> `:""}

@@ -24,2 +24,2 @@ <slot></slot>

</button>
`}disconnectedCallback(){super.disconnectedCallback(),this.watch("stop")}}v([$],{"axa-button":{"axa-button":"8.2.0","axa-icon":"8.0.8"}});var O=(t,n)=>((t,n,e)=>{const{tagName:o}=n,r=e?v([n],e):o,a=r.split("-").map((t=>t.charAt(0).toUpperCase()+t.slice(1))).join(""),i=({children:e,...o})=>{const{attrs:a,props:i}=m(o,n);return u(t)(r,{isReact:!0,attrs:a,...i},e)};return i.displayName=a,i})(t,$,n);export{O as default};
`}disconnectedCallback(){super.disconnectedCallback(),this.watch("stop")}}v([$],{"axa-button":{"axa-button":"8.2.1","axa-icon":"8.0.9"}});var O=(t,n)=>((t,n,e)=>{const{tagName:o}=n,r=e?v([n],e):o,a=r.split("-").map((t=>t.charAt(0).toUpperCase()+t.slice(1))).join(""),i=({children:e,...o})=>{const{attrs:a,props:i}=m(o,n);return u(t)(r,{isReact:!0,attrs:a,...i},e)};return i.displayName=a,i})(t,$,n);export{O as default};

4

package.json
{
"name": "@axa-ch/button",
"version": "8.2.1",
"version": "8.2.2",
"description": "The button component for the AXA Pattern Library",

@@ -37,4 +37,4 @@ "author": "Pattern Warriors",

},
"gitHead": "41a7cd3001474688cd2c5a4d2d8bbafec075bc62",
"gitHead": "4a5e12b0663014ffce793ad13aa6e28135a22a52",
"main": "lib/index.js"
}
SocketSocket SOC 2 Logo

Product

  • Package Alerts
  • Integrations
  • Docs
  • Pricing
  • FAQ
  • Roadmap
  • Changelog

About

Packages

npm

Go

Maven

PyPI

Rubygems

Stay in touch

Get open source security insights delivered straight into your inbox.

  • Terms
  • Privacy
  • Security

Made with ⚡️ by Socket Inc