vscode-css-languageservice 6.2.9 → 6.2.11

package/README.md

@@ -39,8 +39,8 @@ Development
 -----------
 
 
-- clone this repo, run yarn
-- `yarn test` to compile and run tests
+- clone this repo, run `npm install``
+- `npm test` to compile and run tests
 
 How can I run and debug the service?
 
@@ -53,8 +53,8 @@ How can I run and debug the service?
 How can I run and debug the service inside an instance of VSCode?
 
 - run VSCode out of sources setup as described here: https://github.com/Microsoft/vscode/wiki/How-to-Contribute
-- run `yarn link` in the folder of `vscode-css-languageservice`
-- use `yarn link vscode-css-languageservice` in `vscode/extensions/css-language-features/server` to run VSCode with the latest changes from `vscode-css-languageservice`
+- run `npm link` in the folder of `vscode-css-languageservice`
+- use `npm link vscode-css-languageservice` in `vscode/extensions/css-language-features/server` to run VSCode with the latest changes from `vscode-css-languageservice`
 - run VSCode out of source (`vscode/scripts/code.sh|bat`) and open a `.css` file
 - in VSCode window that is open on the `vscode-css-languageservice` sources, run command `Debug: Attach to Node process` and pick the `code-oss` process with the `css-language-features` path
 ![image](https://user-images.githubusercontent.com/6461412/94242567-842b1200-ff16-11ea-8f85-3ebb72d06ba8.png)

package/lib/esm/beautify/beautify-css.js

@@ -1,5 +1,5 @@
 // copied from js-beautify/js/lib/beautify-css.js
-// version: 1.14.9
+// version: 1.14.11
 /* AUTO-GENERATED. DO NOT MODIFY. */
 /*
 
@@ -1280,13 +1280,11 @@ Beautifier.prototype.beautify = function() {
 
       if (variable.match(/[ :]$/)) {
         // we have a variable or pseudo-class, add it and insert one space before continuing
-        variable = this.eatString(": ").replace(/\s$/, '');
+        variable = this.eatString(": ").replace(/\s+$/, '');
         this.print_string(variable);
         this._output.space_before_token = true;
       }
 
-      variable = variable.replace(/\s$/, '');
-
       // might be sass variable
       if (parenLevel === 0 && variable.indexOf(':') !== -1) {
         insidePropertyValue = true;
@@ -1306,13 +1304,11 @@ Beautifier.prototype.beautify = function() {
 
         if (variableOrRule.match(/[ :]$/)) {
           // we have a variable or pseudo-class, add it and insert one space before continuing
-          variableOrRule = this.eatString(": ").replace(/\s$/, '');
+          variableOrRule = this.eatString(": ").replace(/\s+$/, '');
           this.print_string(variableOrRule);
           this._output.space_before_token = true;
         }
 
-        variableOrRule = variableOrRule.replace(/\s$/, '');
-
         // might be less variable
         if (parenLevel === 0 && variableOrRule.indexOf(':') !== -1) {
           insidePropertyValue = true;

package/lib/esm/cssLanguageService.js

@@ -33,6 +33,7 @@ function createFacade(parser, completion, hover, navigation, codeActions, valida
             validation.configure(settings);
             completion.configure(settings?.completion);
             hover.configure(settings?.hover);
+            navigation.configure(settings?.importAliases);
         },
         setDataProviders: cssDataManager.setDataProviders.bind(cssDataManager),
         doValidation: validation.doValidation.bind(validation),

package/lib/esm/cssLanguageTypes.d.ts

@@ -13,6 +13,10 @@ export interface LanguageSettings {
     lint?: LintSettings;
     completion?: CompletionSettings;
     hover?: HoverSettings;
+    importAliases?: AliasSettings;
+}
+export interface AliasSettings {
+    [key: string]: string;
 }
 export interface HoverSettings {
     documentation?: boolean;

package/lib/esm/parser/cssNodes.js

@@ -97,6 +97,7 @@ export var NodeType;
     NodeType[NodeType["LayerNameList"] = 84] = "LayerNameList";
     NodeType[NodeType["LayerName"] = 85] = "LayerName";
     NodeType[NodeType["PropertyAtRule"] = 86] = "PropertyAtRule";
+    NodeType[NodeType["Container"] = 87] = "Container";
 })(NodeType || (NodeType = {}));
 export var ReferenceType;
 (function (ReferenceType) {
@@ -922,6 +923,14 @@ export class Document extends BodyDeclaration {
         return NodeType.Document;
     }
 }
+export class Container extends BodyDeclaration {
+    constructor(offset, length) {
+        super(offset, length);
+    }
+    get type() {
+        return NodeType.Container;
+    }
+}
 export class Medialist extends Node {
     constructor(offset, length) {
         super(offset, length);

package/lib/esm/parser/cssParser.js

@@ -276,6 +276,7 @@ export class Parser {
             || this._parseViewPort()
             || this._parseNamespace()
             || this._parseDocument()
+            || this._parseContainer()
             || this._parseUnknownAtRule();
     }
     _tryParseRuleset(isNested) {
@@ -615,6 +616,9 @@ export class Parser {
         if (!node.addChild(this._parseURILiteral()) && !node.addChild(this._parseStringLiteral())) {
             return this.finish(node, ParseError.URIOrStringExpected);
         }
+        return this._completeParseImport(node);
+    }
+    _completeParseImport(node) {
         if (this.acceptIdent('layer')) {
             if (this.accept(TokenType.ParenthesisL)) {
                 if (!node.addChild(this._parseLayerName())) {
@@ -811,11 +815,10 @@ export class Parser {
     }
     _parseLayerName() {
         // <layer-name> = <ident> [ '.' <ident> ]*
-        if (!this.peek(TokenType.Ident)) {
+        const node = this.createNode(nodes.NodeType.LayerName);
+        if (!node.addChild(this._parseIdent())) {
             return null;
         }
-        const node = this.createNode(nodes.NodeType.LayerName);
-        node.addChild(this._parseIdent());
         while (!this.hasWhitespace() && this.acceptDelim('.')) {
             if (this.hasWhitespace() || !node.addChild(this._parseIdent())) {
                 return this.finish(node, ParseError.IdentifierExpected);
@@ -1134,6 +1137,111 @@ export class Parser {
         this.resync([], [TokenType.CurlyL]); // ignore all the rules
         return this._parseBody(node, this._parseStylesheetStatement.bind(this));
     }
+    _parseContainer() {
+        if (!this.peekKeyword('@container')) {
+            return null;
+        }
+        const node = this.create(nodes.Container);
+        this.consumeToken(); // @container
+        node.addChild(this._parseIdent()); // optional container name
+        node.addChild(this._parseContainerQuery());
+        return this._parseBody(node, this._parseStylesheetStatement.bind(this));
+    }
+    _parseContainerQuery() {
+        // <container-query>     = not <query-in-parens>
+        //                         | <query-in-parens> [ [ and <query-in-parens> ]* | [ or <query-in-parens> ]* ]
+        const node = this.create(nodes.Node);
+        if (this.acceptIdent('not')) {
+            node.addChild(this._parseContainerQueryInParens());
+        }
+        else {
+            node.addChild(this._parseContainerQueryInParens());
+            if (this.peekIdent('and')) {
+                while (this.acceptIdent('and')) {
+                    node.addChild(this._parseContainerQueryInParens());
+                }
+            }
+            else if (this.peekIdent('or')) {
+                while (this.acceptIdent('or')) {
+                    node.addChild(this._parseContainerQueryInParens());
+                }
+            }
+        }
+        return this.finish(node);
+    }
+    _parseContainerQueryInParens() {
+        // <query-in-parens>     = ( <container-query> )
+        // 					  | ( <size-feature> )
+        // 					  | style( <style-query> )
+        // 					  | <general-enclosed>
+        const node = this.create(nodes.Node);
+        if (this.accept(TokenType.ParenthesisL)) {
+            if (this.peekIdent('not') || this.peek(TokenType.ParenthesisL)) {
+                node.addChild(this._parseContainerQuery());
+            }
+            else {
+                node.addChild(this._parseMediaFeature());
+            }
+            if (!this.accept(TokenType.ParenthesisR)) {
+                return this.finish(node, ParseError.RightParenthesisExpected, [], [TokenType.CurlyL]);
+            }
+        }
+        else if (this.acceptIdent('style')) {
+            if (this.hasWhitespace() || !this.accept(TokenType.ParenthesisL)) {
+                return this.finish(node, ParseError.LeftParenthesisExpected, [], [TokenType.CurlyL]);
+            }
+            node.addChild(this._parseStyleQuery());
+            if (!this.accept(TokenType.ParenthesisR)) {
+                return this.finish(node, ParseError.RightParenthesisExpected, [], [TokenType.CurlyL]);
+            }
+        }
+        else {
+            return this.finish(node, ParseError.LeftParenthesisExpected, [], [TokenType.CurlyL]);
+        }
+        return this.finish(node);
+    }
+    _parseStyleQuery() {
+        // <style-query>         = not <style-in-parens>
+        // 					  | <style-in-parens> [ [ and <style-in-parens> ]* | [ or <style-in-parens> ]* ]
+        // 					  | <style-feature>
+        // <style-in-parens>     = ( <style-query> )
+        // 					  | ( <style-feature> )
+        // 					  | <general-enclosed>
+        const node = this.create(nodes.Node);
+        if (this.acceptIdent('not')) {
+            node.addChild(this._parseStyleInParens());
+        }
+        else if (this.peek(TokenType.ParenthesisL)) {
+            node.addChild(this._parseStyleInParens());
+            if (this.peekIdent('and')) {
+                while (this.acceptIdent('and')) {
+                    node.addChild(this._parseStyleInParens());
+                }
+            }
+            else if (this.peekIdent('or')) {
+                while (this.acceptIdent('or')) {
+                    node.addChild(this._parseStyleInParens());
+                }
+            }
+        }
+        else {
+            node.addChild(this._parseDeclaration([TokenType.ParenthesisR]));
+        }
+        return this.finish(node);
+    }
+    _parseStyleInParens() {
+        const node = this.create(nodes.Node);
+        if (this.accept(TokenType.ParenthesisL)) {
+            node.addChild(this._parseStyleQuery());
+            if (!this.accept(TokenType.ParenthesisR)) {
+                return this.finish(node, ParseError.RightParenthesisExpected, [], [TokenType.CurlyL]);
+            }
+        }
+        else {
+            return this.finish(node, ParseError.LeftParenthesisExpected, [], [TokenType.CurlyL]);
+        }
+        return this.finish(node);
+    }
     // https://www.w3.org/TR/css-syntax-3/#consume-an-at-rule
     _parseUnknownAtRule() {
         if (!this.peek(TokenType.AtKeyword)) {
@@ -1562,6 +1670,7 @@ export class Parser {
             this.peek(TokenType.Angle) ||
             this.peek(TokenType.Time) ||
             this.peek(TokenType.Dimension) ||
+            this.peek(TokenType.ContainerQueryLength) ||
             this.peek(TokenType.Freq)) {
             const node = this.create(nodes.NumericValue);
             this.consumeToken();

package/lib/esm/parser/cssScanner.js

@@ -47,7 +47,8 @@ export var TokenType;
     TokenType[TokenType["Comment"] = 39] = "Comment";
     TokenType[TokenType["SingleLineComment"] = 40] = "SingleLineComment";
     TokenType[TokenType["EOF"] = 41] = "EOF";
-    TokenType[TokenType["CustomToken"] = 42] = "CustomToken";
+    TokenType[TokenType["ContainerQueryLength"] = 42] = "ContainerQueryLength";
+    TokenType[TokenType["CustomToken"] = 43] = "CustomToken"; // must be last token type
 })(TokenType || (TokenType = {}));
 export class MultiLineStream {
     constructor(source) {
@@ -184,6 +185,12 @@ staticUnitTable['%'] = TokenType.Percentage;
 staticUnitTable['fr'] = TokenType.Percentage;
 staticUnitTable['dpi'] = TokenType.Resolution;
 staticUnitTable['dpcm'] = TokenType.Resolution;
+staticUnitTable['cqw'] = TokenType.ContainerQueryLength;
+staticUnitTable['cqh'] = TokenType.ContainerQueryLength;
+staticUnitTable['cqi'] = TokenType.ContainerQueryLength;
+staticUnitTable['cqb'] = TokenType.ContainerQueryLength;
+staticUnitTable['cqmin'] = TokenType.ContainerQueryLength;
+staticUnitTable['cqmax'] = TokenType.ContainerQueryLength;
 export class Scanner {
     constructor() {
         this.stream = new MultiLineStream('');

package/lib/esm/parser/lessParser.js

@@ -53,7 +53,7 @@ export class LESSParser extends cssParser.Parser {
         if (!this.peek(TokenType.SemiColon) && !this.peek(TokenType.EOF)) {
             node.setMedialist(this._parseMediaQueryList());
         }
-        return this.finish(node);
+        return this._completeParseImport(node);
     }
     _parsePlugin() {
         if (!this.peekKeyword('@plugin')) {

package/lib/esm/parser/scssParser.js

@@ -46,10 +46,7 @@ export class SCSSParser extends cssParser.Parser {
                 return this.finish(node, ParseError.URIOrStringExpected);
             }
         }
-        if (!this.peek(TokenType.SemiColon) && !this.peek(TokenType.EOF)) {
-            node.setMedialist(this._parseMediaQueryList());
-        }
-        return this.finish(node);
+        return this._completeParseImport(node);
     }
     // scss variables: $font-size: 12px;
     _parseVariableDeclaration(panic = []) {
@@ -101,6 +98,9 @@ export class SCSSParser extends cssParser.Parser {
     _parseKeyframeSelector() {
         return this._tryParseKeyframeSelector()
             || this._parseControlStatement(this._parseKeyframeSelector.bind(this))
+            || this._parseWarnAndDebug() // @warn, @debug and @error statements
+            || this._parseMixinReference() // @include
+            || this._parseFunctionDeclaration() // @function
             || this._parseVariableDeclaration()
             || this._parseMixinContent();
     }

package/lib/esm/services/cssNavigation.js

@@ -17,6 +17,9 @@ export class CSSNavigation {
         this.fileSystemProvider = fileSystemProvider;
         this.resolveModuleReferences = resolveModuleReferences;
     }
+    configure(settings) {
+        this.defaultSettings = settings;
+    }
     findDefinition(document, position, stylesheet) {
         const symbols = new Symbols(stylesheet);
         const offset = document.offsetAt(position);
@@ -334,7 +337,7 @@ export class CSSNavigation {
     async mapReference(target, isRawLink) {
         return target;
     }
-    async resolveReference(target, documentUri, documentContext, isRawLink = false) {
+    async resolveReference(target, documentUri, documentContext, isRawLink = false, settings = this.defaultSettings) {
         // Following [css-loader](https://github.com/webpack-contrib/css-loader#url)
         // and [sass-loader's](https://github.com/webpack-contrib/sass-loader#imports)
         // convention, if an import path starts with ~ then use node module resolution
@@ -357,6 +360,24 @@ export class CSSNavigation {
                 return moduleReference;
             }
         }
+        // Try resolving the reference from the language configuration alias settings
+        if (ref && !(await this.fileExists(ref))) {
+            const rootFolderUri = documentContext.resolveReference('/', documentUri);
+            if (settings && rootFolderUri) {
+                // Specific file reference
+                if (target in settings) {
+                    return this.mapReference(joinPath(rootFolderUri, settings[target]), isRawLink);
+                }
+                // Reference folder
+                const firstSlash = target.indexOf('/');
+                const prefix = `${target.substring(0, firstSlash)}/`;
+                if (prefix in settings) {
+                    const aliasPath = (settings[prefix]).slice(0, -1);
+                    let newPath = joinPath(rootFolderUri, aliasPath);
+                    return this.mapReference(newPath = joinPath(newPath, target.substring(prefix.length - 1)), isRawLink);
+                }
+            }
+        }
         // fall back. it might not exists
         return ref;
     }

package/lib/esm/services/scssNavigation.js

@@ -35,15 +35,15 @@ export class SCSSNavigation extends CSSNavigation {
     }
 }
 function toPathVariations(target) {
-    // No variation for links that ends with suffix
-    if (target.endsWith('.scss') || target.endsWith('.css')) {
+    // No variation for links that ends with .css suffix
+    if (target.endsWith('.css')) {
         return [target];
     }
     // If a link is like a/, try resolving a/index.scss and a/_index.scss
     if (target.endsWith('/')) {
         return [target + 'index.scss', target + '_index.scss'];
     }
-    const targetUri = URI.parse(target);
+    const targetUri = URI.parse(target.replace(/\.scss$/, ''));
     const basename = Utils.basename(targetUri);
     const dirname = Utils.dirname(targetUri);
     if (basename.startsWith('_')) {

package/lib/esm/services/selectorPrinting.js

@@ -6,6 +6,7 @@
 import * as nodes from '../parser/cssNodes';
 import { Scanner } from '../parser/cssScanner';
 import * as l10n from '@vscode/l10n';
+import { Parser } from '../parser/cssParser';
 export class Element {
     constructor() {
         this.parent = null;
@@ -402,10 +403,9 @@ export class SelectorPrinting {
                             specificity.tag += mostSpecificListItem.tag;
                             continue elementLoop;
                         }
-                        if (text.match(/^:(?:nth-child|nth-last-child|host|host-context)/i) && childElements.length > 0) {
+                        if (text.match(/^:(?:host|host-context)/i) && childElements.length > 0) {
                             // The specificity of :host() is that of a pseudo-class, plus the specificity of its argument.
                             // The specificity of :host-context() is that of a pseudo-class, plus the specificity of its argument.
-                            // The specificity of an :nth-child() or :nth-last-child() selector is the specificity of the pseudo class itself (counting as one pseudo-class selector) plus the specificity of the most specific complex selector in its selector list argument.
                             specificity.attr++;
                             let mostSpecificListItem = calculateMostSpecificListItem(childElements);
                             specificity.id += mostSpecificListItem.id;
@@ -413,6 +413,42 @@ export class SelectorPrinting {
                             specificity.tag += mostSpecificListItem.tag;
                             continue elementLoop;
                         }
+                        if (text.match(/^:(?:nth-child|nth-last-child)/i) && childElements.length > 0) {
+                            /* The specificity of the :nth-child(An+B [of S]?) pseudo-class is the specificity of a single pseudo-class plus, if S is specified, the specificity of the most specific complex selector in S */
+                            // https://www.w3.org/TR/selectors-4/#the-nth-child-pseudo
+                            specificity.attr++;
+                            // 23 = Binary Expression. 
+                            if (childElements.length === 3 && childElements[1].type === 23) {
+                                let mostSpecificListItem = calculateMostSpecificListItem(childElements[2].getChildren());
+                                specificity.id += mostSpecificListItem.id;
+                                specificity.attr += mostSpecificListItem.attr;
+                                specificity.tag += mostSpecificListItem.tag;
+                                continue elementLoop;
+                            }
+                            // Edge case: 'n' without integer prefix A, with B integer non-existent, is not regarded as a binary expression token.
+                            const parser = new Parser();
+                            const pseudoSelectorText = childElements[1].getText();
+                            parser.scanner.setSource(pseudoSelectorText);
+                            const firstToken = parser.scanner.scan();
+                            const secondToken = parser.scanner.scan();
+                            if (firstToken.text === 'n' || firstToken.text === '-n' && secondToken.text === 'of') {
+                                const complexSelectorListNodes = [];
+                                const complexSelectorText = pseudoSelectorText.slice(secondToken.offset + 2);
+                                const complexSelectorArray = complexSelectorText.split(',');
+                                for (const selector of complexSelectorArray) {
+                                    const node = parser.internalParse(selector, parser._parseSelector);
+                                    if (node) {
+                                        complexSelectorListNodes.push(node);
+                                    }
+                                }
+                                let mostSpecificListItem = calculateMostSpecificListItem(complexSelectorListNodes);
+                                specificity.id += mostSpecificListItem.id;
+                                specificity.attr += mostSpecificListItem.attr;
+                                specificity.tag += mostSpecificListItem.tag;
+                                continue elementLoop;
+                            }
+                            continue elementLoop;
+                        }
                         specificity.attr++; //pseudo class
                         continue elementLoop;
                 }

package/lib/umd/beautify/beautify-css.js

@@ -1,5 +1,5 @@
 // copied from js-beautify/js/lib/beautify-css.js
-// version: 1.14.9
+// version: 1.14.11
 /* AUTO-GENERATED. DO NOT MODIFY. */
 /*
 
@@ -1283,13 +1283,11 @@ Beautifier.prototype.beautify = function() {
 
       if (variable.match(/[ :]$/)) {
         // we have a variable or pseudo-class, add it and insert one space before continuing
-        variable = this.eatString(": ").replace(/\s$/, '');
+        variable = this.eatString(": ").replace(/\s+$/, '');
         this.print_string(variable);
         this._output.space_before_token = true;
       }
 
-      variable = variable.replace(/\s$/, '');
-
       // might be sass variable
       if (parenLevel === 0 && variable.indexOf(':') !== -1) {
         insidePropertyValue = true;
@@ -1309,13 +1307,11 @@ Beautifier.prototype.beautify = function() {
 
         if (variableOrRule.match(/[ :]$/)) {
           // we have a variable or pseudo-class, add it and insert one space before continuing
-          variableOrRule = this.eatString(": ").replace(/\s$/, '');
+          variableOrRule = this.eatString(": ").replace(/\s+$/, '');
           this.print_string(variableOrRule);
           this._output.space_before_token = true;
         }
 
-        variableOrRule = variableOrRule.replace(/\s$/, '');
-
         // might be less variable
         if (parenLevel === 0 && variableOrRule.indexOf(':') !== -1) {
           insidePropertyValue = true;

package/lib/umd/cssLanguageService.js

@@ -60,6 +60,7 @@ var __exportStar = (this && this.__exportStar) || function(m, exports) {
                 validation.configure(settings);
                 completion.configure(settings?.completion);
                 hover.configure(settings?.hover);
+                navigation.configure(settings?.importAliases);
             },
             setDataProviders: cssDataManager.setDataProviders.bind(cssDataManager),
             doValidation: validation.doValidation.bind(validation),

package/lib/umd/cssLanguageTypes.d.ts

@@ -13,6 +13,10 @@ export interface LanguageSettings {
     lint?: LintSettings;
     completion?: CompletionSettings;
     hover?: HoverSettings;
+    importAliases?: AliasSettings;
+}
+export interface AliasSettings {
+    [key: string]: string;
 }
 export interface HoverSettings {
     documentation?: boolean;

package/lib/umd/parser/cssNodes.js

@@ -13,7 +13,7 @@
      *--------------------------------------------------------------------------------------------*/
     'use strict';
     Object.defineProperty(exports, "__esModule", { value: true });
-    exports.ParseErrorCollector = exports.Marker = exports.Level = exports.Module = exports.GuardCondition = exports.LessGuard = exports.ListEntry = exports.UnknownAtRule = exports.MixinDeclaration = exports.MixinReference = exports.MixinContentDeclaration = exports.MixinContentReference = exports.ExtendsReference = exports.Variable = exports.Interpolation = exports.VariableDeclaration = exports.NumericValue = exports.RatioValue = exports.HexColorValue = exports.Operator = exports.AttributeSelector = exports.Term = exports.BinaryExpression = exports.Expression = exports.PageBoxMarginBox = exports.Page = exports.SupportsCondition = exports.MediaFeature = exports.MediaCondition = exports.MediaQuery = exports.Medialist = exports.Document = exports.PropertyAtRule = exports.Layer = exports.Supports = exports.Media = exports.Namespace = exports.ForwardVisibility = exports.Forward = exports.ModuleConfiguration = exports.Use = exports.Import = exports.KeyframeSelector = exports.Keyframe = exports.NestedProperties = exports.FontFace = exports.ViewPort = exports.FunctionDeclaration = exports.ElseStatement = exports.WhileStatement = exports.EachStatement = exports.ForStatement = exports.IfStatement = exports.FunctionArgument = exports.FunctionParameter = exports.Function = exports.Invocation = exports.Property = exports.CustomPropertyDeclaration = exports.Declaration = exports.CustomPropertySet = exports.AbstractDeclaration = exports.AtApplyRule = exports.SimpleSelector = exports.Selector = exports.RuleSet = exports.BodyDeclaration = exports.Declarations = exports.Stylesheet = exports.Identifier = exports.UnicodeRange = exports.Nodelist = exports.Node = exports.getParentDeclaration = exports.getNodePath = exports.getNodeAtOffset = exports.ReferenceType = exports.NodeType = void 0;
+    exports.ParseErrorCollector = exports.Marker = exports.Level = exports.Module = exports.GuardCondition = exports.LessGuard = exports.ListEntry = exports.UnknownAtRule = exports.MixinDeclaration = exports.MixinReference = exports.MixinContentDeclaration = exports.MixinContentReference = exports.ExtendsReference = exports.Variable = exports.Interpolation = exports.VariableDeclaration = exports.NumericValue = exports.RatioValue = exports.HexColorValue = exports.Operator = exports.AttributeSelector = exports.Term = exports.BinaryExpression = exports.Expression = exports.PageBoxMarginBox = exports.Page = exports.SupportsCondition = exports.MediaFeature = exports.MediaCondition = exports.MediaQuery = exports.Medialist = exports.Container = exports.Document = exports.PropertyAtRule = exports.Layer = exports.Supports = exports.Media = exports.Namespace = exports.ForwardVisibility = exports.Forward = exports.ModuleConfiguration = exports.Use = exports.Import = exports.KeyframeSelector = exports.Keyframe = exports.NestedProperties = exports.FontFace = exports.ViewPort = exports.FunctionDeclaration = exports.ElseStatement = exports.WhileStatement = exports.EachStatement = exports.ForStatement = exports.IfStatement = exports.FunctionArgument = exports.FunctionParameter = exports.Function = exports.Invocation = exports.Property = exports.CustomPropertyDeclaration = exports.Declaration = exports.CustomPropertySet = exports.AbstractDeclaration = exports.AtApplyRule = exports.SimpleSelector = exports.Selector = exports.RuleSet = exports.BodyDeclaration = exports.Declarations = exports.Stylesheet = exports.Identifier = exports.UnicodeRange = exports.Nodelist = exports.Node = exports.getParentDeclaration = exports.getNodePath = exports.getNodeAtOffset = exports.ReferenceType = exports.NodeType = void 0;
     const strings_1 = require("../utils/strings");
     /// <summary>
     /// Nodes for the css 2.1 specification. See for reference:
@@ -108,6 +108,7 @@
         NodeType[NodeType["LayerNameList"] = 84] = "LayerNameList";
         NodeType[NodeType["LayerName"] = 85] = "LayerName";
         NodeType[NodeType["PropertyAtRule"] = 86] = "PropertyAtRule";
+        NodeType[NodeType["Container"] = 87] = "Container";
     })(NodeType || (exports.NodeType = NodeType = {}));
     var ReferenceType;
     (function (ReferenceType) {
@@ -978,6 +979,15 @@
         }
     }
     exports.Document = Document;
+    class Container extends BodyDeclaration {
+        constructor(offset, length) {
+            super(offset, length);
+        }
+        get type() {
+            return NodeType.Container;
+        }
+    }
+    exports.Container = Container;
     class Medialist extends Node {
         constructor(offset, length) {
             super(offset, length);

package/lib/umd/parser/cssParser.js

@@ -287,6 +287,7 @@
                 || this._parseViewPort()
                 || this._parseNamespace()
                 || this._parseDocument()
+                || this._parseContainer()
                 || this._parseUnknownAtRule();
         }
         _tryParseRuleset(isNested) {
@@ -626,6 +627,9 @@
             if (!node.addChild(this._parseURILiteral()) && !node.addChild(this._parseStringLiteral())) {
                 return this.finish(node, cssErrors_1.ParseError.URIOrStringExpected);
             }
+            return this._completeParseImport(node);
+        }
+        _completeParseImport(node) {
             if (this.acceptIdent('layer')) {
                 if (this.accept(cssScanner_1.TokenType.ParenthesisL)) {
                     if (!node.addChild(this._parseLayerName())) {
@@ -822,11 +826,10 @@
         }
         _parseLayerName() {
             // <layer-name> = <ident> [ '.' <ident> ]*
-            if (!this.peek(cssScanner_1.TokenType.Ident)) {
+            const node = this.createNode(nodes.NodeType.LayerName);
+            if (!node.addChild(this._parseIdent())) {
                 return null;
             }
-            const node = this.createNode(nodes.NodeType.LayerName);
-            node.addChild(this._parseIdent());
             while (!this.hasWhitespace() && this.acceptDelim('.')) {
                 if (this.hasWhitespace() || !node.addChild(this._parseIdent())) {
                     return this.finish(node, cssErrors_1.ParseError.IdentifierExpected);
@@ -1145,6 +1148,111 @@
             this.resync([], [cssScanner_1.TokenType.CurlyL]); // ignore all the rules
             return this._parseBody(node, this._parseStylesheetStatement.bind(this));
         }
+        _parseContainer() {
+            if (!this.peekKeyword('@container')) {
+                return null;
+            }
+            const node = this.create(nodes.Container);
+            this.consumeToken(); // @container
+            node.addChild(this._parseIdent()); // optional container name
+            node.addChild(this._parseContainerQuery());
+            return this._parseBody(node, this._parseStylesheetStatement.bind(this));
+        }
+        _parseContainerQuery() {
+            // <container-query>     = not <query-in-parens>
+            //                         | <query-in-parens> [ [ and <query-in-parens> ]* | [ or <query-in-parens> ]* ]
+            const node = this.create(nodes.Node);
+            if (this.acceptIdent('not')) {
+                node.addChild(this._parseContainerQueryInParens());
+            }
+            else {
+                node.addChild(this._parseContainerQueryInParens());
+                if (this.peekIdent('and')) {
+                    while (this.acceptIdent('and')) {
+                        node.addChild(this._parseContainerQueryInParens());
+                    }
+                }
+                else if (this.peekIdent('or')) {
+                    while (this.acceptIdent('or')) {
+                        node.addChild(this._parseContainerQueryInParens());
+                    }
+                }
+            }
+            return this.finish(node);
+        }
+        _parseContainerQueryInParens() {
+            // <query-in-parens>     = ( <container-query> )
+            // 					  | ( <size-feature> )
+            // 					  | style( <style-query> )
+            // 					  | <general-enclosed>
+            const node = this.create(nodes.Node);
+            if (this.accept(cssScanner_1.TokenType.ParenthesisL)) {
+                if (this.peekIdent('not') || this.peek(cssScanner_1.TokenType.ParenthesisL)) {
+                    node.addChild(this._parseContainerQuery());
+                }
+                else {
+                    node.addChild(this._parseMediaFeature());
+                }
+                if (!this.accept(cssScanner_1.TokenType.ParenthesisR)) {
+                    return this.finish(node, cssErrors_1.ParseError.RightParenthesisExpected, [], [cssScanner_1.TokenType.CurlyL]);
+                }
+            }
+            else if (this.acceptIdent('style')) {
+                if (this.hasWhitespace() || !this.accept(cssScanner_1.TokenType.ParenthesisL)) {
+                    return this.finish(node, cssErrors_1.ParseError.LeftParenthesisExpected, [], [cssScanner_1.TokenType.CurlyL]);
+                }
+                node.addChild(this._parseStyleQuery());
+                if (!this.accept(cssScanner_1.TokenType.ParenthesisR)) {
+                    return this.finish(node, cssErrors_1.ParseError.RightParenthesisExpected, [], [cssScanner_1.TokenType.CurlyL]);
+                }
+            }
+            else {
+                return this.finish(node, cssErrors_1.ParseError.LeftParenthesisExpected, [], [cssScanner_1.TokenType.CurlyL]);
+            }
+            return this.finish(node);
+        }
+        _parseStyleQuery() {
+            // <style-query>         = not <style-in-parens>
+            // 					  | <style-in-parens> [ [ and <style-in-parens> ]* | [ or <style-in-parens> ]* ]
+            // 					  | <style-feature>
+            // <style-in-parens>     = ( <style-query> )
+            // 					  | ( <style-feature> )
+            // 					  | <general-enclosed>
+            const node = this.create(nodes.Node);
+            if (this.acceptIdent('not')) {
+                node.addChild(this._parseStyleInParens());
+            }
+            else if (this.peek(cssScanner_1.TokenType.ParenthesisL)) {
+                node.addChild(this._parseStyleInParens());
+                if (this.peekIdent('and')) {
+                    while (this.acceptIdent('and')) {
+                        node.addChild(this._parseStyleInParens());
+                    }
+                }
+                else if (this.peekIdent('or')) {
+                    while (this.acceptIdent('or')) {
+                        node.addChild(this._parseStyleInParens());
+                    }
+                }
+            }
+            else {
+                node.addChild(this._parseDeclaration([cssScanner_1.TokenType.ParenthesisR]));
+            }
+            return this.finish(node);
+        }
+        _parseStyleInParens() {
+            const node = this.create(nodes.Node);
+            if (this.accept(cssScanner_1.TokenType.ParenthesisL)) {
+                node.addChild(this._parseStyleQuery());
+                if (!this.accept(cssScanner_1.TokenType.ParenthesisR)) {
+                    return this.finish(node, cssErrors_1.ParseError.RightParenthesisExpected, [], [cssScanner_1.TokenType.CurlyL]);
+                }
+            }
+            else {
+                return this.finish(node, cssErrors_1.ParseError.LeftParenthesisExpected, [], [cssScanner_1.TokenType.CurlyL]);
+            }
+            return this.finish(node);
+        }
         // https://www.w3.org/TR/css-syntax-3/#consume-an-at-rule
         _parseUnknownAtRule() {
             if (!this.peek(cssScanner_1.TokenType.AtKeyword)) {
@@ -1573,6 +1681,7 @@
                 this.peek(cssScanner_1.TokenType.Angle) ||
                 this.peek(cssScanner_1.TokenType.Time) ||
                 this.peek(cssScanner_1.TokenType.Dimension) ||
+                this.peek(cssScanner_1.TokenType.ContainerQueryLength) ||
                 this.peek(cssScanner_1.TokenType.Freq)) {
                 const node = this.create(nodes.NumericValue);
                 this.consumeToken();

package/lib/umd/parser/cssScanner.js

@@ -58,7 +58,8 @@
         TokenType[TokenType["Comment"] = 39] = "Comment";
         TokenType[TokenType["SingleLineComment"] = 40] = "SingleLineComment";
         TokenType[TokenType["EOF"] = 41] = "EOF";
-        TokenType[TokenType["CustomToken"] = 42] = "CustomToken";
+        TokenType[TokenType["ContainerQueryLength"] = 42] = "ContainerQueryLength";
+        TokenType[TokenType["CustomToken"] = 43] = "CustomToken"; // must be last token type
     })(TokenType || (exports.TokenType = TokenType = {}));
     class MultiLineStream {
         constructor(source) {
@@ -196,6 +197,12 @@
     staticUnitTable['fr'] = TokenType.Percentage;
     staticUnitTable['dpi'] = TokenType.Resolution;
     staticUnitTable['dpcm'] = TokenType.Resolution;
+    staticUnitTable['cqw'] = TokenType.ContainerQueryLength;
+    staticUnitTable['cqh'] = TokenType.ContainerQueryLength;
+    staticUnitTable['cqi'] = TokenType.ContainerQueryLength;
+    staticUnitTable['cqb'] = TokenType.ContainerQueryLength;
+    staticUnitTable['cqmin'] = TokenType.ContainerQueryLength;
+    staticUnitTable['cqmax'] = TokenType.ContainerQueryLength;
     class Scanner {
         constructor() {
             this.stream = new MultiLineStream('');

package/lib/umd/parser/lessParser.js

@@ -64,7 +64,7 @@
             if (!this.peek(cssScanner_1.TokenType.SemiColon) && !this.peek(cssScanner_1.TokenType.EOF)) {
                 node.setMedialist(this._parseMediaQueryList());
             }
-            return this.finish(node);
+            return this._completeParseImport(node);
         }
         _parsePlugin() {
             if (!this.peekKeyword('@plugin')) {

package/lib/umd/parser/scssParser.js

@@ -57,10 +57,7 @@
                     return this.finish(node, cssErrors_1.ParseError.URIOrStringExpected);
                 }
             }
-            if (!this.peek(cssScanner_1.TokenType.SemiColon) && !this.peek(cssScanner_1.TokenType.EOF)) {
-                node.setMedialist(this._parseMediaQueryList());
-            }
-            return this.finish(node);
+            return this._completeParseImport(node);
         }
         // scss variables: $font-size: 12px;
         _parseVariableDeclaration(panic = []) {
@@ -112,6 +109,9 @@
         _parseKeyframeSelector() {
             return this._tryParseKeyframeSelector()
                 || this._parseControlStatement(this._parseKeyframeSelector.bind(this))
+                || this._parseWarnAndDebug() // @warn, @debug and @error statements
+                || this._parseMixinReference() // @include
+                || this._parseFunctionDeclaration() // @function
                 || this._parseVariableDeclaration()
                 || this._parseMixinContent();
         }

package/lib/umd/services/cssNavigation.js

@@ -28,6 +28,9 @@
             this.fileSystemProvider = fileSystemProvider;
             this.resolveModuleReferences = resolveModuleReferences;
         }
+        configure(settings) {
+            this.defaultSettings = settings;
+        }
         findDefinition(document, position, stylesheet) {
             const symbols = new cssSymbolScope_1.Symbols(stylesheet);
             const offset = document.offsetAt(position);
@@ -345,7 +348,7 @@
         async mapReference(target, isRawLink) {
             return target;
         }
-        async resolveReference(target, documentUri, documentContext, isRawLink = false) {
+        async resolveReference(target, documentUri, documentContext, isRawLink = false, settings = this.defaultSettings) {
             // Following [css-loader](https://github.com/webpack-contrib/css-loader#url)
             // and [sass-loader's](https://github.com/webpack-contrib/sass-loader#imports)
             // convention, if an import path starts with ~ then use node module resolution
@@ -368,6 +371,24 @@
                     return moduleReference;
                 }
             }
+            // Try resolving the reference from the language configuration alias settings
+            if (ref && !(await this.fileExists(ref))) {
+                const rootFolderUri = documentContext.resolveReference('/', documentUri);
+                if (settings && rootFolderUri) {
+                    // Specific file reference
+                    if (target in settings) {
+                        return this.mapReference((0, resources_1.joinPath)(rootFolderUri, settings[target]), isRawLink);
+                    }
+                    // Reference folder
+                    const firstSlash = target.indexOf('/');
+                    const prefix = `${target.substring(0, firstSlash)}/`;
+                    if (prefix in settings) {
+                        const aliasPath = (settings[prefix]).slice(0, -1);
+                        let newPath = (0, resources_1.joinPath)(rootFolderUri, aliasPath);
+                        return this.mapReference(newPath = (0, resources_1.joinPath)(newPath, target.substring(prefix.length - 1)), isRawLink);
+                    }
+                }
+            }
             // fall back. it might not exists
             return ref;
         }

package/lib/umd/services/scssNavigation.js

@@ -47,15 +47,15 @@
     }
     exports.SCSSNavigation = SCSSNavigation;
     function toPathVariations(target) {
-        // No variation for links that ends with suffix
-        if (target.endsWith('.scss') || target.endsWith('.css')) {
+        // No variation for links that ends with .css suffix
+        if (target.endsWith('.css')) {
             return [target];
         }
         // If a link is like a/, try resolving a/index.scss and a/_index.scss
         if (target.endsWith('/')) {
             return [target + 'index.scss', target + '_index.scss'];
         }
-        const targetUri = vscode_uri_1.URI.parse(target);
+        const targetUri = vscode_uri_1.URI.parse(target.replace(/\.scss$/, ''));
         const basename = vscode_uri_1.Utils.basename(targetUri);
         const dirname = vscode_uri_1.Utils.dirname(targetUri);
         if (basename.startsWith('_')) {

package/lib/umd/services/selectorPrinting.js

@@ -4,7 +4,7 @@
         if (v !== undefined) module.exports = v;
     }
     else if (typeof define === "function" && define.amd) {
-        define(["require", "exports", "../parser/cssNodes", "../parser/cssScanner", "@vscode/l10n"], factory);
+        define(["require", "exports", "../parser/cssNodes", "../parser/cssScanner", "@vscode/l10n", "../parser/cssParser"], factory);
     }
 })(function (require, exports) {
     /*---------------------------------------------------------------------------------------------
@@ -17,6 +17,7 @@
     const nodes = require("../parser/cssNodes");
     const cssScanner_1 = require("../parser/cssScanner");
     const l10n = require("@vscode/l10n");
+    const cssParser_1 = require("../parser/cssParser");
     class Element {
         constructor() {
             this.parent = null;
@@ -417,10 +418,9 @@
                                 specificity.tag += mostSpecificListItem.tag;
                                 continue elementLoop;
                             }
-                            if (text.match(/^:(?:nth-child|nth-last-child|host|host-context)/i) && childElements.length > 0) {
+                            if (text.match(/^:(?:host|host-context)/i) && childElements.length > 0) {
                                 // The specificity of :host() is that of a pseudo-class, plus the specificity of its argument.
                                 // The specificity of :host-context() is that of a pseudo-class, plus the specificity of its argument.
-                                // The specificity of an :nth-child() or :nth-last-child() selector is the specificity of the pseudo class itself (counting as one pseudo-class selector) plus the specificity of the most specific complex selector in its selector list argument.
                                 specificity.attr++;
                                 let mostSpecificListItem = calculateMostSpecificListItem(childElements);
                                 specificity.id += mostSpecificListItem.id;
@@ -428,6 +428,42 @@
                                 specificity.tag += mostSpecificListItem.tag;
                                 continue elementLoop;
                             }
+                            if (text.match(/^:(?:nth-child|nth-last-child)/i) && childElements.length > 0) {
+                                /* The specificity of the :nth-child(An+B [of S]?) pseudo-class is the specificity of a single pseudo-class plus, if S is specified, the specificity of the most specific complex selector in S */
+                                // https://www.w3.org/TR/selectors-4/#the-nth-child-pseudo
+                                specificity.attr++;
+                                // 23 = Binary Expression. 
+                                if (childElements.length === 3 && childElements[1].type === 23) {
+                                    let mostSpecificListItem = calculateMostSpecificListItem(childElements[2].getChildren());
+                                    specificity.id += mostSpecificListItem.id;
+                                    specificity.attr += mostSpecificListItem.attr;
+                                    specificity.tag += mostSpecificListItem.tag;
+                                    continue elementLoop;
+                                }
+                                // Edge case: 'n' without integer prefix A, with B integer non-existent, is not regarded as a binary expression token.
+                                const parser = new cssParser_1.Parser();
+                                const pseudoSelectorText = childElements[1].getText();
+                                parser.scanner.setSource(pseudoSelectorText);
+                                const firstToken = parser.scanner.scan();
+                                const secondToken = parser.scanner.scan();
+                                if (firstToken.text === 'n' || firstToken.text === '-n' && secondToken.text === 'of') {
+                                    const complexSelectorListNodes = [];
+                                    const complexSelectorText = pseudoSelectorText.slice(secondToken.offset + 2);
+                                    const complexSelectorArray = complexSelectorText.split(',');
+                                    for (const selector of complexSelectorArray) {
+                                        const node = parser.internalParse(selector, parser._parseSelector);
+                                        if (node) {
+                                            complexSelectorListNodes.push(node);
+                                        }
+                                    }
+                                    let mostSpecificListItem = calculateMostSpecificListItem(complexSelectorListNodes);
+                                    specificity.id += mostSpecificListItem.id;
+                                    specificity.attr += mostSpecificListItem.attr;
+                                    specificity.tag += mostSpecificListItem.tag;
+                                    continue elementLoop;
+                                }
+                                continue elementLoop;
+                            }
                             specificity.attr++; //pseudo class
                             continue elementLoop;
                     }

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "vscode-css-languageservice",
-  "version": "6.2.9",
+  "version": "6.2.11",
   "description": "Language service for CSS, LESS and SCSS",
   "main": "./lib/umd/cssLanguageService.js",
   "typings": "./lib/umd/cssLanguageService",
@@ -15,23 +15,23 @@
     "url": "https://github.com/Microsoft/vscode-css-languageservice"
   },
   "devDependencies": {
-    "@types/mocha": "^10.0.1",
+    "@types/mocha": "^10.0.6",
     "@types/node": "16.x",
-    "@typescript-eslint/eslint-plugin": "^6.7.3",
-    "@typescript-eslint/parser": "^6.7.3",
+    "@typescript-eslint/eslint-plugin": "^6.13.0",
+    "@typescript-eslint/parser": "^6.13.0",
     "@vscode/web-custom-data": "^0.4.8",
-    "eslint": "^8.50.0",
-    "js-beautify": "^1.14.9",
+    "eslint": "^8.54.0",
+    "js-beautify": "^1.14.11",
     "mocha": "^10.2.0",
-    "rimraf": "^5.0.1",
+    "rimraf": "^5.0.5",
     "source-map-support": "^0.5.21",
     "typescript": "^5.2.2"
   },
   "dependencies": {
     "@vscode/l10n": "^0.0.16",
-    "vscode-languageserver-textdocument": "^1.0.8",
-    "vscode-languageserver-types": "3.17.3",
-    "vscode-uri": "^3.0.7"
+    "vscode-languageserver-textdocument": "^1.0.11",
+    "vscode-languageserver-types": "3.17.5",
+    "vscode-uri": "^3.0.8"
   },
   "scripts": {
     "prepack": "npm run clean && npm run compile-esm && npm run test && npm run remove-sourcemap-refs",
@@ -44,10 +44,10 @@
     "mocha": "mocha --require source-map-support/register",
     "coverage": "npm run compile && npx nyc --reporter=html --reporter=text  mocha",
     "lint": "eslint src/**/*.ts",
-    "update-data": "yarn add @vscode/web-custom-data -D && node ./build/generateData.js",
-    "install-types-next": "yarn add vscode-languageserver-types@next -f -S && yarn add vscode-languageserver-textdocument@next -f -S",
+    "update-data": "npm install @vscode/web-custom-data -D && node ./build/generateData.js",
+    "install-types-next": "npm install vscode-languageserver-types@next -f -S && npm install vscode-languageserver-textdocument@next -f -S",
     "copy-jsbeautify": "node ./build/copy-jsbeautify.js",
-    "update-jsbeautify": "yarn add js-beautify && node ./build/update-jsbeautify.js",
-    "update-jsbeautify-next": "yarn add js-beautify@next && node ./build/update-jsbeautify.js"
+    "update-jsbeautify": "npm install js-beautify && node ./build/update-jsbeautify.js",
+    "update-jsbeautify-next": "npm install js-beautify@next && node ./build/update-jsbeautify.js"
   }
 }

package/thirdpartynotices.txt

@@ -1,29 +0,0 @@
-THIRD-PARTY SOFTWARE NOTICES AND INFORMATION
-
-vscode-css-languageservice incorporates third party material from the projects listed below. The original copyright
-notice and the license under which Microsoft received such third party material are set forth below. Microsoft
-reserves all other rights not expressly granted, whether by implication, estoppel or otherwise. 
- 
-1. JS Beautifier (https://github.com/beautify-web/js-beautify)
-
-The MIT License (MIT)
-
-Copyright (c) 2007-2018 Einar Lielmanis, Liam Newman, and contributors.
-
-Permission is hereby granted, free of charge, to any person obtaining a copy
-of this software and associated documentation files (the "Software"), to deal
-in the Software without restriction, including without limitation the rights
-to use, copy, modify, merge, publish, distribute, sublicense, and/or sell
-copies of the Software, and to permit persons to whom the Software is
-furnished to do so, subject to the following conditions:
-
-The above copyright notice and this permission notice shall be included in
-all copies or substantial portions of the Software.
-
-THE SOFTWARE IS PROVIDED "AS IS", WITHOUT WARRANTY OF ANY KIND, EXPRESS OR
-IMPLIED, INCLUDING BUT NOT LIMITED TO THE WARRANTIES OF MERCHANTABILITY,
-FITNESS FOR A PARTICULAR PURPOSE AND NONINFRINGEMENT. IN NO EVENT SHALL THE
-AUTHORS OR COPYRIGHT HOLDERS BE LIABLE FOR ANY CLAIM, DAMAGES OR OTHER
-LIABILITY, WHETHER IN AN ACTION OF CONTRACT, TORT OR OTHERWISE, ARISING FROM,
-OUT OF OR IN CONNECTION WITH THE SOFTWARE OR THE USE OR OTHER DEALINGS IN
-THE SOFTWARE.