import { BrtConfig , BrtData , BrtError } from '@bruit/types' ; import { Component , Element , Event , EventEmitter , h , Prop , State , Watch } from '@stencil/core' ; import { BruitIoConfig } from '../../models/bruit-io-config.class' ; @ Component ( { tag : 'bruit-io' , styleUrl : 'bruit-io.scss' , shadow : true } ) export class BruitIo { @ Prop ( { attribute : 'brt-config' } ) config : BrtConfig | string ; param newConfig @ Watch ( 'config' ) initConfig ( newConfig ) { let _newConfig ; let configError ; if ( typeof newConfig === 'string' ) { try { _newConfig = JSON . parse ( newConfig ) as BrtConfig ; } catch { configError = { code : 100 , text : 'bad config format (must be a json or stringified json)' } ; } } else { _newConfig = newConfig as BrtConfig ; } if ( ! configError ) { configError = BruitIoConfig . haveError ( _newConfig ) ; } if ( ! configError ) { this . _config = new BruitIoConfig ( _newConfig ) ; } else { this . brtError . emit ( configError ) ; console . error ( configError ) ; } } /**
     * field array to add in feedback
     */ @ Prop ( { attribute : 'brt-data' } ) data : Array < BrtData > ; /**
     * FN or PROMISE
     * return field array to add in feedback
     */ @ Prop ( { attribute : 'brt-data-fn' } ) dataFn : ( ) => Array < BrtData > | Promise < Array < BrtData > > ; /**
     * emit bruit-error on internal error or config error
     * ex : BruitIo.addEventListener('onError',error=>...)
     */ @ Event ( ) brtError : EventEmitter ; @ Event ( ) ready : EventEmitter ; componentDidLoad ( ) { this . ready . emit ( true ) ; } /**
     * the current and complete config
     */ @ State ( ) _config : BruitIoConfig ; @ Element ( ) bruitIoElement : HTMLBruitIoElement ; private _haveInnerElement : boolean ; /**
     * fired on component loading before render()
     */ componentWillLoad ( ) { if ( this . config ) { this . initConfig ( this . config ) ; } this . _haveInnerElement = ! ! this . bruitIoElement . innerHTML ? ! ! this . bruitIoElement . innerHTML . trim ( ) : false ; } /**
     * called on click on component
     * init a feedback, wait user submit, send feedback
     */ newFeedback ( ) { const modal = document . getElementsByTagName ( 'bruit-core' ) [ 0 ] ; if ( modal ) { modal . newFeedback ( this . _config , this . data , this . dataFn ) ; } else { } } render ( ) { if ( this . _config ) { return this . principalButton ( ) ; } else { return < p class = "bruit-error" > missing config < /p>; } } principalButton ( ) { if ( this . _haveInnerElement ) { return ( < a onClick = { ( ) => this . newFeedback ( ) } class = "bruit-button" > < slot /> < /a>); } else { return ( < a onClick = { ( ) => this . newFeedback ( ) } class = "bruit-button" > < svg viewBox = "0 0 96 96" width = "30" height = "30" xmlns = "http://www.w3.org/2000/svg" > < path d = "M73.3,35.3h-8.9c-1.4-2.5-3.4-4.6-5.8-6.2l5.2-5.2l-4.5-4.5l-6.9,6.9C51,26,49.6,25.8,48,25.8 s - 3 , 0.2 - 4.5 , 0.5 l - 6.9 - 6.9 L32 .2 , 24 l5 .1 , 5.2 c - 2.3 , 1.6 - 4.3 , 3.7 - 5.7 , 6.2 h - 8.9 v6 .3 h6 .6 c - 0.2 , 1 - 0.3 , 2.1 - 0.3 , 3.2 V48h - 6.3 v6 .3 H29v3 .2 c0 , 1.1 , 0.1 , 2.1 , 0.3 , 3.2 h - 6.6 V67h8 .9 c3 .3 , 5.7 , 9.4 , 9.5 , 16.4 , 9.5 s13 .1 - 3.8 , 16.4 - 9.5 h8 .9 v - 6.3 h - 6.6 c0 .2 - 1 , 0.3 - 2.1 , 0.3 - 3.2 v - 3.2 h6 .3 V48 H67v - 3.2 c0 - 1.1 - 0.1 - 2.1 - 0.3 - 3.2 h6 .6 V35 .3 z M54 .3 , 60.7 H41 .7 v - 6.3 h12 .7 V60 .7 z M54 .3 , 48 H41 .7 v - 6.3 h12 .7 V48z "/> < /svg> < /a>); } } }