docs

packages/css-syntax-patches-for-csstree/README.md

@@ -0,0 +1,36 @@
+# CSS Syntax Patches For CSSTree
+
+[<img alt="npm version" src="https://img.shields.io/npm/v/@csstools/css-syntax-patches-for-csstree.svg" height="20">][npm-url]
+[<img alt="Build Status" src="https://github.com/csstools/postcss-plugins/workflows/test/badge.svg" height="20">][cli-url]
+
+Path [csstree](https://github.com/csstree/csstree) syntax definitions with the latest data from CSS specifications.  
+
+## Usage
+
+```bash
+npm install @csstools/css-syntax-patches-for-csstree --save-dev
+```
+
+```js
+import { fork } from 'css-tree-3.0.0';
+import syntax_patches from '@csstools/css-syntax-patches-for-csstree' with { type: 'json' };
+
+const forkedLexer = fork({
+	atrules: syntax_patches.next.atrules,
+	properties: syntax_patches.next.properties,
+	types: syntax_patches.next.types,
+}).lexer;
+```
+
+## `next`
+
+CSS specifications are often still in flux and various parts might change or disappear altogether.  
+Specifications also contains parts that haven't been implemented yet in a browser.  
+Only CSS that is widely adopted can be expected to be stable.
+
+The `next` grouping contains a combination of what is currently valid in browsers and the progress in various specifications.
+
+_In the future more groupings might be added._
+
+[cli-url]: https://github.com/csstools/postcss-plugins/actions/workflows/test.yml?query=workflow/test
+[npm-url]: https://www.npmjs.com/package/@csstools/css-syntax-patches-for-csstree

packages/css-syntax-patches-for-csstree/dist/index.json

@@ -45,21 +45,11 @@
 					"font-display": "auto | block | swap | fallback | optional"
 				}
 			},
-			"font-palette-values": {
-				"descriptors": {
-					"override-colors": "[ <integer [0,∞]> <color> ]#"
-				}
-			},
 			"function": {
 				"descriptors": {
 					"result": "<declaration-value>?"
 				}
 			},
-			"page": {
-				"descriptors": {
-					"size": "<length [0,∞]>{1,2} | auto | [ <page-size> || [ portrait | landscape ] ]"
-				}
-			},
 			"view-transition": {
 				"descriptors": {
 					"navigation": "auto | none",
@@ -676,4 +666,4 @@
 			"xyz-params": "<xyz> [ <number> | <percentage> | none ]{3}"
 		}
 	}
-}
+}

packages/css-syntax-patches-for-csstree/tests/community.test.mjs

@@ -50,6 +50,7 @@ const css_files = await get_files('tests');
 const patches = JSON.parse(await fs.readFile(path.join('dist', 'index.json'), 'utf-8')).next;
 
 const forkedLexer = fork({
+	atrules: patches.atrules,
 	properties: patches.properties,
 	types: patches.types,
 }).lexer;
@@ -71,17 +72,6 @@ for (const css_file of css_files) {
 				continue;
 			}
 
-			if (
-				decl.parent?.type === 'atrule' &&
-				(
-					decl.parent.name === 'page' ||
-					decl.parent.name === 'font-face'
-				)
-			) {
-				// Remove this when adding support for descriptors.
-				continue;
-			}
-
 			if (
 				(
 					css_file.includes('bootstrap.') ||
@@ -112,7 +102,7 @@ for (const css_file of css_files) {
 				continue;
 			}
 
-			const { prop, value } = decl;
+			const { prop, value, parent } = decl;
 
 			const csstree_value_node = parse(value, { context: 'value' });
 			patch_relative_color_keywords(csstree_value_node);
@@ -121,11 +111,27 @@ for (const css_file of css_files) {
 				continue;
 			}
 
-			const result = forkedLexer.matchProperty(prop, csstree_value_node);
+			const nesting_supported_at_keywords = new Set([
+				'container',
+				'layer',
+				'media',
+				'scope',
+				'starting-style',
+				'supports',
+			]);
+
+			const result =
+				parent && parent.type === 'atrule' && !nesting_supported_at_keywords.has(parent.name.toLowerCase())
+					? forkedLexer.matchAtruleDescriptor(parent.name, prop, csstree_value_node)
+					: forkedLexer.matchProperty(prop, csstree_value_node);
 			if (!result.error) {
 				continue;
 			}
 
+			if (result.error.message.includes('Unknown at-rule descriptor')) {
+				continue;
+			}
+
 			await t.test(`(${path.basename(css_file) } - ${i}) ${decl}`, () => {
 				throw result.error;
 			});