postcss 8.2.1 → 8.2.5

package/CHANGELOG.md

@@ -1,6 +1,21 @@
 # Change Log
 This project adheres to [Semantic Versioning](https://semver.org/).
 
+## 8.2.5
+* Fixed escaped characters handling in `list.split` (by Natalie Weizenbaum).
+
+## 8.2.4
+* Added plugin name to `postcss.plugin()` warning (by Tom Williams).
+* Fixed docs (by Bill Columbia).
+
+## 8.2.3
+* Fixed `JSON.stringify(Node[])` support (by Niklas Mischkulnig).
+
+## 8.2.2
+* Fixed CSS-in-JS support (by James Garbutt).
+* Fixed plugin types (by Ludovico Fischer).
+* Fixed `Result#warn()` types.
+
 ## 8.2.1
 * Fixed `Node#toJSON()` and `postcss.fromJSON()` (by Niklas Mischkulnig).
 

package/README.md

@@ -100,7 +100,8 @@ If you have any new ideas, [PostCSS plugin development] is really easy.
 * [`font-magician`] generates all the `@font-face` rules needed in CSS.
 * [`postcss-inline-svg`] allows you to inline SVG and customize its styles.
 * [`postcss-write-svg`] allows you to write simple SVG directly in your CSS.
-
+* [`webp-in-css`] to use WebP image format in CSS background.
+* [`avif-in-css`] to use AVIF image format in CSS background.
 
 ### Linters
 
@@ -136,6 +137,8 @@ If you have any new ideas, [PostCSS plugin development] is really easy.
 [`postcss-rtl`]:                https://github.com/vkalinichev/postcss-rtl
 [`postcss-use`]:                https://github.com/postcss/postcss-use
 [`css-modules`]:                https://github.com/css-modules/css-modules
+[`webp-in-css`]:                https://github.com/ai/webp-in-css
+[`avif-in-css`]:                https://github.com/nucliweb/avif-in-css
 [`colorguard`]:                 https://github.com/SlexAxton/css-colorguard
 [`stylelint`]:                  https://github.com/stylelint/stylelint
 [`stylefmt`]:                   https://github.com/morishitter/stylefmt
@@ -146,7 +149,6 @@ If you have any new ideas, [PostCSS plugin development] is really easy.
 [`short`]:                      https://github.com/jonathantneal/postcss-short
 [`lost`]:                       https://github.com/peterramsing/lost
 
-
 ## Syntaxes
 
 PostCSS can transform styles in any syntax, not just CSS.
@@ -414,7 +416,7 @@ fs.readFile('src/app.css', (err, css) => {
     .then(result => {
       fs.writeFile('dest/app.css', result.css, () => true)
       if ( result.map ) {
-        fs.writeFile('dest/app.css.map', result.map, () => true)
+        fs.writeFile('dest/app.css.map', result.map.toString(), () => true)
       }
     })
 })

package/lib/container.d.ts

@@ -91,8 +91,9 @@ export default abstract class Container extends Node {
    * @param callback Iterator receives each node and index.
    * @return Returns `false` if iteration was broke.
    */
-  each (callback: (node: ChildNode, index: number) => void): void
-  each (callback: (node: ChildNode, index: number) => false): false
+  each (
+    callback: (node: ChildNode, index: number) => false | void
+  ): false | undefined
 
   /**
    * Traverses the container’s descendant nodes, calling callback
@@ -113,8 +114,9 @@ export default abstract class Container extends Node {
    * @param callback Iterator receives each node and index.
    * @return  Returns `false` if iteration was broke.
    */
-  walk (callback: (node: ChildNode, index: number) => void): void
-  walk (callback: (node: ChildNode, index: number) => false): false
+  walk (
+    callback: (node: ChildNode, index: number) => false | void
+  ): false | undefined
 
   /**
    * Traverses the container’s descendant nodes, calling callback
@@ -147,14 +149,11 @@ export default abstract class Container extends Node {
    */
   walkDecls (
     propFilter: string | RegExp,
-    callback: (decl: Declaration, index: number) => void
-  ): void
-  walkDecls (callback: (decl: Declaration, index: number) => void): void
+    callback: (decl: Declaration, index: number) => false | void
+  ): false | undefined
   walkDecls (
-    propFilter: string | RegExp,
-    callback: (decl: Declaration, index: number) => false
-  ): false
-  walkDecls (callback: (decl: Declaration, index: number) => false): false
+    callback: (decl: Declaration, index: number) => false | void
+  ): false | undefined
 
   /**
    * Traverses the container’s descendant nodes, calling callback
@@ -180,14 +179,11 @@ export default abstract class Container extends Node {
    */
   walkRules (
     selectorFilter: string | RegExp,
-    callback: (atRule: Rule, index: number) => void
-  ): void
-  walkRules (callback: (atRule: Rule, index: number) => void): void
+    callback: (atRule: Rule, index: number) => false | void
+  ): false | undefined
   walkRules (
-    selectorFilter: string | RegExp,
-    callback: (atRule: Rule, index: number) => false
-  ): false
-  walkRules (callback: (atRule: Rule, index: number) => false): false
+    callback: (atRule: Rule, index: number) => false | void
+  ): false | undefined
 
   /**
    * Traverses the container’s descendant nodes, calling callback
@@ -220,14 +216,11 @@ export default abstract class Container extends Node {
    */
   walkAtRules (
     nameFilter: string | RegExp,
-    callback: (atRule: AtRule, index: number) => void
-  ): void
-  walkAtRules (callback: (atRule: AtRule, index: number) => void): void
+    callback: (atRule: AtRule, index: number) => false | void
+  ): false | undefined
   walkAtRules (
-    nameFilter: string | RegExp,
-    callback: (atRule: AtRule, index: number) => false
-  ): false
-  walkAtRules (callback: (atRule: AtRule, index: number) => false): false
+    callback: (atRule: AtRule, index: number) => false | void
+  ): false | undefined
 
   /**
    * Traverses the container’s descendant nodes, calling callback
@@ -246,10 +239,12 @@ export default abstract class Container extends Node {
    * @return Returns `false` if iteration was broke.
    */
 
