postcss.d.ts
50.2 KB
1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
19
20
21
22
23
24
25
26
27
28
29
30
31
32
33
34
35
36
37
38
39
40
41
42
43
44
45
46
47
48
49
50
51
52
53
54
55
56
57
58
59
60
61
62
63
64
65
66
67
68
69
70
71
72
73
74
75
76
77
78
79
80
81
82
83
84
85
86
87
88
89
90
91
92
93
94
95
96
97
98
99
100
101
102
103
104
105
106
107
108
109
110
111
112
113
114
115
116
117
118
119
120
121
122
123
124
125
126
127
128
129
130
131
132
133
134
135
136
137
138
139
140
141
142
143
144
145
146
147
148
149
150
151
152
153
154
155
156
157
158
159
160
161
162
163
164
165
166
167
168
169
170
171
172
173
174
175
176
177
178
179
180
181
182
183
184
185
186
187
188
189
190
191
192
193
194
195
196
197
198
199
200
201
202
203
204
205
206
207
208
209
210
211
212
213
214
215
216
217
218
219
220
221
222
223
224
225
226
227
228
229
230
231
232
233
234
235
236
237
238
239
240
241
242
243
244
245
246
247
248
249
250
251
252
253
254
255
256
257
258
259
260
261
262
263
264
265
266
267
268
269
270
271
272
273
274
275
276
277
278
279
280
281
282
283
284
285
286
287
288
289
290
291
292
293
294
295
296
297
298
299
300
301
302
303
304
305
306
307
308
309
310
311
312
313
314
315
316
317
318
319
320
321
322
323
324
325
326
327
328
329
330
331
332
333
334
335
336
337
338
339
340
341
342
343
344
345
346
347
348
349
350
351
352
353
354
355
356
357
358
359
360
361
362
363
364
365
366
367
368
369
370
371
372
373
374
375
376
377
378
379
380
381
382
383
384
385
386
387
388
389
390
391
392
393
394
395
396
397
398
399
400
401
402
403
404
405
406
407
408
409
410
411
412
413
414
415
416
417
418
419
420
421
422
423
424
425
426
427
428
429
430
431
432
433
434
435
436
437
438
439
440
441
442
443
444
445
446
447
448
449
450
451
452
453
454
455
456
457
458
459
460
461
462
463
464
465
466
467
468
469
470
471
472
473
474
475
476
477
478
479
480
481
482
483
484
485
486
487
488
489
490
491
492
493
494
495
496
497
498
499
500
501
502
503
504
505
506
507
508
509
510
511
512
513
514
515
516
517
518
519
520
521
522
523
524
525
526
527
528
529
530
531
532
533
534
535
536
537
538
539
540
541
542
543
544
545
546
547
548
549
550
551
552
553
554
555
556
557
558
559
560
561
562
563
564
565
566
567
568
569
570
571
572
573
574
575
576
577
578
579
580
581
582
583
584
585
586
587
588
589
590
591
592
593
594
595
596
597
598
599
600
601
602
603
604
605
606
607
608
609
610
611
612
613
614
615
616
617
618
619
620
621
622
623
624
625
626
627
628
629
630
631
632
633
634
635
636
637
638
639
640
641
642
643
644
645
646
647
648
649
650
651
652
653
654
655
656
657
658
659
660
661
662
663
664
665
666
667
668
669
670
671
672
673
674
675
676
677
678
679
680
681
682
683
684
685
686
687
688
689
690
691
692
693
694
695
696
697
698
699
700
701
702
703
704
705
706
707
708
709
710
711
712
713
714
715
716
717
718
719
720
721
722
723
724
725
726
727
728
729
730
731
732
733
734
735
736
737
738
739
740
741
742
743
744
745
746
747
748
749
750
751
752
753
754
755
756
757
758
759
760
761
762
763
764
765
766
767
768
769
770
771
772
773
774
775
776
777
778
779
780
781
782
783
784
785
786
787
788
789
790
791
792
793
794
795
796
797
798
799
800
801
802
803
804
805
806
807
808
809
810
811
812
813
814
815
816
817
818
819
820
821
822
823
824
825
826
827
828
829
830
831
832
833
834
835
836
837
838
839
840
841
842
843
844
845
846
847
848
849
850
851
852
853
854
855
856
857
858
859
860
861
862
863
864
865
866
867
868
869
870
871
872
873
874
875
876
877
878
879
880
881
882
883
884
885
886
887
888
889
890
891
892
893
894
895
896
897
898
899
900
901
902
903
904
905
906
907
908
909
910
911
912
913
914
915
916
917
918
919
920
921
922
923
924
925
926
927
928
929
930
931
932
933
934
935
936
937
938
939
940
941
942
943
944
945
946
947
948
949
950
951
952
953
954
955
956
957
958
959
960
961
962
963
964
965
966
967
968
969
970
971
972
973
974
975
976
977
978
979
980
981
982
983
984
985
986
987
988
989
990
991
992
993
994
995
996
997
998
999
1000
1001
1002
1003
1004
1005
1006
1007
1008
1009
1010
1011
1012
1013
1014
1015
1016
1017
1018
1019
1020
1021
1022
1023
1024
1025
1026
1027
1028
1029
1030
1031
1032
1033
1034
1035
1036
1037
1038
1039
1040
1041
1042
1043
1044
1045
1046
1047
1048
1049
1050
1051
1052
1053
1054
1055
1056
1057
1058
1059
1060
1061
1062
1063
1064
1065
1066
1067
1068
1069
1070
1071
1072
1073
1074
1075
1076
1077
1078
1079
1080
1081
1082
1083
1084
1085
1086
1087
1088
1089
1090
1091
1092
1093
1094
1095
1096
1097
1098
1099
1100
1101
1102
1103
1104
1105
1106
1107
1108
1109
1110
1111
1112
1113
1114
1115
1116
1117
1118
1119
1120
1121
1122
1123
1124
1125
1126
1127
1128
1129
1130
1131
1132
1133
1134
1135
1136
1137
1138
1139
1140
1141
1142
1143
1144
1145
1146
1147
1148
1149
1150
1151
1152
1153
1154
1155
1156
1157
1158
1159
1160
1161
1162
1163
1164
1165
1166
1167
1168
1169
1170
1171
1172
1173
1174
1175
1176
1177
1178
1179
1180
1181
1182
1183
1184
1185
1186
1187
1188
1189
1190
1191
1192
1193
1194
1195
1196
1197
1198
1199
1200
1201
1202
1203
1204
1205
1206
1207
1208
1209
1210
1211
1212
1213
1214
1215
1216
1217
1218
1219
1220
1221
1222
1223
1224
1225
1226
1227
1228
1229
1230
1231
1232
1233
1234
1235
1236
1237
1238
1239
1240
1241
1242
1243
1244
1245
1246
1247
1248
1249
1250
1251
1252
1253
1254
1255
1256
1257
1258
1259
1260
1261
1262
1263
1264
1265
1266
1267
1268
1269
1270
1271
1272
1273
1274
1275
1276
1277
1278
1279
1280
1281
1282
1283
1284
1285
1286
1287
1288
1289
1290
1291
1292
1293
1294
1295
1296
1297
1298
1299
1300
1301
import * as mozilla from 'source-map';
/**
* @param plugins Can also be included with the Processor#use method.
* @returns A processor that will apply plugins as CSS processors.
*/
declare function postcss(plugins?: postcss.AcceptedPlugin[]): postcss.Processor;
declare function postcss(...plugins: postcss.AcceptedPlugin[]): postcss.Processor;
declare namespace postcss {
type AcceptedPlugin = Plugin<any> | Transformer | {
postcss: TransformCallback | Processor;
} | Processor;
/**
* Creates a PostCSS plugin with a standard API.
* @param name Plugin name. Same as in name property in package.json. It will
* be saved in plugin.postcssPlugin property.
* @param initializer Will receive plugin options and should return functions
* to modify nodes in input CSS.
*/
function plugin<T>(name: string, initializer: PluginInitializer<T>): Plugin<T>;
interface Plugin<T> extends Transformer {
(opts?: T): Transformer;
postcss: Transformer;
process: (css: string | {
toString(): string;
} | Result, opts?: any) => LazyResult;
}
interface Transformer extends TransformCallback {
postcssPlugin?: string;
postcssVersion?: string;
}
interface TransformCallback {
/**
* @returns Asynchronous plugins should return a promise.
*/
(root: Root, result?: Result): void | Function | any;
}
interface PluginInitializer<T> {
(pluginOptions?: T): Transformer;
}
/**
* Contains helpers for working with vendor prefixes.
*/
export namespace vendor {
/**
* @returns The vendor prefix extracted from the input string.
*/
function prefix(prop: string): string;
/**
* @returns The input string stripped of its vendor prefix.
*/
function unprefixed(prop: string): string;
}
export class Stringifier {
builder: Stringifier.Builder;
constructor(builder?: Stringifier.Builder);
stringify(node: Node, semicolon?: boolean): void;
root(node: any): void;
comment(node: any): void;
decl(node: any, semicolon: any): void;
rule(node: any): void;
atrule(node: any, semicolon: any): void;
body(node: any): void;
block(node: any, start: any): void;
raw(node: Node, own: string, detect?: string): any;
rawSemicolon(root: any): any;
rawEmptyBody(root: any): any;
rawIndent(root: any): any;
rawBeforeComment(root: any, node: any): any;
rawBeforeDecl(root: any, node: any): any;
rawBeforeRule(root: any): any;
rawBeforeClose(root: any): any;
rawBeforeOpen(root: any): any;
rawColon(root: any): any;
beforeAfter(node: any, detect: any): any;
rawValue(node: any, prop: any): any;
}
export namespace Stringifier {
interface Builder {
(str: string, node?: Node, str2?: string): void;
}
}
/**
* Default function to convert a node tree into a CSS string.
*/
function stringify(node: Node, builder: Stringifier.Builder): void;
/**
* Parses source CSS.
* @param css The CSS to parse.
* @param options
* @returns {} A new Root node, which contains the source CSS nodes.
*/
function parse(css: string | {
toString(): string;
} | LazyResult | Result, options?: {
from?: string;
map?: postcss.SourceMapOptions;
}): Root;
/**
* Contains helpers for safely splitting lists of CSS values, preserving
* parentheses and quotes.
*/
export namespace list {
/**
* Safely splits space-separated values (such as those for background,
* border-radius and other shorthand properties).
*/
function space(str: string): string[];
/**
* Safely splits comma-separated values (such as those for transition-* and
* background properties).
*/
function comma(str: string): string[];
}
/**
* Creates a new Comment node.
* @param defaults Properties for the new Comment node.
* @returns The new node.
*/
function comment(defaults?: CommentNewProps): Comment;
/**
* Creates a new AtRule node.
* @param defaults Properties for the new AtRule node.
* @returns The new node.
*/
function atRule(defaults?: AtRuleNewProps): AtRule;
/**
* Creates a new Declaration node.
* @param defaults Properties for the new Declaration node.
* @returns The new node.
*/
function decl(defaults?: DeclarationNewProps): Declaration;
/**
* Creates a new Rule node.
* @param defaults Properties for the new Rule node.
* @returns The new node.
*/
function rule(defaults?: RuleNewProps): Rule;
/**
* Creates a new Root node.
* @param defaults Properties for the new Root node.
* @returns The new node.
*/
function root(defaults?: object): Root;
interface SourceMapOptions {
/**
* Indicates that the source map should be embedded in the output CSS as a
* Base64-encoded comment. By default, it is true. But if all previous maps
* are external, not inline, PostCSS will not embed the map even if you do
* not set this option.
*
* If you have an inline source map, the result.map property will be empty,
* as the source map will be contained within the text of result.css.
*/
inline?: boolean;
/**
* Source map content from a previous processing step (e.g., Sass compilation).
* PostCSS will try to read the previous source map automatically (based on comments
* within the source CSS), but you can use this option to identify it manually.
* If desired, you can omit the previous map with prev: false.
*/
prev?: any;
/**
* Indicates that PostCSS should set the origin content (e.g., Sass source)
* of the source map. By default, it is true. But if all previous maps do not
* contain sources content, PostCSS will also leave it out even if you do not set
* this option.
*/
sourcesContent?: boolean;
/**
* Indicates that PostCSS should add annotation comments to the CSS. By default,
* PostCSS will always add a comment with a path to the source map. PostCSS will
* not add annotations to CSS files that do not contain any comments.
*
* By default, PostCSS presumes that you want to save the source map as
* opts.to + '.map' and will use this path in the annotation comment. A different
* path can be set by providing a string value for annotation.
*
* If you have set inline: true, annotation cannot be disabled.
*/
annotation?: boolean | string;
/**
* If true, PostCSS will try to correct any syntax errors that it finds in the CSS.
* This is useful for legacy code filled with hacks. Another use-case is interactive
* tools with live input — for example, the Autoprefixer demo.
*/
safe?: boolean;
}
/**
* A Processor instance contains plugins to process CSS. Create one
* Processor instance, initialize its plugins, and then use that instance
* on numerous CSS files.
*/
interface Processor {
/**
* Adds a plugin to be used as a CSS processor. Plugins can also be
* added by passing them as arguments when creating a postcss instance.
*/
use(plugin: AcceptedPlugin): Processor;
/**
* Parses source CSS. Because some plugins can be asynchronous it doesn't
* make any transformations. Transformations will be applied in LazyResult's
* methods.
* @param css Input CSS or any object with toString() method, like a file
* stream. If a Result instance is passed the processor will take the
* existing Root parser from it.
*/
process(css: string | {
toString(): string;
} | Result, options?: ProcessOptions): LazyResult;
/**
* Contains plugins added to this processor.
*/
plugins: Plugin<any>[];
/**
* Contains the current version of PostCSS (e.g., "4.0.5").
*/
version: string;
}
interface ProcessOptions extends Syntax {
/**
* The path of the CSS source file. You should always set from, because it is
* used in source map generation and syntax error messages.
*/
from?: string;
/**
* The path where you'll put the output CSS file. You should always set it
* to generate correct source maps.
*/
to?: string;
syntax?: Syntax;
/**
* Enable Safe Mode, in which PostCSS will try to fix CSS syntax errors.
*/
safe?: boolean;
map?: postcss.SourceMapOptions;
/**
* Function to generate AST by string.
*/
parser?: Parse | Syntax;
/**
* Class to generate string by AST.
*/
stringifier?: Stringify | Syntax;
}
interface Syntax {
/**
* Function to generate AST by string.
*/
parse?: Parse;
/**
* Class to generate string by AST.
*/
stringify?: Stringify;
}
interface Parse {
(css?: string, opts?: postcss.SourceMapOptions): Root;
}
interface Stringify {
(node?: postcss.Node, builder?: any): postcss.Result | void;
}
/**
* A promise proxy for the result of PostCSS transformations.
*/
interface LazyResult {
/**
* Processes input CSS through synchronous and asynchronous plugins.
* @param onRejected Called if any plugin throws an error.
*/
then(onFulfilled: (result: Result) => void, onRejected?: (error: Error) => void): Function | any;
/**
* Processes input CSS through synchronous and asynchronous plugins.
* @param onRejected Called if any plugin throws an error.
*/
catch(onRejected: (error: Error) => void): Function | any;
/**
* Alias for css property.
*/
toString(): string;
/**
* Processes input CSS through synchronous plugins and converts Root to
* CSS string. This property will only work with synchronous plugins. If
* the processor contains any asynchronous plugins it will throw an error.
* In this case, you should use LazyResult#then() instead.
* @returns Result#css.
*/
css: string;
/**
* Alias for css property to use when syntaxes generate non-CSS output.
*/
content: string;
/**
* Processes input CSS through synchronous plugins. This property will
* work only with synchronous plugins. If processor contains any
* asynchronous plugins it will throw an error. You should use
* LazyResult#then() instead.
*/
map: ResultMap;
/**
* Processes input CSS through synchronous plugins. This property will work
* only with synchronous plugins. If processor contains any asynchronous
* plugins it will throw an error. You should use LazyResult#then() instead.
*/
root: Root;
/**
* Processes input CSS through synchronous plugins and calls Result#warnings().
* This property will only work with synchronous plugins. If the processor
* contains any asynchronous plugins it will throw an error. In this case,
* you should use LazyResult#then() instead.
*/
warnings(): ResultMessage[];
/**
* Processes input CSS through synchronous plugins. This property will work
* only with synchronous plugins. If processor contains any asynchronous
* plugins it will throw an error. You should use LazyResult#then() instead.
*/
messages: ResultMessage[];
/**
* @returns A processor used for CSS transformations.
*/
processor: Processor;
/**
* @returns Options from the Processor#process(css, opts) call that produced
* this Result instance.
*/
opts: ResultOptions;
}
/**
* Provides the result of the PostCSS transformations.
*/
interface Result {
/**
* Alias for css property.
*/
toString(): string;
/**
* Creates an instance of Warning and adds it to messages.
* @param message Used in the text property of the message object.
* @param options Properties for Message object.
*/
warn(message: string, options?: WarningOptions): void;
/**
* @returns Warnings from plugins, filtered from messages.
*/
warnings(): ResultMessage[];
/**
* A CSS string representing this Result's Root instance.
*/
css: string;
/**
* Alias for css property to use with syntaxes that generate non-CSS output.
*/
content: string;
/**
* An instance of the SourceMapGenerator class from the source-map library,
* representing changes to the Result's Root instance.
* This property will have a value only if the user does not want an inline
* source map. By default, PostCSS generates inline source maps, written
* directly into the processed CSS. The map property will be empty by default.
* An external source map will be generated — and assigned to map — only if
* the user has set the map.inline option to false, or if PostCSS was passed
* an external input source map.
*/
map: ResultMap;
/**
* Contains the Root node after all transformations.
*/
root?: Root;
/**
* Contains messages from plugins (e.g., warnings or custom messages).
* Add a warning using Result#warn() and get all warnings
* using the Result#warnings() method.
*/
messages: ResultMessage[];
/**
* The Processor instance used for this transformation.
*/
processor?: Processor;
/**
* Options from the Processor#process(css, opts) or Root#toResult(opts) call
* that produced this Result instance.
*/
opts?: ResultOptions;
}
interface ResultOptions extends ProcessOptions {
/**
* The CSS node that was the source of the warning.
*/
node?: postcss.Node;
/**
* Name of plugin that created this warning. Result#warn() will fill it
* automatically with plugin.postcssPlugin value.
*/
plugin?: string;
}
interface ResultMap {
/**
* Add a single mapping from original source line and column to the generated
* source's line and column for this source map being created. The mapping
* object should have the following properties:
* @param mapping
* @returns {}
*/
addMapping(mapping: mozilla.Mapping): void;
/**
* Set the source content for an original source file.
* @param sourceFile The URL of the original source file.
* @param sourceContent The content of the source file.
*/
setSourceContent(sourceFile: string, sourceContent: string): void;
/**
* Applies a SourceMap for a source file to the SourceMap. Each mapping to
* the supplied source file is rewritten using the supplied SourceMap.
* Note: The resolution for the resulting mappings is the minimium of this
* map and the supplied map.
* @param sourceMapConsumer The SourceMap to be applied.
* @param sourceFile The filename of the source file. If omitted, sourceMapConsumer
* file will be used, if it exists. Otherwise an error will be thrown.
* @param sourceMapPath The dirname of the path to the SourceMap to be applied.
* If relative, it is relative to the SourceMap. This parameter is needed when
* the two SourceMaps aren't in the same directory, and the SourceMap to be
* applied contains relative source paths. If so, those relative source paths
* need to be rewritten relative to the SourceMap.
* If omitted, it is assumed that both SourceMaps are in the same directory;
* thus, not needing any rewriting (Supplying '.' has the same effect).
*/
applySourceMap(
sourceMapConsumer: mozilla.SourceMapConsumer,
sourceFile?: string,
sourceMapPath?: string
): void;
/**
* Renders the source map being generated to JSON.
*/
toJSON: () => mozilla.RawSourceMap;
/**
* Renders the source map being generated to a string.
*/
toString: () => string;
}
interface ResultMessage {
type: string;
text?: string;
plugin?: string;
browsers?: string[];
}
/**
* Represents a plugin warning. It can be created using Result#warn().
*/
interface Warning {
/**
* @returns Error position, message.
*/
toString(): string;
/**
* Contains the warning message.
*/
text: string;
/**
* Contains the name of the plugin that created this warning. When you
* call Result#warn(), it will fill this property automatically.
*/
plugin: string;
/**
* The CSS node that caused the warning.
*/
node: Node;
/**
* The line in the input file with this warning's source.
*/
line: number;
/**
* Column in the input file with this warning's source.
*/
column: number;
}
interface WarningOptions extends ResultOptions {
/**
* A word inside a node's string that should be highlighted as source
* of warning.
*/
word?: string;
/**
* The index inside a node's string that should be highlighted as
* source of warning.
*/
index?: number;
}
/**
* The CSS parser throws this error for broken CSS.
*/
interface CssSyntaxError extends InputOrigin {
name: string;
/**
* @returns Error position, message and source code of broken part.
*/
toString(): string;
/**
* @param color Whether arrow should be colored red by terminal color codes.
* By default, PostCSS will use process.stdout.isTTY and
* process.env.NODE_DISABLE_COLORS.
* @returns A few lines of CSS source that caused the error. If CSS has
* input source map without sourceContent this method will return an empty
* string.
*/
showSourceCode(color?: boolean): string;
/**
* Contains full error text in the GNU error format.
*/
message: string;
/**
* Contains only the error description.
*/
reason: string;
/**
* Contains the PostCSS plugin name if the error didn't come from the
* CSS parser.
*/
plugin?: string;
input?: InputOrigin;
}
interface InputOrigin {
/**
* If parser's from option is set, contains the absolute path to the
* broken file. PostCSS will use the input source map to detect the
* original error location. If you wrote a Sass file, then compiled it
* to CSS and parsed it with PostCSS, PostCSS will show the original
* position in the Sass file. If you need the position in the PostCSS
* input (e.g., to debug the previous compiler), use error.input.file.
*/
file?: string;
/**
* Contains the source line of the error. PostCSS will use the input
* source map to detect the original error location. If you wrote a Sass
* file, then compiled it to CSS and parsed it with PostCSS, PostCSS
* will show the original position in the Sass file. If you need the
* position in the PostCSS input (e.g., to debug the previous
* compiler), use error.input.line.
*/
line?: number;
/**
* Contains the source column of the error. PostCSS will use input
* source map to detect the original error location. If you wrote a
* Sass file, then compiled it to CSS and parsed it with PostCSS,
* PostCSS will show the original position in the Sass file. If you
* need the position in the PostCSS input (e.g., to debug the
* previous compiler), use error.input.column.
*/
column?: number;
/**
* Contains the source code of the broken file. PostCSS will use the
* input source map to detect the original error location. If you wrote
* a Sass file, then compiled it to CSS and parsed it with PostCSS,
* PostCSS will show the original position in the Sass file. If you need
* the position in the PostCSS input (e.g., to debug the previous
* compiler), use error.input.source.
*/
source?: string;
}
export class PreviousMap {
private inline;
annotation: string;
root: string;
private consumerCache;
text: string;
file: string;
constructor(css: any, opts: any);
consumer(): mozilla.SourceMapConsumer;
withContent(): boolean;
startWith(string: string, start: string): boolean;
loadAnnotation(css: string): void;
decodeInline(text: string): string;
loadMap(
file: any,
prev: string | Function | mozilla.SourceMapConsumer | mozilla.SourceMapGenerator | mozilla.RawSourceMap
): string;
isMap(map: any): boolean;
}
/**
* Represents the source CSS.
*/
interface Input {
/**
* The absolute path to the CSS source file defined with the "from" option.
*/
file: string;
/**
* The unique ID of the CSS source. Used if "from" option is not provided
* (because PostCSS does not know the file path).
*/
id: string;
/**
* The CSS source identifier. Contains input.file if the user set the
* "from" option, or input.id if they did not.
*/
from: string;
/**
* Represents the input source map passed from a compilation step before
* PostCSS (e.g., from the Sass compiler).
*/
map: PreviousMap;
/**
* Reads the input source map.
* @returns A symbol position in the input source (e.g., in a Sass file
* that was compiled to CSS before being passed to PostCSS):
*/
origin(line: number, column: number): InputOrigin;
}
type ChildNode = AtRule | Rule | Declaration | Comment;
type Node = Root | ChildNode;
interface NodeBase {
/**
* Returns the input source of the node. The property is used in source
* map generation. If you create a node manually
* (e.g., with postcss.decl() ), that node will not have a source
* property and will be absent from the source map. For this reason, the
* plugin developer should consider cloning nodes to create new ones
* (in which case the new node's source will reference the original,
* cloned node) or setting the source property manually.
*/
source: NodeSource;
/**
* Contains information to generate byte-to-byte equal node string as it
* was in origin input.
*/
raws: NodeRaws;
/**
* @returns A CSS string representing the node.
*/
toString(): string;
/**
* This method produces very useful error messages. If present, an input
* source map will be used to get the original position of the source, even
* from a previous compilation step (e.g., from Sass compilation).
* @returns The original position of the node in the source, showing line
* and column numbers and also a small excerpt to facilitate debugging.
*/
error(
/**
* Error description.
*/
message: string, options?: NodeErrorOptions): CssSyntaxError;
/**
* Creates an instance of Warning and adds it to messages. This method is
* provided as a convenience wrapper for Result#warn.
* Note that `opts.node` is automatically passed to Result#warn for you.
* @param result The result that will receive the warning.
* @param text Warning message. It will be used in the `text` property of
* the message object.
* @param opts Properties to assign to the message object.
*/
warn(result: Result, text: string, opts?: WarningOptions): void;
/**
* @returns The next child of the node's parent; or, returns undefined if
* the current node is the last child.
*/
next(): ChildNode | void;
/**
* @returns The previous child of the node's parent; or, returns undefined
* if the current node is the first child.
*/
prev(): ChildNode | void;
/**
* Insert new node before current node to current node’s parent.
*
* Just an alias for `node.parent.insertBefore(node, newNode)`.
*
* @returns this node for method chaining.
*
* @example
* decl.before('content: ""');
*/
before(newNode: Node | object | string | Node[]): this;
/**
* Insert new node after current node to current node’s parent.
*
* Just an alias for `node.parent.insertAfter(node, newNode)`.
*
* @returns this node for method chaining.
*
* @example
* decl.after('color: black');
*/
after(newNode: Node | object | string | Node[]): this;
/**
* @returns The Root instance of the node's tree.
*/
root(): Root;
/**
* Removes the node from its parent and cleans the parent property in the
* node and its children.
* @returns This node for chaining.
*/
remove(): this;
/**
* Inserts node(s) before the current node and removes the current node.
* @returns This node for chaining.
*/
replaceWith(...nodes: (Node | object)[]): this;
/**
* @param overrides New properties to override in the clone.
* @returns A clone of this node. The node and its (cloned) children will
* have a clean parent and code style properties.
*/
clone(overrides?: object): this;
/**
* Shortcut to clone the node and insert the resulting cloned node before
* the current node.
* @param overrides New Properties to override in the clone.
* @returns The cloned node.
*/
cloneBefore(overrides?: object): this;
/**
* Shortcut to clone the node and insert the resulting cloned node after
* the current node.
* @param overrides New Properties to override in the clone.
* @returns The cloned node.
*/
cloneAfter(overrides?: object): this;
/**
* @param prop Name or code style property.
* @param defaultType Name of default value. It can be easily missed if the
* value is the same as prop.
* @returns A code style property value. If the node is missing the code
* style property (because the node was manually built or cloned), PostCSS
* will try to autodetect the code style property by looking at other nodes
* in the tree.
*/
raw(prop: string, defaultType?: string): any;
}
interface NodeNewProps {
source?: NodeSource;
raws?: NodeRaws;
}
interface NodeRaws {
/**
* The space symbols before the node. It also stores `*` and `_`
* symbols before the declaration (IE hack).
*/
before?: string;
/**
* The space symbols after the last child of the node to the end of
* the node.
*/
after?: string;
/**
* The symbols between the property and value for declarations,
* selector and "{" for rules, last parameter and "{" for at-rules.
*/
between?: string;
/**
* True if last child has (optional) semicolon.
*/
semicolon?: boolean;
/**
* The space between the at-rule's name and parameters.
*/
afterName?: string;
/**
* The space symbols between "/*" and comment's text.
*/
left?: string;
/**
* The space symbols between comment's text and "*\/".
*/
right?: string;
/**
* The content of important statement, if it is not just "!important".
*/
important?: string;
}
interface NodeSource {
input: Input;
/**
* The starting position of the node's source.
*/
start?: {
column: number;
line: number;
};
/**
* The ending position of the node's source.
*/
end?: {
column: number;
line: number;
};
}
interface NodeErrorOptions {
/**
* Plugin name that created this error. PostCSS will set it automatically.
*/
plugin?: string;
/**
* A word inside a node's string, that should be highlighted as source
* of error.
*/
word?: string;
/**
* An index inside a node's string that should be highlighted as source
* of error.
*/
index?: number;
}
interface JsonNode {
/**
* Returns a string representing the node's type. Possible values are
* root, atrule, rule, decl or comment.
*/
type?: string;
/**
* Returns the node's parent node.
*/
parent?: JsonContainer;
/**
* Returns the input source of the node. The property is used in source
* map generation. If you create a node manually (e.g., with
* postcss.decl() ), that node will not have a source property and
* will be absent from the source map. For this reason, the plugin
* developer should consider cloning nodes to create new ones (in which
* case the new node's source will reference the original, cloned node)
* or setting the source property manually.
*/
source?: NodeSource;
/**
* Contains information to generate byte-to-byte equal node string as it
* was in origin input.
*/
raws?: NodeRaws;
}
type Container = Root | AtRule | Rule;
/**
* Containers can store any content. If you write a rule inside a rule,
* PostCSS will parse it.
*/
interface ContainerBase extends NodeBase {
/**
* Contains the container's children.
*/
nodes?: ChildNode[];
/**
* @returns The container's first child.
*/
first?: ChildNode;
/**
* @returns The container's last child.
*/
last?: ChildNode;
/**
* @param overrides New properties to override in the clone.
* @returns A clone of this node. The node and its (cloned) children will
* have a clean parent and code style properties.
*/
clone(overrides?: object): this;
/**
* @param child Child of the current container.
* @returns The child's index within the container's "nodes" array.
*/
index(child: ChildNode | number): number;
/**
* Determines whether all child nodes satisfy the specified test.
* @param callback A function that accepts up to three arguments. The
* every method calls the callback function for each node until the
* callback returns false, or until the end of the array.
* @returns True if the callback returns true for all of the container's
* children.
*/
every(callback: (node: ChildNode, index: number, nodes: ChildNode[]) => any, thisArg?: any): boolean;
/**
* Determines whether the specified callback returns true for any child node.
* @param callback A function that accepts up to three arguments. The some
* method calls the callback for each node until the callback returns true,
* or until the end of the array.
* @param thisArg An object to which the this keyword can refer in the
* callback function. If thisArg is omitted, undefined is used as the
* this value.
* @returns True if callback returns true for (at least) one of the
* container's children.
*/
some(callback: (node: ChildNode, index: number, nodes: ChildNode[]) => boolean, thisArg?: any): boolean;
/**
* Iterates through the container's immediate children, calling the
* callback function for each child. If you need to recursively iterate
* through all the container's descendant nodes, use container.walk().
* Unlike the for {} -cycle or Array#forEach() this iterator is safe if
* you are mutating the array of child nodes during iteration.
* @param callback Iterator. Returning false will break iteration. Safe
* if you are mutating the array of child nodes during iteration. PostCSS
* will adjust the current index to match the mutations.
* @returns False if the callback returns false during iteration.
*/
each(callback: (node: ChildNode, index: number) => any): boolean | void;
/**
* Traverses the container's descendant nodes, calling `callback` for each
* node. Like container.each(), this method is safe to use if you are
* mutating arrays during iteration. If you only need to iterate through
* the container's immediate children, use container.each().
* @param callback Iterator.
*/
walk(callback: (node: ChildNode, index: number) => any): boolean | void;
/**
* Traverses the container's descendant nodes, calling `callback` for each
* declaration. Like container.each(), this method is safe to use if you
* are mutating arrays during iteration.
* @param propFilter Filters declarations by property name. Only those
* declarations whose property matches propFilter will be iterated over.
* @param callback Called for each declaration node within the container.
*/
walkDecls(propFilter: string | RegExp, callback?: (decl: Declaration, index: number) => any): boolean | void;
walkDecls(callback: (decl: Declaration, index: number) => any): boolean | void;
/**
* Traverses the container's descendant nodes, calling `callback` for each
* at-rule. Like container.each(), this method is safe to use if you are
* mutating arrays during iteration.
* @param nameFilter Filters at-rules by name. If provided, iteration
* will only happen over at-rules that have matching names.
* @param callback Iterator called for each at-rule node within the
* container.
*/
walkAtRules(nameFilter: string | RegExp, callback: (atRule: AtRule, index: number) => any): boolean | void;
walkAtRules(callback: (atRule: AtRule, index: number) => any): boolean | void;
/**
* Traverses the container's descendant nodes, calling `callback` for each
* rule. Like container.each(), this method is safe to use if you are
* mutating arrays during iteration.
* @param selectorFilter Filters rules by selector. If provided,
* iteration will only happen over rules that have matching names.
* @param callback Iterator called for each rule node within the
* container.
*/
walkRules(selectorFilter: string | RegExp, callback: (atRule: Rule, index: number) => any): boolean | void;
walkRules(callback: (atRule: Rule, index: number) => any): boolean | void;
walkRules(selectorFilter: any, callback?: (atRule: Rule, index: number) => any): boolean | void;
/**
* Traverses the container's descendant nodes, calling `callback` for each
* comment. Like container.each(), this method is safe to use if you are
* mutating arrays during iteration.
* @param callback Iterator called for each comment node within the container.
*/
walkComments(callback: (comment: Comment, indexed: number) => any): void | boolean;
/**
* Passes all declaration values within the container that match pattern
* through the callback, replacing those values with the returned result of
* callback. This method is useful if you are using a custom unit or
* function and need to iterate through all values.
* @param pattern Pattern that we need to replace.
* @param options Options to speed up the search.
* @param callbackOrReplaceValue String to replace pattern or callback
* that will return a new value. The callback will receive the same
* arguments as those passed to a function parameter of String#replace.
*/
replaceValues(pattern: string | RegExp, options: {
/**
* Property names. The method will only search for values that match
* regexp within declarations of listed properties.
*/
props?: string[];
/**
* Used to narrow down values and speed up the regexp search. Searching
* every single value with a regexp can be slow. If you pass a fast
* string, PostCSS will first check whether the value contains the fast
* string; and only if it does will PostCSS check that value against
* regexp. For example, instead of just checking for /\d+rem/ on all
* values, set fast: 'rem' to first check whether a value has the rem
* unit, and only if it does perform the regexp check.
*/
fast?: string;
}, callbackOrReplaceValue: string | {
(substring: string, ...args: any[]): string;
}): this;
replaceValues(pattern: string | RegExp, callbackOrReplaceValue: string | {
(substring: string, ...args: any[]): string;
}): this;
/**
* Inserts new nodes to the beginning of the container.
* Because each node class is identifiable by unique properties, use the
* following shortcuts to create nodes in insert methods:
* root.prepend({ name: '@charset', params: '"UTF-8"' }); // at-rule
* root.prepend({ selector: 'a' }); // rule
* rule.prepend({ prop: 'color', value: 'black' }); // declaration
* rule.prepend({ text: 'Comment' }) // comment
* A string containing the CSS of the new element can also be used. This
* approach is slower than the above shortcuts.
* root.prepend('a {}');
* root.first.prepend('color: black; z-index: 1');
* @param nodes New nodes.
* @returns This container for chaining.
*/
prepend(...nodes: (Node | object | string)[]): this;
/**
* Inserts new nodes to the end of the container.
* Because each node class is identifiable by unique properties, use the
* following shortcuts to create nodes in insert methods:
* root.append({ name: '@charset', params: '"UTF-8"' }); // at-rule
* root.append({ selector: 'a' }); // rule
* rule.append({ prop: 'color', value: 'black' }); // declaration
* rule.append({ text: 'Comment' }) // comment
* A string containing the CSS of the new element can also be used. This
* approach is slower than the above shortcuts.
* root.append('a {}');
* root.first.append('color: black; z-index: 1');
* @param nodes New nodes.
* @returns This container for chaining.
*/
append(...nodes: (Node | object | string)[]): this;
/**
* Insert newNode before oldNode within the container.
* @param oldNode Child or child's index.
* @returns This container for chaining.
*/
insertBefore(oldNode: ChildNode | number, newNode: ChildNode | object | string): this;
/**
* Insert newNode after oldNode within the container.
* @param oldNode Child or child's index.
* @returns This container for chaining.
*/
insertAfter(oldNode: ChildNode | number, newNode: ChildNode | object | string): this;
/**
* Removes the container from its parent and cleans the parent property in the
* container and its children.
* @returns This container for chaining.
*/
remove(): this;
/**
* Removes child from the container and cleans the parent properties
* from the node and its children.
* @param child Child or child's index.
* @returns This container for chaining.
*/
removeChild(child: ChildNode | number): this;
/**
* Removes all children from the container and cleans their parent
* properties.
* @returns This container for chaining.
*/
removeAll(): this;
}
interface ContainerNewProps extends NodeNewProps {
/**
* Contains the container's children.
*/
nodes?: ChildNode[];
raws?: ContainerRaws;
}
interface ContainerRaws extends NodeRaws {
indent?: string;
}
interface JsonContainer extends JsonNode {
/**
* Contains the container's children.
*/
nodes?: ChildNode[];
/**
* @returns The container's first child.
*/
first?: ChildNode;
/**
* @returns The container's last child.
*/
last?: ChildNode;
}
/**
* Represents a CSS file and contains all its parsed nodes.
*/
interface Root extends ContainerBase {
type: 'root';
/**
* Inherited from Container. Should always be undefined for a Root node.
*/
parent: void;
/**
* @param overrides New properties to override in the clone.
* @returns A clone of this node. The node and its (cloned) children will
* have a clean parent and code style properties.
*/
clone(overrides?: object): this;
/**
* @returns A Result instance representing the root's CSS.
*/
toResult(options?: {
/**
* The path where you'll put the output CSS file. You should always
* set "to" to generate correct source maps.
*/
to?: string;
map?: SourceMapOptions;
}): Result;
/**
* Removes child from the root node, and the parent properties of node and
* its children.
* @param child Child or child's index.
* @returns This root node for chaining.
*/
removeChild(child: ChildNode | number): this;
}
interface RootNewProps extends ContainerNewProps {
}
interface JsonRoot extends JsonContainer {
}
/**
* Represents an at-rule. If it's followed in the CSS by a {} block, this
* node will have a nodes property representing its children.
*/
interface AtRule extends ContainerBase {
type: 'atrule';
/**
* Returns the atrule's parent node.
*/
parent: Container;
/**
* The identifier that immediately follows the @.
*/
name: string;
/**
* These are the values that follow the at-rule's name, but precede any {}
* block. The spec refers to this area as the at-rule's "prelude".
*/
params: string;
/**
* @param overrides New properties to override in the clone.
* @returns A clone of this node. The node and its (cloned) children will
* have a clean parent and code style properties.
*/
clone(overrides?: object): this;
}
interface AtRuleNewProps extends ContainerNewProps {
/**
* The identifier that immediately follows the @.
*/
name?: string;
/**
* These are the values that follow the at-rule's name, but precede any {}
* block. The spec refers to this area as the at-rule's "prelude".
*/
params?: string | number;
raws?: AtRuleRaws;
}
interface AtRuleRaws extends NodeRaws {
params?: string;
}
interface JsonAtRule extends JsonContainer {
/**
* The identifier that immediately follows the @.
*/
name?: string;
/**
* These are the values that follow the at-rule's name, but precede any {}
* block. The spec refers to this area as the at-rule's "prelude".
*/
params?: string;
}
/**
* Represents a CSS rule: a selector followed by a declaration block.
*/
interface Rule extends ContainerBase {
type: 'rule';
/**
* Returns the rule's parent node.
*/
parent: Container;
/**
* The rule's full selector. If there are multiple comma-separated selectors,
* the entire group will be included.
*/
selector: string;
/**
* An array containing the rule's individual selectors.
* Groups of selectors are split at commas.
*/
selectors?: string[];
/**
* @param overrides New properties to override in the clone.
* @returns A clone of this node. The node and its (cloned) children will
* have a clean parent and code style properties.
*/
clone(overrides?: object): this;
}
interface RuleNewProps extends ContainerNewProps {
/**
* The rule's full selector. If there are multiple comma-separated selectors,
* the entire group will be included.
*/
selector?: string;
/**
* An array containing the rule's individual selectors. Groups of selectors
* are split at commas.
*/
selectors?: string[];
raws?: RuleRaws;
}
interface RuleRaws extends ContainerRaws {
/**
* The rule's full selector. If there are multiple comma-separated selectors,
* the entire group will be included.
*/
selector?: string;
}
interface JsonRule extends JsonContainer {
/**
* The rule's full selector. If there are multiple comma-separated selectors,
* the entire group will be included.
*/
selector?: string;
/**
* An array containing the rule's individual selectors.
* Groups of selectors are split at commas.
*/
selectors?: string[];
}
/**
* Represents a CSS declaration.
*/
interface Declaration extends NodeBase {
type: 'decl';
/**
* Returns the declaration's parent node.
*/
parent: Container;
/**
* The declaration's property name.
*/
prop: string;
/**
* The declaration's value. This value will be cleaned of comments. If the
* source value contained comments, those comments will be available in the
* _value.raws property. If you have not changed the value, the result of
* decl.toString() will include the original raws value (comments and all).
*/
value: string;
/**
* True if the declaration has an !important annotation.
*/
important: boolean;
/**
* @param overrides New properties to override in the clone.
* @returns A clone of this node. The node and its (cloned) children will
* have a clean parent and code style properties.
*/
clone(overrides?: object): this;
}
interface DeclarationNewProps {
/**
* The declaration's property name.
*/
prop?: string;
/**
* The declaration's value. This value will be cleaned of comments. If the
* source value contained comments, those comments will be available in the
* _value.raws property. If you have not changed the value, the result of
* decl.toString() will include the original raws value (comments and all).
*/
value?: string;
raws?: DeclarationRaws;
}
interface DeclarationRaws extends NodeRaws {
/**
* The declaration's value. This value will be cleaned of comments.
* If the source value contained comments, those comments will be
* available in the _value.raws property. If you have not changed the value, the result of
* decl.toString() will include the original raws value (comments and all).
*/
value?: string;
}
interface JsonDeclaration extends JsonNode {
/**
* True if the declaration has an !important annotation.
*/
important?: boolean;
}
/**
* Represents a comment between declarations or statements (rule and at-rules).
* Comments inside selectors, at-rule parameters, or declaration values will
* be stored in the Node#raws properties.
*/
interface Comment extends NodeBase {
type: 'comment';
/**
* Returns the comment's parent node.
*/
parent: Container;
/**
* The comment's text.
*/
text: string;
/**
* @param overrides New properties to override in the clone.
* @returns A clone of this node. The node and its (cloned) children will
* have a clean parent and code style properties.
*/
clone(overrides?: object): this;
}
interface CommentNewProps {
/**
* The comment's text.
*/
text?: string;
}
interface JsonComment extends JsonNode {
}
}
export = postcss;