auklet 0.0.4 → 0.0.6

package/README.md

@@ -95,6 +95,24 @@ Each `styles.dependencies` entry may define:
 - `themes`: theme style dependency map.
 - `components`: glob-like component style rules used to infer style imports from source imports.
 
+Component style inference only scans source `.tsx` files. Component imports or
+re-exports in `.ts` files are ignored for CSS auto import, so component barrel
+files that should drive component CSS must be `.tsx`.
+
+Supported value forms include named imports, named re-exports, and local
+re-exports that can be traced back to an import binding:
+
+```tsx
+import { Button } from '@scope/ui';
+export { Card } from '@scope/ui/components/Card';
+
+import { Dialog as BaseDialog } from '@scope/ui';
+export { BaseDialog as Dialog };
+```
+
+`export * from '...'` is intentionally not supported for CSS auto import because
+the exported component names cannot be inferred reliably.
+
 Style configuration should use the grouped `styles` field.
 
 ```ts

package/dist/build/runTsdown.js

@@ -1,5 +1,5 @@
-import { createRequire } from 'node:module';
 import { fileURLToPath } from 'node:url';
+import { createRequire } from 'node:module';
 import { execa } from 'execa';
 const require = createRequire(import.meta.url);
 const tsdownRunFile = require.resolve('tsdown/run');

package/dist/build/tsdownConfig.d.ts

@@ -1,4 +1,3 @@
-import { type UserConfig } from 'tsdown/config';
 import type { AukletConfig, PackageBuildFormat } from '#auklet/types';
 export type TsdownFormat = PackageBuildFormat;
 export declare function defineKernelPackageConfigFromOptions(
@@ -144,5 +143,74 @@ export declare function defineKernelPackageConfigFromFile(
       }
   )[]
 >;
-declare const _default: Promise<UserConfig[]>;
+declare const _default: Promise<
+  (
+    | {
+        entry: {
+          index: string;
+        };
+        format: PackageBuildFormat;
+        globalName: string;
+        outDir: string;
+        dts: boolean;
+        treeshake: true;
+        banner: string;
+        outExtensions: () => {
+          js: string;
+        };
+        outputOptions: {
+          entryFileNames: string;
+          chunkFileNames: string;
+          globals: {
+            [k: string]: string;
+          };
+        };
+        cwd: string;
+        root: string;
+        clean: false;
+        sourcemap: false;
+        tsconfig: string;
+        target: NonNullable<
+          import('#auklet/types').PackageBuildTarget | undefined
+        >;
+        platform: NonNullable<
+          import('#auklet/types').PackageBuildPlatform | undefined
+        >;
+        deps: import('node_modules/tsdown/dist/types-CQaSBA5U.mjs').L;
+        define: {
+          __TEST__: string;
+          __VERSION__: string;
+          __DEV__: string;
+        };
+      }
+    | {
+        entry: Record<string, string>;
+        format: 'cjs' | 'esm';
+        outDir: string;
+        dts: true;
+        unbundle: true;
+        outExtensions: () => {
+          js: string;
+          dts: string;
+        };
+        cwd: string;
+        root: string;
+        clean: false;
+        sourcemap: false;
+        tsconfig: string;
+        target: NonNullable<
+          import('#auklet/types').PackageBuildTarget | undefined
+        >;
+        platform: NonNullable<
+          import('#auklet/types').PackageBuildPlatform | undefined
+        >;
+        deps: import('node_modules/tsdown/dist/types-CQaSBA5U.mjs').L;
+        define: {
+          __TEST__: string;
+          __VERSION__: string;
+          __DEV__: string;
+        };
+      }
+  )[]
+>;
 export default _default;

package/dist/build/tsdownConfig.js

@@ -1,6 +1,5 @@
 import fs from 'node:fs';
 import path from 'node:path';
-import { defineConfig } from 'tsdown/config';
 import { loadAukletConfig } from '#auklet/configLoader';
 import { normalizeAukletConfig } from '#auklet/config';
 const formatMap = {
@@ -263,6 +262,4 @@ export async function defineKernelPackageConfigFromFile(
   const config = await loadAukletConfig(packageRoot, { cacheBust: true });
   return defineKernelPackageConfigFromOptions(packageRoot, config);
 }
-export default defineKernelPackageConfigFromFile(process.cwd()).then((config) =>
-  defineConfig(config),
-);
+export default defineKernelPackageConfigFromFile(process.cwd());

package/dist/css/constants.d.ts

@@ -1,4 +1,5 @@
 export declare const NODE_MODULES_DIR = 'node_modules';
+export declare const SOURCE_COMPONENT_MODULE_RE: RegExp;
 export declare const THEMES_DIR = 'themes';
 export declare const THEMES_ENTRY_PREFIX = 'themes/';
 export declare const STYLE_ENTRY = 'style.css';

package/dist/css/constants.js

@@ -1,4 +1,5 @@
 export const NODE_MODULES_DIR = 'node_modules';
+export const SOURCE_COMPONENT_MODULE_RE = /\.tsx$/;
 export const THEMES_DIR = 'themes';
 export const THEMES_ENTRY_PREFIX = 'themes/';
 export const STYLE_ENTRY = 'style.css';

package/dist/css/core/moduleGraph.js

@@ -7,6 +7,7 @@ import { StyleModuleEntryPlanner } from '#auklet/css/core/styleModuleEntryPlanne
 import {
   EXTERNAL_ENTRY,
   MODULE_ENTRY,
+  SOURCE_COMPONENT_MODULE_RE,
   STYLE_ENTRY,
   THEMES_ENTRY_PREFIX,
 } from '#auklet/css/constants';
@@ -60,7 +61,7 @@ export class ModuleStyleGraph {
       return false;
     }
     if (normalizedFile.endsWith(aukletConfigFile)) return true;
-    if (normalizedFile.endsWith('.ts') || normalizedFile.endsWith('.tsx')) {
+    if (SOURCE_COMPONENT_MODULE_RE.test(normalizedFile)) {
       return true;
     }
     return this.config.styleExtensions.some((extension) =>

package/dist/css/core/{moduleStyleImportCollector.d.ts → styleImports/collector.d.ts}

@@ -16,7 +16,6 @@ export declare class ModuleStyleImportCollector {
     files: Array<string>,
     config: NormalizedAukletConfig,
   ): Map<string, string[]>;
-  private getImportDeclarations;
   private collectSourceImportStyle;
   private resolveSourceImportStyleEntry;
   private resolveSourceImportPath;
@@ -27,5 +26,4 @@ export declare class ModuleStyleImportCollector {
   private getImportPathValues;
   private createStyleSpecifier;
   private createDirectStyleSpecifier;
-  private getImportedNames;
 }

package/dist/css/core/{moduleStyleImportCollector.js → styleImports/collector.js}

@@ -1,15 +1,18 @@
 import fs from 'node:fs';
 import path from 'node:path';
-import ts from 'typescript';
 import { isArray } from 'aidly';
+import { SOURCE_COMPONENT_MODULE_RE } from '#auklet/css/constants';
 import { joinDependencySpecifier } from '#auklet/css/core/style/specifier';
 import {
   appendUniqueMapValue,
   getSourceModuleDir,
-  SOURCE_DECLARATION_RE,
   POSIX_SEPARATOR,
-  SOURCE_MODULE_RE,
 } from '#auklet/utils';
+import {
+  collectModuleStyleSourceReferences,
+  getSourceReferenceImportedNames,
+  isTypeOnlySourceReference,
+} from '#auklet/css/core/styleImports/sourceReference';
 const GLOBSTAR_TOKEN = '**';
 export class ModuleStyleImportCollector {
   srcRoot;
@@ -28,14 +31,14 @@ export class ModuleStyleImportCollector {
     const entries = new Map();
     const rules = this.createAutoImportRules(config);
     for (const file of files) {
-      if (!SOURCE_MODULE_RE.test(file) || SOURCE_DECLARATION_RE.test(file)) {
+      if (!SOURCE_COMPONENT_MODULE_RE.test(file)) {
         continue;
       }
       const sourceRelative = path.relative(this.srcRoot, file);
       const sourceDir = path.dirname(sourceRelative);
       const sourceModuleDir = getSourceModuleDir(sourceRelative);
       const code = fs.readFileSync(file, 'utf8');
-      const imports = this.getImportDeclarations(file, code);
+      const imports = collectModuleStyleSourceReferences(file, code);
       for (const item of imports) {
         this.collectSourceImportStyle(
           entries,
@@ -43,6 +46,7 @@ export class ModuleStyleImportCollector {
           sourceModuleDir,
           item,
         );
+        if (isTypeOnlySourceReference(item)) continue;
         const importPath = item.importPath;
         const ruleMatches = this.matchAutoImportRules(rules, importPath);
         if (!ruleMatches.length) continue;
@@ -63,7 +67,7 @@ export class ModuleStyleImportCollector {
           continue;
         }
         for (const ruleMatch of ruleMatches) {
-          const importedNames = this.getImportedNames(file, item);
+          const importedNames = getSourceReferenceImportedNames(file, item);
           for (const importedName of importedNames) {
             const specifier = this.createStyleSpecifier(
               ruleMatch.rule,
@@ -81,31 +85,8 @@ export class ModuleStyleImportCollector {
     }
     return entries;
   }
-  getImportDeclarations(file, code) {
-    const imports = [];
-    const sourceFile = ts.createSourceFile(
-      file,
-      code,
-      ts.ScriptTarget.Latest,
-      false,
-      file.endsWith('.tsx') ? ts.ScriptKind.TSX : ts.ScriptKind.TS,
-    );
-    sourceFile.forEachChild((node) => {
-      if (
-        !ts.isImportDeclaration(node) ||
-        !ts.isStringLiteral(node.moduleSpecifier)
-      ) {
-        return;
-      }
-      imports.push({
-        importPath: node.moduleSpecifier.text,
-        importClause: node.importClause,
-      });
-    });
-    return imports;
-  }
   collectSourceImportStyle(entries, sourceDir, sourceModuleDir, item) {
-    if (item.importClause?.isTypeOnly) return;
+    if (isTypeOnlySourceReference(item)) return;
     const importedStyleEntry = this.resolveSourceImportStyleEntry(
       sourceDir,
       item.importPath,
@@ -238,30 +219,4 @@ export class ModuleStyleImportCollector {
     }
     return `${importPath}${suffix}`;
   }
-  getImportedNames(file, item) {
-    const importClause = item.importClause;
-    if (!importClause || importClause.isTypeOnly) {
-      return [];
-    }
-    const names = [];
-    if (importClause.name) {
-      names.push(importClause.name.text);
-    }
-    const namedBindings = importClause.namedBindings;
-    if (!namedBindings) {
-      return names;
-    }
-    if (ts.isNamespaceImport(namedBindings)) {
-      throw new Error(
-        `Namespace import is not supported for CSS auto import: ${item.importPath}\n` +
-          `Use named imports instead, for example: import { Component } from '${item.importPath}'.\n` +
-          `File: ${file}`,
-      );
-    }
-    for (const element of namedBindings.elements) {
-      if (element.isTypeOnly) continue;
-      names.push((element.propertyName ?? element.name).text);
-    }
-    return names;
-  }
 }

package/dist/css/core/styleImports/sourceReference.d.ts

@@ -0,0 +1,19 @@
+import ts from 'typescript';
+export type ModuleStyleSourceReference = {
+  importPath: string;
+  importClause?: ts.ImportClause;
+  importedNames?: Array<string>;
+  isTypeOnly?: boolean;
+  hasNamespaceImport?: boolean;
+};
+export declare function collectModuleStyleSourceReferences(
+  file: string,
+  code: string,
+): ModuleStyleSourceReference[];
+export declare function isTypeOnlySourceReference(
+  item: ModuleStyleSourceReference,
+): boolean | undefined;
+export declare function getSourceReferenceImportedNames(
+  file: string,
+  item: ModuleStyleSourceReference,
+): string[];

package/dist/css/core/styleImports/sourceReference.js

@@ -0,0 +1,193 @@
+import ts from 'typescript';
+export function collectModuleStyleSourceReferences(file, code) {
+  const imports = [];
+  const importBindings = new Map();
+  const localDeclarations = new Set();
+  const sourceFile = ts.createSourceFile(
+    file,
+    code,
+    ts.ScriptTarget.Latest,
+    false,
+    file.endsWith('.tsx') ? ts.ScriptKind.TSX : ts.ScriptKind.TS,
+  );
+  sourceFile.forEachChild((node) => {
+    collectLocalDeclarationNames(node, localDeclarations);
+    if (ts.isImportDeclaration(node)) {
+      collectImportBindings(node, importBindings);
+    }
+  });
+  sourceFile.forEachChild((node) => {
+    if (ts.isImportDeclaration(node)) {
+      if (!ts.isStringLiteral(node.moduleSpecifier)) {
+        return;
+      }
+      imports.push({
+        importPath: node.moduleSpecifier.text,
+        importClause: node.importClause,
+      });
+      return;
+    }
+    if (ts.isExportDeclaration(node)) {
+      collectExportDeclaration(
+        file,
+        node,
+        imports,
+        importBindings,
+        localDeclarations,
+      );
+    }
+  });
+  return imports;
+}
+export function isTypeOnlySourceReference(item) {
+  return isTypeOnlyImportClause(item.importClause) || item.isTypeOnly;
+}
+export function getSourceReferenceImportedNames(file, item) {
+  if (item.importedNames) {
+    if (item.isTypeOnly) return [];
+    if (item.hasNamespaceImport) {
+      throw createNamespaceImportError(file, item.importPath);
+    }
+    return item.importedNames;
+  }
+  const importClause = item.importClause;
+  if (!importClause || isTypeOnlyImportClause(importClause)) {
+    return [];
+  }
+  const names = [];
+  if (importClause.name) {
+    names.push(importClause.name.text);
+  }
+  const namedBindings = importClause.namedBindings;
+  if (!namedBindings) {
+    return names;
+  }
+  if (ts.isNamespaceImport(namedBindings)) {
+    throw createNamespaceImportError(file, item.importPath);
+  }
+  for (const element of namedBindings.elements) {
+    if (element.isTypeOnly) continue;
+    names.push((element.propertyName ?? element.name).text);
+  }
+  return names;
+}
+const collectLocalDeclarationNames = (node, localDeclarations) => {
+  if (
+    (ts.isFunctionDeclaration(node) ||
+      ts.isClassDeclaration(node) ||
+      ts.isInterfaceDeclaration(node) ||
+      ts.isTypeAliasDeclaration(node) ||
+      ts.isEnumDeclaration(node)) &&
+    node.name
+  ) {
+    localDeclarations.add(node.name.text);
+    return;
+  }
+  if (!ts.isVariableStatement(node)) return;
+  for (const declaration of node.declarationList.declarations) {
+    if (ts.isIdentifier(declaration.name)) {
+      localDeclarations.add(declaration.name.text);
+    }
+  }
+};
+const collectImportBindings = (node, importBindings) => {
+  if (!ts.isStringLiteral(node.moduleSpecifier) || !node.importClause) {
+    return;
+  }
+  const importPath = node.moduleSpecifier.text;
+  const isTypeOnly = isTypeOnlyImportClause(node.importClause);
+  if (node.importClause.name) {
+    const importedName = node.importClause.name.text;
+    importBindings.set(importedName, {
+      importPath,
+      importedName,
+      isTypeOnly,
+      hasNamespaceImport: false,
+    });
+  }
+  const namedBindings = node.importClause.namedBindings;
+  if (!namedBindings) return;
+  if (ts.isNamespaceImport(namedBindings)) {
+    importBindings.set(namedBindings.name.text, {
+      importPath,
+      importedName: namedBindings.name.text,
+      isTypeOnly,
+      hasNamespaceImport: true,
+    });
+    return;
+  }
+  for (const element of namedBindings.elements) {
+    const importedName = (element.propertyName ?? element.name).text;
+    importBindings.set(element.name.text, {
+      importPath,
+      importedName,
+      isTypeOnly: isTypeOnly || element.isTypeOnly,
+      hasNamespaceImport: false,
+    });
+  }
+};
+const collectExportDeclaration = (
+  file,
+  node,
+  imports,
+  importBindings,
+  localDeclarations,
+) => {
+  if (node.moduleSpecifier) {
+    if (!ts.isStringLiteral(node.moduleSpecifier)) return;
+    if (!node.exportClause || !ts.isNamedExports(node.exportClause)) {
+      throw new Error(
+        `[auklet:css] Export-all declarations are not supported for CSS auto import: ${node.moduleSpecifier.text}\n` +
+          `Use named exports instead, for example: export { Component } from '${node.moduleSpecifier.text}'.\n` +
+          `File: ${file}`,
+      );
+    }
+    imports.push({
+      importPath: node.moduleSpecifier.text,
+      importedNames: getExportedNames(node),
+      isTypeOnly: node.isTypeOnly,
+    });
+    return;
+  }
+  if (!node.exportClause || !ts.isNamedExports(node.exportClause)) {
+    return;
+  }
+  for (const element of node.exportClause.elements) {
+    if (node.isTypeOnly || element.isTypeOnly) continue;
+    const localName = (element.propertyName ?? element.name).text;
+    const binding = importBindings.get(localName);
+    if (binding) {
+      imports.push({
+        importPath: binding.importPath,
+        importedNames: [binding.importedName],
+        isTypeOnly: binding.isTypeOnly,
+        hasNamespaceImport: binding.hasNamespaceImport,
+      });
+      continue;
+    }
+    if (!localDeclarations.has(localName)) {
+      throw new Error(
+        `[auklet:css] Unable to resolve exported symbol "${localName}" for CSS auto import.\n` +
+          `File: ${file}`,
+      );
+    }
+  }
+};
+const getExportedNames = (node) => {
+  if (!node.exportClause || !ts.isNamedExports(node.exportClause)) {
+    return [];
+  }
+  return node.exportClause.elements
+    .filter((element) => !element.isTypeOnly)
+    .map((element) => (element.propertyName ?? element.name).text);
+};
+const isTypeOnlyImportClause = (importClause) => {
+  return importClause?.phaseModifier === ts.SyntaxKind.TypeKeyword;
+};
+const createNamespaceImportError = (file, importPath) => {
+  return new Error(
+    `Namespace import is not supported for CSS auto import: ${importPath}\n` +
+      `Use named imports instead, for example: import { Component } from '${importPath}'.\n` +
+      `File: ${file}`,
+  );
+};

package/dist/css/core/styleModuleEntryPlanner.js

@@ -1,4 +1,5 @@
 import path from 'node:path';
+import { SOURCE_COMPONENT_MODULE_RE } from '#auklet/css/constants';
 import { groupStyleFilesByDir } from '#auklet/css/core/style/files';
 import { getSourceModuleDir, toPosixPath } from '#auklet/utils';
 export class StyleModuleEntryPlanner {
@@ -39,7 +40,7 @@ export class StyleModuleEntryPlanner {
   }
   getSourceModuleDirs() {
     return this.packageContext.sourceFiles
-      .filter((sourceFile) => sourceFile.endsWith('.tsx'))
+      .filter((sourceFile) => SOURCE_COMPONENT_MODULE_RE.test(sourceFile))
       .map((sourceFile) => {
         return getSourceModuleDir(
           path.relative(this.packageContext.sourceRoot, sourceFile),

package/dist/css/core/stylePackageContext.d.ts

@@ -1,4 +1,4 @@
-import { ModuleStyleImportCollector } from '#auklet/css/core/moduleStyleImportCollector';
+import { ModuleStyleImportCollector } from '#auklet/css/core/styleImports/collector';
 import { StyleProcessor } from '#auklet/css/core/styleProcessor';
 import { WorkspaceStyleResolver } from '#auklet/css/core/workspaceStyleResolver';
 import type {

package/dist/css/core/stylePackageContext.js

@@ -1,6 +1,6 @@
 import fs from 'node:fs';
 import path from 'node:path';
-import { ModuleStyleImportCollector } from '#auklet/css/core/moduleStyleImportCollector';
+import { ModuleStyleImportCollector } from '#auklet/css/core/styleImports/collector';
 import { StyleProcessor } from '#auklet/css/core/styleProcessor';
 import { WorkspaceStyleResolver } from '#auklet/css/core/workspaceStyleResolver';
 import {

package/dist/css/watch/watcher.d.ts

@@ -18,5 +18,6 @@ export declare class ModuleStyleWatcher {
   private rebuild;
   private refreshWatcher;
   private scheduleBuild;
+  private shouldRebuildForFile;
   close(): Promise<void>;
 }

package/dist/css/watch/watcher.js

@@ -3,6 +3,7 @@ import path from 'node:path';
 import chokidar from 'chokidar';
 import { aukletConfigFile, aukletDefaultOptions } from '#auklet/config';
 import { moduleStyleBuildConfig } from '#auklet/css/config';
+import { SOURCE_COMPONENT_MODULE_RE } from '#auklet/css/constants';
 import { ModuleStyleBuilder } from '#auklet/css/production/builder';
 export class ModuleStyleWatcher {
   config;
@@ -59,7 +60,10 @@ export class ModuleStyleWatcher {
       interval: 300,
       usePolling: true,
     });
-    this.watcher.on('all', () => {
+    this.watcher.on('all', (_event, file) => {
+      if (typeof file === 'string' && !this.shouldRebuildForFile(file)) {
+        return;
+      }
       this.scheduleBuild();
     });
     this.watcher.on('error', (error) => {
@@ -75,6 +79,11 @@ export class ModuleStyleWatcher {
       });
     }, 80);
   }
+  shouldRebuildForFile(file) {
+    if (path.basename(file) === aukletConfigFile) return true;
+    if (SOURCE_COMPONENT_MODULE_RE.test(file)) return true;
+    return this.config.styleExtensions.includes(path.extname(file));
+  }
   async close() {
     if (this.timer) clearTimeout(this.timer);
     await this.watcher?.close();

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "auklet",
-  "version": "0.0.4",
+  "version": "0.0.6",
   "type": "module",
   "author": "chentao.arthur",
   "packageManager": "pnpm@10.27.0",