1
0
mirror of https://github.com/kremalicious/metamask-extension.git synced 2024-12-22 17:33:23 +01:00

Fixed NumericInput Storybook Components (#16734) (#16737)

Co-authored-by: Brad Decker <bhdecker84@gmail.com>
Fixed https://github.com/MetaMask/metamask-extension/issues/16703
Fixes https://github.com/MetaMask/metamask-extension/issues/16703
This commit is contained in:
Sailer43 2022-12-06 11:48:55 -05:00 committed by GitHub
parent 7f50febfcd
commit 1e173afc95
No known key found for this signature in database
GPG Key ID: 4AEE18F83AFDEB23

View File

@ -1,4 +1,4 @@
import React from 'react';
import React, { useState } from 'react';
import NumericInput from '.';
export default {
@ -6,12 +6,11 @@ export default {
id: __filename,
};
const onChange = (e) => console.log('changed value: ', e.target.value);
export const DefaultStory = () => {
const [value, setValue] = useState(0);
return (
<div style={{ width: '600px' }}>
<NumericInput onChange={onChange} />
<NumericInput onChange={setValue} value={value} />
</div>
);
};
@ -19,20 +18,23 @@ export const DefaultStory = () => {
DefaultStory.storyName = 'Default';
export const WithDetail = () => {
const [value, setValue] = useState(0);
return (
<div style={{ width: '600px' }}>
<NumericInput detailText="= $0.06" onChange={onChange} />
<NumericInput detailText="= $0.06" onChange={setValue} value={value} />
</div>
);
};
export const WithError = () => {
const [value, setValue] = useState(0);
return (
<div style={{ width: '600px' }}>
<NumericInput
detailText="= $0.06"
error="This number isn't great"
onChange={onChange}
onChange={setValue}
value={value}
/>
</div>
);