import m from 'mithril' ; import { ControlGroup , Button , Input , Icon , Icons , Select , Spinner , CustomSelect } from '@/' ; import { Example } from '@shared/examples' ; const EXAMPLE_SRC = 'components/control-group/examples/index.ts' ; const options = [ 'Option 1' , 'Option 2' ] ; export class ControlGroupExample { public view ( ) { return m ( Example , { direction : 'column' , src : EXAMPLE_SRC } , [ m ( ControlGroup , { style : 'margin-bottom:15px' } , [ m ( Input , { contentLeft : m ( Icon , { name : Icons . SEARCH } ) , placeholder : 'Input placeholder...' } ) , m ( Button , { iconLeft : Icons . USERS , label : 'Button' } ) , m ( Select , { options } ) ] ) , m ( ControlGroup , [ m ( Button , { iconLeft : Icons . SETTINGS , label : 'Action' } ) , m ( Input , { contentLeft : m ( Icon , { name : Icons . USER } ) , contentRight : m ( Spinner , { active : true } ) , placeholder : 'Enter name...' } ) , m ( CustomSelect , { options , defaultValue : 'Option 2' } ) ] ) ] ) ; } }