1.4.2

- Remove prev-selector highlighting
- Fix highlighting issues (fix #3)
- Fix formatter removing indentation

.editorconfig

@@ -3,7 +3,9 @@ root = true
 [*]
 charset = utf-8
 indent_style = space
-indent_size = 2
 end_of_line = crlf
 insert_final_newline = true
 trim_trailing_whitespace = true
+
+[*.yaml]
+indent_size = 2

.gitattributes

@@ -3,3 +3,6 @@
 
 # Project
 package-lock.json -diff
+
+# Linguist
+*.nvss linguist-language=Less

.gitignore

@@ -1,7 +1,11 @@
+# Packages
 node_modules/
-test/
 
+# Compiled output
+formatters/*.js
+formatters/*.d.ts
+syntaxes/*.json
+*.vsix
+
+# Local files
 *.local.*
-*.js
-*.d.ts
-*.json

.vscode/launch.json

@@ -6,9 +6,10 @@
             "type": "extensionHost",
             "request": "launch",
             "runtimeExecutable": "${execPath}",
+            "preLaunchTask": "npm: compile",
             "args": [
                 "--extensionDevelopmentPath=${workspaceFolder}"
             ]
         }
     ]
-}
+}

changelog.md

@@ -1,5 +1,13 @@
 # Changelog
 
+## 1.4.2
+- Removed previous element selector syntax highlighting.
+- Fixed newlines breaking selector syntax highlighting (#3).
+- Fixed simple breakpoint highlighting not being applied when missing a preceeding selector part.
+- Fixed regular expression syntax higlighting not being applied when more than one flag is specified.
+- Fixed delimiters in anonymous arguments not having syntax highlighting applied.
+- Fixed indented pipes and closing parentheses having their indentation removed on format.
+
 ## 1.4.1
 - Fixed newlines breaking attribute syntax highlighting (#1).
 - Fixed selectors not having syntax highlighting applied when not at the start of a line.

formatters/formatter.ts

@@ -12,12 +12,9 @@ export function activate(context: vscode.ExtensionContext) {
 
                 // Variable substitutions
                 .replace(/\$\( */g, '$( ')
-                .replace(/(?<=(?:\$\(|\))[^()]+) *\)/g, ' )')
+                .replace(/(?<!^)(?<=^|(?:\$\(|\))[^()]+) *\)/gm, ' )')
                 .replace(/\$\(\s+([^$()|]+)\s+\)/g, '$($1)')
-                .replace(/ *\| */g, ' | ')
-                .replace(/  \|/g, ' |')
                 .replace(/(?<=\|)(.*?) *=\s*/g, '$1 = ')
-                .replace(/^ ([|)])/gm, '$1')
 
                 // Parser constants
                 .replace(/@const\s+([A-Z]+)\s+(true|false|\d+)/g, '@const $1 $2')

package.json

@@ -4,7 +4,7 @@
     "description": "Syntax highlighter and formatter for NovaSheets files",
     "publisher": "Nixinova",
     "repository": "NovaSheets-vscode",
