postcss-nesting - npm Package Compare versions

Comparing version 11.2.1 to 11.2.2

CHANGELOG.md

 # Changes to PostCSS Nesting
 
+### 11.2.2 (March 25, 2023)
+
+- Improved: support for mixins
+
 ### 11.2.1 (February 16, 2023)
@@ -4,0 +8,0 @@

package.json

 {
 	"name": "postcss-nesting",
 	"description": "Nest rules inside each other in CSS",
-	"version": "11.2.1",
+	"version": "11.2.2",
 	"contributors": [
@@ -55,16 +55,12 @@ {
 	"devDependencies": {
+		"@csstools/postcss-tape": "*",
 		"puppeteer": "^19.5.2"
 	},
 	"scripts": {
-		"prebuild": "npm run clean",
 		"build": "rollup -c ../../rollup/default.mjs",
-		"clean": "node -e \"fs.rmSync('./dist', { recursive: true, force: true }); fs.mkdirSync('./dist');\"",
 		"docs": "node ../../.github/bin/generate-docs/install.mjs && node ../../.github/bin/generate-docs/readme.mjs",
-		"lint": "npm run lint:eslint && npm run lint:package-json",
-		"lint:eslint": "eslint ./src --ext .js --ext .ts --ext .mjs --no-error-on-unmatched-pattern",
-		"lint:package-json": "node ../../.github/bin/format-package-json.mjs",
-		"prepublishOnly": "npm run clean && npm run build && npm run test",
-		"test": "node .tape.mjs && npm run test:exports",
+		"lint": "node ../../.github/bin/format-package-json.mjs",
+		"prepublishOnly": "npm run build && npm run test",
+		"test": "node .tape.mjs && node ./test/_import.mjs && node ./test/_require.cjs",
 		"test:browser": "node ./test/_browser.mjs",
-		"test:exports": "node ./test/_import.mjs && node ./test/_require.cjs",
 		"test:rewrite-expects": "REWRITE_EXPECTS=true node .tape.mjs"
@@ -71,0 +67,0 @@ },

README.md

@@ -84,3 +84,33 @@ # PostCSS Nesting [<img src="https://postcss.github.io/postcss/logo.svg" alt="PostCSS Logo" width="90" height="90" align="right">][PostCSS]
 
+## ⚠️ Nested selectors must start with a symbol
 
+The current version of the [CSS Nesting specification](https://www.w3.org/TR/2023/WD-css-nesting-1-20230214/#example-34e8e94f) disallows nested selectors to start with a letter (i.e. a tag name or element selector). To write such selectors, they need to be prefixed with `& ` or wrapped with `:is()`.
+
+You will get a warning when selectors start with a letter:
+> Nested selectors must start with a symbol and "span" begins with a letter.
+
+```pcss
+.foo {
+	/* ❌ invalid */
+	span {
+		color: hotpink;
+	}
+
+	/* ✅ valid */
+	& span {
+		color: hotpink;
+	}
+
+	/* ❌ invalid */
+	span & {
+		color: hotpink;
+	}
+
+	/* ✅ valid */
+	:is(span) & {
+		color: hotpink;
+	}
+}	
+```
+
 ## Options
@@ -87,0 +117,0 @@

No alert changes

Improved metrics

Total package byte prevSize

43767

increased by1.06%

Number of lines in readme file

226

increased by15.31%

Worsened metrics

Dev dependency count

2

increased by100%

No dependency changes