@tbela99/css-parser 1.0.0 → 1.1.1-alpha4

This diff represents the content of publicly available package versions that have been released to one of the supported registries. The information contained in this diff is provided for informational purposes only and reflects changes between package versions as they appear in their respective public registries.
Files changed (87) hide show
  1. package/CHANGELOG.md +269 -0
  2. package/README.md +16 -11
  3. package/dist/index-umd-web.js +3805 -1894
  4. package/dist/index.cjs +3806 -1895
  5. package/dist/index.d.ts +184 -57
  6. package/dist/lib/ast/expand.js +2 -1
  7. package/dist/lib/ast/features/calc.js +12 -1
  8. package/dist/lib/ast/features/inlinecssvariables.js +47 -24
  9. package/dist/lib/ast/features/prefix.js +117 -86
  10. package/dist/lib/ast/features/shorthand.js +29 -6
  11. package/dist/lib/ast/features/transform.js +10 -3
  12. package/dist/lib/ast/features/type.js +7 -0
  13. package/dist/lib/ast/math/expression.js +7 -1
  14. package/dist/lib/ast/math/math.js +6 -0
  15. package/dist/lib/ast/minify.js +165 -77
  16. package/dist/lib/ast/transform/compute.js +1 -0
  17. package/dist/lib/ast/transform/matrix.js +1 -0
  18. package/dist/lib/ast/types.js +26 -15
  19. package/dist/lib/ast/utils/utils.js +104 -0
  20. package/dist/lib/ast/walk.js +33 -7
  21. package/dist/lib/fs/resolve.js +10 -0
  22. package/dist/lib/parser/declaration/list.js +48 -45
  23. package/dist/lib/parser/declaration/map.js +1 -0
  24. package/dist/lib/parser/declaration/set.js +2 -1
  25. package/dist/lib/parser/parse.js +350 -279
  26. package/dist/lib/parser/tokenize.js +147 -72
  27. package/dist/lib/parser/utils/declaration.js +4 -3
  28. package/dist/lib/parser/utils/type.js +2 -1
  29. package/dist/lib/renderer/color/a98rgb.js +2 -1
  30. package/dist/lib/renderer/color/color-mix.js +10 -7
  31. package/dist/lib/renderer/color/color.js +171 -153
  32. package/dist/lib/renderer/color/hex.js +2 -1
  33. package/dist/lib/renderer/color/hsl.js +2 -1
  34. package/dist/lib/renderer/color/hwb.js +2 -1
  35. package/dist/lib/renderer/color/lab.js +2 -1
  36. package/dist/lib/renderer/color/lch.js +2 -1
  37. package/dist/lib/renderer/color/oklab.js +2 -1
  38. package/dist/lib/renderer/color/oklch.js +2 -1
  39. package/dist/lib/renderer/color/p3.js +2 -1
  40. package/dist/lib/renderer/color/rec2020.js +2 -1
  41. package/dist/lib/renderer/color/relativecolor.js +17 -11
  42. package/dist/lib/renderer/color/rgb.js +4 -3
  43. package/dist/lib/renderer/color/srgb.js +18 -17
  44. package/dist/lib/renderer/color/utils/components.js +6 -5
  45. package/dist/lib/renderer/color/utils/constants.js +47 -3
  46. package/dist/lib/renderer/color/xyz.js +2 -1
  47. package/dist/lib/renderer/color/xyzd50.js +2 -1
  48. package/dist/lib/renderer/render.js +48 -20
  49. package/dist/lib/syntax/syntax.js +257 -140
  50. package/dist/lib/validation/at-rules/container.js +75 -97
  51. package/dist/lib/validation/at-rules/counter-style.js +9 -8
  52. package/dist/lib/validation/at-rules/custom-media.js +13 -15
  53. package/dist/lib/validation/at-rules/document.js +22 -27
  54. package/dist/lib/validation/at-rules/font-feature-values.js +8 -8
  55. package/dist/lib/validation/at-rules/import.js +30 -81
  56. package/dist/lib/validation/at-rules/keyframes.js +18 -22
  57. package/dist/lib/validation/at-rules/layer.js +5 -5
  58. package/dist/lib/validation/at-rules/media.js +42 -52
  59. package/dist/lib/validation/at-rules/namespace.js +19 -23
  60. package/dist/lib/validation/at-rules/page-margin-box.js +15 -18
  61. package/dist/lib/validation/at-rules/page.js +8 -7
  62. package/dist/lib/validation/at-rules/supports.js +73 -82
  63. package/dist/lib/validation/at-rules/when.js +32 -36
  64. package/dist/lib/validation/atrule.js +15 -14
  65. package/dist/lib/validation/config.js +24 -1
  66. package/dist/lib/validation/config.json.js +611 -111
  67. package/dist/lib/validation/parser/parse.js +206 -212
  68. package/dist/lib/validation/parser/types.js +1 -1
  69. package/dist/lib/validation/selector.js +3 -3
  70. package/dist/lib/validation/syntax.js +984 -0
  71. package/dist/lib/validation/syntaxes/complex-selector-list.js +10 -11
  72. package/dist/lib/validation/syntaxes/complex-selector.js +10 -11
  73. package/dist/lib/validation/syntaxes/compound-selector.js +40 -50
  74. package/dist/lib/validation/syntaxes/family-name.js +9 -8
  75. package/dist/lib/validation/syntaxes/keyframe-block-list.js +4 -3
  76. package/dist/lib/validation/syntaxes/keyframe-selector.js +15 -18
  77. package/dist/lib/validation/syntaxes/layer-name.js +6 -5
  78. package/dist/lib/validation/syntaxes/relative-selector-list.js +7 -6
  79. package/dist/lib/validation/syntaxes/relative-selector.js +2 -1
  80. package/dist/lib/validation/syntaxes/url.js +18 -22
  81. package/dist/lib/validation/utils/list.js +2 -1
  82. package/dist/lib/validation/utils/whitespace.js +2 -1
  83. package/dist/node/index.js +4 -2
  84. package/dist/node/load.js +5 -0
  85. package/dist/web/index.js +4 -2
  86. package/dist/web/load.js +5 -0
  87. package/package.json +14 -13