-    "version": "1.4.1",
+    "version": "1.4.2",
     "license": "ISC",
     "scripts": {
         "vscode:prepublish": "npm run compile",

syntaxes/novasheets.tmLanguage.yaml

@@ -66,21 +66,20 @@ repository:
         endCaptures:
           0: { name: constant.character.variable.end.novasheets }
         patterns:
-          - name: meta.function-call.parameter.novasheets
-            match: '(\|)\s*([^=|]+)\s*(=)'
-            captures:
-              1: { name: constant.character.separator.parameter.novasheets }
-              2: { name: variable.parameter.novasheets }
-              3: { name: constant.character.accessor.parameter.novasheets }
-            patterns:
-              - name: variable.parameter.novasheets
-                match: '[^=|]+'
           - include: '#novasheets'
           - include: '#css'
           - include: '#chars'
-          - name: string.regexp.novasheets
-            begin: '(?<!\\)/'
-            end: '(?<!\\)/[gimusy]?(?=\s|\b)'
+
+      # Arguments
+      - name: meta.function-call.parameter.novasheets
+        match: '(\|)(?:\s*([^=|]+)\s*(=))?'
+        captures:
+          1: { name: constant.character.separator.parameter.novasheets }
+          2: { name: variable.parameter.novasheets }
+          3: { name: constant.character.accessor.parameter.novasheets }
+        patterns:
+          - name: variable.parameter.novasheets
+            match: '[^=|]+'
 
       # Parameters
       - name: meta.block.parameter.novasheets
@@ -163,12 +162,13 @@ repository:
   selectors:
     patterns:
       - name: meta.selector.novasheets
-        begin: '(?<!@[^$@{}])(?=\s*[A-Za-z&%,.#:+~>\[\]])(?=.*{)'
+        # begin: '(?<!@[^$@{}])(?=[\w&,.#:+~>\[\]])(?={)'
+        begin: '^'
         end: '(?=\{)'
         patterns:
           # Element
           - name: entity.name.tag.css.selector.element.css
-            match: '\w+(?=[\s{\[,.#:+~>])'
+            match: '\w+(?=[\s{\[,.#:+~>])(?=.+{)'
           # Class
           - name: entity.name.tag.css.selector.class.css
             match: '(\.)(?>\\\s|[^\s,.#:+~>\[\]])+'
@@ -200,39 +200,36 @@ repository:
             end: '\)'
             endCaptures:
               0: { name: punctuation.accessor.selector.function.end.css }
-          # Sliced parts
-          - name: entity.name.tag.css.selector.sliced.css
-            match: '(?<=&|%)\S+'
           # Wildcard
           - name: constant.character.wildcard.css
             match: '\*'
           # Comma
           - name: punctuation.separator.selector.css
             match: ','
+          # At-rule
+          - include: '#at-rules'
           # Breakpoint
           - name: keyword.control.breakpoint.novasheets
-            match: '@|\.{2,}'
+            match: '@(?!a-z)|\.{2,}'
           # Parent selector
           - name: constant.character.selector.parent.novasheets
             match: '&'
-          # Previous selector
-          - name: constant.character.selector.previous.novasheets
-            match: '%'
           # Other
           - include: '#novasheets'
+          - include: '#attributes'
           - include: '#chars'
 
   attributes:
     patterns:
       - name: entity.other.attribute-name.css
-        match: '([\w-]+)(:)'
+        match: '([a-z-]+)(:)'
         captures:
           2: { name: punctuation.terminator.attribute.name.end.css }
 
   at-rules:
     patterns:
       - name: keyword.control.function.at-rule.css
-        match: '@[\w-]+'
+        match: '@[a-z-]+'
 
   functions:
     patterns:
@@ -270,6 +267,10 @@ repository:
       - name: constant.numeric.css
         match: '[+-]?[0-9]+(?:\.[0-9]+)?'
 
+      # Regexes
+      - name: string.regexp.novasheets
+        match: '(?<!\\)/.+(?<!\\)/[gimusy]*(?=\s|\b)'
+
       # Units
       - name: constant.numeric.unit.css
         match: '(?<=[\d.])(%|em|rem|en|ex|vw|vh|px|pt|pc|cm|mm|m|ft|in|s|ms|deg)(?!\w)'

test/test.nvss

@@ -0,0 +1,78 @@
+// NovaSheets //
+@var base-font-size = 2em
+@var theme color = #7f5d4a
+@var url = url("https://example.com")
+@var border| size | type
+    $[size] $[type] $(theme color)
+@endvar
+
+body {border: $( border | size = $(base-font-size) | type = solid ); padding: 4em / 2;}
+.title {
+    margin-left: 1em; font-size: $(base-font-size); border-bottom: $( border | type = dotted | size = 1px );
+    &:hover {font-size: $(base-font-size) * 125e-2;}
+}
+.display,
+.content {
+    padding: 1/2em 1em;
+    p {
+        font-family: "sans-serif";
+        &-styled {color: $(theme color);}
+    }
+}
+
+a {
+    $( @breakpoint | 500px |
+    .selector {color: red;}
+    |
+    .other {color: green;}
+  )
+}
+
+/*[ $(@pi) ]*/
+
+@font-face {font-family: 'Valken'; src: local('Valken'), url('/assets/fonts/valken.ttf') format('truetype');}
+
+@var underline = {content: ""; display: block; width: 0; height: 2px; margin-left: 25%; background: #fff; transition: 0.7s;}
+
+// Elements
+html {scroll-behavior: smooth;}
+body {background: linear-gradient(135deg, #14a, #15d); overflow-x: hidden;}
+footer {margin-top: 0;}
+
+// Pseudo-elements
+h2::before, h2::after {$(underline)!; width: 50%;}
+h2:hover::before, h2:hover::after {width: 70%; margin-left: 20%;}
+a[href]:hover {opacity: 1;}
+
+// Top tile
+#nixinova {
+    background: $<body><background>;
+    img {position: absolute; max-width: 50%; filter: brightness(0) invert(1); font-size: 10.4vw; font-family: 'Valken';}
+    &-news img:hover {opacity: 0.6; transition: 0.2s;}
+}
+
+// Tile containers
+.showcase-container {
+    border-top: 2px solid; text-align: center;
+    hr {width: 50%;}
+    h2 {font-size: 8vh;}
+    img {max-width: 50%;}
+    ul {padding-left: 0; list-style-type: none; font-size: 2.5em;}
+    li {
+        padding: 0.4em;
+        ::after {$(underline)!}
+        :hover::after {width: 50%;}
+        a {display: inline-block; color: #eee;}
+    }
+}
+.content-container {
+    @ 900px {display: flex;}
+    div {margin: auto;}
+    .title @ 900px {width: 50vw;}
+    .contents @ 900px {width: 40vw; text-align: left;}
+}
+.image-background {background: fixed #333 center; background-blend-mode: overlay; background-size: cover;}
+
+$( @replace | text | /a/ | 3 )
+
+/* Copyright © Nixinova 2021 */

tsconfig.json

@@ -4,7 +4,7 @@
 
     /* Basic Options */
     //"incremental": true,
-    "target": "es2018",
+    "target": "es2019",
     "module": "commonjs",
     //"lib": [],
     //"allowJs": true,