Skip to content

Commit 95d4190

Browse files
committed
feat: add more snippets
1 parent fea3d34 commit 95d4190

16 files changed

+409
-11
lines changed

.vscode/snippets.code-snippets

Lines changed: 13 additions & 11 deletions
Original file line numberDiff line numberDiff line change
@@ -1,12 +1,14 @@
11
{
2-
"Snippet Template": {
3-
"prefix": "snip",
4-
"body": [
5-
"export const description = '$1'",
6-
"",
7-
"export const body = `",
8-
"$0",
9-
"`",
10-
]
11-
}
12-
}
2+
"Snippet Template": {
3+
"prefix": "snip",
4+
"body": [
5+
"import snip from '../snip'",
6+
"",
7+
"export const description = '$1'",
8+
"",
9+
"export const body = snip`",
10+
"$0",
11+
"`"
12+
]
13+
}
14+
}

README.md

Lines changed: 204 additions & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -11,6 +11,23 @@ snippets for Material-UI
1111
# Snippets
1212

1313
<!-- snippets -->
14+
### `mui-bottom-navigation-action`: Material-UI &lt;BottomNavigationAction&gt;
15+
16+
```
17+
<BottomNavigationAction label="$1" value={$2} icon={$3} $0 />
18+
```
19+
20+
### `mui-bottom-navigation`: Material-UI &lt;BottomNavigation&gt;
21+
22+
```
23+
<BottomNavigation
24+
value={$1}
25+
onChange={$2}
26+
$3
27+
>
28+
$0
29+
<BottomNavigation>
30+
```
1431

1532
### `mui-button-group-vertical`: Material-UI vertical &lt;ButtonGroup&gt;
1633

@@ -137,6 +154,55 @@ snippets for Material-UI
137154
</Container>
138155
```
139156

157+
### `mui-drawer-permanent`: Material-UI permanent &lt;Drawer&gt;
158+
159+
```
160+
<Drawer
161+
variant="permanent"
162+
anchor="${1:left}"
163+
$2
164+
>
165+
$0
166+
</Drawer>
167+
```
168+
169+
### `mui-drawer-persistent`: Material-UI persistent &lt;Drawer&gt;
170+
171+
```
172+
<Drawer
173+
variant="persistent"
174+
anchor="${1:left}"
175+
open={$2}
176+
$3
177+
>
178+
$0
179+
</Drawer>
180+
```
181+
182+
### `mui-drawer-temporary`: Material-UI temporary &lt;Drawer&gt;
183+
184+
```
185+
<Drawer
186+
variant="temporary"
187+
anchor="${1:left}"
188+
open={$2}
189+
onClose={$3}
190+
$4
191+
>
192+
$0
193+
</Drawer>
194+
```
195+
196+
### `mui-end-adornment`: Material-UI start &lt;InputAdornment&gt;
197+
198+
```
199+
startAdornment={
200+
<InputAdornment position="start">
201+
$0
202+
</InputAdornment>
203+
}
204+
```
205+
140206
### `mui-form-control-group`: Material-UI &lt;FormControl&gt; with &lt;FormGroup&gt;
141207

142208
```
@@ -223,6 +289,52 @@ snippets for Material-UI
223289
/>
224290
```
225291

292+
### `mui-icon-button`: Material-UI &lt;IconButton&gt;
293+
294+
```
295+
<IconButton
296+
aria=label="$1"
297+
onClick={$2}
298+
$3
299+
>
300+
$0
301+
</IconButton>
302+
```
303+
304+
### `mui-menu-item`: Material-UI &lt;MenuItem&gt;
305+
306+
```
307+
<MenuItem onClick={$1} $2>$0</MenuItem>
308+
```
309+
310+
### `mui-menu-popup-state`: Material-UI &lt;Menu&gt; for material-ui-popup-state
311+
312+
```
313+
<Menu
314+
id="$1"
315+
keepMounted
316+
{...bindMenu(${2:popupState})}
317+
$3
318+
>
319+
$0
320+
</Menu>
321+
```
322+
323+
### `mui-menu`: Material-UI &lt;Menu&gt;
324+
325+
```
326+
<Menu
327+
id="$1"
328+
anchorEl={$2}
329+
keepMounted
330+
open={Boolean($2)}
331+
onClose={$3}
332+
$4
333+
>
334+
$0
335+
</Menu>
336+
```
337+
226338
### `mui-radio-group`: Material-UI &lt;FormControl&gt; with &lt;RadioGroup&gt;
227339

228340
```
@@ -311,6 +423,16 @@ snippets for Material-UI
311423
/>
312424
```
313425

426+
### `mui-start-adornment`: Material-UI end &lt;InputAdornment&gt;
427+
428+
```
429+
endAdornment={
430+
<InputAdornment position="end">
431+
$0
432+
</InputAdornment>
433+
}
434+
```
435+
314436
### `mui-switch-label-placement`: Material-UI &lt;Switch&gt; with &lt;FormControlLabel&gt; with labelPlacement
315437

316438
#### Controlled
@@ -404,4 +526,86 @@ snippets for Material-UI
404526
/>
405527
```
406528

