Skip to content

Commit 1e54a11

Browse files
committed
Add story example to illustrate resetting ReactCodeInput 40818419#69 40818419#129
1 parent 2ae308c commit 1e54a11

File tree

1 file changed

+14
-1
lines changed

1 file changed

+14
-1
lines changed

src/ReactCodeInput.stories.js

+14-1
Original file line numberDiff line numberDiff line change
@@ -57,6 +57,18 @@ const darkStyle = {
5757
stories.addDecorator((story, context) => withInfo('Details')(story)(context));
5858
stories.addDecorator(withKnobs);
5959

60+
// Component for With Reset story
61+
function WithReset() {
62+
const [value, setValue] = React.useState(null);
63+
64+
return (
65+
<React.Fragment>
66+
<ReactCodeInput onChange={() => setValue(null)} value={value} />
67+
<button style={{ ...inputStyle, width: 'auto', backgroundColor: 'lightgray' }} onClick={() => setValue('')}>Reset</button>
68+
</React.Fragment>
69+
)
70+
}
71+
6072
// Stories for Input Field
6173
stories
6274
.add(
@@ -72,7 +84,8 @@ stories
7284
.add(
7385
'Force Uppercase', () =>
7486
<CodeInputField fields={4} type="text" forceUppercase value="test" onChange={action('onChange')} />
75-
);
87+
)
88+
.add('With Reset', WithReset);
7689

7790
// Creation of Props
7891
propVariantStories.addDecorator((story, context) => withInfo('Details')(story)(context));

0 commit comments

Comments
 (0)