postcss 8.5.3 → 8.5.4

package/README.md

@@ -9,7 +9,7 @@ These plugins can lint your CSS, support variables and mixins,
 transpile future CSS syntax, inline images, and more.
 
 PostCSS is used by industry leaders including Wikipedia, Twitter, Alibaba,
-and JetBrains. The [Autoprefixer] and [Stylelint] PostCSS plugins is one of the most popular CSS tools.
+and JetBrains. The [Autoprefixer] and [Stylelint] PostCSS plugins are some of the most popular CSS tools.
 
 ---
 

package/lib/input.d.ts

@@ -18,6 +18,11 @@ declare namespace Input {
      */
     endLine?: number
 
+    /**
+     * Offset of exclusive end position in source file.
+     */
+    endOffset?: number
+
     /**
      * Absolute path to the source file.
      */
@@ -28,6 +33,11 @@ declare namespace Input {
      */
     line: number
 
+    /**
+     * Offset of inclusive start position in source file.
+     */
+    offset: number
+
     /**
      * Source code.
      */
@@ -131,6 +141,9 @@ declare class Input_ {
    */
   constructor(css: string, opts?: ProcessOptions)
 
+  /**
+   * Returns `CssSyntaxError` with information about the error and its position.
+   */
   error(
     message: string,
     start:
@@ -151,9 +164,6 @@ declare class Input_ {
         },
     opts?: { plugin?: CssSyntaxError['plugin'] }
   ): CssSyntaxError
-  /**
-   * Returns `CssSyntaxError` with information about the error and its position.
-   */
   error(
     message: string,
     line: number,
@@ -165,12 +175,23 @@ declare class Input_ {
     offset: number,
     opts?: { plugin?: CssSyntaxError['plugin'] }
   ): CssSyntaxError
+
+  /**
+   * Converts source line and column to offset.
+   *
+   * @param line   Source line.
+   * @param column Source column.
+   * @return Source offset.
+   */
+  fromLineAndColumn(line: number, column: number): number
+
   /**
    * Converts source offset to line and column.
    *
    * @param offset Source offset.
    */
   fromOffset(offset: number): { col: number; line: number } | null
+
   /**
    * Reads the input source map and returns a symbol position
    * in the input source (e.g., in a Sass file that was compiled

package/lib/input.js

@@ -9,11 +9,26 @@ let CssSyntaxError = require('./css-syntax-error')
 let PreviousMap = require('./previous-map')
 let terminalHighlight = require('./terminal-highlight')
 
-let fromOffsetCache = Symbol('fromOffsetCache')
+let lineToIndexCache = Symbol('lineToIndexCache')
 
 let sourceMapAvailable = Boolean(SourceMapConsumer && SourceMapGenerator)
 let pathAvailable = Boolean(resolve && isAbsolute)
 
+function getLineToIndex(input) {
+  if (input[lineToIndexCache]) return input[lineToIndexCache]
+  let lines = input.css.split('\n')
+  let lineToIndex = new Array(lines.length)
+  let prevIndex = 0
+
+  for (let i = 0, l = lines.length; i < l; i++) {
+    lineToIndex[i] = prevIndex
+    prevIndex += lines[i].length + 1
+  }
+
+  input[lineToIndexCache] = lineToIndex
+  return lineToIndex
+}
+
 class Input {
   get from() {
     return this.file || this.id
@@ -68,31 +83,38 @@ class Input {
   }
 
   error(message, line, column, opts = {}) {
-    let endColumn, endLine, result
+    let endColumn, endLine, endOffset, offset, result
 
     if (line && typeof line === 'object') {
       let start = line
       let end = column
       if (typeof start.offset === 'number') {
-        let pos = this.fromOffset(start.offset)
+        offset = start.offset
+        let pos = this.fromOffset(offset)
         line = pos.line
         column = pos.col
       } else {
         line = start.line
         column = start.column
+        offset = this.fromLineAndColumn(line, column)
       }
       if (typeof end.offset === 'number') {
-        let pos = this.fromOffset(end.offset)
+        endOffset = end.offset
+        let pos = this.fromOffset(endOffset)
         endLine = pos.line
         endColumn = pos.col
       } else {
         endLine = end.line
         endColumn = end.column
+        endOffset = this.fromLineAndColumn(end.line, end.column)
       }
     } else if (!column) {
-      let pos = this.fromOffset(line)
+      offset = line
+      let pos = this.fromOffset(offset)
       line = pos.line
       column = pos.col
+    } else {
+      offset = this.fromLineAndColumn(line, column)
     }
 
     let origin = this.origin(line, column, endLine, endColumn)
@@ -120,7 +142,7 @@ class Input {
       )
     }
 
-    result.input = { column, endColumn, endLine, line, source: this.css }
+    result.input = { column, endColumn, endLine, endOffset, line, offset, source: this.css }
     if (this.file) {
       if (pathToFileURL) {
         result.input.url = pathToFileURL(this.file).toString()
@@ -131,23 +153,15 @@ class Input {
     return result
   }
 
-  fromOffset(offset) {
-    let lastLine, lineToIndex
-    if (!this[fromOffsetCache]) {
-      let lines = this.css.split('\n')
-      lineToIndex = new Array(lines.length)
-      let prevIndex = 0
-
-      for (let i = 0, l = lines.length; i < l; i++) {
-        lineToIndex[i] = prevIndex
-        prevIndex += lines[i].length + 1
-      }
+  fromLineAndColumn(line, column) {
+    let lineToIndex = getLineToIndex(this)
+    let index = lineToIndex[line - 1]
+    return index + column - 1
+  }
 
-      this[fromOffsetCache] = lineToIndex
-    } else {
-      lineToIndex = this[fromOffsetCache]
-    }
-    lastLine = lineToIndex[lineToIndex.length - 1]
+  fromOffset(offset) {
+    let lineToIndex = getLineToIndex(this)
+    let lastLine = lineToIndex[lineToIndex.length - 1]
 
     let min = 0
     if (offset >= lastLine) {

package/lib/node.d.ts

@@ -1,5 +1,4 @@
 import AtRule = require('./at-rule.js')
-
 import { AtRuleProps } from './at-rule.js'
 import Comment, { CommentProps } from './comment.js'
 import Container, { NewChild } from './container.js'
@@ -66,6 +65,22 @@ declare namespace Node {
     /**
      * The inclusive ending position for the source
      * code of a node.
+     *
+     * However, `end.offset` of a non `Root` node is the exclusive position.
+     * See https://github.com/postcss/postcss/pull/1879 for details.
+     *
+     * ```js
+     * const root = postcss.parse('a { color: black }')
+     * const a = root.first
+     * const color = a.first
+     *
+     * // The offset of `Root` node is the inclusive position
+     * css.source.end   // { line: 1, column: 19, offset: 18 }
+     *
+     * // The offset of non `Root` node is the exclusive position
+     * a.source.end     // { line: 1, column: 18, offset: 18 }
+     * color.source.end // { line: 1, column: 16, offset: 16 }
+     * ```
      */
     end?: Position
 
@@ -424,7 +439,7 @@ declare abstract class Node_ {
    * @return Range.
    */
   rangeBy(
-    opts?: Pick<WarningOptions, 'endIndex' | 'index' | 'word'>
+    opts?: Pick<WarningOptions, 'end' | 'endIndex' | 'index' | 'start' | 'word'>
   ): Node.Range
 
   /**

package/lib/node.js

@@ -34,11 +34,8 @@ function cloneNode(obj, parent) {
 
 function sourceOffset(inputCSS, position) {
   // Not all custom syntaxes support `offset` in `source.start` and `source.end`
-  if (
-    position &&
-    typeof position.offset !== 'undefined'
-  ) {
-    return position.offset;
+  if (position && typeof position.offset !== 'undefined') {
+    return position.offset
   }
 
   let column = 1
@@ -208,14 +205,15 @@ class Node {
     return this.parent.nodes[index + 1]
   }
 
-  positionBy(opts) {
+  positionBy(opts = {}) {
     let pos = this.source.start
     if (opts.index) {
       pos = this.positionInside(opts.index)
     } else if (opts.word) {
-      let inputString = ('document' in this.source.input)
-        ? this.source.input.document
-        : this.source.input.css
+      let inputString =
+        'document' in this.source.input
+          ? this.source.input.document
+          : this.source.input.css
       let stringRepresentation = inputString.slice(
         sourceOffset(inputString, this.source.start),
         sourceOffset(inputString, this.source.end)
@@ -229,9 +227,10 @@ class Node {
   positionInside(index) {
     let column = this.source.start.column
     let line = this.source.start.line
-    let inputString = ('document' in this.source.input)
-      ? this.source.input.document
-      : this.source.input.css
+    let inputString =
+      'document' in this.source.input
+        ? this.source.input.document
+        : this.source.input.css
     let offset = sourceOffset(inputString, this.source.start)
     let end = offset + index
 
@@ -244,7 +243,7 @@ class Node {
       }
     }
 
-    return { column, line }
+    return { column, line, offset: end }
   }
 
   prev() {
@@ -253,25 +252,36 @@ class Node {
     return this.parent.nodes[index - 1]
   }
 
-  rangeBy(opts) {
+  rangeBy(opts = {}) {
+    let inputString =
+      'document' in this.source.input
+        ? this.source.input.document
+        : this.source.input.css
     let start = {
       column: this.source.start.column,
-      line: this.source.start.line
+      line: this.source.start.line,
+      offset: sourceOffset(inputString, this.source.start)
     }
     let end = this.source.end
       ? {
           column: this.source.end.column + 1,
-          line: this.source.end.line
+          line: this.source.end.line,
+          offset:
+            typeof this.source.end.offset === 'number'
+              ? // `source.end.offset` is exclusive, so we don't need to add 1
+                this.source.end.offset
+              : // Since line/column in this.source.end is inclusive,
+                // the `sourceOffset(... , this.source.end)` returns an inclusive offset.
+                // So, we add 1 to convert it to exclusive.
+                sourceOffset(inputString, this.source.end) + 1
         }
       : {
           column: start.column + 1,
-          line: start.line
+          line: start.line,
+          offset: start.offset + 1
         }
 
     if (opts.word) {
-      let inputString = ('document' in this.source.input)
-        ? this.source.input.document
-        : this.source.input.css
       let stringRepresentation = inputString.slice(
         sourceOffset(inputString, this.source.start),
         sourceOffset(inputString, this.source.end)
@@ -279,15 +289,14 @@ class Node {
       let index = stringRepresentation.indexOf(opts.word)
       if (index !== -1) {
         start = this.positionInside(index)
-        end = this.positionInside(
-          index + opts.word.length,
-        )
+        end = this.positionInside(index + opts.word.length)
       }
     } else {
       if (opts.start) {
         start = {
           column: opts.start.column,
-          line: opts.start.line
+          line: opts.start.line,
+          offset: sourceOffset(inputString, opts.start)
         }
       } else if (opts.index) {
         start = this.positionInside(opts.index)
@@ -296,7 +305,8 @@ class Node {
       if (opts.end) {
         end = {
           column: opts.end.column,
-          line: opts.end.line
+          line: opts.end.line,
+          offset: sourceOffset(inputString, opts.end)
         }
       } else if (typeof opts.endIndex === 'number') {
         end = this.positionInside(opts.endIndex)
@@ -309,7 +319,11 @@ class Node {
       end.line < start.line ||
       (end.line === start.line && end.column <= start.column)
     ) {
-      end = { column: start.column + 1, line: start.line }
+      end = {
+        column: start.column + 1,
+        line: start.line,
+        offset: start.offset + 1
+      }
     }
 
     return { end, start }
@@ -384,6 +398,7 @@ class Node {
       } else if (typeof value === 'object' && value.toJSON) {
         fixed[name] = value.toJSON(null, inputs)
       } else if (name === 'source') {
+        if (value == null) continue
         let inputId = inputs.get(value.input)
         if (inputId == null) {
           inputId = inputsNextIndex
@@ -423,7 +438,7 @@ class Node {
     return result
   }
 
-  warn(result, text, opts) {
+  warn(result, text, opts = {}) {
     let data = { node: this }
     for (let i in opts) data[i] = opts[i]
     return result.warn(text, data)

package/lib/processor.js

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

package/lib/result.js

@@ -12,7 +12,7 @@ class Result {
     this.messages = []
     this.root = root
     this.opts = opts
-    this.css = undefined
+    this.css = ''
     this.map = undefined
   }
 

package/lib/stringifier.d.ts

@@ -25,7 +25,7 @@ declare class Stringifier_ {
   comment(node: Comment): void
   decl(node: Declaration, semicolon?: boolean): void
   document(node: Document): void
-  raw(node: AnyNode, own: null | string, detect?: string): string
+  raw(node: AnyNode, own: null | string, detect?: string): boolean | string
   rawBeforeClose(root: Root): string | undefined
   rawBeforeComment(root: Root, node: Comment): string | undefined
   rawBeforeDecl(root: Root, node: Declaration): string | undefined
@@ -35,7 +35,7 @@ declare class Stringifier_ {
   rawEmptyBody(root: Root): string | undefined
   rawIndent(root: Root): string | undefined
   rawSemicolon(root: Root): boolean | undefined
-  rawValue(node: AnyNode, prop: string): string
+  rawValue(node: AnyNode, prop: string): number | string
   root(node: Root): void
   rule(node: Rule): void
   stringify(node: AnyNode, semicolon?: boolean): void

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "postcss",
-  "version": "8.5.3",
+  "version": "8.5.4",
   "description": "Tool for transforming styles with JS plugins",
   "engines": {
     "node": "^10 || ^12 || >=14"
@@ -74,7 +74,7 @@
     "url": "https://github.com/postcss/postcss/issues"
   },
   "dependencies": {
-    "nanoid": "^3.3.8",
+    "nanoid": "^3.3.11",
     "picocolors": "^1.1.1",
     "source-map-js": "^1.2.1"
   },