import{LitElement as e,html as t,css as c}from"lit";import{classMap as s}from"lit/directives/class-map.js";import{iconRemixInformationFill as i}from"./assets/cc-remix.icons.js";import{skeletonStyles as r}from"./styles/skeleton.js";import{ccLink as a,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 m 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,t)=>l.indexOf(e.type)-l.indexOf(t.type)))}render(){const e="loading"===this.state.type;return"error"===this.state.type?t`<cc-notice intent=warning message=${n("cc-elasticsearch-info.error")}></cc-notice>`:t`<cc-block><div slot=ribbon>${n("cc-elasticsearch-info.info")}</div><div slot=content class=info-text>${n("cc-elasticsearch-info.text")}</div><div slot=content class=link-list>${this._renderLinks(this.state.links,e)}</div><div slot=footer-right>${a("https://www.clever-cloud.com/doc/addons/elastic/",t`<cc-icon .icon=${i}></cc-icon>${n("cc-elasticsearch-info.documentation.text")}`)}</div></cc-block>`}_renderLinks(e,c){return this._getSortedLinks(e).map((({href:e,type:i})=>a(e,t`<cc-img src=${this._getLogo(i)}></cc-img><span class=${s({skeleton:c})}>${this._getLinkText(i)}</span>`)))}static get styles(){return[r,o,c`: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",m);export{m as CcElasticsearchInfo};
//# sourceMappingURL=cc-elasticsearch-info.js.map