529+
### `mui-text-field-select`: Material-UI &lt;TextField select&gt;
530+
531+
#### Controlled
532+
533+
```
534+
<TextField
535+
id="$1"
536+
label="$2"
537+
select
538+
value={$3}
539+
onChange={$4}
540+
$5
541+
>
542+
$0
543+
</TextFIeld>
544+
```
545+
546+
#### Uncontrolled
547+
548+
```
549+
<TextField
550+
id="$1"
551+
label="$2"
552+
select
553+
defaultValue={$3}
554+
$4
555+
>
556+
$0
557+
</TextFIeld>
558+
```
559+
560+
### `mui-text-field-variant`: Material-UI &lt;TextField&gt; with variant
561+
562+
#### Controlled
563+
564+
```
565+
<TextField
566+
id="$1"
567+
label="$2"
568+
variant="${3:filled}"
569+
value={$4}
570+
onChange={$5}
571+
$0
572+
/>
573+
```
574+
575+
#### Uncontrolled
576+
577+
```
578+
<TextField
579+
id="$1"
580+
label="$2"
581+
variant="${3:filled}"
582+
defaultValue={$4}
583+
$0
584+
/>
585+
```
586+
587+
### `mui-text-field`: Material-UI &lt;TextField&gt;
588+
589+
#### Controlled
590+
591+
```
592+
<TextField
593+
id="$1"
594+
label="$2"
595+
value={$3}
596+
onChange={$4}
597+
$0
598+
/>
599+
```
600+
601+
#### Uncontrolled
602+
603+
```
604+
<TextField
605+
id="$1"
606+
label="$2"
607+
defaultValue={$3}
608+
$0
609+
/>
610+
```
407611
<!-- snippetsend -->
Lines changed: 7 additions & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -0,0 +1,7 @@
1+
import snip from '../snip'
2+
3+
export const description = 'Material-UI <BottomNavigationAction>'
4+
5+
export const body = snip`
6+
<BottomNavigationAction label="$#" value={$#} icon={$#} $0 />
7+
`
Lines changed: 13 additions & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -0,0 +1,13 @@
1+
import snip from '../snip'
2+
3+
export const description = 'Material-UI <BottomNavigation>'
4+
5+
export const body = snip`
6+
<BottomNavigation
7+
value={$#}
8+
onChange={$#}
9+
$#
10+
>
11+
$0
12+
<BottomNavigation>
13+
`
Lines changed: 13 additions & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -0,0 +1,13 @@
1+
import snip from '../snip'
2+
3+
export const description = 'Material-UI permanent <Drawer>'
4+
5+
export const body = snip`
6+
<Drawer
7+
variant="permanent"
8+
anchor="\${#:left}"
9+
$#
10+
>
11+
$0
12+
</Drawer>
13+
`
Lines changed: 14 additions & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -0,0 +1,14 @@
1+
import snip from '../snip'
2+
3+
export const description = 'Material-UI persistent <Drawer>'
4+
5+
export const body = snip`
6+
<Drawer
7+
variant="persistent"
8+
anchor="\${#:left}"
9+
open={$#}
10+
$#
11+
>
12+
$0
13+
</Drawer>
14+
`
Lines changed: 15 additions & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -0,0 +1,15 @@
1+
import snip from '../snip'
2+
3+
export const description = 'Material-UI temporary <Drawer>'
4+
5+
export const body = snip`
6+
<Drawer
7+
variant="temporary"
8+
anchor="\${#:left}"
9+
open={$#}
10+
onClose={$#}
11+
$#
12+
>
13+
$0
14+
</Drawer>
15+
`

src/snippets/mui-end-adornment.ts

Lines changed: 11 additions & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -0,0 +1,11 @@
1+
import snip from '../snip'
2+
3+
export const description = 'Material-UI start <InputAdornment>'
4+
5+
export const body = snip`
6+
startAdornment={
7+
<InputAdornment position="start">
8+
$0
9+
</InputAdornment>
10+
}
11+
`

src/snippets/mui-icon-button.ts

Lines changed: 13 additions & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -0,0 +1,13 @@
1+
import snip from '../snip'
2+
3+
export const description = 'Material-UI <IconButton>'
4+
5+
export const body = snip`
6+
<IconButton
7+
aria=label="$#"
8+
onClick={$#}
9+
$#
10+
>
11+
$0
12+
</IconButton>
13+
`

src/snippets/mui-menu-item.ts

Lines changed: 7 additions & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -0,0 +1,7 @@
1+
import snip from '../snip'
2+
3+
export const description = 'Material-UI <MenuItem>'
4+
5+
export const body = snip`
6+
<MenuItem onClick={$#} $#>$0</MenuItem>
7+
`

0 commit comments

Comments
 (0)