Merge pull request #117 from tbela99/css-modules

- [x] implement css modules support #116
- [x] fix \<integer\> syntax validation #115

Author: tbela99

.gitignore

@@ -1,5 +1,7 @@
 /errors.txt
 /syntax.txt
+/deno.lock
+/.repl_history
 /ROADMAP.draft.md
 /.idea
 /.DS_Store

CHANGELOG.md

@@ -1,5 +1,42 @@
 # Changelog
 
+## v1.4.0
+
+### CSS Module support
+
+- [x] scoped name generation
+- composes:
+  - [x] compose from local selector
+  - [x] compose from other files
+  - [x] compose from global selector
+  - [x] comma separated compose list
+- [x] :local
+- [x] :global
+- [x] :local()
+- [x] :global()
+- [x] selector
+- [x] dashed ident (custom properties)
+- [x] css at-rule property
+- [x] css at-rule value
+- [x] keyframe animations
+- [x] grid
+- naming
+  - [x] ignore
+  - [x] camelCase
+  - [x] camelCaseOnly
+  - [x] dashCase
+  - [x] dashCaseOnly
+- default mode
+  - [x] global
+  - [x] local
+  - [x] pure(at least one class or id)
+  - icss
+    - [x] :import
+    - [x] :export
+
+### Bug Fixes
+- [x] fix \<integer\> syntax validation #115
+
 ## v1.3.4
 
 - [x] make streaming optional #109

README.md

@@ -24,21 +24,22 @@ $ deno add @tbela99/css-parser
 
 - no dependency
 - CSS validation based upon mdn-data
-- fault-tolerant parser, will try to fix invalid tokens according to the CSS syntax module 3 recommendations.
+- CSS modules support
+- fault-tolerant parser implementing the CSS syntax module 3 recommendations.
 - fast and efficient minification without unsafe transforms,
   see [benchmark](https://tbela99.github.io/css-parser/benchmark/index.html)
-- minify colors: color(), lab(), lch(), oklab(), oklch(), color-mix(), light-dark(), system colors and
+- colors minification: color(), lab(), lch(), oklab(), oklch(), color-mix(), light-dark(), system colors and
   relative color
-- generate nested css rules
-- convert nested css rules to legacy syntax
-- convert colors to any supported color format
-- generate sourcemap
-- compute css shorthands. see supported properties list below
-- minify css transform functions
-- evaluate math functions: calc(), clamp(), min(), max(), etc.
-- inline css variables
-- remove duplicate properties
-- flatten @import rules
+- color conversion to any supported color format
+- automatic nested css rules generation
+- nested css rules conversion to legacy syntax
+- sourcemap generation
+- css shorthands computation. see the supported properties list below
+- css transform functions minification
+- css math functions evaluation: calc(), clamp(), min(), max(), etc.
+- css variables inlining
+- duplicate properties removal
+- @import rules flattening
 - experimental CSS prefix removal
 
 ## Online documentation
@@ -49,11 +50,11 @@ See the full documentation at the [CSS Parser](https://tbela99.github.io/css-par
 
 Try it [online](https://tbela99.github.io/css-parser/playground/)
 
-## Exports
+## Import
 
 There are several ways to import the library into your application.
 
-### Node exports
+### Node
 
 import as a module
 
@@ -64,7 +65,7 @@ import {transform} from '@tbela99/css-parser';
 // ...
 ```
 
-### Deno exports
+### Deno
 
 import as a module
 
@@ -84,7 +85,7 @@ const {transform} = require('@tbela99/css-parser/cjs');
 // ...
 ```
 
-### Web export
+### Web 
 
 Programmatic import
 
@@ -162,19 +163,27 @@ Javascript umd module from cdn
 </script>
 ```
 
-## Transform
-
-Parse and render css in a single pass.
+## Exported functions
 
-### Usage
+```ts
 
-```typescript
+/* parse and render css */
+transform(css: string | ReadableStream<string>, options?: TransformOptions = {}): Promise<TransformResult>
+/* parse css */
+parse(css: string | ReadableStream<string>, options?: ParseOptions = {}): Promise<ParseResult>;
+/* render ast */
+render(ast: AstNode, options?: RenderOptions = {}): RenderResult;
+/* parse and render css file or url */
+transformFile(filePathOrUrl: string, options?: TransformOptions = {}, asStream?: boolean): Promise<TransformResult>;
+/* parse css file or url */
+parseFile(filePathOrUrl: string, options?: ParseOptions = {}, asStream?: boolean): Promise<ParseResult>;
 
-transform(css: string | ReadableStream<string>, transformOptions: TransformOptions = {}): TransformResult
-parse(css: string | ReadableStream<string>, parseOptions: ParseOptions = {}): ParseResult;
-render(ast: AstNode, renderOptions: RenderOptions = {}): RenderResult;
 ```
 
+## Transform
+
+Parse and render css in a single pass.
+
 ### Example
 
 ```javascript
@@ -208,7 +217,7 @@ Include ParseOptions and RenderOptions
 > Minify Options
 
 - minify: boolean, optional. default to _true_. optimize ast.
-- pass: number, optional. minification pass. default to 1
+- pass: number, optional. minification passes. default to 1
 - nestingRules: boolean, optional. automatically generated nested rules.
 - expandNestingRules: boolean, optional. convert nesting rules into separate rules. will automatically set nestingRules
   to false.
@@ -220,6 +229,10 @@ Include ParseOptions and RenderOptions
   in the :root {} or html {} rule.
 - removeEmpty: boolean, optional. remove empty rule lists from the ast.
 
+> CSS modules Options
+
+- module: boolean | ModuleCaseTransformEnum | ModuleScopeEnumOptions | ModuleOptions, optional. css modules options.
+
 > CSS Prefix Removal Options
 
 - removePrefix: boolean, optional. remove CSS prefixes.
@@ -895,7 +908,7 @@ for (const {node, parent, root} of walk(ast)) {
 
 Ast can be transformed using node visitors
 
-### Exemple 1: Declaration
+### Example 1: Declaration
 
 the visitor is called for any declaration encountered
 
@@ -930,7 +943,7 @@ console.debug(result.code);
 // .foo{transform:scale(calc(40/3))}
 ```
 
-### Exemple 2: Declaration
+### Example 2: Declaration
 
 the visitor is called only on 'height' declarations
 
@@ -985,7 +998,7 @@ console.debug(result.code);
 
 ```
 
-### Exemple 3: At-Rule
+### Example 3: At-Rule
 
 the visitor is called on any at-rule
 
@@ -1027,7 +1040,7 @@ console.debug(result.code);
 
 ```
 
-### Exemple 4: At-Rule
+### Example 4: At-Rule
 
 the visitor is called only for at-rule media
 
@@ -1069,7 +1082,7 @@ console.debug(result.code);
 
 ```
 
-### Exemple 5: Rule
+### Example 5: Rule
 
 the visitor is called on any Rule
 
@@ -1105,7 +1118,7 @@ console.debug(result.code);
 
 ```
 
-### Exemple 6: Rule
+### Example 6: Rule
 
 Adding declarations to any rule
 

dist/config.json.js

@@ -562,6 +562,9 @@ var map = {
 	},
 	animation: {
 		shorthand: "animation",
+		separator: {
+			typ: "Comma"
+		},
 		pattern: "animation-name animation-duration animation-timing-function animation-delay animation-iteration-count animation-direction animation-fill-mode animation-play-state animation-timeline",
 		"default": [
 			"1",