start css modules implementation #116

Author: tbela99

CHANGELOG.md

@@ -1,9 +1,32 @@
 # Changelog
 
-## v1.3.4
+## v1.3.5
 
 - [x] fix \<integer\> syntax validation #115
 
+### CSS Module 
+
+- [x] scoped name generation
+- [ ] @values
+- [ ] :import
+- [ ] composes: https://github.com/css-modules/css-modules/blob/master/docs/composition.md
+ - [ ] compose from local selector
+ - [ ] compose from other files
+ - [ ] compose from global selector
+- [x] :local
+- [x] :global
+- [x] :local()
+- [x] :global()
+- [x] selector
+- [ ] keyframe
+- [x] grid-template-areas
+- [x] dashed ident
+- [ ] animations
+- [ ] pure
+- [ ] default mode
+ - [ ] global
+ - [ ] local
+
 ## v1.3.4
 
 - [x] make streaming optional #109

src/@types/index.d.ts

@@ -286,6 +286,64 @@ export declare interface ParserOptions extends MinifyOptions, MinifyFeatureOptio
  * @private
  */
  cache?: WeakMap<AstNode, string>;
+
+ /**
+ * module options
+ */
+ module?: {
+
+
+ /**
+ * use global scope
+ */
+ globalScope?: boolean;
+
+ /**
+ * module output file path
+ */
+ filePath?: string;
+
+ /**
+ * module hash length
+ */
+ hashLength?: number;
+
+ /**
+ * scoped name pattern. the supported placeholders are:
+ * - name: the file base name without the extension
+ * - hash: the file path hash
+ * - local: the local name
+ * - path: the file path
+ * - folder: the file folder
+ * - ext: the file extension
+ *
+ * pattern can optionally have a maximum number of characters: `pattern: '[name:2]-[hash:5]'`.
+ * the hash pattern can take an algorithm and a maximum number of characters: `pattern: 'name-[hash:base64:5]'` or `pattern: 'name-[hash:5]'`.
+ * supported hash algorithms are:
+ * - base64
+ * - hex
+ * - base64url
+ * - sha1
+ * - sha256
+ * - sha384
+ * - sha512
+ */
+ pattern?: string;
+
+ /**
+ * optional custom function to generate scoped name
+ * @param localName
+ * @param filePath
+ * @param hashLength
+ * @param pattern see {@link ParserOptions.module.pattern}
+ */
+ generateScopedName?: (
+ localName: string,
+ filePath: string,
+ hashLength?: number,
+ pattern?: string
+ ) => string;
+ }
 }
 
 /**
@@ -462,13 +520,17 @@ export declare interface ParseResultStats {
  */
  importedBytesIn: number;
  /**
- * parse time
+ * parse processing time
  */
  parse: string;
  /**
- * minify time
+ * minify processing time
  */
  minify: string;
+ /**
+ * module processing time
+ */
+ module?: string;
  /**
  * total time
  */
@@ -493,6 +555,37 @@ export declare interface ParseResultStats {
  * parse result object
  */
 export declare interface ParseResult {
+ /**
+ * parsed ast tree
+ */
+ ast: AstStyleSheet;
+ /**
+ * parse errors
+ */
+ errors: ErrorDescription[];
+ /**
+ * parse stats
+ */
+ stats: ParseResultStats;
+
+ /**
+ * module mapping
+ */
+ mapping?: Record<string, string>;
+
+}
+
+export declare interface ParseModuleResult {
+
+ /**
+ * module mapping
+ */
+ mapping: Record<string, string>;
+ /**
+ * module code
+ */
+ code: string;
+
  /**
  * parsed ast tree
  */

src/@types/walker.d.ts

@@ -20,7 +20,7 @@ export declare type WalkerFilter = (node: AstNode) => WalkerOption;
 /**
  * filter nod
  */
-export declare type WalkerValueFilter = (node: AstNode | Token, parent?: AstNode | Token | null, event?: WalkerEvent) => WalkerOption | null;
+export declare type WalkerValueFilter = (node: AstNode | Token, parent?: AstNode | Token | AstNode[] | Token[] | null, event?: WalkerEvent) => WalkerOption | null;
 
 export declare interface WalkResult {
  node: AstNode;

src/lib/ast/walk.ts

@@ -277,9 +277,18 @@ export function* walkValues(values: Token[], root: AstNode | Token | null = null
  }
 
  // @ts-ignore
- if (option != null && typeof option == 'object' && 'typ' in option) {
+ if (option != null && typeof option == 'object' && ('typ' in option || Array.isArray(option))) {
+
+ const op = Array.isArray(option) ? option : [option];
+
+ for (const o of op) {
+
+ map.set(o as Token, map.get(value) ?? root as FunctionToken | ParensToken);
+ }
+
+ stack[reverse ? 'push' : 'unshift'](...op);
+ console.error({op, s: stack[0]});
 
- map.set(option as Token, map.get(value) ?? root as FunctionToken | ParensToken);
  }
  }
  }
@@ -360,9 +369,16 @@ export function* walkValues(values: Token[], root: AstNode | Token | null = null
  option = filter.fn(value, <FunctionToken | ParensToken>map.get(value), WalkerEvent.Leave);
 
  // @ts-ignore
- if (option != null && 'typ' in option) {
+ if (option != null && ('typ' in option || Array.isArray(option))) {
+
+ const op = Array.isArray(option) ? option : [option];
+
+ for (const o of op) {
+
+ map.set(o as Token, map.get(value) ?? root as FunctionToken | ParensToken);
+ }
 
- map.set(option as Token, map.get(value) ?? root as FunctionToken | ParensToken);
+ stack[reverse ? 'push' : 'unshift'](...op);
  }
  }
  }