import{LitElement as e,html as t,css as i}from"lit";import{classMap as s}from"lit/directives/class-map.js";import{fakeString as r}from"./lib/fake-strings.js";import{skeletonStyles as a}from"./styles/skeleton.js";import{linkStyles as c}from"./templates/cc-link/cc-link.js";import{i18n as o}from"./translation.js";import"./cc-img.js";const d={heading:r(6),description:r(110),link:null,icons:[]};class l extends e{static get properties(){return{state:{type:Object}}}constructor(){super(),this.state={type:"loading"}}render(){const e="loading"===this.state.type,{heading:i,description:r,link:a}="loaded"===this.state.type?this.state:d;return t`<div class=images>${e?t`<cc-img skeleton></cc-img>`:""} ${"loaded"===this.state.type?t`${this.state.icons.map((e=>t`<cc-img src=${e}></cc-img>`))}`:""}</div><div class=title><span class=${s({skeleton:e})}>${i}</span></div><div class=desc><span class=${s({skeleton:e})}>${r}</span></div><div class="${s({skeleton:e})} link">${"loaded"===this.state.type?o("cc-doc-card.link",{link:a,product:i}):o("cc-doc-card.skeleton-link-title")}</div>`}static get styles(){return[c,a,i`:host{background-color:var(--cc-color-bg-default,#fff);border:1px solid var(--cc-color-border-neutral,#aaa);border-radius:var(--cc-border-radius-default,.25em);box-sizing:border-box;display:grid;gap:1em;grid-template-areas:'img title' 'desc desc' 'link link';grid-template-columns:min-content 1fr;grid-template-rows:min-content 1fr min-content;padding:1em}.images{display:flex;gap:.5em;grid-area:img}cc-img{border-radius:var(--cc-border-radius-default,.25em);height:2em;width:2em}.title{align-self:center;font-size:1.2em;font-weight:700;grid-area:title;justify-self:start}.desc{grid-area:desc}.link{align-self:end;grid-area:link;justify-self:end}.skeleton{background-color:#bbb}`]}}window.customElements.define("cc-doc-card",l);export{l as CcDocCard};
//# sourceMappingURL=cc-doc-card.js.map
