Skip to content

Commit 4154993

Browse files
dohomidohomi
committed
change imports of storybook
1 parent 02e4452 commit 4154993

8 files changed

+2260
-2127
lines changed

‎apps/storybook/stories/AutocompleteElement.stories.tsx

+69-69
Original file line numberDiff line numberDiff line change
@@ -1,131 +1,131 @@
1-
import {AutocompleteElement, FormContainer} from 'react-hook-form-mui'
1+
import {AutocompleteElement, FormContainer} from 'react-hook-form-mui/src'
22
import {FC, PropsWithChildren} from 'react'
33
import {ComponentMeta, ComponentStory} from '@storybook/react'
44
import {action} from '@storybook/addon-actions'
55
import {Box, Button} from '@mui/material'
66
import LocationIcon from '@mui/icons-material/LocationOn'
77

88
export default {
9-
title: 'Autocomplete',
10-
component: AutocompleteElement
9+
title: 'Autocomplete',
10+
component: AutocompleteElement
1111
} as ComponentMeta<typeof AutocompleteElement>
1212

1313
const FormWrap: FC<PropsWithChildren> = ({children}) => (
14-
<FormContainer onSuccess={action('form-submit')}
15-
defaultValues={{
16-
preselect: {id: 2, label: 'Second'},
17-
'multi-preselect': [{id: 2, label: 'Second'}],
18-
'match-id': 2,
19-
'match-id-multi': [2, 3],
20-
}}>
21-
{children}
22-
<Box marginTop={2}>
23-
<Button type={'submit'}>Submit</Button>
24-
</Box>
25-
</FormContainer>
14+
<FormContainer onSuccess={action('form-submit')}
15+
defaultValues={{
16+
preselect: {id: 2, label: 'Second'},
17+
'multi-preselect': [{id: 2, label: 'Second'}],
18+
'match-id': 2,
19+
'match-id-multi': [2, 3],
20+
}}>
21+
{children}
22+
<Box marginTop={2}>
23+
<Button type={'submit'}>Submit</Button>
24+
</Box>
25+
</FormContainer>
2626
)
2727

2828
const Template: ComponentStory<typeof AutocompleteElement> = (args) => {
29-
return (
30-
<FormWrap>
31-
<AutocompleteElement {...args} />
32-
</FormWrap>
33-
)
29+
return (
30+
<FormWrap>
31+
<AutocompleteElement {...args} />
32+
</FormWrap>
33+
)
3434
}
3535

3636
const options = [{label: 'First', id: 1}, {label: 'Second', id: 2}, {label: 'Third', id: 3}, {
37-
label: 'Four',
38-
id: 4
37+
label: 'Four',
38+
id: 4
3939
}]
4040

4141
export const Basic = Template.bind({})
4242

4343
Basic.args = {
44-
name: 'basic',
45-
options
44+
name: 'basic',
45+
options
4646
}
4747

4848
export const BasicPreSelect = Template.bind({})
4949
BasicPreSelect.args = {
50-
name: 'preselect',
51-
options
50+
name: 'preselect',
51+
options
5252
}
5353

5454
export const MultiSelect = Template.bind({})
5555
MultiSelect.args = {
56-
name: 'multi',
57-
options,
58-
multiple: true
56+
name: 'multi',
57+
options,
58+
multiple: true
5959
}
6060

6161
export const MultiSelectRequired = Template.bind({})
6262
MultiSelectRequired.args = {
63-
label: 'Multiple Required',
64-
name: 'multi-required',
65-
options,
66-
multiple: true,
67-
required: true
63+
label: 'Multiple Required',
64+
name: 'multi-required',
65+
options,
66+
multiple: true,
67+
required: true
6868
}
6969

