import*as ComponentHelpers from"../../components/helpers/helpers.js";import*as IconButton from"../../components/icon_button/icon_button.js";import*as LitHtml from"../../lit-html/lit-html.js";import markdownImageStyles from"./markdownImage.css.js";import{getMarkdownImage}from"./MarkdownImagesMap.js";export class MarkdownImage extends HTMLElement{static litTagName=LitHtml.literal`devtools-markdown-image`;#t=this.attachShadow({mode:"open"});#e;#a;connectedCallback(){this.#t.adoptedStyleSheets=[markdownImageStyles]}set data(t){const{key:e,title:a}=t,o=getMarkdownImage(e);this.#e=o,this.#a=a,this.#o()}#i(){if(!this.#e)return LitHtml.html``;const{src:t,color:e,width:a="100%",height:o="100%"}=this.#e;return LitHtml.html`
      <${IconButton.Icon.Icon.litTagName} .data=${{iconPath:t,color:e,width:a,height:o}}></${IconButton.Icon.Icon.litTagName}>
    `}#m(){if(!this.#e)return LitHtml.html``;const{src:t,width:e="100%",height:a="100%"}=this.#e;return LitHtml.html`
      <img class="markdown-image" src=${t} alt=${this.#a} width=${e} height=${a}/>
    `}#o(){if(!this.#e)return;const{isIcon:t}=this.#e,e=t?this.#i():this.#m();LitHtml.render(e,this.#t,{host:this})}}ComponentHelpers.CustomElements.defineComponent("devtools-markdown-image",MarkdownImage);