Skip to content

Commit e1374d5

Browse files
afiiifafiiif
committed
feat: add jsx snippets for astro
1 parent 064ce08 commit e1374d5

File tree

6 files changed

+245
-118
lines changed

6 files changed

+245
-118
lines changed

‎snippets/javascript.json

+30-30
Original file line numberDiff line numberDiff line change
@@ -1262,8 +1262,24 @@
12621262
"description": "Wrap with function",
12631263
"scope": "javascript,javascriptreact"
12641264
},
1265-
"🟨 wrapWithFragment": {
1266-
"prefix": "_rFrag.$_rFrag._frag",
1265+
"🟨 wrapWithJsonStringify": {
1266+
"prefix": "_jstr.$_jstr.JSON",
1267+
"body": [
1268+
"JSON.stringify($TM_SELECTED_TEXT${1:, null, 2})"
1269+
],
1270+
"description": "Wrap with `JSON.stringify`",
1271+
"scope": "javascript,javascriptreact"
1272+
},
1273+
"🟨 wrapWithJsonParse": {
1274+
"prefix": "_jprs.$_jprs.JSON",
1275+
"body": [
1276+
"JSON.parse($TM_SELECTED_TEXT)"
1277+
],
1278+
"description": "Wrap with `JSON.parse`",
1279+
"scope": "javascript,javascriptreact"
1280+
},
1281+
"🟨 jsxWrap": {
1282+
"prefix": "_rFrag.$_rFrag._frag._jsxFrag",
12671283
"body": [
12681284
"<$1$0>",
12691285
"\t$TM_SELECTED_TEXT",
@@ -1272,8 +1288,8 @@
12721288
"description": "Wrap component with Fragment",
12731289
"scope": "javascript,javascriptreact"
12741290
},
1275-
"🟨 reactIf": {
1276-
"prefix": "_rIf.$_rIf",
1291+
"🟨 jsxIf": {
1292+
"prefix": "_rIf.$_rIf._jsxIf",
12771293
"body": [
12781294
"{${1:condition} ? (",
12791295
"\t$TM_SELECTED_TEXT",
@@ -1284,8 +1300,8 @@
12841300
"description": "Wrap in if",
12851301
"scope": "javascript,javascriptreact"
12861302
},
1287-
"🟨 reactIfWithFragment": {
1288-
"prefix": "_rIfFrag.$_rIfFrag",
1303+
"🟨 jsxIfWithFragment": {
1304+
"prefix": "_rIfFrag.$_rIfFrag._jsxIfFrag",
12891305
"body": [
12901306
"{${1:condition} ? (",
12911307
"\t<>",
@@ -1298,8 +1314,8 @@
12981314
"description": "Wrap in if",
12991315
"scope": "javascript,javascriptreact"
13001316
},
1301-
"🟨 reactElse": {
1302-
"prefix": "_rEl.$_rEl",
1317+
"🟨 jsxElse": {
1318+
"prefix": "_rEl.$_rEl._jsxEl",
13031319
"body": [
13041320
"{${1:condition} ? (",
13051321
"\t${0:null}",
@@ -1310,8 +1326,8 @@
13101326
"description": "Wrap in else",
13111327
"scope": "javascript,javascriptreact"
13121328
},
1313-
"🟨 reactElseWithFragment": {
1314-
"prefix": "_rElFrag.$_rElFrag",
1329+
"🟨 jsxElseWithFragment": {
1330+
"prefix": "_rElFrag.$_rElFrag._jsxElFrag",
13151331
"body": [
13161332
"{${1:condition} ? (",
13171333
"\t${0:null}",
@@ -1324,8 +1340,8 @@
13241340
"description": "Wrap in else",
13251341
"scope": "javascript,javascriptreact"
13261342
},
1327-
"🟨 reactConditional": {
1328-
"prefix": "_rCon.$_rCon",
1343+
"🟨 jsxConditional": {
1344+
"prefix": "_rCond.$_rCond._jsxCond",
13291345
"body": [
13301346
"{${1:condition} && (",
13311347
"\t$TM_SELECTED_TEXT",
@@ -1334,8 +1350,8 @@
13341350
"description": "Wrap with conditional",
13351351
"scope": "javascript,javascriptreact"
13361352
},
1337-
"🟨 reactConditionalWithFragment": {
1338-
"prefix": "_rConFrag.$_rConFrag",
1353+
"🟨 jsxConditionalWithFragment": {
1354+
"prefix": "_rCondFrag.$_rCondFrag._jsxCondFrag",
13391355
"body": [
13401356
"{${1:condition} && (",
13411357
"\t<>",
@@ -1346,22 +1362,6 @@
13461362
"description": "Wrap with conditional",
13471363
"scope": "javascript,javascriptreact"
13481364
},
1349-
"🟨 wrapWithJsonStringify": {
1350-
"prefix": "_jstr.$_jstr.JSON",
1351-
"body": [
1352-
"JSON.stringify($TM_SELECTED_TEXT${1:, null, 2})"
1353-
],
1354-
"description": "Wrap with `JSON.stringify`",
1355-
"scope": "javascript,javascriptreact"
1356-
},
1357-
"🟨 wrapWithJsonParse": {
1358-
"prefix": "_jprs.$_jprs.JSON",
1359-
"body": [
1360-
"JSON.parse($TM_SELECTED_TEXT)"
1361-
],
1362-
"description": "Wrap with `JSON.parse`",
1363-
"scope": "javascript,javascriptreact"
1364-
},
13651365
"🟨 jsxInnerHTML": {
13661366
"prefix": "innerHTML.$innerHTML.dangerously",
13671367
"body": [

‎snippets/jsx.json

+116
Original file line numberDiff line numberDiff line change
@@ -0,0 +1,116 @@
1+
{
2+
"🟨 jsxWrap": {
3+
"prefix": "_rFrag.$_rFrag._frag._jsxFrag",
4+
"body": [
5+
"<$1$0>",
6+
"\t$TM_SELECTED_TEXT",
7+
"</$1>"
8+
],
9+
"description": "Wrap component with Fragment",
10+
"scope": "astro"
11+
},
12+
"🟨 jsxIf": {
13+
"prefix": "_rIf.$_rIf._jsxIf",
14+
"body": [
15+
"{${1:condition} ? (",
16+
"\t$TM_SELECTED_TEXT",
17+
") : (",
18+
"\t${0:null}",
19+
")}"
20+
],
21+
"description": "Wrap in if",
22+
"scope": "astro"
23+
},
24+
"🟨 jsxIfWithFragment": {
25+
"prefix": "_rIfFrag.$_rIfFrag._jsxIfFrag",
26+
"body": [
27+
"{${1:condition} ? (",
28+
"\t<>",
29+
"\t\t$TM_SELECTED_TEXT",
30+
"\t</>",
31+
") : (",
32+
"\t${0:null}",
33+
")}"
34+
],
35+
"description": "Wrap in if",
36+
"scope": "astro"
37+
},
38+
"🟨 jsxElse": {
39+
"prefix": "_rEl.$_rEl._jsxEl",
40+
"body": [
41+
"{${1:condition} ? (",
42+
"\t${0:null}",
43+
") : (",
44+
"\t$TM_SELECTED_TEXT",
45+
")}"
46+
],
47+
"description": "Wrap in else",
48+
"scope": "astro"
49+
},
50+
"🟨 jsxElseWithFragment": {
51+
"prefix": "_rElFrag.$_rElFrag._jsxElFrag",
52+
"body": [
53+
"{${1:condition} ? (",
54+
"\t${0:null}",
55+
") : (",
56+
"\t<>",
57+
"\t\t$TM_SELECTED_TEXT",
58+
"\t</>",
59+
")}"
60+
],
61+
"description": "Wrap in else",
62+
"scope": "astro"
63+
},
64+
"🟨 jsxConditional": {
65+
"prefix": "_rCond.$_rCond._jsxCond",
66+
"body": [
67+
"{${1:condition} && (",
68+
"\t$TM_SELECTED_TEXT",
69+
")}"
70+
],
71+
"description": "Wrap with conditional",
72+
"scope": "astro"
73+
},
74+
"🟨 jsxConditionalWithFragment": {
75+
"prefix": "_rCondFrag.$_rCondFrag._jsxCondFrag",
76+
"body": [
77+
"{${1:condition} && (",
78+
"\t<>",
79+
"\t\t$TM_SELECTED_TEXT",
80+
"\t</>",
81+
")}"
82+
],
83+
"description": "Wrap with conditional",
84+
"scope": "astro"
85+
},
86+
"🟨 jsxInnerHTML": {
87+
"prefix": "innerHTML.$innerHTML.dangerously",
88+
"body": [
89+
"<${1:div} dangerouslySetInnerHTML={{ __html: $2 }} />"
90+
],
91+
"description": "Create element with `dangerouslySetInnerHTML` prop",
92+
"scope": "astro"
93+
},
94+
"🟨 jsxButton": {
95+
"prefix": "button.$button",
96+
"body": [
97+
"<button type=\"button\" onClick={${2:onClick}}$3>",
98+
"\t${1:Button}",
99+
"</button>"
100+
],
101+
"description": "Create `<button />` element",
102+
"scope": "astro"
103+
},
104+
"🟨 jsxLoop": {
105+
"prefix": "loopJSX.$loopJSX",
106+
"body": [
107+
"{${1:list}.map((${2:$1Item}) => {$5",
108+
"\treturn (",
109+
"\t\t<${4:div} key={${2:$1Item}.${3:id}}>$0</$4>",
110+
"\t)",
111+
"})}"
112+
],
113+
"description": "JSX mapping an array",
114+
"scope": "astro"
115+
}
116+
}

‎snippets/typescript.json

+30-30
Original file line numberDiff line numberDiff line change
@@ -1570,8 +1570,24 @@
15701570
"description": "Wrap with function",
15711571
"scope": "javascript,typescript,javascriptreact,typescriptreact"
15721572
},
1573-
"🟨 wrapWithFragment": {
1574-
"prefix": "_rFrag.$_rFrag._frag",
1573+
"🟨 wrapWithJsonStringify": {
1574+
"prefix": "_jstr.$_jstr.JSON",
1575+
"body": [
1576+
"JSON.stringify($TM_SELECTED_TEXT${1:, null, 2})"
1577+
],
1578+
"description": "Wrap with `JSON.stringify`",
1579+
"scope": "javascript,typescript,javascriptreact,typescriptreact"
1580+
},
1581+
"🟨 wrapWithJsonParse": {
1582+
"prefix": "_jprs.$_jprs.JSON",
1583+
"body": [
1584+
"JSON.parse($TM_SELECTED_TEXT)"
1585+
],
1586+
"description": "Wrap with `JSON.parse`",
1587+
"scope": "javascript,typescript,javascriptreact,typescriptreact"
1588+
},
1589+
"🟨 jsxWrap": {
1590+
"prefix": "_rFrag.$_rFrag._frag._jsxFrag",
15751591
"body": [
15761592
"<$1$0>",
15771593
"\t$TM_SELECTED_TEXT",
@@ -1580,8 +1596,8 @@
15801596
"description": "Wrap component with Fragment",
15811597
"scope": "javascript,typescript,javascriptreact,typescriptreact"
15821598
},
1583-
"🟨 reactIf": {
1584-
"prefix": "_rIf.$_rIf",
1599+
"🟨 jsxIf": {
1600+
"prefix": "_rIf.$_rIf._jsxIf",
15851601
"body": [
15861602
"{${1:condition} ? (",
15871603
"\t$TM_SELECTED_TEXT",
@@ -1592,8 +1608,8 @@
15921608
"description": "Wrap in if",
15931609
"scope": "javascript,typescript,javascriptreact,typescriptreact"
15941610
},
1595-
"🟨 reactIfWithFragment": {
1596-
"prefix": "_rIfFrag.$_rIfFrag",
1611+
"🟨 jsxIfWithFragment": {
1612+
"prefix": "_rIfFrag.$_rIfFrag._jsxIfFrag",
15971613
"body": [
15981614
"{${1:condition} ? (",
15991615
"\t<>",
@@ -1606,8 +1622,8 @@
16061622
"description": "Wrap in if",
16071623
"scope": "javascript,typescript,javascriptreact,typescriptreact"
16081624
},
1609-
"🟨 reactElse": {
1610-
"prefix": "_rEl.$_rEl",
1625+
"🟨 jsxElse": {
1626+
"prefix": "_rEl.$_rEl._jsxEl",
16111627
"body": [
16121628
"{${1:condition} ? (",
16131629
"\t${0:null}",
@@ -1618,8 +1634,8 @@
16181634
"description": "Wrap in else",
16191635
"scope": "javascript,typescript,javascriptreact,typescriptreact"
16201636
},
1621-
"🟨 reactElseWithFragment": {
1622-
"prefix": "_rElFrag.$_rElFrag",
1637+
"🟨 jsxElseWithFragment": {
1638+
"prefix": "_rElFrag.$_rElFrag._jsxElFrag",
16231639
"body": [
16241640
"{${1:condition} ? (",
16251641
"\t${0:null}",
@@ -1632,8 +1648,8 @@
16321648
"description": "Wrap in else",
16331649
"scope": "javascript,typescript,javascriptreact,typescriptreact"
16341650
},
1635-
"🟨 reactConditional": {
1636-
"prefix": "_rCon.$_rCon",
1651+
"🟨 jsxConditional": {
1652+
"prefix": "_rCond.$_rCond._jsxCond",
16371653
"body": [
16381654
"{${1:condition} && (",
16391655
"\t$TM_SELECTED_TEXT",
@@ -1642,8 +1658,8 @@
16421658
"description": "Wrap with conditional",
16431659
"scope": "javascript,typescript,javascriptreact,typescriptreact"
16441660
},
1645-
"🟨 reactConditionalWithFragment": {
1646-
"prefix": "_rConFrag.$_rConFrag",
1661+
"🟨 jsxConditionalWithFragment": {
1662+
"prefix": "_rCondFrag.$_rCondFrag._jsxCondFrag",
16471663
"body": [
16481664
"{${1:condition} && (",
16491665
"\t<>",
@@ -1654,22 +1670,6 @@
16541670
"description": "Wrap with conditional",
16551671
"scope": "javascript,typescript,javascriptreact,typescriptreact"
16561672
},
1657-
"🟨 wrapWithJsonStringify": {
1658-
"prefix": "_jstr.$_jstr.JSON",
1659-
"body": [
1660-
"JSON.stringify($TM_SELECTED_TEXT${1:, null, 2})"
1661-
],
1662-
"description": "Wrap with `JSON.stringify`",
1663-
"scope": "javascript,typescript,javascriptreact,typescriptreact"
1664-
},
1665-
"🟨 wrapWithJsonParse": {
1666-
"prefix": "_jprs.$_jprs.JSON",
1667-
"body": [
1668-
"JSON.parse($TM_SELECTED_TEXT)"
1669-
],
1670-
"description": "Wrap with `JSON.parse`",
1671-
"scope": "javascript,typescript,javascriptreact,typescriptreact"
1672-
},
16731673
"🟨 jsxInnerHTML": {
16741674
"prefix": "innerHTML.$innerHTML.dangerously",
16751675
"body": [

‎src/index.ts

+11
Original file line numberDiff line numberDiff line change
@@ -96,6 +96,10 @@ const typescriptSnippets = {
9696
...miscTS,
9797
};
9898

99+
const jsxSnippets = {
100+
...htmlJsx,
101+
};
102+
99103
// Add scope
100104
Object.keys(javascriptSnippets).forEach((key) => {
101105
javascriptSnippets[key] = {
@@ -109,8 +113,15 @@ Object.keys(typescriptSnippets).forEach((key) => {
109113
scope: 'javascript,typescript,javascriptreact,typescriptreact',
110114
};
111115
});
116+
Object.keys(jsxSnippets).forEach((key) => {
117+
jsxSnippets[key] = {
118+
...jsxSnippets[key],
119+
scope: 'astro',
120+
};
121+
});
112122

113123
// Generate snippet file
114124
fs.mkdirSync('./snippets', { recursive: true });
115125
fs.writeFileSync('./snippets/javascript.json', JSON.stringify(javascriptSnippets, null, 2));
116126
fs.writeFileSync('./snippets/typescript.json', JSON.stringify(typescriptSnippets, null, 2));
127+
fs.writeFileSync('./snippets/jsx.json', JSON.stringify(jsxSnippets, null, 2));

0 commit comments

Comments
 (0)