2 * @param plugins Can also be included with the Processor#use method.
3 * @returns A processor that will apply plugins as CSS processors.
5 declare function postcss(plugins?: postcss.AcceptedPlugin[]): postcss.Processor;
6 declare function postcss(...plugins: postcss.AcceptedPlugin[]): postcss.Processor;
7 declare namespace postcss {
8 type AcceptedPlugin = Plugin<any> | Transformer | {
9 postcss: TransformCallback | Processor;
12 * Creates a PostCSS plugin with a standard API.
13 * @param name Plugin name. Same as in name property in package.json. It will
14 * be saved in plugin.postcssPlugin property.
15 * @param initializer Will receive plugin options and should return functions
16 * to modify nodes in input CSS.
18 function plugin<T>(name: string, initializer: PluginInitializer<T>): Plugin<T>;
19 interface Plugin<T> extends Transformer {
20 (opts?: T): Transformer;
22 process: (css: string | {
24 } | Result, opts?: any) => LazyResult;
26 interface Transformer extends TransformCallback {
27 postcssPlugin?: string;
28 postcssVersion?: string;
30 interface TransformCallback {
32 * @returns Asynchronous plugins should return a promise.
34 (root: Root, result?: Result): void | Function | any;
36 interface PluginInitializer<T> {
37 (pluginOptions?: T): Transformer;
40 * Contains helpers for working with vendor prefixes.
42 export namespace vendor {
44 * @returns The vendor prefix extracted from the input string.
46 function prefix(prop: string): string;
48 * @returns The input string stripped of its vendor prefix.
50 function unprefixed(prop: string): string;
52 export class Stringifier {
53 builder: Stringifier.Builder;
54 constructor(builder?: Stringifier.Builder);
55 stringify(node: Node, semicolon?: boolean): void;
56 root(node: any): void;
57 comment(node: any): void;
58 decl(node: any, semicolon: any): void;
59 rule(node: any): void;
60 atrule(node: any, semicolon: any): void;
61 body(node: any): void;
62 block(node: any, start: any): void;
63 raw(node: Node, own: string, detect?: string): any;
64 rawSemicolon(root: any): any;
65 rawEmptyBody(root: any): any;
66 rawIndent(root: any): any;
67 rawBeforeComment(root: any, node: any): any;
68 rawBeforeDecl(root: any, node: any): any;
69 rawBeforeRule(root: any): any;
70 rawBeforeClose(root: any): any;
71 rawBeforeOpen(root: any): any;
72 rawColon(root: any): any;
73 beforeAfter(node: any, detect: any): any;
74 rawValue(node: any, prop: any): any;
76 export namespace Stringifier {
78 (str: string, node?: Node, str2?: string): void;
82 * Default function to convert a node tree into a CSS string.
84 function stringify(node: Node, builder: Stringifier.Builder): void;
87 * @param css The CSS to parse.
89 * @returns {} A new Root node, which contains the source CSS nodes.
91 function parse(css: string | {
93 } | LazyResult | Result, options?: {
95 map?: postcss.SourceMapOptions;
98 * Contains helpers for safely splitting lists of CSS values, preserving
99 * parentheses and quotes.
101 export namespace list {
103 * Safely splits space-separated values (such as those for background,
104 * border-radius and other shorthand properties).
106 function space(str: string): string[];
108 * Safely splits comma-separated values (such as those for transition-* and
109 * background properties).
111 function comma(str: string): string[];
114 * Creates a new Comment node.
115 * @param defaults Properties for the new Comment node.
116 * @returns The new node.
118 function comment(defaults?: CommentNewProps): Comment;
120 * Creates a new AtRule node.
121 * @param defaults Properties for the new AtRule node.
122 * @returns The new node.
124 function atRule(defaults?: AtRuleNewProps): AtRule;
126 * Creates a new Declaration node.
127 * @param defaults Properties for the new Declaration node.
128 * @returns The new node.
130 function decl(defaults?: DeclarationNewProps): Declaration;
132 * Creates a new Rule node.
133 * @param defaults Properties for the new Rule node.
134 * @returns The new node.
136 function rule(defaults?: RuleNewProps): Rule;
138 * Creates a new Root node.
139 * @param defaults Properties for the new Root node.
140 * @returns The new node.
142 function root(defaults?: Object): Root;
143 interface SourceMapOptions {
145 * Indicates that the source map should be embedded in the output CSS as a
146 * Base64-encoded comment. By default, it is true. But if all previous maps
147 * are external, not inline, PostCSS will not embed the map even if you do
148 * not set this option.
150 * If you have an inline source map, the result.map property will be empty,
151 * as the source map will be contained within the text of result.css.
155 * Source map content from a previous processing step (e.g., Sass compilation).
156 * PostCSS will try to read the previous source map automatically (based on comments
157 * within the source CSS), but you can use this option to identify it manually.
158 * If desired, you can omit the previous map with prev: false.
162 * Indicates that PostCSS should set the origin content (e.g., Sass source)
163 * of the source map. By default, it is true. But if all previous maps do not
164 * contain sources content, PostCSS will also leave it out even if you do not set
167 sourcesContent?: boolean;
169 * Indicates that PostCSS should add annotation comments to the CSS. By default,
170 * PostCSS will always add a comment with a path to the source map. PostCSS will
171 * not add annotations to CSS files that do not contain any comments.
173 * By default, PostCSS presumes that you want to save the source map as
174 * opts.to + '.map' and will use this path in the annotation comment. A different
175 * path can be set by providing a string value for annotation.
177 * If you have set inline: true, annotation cannot be disabled.
179 annotation?: boolean | string;
181 * If true, PostCSS will try to correct any syntax errors that it finds in the CSS.
182 * This is useful for legacy code filled with hacks. Another use-case is interactive
183 * tools with live input — for example, the Autoprefixer demo.
188 * A Processor instance contains plugins to process CSS. Create one
189 * Processor instance, initialize its plugins, and then use that instance
190 * on numerous CSS files.
192 interface Processor {
194 * Adds a plugin to be used as a CSS processor. Plugins can also be
195 * added by passing them as arguments when creating a postcss instance.
197 use(plugin: AcceptedPlugin): Processor;
199 * Parses source CSS. Because some plugins can be asynchronous it doesn't
200 * make any transformations. Transformations will be applied in LazyResult's
202 * @param css Input CSS or any object with toString() method, like a file
203 * stream. If a Result instance is passed the processor will take the
204 * existing Root parser from it.
206 process(css: string | {
208 } | Result, options?: ProcessOptions): LazyResult;
210 * Contains plugins added to this processor.
212 plugins: Plugin<any>[];
214 * Contains the current version of PostCSS (e.g., "4.0.5").
218 interface ProcessOptions extends Syntax {
220 * The path of the CSS source file. You should always set from, because it is
221 * used in source map generation and syntax error messages.
225 * The path where you'll put the output CSS file. You should always set it
226 * to generate correct source maps.
231 * Enable Safe Mode, in which PostCSS will try to fix CSS syntax errors.
234 map?: postcss.SourceMapOptions;
236 * Function to generate AST by string.
238 parser?: Parse | Syntax;
240 * Class to generate string by AST.
242 stringifier?: Stringify | Syntax;
246 * Function to generate AST by string.
250 * Class to generate string by AST.
252 stringify?: Stringify;
255 (css?: string, opts?: postcss.SourceMapOptions): Root;
257 interface Stringify {
258 (node?: postcss.Node, builder?: any): postcss.Result | void;
261 * A promise proxy for the result of PostCSS transformations.
263 interface LazyResult {
265 * Processes input CSS through synchronous and asynchronous plugins.
266 * @param onRejected Called if any plugin throws an error.
268 then(onFulfilled: (result: Result) => void, onRejected?: (error: Error) => void): Function | any;
270 * Processes input CSS through synchronous and asynchronous plugins.
271 * @param onRejected Called if any plugin throws an error.
273 catch(onRejected: (error: Error) => void): Function | any;
275 * Alias for css property.
279 * Processes input CSS through synchronous plugins and converts Root to
280 * CSS string. This property will only work with synchronous plugins. If
281 * the processor contains any asynchronous plugins it will throw an error.
282 * In this case, you should use LazyResult#then() instead.
283 * @returns Result#css.
287 * Alias for css property to use when syntaxes generate non-CSS output.
291 * Processes input CSS through synchronous plugins. This property will
292 * work only with synchronous plugins. If processor contains any
293 * asynchronous plugins it will throw an error. You should use
294 * LazyResult#then() instead.
298 * Processes input CSS through synchronous plugins. This property will work
299 * only with synchronous plugins. If processor contains any asynchronous
300 * plugins it will throw an error. You should use LazyResult#then() instead.
304 * Processes input CSS through synchronous plugins and calls Result#warnings().
305 * This property will only work with synchronous plugins. If the processor
306 * contains any asynchronous plugins it will throw an error. In this case,
307 * you should use LazyResult#then() instead.
309 warnings(): ResultMessage[];
311 * Processes input CSS through synchronous plugins. This property will work
312 * only with synchronous plugins. If processor contains any asynchronous
313 * plugins it will throw an error. You should use LazyResult#then() instead.
315 messages: ResultMessage[];
317 * @returns A processor used for CSS transformations.
319 processor: Processor;
321 * @returns Options from the Processor#process(css, opts) call that produced
322 * this Result instance.
327 * Provides the result of the PostCSS transformations.
331 * Alias for css property.
335 * Creates an instance of Warning and adds it to messages.
336 * @param message Used in the text property of the message object.
337 * @param options Properties for Message object.
339 warn(message: string, options?: WarningOptions): void;
341 * @returns Warnings from plugins, filtered from messages.
343 warnings(): ResultMessage[];
345 * A CSS string representing this Result's Root instance.
349 * Alias for css property to use with syntaxes that generate non-CSS output.
353 * An instance of the SourceMapGenerator class from the source-map library,
354 * representing changes to the Result's Root instance.
355 * This property will have a value only if the user does not want an inline
356 * source map. By default, PostCSS generates inline source maps, written
357 * directly into the processed CSS. The map property will be empty by default.
358 * An external source map will be generated — and assigned to map — only if
359 * the user has set the map.inline option to false, or if PostCSS was passed
360 * an external input source map.
364 * Contains the Root node after all transformations.
368 * Contains messages from plugins (e.g., warnings or custom messages).
369 * Add a warning using Result#warn() and get all warnings
370 * using the Result#warnings() method.
372 messages: ResultMessage[];
374 * The Processor instance used for this transformation.
376 processor?: Processor;
378 * Options from the Processor#process(css, opts) or Root#toResult(opts) call
379 * that produced this Result instance.
381 opts?: ResultOptions;
383 interface ResultOptions extends ProcessOptions {
385 * The CSS node that was the source of the warning.
389 * Name of plugin that created this warning. Result#warn() will fill it
390 * automatically with plugin.postcssPlugin value.
394 interface ResultMap {
396 * Add a single mapping from original source line and column to the generated
397 * source's line and column for this source map being created. The mapping
398 * object should have the following properties:
402 addMapping(mapping: {
412 * The original source file (relative to the sourceRoot).
418 * Set the source content for an original source file.
419 * @param sourceFile The URL of the original source file.
420 * @param sourceContent The content of the source file.
422 setSourceContent(sourceFile: string, sourceContent: string): void;
424 * Applies a SourceMap for a source file to the SourceMap. Each mapping to
425 * the supplied source file is rewritten using the supplied SourceMap.
426 * Note: The resolution for the resulting mappings is the minimium of this
427 * map and the supplied map.
428 * @param sourceMapConsumer The SourceMap to be applied.
429 * @param sourceFile The filename of the source file. If omitted, sourceMapConsumer
430 * file will be used, if it exists. Otherwise an error will be thrown.
431 * @param sourceMapPath The dirname of the path to the SourceMap to be applied.
432 * If relative, it is relative to the SourceMap. This parameter is needed when
433 * the two SourceMaps aren't in the same directory, and the SourceMap to be
434 * applied contains relative source paths. If so, those relative source paths
435 * need to be rewritten relative to the SourceMap.
436 * If omitted, it is assumed that both SourceMaps are in the same directory;
437 * thus, not needing any rewriting (Supplying '.' has the same effect).
439 applySourceMap(sourceMapConsumer: any, sourceFile?: string, sourceMapPath?: string): void;
441 * Renders the source map being generated to JSON.
445 * Renders the source map being generated to a string.
447 toString: () => string;
449 interface ResultMessage {
456 * Represents a plugin warning. It can be created using Result#warn().
460 * @returns Error position, message.
464 * Contains the warning message.
468 * Contains the name of the plugin that created this warning. When you
469 * call Result#warn(), it will fill this property automatically.
473 * The CSS node that caused the warning.
477 * The line in the input file with this warning's source.
481 * Column in the input file with this warning's source.
485 interface WarningOptions extends ResultOptions {
487 * A word inside a node's string that should be highlighted as source
492 * The index inside a node's string that should be highlighted as
498 * The CSS parser throws this error for broken CSS.
500 interface CssSyntaxError extends InputOrigin {
503 * @returns Error position, message and source code of broken part.
507 * @param color Whether arrow should be colored red by terminal color codes.
508 * By default, PostCSS will use process.stdout.isTTY and
509 * process.env.NODE_DISABLE_COLORS.
510 * @returns A few lines of CSS source that caused the error. If CSS has
511 * input source map without sourceContent this method will return an empty
514 showSourceCode(color?: boolean): string;
516 * Contains full error text in the GNU error format.
520 * Contains only the error description.
524 * Contains the PostCSS plugin name if the error didn't come from the
530 interface InputOrigin {
532 * If parser's from option is set, contains the absolute path to the
533 * broken file. PostCSS will use the input source map to detect the
534 * original error location. If you wrote a Sass file, then compiled it
535 * to CSS and parsed it with PostCSS, PostCSS will show the original
536 * position in the Sass file. If you need the position in the PostCSS
537 * input (e.g., to debug the previous compiler), use error.input.file.
541 * Contains the source line of the error. PostCSS will use the input
542 * source map to detect the original error location. If you wrote a Sass
543 * file, then compiled it to CSS and parsed it with PostCSS, PostCSS
544 * will show the original position in the Sass file. If you need the
545 * position in the PostCSS input (e.g., to debug the previous
546 * compiler), use error.input.line.
550 * Contains the source column of the error. PostCSS will use input
551 * source map to detect the original error location. If you wrote a
552 * Sass file, then compiled it to CSS and parsed it with PostCSS,
553 * PostCSS will show the original position in the Sass file. If you
554 * need the position in the PostCSS input (e.g., to debug the
555 * previous compiler), use error.input.column.
559 * Contains the source code of the broken file. PostCSS will use the
560 * input source map to detect the original error location. If you wrote
561 * a Sass file, then compiled it to CSS and parsed it with PostCSS,
562 * PostCSS will show the original position in the Sass file. If you need
563 * the position in the PostCSS input (e.g., to debug the previous
564 * compiler), use error.input.source.
568 export class PreviousMap {
572 private consumerCache;
575 constructor(css: any, opts: any);
577 withContent(): boolean;
578 startWith(string: any, start: any): boolean;
579 loadAnnotation(css: any): void;
580 decodeInline(text: any): any;
581 loadMap(file: any, prev: any): any;
582 isMap(map: any): boolean;
585 * Represents the source CSS.
589 * The absolute path to the CSS source file defined with the "from" option.
593 * The unique ID of the CSS source. Used if "from" option is not provided
594 * (because PostCSS does not know the file path).
598 * The CSS source identifier. Contains input.file if the user set the
599 * "from" option, or input.id if they did not.
603 * Represents the input source map passed from a compilation step before
604 * PostCSS (e.g., from the Sass compiler).
608 * Reads the input source map.
609 * @returns A symbol position in the input source (e.g., in a Sass file
610 * that was compiled to CSS before being passed to PostCSS):
612 origin(line: number, column: number): InputOrigin;
616 * Returns a string representing the node's type. Possible values are
617 * root, atrule, rule, decl or comment.
621 * Returns the node's parent node.
625 * Returns the input source of the node. The property is used in source
626 * map generation. If you create a node manually
627 * (e.g., with postcss.decl() ), that node will not have a source
628 * property and will be absent from the source map. For this reason, the
629 * plugin developer should consider cloning nodes to create new ones
630 * (in which case the new node's source will reference the original,
631 * cloned node) or setting the source property manually.
635 * Contains information to generate byte-to-byte equal node string as it
636 * was in origin input.
640 * @returns A CSS string representing the node.
644 * This method produces very useful error messages. If present, an input
645 * source map will be used to get the original position of the source, even
646 * from a previous compilation step (e.g., from Sass compilation).
647 * @returns The original position of the node in the source, showing line
648 * and column numbers and also a small excerpt to facilitate debugging.
654 message: string, options?: NodeErrorOptions): CssSyntaxError;
656 * Creates an instance of Warning and adds it to messages. This method is
657 * provided as a convenience wrapper for Result#warn.
658 * Note that `opts.node` is automatically passed to Result#warn for you.
659 * @param result The result that will receive the warning.
660 * @param text Warning message. It will be used in the `text` property of
661 * the message object.
662 * @param opts Properties to assign to the message object.
664 warn(result: Result, text: string, opts?: WarningOptions): void;
666 * @returns The next child of the node's parent; or, returns undefined if
667 * the current node is the last child.
671 * @returns The previous child of the node's parent; or, returns undefined
672 * if the current node is the first child.
676 * @returns The Root instance of the node's tree.
680 * Removes the node from its parent and cleans the parent property in the
681 * node and its children.
682 * @returns This node for chaining.
686 * Inserts node(s) before the current node and removes the current node.
687 * @returns This node for chaining.
689 replaceWith(...nodes: (Node | Object)[]): this;
691 * @param overrides New properties to override in the clone.
692 * @returns A clone of this node. The node and its (cloned) children will
693 * have a clean parent and code style properties.
695 clone(overrides?: Object): this;
697 * Shortcut to clone the node and insert the resulting cloned node before
699 * @param overrides New Properties to override in the clone.
700 * @returns The cloned node.
702 cloneBefore(overrides?: Object): this;
704 * Shortcut to clone the node and insert the resulting cloned node after
706 * @param overrides New Properties to override in the clone.
707 * @returns The cloned node.
709 cloneAfter(overrides?: Object): this;
711 * Removes the node from its current parent and inserts it at the end of
712 * newParent. This will clean the before and after code style properties
713 * from the node and replace them with the indentation style of newParent.
714 * It will also clean the between property if newParent is in another Root.
715 * @param newParent Where the current node will be moved.
716 * @returns This node for chaining.
718 moveTo(newParent: Container): this;
720 * Removes the node from its current parent and inserts it into a new
721 * parent before otherNode. This will also clean the node's code style
722 * properties just as it would in node.moveTo(newParent).
723 * @param otherNode Will be after the current node after moving.
724 * @returns This node for chaining.
726 moveBefore(otherNode: Node): this;
728 * Removes the node from its current parent and inserts it into a new
729 * parent after otherNode. This will also clean the node's code style
730 * properties just as it would in node.moveTo(newParent).
731 * @param otherNode Will be before the current node after moving.
732 * @returns This node for chaining.
734 moveAfter(otherNode: Node): this;
736 * @param prop Name or code style property.
737 * @param defaultType Name of default value. It can be easily missed if the
738 * value is the same as prop.
739 * @returns A code style property value. If the node is missing the code
740 * style property (because the node was manually built or cloned), PostCSS
741 * will try to autodetect the code style property by looking at other nodes
744 raw(prop: string, defaultType?: string): any;
746 interface NodeNewProps {
751 * The space symbols before the node. It also stores `*` and `_`
752 * symbols before the declaration (IE hack).
756 * The space symbols after the last child of the node to the end of
761 * The symbols between the property and value for declarations,
762 * selector and "{" for rules, last parameter and "{" for at-rules.
766 * True if last child has (optional) semicolon.
770 * The space between the at-rule's name and parameters.
774 * The space symbols between "/*" and comment's text.
778 * The space symbols between comment's text and "*\/".
782 * The content of important statement, if it is not just "!important".
786 interface NodeSource {
789 * The starting position of the node's source.
796 * The ending position of the node's source.
803 interface NodeErrorOptions {
805 * Plugin name that created this error. PostCSS will set it automatically.
809 * A word inside a node's string, that should be highlighted as source
814 * An index inside a node's string that should be highlighted as source
821 * Returns a string representing the node's type. Possible values are
822 * root, atrule, rule, decl or comment.
826 * Returns the node's parent node.
828 parent?: JsonContainer;
830 * Returns the input source of the node. The property is used in source
831 * map generation. If you create a node manually (e.g., with
832 * postcss.decl() ), that node will not have a source property and
833 * will be absent from the source map. For this reason, the plugin
834 * developer should consider cloning nodes to create new ones (in which
835 * case the new node's source will reference the original, cloned node)
836 * or setting the source property manually.
840 * Contains information to generate byte-to-byte equal node string as it
841 * was in origin input.
846 * Containers can store any content. If you write a rule inside a rule,
847 * PostCSS will parse it.
849 interface Container extends Node {
851 * Returns the container's parent node.
855 * Contains the container's children.
859 * @returns The container's first child.
863 * @returns The container's last child.
867 * @param overrides New properties to override in the clone.
868 * @returns A clone of this node. The node and its (cloned) children will
869 * have a clean parent and code style properties.
871 clone(overrides?: Object): this;
873 * @param child Child of the current container.
874 * @returns The child's index within the container's "nodes" array.
876 index(child: Node | number): number;
878 * Determines whether all child nodes satisfy the specified test.
879 * @param callback A function that accepts up to three arguments. The
880 * every method calls the callback function for each node until the
881 * callback returns false, or until the end of the array.
882 * @returns True if the callback returns true for all of the container's
885 every(callback: (node: Node, index: number, nodes: Node[]) => any, thisArg?: any): boolean;
887 * Determines whether the specified callback returns true for any child node.
888 * @param callback A function that accepts up to three arguments. The some
889 * method calls the callback for each node until the callback returns true,
890 * or until the end of the array.
891 * @param thisArg An object to which the this keyword can refer in the
892 * callback function. If thisArg is omitted, undefined is used as the
894 * @returns True if callback returns true for (at least) one of the
895 * container's children.
897 some(callback: (node: Node, index: number, nodes: Node[]) => boolean, thisArg?: any): boolean;
899 * Iterates through the container's immediate children, calling the
900 * callback function for each child. If you need to recursively iterate
901 * through all the container's descendant nodes, use container.walk().
902 * Unlike the for {} -cycle or Array#forEach() this iterator is safe if
903 * you are mutating the array of child nodes during iteration.
904 * @param callback Iterator. Returning false will break iteration. Safe
905 * if you are mutating the array of child nodes during iteration. PostCSS
906 * will adjust the current index to match the mutations.
907 * @returns False if the callback returns false during iteration.
909 each(callback: (node: Node, index: number) => any): boolean | void;
911 * Traverses the container's descendant nodes, calling `callback` for each
912 * node. Like container.each(), this method is safe to use if you are
913 * mutating arrays during iteration. If you only need to iterate through
914 * the container's immediate children, use container.each().
915 * @param callback Iterator.
917 walk(callback: (node: Node, index: number) => any): boolean | void;
919 * Traverses the container's descendant nodes, calling `callback` for each
920 * declaration. Like container.each(), this method is safe to use if you
921 * are mutating arrays during iteration.
922 * @param propFilter Filters declarations by property name. Only those
923 * declarations whose property matches propFilter will be iterated over.
924 * @param callback Called for each declaration node within the container.
926 walkDecls(propFilter: string | RegExp, callback?: (decl: Declaration, index: number) => any): boolean | void;
927 walkDecls(callback: (decl: Declaration, index: number) => any): boolean | void;
929 * Traverses the container's descendant nodes, calling `callback` for each
930 * at-rule. Like container.each(), this method is safe to use if you are
931 * mutating arrays during iteration.
932 * @param nameFilter Filters at-rules by name. If provided, iteration
933 * will only happen over at-rules that have matching names.
934 * @param callback Iterator called for each at-rule node within the
937 walkAtRules(nameFilter: string | RegExp, callback: (atRule: AtRule, index: number) => any): boolean | void;
938 walkAtRules(callback: (atRule: AtRule, index: number) => any): boolean | void;
940 * Traverses the container's descendant nodes, calling `callback` for each
941 * rule. Like container.each(), this method is safe to use if you are
942 * mutating arrays during iteration.
943 * @param selectorFilter Filters rules by selector. If provided,
944 * iteration will only happen over rules that have matching names.
945 * @param callback Iterator called for each rule node within the
948 walkRules(selectorFilter: string | RegExp, callback: (atRule: Rule, index: number) => any): boolean | void;
949 walkRules(callback: (atRule: Rule, index: number) => any): boolean | void;
950 walkRules(selectorFilter: any, callback?: (atRule: Rule, index: number) => any): boolean | void;
952 * Traverses the container's descendant nodes, calling `callback` for each
953 * comment. Like container.each(), this method is safe to use if you are
954 * mutating arrays during iteration.
955 * @param callback Iterator called for each comment node within the container.
957 walkComments(callback: (comment: Comment, indexed: number) => any): void | boolean;
959 * Passes all declaration values within the container that match pattern
960 * through the callback, replacing those values with the returned result of
961 * callback. This method is useful if you are using a custom unit or
962 * function and need to iterate through all values.
963 * @param pattern Pattern that we need to replace.
964 * @param options Options to speed up the search.
965 * @param callbackOrReplaceValue String to replace pattern or callback
966 * that will return a new value. The callback will receive the same
967 * arguments as those passed to a function parameter of String#replace.
969 replaceValues(pattern: string | RegExp, options: {
971 * Property names. The method will only search for values that match
972 * regexp within declarations of listed properties.
976 * Used to narrow down values and speed up the regexp search. Searching
977 * every single value with a regexp can be slow. If you pass a fast
978 * string, PostCSS will first check whether the value contains the fast
979 * string; and only if it does will PostCSS check that value against
980 * regexp. For example, instead of just checking for /\d+rem/ on all
981 * values, set fast: 'rem' to first check whether a value has the rem
982 * unit, and only if it does perform the regexp check.
985 }, callbackOrReplaceValue: string | {
986 (substring: string, ...args: any[]): string;
988 replaceValues(pattern: string | RegExp, callbackOrReplaceValue: string | {
989 (substring: string, ...args: any[]): string;
992 * Inserts new nodes to the beginning of the container.
993 * Because each node class is identifiable by unique properties, use the
994 * following shortcuts to create nodes in insert methods:
995 * root.prepend({ name: '@charset', params: '"UTF-8"' }); // at-rule
996 * root.prepend({ selector: 'a' }); // rule
997 * rule.prepend({ prop: 'color', value: 'black' }); // declaration
998 * rule.prepend({ text: 'Comment' }) // comment
999 * A string containing the CSS of the new element can also be used. This
1000 * approach is slower than the above shortcuts.
1001 * root.prepend('a {}');
1002 * root.first.prepend('color: black; z-index: 1');
1003 * @param nodes New nodes.
1004 * @returns This container for chaining.
1006 prepend(...nodes: (Node | Object | string)[]): this;
1008 * Inserts new nodes to the end of the container.
1009 * Because each node class is identifiable by unique properties, use the
1010 * following shortcuts to create nodes in insert methods:
1011 * root.append({ name: '@charset', params: '"UTF-8"' }); // at-rule
1012 * root.append({ selector: 'a' }); // rule
1013 * rule.append({ prop: 'color', value: 'black' }); // declaration
1014 * rule.append({ text: 'Comment' }) // comment
1015 * A string containing the CSS of the new element can also be used. This
1016 * approach is slower than the above shortcuts.
1017 * root.append('a {}');
1018 * root.first.append('color: black; z-index: 1');
1019 * @param nodes New nodes.
1020 * @returns This container for chaining.
1022 append(...nodes: (Node | Object | string)[]): this;
1024 * Insert newNode before oldNode within the container.
1025 * @param oldNode Child or child's index.
1026 * @returns This container for chaining.
1028 insertBefore(oldNode: Node | number, newNode: Node | Object | string): this;
1030 * Insert newNode after oldNode within the container.
1031 * @param oldNode Child or child's index.
1032 * @returns This container for chaining.
1034 insertAfter(oldNode: Node | number, newNode: Node | Object | string): this;
1036 * Removes the container from its parent and cleans the parent property in the
1037 * container and its children.
1038 * @returns This container for chaining.
1042 * Removes child from the container and cleans the parent properties
1043 * from the node and its children.
1044 * @param child Child or child's index.
1045 * @returns This container for chaining.
1047 removeChild(child: Node | number): this;
1049 * Removes all children from the container and cleans their parent
1051 * @returns This container for chaining.
1055 interface ContainerNewProps extends NodeNewProps {
1057 * Contains the container's children.
1060 raws?: ContainerRaws;
1062 interface ContainerRaws extends NodeRaws {
1065 interface JsonContainer extends JsonNode {
1067 * Contains the container's children.
1071 * @returns The container's first child.
1075 * @returns The container's last child.
1080 * Represents a CSS file and contains all its parsed nodes.
1082 interface Root extends Container {
1084 * Inherited from Container. Should always be undefined for a Root node.
1088 * @param overrides New properties to override in the clone.
1089 * @returns A clone of this node. The node and its (cloned) children will
1090 * have a clean parent and code style properties.
1092 clone(overrides?: Object): this;
1094 * @returns A Result instance representing the root's CSS.
1096 toResult(options?: {
1098 * The path where you'll put the output CSS file. You should always
1099 * set "to" to generate correct source maps.
1102 map?: SourceMapOptions;
1105 * Deprecated. Use Root#removeChild.
1107 remove(child?: Node | number): this;
1109 * Removes child from the root node, and the parent properties of node and
1111 * @param child Child or child's index.
1112 * @returns This root node for chaining.
1114 removeChild(child: Node | number): this;
1116 interface RootNewProps extends ContainerNewProps {
1118 interface JsonRoot extends JsonContainer {
1121 * Represents an at-rule. If it's followed in the CSS by a {} block, this
1122 * node will have a nodes property representing its children.
1124 interface AtRule extends Container {
1126 * The identifier that immediately follows the @.
1130 * These are the values that follow the at-rule's name, but precede any {}
1131 * block. The spec refers to this area as the at-rule's "prelude".
1135 * @param overrides New properties to override in the clone.
1136 * @returns A clone of this node. The node and its (cloned) children will
1137 * have a clean parent and code style properties.
1139 clone(overrides?: Object): this;
1141 interface AtRuleNewProps extends ContainerNewProps {
1143 * The identifier that immediately follows the @.
1147 * These are the values that follow the at-rule's name, but precede any {}
1148 * block. The spec refers to this area as the at-rule's "prelude".
1150 params?: string | number;
1153 interface AtRuleRaws extends NodeRaws {
1156 interface JsonAtRule extends JsonContainer {
1158 * The identifier that immediately follows the @.
1162 * These are the values that follow the at-rule's name, but precede any {}
1163 * block. The spec refers to this area as the at-rule's "prelude".
1168 * Represents a CSS rule: a selector followed by a declaration block.
1170 interface Rule extends Container {
1172 * Returns the rule's parent node.
1176 * The rule's full selector. If there are multiple comma-separated selectors,
1177 * the entire group will be included.
1181 * An array containing the rule's individual selectors.
1182 * Groups of selectors are split at commas.
1184 selectors?: string[];
1186 * @param overrides New properties to override in the clone.
1187 * @returns A clone of this node. The node and its (cloned) children will
1188 * have a clean parent and code style properties.
1190 clone(overrides?: Object): this;
1192 interface RuleNewProps extends ContainerNewProps {
1194 * The rule's full selector. If there are multiple comma-separated selectors,
1195 * the entire group will be included.
1199 * An array containing the rule's individual selectors. Groups of selectors
1200 * are split at commas.
1202 selectors?: string[];
1205 interface RuleRaws extends ContainerRaws {
1207 * The rule's full selector. If there are multiple comma-separated selectors,
1208 * the entire group will be included.
1212 interface JsonRule extends JsonContainer {
1214 * The rule's full selector. If there are multiple comma-separated selectors,
1215 * the entire group will be included.
1219 * An array containing the rule's individual selectors.
1220 * Groups of selectors are split at commas.
1222 selectors?: string[];
1225 * Represents a CSS declaration.
1227 interface Declaration extends Node {
1229 * The declaration's property name.
1233 * The declaration's value. This value will be cleaned of comments. If the
1234 * source value contained comments, those comments will be available in the
1235 * _value.raws property. If you have not changed the value, the result of
1236 * decl.toString() will include the original raws value (comments and all).
1240 * True if the declaration has an !important annotation.
1244 * @param overrides New properties to override in the clone.
1245 * @returns A clone of this node. The node and its (cloned) children will
1246 * have a clean parent and code style properties.
1248 clone(overrides?: Object): this;
1250 interface DeclarationNewProps {
1252 * The declaration's property name.
1256 * The declaration's value. This value will be cleaned of comments. If the
1257 * source value contained comments, those comments will be available in the
1258 * _value.raws property. If you have not changed the value, the result of
1259 * decl.toString() will include the original raws value (comments and all).
1262 raws?: DeclarationRaws;
1264 interface DeclarationRaws extends NodeRaws {
1266 * The declaration's value. This value will be cleaned of comments.
1267 * If the source value contained comments, those comments will be
1268 * available in the _value.raws property. If you have not changed the value, the result of
1269 * decl.toString() will include the original raws value (comments and all).
1273 interface JsonDeclaration extends JsonNode {
1275 * True if the declaration has an !important annotation.
1277 important?: boolean;
1280 * Represents a comment between declarations or statements (rule and at-rules).
1281 * Comments inside selectors, at-rule parameters, or declaration values will
1282 * be stored in the Node#raws properties.
1284 interface Comment extends Node {
1286 * The comment's text.
1290 * @param overrides New properties to override in the clone.
1291 * @returns A clone of this node. The node and its (cloned) children will
1292 * have a clean parent and code style properties.
1294 clone(overrides?: Object): this;
1296 interface CommentNewProps {
1298 * The comment's text.
1302 interface JsonComment extends JsonNode {