@tbela99/css-parser 1.3.4 → 1.4.1

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.
package/CHANGELOG.md CHANGED
@@ -1,5 +1,42 @@
1
1
  # Changelog
2
2
 
3
+ ## v1.4.0
4
+
5
+ ### CSS Module support
6
+
7
+ - [x] scoped name generation
8
+ - composes:
9
+ - [x] compose from local selector
10
+ - [x] compose from other files
11
+ - [x] compose from global selector
12
+ - [x] comma separated compose list
13
+ - [x] :local
14
+ - [x] :global
15
+ - [x] :local()
16
+ - [x] :global()
17
+ - [x] selector
18
+ - [x] dashed ident (custom properties)
19
+ - [x] css at-rule property
20
+ - [x] css at-rule value
21
+ - [x] keyframe animations
22
+ - [x] grid
23
+ - naming
24
+ - [x] ignore
25
+ - [x] camelCase
26
+ - [x] camelCaseOnly
27
+ - [x] dashCase
28
+ - [x] dashCaseOnly
29
+ - default mode
30
+ - [x] global
31
+ - [x] local
32
+ - [x] pure(at least one class or id)
33
+ - icss
34
+ - [x] :import
35
+ - [x] :export
36
+
37
+ ### Bug Fixes
38
+ - [x] fix \<integer\> syntax validation #115
39
+
3
40
  ## v1.3.4
4
41
 
5
42
  - [x] make streaming optional #109
package/README.md CHANGED
@@ -24,21 +24,22 @@ $ deno add @tbela99/css-parser
24
24
 
25
25
  - no dependency
26
26
  - CSS validation based upon mdn-data
27
- - fault-tolerant parser, will try to fix invalid tokens according to the CSS syntax module 3 recommendations.
27
+ - CSS modules support
28
+ - fault-tolerant parser implementing the CSS syntax module 3 recommendations.
28
29
  - fast and efficient minification without unsafe transforms,
