position-area-property (#1731)

Author: romainmenke

.github/ISSUE_TEMPLATE/css-issue.yml

@@ -119,6 +119,7 @@ body:
         - PostCSS Overflow Shorthand
         - PostCSS Page Break
         - PostCSS Place
+        - PostCSS Position Area Property
         - PostCSS Progressive Custom Properties
         - PostCSS Pseudo Class Any Link
         - PostCSS Random Function

.github/ISSUE_TEMPLATE/plugin-issue.yml

@@ -116,6 +116,7 @@ body:
         - PostCSS Overflow Shorthand
         - PostCSS Page Break
         - PostCSS Place
+        - PostCSS Position Area Property
         - PostCSS Progressive Custom Properties
         - PostCSS Pseudo Class Any Link
         - PostCSS Random Function

.github/labeler.yml

@@ -395,6 +395,12 @@
       - plugins/postcss-place/**
       - experimental/postcss-place/**
 
+"plugins/postcss-position-area-property":
+  - changed-files:
+    - any-glob-to-any-file:
+      - plugins/postcss-position-area-property/**
+      - experimental/postcss-position-area-property/**
+
 "plugins/postcss-progressive-custom-properties":
   - changed-files:
     - any-glob-to-any-file:

package-lock.json

@@ -93,7 +93,7 @@
 		"css-blank-pseudo": "^7.0.1",
 		"css-has-pseudo": "^7.0.3",
 		"css-prefers-color-scheme": "^10.0.0",
-		"cssdb": "^8.4.2",
+		"cssdb": "^8.5.1",
 		"postcss-attribute-case-insensitive": "^7.0.1",
 		"postcss-clamp": "^4.1.0",
 		"postcss-color-functional-notation": "^7.0.12",

plugin-packs/postcss-preset-env/dist/index.cjs

@@ -6,6 +6,39 @@ export function getUnsupportedBrowsersByFeature(feature) {
 		return [];
 	}
 
+	if (feature.id === 'position-area-property') {
+		// https://developer.mozilla.org/en-US/docs/Web/CSS/Reference/Properties/position-area#browser_compatibility
+		// this can't be expressed in CSSDB
+		return [
+			'chrome 125',
+			'chrome 126',
+			'chrome 127',
+			'chrome 128',
+			'edge 125',
+			'edge 126',
+			'edge 127',
+			'edge 128',
+			'and_chr 125',
+			'and_chr 126',
+			'and_chr 127',
+			'and_chr 128',
+			'android 125',
+			'android 126',
+			'android 127',
+			'android 128',
+
+			'samsung 27',
+
+			'opera 111',
+			'opera 112',
+			'opera 113',
+			'opera 114',
+			'op_mob 83',
+			'op_mob 84',
+			'op_mob 85',
+		];
+	}
+
 	if (!('browser_support' in feature)) {
 		// the feature does not work in any browser (yet)
 		return [ '> 0%' ];

plugin-packs/postcss-preset-env/dist/index.mjs

@@ -47,6 +47,7 @@ export default [
 	'overflow-property',
 	'overflow-wrap-property',
 	'place-properties',
+	'position-area-property',
 	'system-ui-font-family',
 	'font-format-keywords',
 	'display-two-values',

plugin-packs/postcss-preset-env/package.json

@@ -44,6 +44,18 @@ postcssTape(plugin)({
 			browsers: 'chrome >= 38',
 		},
 	},
+	'basic:ch126': {
+		message: 'supports { browsers: "chrome >= 126" } usage',
+		options: {
+			browsers: 'chrome >= 126',
+		},
+	},
+	'basic:ch130': {
+		message: 'supports { browsers: "chrome >= 130" } usage',
+		options: {
+			browsers: 'chrome >= 130',
+		},
+	},
 	'basic:ie10': {
 		message: 'supports { browsers: "ie >= 10" } usage',
 		options: {