7070
export const MultiSelectRequiredCustom = Template.bind({})
7171
MultiSelectRequiredCustom.args = {
72-
label: 'Multiple Required Custom',
73-
name: 'multi-required-custom',
74-
options,
75-
multiple: true,
76-
rules: {
77-
required: 'Please fill out.'
78-
}
72+
label: 'Multiple Required Custom',
73+
name: 'multi-required-custom',
74+
options,
75+
multiple: true,
76+
rules: {
77+
required: 'Please fill out.'
78+
}
7979
}
8080

8181
export const MultiSelectPredefined = Template.bind({})
8282
MultiSelectPredefined.args = {
83-
name: 'multi-preselect',
84-
options,
85-
multiple: true
83+
name: 'multi-preselect',
84+
options,
85+
multiple: true
8686
}
8787

8888
export const MultiSelectCheckbox = Template.bind({})
8989
MultiSelectCheckbox.args = {
90-
name: 'multicheck',
91-
options,
92-
multiple: true,
93-
showCheckbox: true
90+
name: 'multicheck',
91+
options,
92+
multiple: true,
93+
showCheckbox: true
9494
}
9595

9696
export const Loading = Template.bind({})
9797
Loading.args = {
98-
label: 'Loading State',
99-
name: 'loading',
100-
options: [],
101-
multiple: true,
102-
showCheckbox: true,
103-
loading: true
98+
label: 'Loading State',
99+
name: 'loading',
100+
options: [],
101+
multiple: true,
102+
showCheckbox: true,
103+
loading: true
104104
}
105105

106106
export const MatchId = Template.bind({})
107107
MatchId.args = {
108-
label: 'Match ID',
109-
name: 'match-id',
110-
options,
111-
matchId: true
108+
label: 'Match ID',
109+
name: 'match-id',
110+
options,
111+
matchId: true
112112
}
113113

114114
export const MatchIdMulti = Template.bind({})
115115
MatchIdMulti.args = {
116-
label: 'Match ID',
117-
name: 'match-id-multi',
118-
options,
119-
multiple: true,
120-
matchId: true
116+
label: 'Match ID',
117+
name: 'match-id-multi',
118+
options,
119+
multiple: true,
120+
matchId: true
121121
}
122122

123123
export const CustomInput = Template.bind({})
124124
CustomInput.args = {
125-
name: 'custom-input',
126-
options,
127-
textFieldProps: {
128-
placeholder: 'Some placeholder',
129-
InputProps: {startAdornment: <LocationIcon/>, endAdornment: null},
130-
}
125+
name: 'custom-input',
126+
options,
127+
textFieldProps: {
128+
placeholder: 'Some placeholder',
129+
InputProps: {startAdornment: <LocationIcon/>, endAdornment: null},
130+
}
131131
}

‎apps/storybook/stories/RadioButtonGroup.stories.tsx

+19-19
Original file line numberDiff line numberDiff line change
@@ -1,41 +1,41 @@
1-
import {FormContainer, RadioButtonGroup} from 'react-hook-form-mui'
1+
import {FormContainer, RadioButtonGroup} from 'react-hook-form-mui/src'
22
import {action} from '@storybook/addon-actions'
33
import {ComponentMeta, ComponentStory} from '@storybook/react'
44
import {SubmitButton} from '../src/Shared'
55

66
export default {
7-
title: 'RadioButtonGroup',
8-
component: RadioButtonGroup
7+
title: 'RadioButtonGroup',
8+
component: RadioButtonGroup
99
} as ComponentMeta<typeof RadioButtonGroup>
1010

1111
const Template: ComponentStory<typeof RadioButtonGroup> = (args) => (
12-
<FormContainer defaultValues={{}} onSuccess={action('submit')}>
13-
<RadioButtonGroup {...args} />
14-
<br/>
15-
<SubmitButton/>
16-
</FormContainer>
12+
<FormContainer defaultValues={{}} onSuccess={action('submit')}>
13+
<RadioButtonGroup {...args} />
14+
<br/>
15+
<SubmitButton/>
16+
</FormContainer>
1717
)
1818
const options = [{id: '1', label: 'Label 1'}, {id: '2', label: 'label 2'}]
1919

