UNPKG

vicowa-web-components

Version:
2 lines 1.51 kB
import{WebComponentBaseClass as t}from"/third_party/web-component-base-class/dist/web-component-base-class.js";import"../vicowa-icon-set/vicowa-icon-set.js";window.customElements.define("vicowa-icon",class VicowaIcon extends t{#t;constructor(){super(),this.#t=null}static get properties(){return{icon:{type:String,reflectToAttribute:!0,value:"",observer:t=>t.#n()}}}detached(){this.$.iconSource.constructor.removeCallback(this)}#n(){this.$.iconContainer.innerHTML="",this.$.iconSource.onAttached=()=>{this.$.iconSource.constructor.getIcon(this,this.icon,(t=>{this.$.iconContainer.innerHTML="",t&&this.$.iconContainer.appendChild(t.cloneNode(!0))}))}}static get template(){return'\n\t\t\t<vicowa-icon-set id="icon-source"></vicowa-icon-set>\n\t\t\t<style>\n\t\t\t\t/* these styles make the icon fit to its container */\n\t\t\t\t:host {\n\t\t\t\t\tposition: relative;\n\t\t\t\t\tdisplay: block;\n\t\t\t\t\tmargin: 0;\n\t\t\t\t\tpadding: 0;\n\t\t\t\t\tbox-sizing: border-box;\n\t\t\t\t\twidth: 100%;\n\t\t\t\t\theight: 100%;\n\t\t\t\t}\n\t\t\n\t\t\t\tsvg {\n\t\t\t\t\twidth: 100%;\n\t\t\t\t\theight: 100%;\n\t\t\t\t}\n\t\t\n\t\t\t\t/* these styles allow you to change the icon color if they are not explicitly specified in the icon itself */\n\t\t\t\t#icon-container {\n\t\t\t\t\tstroke: var(--vicowa-icon-line-color, black);\n\t\t\t\t\tfill: var(--vicowa-icon-fill-color, none);\n\t\t\t\t}\n\t\t\t\t</style>\n\t\t\t<svg id="icon-container" viewBox="0 0 24 24"></svg>\n\t\t'}}); //# sourceMappingURL=vicowa-icon.js.map