import '@polymer/iron-icon/iron-icon' ; import '@polymer/iron-icons/iron-icons' ; import { css , html , LitElement , PropertyDeclarations } from 'lit-element' ; export class SortSpan extends LitElement { static get styles ( ) { return css `
      :host {
        display: inline-block;
        cursor: pointer;
        user-select: none;
      }
    ` ; } static get properties ( ) : PropertyDeclarations { return { direction : { type : Number } } ; } direction : - 1 | 0 | 1 = 0 ; override render ( ) { let arrow = html `<iron-icon></iron-icon>` ; if ( this . direction === - 1 ) { arrow = html `<iron-icon icon='arrow-upward'></iron-icon>` ; } else if ( this . direction === 1 ) { arrow = html `<iron-icon icon='arrow-downward'></iron-icon>` ; } return html `<slot></slot>${ arrow }` ; } } customElements . define ( 'outline-sort-span' , SortSpan ) ;