29
30
  see [benchmark](https://tbela99.github.io/css-parser/benchmark/index.html)
30
- - minify colors: color(), lab(), lch(), oklab(), oklch(), color-mix(), light-dark(), system colors and
31
+ - colors minification: color(), lab(), lch(), oklab(), oklch(), color-mix(), light-dark(), system colors and
31
32
  relative color
32
- - generate nested css rules
33
- - convert nested css rules to legacy syntax
34
- - convert colors to any supported color format
35
- - generate sourcemap
36
- - compute css shorthands. see supported properties list below
37
- - minify css transform functions
38
- - evaluate math functions: calc(), clamp(), min(), max(), etc.
39
- - inline css variables
40
- - remove duplicate properties
41
- - flatten @import rules
33
+ - color conversion to any supported color format
34
+ - automatic nested css rules generation
35
+ - nested css rules conversion to legacy syntax
36
+ - sourcemap generation
37
+ - css shorthands computation. see the supported properties list below
38
+ - css transform functions minification
39
+ - css math functions evaluation: calc(), clamp(), min(), max(), etc.
40
+ - css variables inlining
41
+ - duplicate properties removal
42
+ - @import rules flattening
42
43
  - experimental CSS prefix removal
43
44
 
44
45
  ## Online documentation
@@ -49,11 +50,11 @@ See the full documentation at the [CSS Parser](https://tbela99.github.io/css-par
49
50
 
50
51
  Try it [online](https://tbela99.github.io/css-parser/playground/)
51
52
 
52
- ## Exports
53
+ ## Import
53
54
 
54
55
  There are several ways to import the library into your application.
55
56
 
56
- ### Node exports
57
+ ### Node
57
58
 
58
59
  import as a module
59
60
 
@@ -64,7 +65,7 @@ import {transform} from '@tbela99/css-parser';
64
65
  // ...
65
66
  ```
66
67
 
67
- ### Deno exports
68
+ ### Deno
68
69
 
69
70
  import as a module
70
71
 
@@ -84,7 +85,7 @@ const {transform} = require('@tbela99/css-parser/cjs');
84
85
  // ...
85
86
  ```
86
87
 
87
- ### Web export
88
+ ### Web
88
89
 
89
90
  Programmatic import
90
91
 
@@ -162,19 +163,27 @@ Javascript umd module from cdn
162
163
  </script>
163
164
  ```
164
165
 
165
- ## Transform
166
-
167
- Parse and render css in a single pass.
166
+ ## Exported functions
168
167
 
169
- ### Usage
168
+ ```ts
170
169
 
171
- ```typescript
170
+ /* parse and render css */
171
+ transform(css: string | ReadableStream<string>, options?: TransformOptions = {}): Promise<TransformResult>
172
+ /* parse css */
173
+ parse(css: string | ReadableStream<string>, options?: ParseOptions = {}): Promise<ParseResult>;
174
+ /* render ast */
175
+ render(ast: AstNode, options?: RenderOptions = {}): RenderResult;
176
+ /* parse and render css file or url */
177
+ transformFile(filePathOrUrl: string, options?: TransformOptions = {}, asStream?: boolean): Promise<TransformResult>;
178
+ /* parse css file or url */
179
+ parseFile(filePathOrUrl: string, options?: ParseOptions = {}, asStream?: boolean): Promise<ParseResult>;
172
180
 
173
- transform(css: string | ReadableStream<string>, transformOptions: TransformOptions = {}): TransformResult
174
- parse(css: string | ReadableStream<string>, parseOptions: ParseOptions = {}): ParseResult;
175
- render(ast: AstNode, renderOptions: RenderOptions = {}): RenderResult;
176
181
  ```
177
182
 
183
+ ## Transform
184
+
185
+ Parse and render css in a single pass.
186
+
178
187
  ### Example
179
188
 
180
189
  ```javascript
@@ -208,7 +217,7 @@ Include ParseOptions and RenderOptions
208
217
  > Minify Options
209
218
 
210
219
  - minify: boolean, optional. default to _true_. optimize ast.
211
- - pass: number, optional. minification pass. default to 1
220
+ - pass: number, optional. minification passes. default to 1
212
221
  - nestingRules: boolean, optional. automatically generated nested rules.
213
222
  - expandNestingRules: boolean, optional. convert nesting rules into separate rules. will automatically set nestingRules
214
223
  to false.
@@ -220,6 +229,10 @@ Include ParseOptions and RenderOptions
220
229
  in the :root {} or html {} rule.
221
230
  - removeEmpty: boolean, optional. remove empty rule lists from the ast.
222
231
 
232
+ > CSS modules Options
233
+
234
+ - module: boolean | ModuleCaseTransformEnum | ModuleScopeEnumOptions | ModuleOptions, optional. css modules options.
235
+
223
236
  > CSS Prefix Removal Options
224
237
 
225
238
  - removePrefix: boolean, optional. remove CSS prefixes.
@@ -895,7 +908,7 @@ for (const {node, parent, root} of walk(ast)) {
895
908
 
896
909
  Ast can be transformed using node visitors
897
910
 
898
- ### Exemple 1: Declaration
911
+ ### Example 1: Declaration
899
912
 
900
913
  the visitor is called for any declaration encountered
901
914
 
@@ -930,7 +943,7 @@ console.debug(result.code);
930
943
  // .foo{transform:scale(calc(40/3))}
931
944
  ```
932
945
 
933
- ### Exemple 2: Declaration
946
+ ### Example 2: Declaration
934
947
 
935
948
  the visitor is called only on 'height' declarations
936
949
 
@@ -985,7 +998,7 @@ console.debug(result.code);
985
998
 
986
999
  ```
987
1000
 
988
- ### Exemple 3: At-Rule
1001
+ ### Example 3: At-Rule
989
1002
 
990
1003
  the visitor is called on any at-rule
991
1004
 
@@ -1027,7 +1040,7 @@ console.debug(result.code);
1027
1040
 
1028
1041
  ```
1029
1042
 
1030
- ### Exemple 4: At-Rule
1043
+ ### Example 4: At-Rule
1031
1044
 
1032
1045
  the visitor is called only for at-rule media
1033
1046
 
@@ -1069,7 +1082,7 @@ console.debug(result.code);
1069
1082
 
1070
1083
  ```
1071
1084
 
1072
- ### Exemple 5: Rule
1085
+ ### Example 5: Rule
1073
1086
 
1074
1087
  the visitor is called on any Rule
1075
1088
 
@@ -1105,7 +1118,7 @@ console.debug(result.code);
1105
1118
 
1106
1119
  ```
1107
1120
 
1108
- ### Exemple 6: Rule
1121
+ ### Example 6: Rule
1109
1122
 
1110
1123
  Adding declarations to any rule
1111
1124
 
@@ -562,6 +562,9 @@ var map = {
562
562
  },
563
563
  animation: {
564
564
  shorthand: "animation",
565
+ separator: {
566
+ typ: "Comma"
567
+ },
565
568
  pattern: "animation-name animation-duration animation-timing-function animation-delay animation-iteration-count animation-direction animation-fill-mode animation-play-state animation-timeline",
566
569
  "default": [
567
570
  "1",