feat: latest should include all latest modules

Author: mdevils

src/parser.ts

@@ -91,22 +91,22 @@ export function createParser(
         syntaxDefinition = extendSyntaxDefinition(cssSyntaxDefinitions[syntaxDefinition.baseSyntax], syntaxDefinition);
     }
 
-    // Apply additional modules if specified from options
-    if (modules && modules.length > 0) {
-        for (const module of modules) {
+    // Apply modules from syntax definition
+    if (syntaxDefinition.modules && syntaxDefinition.modules.length > 0) {
+        for (const module of syntaxDefinition.modules) {
             const moduleSyntax = cssModules[module];
             if (moduleSyntax) {
-                syntaxDefinition = extendSyntaxDefinition(syntaxDefinition, moduleSyntax);
+                syntaxDefinition = extendSyntaxDefinition(moduleSyntax, syntaxDefinition);
             }
         }
     }
-    
-    // Apply modules from syntax definition
-    if (syntaxDefinition.modules && syntaxDefinition.modules.length > 0) {
-        for (const module of syntaxDefinition.modules) {
+
+    // Apply additional modules if specified from options
+    if (modules && modules.length > 0) {
+        for (const module of modules) {
             const moduleSyntax = cssModules[module];
             if (moduleSyntax) {
-                syntaxDefinition = extendSyntaxDefinition(syntaxDefinition, moduleSyntax);
+                syntaxDefinition = extendSyntaxDefinition(moduleSyntax, syntaxDefinition);
             }
         }
     }

src/syntax-definitions.ts

@@ -405,38 +405,9 @@ const selectors4SyntaxDefinition = extendSyntaxDefinition(selectors3SyntaxDefini
             NoArgument: ['marker'],
             Selector: ['part']
         }
-    },
-    // Include all the latest modules
-    modules: [
-        'css-position-4',
-        'css-scoping-1',
-        'css-pseudo-4',
-        'css-shadow-parts-1'
-    ]
-});
-
-const progressiveSyntaxDefinition = extendSyntaxDefinition(selectors4SyntaxDefinition, {
-    pseudoElements: {
-        unknown: 'accept'
-    },
-    pseudoClasses: {
-        unknown: 'accept'
-    },
-    attributes: {
-        unknownCaseSensitivityModifiers: 'accept'
     }
 });
 
-export const cssSyntaxDefinitions: Record<CssLevel, SyntaxDefinition> = {
-    css1: css1SyntaxDefinition,
-    css2: css2SyntaxDefinition,
-    css3: selectors3SyntaxDefinition,
-    'selectors-3': selectors3SyntaxDefinition,
-    'selectors-4': selectors4SyntaxDefinition,
-    latest: selectors4SyntaxDefinition,
-    progressive: progressiveSyntaxDefinition
-};
-
 /**
  * CSS Modules with their syntax definitions.
  * These can be used to extend the parser with specific CSS modules.
@@ -447,20 +418,23 @@ export const cssSyntaxDefinitions: Record<CssLevel, SyntaxDefinition> = {
  */
 export const cssModules = {
     'css-position-1': {
+        latest: false,
         pseudoClasses: {
             definitions: {
                 NoArgument: ['static', 'relative', 'absolute']
             }
         }
     },
     'css-position-2': {
+        latest: false,
         pseudoClasses: {
             definitions: {
                 NoArgument: ['static', 'relative', 'absolute', 'fixed']
             }
         }
     },
     'css-position-3': {
+        latest: false,
         pseudoClasses: {
             definitions: {
                 NoArgument: ['sticky', 'fixed', 'absolute', 'relative', 'static']
@@ -519,11 +493,40 @@ export const cssModules = {
             }
         }
     }
-} satisfies Record<string, SyntaxDefinition & {latest?: true}>;
+} satisfies Record<string, SyntaxDefinition & {latest?: boolean}>;
 
 /**
  * CSS Module name.
  * @example 'css-position-3'
  * @example 'css-scoping-1'
  */
 export type CssModule = keyof typeof cssModules;
+
+const latestSyntaxDefinition = {
+    ...selectors4SyntaxDefinition,
+    modules: (Object.entries(cssModules) as [CssModule, SyntaxDefinition & {latest?: boolean}][])
+        .filter(([, {latest}]) => latest)
+        .map(([name]) => name)
+};
+
+const progressiveSyntaxDefinition = extendSyntaxDefinition(latestSyntaxDefinition, {
+    pseudoElements: {
+        unknown: 'accept'
+    },
+    pseudoClasses: {
+        unknown: 'accept'
+    },
+    attributes: {
+        unknownCaseSensitivityModifiers: 'accept'
+    }
+});
+
+export const cssSyntaxDefinitions: Record<CssLevel, SyntaxDefinition> = {
+    css1: css1SyntaxDefinition,
+    css2: css2SyntaxDefinition,
+    css3: selectors3SyntaxDefinition,
+    'selectors-3': selectors3SyntaxDefinition,
+    'selectors-4': selectors4SyntaxDefinition,
+    latest: latestSyntaxDefinition,
+    progressive: progressiveSyntaxDefinition
+};

test/modules.test.ts

@@ -600,11 +600,12 @@ describe('CSS Modules', () => {
             );
         });
     });
-    
+
     describe('Syntax definition with modules', () => {
         it('should support modules defined in syntax definition', () => {
             const parse = createParser({
                 syntax: {
+                    baseSyntax: 'selectors-3',
                     pseudoClasses: {
                         unknown: 'reject'
                     },
@@ -614,7 +615,7 @@ describe('CSS Modules', () => {
                     modules: ['css-position-4', 'css-shadow-parts-1']
                 }
             });
-            
+
             // Should parse position-4 pseudo-classes
             expect(parse(':initial')).toEqual(
                 ast.selector({
@@ -625,7 +626,7 @@ describe('CSS Modules', () => {
                     ]
                 })
             );
-            
+
             // Should parse shadow-parts-1 pseudo-elements
             expect(parse('::part(button)')).toEqual(
                 ast.selector({
@@ -647,16 +648,16 @@ describe('CSS Modules', () => {
                     ]
                 })
             );
-            
+
             // Should reject pseudo-classes not in the modules
             expect(() => parse(':focus-visible')).toThrow('Unknown pseudo-class: "focus-visible".');
         });
-        
+
         it('should support latest syntax with all latest modules', () => {
             const parse = createParser({
                 syntax: 'latest'
             });
-            
+
             // Should parse position-4 pseudo-classes
             expect(parse(':initial')).toEqual(
                 ast.selector({
@@ -667,7 +668,7 @@ describe('CSS Modules', () => {
                     ]
                 })
             );
-            
+
             // Should parse shadow-parts-1 pseudo-elements
             expect(parse('::part(button)')).toEqual(
                 ast.selector({
@@ -689,7 +690,7 @@ describe('CSS Modules', () => {
                     ]
                 })
             );
-            
+
             // Should parse pseudo-4 pseudo-elements
             expect(parse('::marker')).toEqual(
                 ast.selector({
@@ -700,7 +701,7 @@ describe('CSS Modules', () => {
                     ]
                 })
             );
-            
+
             // Should parse scoping-1 pseudo-classes
             expect(parse(':host')).toEqual(
                 ast.selector({