-  walkComments (callback: (comment: Comment, indexed: number) => void): void
   walkComments (
-    callback: (comment: Comment, indexed: number) => boolean
-  ): boolean
+    callback: (comment: Comment, indexed: number) => false | void
+  ): false | undefined
+  walkComments (
+    callback: (comment: Comment, indexed: number) => false | void
+  ): false | undefined
 
   /**
    * Inserts new nodes to the end of the container.

package/lib/css-syntax-error.d.ts

@@ -1,4 +1,4 @@
-import Input, { FilePosition } from './input.js'
+import { FilePosition } from './input.js'
 
 /**
  * The CSS parser throws this error for broken CSS.

package/lib/fromJSON.js

@@ -9,6 +9,8 @@ let Root = require('./root')
 let Rule = require('./rule')
 
 function fromJSON (json, inputs) {
+  if (Array.isArray(json)) return json.map(n => fromJSON(n))
+
   let { inputs: ownInputs, ...defaults } = json
   if (ownInputs) {
     inputs = []

package/lib/list.js

@@ -11,12 +11,12 @@ let list = {
     let escape = false
 
     for (let letter of string) {
-      if (quote) {
-        if (escape) {
-          escape = false
-        } else if (letter === '\\') {
-          escape = true
-        } else if (letter === quote) {
+      if (escape) {
+        escape = false
+      } else if (letter === '\\') {
+        escape = true
+      } else if (quote) {
+        if (letter === quote) {
           quote = false
         }
       } else if (letter === '"' || letter === "'") {

package/lib/map-generator.js

@@ -213,26 +213,30 @@ class MapGenerator {
     let line = 1
     let column = 1
 
+    let noSource = '<no source>'
+    let mapping = {
+      source: '',
+      generated: { line: 0, column: 0 },
+      original: { line: 0, column: 0 }
+    }
+
     let lines, last
     this.stringify(this.root, (str, node, type) => {
       this.css += str
 
       if (node && type !== 'end') {
+        mapping.generated.line = line
+        mapping.generated.column = column - 1
         if (node.source && node.source.start) {
-          this.map.addMapping({
-            source: this.sourcePath(node),
-            generated: { line, column: column - 1 },
-            original: {
-              line: node.source.start.line,
-              column: node.source.start.column - 1
-            }
-          })
+          mapping.source = this.sourcePath(node)
+          mapping.original.line = node.source.start.line
+          mapping.original.column = node.source.start.column - 1
+          this.map.addMapping(mapping)
         } else {
-          this.map.addMapping({
-            source: '<no source>',
-            original: { line: 1, column: 0 },
-            generated: { line, column: column - 1 }
-          })
+          mapping.source = noSource
+          mapping.original.line = 1
+          mapping.original.column = 0
+          this.map.addMapping(mapping)
         }
       }
 
@@ -249,20 +253,19 @@ class MapGenerator {
         let p = node.parent || { raws: {} }
         if (node.type !== 'decl' || node !== p.last || p.raws.semicolon) {
           if (node.source && node.source.end) {
-            this.map.addMapping({
-              source: this.sourcePath(node),
-              generated: { line, column: column - 2 },
-              original: {
-                line: node.source.end.line,
-                column: node.source.end.column - 1
-              }
-            })
+            mapping.source = this.sourcePath(node)
+            mapping.original.line = node.source.end.line
+            mapping.original.column = node.source.end.column - 1
+            mapping.generated.line = line
+            mapping.generated.column = column - 2
+            this.map.addMapping(mapping)
           } else {
-            this.map.addMapping({
-              source: '<no source>',
-              original: { line: 1, column: 0 },
-              generated: { line, column: column - 1 }
-            })
+            mapping.source = noSource
+            mapping.original.line = 1
+            mapping.original.column = 0
+            mapping.generated.line = line
+            mapping.generated.column = column - 1
+            this.map.addMapping(mapping)
           }
         }
       }

package/lib/node.js

@@ -166,7 +166,7 @@ class Node {
     if (!keepBetween) delete this.raws.between
   }
 
-  toJSON (inputs) {
+  toJSON (_, inputs) {
     let fixed = {}
     let emitInputs = inputs == null
     inputs = inputs || new Map()
@@ -183,13 +183,13 @@ class Node {
       if (Array.isArray(value)) {
         fixed[name] = value.map(i => {
           if (typeof i === 'object' && i.toJSON) {
-            return i.toJSON(inputs)
+            return i.toJSON(null, inputs)
           } else {
             return i
           }
         })
       } else if (typeof value === 'object' && value.toJSON) {
-        fixed[name] = value.toJSON(inputs)
+        fixed[name] = value.toJSON(null, inputs)
       } else if (name === 'source') {
         let inputId = inputs.get(value.input)
         if (inputId == null) {

package/lib/postcss.d.ts

@@ -170,7 +170,7 @@ export interface Plugin extends Processors {
 }
 
 export interface PluginCreator<PluginOptions> {
-  (opts?: PluginOptions): Plugin
+  (opts?: PluginOptions): Plugin | Processor
   postcss: true
 }
 
@@ -214,6 +214,7 @@ export interface Stringifier {
 }
 
 export interface JSONHydrator {
+  (data: object[]): Node[]
   (data: object): Node
 }
 

package/lib/postcss.js

@@ -22,19 +22,21 @@ function postcss (...plugins) {
   if (plugins.length === 1 && Array.isArray(plugins[0])) {
     plugins = plugins[0]
   }
-  return new Processor(plugins, postcss)
+  return new Processor(plugins)
 }
 
 postcss.plugin = function plugin (name, initializer) {
   if (console && console.warn) {
     console.warn(
-      'postcss.plugin was deprecated. Migration guide:\n' +
+      name +
+        ': postcss.plugin was deprecated. Migration guide:\n' +
         'https://evilmartians.com/chronicles/postcss-8-plugin-migration'
     )
     if (process.env.LANG && process.env.LANG.startsWith('cn')) {
       // istanbul ignore next
       console.warn(
-        'postcss.plugin 被弃用. 迁移指南:\n' +
+        name +
+          ': 里面 postcss.plugin 被弃用. 迁移指南:\n' +
           'https://www.w3ctech.com/topic/2226'
       )
     }

package/lib/processor.js

@@ -5,7 +5,7 @@ let Root = require('./root')
 
 class Processor {
   constructor (plugins = []) {
-    this.version = '8.2.1'
+    this.version = '8.2.5'
     this.plugins = this.normalize(plugins)
   }
 

package/lib/result.d.ts

@@ -177,7 +177,7 @@ export default class Result {
    * @param opts Warning options.
    * @return Created warning.
    */
