postcss 8.4.49 → 8.5.10

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
@@ -63,6 +60,10 @@ function sourceOffset(inputCSS, position) {
 }
 
 class Node {
+  get proxyOf() {
+    return this
+  }
+
   constructor(defaults = {}) {
     this.raws = {}
     this[isClean] = false
@@ -204,14 +205,18 @@ 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 stringRepresentation = this.source.input.css.slice(
-        sourceOffset(this.source.input.css, this.source.start),
-        sourceOffset(this.source.input.css, this.source.end)
+      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)
       )
       let index = stringRepresentation.indexOf(opts.word)
       if (index !== -1) pos = this.positionInside(index)
@@ -222,11 +227,15 @@ class Node {
   positionInside(index) {
     let column = this.source.start.column
     let line = this.source.start.line
-    let offset = sourceOffset(this.source.input.css, this.source.start)
+    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
 
     for (let i = offset; i < end; i++) {
-      if (this.source.input.css[i] === '\n') {
+      if (inputString[i] === '\n') {
         column = 1
         line += 1
       } else {
@@ -234,7 +243,7 @@ class Node {
       }
     }
 
-    return { column, line }
+    return { column, line, offset: end }
   }
 
   prev() {
@@ -243,38 +252,51 @@ 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 stringRepresentation = this.source.input.css.slice(
-        sourceOffset(this.source.input.css, this.source.start),
-        sourceOffset(this.source.input.css, this.source.end)
+      let stringRepresentation = inputString.slice(
+        sourceOffset(inputString, this.source.start),
+        sourceOffset(inputString, this.source.end)
       )
       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)
@@ -283,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)
@@ -296,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 }
@@ -371,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
@@ -410,15 +438,11 @@ 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)
   }
-
-  get proxyOf() {
-    return this
-  }
 }
 
 module.exports = Node

package/lib/parse.d.ts

@@ -4,6 +4,6 @@ interface Parse extends Parser {
   default: Parse
 }
 
-declare const parse: Parse
+declare let parse: Parse
 
 export = parse

package/lib/parser.js

