Skip to content

Commit ca4c371

Browse files
committed
Add nesting support to CSS syntax
wip
1 parent beb6d43 commit ca4c371

File tree

2 files changed

+1966
-6
lines changed

2 files changed

+1966
-6
lines changed

packages/tailwindcss-language-syntax/syntaxes/css.json

Lines changed: 53 additions & 4 deletions
Original file line numberDiff line numberDiff line change
@@ -31,6 +31,9 @@
3131
},
3232
{
3333
"include": "#rule-list"
34+
},
35+
{
36+
"include": "#nesting-selector"
3437
}
3538
],
3639
"repository": {
@@ -224,6 +227,9 @@
224227
},
225228
"name": "meta.at-rule.media.body.css",
226229
"patterns": [
230+
{
231+
"include": "#nesting-at-rules"
232+
},
227233
{
228234
"include": "$self"
229235
}
@@ -506,6 +512,9 @@
506512
},
507513
"name": "meta.at-rule.supports.body.css",
508514
"patterns": [
515+
{
516+
"include": "#nesting-at-rules"
517+
},
509518
{
510519
"include": "$self"
511520
}
@@ -1379,6 +1388,37 @@
13791388
},
13801389
"match": "(?xi)\n(?<=^|\\s|,|\\*/)\n(?:\n # Valid media types\n (all|print|screen|speech)\n |\n # Deprecated in Media Queries 4: http://dev.w3.org/csswg/mediaqueries/#media-types\n (aural|braille|embossed|handheld|projection|tty|tv)\n)\n(?=$|[{,\\s;]|/\\*)"
13811390
},
1391+
"nesting-at-rules": {
1392+
"patterns": [
1393+
{
1394+
"include": "#commas"
1395+
},
1396+
{
1397+
"include": "#nesting-rules"
1398+
},
1399+
{
1400+
"include": "#rule-list-innards"
1401+
}
1402+
]
1403+
},
1404+
"nesting-rules": {
1405+
"patterns": [
1406+
{
1407+
"match": "(?xi) (?<![\\w:-])\n(?:\n header|label|mark|nav|ruby|span\n)\n(?=[+~>\\s,.\\#|&){:\\[]|/\\*|$)",
1408+
"name": "entity.name.tag.css"
1409+
},
1410+
{
1411+
"include": "#property-names"
1412+
},
1413+
{
1414+
"include": "#selector-innards"
1415+
}
1416+
]
1417+
},
1418+
"nesting-selector": {
1419+
"match": "&",
1420+
"name": "entity.name.tag.nesting.selector.css"
1421+
},
13821422
"numeric-values": {
13831423
"patterns": [
13841424
{
@@ -1510,8 +1550,14 @@
15101550
},
15111551
"name": "meta.property-list.css",
15121552
"patterns": [
1553+
{
1554+
"include": "#nesting-rules"
1555+
},
15131556
{
15141557
"include": "#rule-list-innards"
1558+
},
1559+
{
1560+
"include": "$self"
15151561
}
15161562
]
15171563
},
@@ -1581,6 +1627,9 @@
15811627
},
15821628
"selector-innards": {
15831629
"patterns": [
1630+
{
1631+
"include": "#nesting-selector"
1632+
},
15841633
{
15851634
"include": "#comment-block"
15861635
},
@@ -1624,7 +1673,7 @@
16241673
]
16251674
}
16261675
},
1627-
"match": "(?x) (?<![@\\w-])\n([.\\#])\n# Invalid identifier\n(\n (?:\n # Starts with ASCII digits, with possible hyphen preceding it\n -?[0-9]\n |\n # Consists of a hyphen only\n - # Terminated by either:\n (?= $ # - End-of-line\n | [\\s,.\\#)\\[:{>+~|] # - Followed by another selector\n | /\\* # - Followed by a block comment\n )\n |\n # Name contains unescaped ASCII symbol\n (?: # Check for acceptable preceding characters\n [-a-zA-Z_0-9]|[^\\x00-\\x7F] # - Valid selector character\n | \\\\(?:[0-9a-fA-F]{1,6}|.) # - Escape sequence\n )*\n (?: # Invalid punctuation\n [!\"'%&(*;<?@^`|\\]}] # - NOTE: We exempt `)` from the list of checked\n | # symbols to avoid matching `:not(.invalid)`\n / (?!\\*) # - Avoid invalidating the start of a comment\n )+\n )\n # Mark remainder of selector invalid\n (?: [-a-zA-Z_0-9]|[^\\x00-\\x7F] # - Otherwise valid identifier characters\n | \\\\(?:[0-9a-fA-F]{1,6}|.) # - Escape sequence\n )*\n)",
1676+
"match": "(?x) (?<![@\\w-])\n([.\\#])\n# Invalid identifier\n(\n (?:\n # Starts with ASCII digits, with possible hyphen preceding it\n -?[0-9]\n |\n # Consists of a hyphen only\n - # Terminated by either:\n (?= $ # - End-of-line\n | [\\s,.\\#)\\[:{>+~|&] # - Followed by another selector\n | /\\* # - Followed by a block comment\n )\n |\n # Name contains unescaped ASCII symbol\n (?: # Check for acceptable preceding characters\n [-a-zA-Z_0-9]|[^\\x00-\\x7F] # - Valid selector character\n | \\\\(?:[0-9a-fA-F]{1,6}|.) # - Escape sequence\n )*\n (?: # Invalid punctuation\n [!\"'%(*;<?@^`|\\]}] # - NOTE: We exempt `)` from the list of checked\n | # symbols to avoid matching `:not(.invalid)`\n / (?!\\*) # - Avoid invalidating the start of a comment\n )+\n )\n # Mark remainder of selector invalid\n (?: [-a-zA-Z_0-9]|[^\\x00-\\x7F] # - Otherwise valid identifier characters\n | \\\\(?:[0-9a-fA-F]{1,6}|.) # - Escape sequence\n )*\n)",
16281677
"name": "invalid.illegal.bad-identifier.css"
16291678
},
16301679
{
@@ -1640,7 +1689,7 @@
16401689
]
16411690
}
16421691
},
1643-
"match": "(?x)\n(\\.) # Valid class-name\n(\n (?: [-a-zA-Z_0-9]|[^\\x00-\\x7F] # Valid identifier characters\n | \\\\(?:[0-9a-fA-F]{1,6}|.) # Escape sequence\n )+\n) # Followed by either:\n(?= $ # - End of the line\n | [\\s,.\\#)\\[:{>+~|] # - Another selector\n | /\\* # - A block comment\n)",
1692+
"match": "(?x)\n(\\.) # Valid class-name\n(\n (?: [-a-zA-Z_0-9]|[^\\x00-\\x7F] # Valid identifier characters\n | \\\\(?:[0-9a-fA-F]{1,6}|.) # Escape sequence\n )+\n) # Followed by either:\n(?= $ # - End of the line\n | [\\s,.\\#)\\[:{>+~|&] # - Another selector\n | /\\* # - A block comment\n)",
16441693
"name": "entity.other.attribute-name.class.css"
16451694
},
16461695
{
@@ -1656,7 +1705,7 @@
16561705
]
16571706
}
16581707
},
1659-
"match": "(?x)\n(\\#)\n(\n -?\n (?![0-9])\n (?:[-a-zA-Z0-9_]|[^\\x00-\\x7F]|\\\\(?:[0-9a-fA-F]{1,6}|.))+\n)\n(?=$|[\\s,.\\#)\\[:{>+~|]|/\\*)",
1708+
"match": "(?x)\n(\\#)\n(\n -?\n (?![0-9])\n (?:[-a-zA-Z0-9_]|[^\\x00-\\x7F]|\\\\(?:[0-9a-fA-F]{1,6}|.))+\n)\n(?=$|[\\s,.\\#)\\[:{>+~|&]|/\\*)",
16601709
"name": "entity.other.attribute-name.id.css"
16611710
},
16621711
{
@@ -1820,7 +1869,7 @@
18201869
]
18211870
},
18221871
"tag-names": {
1823-
"match": "(?xi) (?<![\\w:-])\n(?:\n # HTML\n a|abbr|acronym|address|applet|area|article|aside|audio|b|base|basefont|bdi|bdo|bgsound\n | big|blink|blockquote|body|br|button|canvas|caption|center|cite|code|col|colgroup|command\n | content|data|datalist|dd|del|details|dfn|dialog|dir|div|dl|dt|element|em|embed|fieldset\n | figcaption|figure|font|footer|form|frame|frameset|h[1-6]|head|header|hgroup|hr|html|i\n | iframe|image|img|input|ins|isindex|kbd|keygen|label|legend|li|link|listing|main|map|mark\n | marquee|math|menu|menuitem|meta|meter|multicol|nav|nextid|nobr|noembed|noframes|noscript\n | object|ol|optgroup|option|output|p|param|picture|plaintext|pre|progress|q|rb|rp|rt|rtc\n | ruby|s|samp|script|section|select|shadow|slot|small|source|spacer|span|strike|strong\n | style|sub|summary|sup|table|tbody|td|template|textarea|tfoot|th|thead|time|title|tr\n | track|tt|u|ul|var|video|wbr|xmp\n\n # SVG\n | altGlyph|altGlyphDef|altGlyphItem|animate|animateColor|animateMotion|animateTransform\n | circle|clipPath|color-profile|cursor|defs|desc|discard|ellipse|feBlend|feColorMatrix\n | feComponentTransfer|feComposite|feConvolveMatrix|feDiffuseLighting|feDisplacementMap\n | feDistantLight|feDropShadow|feFlood|feFuncA|feFuncB|feFuncG|feFuncR|feGaussianBlur\n | feImage|feMerge|feMergeNode|feMorphology|feOffset|fePointLight|feSpecularLighting\n | feSpotLight|feTile|feTurbulence|filter|font-face|font-face-format|font-face-name\n | font-face-src|font-face-uri|foreignObject|g|glyph|glyphRef|hatch|hatchpath|hkern\n | line|linearGradient|marker|mask|mesh|meshgradient|meshpatch|meshrow|metadata\n | missing-glyph|mpath|path|pattern|polygon|polyline|radialGradient|rect|set|solidcolor\n | stop|svg|switch|symbol|text|textPath|tref|tspan|use|view|vkern\n\n # MathML\n | annotation|annotation-xml|maction|maligngroup|malignmark|math|menclose|merror|mfenced\n | mfrac|mglyph|mi|mlabeledtr|mlongdiv|mmultiscripts|mn|mo|mover|mpadded|mphantom|mroot\n | mrow|ms|mscarries|mscarry|msgroup|msline|mspace|msqrt|msrow|mstack|mstyle|msub|msubsup\n | msup|mtable|mtd|mtext|mtr|munder|munderover|semantics\n)\n(?=[+~>\\s,.\\#|){:\\[]|/\\*|$)",
1872+
"match": "(?xi) (?<![\\w:-])\n(?:\n # HTML\n a|abbr|acronym|address|applet|area|article|aside|audio|b|base|basefont|bdi|bdo|bgsound\n | big|blink|blockquote|body|br|button|canvas|caption|center|cite|code|col|colgroup|command\n | content|data|datalist|dd|del|details|dfn|dialog|dir|div|dl|dt|element|em|embed|fieldset\n | figcaption|figure|font|footer|form|frame|frameset|h[1-6]|head|header|hgroup|hr|html|i\n | iframe|image|img|input|ins|isindex|kbd|keygen|label|legend|li|link|listing|main|map|mark\n | marquee|math|menu|menuitem|meta|meter|multicol|nav|nextid|nobr|noembed|noframes|noscript\n | object|ol|optgroup|option|output|p|param|picture|plaintext|pre|progress|q|rb|rp|rt|rtc\n | ruby|s|samp|script|section|select|shadow|slot|small|source|spacer|span|strike|strong\n | style|sub|summary|sup|table|tbody|td|template|textarea|tfoot|th|thead|time|title|tr\n | track|tt|u|ul|var|video|wbr|xmp\n\n # SVG\n | altGlyph|altGlyphDef|altGlyphItem|animate|animateColor|animateMotion|animateTransform\n | circle|clipPath|color-profile|cursor|defs|desc|discard|ellipse|feBlend|feColorMatrix\n | feComponentTransfer|feComposite|feConvolveMatrix|feDiffuseLighting|feDisplacementMap\n | feDistantLight|feDropShadow|feFlood|feFuncA|feFuncB|feFuncG|feFuncR|feGaussianBlur\n | feImage|feMerge|feMergeNode|feMorphology|feOffset|fePointLight|feSpecularLighting\n | feSpotLight|feTile|feTurbulence|filter|font-face|font-face-format|font-face-name\n | font-face-src|font-face-uri|foreignObject|g|glyph|glyphRef|hatch|hatchpath|hkern\n | line|linearGradient|marker|mask|mesh|meshgradient|meshpatch|meshrow|metadata\n | missing-glyph|mpath|path|pattern|polygon|polyline|radialGradient|rect|set|solidcolor\n | stop|svg|switch|symbol|text|textPath|tref|tspan|use|view|vkern\n\n # MathML\n | annotation|annotation-xml|maction|maligngroup|malignmark|math|menclose|merror|mfenced\n | mfrac|mglyph|mi|mlabeledtr|mlongdiv|mmultiscripts|mn|mo|mover|mpadded|mphantom|mroot\n | mrow|ms|mscarries|mscarry|msgroup|msline|mspace|msqrt|msrow|mstack|mstyle|msub|msubsup\n | msup|mtable|mtd|mtext|mtr|munder|munderover|semantics\n)\n(?=[+~>\\s,.\\#|&){:\\[]|/\\*|$)",
18241873
"name": "entity.name.tag.css"
18251874
},
18261875
"unicode-range": {

0 commit comments

Comments
 (0)