package/CHANGELOG.md ADDED
@@ -0,0 +1,269 @@
1
+ # Changelog
2
+
3
+ ## v1.1.1
4
+
5
+ - [x] fix validation issues
6
+
7
+ ## v1.1.0
8
+
9
+ - [x] inline sourcemap
10
+ - [x] CSS validation using mdn-data
11
+ - [x] prefix removal now remove prefixes from all nodes. prefixed linear gradients are not supported
12
+
13
+ # v1.0.0
14
+
15
+ - [x] current color parse error when used in color functions
16
+ - [x] minification : CSS transform module level 2
17
+ - [x] translate
18
+ - [x] scale
19
+ - [x] rotate
20
+ - [x] skew
21
+ - [x] perspective
22
+ - [x] matrix
23
+ - [x] matrix3d
24
+ - [x] keyframes
25
+ - [x] remove consecutive keyframes with the same name
26
+ - [x] reduce keyframe selector 'from' to '0%'
27
+ - [x] reduce keyframe selector '100%' to 'to'
28
+ - [x] remove keyframe selector ignored declarations
29
+ - [x] merge keyframe rules and declarations
30
+ - [x] trim extra space in declaration value 'url() 15%' -> 'url()15%', '1% !important' -> '1%!important'
31
+ - [x] allow empty value for css variable declaration '--color: ;'
32
+ - [x] change generate nesting rule default to true
33
+
34
+ # v0.9.1
35
+
36
+ - [x] minification passes #66
37
+ - [x] nesting selector cannot match pseudo element #67
38
+
39
+ # v0.9.0
40
+
41
+ validation
42
+ - [x] validate invalid pseudo classes
43
+ - [x] rewrite selector validation
44
+ - [x] lenient mode that preserves
45
+ - [x] unknown at-rules
46
+ - [x] unknown declarations
47
+ - [x] unknown pseudo classes
48
+
49
+ media query level 5
50
+ - [x] at-rule custom-media
51
+ - [x] at-rule when-else custom media
52
+ - [x] at-rule charset validation
53
+ - [x] media query error handling
54
+ - [x] at-rule container
55
+ - [ ] expand at-rule custom-media
56
+ - [ ] expand at-rule when-else
57
+
58
+ selector validation
59
+ - [ ] pseudo class arguments validation
60
+ - [ ] pseudo class validation
61
+
62
+ declaration validation
63
+ - [ ] validate declaration
64
+
65
+ error validation
66
+ - [ ] when a parent is marked as invalid node, do not parse or validate descendant nodes
67
+
68
+ # v0.8.0
69
+
70
+ - [x] validate selectors using mdn data
71
+ - [x] at-rules prefix removal
72
+ - [x] at rules validation
73
+ - [x] at-rule prelude
74
+ - [x] at-rule body
75
+ - [x] keyframe validation
76
+ - [ ] :not() does not accept pseudo classes
77
+ - [ ] do not validate declarations in @supports
78
+ - [ ] declarations validation
79
+ - [x] evaluate math functions: calc(), clamp(), min(), max(), round(), mod(), rem(), sin(), cos(), tan(), asin(),
80
+ acos(), atan(), atan2(), pow(), sqrt(), hypot(), log(), exp(), abs(), sign() #49
81
+ - [x] incorrectly parse compound selector #51
82
+
83
+ # v0.7.1
84
+
85
+ - [x] fix nesting rules expansion #45
86
+
87
+ # v0.7.0
88
+
89
+ - [x] fix merging rules
90
+ - [ ] experimental CSS prefix removal
91
+ - [x] declaration name
92
+ - [ ] declaration value
93
+ - [ ] exclude -webkit-* gradients
94
+ - [x] css selector validation
95
+ - [x] pseudo element
96
+ - [x] partial pseudo class validation. does not validate parameters
97
+ - [x] attribute selector
98
+ - [x] combinator
99
+ - [x] simple selector
100
+ - [x] nested selector
101
+ - [x] strict vs permissive validation: allow unknown items such as pseudo classes
102
+ - [x] allow unknown pseudo classes
103
+ - [x] allow unknown attribute selectors
104
+ - [x] strip universal selector when possible
105
+
106
+ # v0.6.0
107
+
108
+ - [x] light-dark() color
109
+ - [x] system color
110
+
111
+ ## V0.5.4
112
+
113
+ - [x] incorrectly expand css nesting rules
114
+
115
+ ## v0.5.3
116
+
117
+ - [x] incorrectly expand css nesting rules
118
+
119
+ ## v0.5.1
120
+
121
+ - [x] failed to flatten @import when using url() syntax
122
+
123
+ ## v0.5.0
124
+
125
+ - [x] render node with parents
126
+ - [x] fix relative color from xyz
127
+ - [x] fix bug when inlineCss is true but no css variable exists
128
+ - [x] compute more shorthands
129
+ - [x] (web) fetch imported css files from external domains using cors
130
+
131
+ ## v0.4.1
132
+
133
+ no code change
134
+
135
+ ## v0.4.0
136
+
137
+ Parsing
138
+
139
+ - [x] allow async node visitors
140
+ - [x] adding declaration parsing helper async parseDeclarations(source: string): Promise<AstDeclarations[]>
141
+
142
+ CSS color level 4 & 5
143
+
144
+ - [x] color space: srgb, srgb-linear, display-p3, prophoto-rgb, a98-rgb, rec2020, xyz, xyz-d50
145
+ - [x] color-mix()
146
+ - [x] color()
147
+ - [x] relative color
148
+ - [x] lab()
149
+ - [x] lch()
150
+ - [x] oklab()
151
+ - [x] oklch()
152
+
153
+ ## v0.3.0
154
+
155
+ ### shorthands
156
+
157
+ - [x] column-rule
158
+ - [x] columns
159
+ - [x] container
160
+ - [x] flex
161
+ - [x] flex-flow
162
+ - [x] gap
163
+
164
+ ### Other
165
+
166
+ - [x] renamed RenderOptions.colorConvert to RenderOptions.convertColor
167
+ - [x] support none keyword in color
168
+ - [x] css relative color syntax for rgb(), hsl() and hwb() colors https://www.w3.org/TR/css-color-5/#relative-colors
169
+ - [x] rgb
170
+ - [x] hex
171
+ - [x] hsl
172
+ - [x] hwb
173
+ - [x] calc()
174
+ - [x] calc() and inline var()
175
+
176
+ ## v0.2.0
177
+
178
+ - [x] cancellable parser promise using abortSignal
179
+ - [x] node visitor (callback) :
180
+ - [x] Declaration visitor
181
+ - [x] selector visitor
182
+ - [x] at-rule visitor
183
+ - [x] support mixing units with calc()
184
+
185
+ ### shorthands
186
+
187
+ - [x] transition
188
+ - [x] list-style
189
+ - [x] text-emphasis
190
+ - [x] animation
191
+
192
+ ### Minification
193
+
194
+ - [x] parsing column combinator
195
+ - [x] css selector level 4 attribute modifiers
196
+ - [x] selector-4 parsing https://www.w3.org/TR/selectors-4/
197
+
198
+ ## v0.1.0
199
+
200
+ - [x] sourcemap generation
201
+ - [x] reduce calc():
202
+ - [x] inline css variables
203
+ - [x] configure duplicate declarations removal
204
+ - [x] configure shorthand properties computation
205
+
206
+ ## v0.0.1
207
+
208
+ ### Minification
209
+
210
+ - [x] merge identical rules
211
+ - [x] merge adjacent rules
212
+ - [x] minify colors
213
+ - [x] minify numbers and Dimensions tokens
214
+ - [x] compute shorthand: see the list below
215
+ - [x] remove redundant declarations
216
+ - [x] simple shorthand properties (padding, margin, etc). must have all required properties
217
+ - [x] complex shorthand properties (background, font, etc.). may have optional properties
218
+ - [x] conditionally unwrap :is()
219
+ - [x] automatic css nesting
220
+ - [x] automatically wrap selectors using :is()
221
+ - [x] multi-level shorthand properties (
222
+ border - [border-width, border-color, border-style, etc.]) https://developer.mozilla.org/en-US/docs/Web/CSS/Shorthand_properties
223
+ - [x] avoid reparsing (declarations, selectors, at-rule)
224
+ - [x] node and browser versions
225
+ - [x] decode and replace utf-8 escape sequence
226
+
227
+ ### Computed shorthands
228
+
229
+ - [x] background
230
+ - [x] border
231
+ - [x] border-bottom
232
+ - [x] border-color
233
+ - [x] border-left
234
+ - [x] border-radius
235
+ - [x] border-right
236
+ - [x] border-style
237
+ - [x] border-top
238
+ - [x] border-width
239
+ - [x] font
240
+ - [x] inset
241
+ - [x] margin
242
+ - [x] outline
243
+ - [x] overflow
244
+ - [x] padding
245
+ - [x] text-decoration
246
+
247
+ ### Performance
248
+
249
+ - [x] flatten @import
250
+
251
+ ### Error handling
252
+
253
+ - [x] parse bad comments / cdo comments
254
+ - [x] parse bad string 1
255
+ - [x] parse bad string 2
256
+ - [x] parse empty declaration
257
+ - [x] parse unclosed rule
258
+ - [x] parse unclosed at-rule
259
+ - [x] parse bad import
260
+
261
+ # Testing
262
+
263
+ - [x] node tests
264
+ - [x] browser tests
265
+
266
+ # Code Coverage
267
+
268
+ - [x] node
269
+ - [x] browser
package/README.md CHANGED
@@ -23,7 +23,7 @@ $ deno add @tbela99/css-parser
23
23
  ## Features
