import { customElement , LitElement , html , property , TemplateResult } from 'lit-element' ; import style from './belle-select-css' ; element @ customElement ( 'belle-select-option' ) export class BelleSelectOption extends LitElement { static styles = style ; type { string } attr @ property ( { type : String , reflect : true } ) value = '' ; type { string } attr @ property ( { type : Boolean , reflect : true } ) selected = false ; render ( ) { return html `
      <div
        class="belle-select-options"
        @click=${ this . handleClick }
      >
        <slot></slot>
      </div>
    ` ; } handleClick ( ) { console . log ( 'this.value...' , this . value ) ; this . dispatchEvent ( new CustomEvent ( 'on-click' , { detail : { value : this . value } , bubbles : true , composed : true } ) ) ; } } declare global { interface HTMLElementTagNameMap { 'belle-select-options' : BelleSelectOption ; } }