import*as LitHtml from"../third_party/lit-html/lit-html.js";export class ElementsPanelLink extends HTMLElement{constructor(){super(...arguments),this.shadow=this.attachShadow({mode:"open"}),this.onElementRevealIconClick=()=>{},this.onElementRevealIconMouseEnter=()=>{},this.onElementRevealIconMouseLeave=()=>{}}set data(e){this.onElementRevealIconClick=e.onElementRevealIconClick,this.onElementRevealIconMouseEnter=e.onElementRevealIconMouseEnter,this.onElementRevealIconMouseLeave=e.onElementRevealIconMouseLeave,this.update()}update(){this.render()}render(){LitHtml.render(LitHtml.html`
      <style>
        .element-reveal-icon {
          display: inline-block;
          width: 28px;
          height: 24px;
          -webkit-mask-position: -140px 96px;
          -webkit-mask-image: url(Images/largeIcons.svg);
          background-color: rgb(110 110 110); /* stylelint-disable-line plugin/use_theme_colors */
          /* See: crbug.com/1152736 for color variable migration. */
        }
      </style>
      <span
        class="element-reveal-icon"
        @click=${this.onElementRevealIconClick}
        @mouseenter=${this.onElementRevealIconMouseEnter}
        @mouseleave=${this.onElementRevealIconMouseLeave}></span>
      `,this.shadow)}}customElements.define("devtools-elements-panel-link",ElementsPanelLink);