@wyw-in-js/transform 0.4.0 → 0.4.1

package/types/plugins/collector.d.ts

@@ -5,12 +5,16 @@
 import type { BabelFile, PluginObj } from '@babel/core';
 import type { ValueCache } from '@wyw-in-js/processor-utils';
 import type { StrictOptions } from '@wyw-in-js/shared';
+import { EventEmitter } from '../utils/EventEmitter';
 import type { Core } from '../babel';
 import type { IPluginState } from '../types';
 export declare const filename: string;
-export declare function collector(file: BabelFile, options: Pick<StrictOptions, 'classNameSlug' | 'displayName' | 'evaluate' | 'tagResolver'>, values: ValueCache): {
+export declare function collector(file: BabelFile, options: Pick<StrictOptions, 'classNameSlug' | 'displayName' | 'evaluate' | 'tagResolver'> & {
+    eventEmitter?: EventEmitter;
+}, values: ValueCache): {
     artifacts: import("@wyw-in-js/shared").Artifact[];
 }[];
 export default function collectorPlugin(babel: Core, options: StrictOptions & {
+    eventEmitter?: EventEmitter;
     values?: ValueCache;
 }): PluginObj<IPluginState>;

package/types/plugins/collector.js

@@ -6,21 +6,16 @@
 Object.defineProperty(exports, "__esModule", { value: true });
 exports.collector = exports.filename = void 0;
 const shared_1 = require("@wyw-in-js/shared");
-const processTemplateExpression_1 = require("../utils/processTemplateExpression");
+const EventEmitter_1 = require("../utils/EventEmitter");
+const getTagProcessor_1 = require("../utils/getTagProcessor");
 const scopeHelpers_1 = require("../utils/scopeHelpers");
 const traversalCache_1 = require("../utils/traversalCache");
 exports.filename = __filename;
 function collector(file, options, values) {
+    const eventEmitter = options.eventEmitter ?? EventEmitter_1.EventEmitter.dummy;
     const processors = [];
-    const identifiers = [];
-    file.path.traverse({
-        Identifier: (p) => {
-            identifiers.push(p);
-        },
-    });
-    // TODO: process transformed literals
-    identifiers.forEach((p) => {
-        (0, processTemplateExpression_1.processTemplateExpression)(p, file.opts, options, (processor) => {
+    eventEmitter.perf('transform:collector:processTemplate', () => {
+        (0, getTagProcessor_1.applyProcessors)(file.path, file.opts, options, (processor) => {
             processor.build(values);
             processor.doRuntimeReplacement();
             processors.push(processor);

package/types/plugins/preeval.d.ts

@@ -7,10 +7,10 @@ import type { StrictOptions } from '@wyw-in-js/shared';
 import type { Core } from '../babel';
 import type { IPluginState } from '../types';
 import { EventEmitter } from '../utils/EventEmitter';
-export type PreevalOptions = Pick<StrictOptions, 'classNameSlug' | 'displayName' | 'evaluate' | 'features'> & {
-    eventEmitter: EventEmitter;
+export type PreevalOptions = Pick<StrictOptions, 'classNameSlug' | 'displayName' | 'evaluate' | 'features' | 'tagResolver'> & {
+    eventEmitter?: EventEmitter;
 };
-export declare function preeval(babel: Core, { eventEmitter, ...options }: PreevalOptions): PluginObj<IPluginState & {
+export declare function preeval(babel: Core, options: PreevalOptions): PluginObj<IPluginState & {
     onFinish: () => void;
 }>;
 export default preeval;

package/types/plugins/preeval.js

@@ -2,14 +2,15 @@
 Object.defineProperty(exports, "__esModule", { value: true });
 exports.preeval = void 0;
 const shared_1 = require("@wyw-in-js/shared");
+const getTagProcessor_1 = require("../utils/getTagProcessor");
 const EventEmitter_1 = require("../utils/EventEmitter");
 const addIdentifierToWywPreval_1 = require("../utils/addIdentifierToWywPreval");
 const getFileIdx_1 = require("../utils/getFileIdx");
-const processTemplateExpression_1 = require("../utils/processTemplateExpression");
 const removeDangerousCode_1 = require("../utils/removeDangerousCode");
 const traversalCache_1 = require("../utils/traversalCache");
-function preeval(babel, { eventEmitter = EventEmitter_1.EventEmitter.dummy, ...options }) {
+function preeval(babel, options) {
     const { types: t } = babel;
+    const eventEmitter = options.eventEmitter ?? EventEmitter_1.EventEmitter.dummy;
     return {
         name: '@wyw-in-js/transform/preeval',
         pre(file) {
@@ -19,18 +20,14 @@ function preeval(babel, { eventEmitter = EventEmitter_1.EventEmitter.dummy, ...o
             const rootScope = file.scope;
             this.processors = [];
             eventEmitter.perf('transform:preeval:processTemplate', () => {
-                file.path.traverse({
-                    Identifier: (p) => {
-                        (0, processTemplateExpression_1.processTemplateExpression)(p, file.opts, options, (processor) => {
-                            processor.dependencies.forEach((dependency) => {
-                                if (dependency.ex.type === 'Identifier') {
-                                    (0, addIdentifierToWywPreval_1.addIdentifierToWywPreval)(rootScope, dependency.ex.name);
-                                }
-                            });
-                            processor.doEvaltimeReplacement();
-                            this.processors.push(processor);
-                        });
-                    },
+                (0, getTagProcessor_1.applyProcessors)(file.path, file.opts, options, (processor) => {
+                    processor.dependencies.forEach((dependency) => {
+                        if (dependency.ex.type === 'Identifier') {
+                            (0, addIdentifierToWywPreval_1.addIdentifierToWywPreval)(rootScope, dependency.ex.name);
+                        }
+                    });
+                    processor.doEvaltimeReplacement();
+                    this.processors.push(processor);
                 });
             });
             if ((0, shared_1.isFeatureEnabled)(options.features, 'dangerousCodeRemover', filename)) {

package/types/utils/getTagProcessor.d.ts

@@ -1,6 +1,13 @@
 import type { NodePath } from '@babel/traverse';
-import type { Identifier } from '@babel/types';
+import type { Program } from '@babel/types';
 import { BaseProcessor } from '@wyw-in-js/processor-utils';
-import type { IFileContext } from '@wyw-in-js/processor-utils';
+import type { IFileContext, TagSource } from '@wyw-in-js/processor-utils';
 import type { StrictOptions } from '@wyw-in-js/shared';
-export declare function getTagProcessor(path: NodePath<Identifier>, fileContext: IFileContext, options: Pick<StrictOptions, 'classNameSlug' | 'displayName' | 'evaluate' | 'tagResolver'>): BaseProcessor | null;
+import type { IImport } from './collectExportsAndImports';
+type DefinedProcessor = [ProcessorClass, TagSource];
+type DefinedProcessors = Map<string, DefinedProcessor>;
+export type ProcessorClass = new (...args: ConstructorParameters<typeof BaseProcessor>) => BaseProcessor;
+export declare function getProcessorForImport({ imported, source }: IImport, filename: string | null | undefined, options: Pick<StrictOptions, 'tagResolver'>): [ProcessorClass | null, TagSource];
+export declare function getDefinedProcessors(imports: IImport[], path: NodePath<Program>, filename: string | null | undefined, options: Pick<StrictOptions, 'tagResolver'>): DefinedProcessors;
+export declare function applyProcessors(path: NodePath<Program>, fileContext: IFileContext, options: Pick<StrictOptions, 'classNameSlug' | 'displayName' | 'evaluate' | 'tagResolver'>, callback: (processor: BaseProcessor) => void): void;
+export {};

package/types/utils/getTagProcessor.js

@@ -1,6 +1,6 @@
 "use strict";
 Object.defineProperty(exports, "__esModule", { value: true });
-exports.getTagProcessor = void 0;
+exports.applyProcessors = exports.getDefinedProcessors = exports.getProcessorForImport = void 0;
 const fs_1 = require("fs");
 const path_1 = require("path");
 const core_1 = require("@babel/core");
@@ -76,52 +76,21 @@ function getProcessorFromFile(processorPath) {
     }
     return Processor;
 }
-function getProcessorForIdentifier(path, imports, filename, options) {
-    const pathBinding = path.scope.getBinding(path.node.name);
-    if (!pathBinding) {
-        // It's not a binding, so it's not a tag
-        return [null, null, null];
-    }
+function getProcessorForImport({ imported, source }, filename, options) {
     const tagResolver = options.tagResolver ?? (() => null);
-    // FIXME: can be simplified
-    const relatedImports = imports
-        .map((i) => {
-        const { local } = i;
-        if (local === path) {
-            return [i, null];
-        }
-        if (!local.isIdentifier()) {
-            if (path.isDescendant(local)) {
-                return [i, local];
-            }
-            return null;
-        }
-        const binding = local.scope.getBinding(local.node.name);
-        if (pathBinding === binding) {
-            return [i, path];
-        }
-        return null;
-    })
-        .filter(isNotNull_1.isNotNull)
-        .filter((i) => i[1] === null || i[1].isExpression());
-    if (relatedImports.length === 0) {
-        return [null, null, null];
-    }
-    const [Processor = null, tagSource = null, tagPath = null] = relatedImports
-        .map(([{ imported, source }, p]) => {
-        const customFile = tagResolver(source, imported);
-        const processor = customFile
-            ? getProcessorFromFile(customFile)
-            : getProcessorFromPackage(source, imported, filename);
-        return [processor, { imported, source }, p];
-    })
-        .find(([proc]) => proc) ?? [];
-    return Processor === null || tagSource === null || tagPath === null
-        ? [null, null, null]
-        : [Processor, tagSource, tagPath];
+    const customFile = tagResolver(source, imported);
+    const processor = customFile
+        ? getProcessorFromFile(customFile)
+        : getProcessorFromPackage(source, imported, filename);
+    return [processor, { imported, source }];
 }
-function getBuilderForIdentifier(path, imports, filename, options) {
-    const [Processor, tagSource, tagPath] = getProcessorForIdentifier(path, imports, filename, options);
+exports.getProcessorForImport = getProcessorForImport;
+function getBuilderForIdentifier(definedProcessor, path, imports, options) {
+    const [Processor, tagSource] = definedProcessor;
+    let tagPath = path;
+    if (tagPath.parentPath?.isMemberExpression({ property: tagPath.node })) {
+        tagPath = tagPath.parentPath;
+    }
     if (!Processor || !tagSource || !tagPath) {
         return null;
     }
@@ -193,11 +162,18 @@ function getBuilderForIdentifier(path, imports, filename, options) {
             }
         });
     };
-    const astService = {
-        ...core_1.types,
+    const importHelpers = {
         addDefaultImport: (importedSource, nameHint) => (0, helper_module_imports_1.addDefault)(path, importedSource, { nameHint }),
         addNamedImport: (name, importedSource, nameHint = name) => (0, helper_module_imports_1.addNamed)(path, name, importedSource, { nameHint }),
     };
+    const astService = new Proxy(core_1.types, {
+        get(target, prop, receiver) {
+            if (prop in importHelpers) {
+                return importHelpers[prop];
+            }
+            return Reflect.get(target, prop, receiver);
+        },
+    });
     return (...args) => new Processor(params, tagSource, astService, tagPath.node.loc ?? null, replacer, ...args);
 }
 function getDisplayName(path, idx, filename) {
@@ -279,13 +255,42 @@ const getNextIndex = (state) => {
     counters.set(state, counter + 1);
     return counter;
 };
-function getTagProcessor(path, fileContext, options) {
-    const cache = (0, traversalCache_1.getTraversalCache)(path, 'getTagProcessor');
+function getDefinedProcessors(imports, path, filename, options) {
+    const cache = (0, traversalCache_1.getTraversalCache)(path, 'getDefinedProcessors');
+    if (!cache.has(path)) {
+        const defined = new Map();
+        imports.forEach((i) => {
+            const [processor, tagSource] = getProcessorForImport(i, filename, options);
+            const { local } = i;
+            if (!processor) {
+                return;
+            }
+            let name = null;
+            if (local.isIdentifier()) {
+                name = local.node.name;
+            }
+            if (name === null && local.isMemberExpression()) {
+                const property = local.get('property');
+                const object = local.get('object');
+                if (property.isIdentifier() && object.isIdentifier()) {
+                    name = `${object.node.name}.${property.node.name}`;
+                }
+            }
+            if (name === null) {
+                return;
+            }
+            defined.set(name, [processor, tagSource]);
+        });
+        cache.set(path, defined);
+    }
+    return cache.get(path);
+}
+exports.getDefinedProcessors = getDefinedProcessors;
+function createProcessorInstance(definedProcessor, imports, path, fileContext, options) {
+    const cache = (0, traversalCache_1.getTraversalCache)(path, 'createProcessorInstance');
     if (!cache.has(path.node)) {
-        const root = path.scope.getProgramParent().path;
-        const { imports } = (0, collectExportsAndImports_1.collectExportsAndImports)(root);
         try {
-            const builder = getBuilderForIdentifier(path, imports.filter(collectExportsAndImports_1.explicitImport), fileContext.filename, options);
+            const builder = getBuilderForIdentifier(definedProcessor, path, imports, options);
             if (builder) {
                 // Increment the index of the style we're processing
                 // This is used for slug generation to prevent collision
@@ -312,4 +317,54 @@ function getTagProcessor(path, fileContext, options) {
     }
     return cache.get(path.node) ?? null;
 }
-exports.getTagProcessor = getTagProcessor;
+function applyProcessors(path, fileContext, options, callback) {
+    const imports = (0, collectExportsAndImports_1.collectExportsAndImports)(path).imports.filter(collectExportsAndImports_1.explicitImport);
+    const definedProcessors = getDefinedProcessors(imports, path, fileContext.filename, options);
+    const usages = [];
+    definedProcessors.forEach((processor, idName) => {
+        if (idName.includes('.')) {
+            // It's a member expression
+            const [object, property] = idName.split('.');
+            const objBinding = path.scope.getBinding(object);
+            if (!objBinding) {
+                return;
+            }
+            objBinding.referencePaths.forEach((p) => {
+                const parent = p.parentPath;
+                if (!parent?.isMemberExpression()) {
+                    return;
+                }
+                const identifier = parent.get('property');
+                if (identifier.isIdentifier({ name: property })) {
+                    usages.push({
+                        identifier,
+                        processor,
+                    });
+                }
+            });
+            return;
+        }
+        path.scope.getBinding(idName)?.referencePaths.forEach((identifier) => {
+            if (identifier.isIdentifier()) {
+                usages.push({
+                    identifier,
+                    processor,
+                });
+            }
+        });
+    });
+    // The same order, the same slugs
+    usages.sort((a, b) => (a.identifier.node.start ?? 0) - (b.identifier.node.start ?? 0));
+    usages.forEach((usage) => {
+        const definedProcessor = usage.processor;
+        if (!definedProcessor) {
+            return;
+        }
+        const instance = createProcessorInstance(definedProcessor, imports, usage.identifier, fileContext, options);
+        if (instance === null) {
+            return;
+        }
+        callback(instance);
+    });
+}
+exports.applyProcessors = applyProcessors;

package/esm/utils/processTemplateExpression.js

@@ -1,11 +0,0 @@
-import { getTagProcessor } from './getTagProcessor';
-const processed = new WeakSet();
-export const processTemplateExpression = (p, fileContext, options, emit) => {
-  if (p.parentPath.isExportSpecifier()) return;
-  if (processed.has(p.node)) return;
-  const tagProcessor = getTagProcessor(p, fileContext, options);
-  processed.add(p.node);
-  if (tagProcessor === null) return;
-  emit(tagProcessor);
-};
-//# sourceMappingURL=processTemplateExpression.js.map

package/esm/utils/processTemplateExpression.js.map

@@ -1 +0,0 @@
-{"version":3,"file":"processTemplateExpression.js","names":["getTagProcessor","processed","WeakSet","processTemplateExpression","p","fileContext","options","emit","parentPath","isExportSpecifier","has","node","tagProcessor","add"],"sources":["../../src/utils/processTemplateExpression.ts"],"sourcesContent":["import type { NodePath } from '@babel/traverse';\nimport type { Identifier } from '@babel/types';\n\nimport type { BaseProcessor, IFileContext } from '@wyw-in-js/processor-utils';\nimport type { StrictOptions } from '@wyw-in-js/shared';\n\nimport { getTagProcessor } from './getTagProcessor';\n\nconst processed = new WeakSet<Identifier>();\n\nexport const processTemplateExpression = (\n  p: NodePath<Identifier>,\n  fileContext: IFileContext,\n  options: Pick<\n    StrictOptions,\n    'classNameSlug' | 'displayName' | 'evaluate' | 'tagResolver'\n  >,\n  emit: (processor: BaseProcessor) => void\n) => {\n  if (p.parentPath.isExportSpecifier()) return;\n  if (processed.has(p.node)) return;\n\n  const tagProcessor = getTagProcessor(p, fileContext, options);\n\n  processed.add(p.node);\n\n  if (tagProcessor === null) return;\n\n  emit(tagProcessor);\n};\n"],"mappings":"AAMA,SAASA,eAAe,QAAQ,mBAAmB;AAEnD,MAAMC,SAAS,GAAG,IAAIC,OAAO,CAAa,CAAC;AAE3C,OAAO,MAAMC,yBAAyB,GAAGA,CACvCC,CAAuB,EACvBC,WAAyB,EACzBC,OAGC,EACDC,IAAwC,KACrC;EACH,IAAIH,CAAC,CAACI,UAAU,CAACC,iBAAiB,CAAC,CAAC,EAAE;EACtC,IAAIR,SAAS,CAACS,GAAG,CAACN,CAAC,CAACO,IAAI,CAAC,EAAE;EAE3B,MAAMC,YAAY,GAAGZ,eAAe,CAACI,CAAC,EAAEC,WAAW,EAAEC,OAAO,CAAC;EAE7DL,SAAS,CAACY,GAAG,CAACT,CAAC,CAACO,IAAI,CAAC;EAErB,IAAIC,YAAY,KAAK,IAAI,EAAE;EAE3BL,IAAI,CAACK,YAAY,CAAC;AACpB,CAAC"}

package/lib/utils/processTemplateExpression.js

@@ -1,18 +0,0 @@
-"use strict";
-
-Object.defineProperty(exports, "__esModule", {
-  value: true
-});
-exports.processTemplateExpression = void 0;
-var _getTagProcessor = require("./getTagProcessor");
-const processed = new WeakSet();
-const processTemplateExpression = (p, fileContext, options, emit) => {
-  if (p.parentPath.isExportSpecifier()) return;
-  if (processed.has(p.node)) return;
-  const tagProcessor = (0, _getTagProcessor.getTagProcessor)(p, fileContext, options);
-  processed.add(p.node);
-  if (tagProcessor === null) return;
-  emit(tagProcessor);
-};
-exports.processTemplateExpression = processTemplateExpression;
-//# sourceMappingURL=processTemplateExpression.js.map

package/lib/utils/processTemplateExpression.js.map

@@ -1 +0,0 @@
-{"version":3,"file":"processTemplateExpression.js","names":["_getTagProcessor","require","processed","WeakSet","processTemplateExpression","p","fileContext","options","emit","parentPath","isExportSpecifier","has","node","tagProcessor","getTagProcessor","add","exports"],"sources":["../../src/utils/processTemplateExpression.ts"],"sourcesContent":["import type { NodePath } from '@babel/traverse';\nimport type { Identifier } from '@babel/types';\n\nimport type { BaseProcessor, IFileContext } from '@wyw-in-js/processor-utils';\nimport type { StrictOptions } from '@wyw-in-js/shared';\n\nimport { getTagProcessor } from './getTagProcessor';\n\nconst processed = new WeakSet<Identifier>();\n\nexport const processTemplateExpression = (\n  p: NodePath<Identifier>,\n  fileContext: IFileContext,\n  options: Pick<\n    StrictOptions,\n    'classNameSlug' | 'displayName' | 'evaluate' | 'tagResolver'\n  >,\n  emit: (processor: BaseProcessor) => void\n) => {\n  if (p.parentPath.isExportSpecifier()) return;\n  if (processed.has(p.node)) return;\n\n  const tagProcessor = getTagProcessor(p, fileContext, options);\n\n  processed.add(p.node);\n\n  if (tagProcessor === null) return;\n\n  emit(tagProcessor);\n};\n"],"mappings":";;;;;;AAMA,IAAAA,gBAAA,GAAAC,OAAA;AAEA,MAAMC,SAAS,GAAG,IAAIC,OAAO,CAAa,CAAC;AAEpC,MAAMC,yBAAyB,GAAGA,CACvCC,CAAuB,EACvBC,WAAyB,EACzBC,OAGC,EACDC,IAAwC,KACrC;EACH,IAAIH,CAAC,CAACI,UAAU,CAACC,iBAAiB,CAAC,CAAC,EAAE;EACtC,IAAIR,SAAS,CAACS,GAAG,CAACN,CAAC,CAACO,IAAI,CAAC,EAAE;EAE3B,MAAMC,YAAY,GAAG,IAAAC,gCAAe,EAACT,CAAC,EAAEC,WAAW,EAAEC,OAAO,CAAC;EAE7DL,SAAS,CAACa,GAAG,CAACV,CAAC,CAACO,IAAI,CAAC;EAErB,IAAIC,YAAY,KAAK,IAAI,EAAE;EAE3BL,IAAI,CAACK,YAAY,CAAC;AACpB,CAAC;AAACG,OAAA,CAAAZ,yBAAA,GAAAA,yBAAA"}

package/types/utils/processTemplateExpression.d.ts

@@ -1,5 +0,0 @@
-import type { NodePath } from '@babel/traverse';
-import type { Identifier } from '@babel/types';
-import type { BaseProcessor, IFileContext } from '@wyw-in-js/processor-utils';
-import type { StrictOptions } from '@wyw-in-js/shared';
-export declare const processTemplateExpression: (p: NodePath<Identifier>, fileContext: IFileContext, options: Pick<StrictOptions, 'classNameSlug' | 'displayName' | 'evaluate' | 'tagResolver'>, emit: (processor: BaseProcessor) => void) => void;

package/types/utils/processTemplateExpression.js

@@ -1,17 +0,0 @@
-"use strict";
-Object.defineProperty(exports, "__esModule", { value: true });
-exports.processTemplateExpression = void 0;
-const getTagProcessor_1 = require("./getTagProcessor");
-const processed = new WeakSet();
-const processTemplateExpression = (p, fileContext, options, emit) => {
-    if (p.parentPath.isExportSpecifier())
-        return;
-    if (processed.has(p.node))
-        return;
-    const tagProcessor = (0, getTagProcessor_1.getTagProcessor)(p, fileContext, options);
-    processed.add(p.node);
-    if (tagProcessor === null)
-        return;
-    emit(tagProcessor);
-};
-exports.processTemplateExpression = processTemplateExpression;