2019-07-25 14:29:50 +00:00
import React from 'react' ;
import { storiesOf } from '@storybook/react' ;
import withReadme from 'storybook-readme/with-readme' ;
import { RadioButtonGroup } from 'asc-web-components' ;
import Section from '../../../.storybook/decorators/section' ;
2019-07-25 16:24:30 +00:00
import { withKnobs , text , boolean , number } from '@storybook/addon-knobs/react' ;
2019-07-25 14:29:50 +00:00
import Readme from './README.md' ;
storiesOf ( 'Components|Input' , module )
. addDecorator ( withKnobs )
. addDecorator ( withReadme ( Readme ) )
. add ( 'radio-button-group' , ( ) => {
return (
< Section >
< >
2019-07-25 16:24:30 +00:00
< RadioButtonGroup selected = { text ( 'selected radio button(value)' , 'second' ) } spaceBtwnElems = { number ( 'spaceBtwnElems' , 33 ) } name = { text ( 'name of your group' , 'group' ) } options = {
[
{ value : text ( 'value 1st radiobutton' , 'first' ) , label : text ( 'label 1st radiobutton' , 'First radiobtn' ) , disabled : boolean ( 'isDisabled 1st radiobutton' , false ) } ,
{ value : text ( 'value 2nd radiobutton' , 'second' ) , label : text ( 'label 2nd radiobutton' , 'Second radiobtn' ) , disabled : boolean ( 'isDisabled 2nd radiobutton' , true ) } ,
{ value : text ( 'value 3rd radiobutton' , 'third' ) , label : text ( 'label 3rd radiobutton' , '3nd radiobtn' ) , disabled : boolean ( 'isDisabled 3rd radiobutton' , false ) } ,
{ value : text ( 'value 4th radiobutton' , 'fourth' ) , label : text ( 'label 4th radiobutton' , '4th radiobtn' ) , disabled : boolean ( 'isDisabled 4th radiobutton' , true ) } ,
]
}
2019-07-25 15:14:52 +00:00
/ >
2019-07-25 14:29:50 +00:00
< / >
< / S e c t i o n >
) ;
} ) ;