-  warn (message: string, options?: WarningOptions): void
+  warn (message: string, options?: WarningOptions): Warning
 
   /**
    * Returns warnings from plugins. Filters `Warning` instances

package/lib/root.d.ts

@@ -1,11 +1,6 @@
 import Container, { ContainerProps } from './container.js'
 import { ProcessOptions } from './postcss.js'
-import { ChildNode } from './node.js'
-import Declaration from './declaration.js'
-import Comment from './comment.js'
-import AtRule from './at-rule.js'
 import Result from './result.js'
-import Rule from './rule.js'
 
 interface RootRaws {
   /**

package/lib/stringifier.js

@@ -25,11 +25,19 @@ class Stringifier {
   }
 
   stringify (node, semicolon) {
+    /* istanbul ignore if */
+    if (!this[node.type]) {
+      throw new Error(
+        'Unknown AST node type ' +
+          node.type +
+          '. ' +
+          'Maybe you need to change PostCSS stringifier.'
+      )
+    }
     this[node.type](node, semicolon)
   }
 
   root (node) {
-    this.root = node
     this.body(node)
     if (node.raws.after) this.builder(node.raws.after)
   }

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "postcss",
-  "version": "8.2.1",
+  "version": "8.2.5",
   "description": "Tool for transforming styles with JS plugins",
   "engines": {
     "node": "^10 || ^12 || >=14"