import{LitElement as e,html as s,css as t}from"lit";import{classMap as c}from"lit/directives/class-map.js";import{iconRemixInformationFill as i}from"./assets/cc-remix.icons.js";import{skeletonStyles as a}from"./styles/skeleton.js";import{ccLink as r,linkStyles as o}from"./templates/cc-link/cc-link.js";import{i18n as n}from"./translation.js";import"./cc-block.js";import"./cc-icon.js";import"./cc-img.js";import"./cc-notice.js";const l=["elasticsearch","kibana","apm"];class p extends e{static get properties(){return{state:{type:Object}}}constructor(){super(),this.state={type:"loading",links:[{type:"elasticsearch"},{type:"kibana"},{type:"apm"}]}}_getLinkText(e){switch(e){case"elasticsearch":return n("cc-elasticsearch-info.link.elasticsearch");case"kibana":return n("cc-elasticsearch-info.link.kibana");case"apm":return n("cc-elasticsearch-info.link.apm")}}_getLogo(e){switch(e){case"elasticsearch":return"https://assets.clever-cloud.com/logos/elastic.svg";case"kibana":return"https://assets.clever-cloud.com/logos/elasticsearch-kibana.svg";case"apm":return"https://assets.clever-cloud.com/logos/elasticsearch-apm.svg"}}_getSortedLinks(e){return e.sort(((e,s)=>l.indexOf(e.type)-l.indexOf(s.type)))}render(){const e="loading"===this.state.type;return"error"===this.state.type?s`<cc-notice intent=warning message=${n("cc-elasticsearch-info.error")}></cc-notice>`:s`<cc-block ribbon=${n("cc-elasticsearch-info.info")} no-head><div class=info-text>${n("cc-elasticsearch-info.text")}</div><div class=link-list>${r("https://www.clever-cloud.com/doc/addons/elastic/",s`<cc-icon size=lg .icon=${i}></cc-icon><span>${n("cc-elasticsearch-info.link.doc")}</span>`)} ${this._renderLinks(this.state.links,e)}</div></cc-block>`}_renderLinks(e,t){return this._getSortedLinks(e).map((({href:e,type:i})=>r(e,s`<cc-img src=${this._getLogo(i)}></cc-img><span class=${c({skeleton:t})}>${this._getLinkText(i)}</span>`)))}static get styles(){return[a,o,t`:host{display:block}.link-list{display:flex;flex-wrap:wrap;gap:1em}.cc-link{align-items:center;display:flex}cc-img{border-radius:var(--cc-border-radius-default,.25em);flex:0 0 auto;height:1.5em;margin-right:.5em;width:1.5em}cc-icon{flex:0 0 auto;margin-right:.5em}.skeleton{background-color:#bbb}`]}}window.customElements.define("cc-elasticsearch-info",p);export{p as CcElasticsearchInfo};
//# sourceMappingURL=cc-elasticsearch-info.js.map