24
24
 
25
25
  - no dependency
26
- - partial css validation based upon mdn-data: at-rules and selectors validation
26
+ - CSS validation based upon mdn-data
27
27
  - fault-tolerant parser, will try to fix invalid tokens according to the CSS syntax module 3 recommendations.
28
28
  - fast and efficient minification without unsafe transforms,
29
29
  see [benchmark](https://tbela99.github.io/css-parser/benchmark/index.html)
@@ -38,6 +38,7 @@ $ deno add @tbela99/css-parser
38
38
  - inline css variables
39
39
  - remove duplicate properties
40
40
  - flatten @import rules
41
+ - experimental CSS prefix removal
41
42
 
42
43
  ## Playground
43
44
 
@@ -95,7 +96,7 @@ Javascript module from cdn
95
96
 
96
97
  <script type="module">
97
98
 
98
- import {transform} from 'https://esm.sh/@tbela99/css-parser@1.0.0/web';
99
+ import {transform} from 'https://esm.sh/@tbela99/css-parser@1.1.0/web';
99
100
 
100
101
 
101
102
  const css = `
@@ -165,11 +166,19 @@ Include ParseOptions and RenderOptions
165
166
  in the :root {} or html {} rule.
166
167
  - removeEmpty: boolean, optional. remove empty rule lists from the ast.
167
168
 
169
+ > CSS Prefix Removal Options
170
+
171
+ - removePrefix: boolean, optional. remove CSS prefixes.
172
+
168
173
  > Validation Options
169
174
 
170
- - validation: boolean, optional. enable strict css validation using (mdn data)[https://github.com/mdn/data]. only the
171
- selector is validated at this time.
172
- - lenient: boolean, optional. ignore unknown at-rules, pseudo-classes and declarations.
175
+ - validation: ValidationLevel | boolean, optional. enable validation. permitted values are:
176
+ - ValidationLevel.None: no validation
177
+ - ValidationLevel.Default: validate selectors and at-rules (default)
178
+ - ValidationLevel.All. validate all nodes
179
+ - true: same as ValidationLevel.All.
180
+ - false: same as ValidationLevel.None
181
+ - lenient: boolean, optional. preserve invalid tokens.
173
182
 
174
183
  > Sourcemap Options
175
184
 
@@ -205,7 +214,7 @@ Include ParseOptions and RenderOptions
205
214
 
206
215
  > Sourcemap Options
207
216
 
208
- - sourcemap: boolean, optional. generate sourcemap
217
+ - sourcemap: boolean | 'inline', optional. generate sourcemap.
209
218
 
210
219
  > Misc Options
211
220
 
@@ -706,7 +715,7 @@ for (const {node, parent, root} of walk(ast)) {
706
715
 
707
716
  ## Minification
708
717
 
709
- - [x] minify keyframs
718
+ - [x] minify keyframes
710
719
  - [x] minify transform
711
720
  - [x] evaluate math functions calc(), clamp(), min(), max(), round(), mod(), rem(), sin(), cos(), tan(), asin(),
712
721
  acos(), atan(), atan2(), pow(), sqrt(), hypot(), log(), exp(), abs(), sign()
@@ -1030,7 +1039,3 @@ console.debug(await transform(css, options));
1030
1039
  // .foo{width:3px}
1031
1040
 
1032
1041
  ```
1033
-
1034
- ---
1035
-
1036
- Thanks to [Jetbrains](https://jetbrains.com) for sponsoring this project with a free license