@@ -176,7 +176,7 @@ class Parser {
     node.source.end.offset++
 
     let text = token[1].slice(2, -2)
-    if (/^\s*$/.test(text)) {
+    if (!text.trim()) {
       node.text = ''
       node.raws.left = text
       node.raws.right = ''
@@ -347,6 +347,8 @@ class Parser {
       if (prev && prev.type === 'rule' && !prev.raws.ownSemicolon) {
         prev.raws.ownSemicolon = this.spaces
         this.spaces = ''
+        prev.source.end = this.getPosition(token[2])
+        prev.source.end.offset += prev.raws.ownSemicolon.length
       }
     }
   }
@@ -591,7 +593,7 @@ class Parser {
 
   unknownWord(tokens) {
     throw this.input.error(
-      'Unknown word',
+      'Unknown word ' + tokens[0][1],
       { offset: tokens[0][2] },
       { offset: tokens[0][2] + tokens[0][1].length }
     )

package/lib/postcss.d.mts

@@ -1,69 +1,66 @@
 export {
-  // postcss function / namespace
-  default,
-
-  // Value exports from postcss.mjs
-  stringify,
-  fromJSON,
-  // @ts-expect-error This value exists, but it’s untyped.
-  plugin,
-  parse,
-  list,
-  document,
-  comment,
-  atRule,
-  rule,
-  decl,
-  root,
-  CssSyntaxError,
-  Declaration,
-  Container,
-  Processor,
-  Document,
-  Comment,
-  Warning,
-  AtRule,
-  Result,
-  Input,
-  Rule,
-  Root,
-  Node,
-
   // Type-only exports
   AcceptedPlugin,
   AnyNode,
+  atRule,
+  AtRule,
   AtRuleProps,
   Builder,
   ChildNode,
   ChildProps,
+  comment,
+  Comment,
   CommentProps,
+  Container,
   ContainerProps,
+  CssSyntaxError,
+  decl,
+  Declaration,
   DeclarationProps,
+  // postcss function / namespace
+  default,
+  document,
+  Document,
   DocumentProps,
   FilePosition,
+  fromJSON,
   Helpers,
+  Input,
   JSONHydrator,
+  // This is a class, but it’s not re-exported. That’s why it’s exported as type-only here.
+  type LazyResult,
+  list,
   Message,
+  Node,
   NodeErrorOptions,
   NodeProps,
   OldPlugin,
+  parse,
   Parser,
+  // @ts-expect-error This value exists, but it’s untyped.
+  plugin,
   Plugin,
   PluginCreator,
   Position,
   Postcss,
   ProcessOptions,
+  Processor,
+  Result,
+  root,
+  Root,
   RootProps,
+  rule,
+  Rule,
   RuleProps,
   Source,
   SourceMap,
   SourceMapOptions,
   Stringifier,
+  // Value exports from postcss.mjs
+  stringify,
   Syntax,
   TransformCallback,
   Transformer,
-  WarningOptions,
-
-  // This is a class, but it’s not re-exported. That’s why it’s exported as type-only here.
-  type LazyResult
+  Warning,
+  WarningOptions
 } from './postcss.js'

package/lib/postcss.d.ts

@@ -229,7 +229,7 @@ declare namespace postcss {
   export interface Parser<RootNode = Document | Root> {
     (
       css: { toString(): string } | string,
-      opts?: Pick<ProcessOptions, 'from' | 'map'>
+      opts?: Pick<ProcessOptions, 'document' | 'from' | 'map'>
     ): RootNode
   }
 
@@ -315,6 +315,11 @@ declare namespace postcss {
   }
 
   export interface ProcessOptions<RootNode = Document | Root> {
+    /**
+     * Input file if it is not simple CSS file, but HTML with <style> or JS with CSS-in-JS blocks.
+     */
+    document?: string
+
     /**
      * The path of the CSS source file. You should always set `from`,
      * because it is used in source map generation and syntax error messages.
@@ -445,9 +450,7 @@ declare namespace postcss {
  * @param plugins PostCSS plugins.
  * @return Processor to process multiple CSS.
  */
-declare function postcss(
-  plugins?: readonly postcss.AcceptedPlugin[]
-): Processor
+declare function postcss(plugins?: readonly postcss.AcceptedPlugin[]): Processor
 declare function postcss(...plugins: postcss.AcceptedPlugin[]): Processor
 
 export = postcss

package/lib/previous-map.d.ts

@@ -3,7 +3,6 @@ import { SourceMapConsumer } from 'source-map-js'
 import { ProcessOptions } from './postcss.js'
 
 declare namespace PreviousMap {
-  // eslint-disable-next-line @typescript-eslint/no-use-before-define
   export { PreviousMap_ as default }
 }
 

package/lib/previous-map.js

@@ -51,7 +51,8 @@ class PreviousMap {
       return fromBase64(text.substr(baseUriMatch[0].length))
     }
 
-    let encoding = text.match(/data:application\/json;([^,]+),/)[1]
+    let encoding = text.slice('data:application/json;'.length)
+    encoding = encoding.slice(0, encoding.indexOf(','))
     throw new Error('Unsupported source map encoding ' + encoding)
   }
 

package/lib/processor.d.ts

@@ -12,7 +12,6 @@ import Result from './result.js'
 import Root from './root.js'
 
 declare namespace Processor {
-  // eslint-disable-next-line @typescript-eslint/no-use-before-define
   export { Processor_ as default }
 }
 

package/lib/processor.js

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

package/lib/result.d.ts

@@ -39,7 +39,6 @@ declare namespace Result {
     plugin?: string
   }
 
-  // eslint-disable-next-line @typescript-eslint/no-use-before-define
   export { Result_ as default }
 }
 
@@ -142,6 +141,16 @@ declare class Result_<RootNode = Document | Root> {
    */
   root: RootNode
 
+  /**
+   * An alias for the `Result#css` property.
+   * Use it with syntaxes that generate non-CSS output.
+   *
+   * ```js
+   * result.css === result.content
+   * ```
+   */
+  get content(): string
+
   /**
    * @param processor Processor used for this transformation.
    * @param root      Root node after all transformations.
@@ -188,16 +197,6 @@ declare class Result_<RootNode = Document | Root> {
    * @return Warnings from plugins.
    */
   warnings(): Warning[]
-
-  /**
-   * An alias for the `Result#css` property.
-   * Use it with syntaxes that generate non-CSS output.
-   *
-   * ```js
-   * result.css === result.content
-   * ```
-   */
-  get content(): string
 }
 
 declare class Result<RootNode = Document | Root> extends Result_<RootNode> {}

package/lib/result.js

@@ -3,12 +3,16 @@
 let Warning = require('./warning')
 
 class Result {
+  get content() {
+    return this.css
+  }
+
   constructor(processor, root, opts) {
     this.processor = processor
     this.messages = []
     this.root = root
     this.opts = opts
-    this.css = undefined
+    this.css = ''
     this.map = undefined
   }
 
@@ -32,10 +36,6 @@ class Result {
   warnings() {
     return this.messages.filter(i => i.type === 'warning')
   }
-
-  get content() {
-    return this.css
-  }
 }
 
 module.exports = Result

package/lib/root.d.ts

@@ -40,7 +40,6 @@ declare namespace Root {
     raws?: RootRaws
   }
 
-  // eslint-disable-next-line @typescript-eslint/no-use-before-define
   export { Root_ as default }
 }
 

package/lib/rule.d.ts

@@ -22,7 +22,7 @@ declare namespace Rule {
     between?: string
 
     /**
-     * Contains `true` if there is semicolon after rule.
+     * Contains the text of the semicolon after this rule.
      */
     ownSemicolon?: string
 
@@ -44,19 +44,19 @@ declare namespace Rule {
     /** Information used to generate byte-to-byte equal node string as it was in the origin input. */
     raws?: RuleRaws
   } & (
-      | {
-          /** Selector or selectors of the rule. */
-          selector: string
-          selectors?: never
-        }
-      | {
-          selector?: never
-          /** Selectors of the rule represented as an array of strings. */
-          selectors: readonly string[]
-        }
-    ) & ContainerProps
+    | {
+        /** Selector or selectors of the rule. */
+        selector: string
+        selectors?: never
+      }
+    | {
+        selector?: never
+        /** Selectors of the rule represented as an array of strings. */
+        selectors: readonly string[]
+      }
+  ) &
+    ContainerProps
 
-  // eslint-disable-next-line @typescript-eslint/no-use-before-define
   export { Rule_ as default }
 }
 
@@ -83,14 +83,6 @@ declare class Rule_ extends Container {
   parent: ContainerWithChildren | undefined
   raws: Rule.RuleRaws
   type: 'rule'
-  constructor(defaults?: Rule.RuleProps)
-
-  assign(overrides: object | Rule.RuleProps): this
-  clone(overrides?: Partial<Rule.RuleProps>): this
-
-  cloneAfter(overrides?: Partial<Rule.RuleProps>): this
-
-  cloneBefore(overrides?: Partial<Rule.RuleProps>): this
   /**
    * The rule’s full selector represented as a string.
    *
@@ -101,6 +93,7 @@ declare class Rule_ extends Container {
    * ```
    */
   get selector(): string
+
   set selector(value: string)
   /**
    * An array containing the rule’s individual selectors.
@@ -118,7 +111,14 @@ declare class Rule_ extends Container {
    * ```
    */
   get selectors(): string[]
+
   set selectors(values: string[])
+
+  constructor(defaults?: Rule.RuleProps)
+  assign(overrides: object | Rule.RuleProps): this
+  clone(overrides?: Partial<Rule.RuleProps>): this
+  cloneAfter(overrides?: Partial<Rule.RuleProps>): this
+  cloneBefore(overrides?: Partial<Rule.RuleProps>): this
 }
 
 declare class Rule extends Rule_ {}

package/lib/rule.js

@@ -4,12 +4,6 @@ let Container = require('./container')
 let list = require('./list')
 
 class Rule extends Container {
-  constructor(defaults) {
-    super(defaults)
-    this.type = 'rule'
-    if (!this.nodes) this.nodes = []
-  }
-
   get selectors() {
     return list.comma(this.selector)
   }
@@ -19,6 +13,12 @@ class Rule extends Container {
     let sep = match ? match[0] : ',' + this.raw('between', 'beforeOpen')
     this.selector = values.join(sep)
   }
+
+  constructor(defaults) {
+    super(defaults)
+    this.type = 'rule'
+    if (!this.nodes) this.nodes = []
+  }
 }
 
 module.exports = Rule

package/lib/stringifier.d.ts

@@ -11,7 +11,6 @@ import {
 } from './postcss.js'
 
 declare namespace Stringifier {
-  // eslint-disable-next-line @typescript-eslint/no-use-before-define
   export { Stringifier_ as default }
 }
 
@@ -25,7 +24,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 +34,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/lib/stringifier.js

@@ -1,5 +1,17 @@
 'use strict'
 
+// Escapes sequences that could break out of an HTML <style> context.
+// Uses CSS unicode escaping (\3c = '<') which is valid CSS and parsed
+// correctly by all compliant CSS consumers.
+const STYLE_TAG = /(<)(\/?style\b)/gi
+const COMMENT_OPEN = /(<)(!--)/g
+
+function escapeHTMLInCSS(str) {
+  if (typeof str !== 'string') return str
+  if (!str.includes('<')) return str
+  return str.replace(STYLE_TAG, '\\3c $2').replace(COMMENT_OPEN, '\\3c $2')
+}
+
 const DEFAULT_RAW = {
   after: '\n',
   beforeClose: '\n',
@@ -38,7 +50,7 @@ class Stringifier {
       this.block(node, name + params)
     } else {
       let end = (node.raws.between || '') + (semicolon ? ';' : '')
-      this.builder(name + params + end, node)
+      this.builder(escapeHTMLInCSS(name + params + end), node)
     }
   }
 
@@ -73,7 +85,7 @@ class Stringifier {
 
   block(node, start) {
     let between = this.raw(node, 'between', 'beforeOpen')
-    this.builder(start + between + '{', node, 'start')
+    this.builder(escapeHTMLInCSS(start + between) + '{', node, 'start')
 
     let after
     if (node.nodes && node.nodes.length) {
@@ -83,7 +95,7 @@ class Stringifier {
       after = this.raw(node, 'after', 'emptyBody')
     }
 
-    if (after) this.builder(after)
+    if (after) this.builder(escapeHTMLInCSS(after))
     this.builder('}', node, 'end')
   }
 
@@ -95,10 +107,11 @@ class Stringifier {
     }
 
     let semicolon = this.raw(node, 'semicolon')
+    let isDocument = node.type === 'document'
     for (let i = 0; i < node.nodes.length; i++) {
       let child = node.nodes[i]
       let before = this.raw(child, 'before')
-      if (before) this.builder(before)
+      if (before) this.builder(isDocument ? before : escapeHTMLInCSS(before))
       this.stringify(child, last !== i || semicolon)
     }
   }
@@ -106,7 +119,7 @@ class Stringifier {
   comment(node) {
     let left = this.raw(node, 'left', 'commentLeft')
     let right = this.raw(node, 'right', 'commentRight')
-    this.builder('/*' + left + node.text + right + '*/', node)
+    this.builder(escapeHTMLInCSS('/*' + left + node.text + right + '*/'), node)
   }
 
   decl(node, semicolon) {
@@ -118,7 +131,7 @@ class Stringifier {
     }
 
     if (semicolon) string += ';'
-    this.builder(string, node)
+    this.builder(escapeHTMLInCSS(string), node)
   }
 
   document(node) {
@@ -324,13 +337,17 @@ class Stringifier {
 
   root(node) {
     this.body(node)
-    if (node.raws.after) this.builder(node.raws.after)
+    if (node.raws.after) {
+      let after = node.raws.after
+      let isDocument = node.parent && node.parent.type === 'document'
+      this.builder(isDocument ? after : escapeHTMLInCSS(after))
+    }
   }
 
   rule(node) {
     this.block(node, this.rawValue(node, 'selector'))
     if (node.raws.ownSemicolon) {
-      this.builder(node.raws.ownSemicolon, node, 'end')
+      this.builder(escapeHTMLInCSS(node.raws.ownSemicolon), node, 'end')
     }
   }