import{LitElement as t,html as e,css as n}from"lit";import{ifDefined as i}from"lit/directives/if-defined.js";import{skeletonStyles as l}from"./styles/skeleton.js";import{ccLink as o,linkStyles as a}from"./templates/cc-link/cc-link.js";import{i18n as r}from"./translation.js";import"./cc-block.js";import"./cc-img.js";import"./cc-notice.js";import"./cc-zone.js";const s=[{name:"??????????????????",link:null,variantName:null,variantLogoUrl:null,zone:null},{name:"???????????????????????",link:null,variantName:null,variantLogoUrl:null,zone:null},{name:"????????????????????",link:null,variantName:null,variantLogoUrl:null,zone:null}];class c extends t{static get properties(){return{state:{type:Object}}}constructor(){super(),this.state={type:"loading"}}_getEmptyContent(){return e`<div slot=content>${r("cc-addon-linked-apps.details")}</div><div slot=content class=empty-msg>${r("cc-addon-linked-apps.no-linked-applications")}</div>`}_getErrorContent(){return e`<cc-notice slot=content intent=warning message=${r("cc-addon-linked-apps.loading-error")}></cc-notice>`}_getZoneState(t,e){return t?{type:"loading"}:{type:"loaded",...e}}render(){if("error"===this.state.type)return this._renderView(this._getErrorContent());const t="loading"===this.state.type,n="loaded"===this.state.type?this.state.linkedApplications:s;if(!(n.length>0))return this._renderView(this._getEmptyContent());const l=e`<div slot=content>${r("cc-addon-linked-apps.details")}</div>${n.map((n=>e`<div slot=content class=application><cc-img class=logo ?skeleton=${t} src=${i(n.variantLogoUrl)} title=${i(n.variantName)}></cc-img><div class=details><span class=name>${o(n.link,n.name,t)}</span><cc-zone mode=small .state=${this._getZoneState(t,n.zone)}></cc-zone></div></div>`))}`;return this._renderView(l)}_renderView(t){return e`<cc-block><div slot=header-title>${r("cc-addon-linked-apps.title")}</div>${t}</cc-block>`}static get styles(){return[a,l,n`:host{display:block}.application{align-items:flex-start;display:flex;line-height:1.6em}.logo{border-radius:var(--cc-border-radius-default,.25em);flex:0 0 auto;height:1.6em;width:1.6em}.details{align-items:center;display:flex;flex-wrap:wrap;gap:.5em;margin-left:.5em}.empty-msg{color:var(--cc-color-text-weak);font-style:italic}.name.skeleton{background-color:#bbb}[title]{cursor:help}`]}}window.customElements.define("cc-addon-linked-apps",c);export{c as CcAddonLinkedApps};
//# sourceMappingURL=cc-addon-linked-apps.js.map
