import intersection from 'lodash.intersection' ; import { CreateElement , VNode } from 'vue' ; import Component from '../base/Component' ; const TInputGroup = Component . extend ( { name : 'TInputGroup' , props : { inputName : { type : String , default : undefined , } , label : { type : String , default : undefined , } , description : { type : String , default : undefined , } , feedback : { type : String , default : undefined , } , sortedElements : { type : Array , default : ( ) : string [ ] => ( [ 'label' , 'default' , 'feedback' , 'description' ] ) , validator ( value ) { const expectedValues = [ 'default' , 'description' , 'feedback' , 'label' ] ; return value . length === intersection ( value , expectedValues ) . length ; } , } , fixedClasses : { type : Object , default ( ) { return { } ; } , } , classes : { type : Object , default ( ) { return { wrapper : '' , label : 'block' , body : '' , feedback : 'text-gray-400 text-sm' , description : 'text-gray-400 text-sm' , } ; } , } , } , render ( createElement ) { const renderFun = this . render ; return renderFun ( createElement ) ; } , computed : { return { Array } elementsToRender ( ) { const props = this . $props ; const slots = this . $slots ; return ( this . sortedElements as string [ ] ) . filter ( ( e ) => e === 'default' || ! ! props [ e ] || ! ! slots [ e ] ) ; } , } , methods : { render ( createElement ) { return createElement ( 'div' , { ref : 'wrapper' , class : this . getElementCssClass ( 'wrapper' ) , } , this . elementsToRender . map ( ( elementName ) => createElement ( this . getTagName ( elementName ) , { ref : elementName , class : this . getElementCssClass ( elementName === 'default' ? 'body' : elementName ) , attrs : { for : elementName === 'label' ? this . inputName : undefined , } , slot : elementName , } , this . $slots [ elementName ] || this . $props [ elementName ] ) ) ) ; } , param { String } slotName return { String } getTagName ( slotName ) { switch ( slotName ) { case 'label' : return 'label' ; default : return 'div' ; } } , } , } ) ; export default TInputGroup ;