2020
export const Basic = Template.bind({})
2121
Basic.args = {
22-
label: 'Basic',
23-
name: 'basic',
24-
options
22+
label: 'Basic',
23+
name: 'basic',
24+
options
2525
}
2626

2727
export const Inline = Template.bind({})
2828
Inline.args = {
29-
label: 'Inline',
30-
name: 'inline',
31-
row: true,
32-
options
29+
label: 'Inline',
30+
name: 'inline',
31+
row: true,
32+
options
3333
}
3434

3535
export const Required = Template.bind({})
3636
Required.args = {
37-
label: 'Required',
38-
name: 'inline',
39-
required: true,
40-
options
37+
label: 'Required',
38+
name: 'inline',
39+
required: true,
40+
options
4141
}

‎apps/storybook/stories/SelectElement.stories.tsx

+34-34
Original file line numberDiff line numberDiff line change
@@ -1,63 +1,63 @@
1-
import {FormContainer, SelectElement} from 'react-hook-form-mui'
1+
import {FormContainer, SelectElement} from 'react-hook-form-mui/src'
22
import {action} from '@storybook/addon-actions'
33
import {ComponentMeta, ComponentStory} from '@storybook/react'
44
import {SubmitButton} from '../src/Shared'
55

66
export default {
7-
title: 'SelectElement',
8-
component: SelectElement
7+
title: 'SelectElement',
8+
component: SelectElement
99
} as ComponentMeta<typeof SelectElement>
1010

1111
const months = ['January', 'February', 'March', 'April', 'May', 'June', 'July', 'August', 'September', 'October', 'November', 'December'].map(i => ({
12-
id: i,
13-
label: i
12+
id: i,
13+
label: i
1414
}))
1515

1616

1717
const Template: ComponentStory<typeof SelectElement> = (args) => (
18-
<FormContainer defaultValues={{}} onSuccess={action('submit')}>
19-
<SelectElement {...args} />
20-
<br/>
21-
<SubmitButton/>
22-
</FormContainer>
18+
<FormContainer defaultValues={{}} onSuccess={action('submit')}>
19+
<SelectElement {...args} />
20+
<br/>
21+
<SubmitButton/>
22+
</FormContainer>
2323
)
2424

2525
const options = [{id: '1', label: 'Label 1'}, {id: '2', label: 'label 2'}]
2626

2727
export const Basic = Template.bind({})
2828
Basic.args = {
29-
name: 'basic',
30-
label: 'Basic',
31-
options
29+
name: 'basic',
30+
label: 'Basic',
31+
options
3232
}
3333

3434
export const Required = Template.bind({})
3535
Required.args = {
36-
name: 'required',
37-
label: 'Required',
38-
required: true,
39-
options
36+
name: 'required',
37+
label: 'Required',
38+
required: true,
39+
options
4040
}
4141

4242
export const MonthPicker = Template.bind({})
4343
MonthPicker.args = {
44-
name: 'month',
45-
options: months,
46-
label: 'Pick a month',
47-
sx: {
48-
minWidth: '150px'
49-
},
50-
SelectProps: {
51-
MenuProps: {
52-
PaperProps: {
53-
sx: {
54-
'& .MuiList-root': {
55-
display: 'grid',
56-
gridTemplateColumns: 'repeat(3, 1fr)',
57-
gap: '4px'
58-
}
59-
}
60-
}
44+
name: 'month',
45+
options: months,
46+
label: 'Pick a month',
47+
sx: {
48+
minWidth: '150px'
49+
},
50+
SelectProps: {
51+
MenuProps: {
52+
PaperProps: {
53+
sx: {
54+
'& .MuiList-root': {
55+
display: 'grid',
56+
gridTemplateColumns: 'repeat(3, 1fr)',
57+
gap: '4px'
58+
}
6159
}
60+
}
6261
}
62+
}
6363
}

0 commit comments

Comments
 (0)