import { Component , Prop , h , JSX , ComponentInterface } from '@stencil/core' ; @ Component ( { tag : 'bm-button' , styleUrls : [ 'button.scss' ] , } ) export class Button implements ComponentInterface { /**
     * Is disabled?
     */ @ Prop ( ) disabled = false ; /**
     * Color
     */ @ Prop ( ) color : 'is-primary' | 'is-link' | 'is-info' | 'is-success' | 'is-danger' | 'is-warning' | 'is-white' | 'is-light' | 'is-dark' | 'is-black' | 'is-text' | 'is-ghost' ; /**
     * Size
     */ @ Prop ( ) size : 'is-small' | 'is-medium' | 'is-large' | 'is-normal' ; /**
     * Display the button in full-width
     */ @ Prop ( ) isFullwidth = false ; /**
     * Is outlined
     */ @ Prop ( ) isOutlined = false ; /**
     * Is light
     */ @ Prop ( ) isLight = false ; /**
     * Is inverted
     */ @ Prop ( ) isInverted = false ; /**
     * Rounded button
     */ @ Prop ( ) isRounded = false ; /**
     * Hovered state
     */ @ Prop ( ) isHovered = false ; /**
     * Focused state
     */ @ Prop ( ) isFocused = false ; /**
     * Active state
     */ @ Prop ( ) isActive = false ; /**
     * Static
     */ @ Prop ( ) isStatic = false ; /**
     * Loading state
     */ @ Prop ( ) isLoading = false ; render ( ) { return ( < button class = { { button : true , [ this . color ] : Boolean ( this . color ) , [ this . size ] : Boolean ( this . size ) , 'is-fullwidth' : this . isFullwidth , 'is-active' : this . isActive , 'is-light' : this . isLight , 'is-focused' : this . isFocused , 'is-static' : this . isStatic , 'is-hovered' : this . isHovered , 'is-inverted' : this . isInverted , 'is-rounded' : this . isRounded , 'is-loading' : this . isLoading , 'is-outlined' : this . isOutlined , } } disabled = { this . disabled } aria - disabled = { this . disabled ? 'true' : null } > < slot /> < /button>); } }