@yuebai008/cli
Version:
Command line interface for rapid qg-minigame development
13 lines • 1.42 kB
JavaScript
import*as ComponentHelpers from"../../../ui/components/helpers/helpers.js";import*as LitHtml from"../../../ui/lit-html/lit-html.js";import computedStylePropertyStyles from"./computedStyleProperty.css.js";const{render:render,html:html}=LitHtml;export class NavigateToSourceEvent extends Event{static eventName="onnavigatetosource";constructor(){super(NavigateToSourceEvent.eventName,{bubbles:!0,composed:!0})}}export class ComputedStyleProperty extends HTMLElement{static litTagName=LitHtml.literal`devtools-computed-style-property`;#e=this.attachShadow({mode:"open"});#t=!1;#s=!1;constructor(){super(),this.#e.adoptedStyleSheets=[computedStylePropertyStyles]}set inherited(e){e!==this.#t&&(this.#t=e,this.#o())}set traceable(e){e!==this.#s&&(this.#s=e,this.#o())}#r(){this.dispatchEvent(new NavigateToSourceEvent)}#o(){render(html`
<div class="computed-style-property ${this.#t?"inherited":""}">
<div class="property-name">
<slot name="name"></slot>
</div>
<span class="hidden" aria-hidden="false">: </span>
${this.#s?html`<span class="goto" @click=${this.#r}></span>`:null}
<div class="property-value">
<slot name="value"></slot>
</div>
<span class="hidden" aria-hidden="false">;</span>
</div>
`,this.#e,{host:this})}}ComponentHelpers.CustomElements.defineComponent("devtools-computed-style-property",ComputedStyleProperty);