diff options
author | Sebastian <sebasjm@gmail.com> | 2022-04-07 10:11:47 -0300 |
---|---|---|
committer | Sebastian <sebasjm@gmail.com> | 2022-04-07 10:12:05 -0300 |
commit | fae6c420a35524d1f0d3959716c00cfc947fc0d6 (patch) | |
tree | fd17c9ecb47e222ab02f6b443b6ab44e126f5a10 /packages/taler-wallet-webextension/src/mui/TextField.stories.tsx | |
parent | f300850b19f8b4084bfac88a4cfd06e43bc75a8e (diff) | |
download | wallet-core-fae6c420a35524d1f0d3959716c00cfc947fc0d6.tar.xz |
multiline for input
Diffstat (limited to 'packages/taler-wallet-webextension/src/mui/TextField.stories.tsx')
-rw-r--r-- | packages/taler-wallet-webextension/src/mui/TextField.stories.tsx | 64 |
1 files changed, 42 insertions, 22 deletions
diff --git a/packages/taler-wallet-webextension/src/mui/TextField.stories.tsx b/packages/taler-wallet-webextension/src/mui/TextField.stories.tsx index e46b7f46f..d0ee3b2f6 100644 --- a/packages/taler-wallet-webextension/src/mui/TextField.stories.tsx +++ b/packages/taler-wallet-webextension/src/mui/TextField.stories.tsx @@ -84,25 +84,45 @@ export const Standard = (): VNode => BasicExample("standard"); export const Filled = (): VNode => BasicExample("filled"); export const Outlined = (): VNode => BasicExample("outlined"); -export const Color = (): VNode => ( - <Container> - <TextField - variant="standard" - label="Outlined secondary" - color="secondary" - focused - /> - <TextField - label="Filled success" - variant="standard" - color="success" - focused - /> - <TextField - label="Standard warning" - variant="standard" - color="warning" - focused - /> - </Container> -); +export const Color = (): VNode => { + const [value, onChange] = useState(""); + return ( + <Container> + <TextField + variant="standard" + label="Outlined secondary" + color="secondary" + /> + <TextField label="Filled success" variant="standard" color="success" /> + <TextField label="Standard warning" variant="standard" color="warning" /> + </Container> + ); +}; + +export const Multiline = (): VNode => { + const [value, onChange] = useState(""); + return ( + <Container> + {/* <TextField + {...{ value, onChange }} + label="Multiline" + variant="standard" + multiline + /> */} + <TextField + {...{ value, onChange }} + label="Max row 4" + variant="standard" + multiline + maxRows={4} + /> + {/* <TextField + {...{ value, onChange }} + label="Row 10" + variant="standard" + multiline + rows={10} + /> */} + </Container> + ); +}; |