@projectwallace/css-parser 0.11.4 → 0.12.1

package/README.md

@@ -7,7 +7,7 @@
 
 Built for speed and efficiency, this parser handles large CSS files with minimal memory overhead and blazing-fast parse times. Designed with a data-oriented architecture using a single contiguous memory arena for zero allocations during parsing.
 
-This parser was heavily influenced by [CSSTree](https://github.com/csstree/csstree), one of the most robust CSS parsers available. Some of the parsing mechanics are taken from CSSTree, as well as some of the performance mechanics, but a lot of things are very different which is why this isn't a direct fork.
+This parser was heavily influenced by [CSSTree](https://github.com/csstree/csstree), one of the most robust CSS parsers available. Some of the parsing mechanics are taken from CSSTree, as well as some of the performance mechanics, but a lot of things are very different which is why this isn't a direct fork and there is very little overlap in API's.
 
 ## Features
 
@@ -15,6 +15,7 @@ This parser was heavily influenced by [CSSTree](https://github.com/csstree/csstr
 - **Error recovery** - Continues parsing on malformed CSS
 - **Location tracking** - Line, column, offset, and length for all nodes
 - **Performance** - Low memory usage and excellent parsing speed
+- **Small bundle size** - Fast download and installation in any environment
 
 ## Installation
 

package/dist/index.d.ts

@@ -9,7 +9,7 @@ export { walk, traverse, SKIP, BREAK } from './walk';
 export { is_custom, is_vendor_prefixed, str_equals, str_starts_with, str_index_of } from './string-utils';
 export { type ParserOptions } from './parse';
 export { CSSNode, type CSSNodeType, TYPE_NAMES, type CloneOptions, type PlainCSSNode } from './css-node';
-export type { LexerPosition } from './tokenize';
+export type { LexerPosition, CommentInfo } from './tokenize';
 export { ATTR_OPERATOR_NONE, ATTR_OPERATOR_EQUAL, ATTR_OPERATOR_TILDE_EQUAL, ATTR_OPERATOR_PIPE_EQUAL, ATTR_OPERATOR_CARET_EQUAL, ATTR_OPERATOR_DOLLAR_EQUAL, ATTR_OPERATOR_STAR_EQUAL, ATTR_FLAG_NONE, ATTR_FLAG_CASE_INSENSITIVE, ATTR_FLAG_CASE_SENSITIVE, } from './arena';
 export * from './constants';
 export * from './token-types';

package/dist/parse-anplusb.js

@@ -13,7 +13,7 @@ class ANplusBParser {
   constructor(arena, source) {
     this.arena = arena;
     this.source = source;
-    this.lexer = new Lexer(source, true);
+    this.lexer = new Lexer(source);
     this.expr_end = 0;
   }
   /**

package/dist/parse-atrule-prelude.js

@@ -13,7 +13,7 @@ class AtRulePreludeParser {
   constructor(arena, source) {
     this.arena = arena;
     this.source = source;
-    this.lexer = new Lexer(source, false);
+    this.lexer = new Lexer(source);
     this.prelude_end = 0;
   }
   // Parse an at-rule prelude into nodes (standalone use)

package/dist/parse-declaration.js

@@ -17,7 +17,7 @@ class DeclarationParser {
   }
   // Parse a declaration range into a declaration node (standalone use)
   parse_declaration(start, end, line = 1, column = 1) {
-    const lexer = new Lexer(this.source, false);
+    const lexer = new Lexer(this.source);
     lexer.pos = start;
     lexer.line = line;
     lexer.column = column;

package/dist/parse-selector.js

@@ -1,8 +1,8 @@
 import { Lexer } from './tokenize.js';
 import { CSSDataArena, SELECTOR_LIST, SELECTOR, COMBINATOR, NESTING_SELECTOR, ID_SELECTOR, TYPE_SELECTOR, UNIVERSAL_SELECTOR, CLASS_SELECTOR, ATTRIBUTE_SELECTOR, ATTR_OPERATOR_NONE, ATTR_FLAG_NONE, ATTR_OPERATOR_EQUAL, ATTR_OPERATOR_TILDE_EQUAL, ATTR_OPERATOR_PIPE_EQUAL, ATTR_OPERATOR_CARET_EQUAL, ATTR_OPERATOR_DOLLAR_EQUAL, ATTR_OPERATOR_STAR_EQUAL, ATTR_FLAG_CASE_INSENSITIVE, ATTR_FLAG_CASE_SENSITIVE, PSEUDO_ELEMENT_SELECTOR, PSEUDO_CLASS_SELECTOR, FLAG_HAS_PARENS, LANG_SELECTOR, NTH_OF_SELECTOR } from './arena.js';
-import { TOKEN_COMMENT, TOKEN_COMMA, TOKEN_DELIM, TOKEN_EOF, TOKEN_WHITESPACE, TOKEN_FUNCTION, TOKEN_COLON, TOKEN_LEFT_BRACKET, TOKEN_HASH, TOKEN_IDENT, TOKEN_RIGHT_BRACKET, TOKEN_LEFT_PAREN, TOKEN_RIGHT_PAREN, TOKEN_STRING } from './token-types.js';
+import { TOKEN_COMMA, TOKEN_DELIM, TOKEN_EOF, TOKEN_WHITESPACE, TOKEN_FUNCTION, TOKEN_COLON, TOKEN_LEFT_BRACKET, TOKEN_HASH, TOKEN_IDENT, TOKEN_RIGHT_BRACKET, TOKEN_LEFT_PAREN, TOKEN_RIGHT_PAREN, TOKEN_STRING } from './token-types.js';
 import { skip_whitespace_and_comments_forward, skip_whitespace_and_comments_backward, skip_whitespace_forward } from './parse-utils.js';
-import { CHAR_GREATER_THAN, CHAR_PLUS, CHAR_TILDE, CHAR_PERIOD, CHAR_ASTERISK, CHAR_AMPERSAND, CHAR_PIPE, CHAR_SPACE, CHAR_TAB, CHAR_NEWLINE, CHAR_CARRIAGE_RETURN, CHAR_FORM_FEED, is_combinator, is_whitespace, CHAR_EQUALS, CHAR_CARET, CHAR_DOLLAR, CHAR_SINGLE_QUOTE, CHAR_DOUBLE_QUOTE, CHAR_COLON, str_equals } from './string-utils.js';
+import { CHAR_GREATER_THAN, CHAR_PLUS, CHAR_TILDE, CHAR_PERIOD, CHAR_ASTERISK, CHAR_AMPERSAND, CHAR_PIPE, is_combinator, is_whitespace, CHAR_EQUALS, CHAR_CARET, CHAR_DOLLAR, CHAR_SINGLE_QUOTE, CHAR_DOUBLE_QUOTE, CHAR_COLON, str_equals, CHAR_FORWARD_SLASH } from './string-utils.js';
 import { ANplusBParser } from './parse-anplusb.js';
 import { CSSNode } from './css-node.js';
 
@@ -14,7 +14,7 @@ class SelectorParser {
   constructor(arena, source) {
     this.arena = arena;
     this.source = source;
-    this.lexer = new Lexer(source, false);
+    this.lexer = new Lexer(source);
     this.selector_end = 0;
   }
   // Parse a selector range into selector nodes (standalone use)
@@ -38,7 +38,13 @@ class SelectorParser {
       let selector_column = this.lexer.column;
       let complex_selector = this.parse_complex_selector(allow_relative);
       if (complex_selector !== null) {
-        let selector_wrapper = this.arena.create_node(SELECTOR, selector_start, this.lexer.pos - selector_start, selector_line, selector_column);
+        let selector_wrapper = this.arena.create_node(
+          SELECTOR,
+          selector_start,
+          this.lexer.pos - selector_start,
+          selector_line,
+          selector_column
+        );
         this.arena.set_content_start_delta(selector_wrapper, 0);
         this.arena.set_content_length(selector_wrapper, this.lexer.pos - selector_start);
         let last_component = complex_selector;
@@ -52,29 +58,10 @@ class SelectorParser {
       }
       this.skip_whitespace();
       if (this.lexer.pos >= this.selector_end) break;
-      let token_type = TOKEN_EOF;
-      while (this.lexer.pos < this.selector_end) {
-        this.lexer.next_token_fast(false);
-        token_type = this.lexer.token_type;
-        if (token_type === TOKEN_COMMENT) {
-          this.skip_whitespace();
-        } else {
-          break;
-        }
-      }
+      this.lexer.next_token_fast(false);
+      let token_type = this.lexer.token_type;
       if (token_type === TOKEN_COMMA) {
         this.skip_whitespace();
-        while (this.lexer.pos < this.selector_end) {
-          const saved = this.lexer.save_position();
-          this.lexer.next_token_fast(false);
-          token_type = this.lexer.token_type;
-          if (token_type === TOKEN_COMMENT) {
-            this.skip_whitespace();
-          } else {
-            this.lexer.restore_position(saved);
-            break;
-          }
-        }
         continue;
       } else {
         break;
@@ -100,7 +87,13 @@ class SelectorParser {
       if (token_type === TOKEN_DELIM) {
         let ch = this.source.charCodeAt(this.lexer.token_start);
         if (ch === CHAR_GREATER_THAN || ch === CHAR_PLUS || ch === CHAR_TILDE) {
-          let combinator = this.create_node_at(COMBINATOR, this.lexer.token_start, this.lexer.token_end, this.lexer.token_line, this.lexer.token_column);
+          let combinator = this.create_node_at(
+            COMBINATOR,
+            this.lexer.token_start,
+            this.lexer.token_end,
+            this.lexer.token_line,
+            this.lexer.token_column
+          );
           components.push(combinator);
           this.skip_whitespace();
         } else {
@@ -258,16 +251,9 @@ class SelectorParser {
     let whitespace_start = this.lexer.pos;
     let whitespace_start_line = this.lexer.line;
     let whitespace_start_column = this.lexer.column;
-    let has_whitespace = false;
-    while (this.lexer.pos < this.selector_end) {
-      let ch = this.source.charCodeAt(this.lexer.pos);
-      if (ch === CHAR_SPACE || ch === CHAR_TAB || ch === CHAR_NEWLINE || ch === CHAR_CARRIAGE_RETURN || ch === CHAR_FORM_FEED) {
-        has_whitespace = true;
-        this.lexer.advance();
-      } else {
-        break;
-      }
-    }
+    let has_whitespace = this.lexer.pos < this.selector_end;
+    this.skip_whitespace();
+    has_whitespace = has_whitespace && this.lexer.pos > whitespace_start;
     if (this.lexer.pos >= this.selector_end) {
       this.lexer.pos = whitespace_start;
       this.lexer.line = whitespace_start_line;
@@ -285,14 +271,7 @@ class SelectorParser {
       this.lexer.pos = whitespace_start;
       this.lexer.line = whitespace_start_line;
       this.lexer.column = whitespace_start_column;
-      while (this.lexer.pos < this.selector_end) {
-        let ch = this.source.charCodeAt(this.lexer.pos);
-        if (ch === CHAR_SPACE || ch === CHAR_TAB || ch === CHAR_NEWLINE || ch === CHAR_CARRIAGE_RETURN || ch === CHAR_FORM_FEED) {
-          this.lexer.advance();
-        } else {
-          break;
-        }
-      }
+      this.skip_whitespace();
       return this.create_node_at(COMBINATOR, whitespace_start, this.lexer.pos, whitespace_start_line, whitespace_start_column);
     }
     this.lexer.pos = whitespace_start;
@@ -610,10 +589,26 @@ class SelectorParser {
     this.arena.set_content_length(node, end - start);
     return node;
   }
-  // Helper to skip whitespace and update line/column
+  // Helper to skip whitespace and comments, updating line/column
   skip_whitespace() {
-    while (this.lexer.pos < this.selector_end && is_whitespace(this.source.charCodeAt(this.lexer.pos))) {
-      this.lexer.advance();
+    while (this.lexer.pos < this.selector_end) {
+      let ch = this.source.charCodeAt(this.lexer.pos);
+      if (is_whitespace(ch)) {
+        this.lexer.advance();
+        continue;
+      }
+      if (ch === CHAR_FORWARD_SLASH && this.lexer.pos + 1 < this.selector_end && this.source.charCodeAt(this.lexer.pos + 1) === CHAR_ASTERISK) {
+        this.lexer.advance(2);
+        while (this.lexer.pos < this.selector_end) {
+          if (this.source.charCodeAt(this.lexer.pos) === CHAR_ASTERISK && this.lexer.pos + 1 < this.selector_end && this.source.charCodeAt(this.lexer.pos + 1) === CHAR_FORWARD_SLASH) {
+            this.lexer.advance(2);
+            break;
+          }
+          this.lexer.advance();
+        }
+        continue;
+      }
+      break;
     }
   }
 }

package/dist/parse-value.js

@@ -12,7 +12,7 @@ class ValueParser {
   constructor(arena, source) {
     this.arena = arena;
     this.source = source;
-    this.lexer = new Lexer(source, false);
+    this.lexer = new Lexer(source);
     this.value_end = 0;
   }
   // Parse a declaration value range into a VALUE wrapper node

package/dist/parse.d.ts

@@ -1,9 +1,10 @@
+import { type CommentInfo } from './tokenize';
 import { CSSNode } from './css-node';
 export interface ParserOptions {
-    skip_comments?: boolean;
     parse_values?: boolean;
     parse_selectors?: boolean;
     parse_atrule_preludes?: boolean;
+    on_comment?: (info: CommentInfo) => void;
 }
 /**
  * Parse CSS and return an AST

package/dist/parse.js

@@ -23,11 +23,10 @@ class Parser {
   constructor(source, options) {
     this.source = source;
     let opts = options || {};
-    let skip_comments = opts.skip_comments ?? true;
     this.parse_values_enabled = opts.parse_values ?? true;
     this.parse_selectors_enabled = opts.parse_selectors ?? true;
     this.parse_atrule_preludes_enabled = opts.parse_atrule_preludes ?? true;
-    this.lexer = new Lexer(source, skip_comments);
+    this.lexer = new Lexer(source, opts.on_comment);
     let capacity = CSSDataArena.capacity_for_source(source.length);
     this.arena = new CSSDataArena(capacity);
     this.selector_parser = this.parse_selectors_enabled ? new SelectorParser(this.arena, source) : null;

package/dist/tokenize.d.ts

@@ -9,10 +9,17 @@ export interface LexerPosition {
     token_line: number;
     token_column: number;
 }
+export interface CommentInfo {
+    start: number;
+    end: number;
+    length: number;
+    line: number;
+    column: number;
+}
 /**
  * Tokenize CSS source code
  * @param source - The CSS source code to tokenize
- * @param skip_comments - Whether to skip comment tokens (default: true)
+ * @param on_comment - Optional callback for comment tokens
  * @yields CSS tokens
  */
-export declare function tokenize(source: string, skip_comments?: boolean): Generator<Token, void, undefined>;
+export declare function tokenize(source: string, on_comment?: (info: CommentInfo) => void): Generator<Token, void, undefined>;

package/dist/tokenize.js

@@ -1,5 +1,5 @@
 import { char_types, CHAR_WHITESPACE, CHAR_NEWLINE, CHAR_DIGIT, is_ident_start, is_newline, is_hex_digit, is_whitespace, is_ident_char } from './char-types.js';
-import { TOKEN_EOF, TOKEN_RIGHT_PAREN, TOKEN_LEFT_PAREN, TOKEN_RIGHT_BRACKET, TOKEN_LEFT_BRACKET, TOKEN_COMMA, TOKEN_SEMICOLON, TOKEN_COLON, TOKEN_RIGHT_BRACE, TOKEN_LEFT_BRACE, TOKEN_CDO, TOKEN_CDC, TOKEN_DELIM, TOKEN_WHITESPACE, TOKEN_COMMENT, TOKEN_STRING, TOKEN_BAD_STRING, TOKEN_PERCENTAGE, TOKEN_DIMENSION, TOKEN_NUMBER, TOKEN_FUNCTION, TOKEN_IDENT, TOKEN_AT_KEYWORD, TOKEN_HASH } from './token-types.js';
+import { TOKEN_EOF, TOKEN_RIGHT_PAREN, TOKEN_LEFT_PAREN, TOKEN_RIGHT_BRACKET, TOKEN_LEFT_BRACKET, TOKEN_COMMA, TOKEN_SEMICOLON, TOKEN_COLON, TOKEN_RIGHT_BRACE, TOKEN_LEFT_BRACE, TOKEN_CDO, TOKEN_CDC, TOKEN_DELIM, TOKEN_WHITESPACE, TOKEN_STRING, TOKEN_BAD_STRING, TOKEN_PERCENTAGE, TOKEN_DIMENSION, TOKEN_NUMBER, TOKEN_FUNCTION, TOKEN_IDENT, TOKEN_AT_KEYWORD, TOKEN_HASH } from './token-types.js';
 
 const CHAR_LEFT_BRACE = 123;
 const CHAR_RIGHT_BRACE = 125;
@@ -33,19 +33,19 @@ class Lexer {
   pos;
   line;
   column;
-  skip_comments;
+  on_comment;
   // Current token properties (avoiding object allocation)
   token_type;
   token_start;
   token_end;
   token_line;
   token_column;
-  constructor(source, skip_comments = false) {
+  constructor(source, on_comment) {
     this.source = source;
     this.pos = 0;
     this.line = 1;
     this.column = 1;
-    this.skip_comments = skip_comments;
+    this.on_comment = on_comment;
     this.token_type = TOKEN_EOF;
     this.token_start = 0;
     this.token_end = 0;
@@ -101,19 +101,29 @@ class Lexer {
       return this.consume_whitespace(start_line, start_column);
     }
     if (ch === CHAR_FORWARD_SLASH && this.peek() === CHAR_ASTERISK) {
-      if (this.skip_comments) {
-        this.advance(2);
-        while (this.pos < this.source.length - 1) {
-          let ch2 = this.source.charCodeAt(this.pos);
-          if (ch2 === CHAR_ASTERISK && this.peek() === CHAR_FORWARD_SLASH) {
-            this.advance(2);
-            break;
-          }
-          this.advance();
+      let comment_start = start;
+      let comment_line = start_line;
+      let comment_column = start_column;
+      this.advance(2);
+      while (this.pos < this.source.length - 1) {
+        let ch2 = this.source.charCodeAt(this.pos);
+        if (ch2 === CHAR_ASTERISK && this.peek() === CHAR_FORWARD_SLASH) {
+          this.advance(2);
+          break;
         }
-        return this.next_token_fast(skip_whitespace);
+        this.advance();
+      }
+      let comment_end = this.pos;
+      if (this.on_comment) {
+        this.on_comment({
+          start: comment_start,
+          end: comment_end,
+          length: comment_end - comment_start,
+          line: comment_line,
+          column: comment_column
+        });
       }
-      return this.consume_comment(start_line, start_column);
+      return this.next_token_fast(skip_whitespace);
     }
     if (ch === CHAR_DOUBLE_QUOTE || ch === CHAR_SINGLE_QUOTE) {
       return this.consume_string(ch, start_line, start_column);
@@ -185,19 +195,6 @@ class Lexer {
     }
     return this.make_token(TOKEN_WHITESPACE, start, this.pos, start_line, start_column);
   }
-  consume_comment(start_line, start_column) {
-    let start = this.pos;
-    this.advance(2);
-    while (this.pos < this.source.length - 1) {
-      let ch = this.source.charCodeAt(this.pos);
-      if (ch === CHAR_ASTERISK && this.peek() === CHAR_FORWARD_SLASH) {
-        this.advance(2);
-        break;
-      }
-      this.advance();
-    }
-    return this.make_token(TOKEN_COMMENT, start, this.pos, start_line, start_column);
-  }
   consume_string(quote, start_line, start_column) {
     let start = this.pos;
     this.advance();
@@ -442,8 +439,8 @@ class Lexer {
     this.token_column = saved.token_column;
   }
 }
-function* tokenize(source, skip_comments = true) {
-  const lexer = new Lexer(source, skip_comments);
+function* tokenize(source, on_comment) {
+  const lexer = new Lexer(source, on_comment);
   while (true) {
     const token = lexer.next_token();
     if (!token || token.type === TOKEN_EOF) {

package/package.json

@@ -1,6 +1,6 @@
 {
 	"name": "@projectwallace/css-parser",
-	"version": "0.11.4",
+	"version": "0.12.1",
 	"description": "High-performance CSS lexer and parser, optimized for CSS inspection and analysis",
 	"author": "Bart Veneman <bart@projectwallace.com>",
 	"license": "MIT",